/* aneemo mockup design system
   Tokens extracted from aneemo.com, Oct 2026. Teal is the brand accent, used as a surface
   or on dark green, never as text on white (fails contrast). Spacing runs on an 8px grid;
   body line-height is 24px, and section rhythm is built from multiples of it. */

:root {
  --teal: #26BEA7;
  --teal-deep: #0E6B5D;
  --teal-tint: #E6F6F3;
  --forest: #113B35;
  --forest-2: #1A4D45;
  --ink: #2B2F2E;
  --ink-2: #5E6563;
  --paper: #FFFFFF;
  --mist: #F4F6F5;
  --line: #DEE3E1;

  --font: "Quicksand", "Nunito", sans-serif;

  /* Five sizes. Ratio 1.25 between steps, fluid at the top end. */
  --t-xs: .75rem;
  --t-sm: .875rem;
  --t-base: 1rem;
  --t-lg: 1.25rem;
  --t-h3: clamp(1.25rem, 1.15rem + .5vw, 1.5rem);
  --t-h2: clamp(1.75rem, 1.35rem + 1.5vw, 2.375rem);
  --t-h1: clamp(2.25rem, 1.5rem + 2.8vw, 3.5rem);

  /* 8px spacing scale */
  --s1: .5rem;
  --s2: 1rem;
  --s3: 1.5rem;
  --s4: 2rem;
  --s5: 3rem;
  --s6: 4rem;
  --s7: 6rem;

  --pad: clamp(1.25rem, 4vw, 2.5rem);
  --max: 1200px;
  --sec: clamp(var(--s6), 8vw, var(--s7));
  --r: 4px;
  --ease: cubic-bezier(.22,1,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-weight:500;font-size:var(--t-base);line-height:1.5;font-feature-settings:"kern" 1;font-kerning:normal;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
img{display:block;max-width:100%;height:auto}
a{color:var(--teal-deep);text-underline-offset:.15em;text-decoration-thickness:1px}
a:hover{color:var(--forest)}
:focus-visible{outline:3px solid var(--teal-deep);outline-offset:3px}

h1,h2,h3{margin:0;font-weight:700;color:var(--forest);text-wrap:balance}
h1{font-size:var(--t-h1);line-height:1.05;letter-spacing:-.02em}
h2{font-size:var(--t-h2);line-height:1.12;letter-spacing:-.015em}
h3{font-size:var(--t-h3);line-height:1.25;letter-spacing:-.01em}
p{margin:0 0 var(--s2);text-wrap:pretty}
p:last-child{margin-bottom:0}
b,strong{font-weight:700}

.wrap{max-width:var(--max);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.skip{position:absolute;left:-999px;top:0;background:var(--forest);color:#fff;padding:.6rem 1rem;z-index:100}
.skip:focus{left:1rem}

.kicker{display:block;font-size:var(--t-xs);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--teal-deep);margin-bottom:var(--s2);line-height:1.3}
.lede{font-size:var(--t-lg);line-height:1.45;color:var(--ink-2);max-width:56ch;letter-spacing:-.005em}
.measure{max-width:62ch}
.num{font-variant-numeric:tabular-nums lining-nums}

/* Editorial notes for the review round. Hidden with the toggle in the corner. */
.todo{font-size:var(--t-xs);font-weight:700;color:#8A6A00;background:none;padding:0 .15em;border-bottom:2px dotted #D9A400;line-height:1.2;vertical-align:baseline;white-space:normal}
.notes-off .todo,.notes-off .todo-block{display:none!important}
.notes-toggle{position:fixed;right:1rem;top:5.25rem;z-index:60;background:#fff;border:1px solid var(--line);border-radius:999px;padding:.5rem .9rem;font:inherit;font-size:var(--t-xs);font-weight:700;color:var(--ink-2);cursor:pointer;box-shadow:0 4px 16px rgba(17,59,53,.12)}
.notes-toggle:hover{color:var(--forest)}
@media print{.notes-toggle{display:none}}
@media (max-width:860px){.notes-toggle{top:auto;bottom:1rem;right:1rem;font-size:.65rem;padding:.4rem .7rem;opacity:.92}}

/* Buttons: one height, two weights */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:3rem;padding:0 var(--s3);border-radius:var(--r);font:inherit;font-weight:700;font-size:var(--t-base);line-height:1;letter-spacing:-.005em;text-decoration:none;border:2px solid transparent;cursor:pointer;transition:background .2s,color .2s,border-color .2s,transform .2s var(--ease)}
.btn:hover{transform:translateY(-1px)}
.btn svg{width:1rem;height:1rem;flex:none;margin-right:-.25rem}
.btn-primary{background:var(--forest);color:#fff;border-color:var(--forest)}
.btn-primary:hover{background:var(--forest-2);color:#fff}
.btn-teal{background:var(--teal);color:var(--forest);border-color:var(--teal)}
.btn-teal:hover{background:#fff;color:var(--forest);border-color:#fff}
.btn-outline{background:transparent;color:var(--forest);border-color:var(--forest)}
.btn-outline:hover{background:var(--forest);color:#fff}
.textlink{font-weight:700;color:var(--forest);text-decoration:none;display:inline-flex;align-items:center;gap:.35rem}
.textlink:hover{color:var(--teal-deep)}
.textlink svg{width:1rem;height:1rem}

/* Header */
.header{position:sticky;top:0;z-index:30;background:#fff;border-bottom:1px solid var(--line)}
.header .wrap{display:flex;align-items:center;gap:var(--s3);height:4.5rem}
.logo{display:block;margin-right:auto}
.logo img{height:2.25rem;width:auto}
.nav{display:flex;align-items:center;gap:var(--s3)}
.nav a{color:var(--ink);font-weight:600;text-decoration:none;font-size:var(--t-sm);white-space:nowrap;letter-spacing:-.005em}
.nav a:hover{color:var(--teal-deep)}
.nav a[aria-current]{color:var(--forest)}
.nav .login{color:var(--ink-2);font-weight:600;margin-left:var(--s2);padding-left:var(--s3);border-left:1px solid var(--line);display:inline-flex;align-items:center;gap:.3rem}
.nav .login svg{width:.8rem;height:.8rem}
.nav .login::after{display:none}
.nav .btn{min-height:2.5rem;padding:0 var(--s2);font-size:var(--t-sm);color:#fff;margin-left:var(--s1)}
.burger{display:none;background:none;border:2px solid var(--forest);border-radius:var(--r);color:var(--forest);font:inherit;font-weight:700;font-size:var(--t-sm);padding:.5rem .8rem;cursor:pointer}
.mnav{display:none;border-top:1px solid var(--line);background:#fff}
.mnav.open{display:block}
.mnav a{display:block;padding:.9rem var(--pad);border-bottom:1px solid var(--line);color:var(--ink);font-weight:600;text-decoration:none}
.mnav a[aria-current]{color:var(--forest);box-shadow:inset 4px 0 0 var(--teal)}
.mnav .btn{display:inline-flex;margin:var(--s2) var(--pad);border-bottom:0;color:#fff}
.mnav-more{background:var(--mist);padding:var(--s1) 0}
.mnav-more a{border-bottom:0;padding:.6rem var(--pad);font-size:var(--t-sm);color:var(--ink-2)}
.mnav .login svg{width:.8rem;height:.8rem;vertical-align:-1px}
@media (max-width:980px){.nav{display:none}.burger{display:block}}

/* Hero: copy left, photo right */
.hero{position:relative;background:var(--mist);overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:var(--s5);align-items:center;padding-top:var(--s6);padding-bottom:var(--s6)}
.hero-copy{max-width:34rem}
.hero h1{margin-bottom:var(--s3)}
.hero h1 span{color:var(--teal-deep)}
.hero .lede{margin-bottom:var(--s4)}
.hero-ctas{display:flex;flex-wrap:wrap;gap:var(--s2)}
.hero-media{position:relative;margin:0;aspect-ratio:5/4}
.hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:58% 30%;border-radius:var(--r)}
.hero-media figcaption{position:absolute;left:0;bottom:0;background:var(--forest);color:#fff;padding:var(--s2) var(--s3);font-size:var(--t-sm);line-height:1.4;max-width:min(100%,22rem);border-radius:0 var(--r) 0 var(--r);letter-spacing:.01em}
@media (max-width:860px){
  .hero .wrap{grid-template-columns:1fr;padding-top:0;padding-left:0;padding-right:0;gap:0}
  .hero-media{aspect-ratio:16/10;order:-1}
  .hero-media img{border-radius:0}
  .hero-media figcaption{position:static;max-width:none;border-radius:0}
  .hero-copy{padding:var(--s4) var(--pad) var(--s5);max-width:none}
}

/* Stats bar */
.stats{background:var(--forest);color:#fff;letter-spacing:.01em}
.stats .wrap{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--pad)}
.stats div{padding:var(--s3) 0 var(--s3) var(--s3);border-left:1px solid rgba(255,255,255,.18)}
.stats div:first-child{border-left:0;padding-left:0}
.stats b{display:block;font-size:2rem;line-height:1;color:var(--teal);margin-bottom:.4rem;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.stats span{font-size:var(--t-sm);opacity:.85;line-height:1.4}
@media (max-width:560px){.stats .wrap{grid-template-columns:1fr;gap:0}.stats div{border-left:0;padding:var(--s2) 0;border-top:1px solid rgba(255,255,255,.18)}.stats div:first-child{border-top:0}}

/* Logos */
.logos{padding:var(--s4) 0}
.logos p{margin:0 0 var(--s3);font-size:var(--t-xs);font-weight:700;color:var(--ink-2);text-transform:uppercase;letter-spacing:.1em}
.logos ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,1fr);gap:var(--s3);align-items:center}
.logos li{height:3rem;display:flex;align-items:center;justify-content:center}
.logos img{max-height:100%;max-width:100%;width:auto;height:auto;object-fit:contain;filter:grayscale(1);opacity:.6}
@media (max-width:860px){.logos ul{grid-template-columns:repeat(3,1fr)}}
@media (max-width:640px){.logos .wrap{flex-direction:column;align-items:flex-start}.logos img{height:1.75rem}}

/* Free band (course index) */
.free{background:var(--teal-tint)}
.free .wrap{display:flex;align-items:center;gap:var(--s3);padding-top:var(--s3);padding-bottom:var(--s3)}
.free .tag{flex:none;background:var(--teal);color:var(--forest);font-weight:700;padding:.35rem .7rem;border-radius:var(--r);font-size:var(--t-xs);text-transform:uppercase;letter-spacing:.1em}
.free p{margin:0;flex:1;font-weight:600}
.free a{flex:none}
@media (max-width:680px){.free .wrap{flex-wrap:wrap;gap:var(--s2)}.free p{flex-basis:100%}}

/* Sections */
.sec{padding:var(--sec) 0}
.sec-head{margin-bottom:var(--s5);max-width:40rem}
.sec-head .lede{margin:0}
.sec-head h2{margin-bottom:var(--s2)}

/* Who it's for */
.sectors{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.sectors a{display:block;background:#fff;padding:var(--s3);text-decoration:none;color:var(--ink);height:100%;transition:background .2s}
.sectors a:hover{background:var(--teal-tint)}
.sectors .n{display:block;font-size:var(--t-xs);font-weight:700;color:var(--teal-deep);margin-bottom:var(--s3);letter-spacing:.05em}
.sectors h3{font-size:var(--t-base);margin-bottom:.35rem}
.sectors p{margin:0;font-size:var(--t-sm);color:var(--ink-2)}
@media (max-width:1000px){.sectors{grid-template-columns:1fr}.sectors a{display:grid;grid-template-columns:2.5rem 1fr;gap:0 var(--s2);padding:var(--s2) var(--s3)}.sectors .n{margin:0;grid-row:1/span 2}.sectors h3{margin:0}}

/* Courses */
.courses{background:var(--mist)}
.course-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:var(--s4);align-items:start}
.feature{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.feature-stat{background:var(--forest);color:#fff;padding:var(--s3);display:flex;gap:var(--s3);align-items:center;letter-spacing:.01em}
.feature-stat b{font-size:3rem;line-height:1;color:var(--teal);flex:none;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.feature-stat p{margin:0;font-size:var(--t-sm);line-height:1.45}
.feature-stat small{display:block;opacity:.7;margin-top:.3rem;font-size:var(--t-xs)}
.feature-body{padding:var(--s3)}
.feature-body h3{margin:.25rem 0 var(--s1)}
.byline{font-size:var(--t-sm);color:var(--ink-2);margin-bottom:var(--s2)}
.byline b{color:var(--forest)}
.feature-meta{display:flex;flex-wrap:wrap;gap:var(--s1) var(--s3);font-size:var(--t-sm);color:var(--ink-2);margin:var(--s2) 0 var(--s3);padding-top:var(--s2);border-top:1px solid var(--line)}
.clist{list-style:none;margin:0;padding:0;background:#fff;border:1px solid var(--line);border-radius:var(--r)}
.clist li+li{border-top:1px solid var(--line)}
.clist a{display:flex;justify-content:space-between;align-items:center;gap:var(--s2);padding:var(--s2) var(--s3);text-decoration:none;color:var(--ink);transition:background .2s;min-height:4.5rem}
.clist a:hover{background:var(--teal-tint)}
.clist h3{font-size:var(--t-base);margin-bottom:.15rem;letter-spacing:0}
.clist .sub{font-size:var(--t-sm);color:var(--ink-2)}
.clist .price{flex:none;font-weight:700;color:var(--forest);font-variant-numeric:tabular-nums}
.clist .price.free{background:var(--teal);padding:.15rem .5rem;border-radius:var(--r);font-size:var(--t-sm)}
.clist-foot{padding:var(--s2) var(--s3)}
@media (max-width:860px){.course-grid{grid-template-columns:1fr}}

/* Case study (home v2) */
.case .wrap{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:var(--s5);align-items:start}
.bignum{font-size:clamp(3.5rem,8vw,6rem);font-weight:700;line-height:.95;color:var(--forest);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.bignum span{color:var(--teal-deep)}
.bignum-cap{font-size:var(--t-lg);color:var(--ink-2);margin:var(--s2) 0 var(--s4);max-width:22ch}
.mini{display:flex;gap:var(--s2);align-items:flex-start;padding-top:var(--s3);border-top:1px solid var(--line)}
.mini b{font-size:1.75rem;line-height:1;color:var(--forest);white-space:nowrap;font-variant-numeric:tabular-nums}
.mini p{margin:0;font-size:var(--t-sm);color:var(--ink-2)}
.case ul{padding-left:1.1rem;margin:0 0 var(--s3)}
.case li{margin-bottom:.4rem}
.case li::marker{color:var(--teal-deep)}
@media (max-width:760px){.case .wrap{grid-template-columns:1fr;gap:var(--s4)}}

/* Story (dark) */
.story{background:var(--forest);color:#DCE7E4;letter-spacing:.01em}
.story .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s5);align-items:center}
.story .kicker{color:var(--teal)}
.story h2{color:#fff;margin-bottom:var(--s2)}
.story p{line-height:1.65}
.story figure{margin:0}
.story img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:var(--r)}
.story figcaption{font-size:var(--t-sm);opacity:.75;margin-top:var(--s1)}
.values{list-style:none;padding:0;margin:var(--s3) 0 var(--s4);display:flex;flex-wrap:wrap;gap:var(--s1)}
.values li{border:1px solid rgba(255,255,255,.3);padding:.3rem .8rem;border-radius:999px;font-size:var(--t-sm);font-weight:700;color:#fff}
@media (max-width:860px){.story .wrap{grid-template-columns:1fr;gap:var(--s4)}.story figure{order:-1}}

/* Quote */
.quote .wrap{max-width:56rem}
.quote blockquote{margin:0;padding-left:var(--s3);border-left:4px solid var(--teal)}
.quote blockquote p{font-size:var(--t-lg);font-weight:600;color:var(--forest);line-height:1.4;margin-bottom:var(--s2)}
.quote cite{font-style:normal;font-size:var(--t-sm);color:var(--ink-2)}
.tp{display:flex;align-items:center;gap:var(--s2);margin-top:var(--s4);padding:var(--s2) var(--s3);border:1px solid var(--line);border-radius:var(--r);font-size:var(--t-sm);width:fit-content;max-width:100%}
.tp .stars{display:inline-flex;gap:2px}
.tp .stars i{width:18px;height:18px;background:var(--teal);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}

/* Event */
.event{background:var(--mist)}
.event .wrap{display:grid;grid-template-columns:auto 1fr auto;gap:var(--s3) var(--s4);align-items:center;padding-top:var(--s4);padding-bottom:var(--s4)}
.date{background:#fff;border:1px solid var(--line);border-radius:var(--r);text-align:center;padding:.6rem .9rem;min-width:4.5rem}
.date b{display:block;font-size:1.75rem;line-height:1;color:var(--forest);font-variant-numeric:tabular-nums}
.date span{display:block;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-2)}
.event h3{margin:.1rem 0 .25rem}
.event p{margin:0;font-size:var(--t-sm);color:var(--ink-2)}
@media (max-width:680px){.event .wrap{grid-template-columns:auto 1fr}.event .btn{grid-column:1/-1;justify-self:start}}

/* Teams */
.teams .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s5);align-items:center}
.teams h2{margin-bottom:var(--s2)}
.teams dl{margin:0;border-top:1px solid var(--line)}
.teams .row{padding:var(--s2) 0;border-bottom:1px solid var(--line)}
.teams dt{font-weight:700;color:var(--forest)}
.teams dd{margin:.2rem 0 0;font-size:var(--t-sm);color:var(--ink-2)}
@media (max-width:860px){.teams .wrap{grid-template-columns:1fr;gap:var(--s4)}}

/* Footer */
.footer{background:var(--forest);color:#C9D7D3;padding:var(--s5) 0 var(--s4);font-size:var(--t-sm);letter-spacing:.01em}
.fgrid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:var(--s4)}
.footer h3{font-size:var(--t-sm);text-transform:none;letter-spacing:0;color:#fff;margin-bottom:var(--s2)}
.footer ul{list-style:none;margin:0;padding:0}
.footer li{margin-bottom:.6rem;line-height:1.4}
.footer a{color:#C9D7D3;text-decoration:none}
.footer a:hover{color:#fff;text-decoration:underline}
.footer .flogo{height:2rem;width:auto;margin-bottom:var(--s3)}
.fbase{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s2);border-top:1px solid rgba(255,255,255,.15);margin-top:var(--s5);padding-top:var(--s3);font-size:var(--t-xs);opacity:.8}
@media (max-width:760px){.fgrid{grid-template-columns:1fr 1fr}.fgrid>div:first-child{grid-column:1/-1}}

/* Video slot (shared) */
.vid{position:relative;margin:0;border-radius:var(--r);overflow:hidden;background:var(--forest);aspect-ratio:16/9}
.vid video,.vid img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.vid video[hidden]{display:none}
.vid button{position:absolute;inset:0;width:100%;height:100%;background:linear-gradient(to top,rgba(17,59,53,.75),rgba(17,59,53,0) 60%);border:0;cursor:pointer;color:#fff;font:inherit;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:var(--s3);text-align:left;gap:var(--s1)}
.vid button .play{width:3.5rem;height:3.5rem;border-radius:50%;background:var(--teal);color:var(--forest);display:flex;align-items:center;justify-content:center;flex:none;transition:transform .2s var(--ease)}
.vid button:hover .play{transform:scale(1.06)}
.vid button .play svg{width:1.375rem;height:1.375rem;margin-left:3px}
.vid button b{font-size:var(--t-base);display:block}
.vid button span{font-size:var(--t-sm);opacity:.9}
.vid.playing button{display:none}
.vid-cap{font-size:var(--t-xs);color:var(--ink-2);margin-top:var(--s1)}

@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* Cookie consent banner */
.consent{position:fixed;left:1rem;right:1rem;bottom:1rem;z-index:70;max-width:40rem;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:0 12px 40px rgba(17,59,53,.18);padding:var(--s3);display:grid;gap:var(--s2)}
.consent p{margin:0;font-size:var(--t-sm);color:var(--ink)}
.consent div{display:flex;gap:var(--s1);flex-wrap:wrap;justify-content:flex-end}
.consent .btn{min-height:2.5rem;font-size:var(--t-sm);padding:0 var(--s2)}
@media print{.consent{display:none}}

/* ---------- Motion ---------- */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:calc(var(--i,0) * 70ms)}
.reveal.in{opacity:1;transform:none}
html.motion-done .reveal{transition:none!important;opacity:1!important;transform:none!important}
.hero-media.reveal{transform:scale(.985)}
.hero-media.reveal.in{transform:none}
.nav a:not(.btn){position:relative;padding-bottom:.2rem}
.nav a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:-.1rem;height:2px;background:var(--teal);transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease)}
.nav a:not(.btn):hover::after,.nav a.on::after,.nav a[aria-current]::after{transform:scaleX(1)}
.btn svg{transition:transform .2s var(--ease)}
.btn:hover svg{transform:translateX(3px)}
.textlink svg{transition:transform .2s var(--ease)}
.textlink:hover svg{transform:translateX(3px)}
.card a,.cases a,.feature,.clist{transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .2s}
.card a:hover,.cases a:hover{transform:translateY(-3px);box-shadow:0 14px 32px rgba(17,59,53,.10)}
.logos img{transition:filter .3s,opacity .3s}
.logos img:hover{filter:none;opacity:1}
.statbar li,.stats div{position:relative}
.statbar li::before{content:"";position:absolute;left:0;top:0;width:2px;height:0;background:var(--teal);transition:height .9s var(--ease) .2s}
.in .statbar li::before{height:100%}
.statbar li{border-left-color:transparent}
.vid{box-shadow:0 20px 50px rgba(17,59,53,.14)}
.vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}.in .statbar li::before{transition:none}}

/* Proof chips under hero CTAs */
.proof-line{display:flex;flex-wrap:wrap;gap:var(--s1) var(--s3);margin-top:var(--s3);padding-top:var(--s3);border-top:1px solid var(--line);font-size:var(--t-sm);color:var(--ink-2)}
.proof-line span{display:inline-flex;align-items:center;gap:.4rem}
.proof-line svg{width:.9rem;height:.9rem;color:var(--teal-deep)}

/* Home: video + values */
.vv{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:var(--s5);align-items:center}
.vv h2{margin-bottom:var(--s2)}
.vv .ccc{margin-top:var(--s3)}
@media (max-width:860px){.vv{grid-template-columns:1fr;gap:var(--s4)}}

/* Recognition chips */
.recog{list-style:none;margin:var(--s4) 0 0;padding:var(--s3) 0 0;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4)}
.recog li{display:flex;align-items:center;gap:.6rem;font-size:var(--t-sm);color:var(--ink-2)}
.recog .mark{flex:none;width:2.5rem;height:2.5rem;border-radius:50%;background:var(--teal-tint);color:var(--teal-deep);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.6rem;text-align:center;line-height:1}
.recog b{color:var(--forest);display:block}

/* Dark CTA band */
.cta-band{background:var(--forest);color:#DCE7E4;letter-spacing:.01em}
.cta-band .wrap{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:var(--s5);align-items:center;padding-top:var(--sec);padding-bottom:var(--sec)}
.cta-band .kicker{color:var(--teal)}
.cta-band h2{color:#fff;margin-bottom:var(--s2)}
.cta-band .lede{color:#B9CCC7;margin-bottom:var(--s3)}
.cta-band dl{margin:0;border-top:1px solid rgba(255,255,255,.15)}
.cta-band .row{padding:var(--s2) 0;border-bottom:1px solid rgba(255,255,255,.15)}
.cta-band dt{font-weight:700;color:#fff}
.cta-band dd{margin:.2rem 0 0;font-size:var(--t-sm);color:#B9CCC7}
.cta-band .btn-teal:hover{background:#fff;border-color:#fff}
@media (max-width:860px){.cta-band .wrap{grid-template-columns:1fr;gap:var(--s4)}}



/* Shared blocks used by home and about */
.cases{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}
.cases a{display:flex;flex-direction:column;height:100%;min-width:0;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--ink);background:#fff;transition:border-color .2s,transform .25s var(--ease),box-shadow .25s var(--ease)}
.cases a:hover{border-color:var(--teal-deep);transform:translateY(-3px);box-shadow:0 14px 32px rgba(17,59,53,.10)}
.cases .num{background:var(--forest);color:#fff;padding:1.5rem;min-height:7.5rem;display:flex;flex-direction:column;justify-content:flex-end}
.cases .num b{font-size:2.25rem;line-height:1;color:var(--teal);font-variant-numeric:tabular-nums}
.cases .num span{font-size:var(--t-sm);opacity:.85;margin-top:.3rem}
.cases .num.img{padding:0;min-height:0;aspect-ratio:16/9;overflow:hidden}
.cases .num.img img{width:100%;height:100%;object-fit:cover;object-position:center 20%}
.cases .txt{padding:1.25rem}
.cases h3{font-size:var(--t-lg);margin-bottom:.35rem}
.cases p{font-size:var(--t-sm);color:var(--ink-2);margin:0}
@media (max-width:860px){.cases{grid-template-columns:1fr}}
.free-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.5rem;align-items:stretch}
.free-box{background:var(--teal-tint);border-radius:var(--r);padding:2rem;display:flex;flex-direction:column}
.free-box h2{font-size:var(--t-h3);margin-bottom:.5rem}
.free-box p{color:var(--ink-2);margin-bottom:1rem}
.free-box ul{list-style:none;margin:0 0 1.5rem;padding:0;display:grid;gap:.5rem}
.free-box li a{font-weight:700;text-decoration:none;color:var(--forest)}
.free-box li a:hover{color:var(--teal-deep)}
.free-box li a::before{content:"Free";display:inline-block;background:var(--teal);color:var(--forest);font-size:.7rem;padding:.1rem .4rem;border-radius:3px;margin-right:.6rem;vertical-align:middle}
.free-box .btn{margin-top:auto;align-self:flex-start}
.capture{border:1px solid var(--line);border-radius:var(--r);padding:2rem;display:flex;flex-direction:column}
.capture h2{font-size:var(--t-h3);margin-bottom:.5rem}
.capture p{color:var(--ink-2);margin-bottom:1rem}
.capture form{display:grid;gap:.75rem;margin-top:auto}
.capture label{font-size:var(--t-sm);font-weight:700;color:var(--forest);display:grid;gap:.3rem}
.capture input,.capture select{font:inherit;padding:.7rem .8rem;border:1px solid var(--line);border-radius:var(--r);width:100%}
.capture small{font-size:.75rem;color:var(--ink-2)}
@media (max-width:860px){.free-row{grid-template-columns:1fr}}
.quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:1.5rem}
.quotes blockquote{margin:0;padding:1.5rem;border:1px solid var(--line);border-radius:var(--r);display:flex;flex-direction:column;background:#fff}
.quotes blockquote p{font-weight:600;color:var(--forest);line-height:1.45;margin-bottom:.75rem}
.quotes cite{font-style:normal;font-size:var(--t-sm);color:var(--ink-2);margin-top:auto}

/* ---------- Page header (all inner pages) ----------
   Dark-green panel with the page title; a teal side panel set in with one diagonal edge, carrying
   the page's facts, or a photo in the same slot. The same idea as the homepage hero, shorter. */
.phead{position:relative;background:var(--forest);color:#DCE7E4;overflow:hidden}
.phead .wrap{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:0 var(--s5);align-items:stretch}
.phead .crumbs{grid-column:1/-1;color:#B9CCC7;padding:var(--s2) 0 0}
.phead .crumbs a{color:#B9CCC7}
.phead .crumbs a:hover{color:#fff}
.phead-main{padding:var(--s4) 0 var(--s6);align-self:center}
.phead h1{color:#fff;margin-bottom:var(--s2);max-width:18ch}
.phead .lede{color:#DCE7E4;max-width:52ch}
.phead .lede a,.phead-main a:not(.btn){color:#fff}
.phead .kicker{color:var(--teal)}
.phead .btn-outline{color:#fff;border-color:rgba(255,255,255,.55)}
.phead .btn-outline:hover{background:#fff;color:var(--forest);border-color:#fff}
.phead-side{position:relative;color:var(--forest);padding:var(--s5) 0 var(--s5) var(--s6);display:flex;flex-direction:column;justify-content:center;min-height:16rem}
.phead-side::before{content:"";position:absolute;top:0;bottom:0;left:0;width:50vw;background:var(--teal);clip-path:polygon(2.75rem 0,100% 0,100% 100%,0 100%);z-index:0}
.phead-side>*{position:relative;z-index:1}
.phead-side.has-img{padding:0;min-height:18rem}
.phead-side.has-img img{position:absolute;top:0;bottom:0;left:0;width:50vw;height:100%;object-fit:cover;clip-path:polygon(2.75rem 0,100% 0,100% 100%,0 100%);margin:0}
.phead-side.has-img figure{margin:0;position:static}
.phead-side.has-img figcaption{position:absolute;right:0;bottom:0;background:var(--forest);color:#fff;padding:var(--s1) var(--s2);font-size:var(--t-xs);max-width:18rem;z-index:1}
.pfacts{list-style:none;margin:0;padding:0;display:grid;gap:var(--s2)}
.pfacts li{display:flex;gap:var(--s2);align-items:baseline;border-top:1px solid rgba(17,59,53,.22);padding-top:var(--s2)}
.pfacts li:first-child{border-top:0;padding-top:0}
.pfacts b{font-size:1.75rem;line-height:1;color:var(--forest);min-width:6rem;font-variant-numeric:tabular-nums;letter-spacing:-.02em;white-space:nowrap}
.pfacts span{font-size:var(--t-sm);font-weight:600;line-height:1.35}
.pfacts .todo{background:rgba(255,255,255,.7)}
.phead-side .plead{font-size:var(--t-lg);font-weight:700;line-height:1.3;letter-spacing:-.01em;max-width:18ch;margin:0}
.phead-side .plead+p{margin:var(--s2) 0 0;font-size:var(--t-sm);font-weight:600}
.phead-side p a{color:var(--forest)}
@media (max-width:860px){
  .phead .wrap{grid-template-columns:1fr}
  .phead-main{padding:var(--s4) 0 var(--s5)}
  .phead-side{padding:var(--s4) 0;min-height:0}
  .phead-side::before{left:calc(-1 * var(--pad));width:100vw;clip-path:none!important}
  .phead-side.has-img{min-height:0;aspect-ratio:16/9;padding:0}
  .phead-side.has-img img{left:calc(-1 * var(--pad));width:100vw;clip-path:none!important}
  .phead-side.has-img figcaption{right:calc(-1 * var(--pad))}
  .phead-side>*{padding:0}
}

/* Quieter proof: quotes as rules, not cards; Trustpilot line as text */
.quotes blockquote{border:0;border-left:3px solid var(--teal);border-radius:0;padding:0 0 0 var(--s3);background:none}
.tp{border:0;padding:0;margin-top:var(--s4)}
.plinks{list-style:none;margin:var(--s2) 0 0;padding:0}
.plinks li{border-top:1px solid rgba(17,59,53,.22)}
.plinks a{display:block;padding:.6rem 0;color:var(--forest);font-weight:700;text-decoration:none;font-size:var(--t-sm)}
.plinks a:hover{text-decoration:underline}

/* Footer capture row (every page; HubSpot form in the build) */
.fcap{margin-bottom:2.5rem;padding-bottom:2.5rem;border-bottom:1px solid rgba(255,255,255,.15);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2rem;align-items:center}
.fcap h3{font-size:var(--t-lg);letter-spacing:-.01em;color:#fff;margin-bottom:.35rem}
.fcap p{margin:0;font-size:var(--t-sm)}
.fcap form{display:flex;gap:.5rem;flex-wrap:wrap}
.fcap input{font:inherit;padding:.7rem .8rem;border:1px solid rgba(255,255,255,.3);border-radius:var(--r);background:rgba(255,255,255,.08);color:#fff;flex:1;min-width:12rem}
.fcap input::placeholder{color:#9FB5AF}
.fcap .btn{background:var(--teal);color:var(--forest);border-color:var(--teal)}
@media (max-width:760px){.fcap{grid-template-columns:1fr}}

/* Compact header: title and lede only, for utility pages */
.phead-compact .wrap{display:block}
.phead-compact .phead-main{padding:var(--s3) 0 var(--s5)}
.phead-compact h1{max-width:22ch}
.phead .price-line{color:#DCE7E4;margin-top:var(--s3)}
.phead .price-line b{color:#fff}
.phead .price-line .sep{color:rgba(255,255,255,.3)}
.phead-side.has-img{min-height:20rem}

/* Breadcrumbs: one line on small screens, the current page trimmed with an ellipsis */
@media (max-width:640px){.crumbs{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}