@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Work+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --color-ink:#23363f;
  --color-paper:#f6f9fa;
  --color-accent-orange:#ff9413;
  --color-accent-blue:#4d90ef;
  --color-accent-teal:#2bc2b4;
  --color-accent-purple:#c097f8;
  --neutral-0:#ffffff;
  --neutral-50:oklch(0.98 0.004 70);
  --neutral-100:oklch(0.955 0.006 70);
  --neutral-200:oklch(0.9 0.008 70);
  --neutral-300:oklch(0.82 0.01 70);
  --neutral-400:oklch(0.68 0.012 70);
  --neutral-500:oklch(0.55 0.012 70);
  --neutral-600:oklch(0.44 0.012 70);
  --neutral-700:oklch(0.34 0.012 65);
  --neutral-800:oklch(0.26 0.014 60);
  --neutral-900:oklch(0.18 0.014 55);
  --surface-page:var(--color-paper);
  --surface-card:var(--neutral-0);
  --surface-sunken:var(--neutral-100);
  --border-subtle:var(--neutral-200);
  --border-default:var(--neutral-300);
  --text-primary:var(--color-ink);
  --text-secondary:var(--neutral-600);
  --text-muted:var(--neutral-500);
  --text-on-dark-muted:var(--neutral-300);

  /* Accent — change these four lines to switch the site accent colour */
  --accent:#ff9413;
  --accent-text:#9a5400;

  --font-display:'Space Grotesk',sans-serif;
  --font-body:'Work Sans',sans-serif;
  --text-xs:0.75rem;
  --text-sm:0.875rem;
  --text-base:1rem;
  --text-lg:1.125rem;
  --text-xl:1.25rem;
  --text-2xl:1.5rem;
  --text-3xl:1.875rem;

  --radius-sm:4px;
  --radius-md:10px;

  --shadow-sm:0 1px 2px rgba(35,54,63,0.08);
  --shadow-md:0 2px 8px rgba(35,54,63,0.1);
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{margin:0;background:var(--color-paper);color:var(--color-ink);font-family:var(--font-body);}
a{color:var(--color-ink);text-decoration:none;}
h1,h2,h3{margin:0;font-family:var(--font-display);letter-spacing:-0.02em;}
p{margin:0;}
img{max-width:100%;}
table{border-collapse:collapse;}
.wrap{max-width:1160px;margin:0 auto;padding-left:32px;padding-right:32px;}
.narrow{max-width:780px;margin:0 auto;padding-left:32px;padding-right:32px;}
@media (max-width:640px){
  .wrap,.narrow{padding-left:20px;padding-right:20px;}
}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:40;background:rgba(246,249,250,0.94);border-bottom:1px solid var(--border-subtle);}
.site-header .wrap{display:flex;align-items:center;gap:32px;padding-top:14px;padding-bottom:14px;}
.brand{display:flex;align-items:center;flex-shrink:0;}
.brand img{height:34px;width:auto;display:block;}
.main-nav{display:flex;align-items:center;gap:4px;margin-left:4px;}
.nav-link{display:flex;align-items:center;gap:6px;padding:8px 12px;font-size:var(--text-base);font-weight:500;border-radius:var(--radius-sm);}
.nav-link:hover{background:var(--neutral-100);}
.nav-link[aria-current="page"],.nav-link.is-active{color:var(--accent-text);}
.nav-item{position:relative;}
.nav-caret{font-size:10px;opacity:0.6;}
.dropdown{position:absolute;top:46px;left:0;width:290px;background:var(--neutral-0);border:1px solid var(--border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-md);padding:8px;display:flex;flex-direction:column;}
.dropdown[hidden]{display:none;}
.dropdown a{padding:10px 12px;border-radius:var(--radius-sm);font-size:var(--text-base);}
.dropdown a:hover{background:var(--neutral-100);}
.dropdown a.sub{padding-left:26px;font-size:var(--text-sm);color:var(--text-secondary);}
.header-right{margin-left:auto;display:flex;align-items:center;gap:18px;}
.btn-ink{padding:10px 18px;background:var(--color-ink);color:var(--color-paper);border-radius:var(--radius-sm);font-size:var(--text-base);font-weight:600;display:inline-block;}
.btn-ink:hover{background:var(--neutral-800);color:var(--color-paper);}
.menu-toggle{display:none;background:none;border:1px solid var(--border-default);border-radius:var(--radius-sm);padding:8px 10px;font-size:var(--text-base);font-weight:600;color:var(--color-ink);cursor:pointer;}

@media (max-width:880px){
  .main-nav{display:none;position:fixed;inset:62px 0 0 0;background:var(--color-paper);flex-direction:column;align-items:stretch;gap:0;padding:12px 20px;overflow-y:auto;border-top:1px solid var(--border-subtle);}
  .main-nav.nav-open{display:flex;}
  .nav-link{padding:14px 4px;border-radius:0;border-bottom:1px solid var(--border-subtle);}
  .nav-item{position:static;}
  .dropdown{position:static;width:auto;box-shadow:none;border:none;border-bottom:1px solid var(--border-subtle);border-radius:0;padding:0 0 8px 12px;}
  .header-right{margin-left:0;}
  .menu-toggle{display:inline-block;}
  .brand{margin-right:auto;}
  .site-header .wrap{flex-wrap:wrap;}
  .header-right{order:2;margin-left:auto;}
  .menu-toggle{order:3;}
}

/* ---------- Buttons & links ---------- */
.btn-primary{padding:14px 26px;background:var(--color-ink);color:var(--color-paper);border-radius:var(--radius-sm);font-size:var(--text-lg);font-weight:600;display:inline-block;}
.btn-primary:hover{background:var(--neutral-800);color:var(--color-paper);}
.btn-secondary{padding:14px 26px;background:transparent;border:1px solid var(--border-default);border-radius:var(--radius-sm);font-size:var(--text-lg);font-weight:600;display:inline-block;}
.btn-secondary:hover{background:var(--neutral-100);}
.link-accent{font-size:var(--text-base);font-weight:600;color:var(--accent-text);}
.link-accent:hover{color:#9a5400;text-decoration:underline;}

/* ---------- Hero ---------- */
.hero{padding-top:96px;padding-bottom:72px;}
.eyebrow{font-family:var(--font-display);font-size:var(--text-sm);font-weight:600;letter-spacing:0.08em;text-transform:uppercase;color:var(--accent-text);margin-bottom:22px;}
.hero h1{font-size:clamp(2.4rem,5.2vw,4rem);line-height:1.06;font-weight:600;max-width:20ch;text-wrap:pretty;}
.hero .lede{margin-top:28px;font-size:var(--text-xl);line-height:1.55;color:var(--text-secondary);max-width:60ch;text-wrap:pretty;}
.hero .actions{margin-top:40px;display:flex;flex-wrap:wrap;gap:14px;}

.page-hero{padding-top:80px;}
.page-hero h1{font-size:clamp(2.1rem,4.4vw,3.2rem);line-height:1.08;font-weight:600;text-wrap:pretty;}
.page-hero .lede{margin-top:24px;font-size:var(--text-xl);line-height:1.55;color:var(--text-secondary);text-wrap:pretty;}

/* ---------- Quote ---------- */
.quote-section{border-top:1px solid var(--border-subtle);border-bottom:1px solid var(--border-subtle);background:var(--neutral-0);}
.quote-section a{display:block;padding-top:72px;padding-bottom:72px;}
.quote-section blockquote{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:28px;align-items:start;}
.quote-mark{font-family:var(--font-display);font-size:4rem;line-height:0.7;color:var(--accent-text);}
.quote-section p.quote-text{font-family:var(--font-display);font-size:clamp(1.35rem,2.4vw,1.95rem);line-height:1.32;font-weight:500;text-wrap:pretty;}
.quote-attrib{margin-top:26px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;}
.quote-attrib img{height:34px;width:auto;}
.quote-attrib p{font-size:var(--text-base);color:var(--text-secondary);}

/* ---------- Cards / grid ---------- */
.card-grid{padding-top:80px;padding-bottom:80px;display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:28px;align-items:start;}
.card{background:var(--neutral-0);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:32px;display:flex;flex-direction:column;gap:16px;height:100%;box-shadow:var(--shadow-sm);}
.card .kicker{font-size:var(--text-xs);font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-muted);}
.card h2{font-size:var(--text-2xl);line-height:1.2;font-weight:600;}
.card p.body{font-size:var(--text-base);line-height:1.65;color:var(--text-secondary);}
.card .pull{font-size:var(--text-base);line-height:1.6;font-weight:500;padding-left:16px;border-left:2px solid var(--accent);}
.card .card-links{margin-top:auto;display:flex;flex-wrap:wrap;gap:20px;}
.card .link-accent{margin-top:auto;}

.split-section{background:var(--neutral-0);border-top:1px solid var(--border-subtle);border-bottom:1px solid var(--border-subtle);}
.split-section .wrap{padding-top:72px;padding-bottom:72px;display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:48px;align-items:start;}
.split-section h2{font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.12;font-weight:600;max-width:22ch;}
.split-section p{font-size:var(--text-xl);line-height:1.6;color:var(--text-secondary);text-wrap:pretty;}

.dark-section{background:var(--color-ink);color:var(--color-paper);}
.dark-section .wrap{padding-top:88px;padding-bottom:88px;}
.dark-section .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:48px;align-items:start;}
.dark-section h2{font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.12;font-weight:600;color:var(--color-paper);}
.dark-section .col{display:flex;flex-direction:column;gap:20px;}
.dark-section p{font-size:var(--text-lg);line-height:1.65;color:var(--text-on-dark-muted);}
.dark-section p.strong{color:var(--color-paper);}
.logo-strip{margin-top:64px;border-top:1px solid rgba(246,249,250,0.18);padding-top:40px;}
.logo-strip .kicker{font-size:var(--text-xs);font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-on-dark-muted);margin-bottom:28px;}
.logo-strip .logos{display:flex;flex-wrap:wrap;align-items:center;gap:44px;}
.logo-strip img{filter:brightness(0) invert(1);opacity:0.9;}

/* ---------- Service page body ---------- */
.service-body{padding:56px 0 0;display:flex;flex-direction:column;gap:40px;}
.service-body h2{font-size:var(--text-2xl);font-weight:600;}
.service-body p{font-size:var(--text-lg);line-height:1.7;color:var(--text-secondary);}
.service-block{display:flex;flex-direction:column;gap:12px;}

.story-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:14px;}
.story-list li{position:relative;padding-left:22px;font-size:var(--text-lg);line-height:1.7;color:var(--text-secondary);}
.story-list li::before{content:"";position:absolute;left:0;top:0.65em;width:6px;height:6px;border-radius:999px;background:var(--accent);}

.story-quote{display:grid;grid-template-columns:auto minmax(0,1fr);gap:28px;align-items:start;padding:48px 0;border-top:1px solid var(--border-subtle);border-bottom:1px solid var(--border-subtle);}
.story-quote p.quote-text{font-family:var(--font-display);font-size:clamp(1.2rem,2vw,1.6rem);line-height:1.4;font-weight:500;text-wrap:pretty;}
.story-quote p.quote-text + p.quote-text{margin-top:20px;}
.story-quote .quote-source{margin-top:22px;font-size:var(--text-base);font-weight:600;color:var(--text-secondary);}

.next-card{display:block;border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--neutral-0);padding:28px 32px;}
.next-card:hover{background:var(--surface-sunken);}
.next-card .kicker{font-size:var(--text-sm);font-weight:600;letter-spacing:0.06em;text-transform:uppercase;color:var(--text-muted);margin-bottom:8px;}
.next-card .title{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:600;}

/* ---------- Table ---------- */
.table-wrap{overflow-x:auto;border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--neutral-0);}
.resp-table{width:100%;min-width:760px;font-size:var(--text-base);}
.resp-table th{text-align:left;padding:16px 20px;font-family:var(--font-display);font-size:var(--text-sm);font-weight:600;letter-spacing:0.04em;text-transform:uppercase;color:var(--text-secondary);border-bottom:1px solid var(--border-subtle);background:var(--surface-sunken);}
.resp-table td{padding:16px 20px;border-bottom:1px solid var(--border-subtle);color:var(--text-secondary);}
.resp-table td:first-child{font-weight:600;color:var(--text-primary);}
.resp-table tr:last-child td{border-bottom:none;}

/* Card-per-row table under 768px, per content guide */
@media (max-width:768px){
  .resp-table thead{display:none;}
  .resp-table,.resp-table tbody,.resp-table tr,.resp-table td{display:block;width:100%;min-width:0;}
  .resp-table tr{border-bottom:1px solid var(--border-subtle);padding:16px 20px;}
  .resp-table td{padding:4px 0;border-bottom:none;}
  .resp-table td:first-child{padding-top:0;}
  .resp-table td::before{content:attr(data-label);display:block;font-size:var(--text-xs);font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--text-muted);margin-top:10px;}
  .resp-table td:first-child::before{display:none;}
  .table-wrap{border:none;}
}

/* ---------- Billing cards ---------- */
.billing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;}
.billing-card{background:var(--neutral-0);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:26px;border-top:3px solid var(--accent);}
.billing-card .title{font-family:var(--font-display);font-size:var(--text-xl);font-weight:600;line-height:1.25;}
.billing-card p.body{margin-top:10px;font-size:var(--text-base);line-height:1.65;color:var(--text-secondary);}

.invoice{margin-top:32px;border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--neutral-0);overflow:hidden;}
.invoice-head{padding:20px 24px;border-bottom:1px solid var(--border-subtle);display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;background:var(--surface-sunken);}
.invoice-head .title{font-family:var(--font-display);font-size:var(--text-lg);font-weight:600;}
.invoice-table{width:100%;min-width:560px;font-size:var(--text-base);}
.invoice-table th{text-align:left;padding:14px 24px;font-family:var(--font-display);font-size:var(--text-xs);font-weight:600;letter-spacing:0.08em;text-transform:uppercase;color:var(--text-muted);border-bottom:1px solid var(--border-subtle);}
.invoice-table th:nth-child(3),.invoice-table th:nth-child(4),.invoice-table td:nth-child(3),.invoice-table td:nth-child(4){text-align:right;}
.invoice-table td{padding:14px 24px;border-bottom:1px solid var(--border-subtle);}
.invoice-table tr:last-child td{border-bottom:none;}
.invoice-note{padding:16px 24px;border-top:1px solid var(--border-subtle);font-size:var(--text-sm);color:var(--text-secondary);}

/* ---------- Channel phone mockups ---------- */
.channel-grid{margin-top:40px;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:32px;align-items:start;}
.channel{display:flex;flex-direction:column;gap:16px;}
.channel-label{font-family:var(--font-display);font-size:var(--text-xl);font-weight:600;display:flex;align-items:center;gap:10px;}
.pill{font-family:var(--font-body);font-size:11px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;padding:3px 8px;border-radius:999px;background:var(--accent);color:var(--color-ink);}
.phone{border:1px solid var(--border-default);border-radius:22px;background:var(--neutral-0);padding:12px;box-shadow:var(--shadow-sm);}
.phone.recommended{border:1px solid var(--color-ink);box-shadow:var(--shadow-md);}
.channel p.caption{font-size:var(--text-sm);line-height:1.6;color:var(--text-secondary);}

/* ---------- FAQ ---------- */
.faq{display:flex;flex-direction:column;border-top:1px solid var(--border-subtle);}
.faq-item{padding:24px 0;border-bottom:1px solid var(--border-subtle);}
.faq-item h3{font-size:var(--text-xl);font-weight:600;}
.faq-item p{margin-top:10px;font-size:var(--text-lg);line-height:1.7;color:var(--text-secondary);}

/* ---------- Team ---------- */
.team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:28px;}
.team-card{display:flex;flex-direction:column;gap:14px;}
.team-card img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 18%;border-radius:var(--radius-md);background:var(--neutral-200);}
.team-card .name{font-family:var(--font-display);font-size:var(--text-xl);font-weight:600;}
.team-card .role{margin-top:4px;font-size:var(--text-base);color:var(--text-secondary);}
.team-card .email{margin-top:10px;font-size:var(--text-base);}
.team-card .email a{color:var(--accent-text);font-weight:600;}
.team-card .phone-number{font-size:var(--text-base);color:var(--text-secondary);}

/* ---------- Steps ---------- */
.steps-section{border-top:1px solid var(--border-subtle);background:var(--surface-sunken);margin-top:88px;}
.steps-section .wrap{padding-top:44px;padding-bottom:44px;}
.steps{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;}
.steps li{display:flex;flex-direction:column;gap:8px;}
.steps .num{font-family:var(--font-display);font-size:var(--text-sm);font-weight:700;color:var(--accent-text);}
.steps .label{font-size:var(--text-lg);line-height:1.5;}

/* ---------- Contact ---------- */
.contact-section{border-top:1px solid var(--border-subtle);background:var(--neutral-0);}
.contact-section .wrap{padding-top:80px;padding-bottom:80px;display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:56px;align-items:start;}
.contact-person{display:flex;flex-direction:column;gap:24px;}
.contact-person img{width:100%;max-width:340px;aspect-ratio:4/5;object-fit:cover;object-position:center 15%;border-radius:var(--radius-md);background:var(--neutral-200);}
.contact-person h2{font-size:var(--text-3xl);line-height:1.15;font-weight:600;}
.contact-person .role{margin-top:10px;font-size:var(--text-lg);color:var(--text-secondary);}
.contact-person .phone-number{margin-top:20px;font-size:var(--text-xl);font-weight:600;}
.contact-person .email{margin-top:4px;font-size:var(--text-xl);font-weight:600;}
.contact-person .email a{color:var(--accent-text);}
.contact-person .note{margin-top:20px;font-size:var(--text-base);line-height:1.7;color:var(--text-secondary);max-width:46ch;}
.contact-form{display:flex;flex-direction:column;gap:18px;}
.contact-form h2{font-size:var(--text-2xl);font-weight:600;}
.field{display:flex;flex-direction:column;gap:6px;}
.field span{font-size:var(--text-sm);font-weight:600;}
.field input,.field select,.field textarea{font-family:var(--font-body);font-size:var(--text-base);padding:10px 12px;border-radius:var(--radius-sm);border:1px solid var(--border-default);background:var(--surface-card);color:var(--text-primary);}
.field textarea{resize:vertical;}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--accent);outline-offset:1px;}
.form-submit{margin-top:4px;}
.btn-submit{padding:13px 28px;background:var(--color-ink);color:var(--color-paper);border:none;border-radius:var(--radius-sm);font-family:var(--font-body);font-size:var(--text-base);font-weight:600;cursor:pointer;}
.btn-submit:hover{background:var(--neutral-800);}
.form-footnote{font-size:var(--text-base);line-height:1.7;color:var(--text-secondary);border-top:1px solid var(--border-subtle);padding-top:18px;}
.form-status{font-size:var(--text-sm);color:var(--text-secondary);}
.form-status[data-state="error"]{color:#a3312a;}

/* ---------- Footer ---------- */
.site-footer{background:var(--color-ink);color:var(--text-on-dark-muted);}
.site-footer .wrap{padding-top:56px;padding-bottom:56px;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:32px;align-items:start;}
.footer-brand{display:flex;flex-direction:column;align-items:flex-start;gap:16px;}
.footer-brand img{display:block;height:30px;width:auto;}
.footer-brand p{font-size:var(--text-sm);line-height:1.7;}
.footer-social{display:flex;gap:12px;}
.footer-social a{display:inline-flex;opacity:0.9;}
.footer-social a:hover{opacity:1;}
.footer-nav{display:flex;flex-direction:column;gap:10px;}
.footer-nav a{font-size:var(--text-sm);color:var(--color-paper);}
.footer-nav a:hover{text-decoration:underline;}

/* ---------- Simple content pages (personvern / informasjonssikkerhet) ---------- */
.legal-body{padding-top:40px;padding-bottom:96px;display:flex;flex-direction:column;gap:20px;}
.legal-body p{font-size:var(--text-lg);line-height:1.7;color:var(--text-secondary);}
.legal-body h2{margin-top:28px;font-size:var(--text-2xl);color:var(--text-primary);}
.legal-body h3{margin-top:12px;font-size:var(--text-xl);color:var(--text-primary);}
.legal-body ul,.legal-body ol{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:8px;}
.legal-body li{font-size:var(--text-lg);line-height:1.7;color:var(--text-secondary);}
.legal-body .legal-meta{font-size:var(--text-sm);color:var(--text-muted);}
.legal-note{background:var(--surface-sunken);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:20px 24px;font-size:var(--text-base);color:var(--text-secondary);}
