/* Oakes Grotesk is a licensed font: put your purchased files in a /fonts folder next to this page. */
@font-face{font-family:'Oakes Grotesk';font-weight:400;font-style:normal;font-display:swap;src:local('Oakes Grotesk Regular'),local('OakesGrotesk-Regular'),url('fonts/OakesGrotesk-Regular.woff2') format('woff2')}
@font-face{font-family:'Oakes Grotesk';font-weight:500;font-style:normal;font-display:swap;src:local('Oakes Grotesk Medium'),local('OakesGrotesk-Medium'),url('fonts/OakesGrotesk-Medium.woff2') format('woff2')}
@font-face{font-family:'Oakes Grotesk';font-weight:700;font-style:normal;font-display:swap;src:local('Oakes Grotesk Bold'),local('OakesGrotesk-Bold'),url('fonts/OakesGrotesk-Bold.woff2') format('woff2')}
:root{
  --mint:#3FD2A5; --accent:#0B7A5B; --focus:#12384A;
  --paper:#F6F8F7; --surface:#FFFFFF; --ink:#16282F; --muted:#51666F; --line:#D9E3E0;
  --band:#12384A; --on-band:#F3F8F7; --on-band-muted:#B5CCD2;
  --btn-bg:#12384A; --btn-fg:#FFFFFF; --btn-hover:#1B4D63;
  --font-display:'Oakes Grotesk','Avenir Next','Segoe UI',system-ui,sans-serif;
  --font-body:'Oakes Grotesk','Avenir Next','Segoe UI',system-ui,sans-serif;
  --r-sm:6px; --r-lg:14px; --max:1120px;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --accent:#5FE0B8; --focus:#5FE0B8;
    --paper:#0F1E25; --surface:#16303A; --ink:#E8F1EF; --muted:#A3B9BF; --line:#294550;
    --band:#0A1820; --btn-bg:#3FD2A5; --btn-fg:#0C2530; --btn-hover:#5FE0B8;
  }
}
:root[data-theme="dark"]{
  --accent:#5FE0B8; --focus:#5FE0B8;
  --paper:#0F1E25; --surface:#16303A; --ink:#E8F1EF; --muted:#A3B9BF; --line:#294550;
  --band:#0A1820; --btn-bg:#3FD2A5; --btn-fg:#0C2530; --btn-hover:#5FE0B8;
}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*,*::before,*::after{box-sizing:inherit}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.65 var(--font-body);-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--font-display);font-weight:700;line-height:1.1;letter-spacing:-.015em;margin:0 0 .6em;text-wrap:balance}
h1{font-size:clamp(2.5rem,5.6vw,4.25rem);letter-spacing:-.025em;line-height:1.03}
h2{font-size:clamp(1.8rem,3.4vw,2.6rem)}
h3{font-size:1.3rem;letter-spacing:-.01em}
p{margin:0 0 1em;max-width:62ch}
ul,ol{margin:0;padding:0}
a{color:var(--accent);text-underline-offset:.2em}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
h1:focus{outline:none}
.wrap{width:min(100% - 2.5rem,var(--max));margin-inline:auto}
.skip{position:absolute;left:-999px;top:0;background:var(--btn-bg);color:var(--btn-fg);padding:.75rem 1rem;z-index:50;font-family:var(--font-display)}
.skip:focus{left:1rem;top:1rem}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:.8rem 1.4rem;border:2px solid transparent;border-radius:var(--r-sm);font:700 1rem var(--font-display);text-decoration:none;cursor:pointer;transition:background .15s,color .15s}
.btn-primary{background:var(--btn-bg);color:var(--btn-fg)}
.btn-primary:hover{background:var(--btn-hover)}
.btn-ghost{border-color:var(--ink);color:var(--ink);background:transparent}
.btn-ghost:hover{background:var(--ink);color:var(--paper)}
.btn-band{background:var(--mint);color:#0C2530}
.btn-band:hover{background:#6FE3C0}
.btn-ghost-band{border-color:var(--on-band);color:var(--on-band)}
.btn-ghost-band:hover{background:var(--on-band);color:var(--band)}
.btn-sm{min-height:40px;padding:.5rem 1.1rem;font-size:.95rem}
.actions{display:flex;flex-wrap:wrap;gap:.9rem;margin:1.8rem 0 1rem}
.fine{font-size:.95rem;color:var(--muted)}

/* Header */
.site-header{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--paper);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:70px}
.logo{display:inline-flex;align-items:center;gap:.6rem;font:700 1.3rem var(--font-display);letter-spacing:-.02em;color:var(--ink);text-decoration:none}
.logo svg{width:30px;height:30px}
.primary-nav ul{display:flex;align-items:center;gap:1.9rem;list-style:none}
.primary-nav a:not(.btn){font:500 1rem var(--font-display);color:var(--ink);text-decoration:none;padding:.35rem 0;border-bottom:2px solid transparent}
.primary-nav a:not(.btn):hover{border-bottom-color:var(--line)}
.primary-nav a[aria-current="page"]:not(.btn){border-bottom-color:var(--accent)}
.nav-toggle{display:none;align-items:center;justify-content:center;width:46px;height:46px;border:2px solid var(--ink);border-radius:var(--r-sm);background:transparent;color:var(--ink);cursor:pointer}
.nav-toggle svg{width:22px;height:22px}
@media (max-width:860px){
  .nav-toggle{display:inline-flex}
  .primary-nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--paper);border-bottom:1px solid var(--line);padding:1rem 1.25rem 1.5rem}
  .primary-nav.open{display:block}
  .primary-nav ul{flex-direction:column;align-items:stretch;gap:.25rem}
  .primary-nav a:not(.btn){display:block;padding:.8rem 0;border-bottom:1px solid var(--line)}
  .primary-nav .btn{width:100%;margin-top:.75rem}
}

/* Hero */
.hero{padding-block:clamp(2.5rem,7vw,5.5rem)}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.lead{font-size:1.2rem;color:var(--muted);max-width:52ch}
.hero-art{width:100%;height:auto;display:block}
@media (max-width:860px){.hero-grid{grid-template-columns:1fr}}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes appear{to{opacity:1}}
.s1{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 2.2s ease-in-out .3s forwards}
.s2{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.5s ease-out 2.4s forwards}
.f{opacity:0;animation:appear .9s ease 3.6s forwards}
@media (prefers-reduced-motion:reduce){
  .s1,.s2{animation:none;stroke-dashoffset:0}
  .f{animation:none;opacity:1}
}

/* Industries */
.industries{border-block:1px solid var(--line);padding-block:1.25rem}
.industries .wrap{display:flex;flex-wrap:wrap;align-items:baseline;gap:.5rem 2rem}
.industries strong{font:700 1rem var(--font-display)}
.industries span{font:500 1rem var(--font-display);color:var(--muted)}

/* Sections */
.section{padding-block:clamp(3.5rem,8vw,6rem)}
.section-alt{background:var(--surface);border-block:1px solid var(--line)}
.section-head{max-width:46rem;margin-bottom:2.5rem}
.section-head p{color:var(--muted)}
.page-head{padding-block:clamp(2.5rem,6vw,4.5rem) clamp(1.5rem,3vw,2.5rem)}
.page-head h1{font-size:clamp(2.2rem,4.8vw,3.5rem);max-width:20ch}

/* Service rows */
.rows{list-style:none}
.row{display:grid;grid-template-columns:56px 1fr;gap:1.25rem;padding-block:1.75rem;border-top:1px solid var(--line)}
.row:last-child{border-bottom:1px solid var(--line)}
.ico{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;background:color-mix(in srgb,var(--mint) 22%,transparent);color:var(--accent)}
.ico svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.row h3{margin-bottom:.3em}
.row p{margin:0;color:var(--muted)}
.more{display:inline-block;margin-top:1.75rem;font:700 1rem var(--font-display)}

/* Steps */
.steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;counter-reset:s}
.steps li{counter-increment:s;border-top:3px solid var(--accent);padding-top:1rem}
.steps li::before{content:counter(s);display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--accent);color:var(--paper);font:700 1rem var(--font-display);margin-bottom:.75rem}
.steps h3{font-size:1.2rem;margin-bottom:.2em}
.steps .when{font:500 .95rem var(--font-display);color:var(--accent);margin-bottom:.5em}
.steps p{color:var(--muted);font-size:1rem}
@media (max-width:860px){.steps{grid-template-columns:1fr 1fr}}
@media (max-width:540px){.steps{grid-template-columns:1fr}}

/* Quiz */
.quiz{display:grid;grid-template-columns:1.1fr .9fr;gap:2rem;align-items:start}
@media (max-width:860px){.quiz{grid-template-columns:1fr}}
.q{border:0;padding:0;margin:0 0 1.5rem}
.q legend{font:600 1.1rem var(--font-display);padding:0;margin-bottom:.6rem}
.seg{display:inline-flex;border:2px solid var(--line);border-radius:var(--r-sm);overflow:hidden}
.seg-opt{position:relative;cursor:pointer}
.seg-opt input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.seg-opt span{display:block;padding:.55rem 1.3rem;font:500 1rem var(--font-display)}
.seg-opt+.seg-opt span{border-left:2px solid var(--line)}
.seg-opt input:checked+span{background:var(--btn-bg);color:var(--btn-fg)}
.seg-opt input:focus-visible+span{outline:3px solid var(--focus);outline-offset:-3px}
.result{background:var(--paper);border:2px solid var(--line);border-radius:var(--r-lg);padding:1.75rem;position:sticky;top:calc(90px + env(safe-area-inset-top,0px))}
.result h3{margin-bottom:.3em}
.result .price{font:700 1.6rem var(--font-display);margin:.2rem 0 .8rem}
.result ul{margin:0 0 1.25rem 1.2rem;color:var(--muted)}
.result .actions{margin:1rem 0 0}

/* Work */
.cases{display:grid;gap:2rem}
.case{display:grid;grid-template-columns:240px 1fr;gap:2rem;background:var(--surface);border-top:4px solid var(--mint);padding:1.75rem;border-inline:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-alt .case{background:var(--paper)}
.case dl{margin:0;font-family:var(--font-display)}
.case dt{font-size:.9rem;color:var(--muted);margin-top:.9rem}
.case dt:first-child{margin-top:0}
.case dd{margin:0;font-weight:500}
.case h3{font-size:1.5rem}
.case h4{font:700 1rem var(--font-display);margin:1rem 0 .2rem}
.case p{margin:0;color:var(--muted)}
.stats{display:flex;flex-wrap:wrap;gap:1rem 2.5rem;margin-top:1.25rem;padding-top:1.25rem;border-top:1px solid var(--line)}
.stat b{display:block;font:700 2rem/1 var(--font-display);color:var(--accent)}
.stat span{font-size:.95rem;color:var(--muted)}
.tag{display:inline-block;font:500 .8rem var(--font-display);border:1px solid var(--muted);color:var(--muted);border-radius:99px;padding:.1rem .6rem;margin-left:.5rem;vertical-align:middle}
@media (max-width:760px){.case{grid-template-columns:1fr}}

/* Quotes */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
blockquote{margin:0;padding-left:1.25rem;border-left:4px solid var(--mint)}
blockquote p{font-size:1.1rem;font-style:normal;color:var(--ink)}
blockquote footer{font:500 .95rem var(--font-display);color:var(--muted)}
@media (max-width:860px){.quotes{grid-template-columns:1fr}}

/* FAQ */
.faq{max-width:50rem}
details{border-top:1px solid var(--line)}
details:last-child{border-bottom:1px solid var(--line)}
summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1rem;padding:1.15rem 0;font:600 1.1rem var(--font-display)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-size:1.5rem;line-height:1;color:var(--accent);transition:transform .2s}
details[open] summary::after{transform:rotate(45deg)}
details p{color:var(--muted);padding-bottom:1.1rem;margin:0}
@media (prefers-reduced-motion:reduce){summary::after{transition:none}}

/* Services page */
.svc{display:grid;grid-template-columns:1fr 1fr;gap:2rem 3rem;padding-block:2.25rem;border-top:1px solid var(--line)}
.svc:last-of-type{border-bottom:1px solid var(--line)}
.svc .ico{margin-bottom:1rem}
.svc h2{font-size:1.7rem}
.svc p{color:var(--muted)}
.svc h3{font-size:1rem;margin-bottom:.4em}
.checks{list-style:none;margin-bottom:1rem}
.checks li{display:flex;gap:.65rem;padding-block:.25rem}
.checks svg{flex:none;width:20px;height:20px;margin-top:.3rem;fill:none;stroke:var(--accent);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:760px){.svc{grid-template-columns:1fr}}

/* Pricing */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;align-items:stretch}
.plan{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:2rem 1.75rem}
.plan.featured{border:3px solid var(--accent);position:relative}
.plan .badge{position:absolute;top:-.95rem;left:1.5rem;background:var(--accent);color:var(--paper);font:700 .85rem var(--font-display);padding:.25rem .8rem;border-radius:99px}
.plan h3{margin-bottom:.3em}
.plan .blurb{color:var(--muted);min-height:3.4em}
.plan .price{font:700 2.4rem/1 var(--font-display);letter-spacing:-.02em;margin:.5rem 0 .2rem}
.plan .unit{font:500 .95rem var(--font-display);color:var(--muted);margin-bottom:1.25rem}
.plan .checks{flex:1;border-top:1px solid var(--line);padding-top:1.25rem}
.plan .btn{width:100%}
@media (max-width:960px){.plans{grid-template-columns:1fr;max-width:520px;margin-inline:auto}.plan .blurb{min-height:0}}
.included{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
.included h3{font-size:1.05rem;margin-bottom:.3em}
.included p{color:var(--muted);font-size:1rem;margin:0}
@media (max-width:860px){.included{grid-template-columns:1fr 1fr}}
@media (max-width:540px){.included{grid-template-columns:1fr}}
.custom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5rem;margin-top:2rem;padding:1.75rem;border:2px dashed var(--line);border-radius:var(--r-lg)}
.custom h3{margin:0 0 .2em}
.custom p{margin:0;color:var(--muted)}

/* About */
.two{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem}
.two h3{font-size:1.4rem}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.three h3{font-size:1.2rem}
.three p{color:var(--muted)}
@media (max-width:860px){.two,.three{grid-template-columns:1fr}}

/* Book */
.book{display:grid;grid-template-columns:1.4fr .8fr;gap:2.5rem;align-items:start}
@media (max-width:960px){.book{grid-template-columns:1fr}}
.cal{width:100%;min-height:700px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface)}
.cal-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:2rem;border:2px dashed var(--line);border-radius:var(--r-lg);min-height:420px;color:var(--muted)}
.cal-empty h3{color:var(--ink)}
.cal-empty p{max-width:40ch}
form.contact{display:grid;gap:1.1rem;max-width:34rem}
label.f-label{display:grid;gap:.35rem;font:500 1rem var(--font-display)}
input[type=text],input[type=email],select,textarea{font:400 1rem var(--font-body);color:var(--ink);background:var(--surface);border:2px solid var(--line);border-radius:var(--r-sm);padding:.7rem .8rem;width:100%}
textarea{min-height:130px;resize:vertical}
.aside h2{font-size:1.4rem}
.aside .checks li{padding-block:.35rem}
.legal h2{font-size:1.4rem;margin-top:2rem}
.legal p,.legal li{color:var(--muted)}

/* CTA band + footer */
.cta-band{background:var(--band);color:var(--on-band);padding-block:clamp(3rem,7vw,5rem)}
.cta-band .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:2rem}
.cta-band h2{margin:0 0 .3em;max-width:22ch}
.cta-band p{color:var(--on-band-muted);margin:0}
.cta-band .actions{margin:0}
.site-footer{background:var(--band);color:var(--on-band);border-top:1px solid #ffffff22;padding-block:3rem 2rem;font-size:1rem}
.site-footer .logo{color:var(--on-band)}
.foot{display:grid;grid-template-columns:1.4fr 1fr 1.2fr 1.2fr;gap:2rem}
.foot h2{font:700 1rem var(--font-display);margin-bottom:.8em;letter-spacing:0}
.foot ul{list-style:none}
.foot li{padding-block:.2rem}
.foot a{color:var(--on-band-muted);text-decoration:none}
.foot a:hover{color:#fff;text-decoration:underline}
.foot p{color:var(--on-band-muted);font-size:.98rem}
.legal-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;margin-top:2.5rem;padding-top:1.25rem;border-top:1px solid #ffffff22;color:var(--on-band-muted);font-size:.95rem}
.legal-row a{color:var(--on-band-muted)}
@media (max-width:860px){.foot{grid-template-columns:1fr 1fr}}
@media (max-width:540px){.foot{grid-template-columns:1fr}}