/* ==========================================================================
   Jane Hay Searches — Design System
   Brand core green sampled from the logo: #009C30
   ========================================================================== */

/* ---------- 1. Tokens ---------- */
:root{
  /* brand green ramp */
  --g50:#EAFBF0; --g100:#CDF5DB; --g200:#9FEBBB; --g300:#63DB92;
  --g400:#2ECB6C; --g500:#12B24F; --g600:#009C30; --g700:#027E2A;
  --g800:#076324; --g900:#084F20; --g950:#032B13;

  /* green-tinted neutrals */
  --n950:#05140D; --n900:#0A2117; --n800:#133023; --n700:#1E4534;
  --n600:#2F5F49; --n500:#4A7A63; --n400:#6F9C86; --n300:#9FC2B0;
  --n200:#C9DED4; --n100:#E4EFE9; --n50:#F3F8F5;

  /* accent (carried over from the existing brand orange) */
  --a300:#FCD34D; --a400:#FBBF24; --a500:#F59E0B; --a600:#D97706; --a700:#B45309;

  /* informational (diagrams only) */
  --t500:#0E9AA7; --t600:#0B7C87;
  --danger:#B4231F; --warn:#B45309; --ok:#027E2A;

  /* semantic — light */
  --bg:#FFFFFF;
  --bg-sub:var(--n50);
  --bg-elev:#FFFFFF;
  --bg-inset:var(--g50);
  --ink:var(--n900);
  --ink-soft:var(--n700);
  --ink-mute:var(--n600);
  --line:var(--n200);
  --line-soft:var(--n100);
  --brand:var(--g700);
  --brand-bright:var(--g600);
  --on-brand:#FFFFFF;
  --focus:var(--g500);

  /* depth */
  --sh-1:0 1px 2px rgba(5,20,13,.06), 0 1px 1px rgba(5,20,13,.04);
  --sh-2:0 4px 10px -2px rgba(5,20,13,.08), 0 2px 4px -2px rgba(5,20,13,.05);
  --sh-3:0 14px 30px -8px rgba(5,20,13,.14), 0 4px 10px -4px rgba(5,20,13,.07);
  --sh-4:0 30px 60px -16px rgba(5,20,13,.22), 0 10px 24px -12px rgba(5,20,13,.12);
  --sh-brand:0 18px 40px -14px rgba(0,124,42,.55);

  /* shape + motion */
  --r-xs:6px; --r-sm:10px; --r-md:14px; --r-lg:20px; --r-xl:28px; --r-2xl:36px; --r-pill:999px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --dur:.45s;

  /* type */
  --f-head:"Plus Jakarta Sans","Segoe UI",system-ui,-apple-system,sans-serif;
  --f-body:"Inter","Segoe UI",system-ui,-apple-system,sans-serif;

  --step--1:clamp(.82rem,.79rem + .12vw,.88rem);
  --step-0:clamp(1rem,.96rem + .2vw,1.075rem);
  --step-1:clamp(1.15rem,1.08rem + .34vw,1.32rem);
  --step-2:clamp(1.36rem,1.24rem + .6vw,1.7rem);
  --step-3:clamp(1.62rem,1.42rem + 1vw,2.2rem);
  --step-4:clamp(1.95rem,1.6rem + 1.7vw,2.95rem);
  --step-5:clamp(2.3rem,1.75rem + 2.7vw,3.9rem);
  --step-6:clamp(2.7rem,1.85rem + 4.1vw,5rem);

  --wrap:1240px;
  --wrap-narrow:760px;
  --gutter:clamp(1.15rem,4vw,2.5rem);
  --sec-y:clamp(3.5rem,7vw,7rem);
}

/* dark: explicit toggle wins, system preference otherwise */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#05140D; --bg-sub:#081C12; --bg-elev:#0C2418; --bg-inset:#0A2117;
    --ink:#EAF5EE; --ink-soft:#C2DCCD; --ink-mute:#9FC2B0;
    --line:#1B3D2B; --line-soft:#142E20;
    --brand:#2ECB6C; --brand-bright:#63DB92; --on-brand:#04220F;
    --sh-1:0 1px 2px rgba(0,0,0,.5);
    --sh-2:0 4px 12px rgba(0,0,0,.5);
    --sh-3:0 16px 34px -10px rgba(0,0,0,.65);
    --sh-4:0 34px 70px -20px rgba(0,0,0,.8);
    --sh-brand:0 18px 44px -14px rgba(18,178,79,.4);
  }
}
:root[data-theme="dark"]{
  --bg:#05140D; --bg-sub:#081C12; --bg-elev:#0C2418; --bg-inset:#0A2117;
  --ink:#EAF5EE; --ink-soft:#C2DCCD; --ink-mute:#9FC2B0;
  --line:#1B3D2B; --line-soft:#142E20;
  --brand:#2ECB6C; --brand-bright:#63DB92; --on-brand:#04220F;
  --sh-1:0 1px 2px rgba(0,0,0,.5);
  --sh-2:0 4px 12px rgba(0,0,0,.5);
  --sh-3:0 16px 34px -10px rgba(0,0,0,.65);
  --sh-4:0 34px 70px -20px rgba(0,0,0,.8);
  --sh-brand:0 18px 44px -14px rgba(18,178,79,.4);
}

/* ---------- 2. Reset & base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:6.5rem}
body{
  margin:0;background:var(--bg);color:var(--ink-soft);
  font-family:var(--f-body);font-size:var(--step-0);line-height:1.65;
  font-feature-settings:"cv11","ss01";
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img,svg,video{max-width:100%;height:auto;display:block}
h1,h2,h3,h4,h5{
  font-family:var(--f-head);color:var(--ink);
  line-height:1.1;letter-spacing:-.022em;margin:0 0 .55em;
  font-weight:800;text-wrap:balance;
}
h1{font-size:var(--step-6)} h2{font-size:var(--step-4)}
h3{font-size:var(--step-2)} h4{font-size:var(--step-1)}
p{margin:0 0 1.15em;text-wrap:pretty}
a{color:var(--brand);text-underline-offset:3px;text-decoration-thickness:1.5px}
a:hover{color:var(--brand-bright)}
ul,ol{margin:0 0 1.2em;padding-left:1.3em}
li{margin-bottom:.45em}
strong,b{font-weight:700;color:var(--ink)}
hr{border:0;border-top:1px solid var(--line);margin:2.5rem 0}
small{font-size:var(--step--1)}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:4px}
::selection{background:var(--g200);color:var(--n950)}
[hidden]{display:none!important}

/* ---------- 3. Layout ---------- */
.wrap{width:min(100% - var(--gutter)*2,var(--wrap));margin-inline:auto}
.wrap-narrow{width:min(100% - var(--gutter)*2,var(--wrap-narrow));margin-inline:auto}
.section{padding-block:var(--sec-y);position:relative}
.section--sub{background:var(--bg-sub)}
.section--inset{background:var(--bg-inset)}
.section--dark{background:var(--n950);color:#C2DCCD;--ink:#EAF5EE;--ink-soft:#C2DCCD;--ink-mute:#9FC2B0;--line:#1B3D2B;--brand:var(--g300);--bg-elev:#0C2418}
.section--dark h1,.section--dark h2,.section--dark h3,.section--dark h4{color:#F2FBF5}
.section--tight{padding-block:clamp(2.2rem,4vw,3.5rem)}
.grid{display:grid;gap:clamp(1rem,2.4vw,1.75rem)}
.g-2{grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr))}
.g-3{grid-template-columns:repeat(auto-fit,minmax(min(100%,17rem),1fr))}
.g-4{grid-template-columns:repeat(auto-fit,minmax(min(100%,15.75rem),1fr))}
.split{display:grid;gap:clamp(2rem,5vw,4.5rem);align-items:start;grid-template-columns:1fr}
.split--mid{align-items:center}
@media(min-width:60rem){.split{grid-template-columns:1fr 1fr}.split--wide{grid-template-columns:1.15fr .85fr}.split--rev>*:first-child{order:2}}
.stack>*+*{margin-top:1.1rem}
.center{text-align:center}
.measure{max-width:62ch}
.center .measure{margin-inline:auto}

/* ---------- 4. Eyebrow / section heads ---------- */
.eyebrow{
  display:inline-flex;align-items:center;gap:.55rem;
  font-family:var(--f-head);font-size:.735rem;font-weight:800;
  letter-spacing:.13em;text-transform:uppercase;color:var(--brand);
  margin:0 0 1rem;
}
.eyebrow::before{content:"";width:1.6rem;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--brand),transparent)}
.center .eyebrow{justify-content:center}
.lede{font-size:var(--step-1);color:var(--ink-mute);line-height:1.6;max-width:60ch}
.center .lede{margin-inline:auto}
.sec-head{margin-bottom:clamp(2rem,4vw,3.25rem)}

/* ---------- 5. Buttons ---------- */
.btn{
  --btn-bg:linear-gradient(180deg,#05702A,#03491A);
  --btn-fg:#fff;
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  font-family:var(--f-head);font-weight:700;font-size:.975rem;letter-spacing:-.005em;
  padding:.92rem 1.6rem;border-radius:var(--r-pill);border:1px solid transparent;
  background:var(--btn-bg);color:var(--btn-fg);text-decoration:none;cursor:pointer;
  box-shadow:var(--sh-2);position:relative;isolation:isolate;
  transition:transform .28s var(--ease-out),box-shadow .28s var(--ease-out),filter .28s;
  white-space:nowrap;
}
.btn::after{
  content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;
  background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,0) 55%);
  opacity:.9;
}
.btn:hover{transform:translateY(-2px);box-shadow:var(--sh-brand);color:var(--btn-fg)}
.btn:active{transform:translateY(0)}
.btn--lg{padding:1.1rem 2.1rem;font-size:1.05rem}
.btn--sm{padding:.6rem 1.1rem;font-size:.88rem}
.btn--accent{--btn-bg:linear-gradient(180deg,#FBBF24,#E0900A);--btn-fg:#2A1A02}
.btn--accent:hover{box-shadow:0 18px 40px -14px rgba(217,119,6,.6)}
.btn--ghost{
  --btn-bg:transparent;--btn-fg:var(--ink);
  border-color:var(--line);box-shadow:none;
}
.btn--ghost::after{display:none}
.btn--ghost:hover{border-color:var(--brand);color:var(--brand);box-shadow:var(--sh-2)}
.btn--light{--btn-bg:#fff;--btn-fg:#05140D;border-color:rgba(255,255,255,.6)}
.btn--outline-light{--btn-bg:transparent;--btn-fg:#fff;border-color:rgba(255,255,255,.42);box-shadow:none}
.btn--outline-light::after{display:none}
.btn--outline-light:hover{background:rgba(255,255,255,.1);border-color:#fff}
.btn-row{display:flex;flex-wrap:wrap;gap:.85rem;align-items:center}
.center .btn-row{justify-content:center}
.btn .i{width:1.1em;height:1.1em;flex:none}
.link-arrow{
  display:inline-flex;align-items:center;gap:.45rem;font-family:var(--f-head);
  font-weight:700;text-decoration:none;font-size:.95rem;
}
.link-arrow svg{width:1.1em;height:1.1em;flex:none;transition:transform .3s var(--ease-out)}
.link-arrow:hover svg{transform:translateX(4px)}

/* ---------- 6. Header ---------- */
.skip{
  position:absolute;left:.5rem;top:.5rem;z-index:999;transform:translateY(-160%);
  background:var(--g800);color:#fff;padding:.7rem 1.1rem;border-radius:var(--r-sm);
  text-decoration:none;font-weight:700;transition:transform .2s;
}
.skip:focus{transform:translateY(0);color:#fff}

.topbar{
  background:linear-gradient(90deg,var(--g900),var(--g700) 55%,var(--g600));
  color:#EAFBF0;font-size:.83rem;
}
.topbar .wrap{display:flex;flex-wrap:wrap;gap:.4rem 1.5rem;align-items:center;justify-content:space-between;padding-block:.5rem}
.topbar a,.topbar span{color:#EAFBF0;text-decoration:none;display:inline-flex;align-items:center;gap:.4rem}
.topbar svg{width:.95em;height:.95em;flex:none}
.topbar a:hover{color:#fff;text-decoration:underline}
.topbar-l,.topbar-r{display:flex;flex-wrap:wrap;gap:.4rem 1.35rem;align-items:center}
.topbar svg{width:1em;height:1em;opacity:.85}
@media(max-width:47.99rem){.topbar-r{display:none}}

.site-header{position:sticky;top:0;z-index:120;background:var(--bg);border-bottom:1px solid transparent;transition:box-shadow .3s,border-color .3s,background .3s}
.site-header.is-stuck{box-shadow:var(--sh-2);border-color:var(--line-soft);background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:saturate(180%) blur(14px)}
.nav{display:flex;align-items:center;gap:1.5rem;padding-block:.85rem;transition:padding .3s var(--ease)}
.site-header.is-stuck .nav{padding-block:.5rem}

.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;flex:none}
.brand svg{width:auto;height:2.55rem;transition:height .3s var(--ease)}
.site-header.is-stuck .brand svg{height:2.1rem}
.brand-txt{display:flex;flex-direction:column;line-height:1.05}
.brand-name{font-family:var(--f-head);font-weight:800;font-size:1.11rem;color:var(--ink);letter-spacing:-.025em}
.brand-sub{font-size:.63rem;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-mute);font-weight:600}
@media(max-width:22rem){.brand-txt{display:none}}
@media(max-width:30rem){.theme-toggle{display:none}}

.nav-list{display:flex;align-items:center;gap:.15rem;list-style:none;margin:0;padding:0;flex:1}
.nav-list>li{position:relative;margin:0}
.nav-link{
  display:inline-flex;align-items:center;gap:.35rem;
  font-family:var(--f-head);font-weight:650;font-size:.935rem;color:var(--ink);
  text-decoration:none;padding:.6rem .68rem;border-radius:var(--r-sm);white-space:nowrap;
  transition:color .2s,background .2s;
}
.nav-link:hover,.nav-link[aria-expanded="true"],.nav-link.is-current{color:var(--brand);background:var(--bg-inset)}
.nav-link .chev{width:.7rem;height:.7rem;transition:transform .25s var(--ease)}
.nav-link[aria-expanded="true"] .chev{transform:rotate(180deg)}
.nav-actions{display:flex;align-items:center;gap:.6rem;flex:none}
@media(max-width:74.99rem){.nav-list,.nav-actions .btn--ghost{display:none}}

/* mega menu */
.mega{
  position:absolute;top:calc(100% + .5rem);left:50%;translate:-50% 0;
  width:min(94vw,var(--mega-w,58rem));
  background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--r-xl);
  box-shadow:var(--sh-4);padding:1.6rem;z-index:130;
  opacity:0;visibility:hidden;transform:translateY(-8px) scale(.985);
  transition:opacity .25s var(--ease),transform .3s var(--ease-out),visibility .25s;
}
.nav-list>li.is-open .mega{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.mega-grid{display:grid;gap:1.5rem;grid-template-columns:repeat(var(--mega-cols,3),1fr)}
.mega-head{font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-mute);margin:0 0 .7rem;font-weight:800}
.mega ul{list-style:none;margin:0;padding:0}
.mega li{margin:0}
.mega-item{
  display:flex;gap:.7rem;align-items:flex-start;padding:.5rem .6rem;border-radius:var(--r-sm);
  text-decoration:none;color:var(--ink);transition:background .2s,transform .2s;
}
.mega-item:hover{background:var(--bg-inset);transform:translateX(3px);color:var(--ink)}
.mega-ico{
  width:2.05rem;height:2.05rem;flex:none;border-radius:9px;display:grid;place-items:center;
  background:linear-gradient(145deg,var(--g100),var(--g50));color:var(--g700);
  box-shadow:inset 0 1px 0 #fff, 0 1px 2px rgba(5,20,13,.08);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .mega-ico{background:linear-gradient(145deg,#0F3A22,#0A2A18);color:#63DB92;box-shadow:none}
}
:root[data-theme="dark"] .mega-ico{background:linear-gradient(145deg,#0F3A22,#0A2A18);color:#63DB92;box-shadow:none}
.mega-ico svg{width:1.05rem;height:1.05rem}
.mega-item b{display:block;font-family:var(--f-head);font-size:.9rem;font-weight:700;line-height:1.3;color:var(--ink)}
.mega-item span{display:block;font-size:.79rem;color:var(--ink-mute);line-height:1.4}
.mega-promo{
  background:linear-gradient(150deg,var(--g800),var(--g950));color:#CDF5DB;
  border-radius:var(--r-lg);padding:1.25rem;display:flex;flex-direction:column;justify-content:space-between;gap:1rem;
}
.mega-promo b{display:block;font-family:var(--f-head);font-size:1.02rem;color:#fff;margin-bottom:.35rem}
.mega-promo p{font-size:.84rem;margin:0;line-height:1.5}

/* mobile nav */
.burger{
  display:none;width:2.85rem;height:2.85rem;border:1px solid var(--line);background:var(--bg-elev);
  border-radius:var(--r-sm);cursor:pointer;place-items:center;flex:none;color:var(--ink);
}
@media(max-width:74.99rem){.burger{display:grid}}
.burger span{display:block;width:1.15rem;height:2px;background:currentColor;border-radius:2px;position:relative;transition:transform .3s var(--ease),background .2s}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:1.15rem;height:2px;background:currentColor;border-radius:2px;transition:transform .3s var(--ease),top .3s}
.burger span::before{top:-6px}.burger span::after{top:6px}
.burger[aria-expanded="true"] span{background:transparent}
.burger[aria-expanded="true"] span::before{top:0;transform:rotate(45deg)}
.burger[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg)}

.mobile-nav{
  position:fixed;inset:0 0 0 auto;width:min(26rem,100%);background:var(--bg);z-index:200;
  transform:translateX(100%);transition:transform .4s var(--ease-out);
  overflow-y:auto;padding:1.25rem var(--gutter) 3rem;box-shadow:var(--sh-4);
  display:flex;flex-direction:column;gap:.4rem;
}
.mobile-nav.is-open{transform:translateX(0)}
.mobile-nav__head{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}
.m-close{width:2.6rem;height:2.6rem;border:1px solid var(--line);background:none;border-radius:var(--r-sm);color:var(--ink);cursor:pointer;font-size:1.3rem;line-height:1}
.m-group{border-bottom:1px solid var(--line-soft)}
.m-group>summary{
  list-style:none;cursor:pointer;padding:.9rem .25rem;font-family:var(--f-head);font-weight:700;
  display:flex;justify-content:space-between;align-items:center;color:var(--ink);
}
.m-group>summary::-webkit-details-marker{display:none}
.m-group>summary::after{content:"";width:.55rem;height:.55rem;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .25s;margin-right:.4rem}
.m-group[open]>summary::after{transform:rotate(-135deg)}
.m-group ul{list-style:none;margin:0 0 .7rem;padding:0 0 0 .25rem}
.m-group a,.m-link{display:block;padding:.55rem .25rem;color:var(--ink-soft);text-decoration:none;font-size:.95rem}
.m-group a:hover,.m-link:hover{color:var(--brand)}
.m-link{font-family:var(--f-head);font-weight:700;color:var(--ink);border-bottom:1px solid var(--line-soft);padding:.9rem .25rem}
.scrim{position:fixed;inset:0;background:rgba(5,20,13,.5);backdrop-filter:blur(3px);z-index:190;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
.scrim.is-on{opacity:1;visibility:visible}
body.nav-open{overflow:hidden}

/* ---------- 7. Decorative field (mesh + grid + noise) ---------- */
.field{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.field>*{position:absolute}
.blob{border-radius:50%;filter:blur(70px);opacity:.5;will-change:transform}
.blob--a{width:38rem;height:38rem;background:radial-gradient(circle,#12B24F,transparent 68%);top:-14rem;right:-10rem}
.blob--b{width:30rem;height:30rem;background:radial-gradient(circle,#0E9AA7,transparent 70%);bottom:-12rem;left:-8rem;opacity:.32}
.blob--c{width:22rem;height:22rem;background:radial-gradient(circle,#FBBF24,transparent 70%);top:35%;left:45%;opacity:.16}
.gridlines{
  inset:0;
  background-image:linear-gradient(var(--gl,rgba(255,255,255,.045)) 1px,transparent 1px),
                   linear-gradient(90deg,var(--gl,rgba(255,255,255,.045)) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(ellipse 90% 70% at 50% 30%,#000 30%,transparent 78%);
          mask-image:radial-gradient(ellipse 90% 70% at 50% 30%,#000 30%,transparent 78%);
}
.section--light .gridlines{--gl:rgba(5,20,13,.05)}
.noise{
  inset:0;opacity:.4;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");
}
.section>.wrap,.hero>.wrap{position:relative;z-index:1}

/* ---------- 8. Hero ---------- */
.hero{
  position:relative;overflow:hidden;isolation:isolate;
  background:
    radial-gradient(120% 90% at 78% 8%,#0B5A26 0%,transparent 55%),
    radial-gradient(90% 80% at 8% 92%,#073E1C 0%,transparent 60%),
    linear-gradient(165deg,#062A15,#04140C 62%,#031009);
  color:#C8E6D5;
  padding-block:clamp(3.5rem,8vw,7rem) clamp(4rem,9vw,8rem);
}
.hero h1{color:#fff}
.hero .lede{color:#B4D8C3;font-size:var(--step-1)}
.hero .eyebrow{color:var(--g300)}
.hero-grid{display:grid;gap:clamp(2.5rem,5vw,4rem);align-items:center;grid-template-columns:1fr}
@media(min-width:64rem){.hero-grid{grid-template-columns:1.02fr .98fr}}
.hero-pill{
  display:inline-flex;align-items:center;gap:.6rem;padding:.4rem .95rem .4rem .45rem;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
  border-radius:var(--r-pill);font-size:.82rem;color:#CDF5DB;margin-bottom:1.5rem;
  backdrop-filter:blur(6px);
}
.hero-pill b{background:var(--g500);color:#04220F;font-size:.68rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:.25rem .6rem;border-radius:var(--r-pill)}
.hero-trust{display:grid;grid-template-columns:repeat(2,1fr);gap:1.4rem;margin-top:2.5rem;padding-top:1.75rem;border-top:1px solid rgba(255,255,255,.12)}
@media(min-width:34rem){.hero-trust{grid-template-columns:repeat(4,1fr)}}
.hero-trust b{display:block;font-family:var(--f-head);font-size:1.7rem;font-weight:800;color:#fff;line-height:1.1;letter-spacing:-.03em}
.hero-trust span{font-size:.79rem;color:#8FBBA1;letter-spacing:.02em}

/* 3D layered scene — an isometric stack of property data layers */
.scene{perspective:2400px;position:relative;min-height:33rem;display:grid;place-items:center}
.scene-stack{
  position:relative;width:min(88%,24rem);aspect-ratio:1/1;transform-style:preserve-3d;
  transform:rotateX(60deg) rotateZ(-42deg);
  transition:transform .55s var(--ease-out);
  animation:sceneIn 1.2s var(--ease-out) both;
}
@keyframes sceneIn{from{opacity:0;transform:rotateX(76deg) rotateZ(-54deg) translateY(70px)}
                   to{opacity:1;transform:rotateX(60deg) rotateZ(-42deg)}}
.plate{
  position:absolute;left:0;top:0;width:74%;height:74%;border-radius:16px;
  background:linear-gradient(145deg,rgba(14,80,40,.95),rgba(4,26,14,.92));
  border:1.5px solid rgba(90,220,140,.5);
  box-shadow:0 26px 46px -20px rgba(0,0,0,.92), inset 0 1px 0 rgba(255,255,255,.18);
  animation:float 7s ease-in-out infinite;overflow:hidden;
}
/* faint "data" texture so each plate reads as a map layer */
.plate::before{
  content:"";position:absolute;inset:0;opacity:.5;
  background-image:linear-gradient(rgba(120,240,170,.16) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(120,240,170,.16) 1px,transparent 1px);
  background-size:26px 26px;
}
.plate::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(145deg,rgba(46,203,108,.28),transparent 58%);
}
.plate:nth-child(1){transform:translate3d(26%,26%,0)}
.plate:nth-child(2){transform:translate3d(19.5%,19.5%,58px);animation-delay:.3s}
.plate:nth-child(3){transform:translate3d(13%,13%,116px);animation-delay:.6s}
.plate:nth-child(4){transform:translate3d(6.5%,6.5%,174px);animation-delay:.9s}
.plate:nth-child(5){transform:translate3d(0,0,232px);animation-delay:1.2s;
  background:linear-gradient(145deg,rgba(28,140,68,.97),rgba(9,60,31,.95));
  border-color:rgba(150,250,190,.8)}
@keyframes float{0%,100%{translate:0 0}50%{translate:0 -8px}}
.scene-glow{position:absolute;width:60%;height:60%;border-radius:50%;
  background:radial-gradient(circle,rgba(18,178,79,.4),transparent 70%);filter:blur(60px);z-index:-1}

/* readable 2D legend beside the stack */
.scene-legend{
  position:absolute;right:2%;bottom:2%;z-index:4;margin:0;padding:.85rem 1rem;list-style:none;
  background:rgba(4,20,12,.82);border:1px solid rgba(255,255,255,.14);border-radius:var(--r-md);
  backdrop-filter:blur(10px);box-shadow:var(--sh-4);display:grid;gap:.4rem;
}
.scene-legend li{margin:0;display:flex;align-items:center;gap:.55rem;
  font-size:.79rem;font-family:var(--f-head);font-weight:650;color:#DFF3E6;white-space:nowrap}
.scene-legend i{width:.55rem;height:.55rem;border-radius:2px;flex:none;
  background:var(--dot,#2ECB6C);box-shadow:0 0 10px var(--dot,#2ECB6C)}
@media(max-width:30rem){.scene-legend{position:static;margin-top:1.25rem;justify-self:stretch}}

/* floating stat chips over the scene */
.chip{
  position:absolute;z-index:3;background:rgba(6,26,16,.82);border:1px solid rgba(255,255,255,.16);
  border-radius:var(--r-md);padding:.7rem .95rem;box-shadow:var(--sh-4);backdrop-filter:blur(10px);
  display:flex;align-items:center;gap:.65rem;animation:float 6s ease-in-out infinite;
}
.chip b{font-family:var(--f-head);font-size:.92rem;color:#fff;display:block;line-height:1.2}
.chip span{font-size:.72rem;color:#8FBBA1;display:block}
.chip i{width:2rem;height:2rem;border-radius:8px;display:grid;place-items:center;background:var(--g600);color:#fff;flex:none}
.chip i svg{width:1rem;height:1rem}
.chip--1{top:8%;left:0;animation-delay:.4s}
.chip--2{top:20%;right:0;animation-delay:1.4s}
@media(max-width:64rem){.chip--1{left:0}.chip--2{right:0}}

/* ---------- 9. Cards ---------- */
.card{
  background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(1.4rem,2.4vw,1.9rem);box-shadow:var(--sh-1);position:relative;overflow:hidden;
  transition:transform .35s var(--ease-out),box-shadow .35s var(--ease-out),border-color .35s;
  display:flex;flex-direction:column;
}
.card::before{
  content:"";position:absolute;inset:0 0 auto;height:3px;
  background:linear-gradient(90deg,var(--g600),var(--g300));
  transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease-out);
}
.card:hover{transform:translateY(-6px);box-shadow:var(--sh-3);border-color:color-mix(in srgb,var(--g500) 40%,var(--line))}
.card:hover::before{transform:scaleX(1)}
.card h3{font-size:var(--step-1);margin-bottom:.5rem}
.card p{color:var(--ink-mute);font-size:.945rem;margin-bottom:1rem}
.card>.link-arrow{margin-top:auto}
.card--link{text-decoration:none;color:inherit}
.card-ico{
  width:3.1rem;height:3.1rem;border-radius:var(--r-md);display:grid;place-items:center;
  margin-bottom:1.1rem;flex:none;position:relative;
  background:linear-gradient(150deg,var(--g500),var(--g800));color:#fff;
  box-shadow:0 10px 22px -10px rgba(0,124,42,.7),inset 0 1px 0 rgba(255,255,255,.35);
}
.card-ico svg{width:1.5rem;height:1.5rem}
.card--flat{box-shadow:none;background:var(--bg-sub)}
.card--dark{background:linear-gradient(155deg,#0C3018,#061A0F);border-color:#1B3D2B;color:#C2DCCD}
.card--dark h3{color:#fff}
.card--feature{grid-column:span 1}
@media(min-width:60rem){.card--feature{grid-column:span 2}}
.badge{
  display:inline-block;align-self:flex-start;font-family:var(--f-head);font-size:.68rem;font-weight:800;
  letter-spacing:.1em;text-transform:uppercase;padding:.28rem .6rem;border-radius:var(--r-xs);
  background:var(--g100);color:var(--g800);margin-bottom:.85rem;
}
.badge--accent{background:#FEF3C7;color:#92400E}
.badge--new{background:var(--g700);color:#fff}

/* 3D tilt */
.tilt{transform-style:preserve-3d;will-change:transform}
.tilt-inner{transform:translateZ(28px)}

/* ---------- 10. Trust strip / marquee ---------- */
.trust-strip{border-block:1px solid var(--line);background:var(--bg-sub);padding-block:1.6rem;overflow:hidden}
.trust-strip p{text-align:center;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-mute);font-weight:700;margin:0 0 1.1rem}
.marquee{display:flex;gap:3rem;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee-track{display:flex;gap:3rem;align-items:center;flex:none;animation:scrollX 34s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
@keyframes scrollX{to{transform:translateX(-100%)}}
.accred{
  display:flex;align-items:center;gap:.7rem;flex:none;
  font-family:var(--f-head);font-weight:700;font-size:.95rem;color:var(--ink-soft);white-space:nowrap;
}
.accred i{width:2.4rem;height:2.4rem;border-radius:10px;display:grid;place-items:center;background:var(--bg-elev);border:1px solid var(--line);color:var(--brand);flex:none}
.accred i svg{width:1.2rem;height:1.2rem}
.accred span{display:block;font-size:.72rem;font-weight:500;color:var(--ink-mute)}

/* ---------- 11. Stats ---------- */
.stats{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,11rem),1fr));text-align:center}
.stat b{display:block;font-family:var(--f-head);font-size:clamp(2.2rem,5vw,3.4rem);font-weight:800;letter-spacing:-.04em;line-height:1;
  background:linear-gradient(160deg,var(--g400),var(--g700));-webkit-background-clip:text;background-clip:text;color:transparent}
.section--dark .stat b{background:linear-gradient(160deg,#8FEDB0,#22C55E);-webkit-background-clip:text;background-clip:text}
.stat span{display:block;margin-top:.5rem;font-size:.88rem;color:var(--ink-mute);line-height:1.4}

/* ---------- 12. Process steps ---------- */
.steps{counter-reset:s;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));position:relative}
.step{position:relative;padding-top:3.6rem}
.step::before{
  counter-increment:s;content:counter(s,decimal-leading-zero);
  position:absolute;top:0;left:0;width:2.7rem;height:2.7rem;border-radius:50%;
  display:grid;place-items:center;font-family:var(--f-head);font-weight:800;font-size:.85rem;
  background:linear-gradient(160deg,var(--g500),var(--g800));color:#fff;
  box-shadow:0 10px 20px -10px rgba(0,124,42,.8),inset 0 1px 0 rgba(255,255,255,.4);
}
.step::after{content:"";position:absolute;top:1.35rem;left:3.1rem;right:-1.5rem;height:2px;background:linear-gradient(90deg,var(--line),transparent)}
.step:last-child::after{display:none}
@media(max-width:47.99rem){.step::after{display:none}}
.step h3{font-size:var(--step-1)}
.step p{color:var(--ink-mute);font-size:.94rem;margin:0}

/* ---------- 13. Feature list ---------- */
.ticks{list-style:none;padding:0;margin:0;display:grid;gap:.85rem}
.ticks li{position:relative;padding-left:2.1rem;margin:0;color:var(--ink-soft)}
.ticks li::before{
  content:"";position:absolute;left:0;top:.24em;width:1.35rem;height:1.35rem;border-radius:50%;
  background:var(--g100);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23027E2A' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  background-size:.85rem;background-position:center;background-repeat:no-repeat;
}
.section--dark .ticks li::before{background-color:rgba(46,203,108,.18);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2363DB92' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}
.ticks--2{grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));gap:.85rem 1.75rem}
.crosses li::before{background-color:#FEE2E2;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B4231F' stroke-width='3.4' stroke-linecap='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E")}

/* ---------- 14. Quote / testimonial ---------- */
.quote{
  background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--r-xl);
  padding:clamp(1.75rem,3.5vw,2.75rem);box-shadow:var(--sh-2);position:relative;
}
.quote::before{
  content:"";position:absolute;top:1.25rem;right:1.5rem;width:3rem;height:3rem;opacity:.12;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23009C30'%3E%3Cpath d='M7 7h4v4H9c0 2 1 3 2 3v3c-3 0-4-3-4-6V7zm8 0h4v4h-2c0 2 1 3 2 3v3c-3 0-4-3-4-6V7z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.quote blockquote{margin:0 0 1.25rem;font-size:var(--step-1);line-height:1.55;color:var(--ink);font-family:var(--f-head);font-weight:600;letter-spacing:-.015em}
.quote figcaption{display:flex;align-items:center;gap:.85rem;font-size:.9rem}
.avatar{width:2.75rem;height:2.75rem;border-radius:50%;background:linear-gradient(150deg,var(--g400),var(--g800));color:#fff;display:grid;place-items:center;font-family:var(--f-head);font-weight:800;flex:none}
.quote figcaption b{display:block;color:var(--ink)}
.quote figcaption span{display:block;color:var(--ink-mute);font-size:.83rem}

/* ---------- 15. CTA band ---------- */
.cta-band{
  position:relative;overflow:hidden;border-radius:var(--r-2xl);
  background:radial-gradient(110% 130% at 82% 10%,#0C6E30,transparent 58%),linear-gradient(150deg,#07421D,#04170D);
  color:#C8E6D5;padding:clamp(2.25rem,5vw,4rem);isolation:isolate;
}
.cta-band h2{color:#fff}
.cta-band p{color:#AFD6BF}
.cta-band .field{border-radius:inherit}

/* ---------- 16. FAQ ---------- */
.faq{display:grid;gap:.75rem}
.faq details{
  background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;transition:border-color .3s,box-shadow .3s;
}
.faq details[open]{border-color:color-mix(in srgb,var(--g500) 45%,var(--line));box-shadow:var(--sh-2)}
.faq summary{
  list-style:none;cursor:pointer;padding:1.1rem 3rem 1.1rem 1.35rem;position:relative;
  font-family:var(--f-head);font-weight:700;color:var(--ink);font-size:1.02rem;line-height:1.45;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";position:absolute;right:1.35rem;top:1.4rem;width:.85rem;height:.85rem;
  border-right:2.5px solid var(--brand);border-bottom:2.5px solid var(--brand);
  transform:rotate(45deg);transition:transform .3s var(--ease);
}
.faq details[open] summary::after{transform:rotate(-135deg);top:1.6rem}
.faq-body{padding:0 1.35rem 1.35rem;color:var(--ink-mute);animation:fadeUp .35s var(--ease-out)}
.faq-body>*:last-child{margin-bottom:0}
@keyframes fadeUp{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* ---------- 17. Tables ---------- */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg-elev);-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse;font-size:.94rem;min-width:34rem}
th,td{padding:.85rem 1.1rem;text-align:left;border-bottom:1px solid var(--line-soft);vertical-align:top}
thead th{background:var(--bg-inset);font-family:var(--f-head);font-weight:800;color:var(--ink);font-size:.82rem;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover{background:var(--bg-sub)}
caption{caption-side:bottom;padding-top:.75rem;font-size:.82rem;color:var(--ink-mute);text-align:left}

/* ---------- 18. Prose (blog / legal) ---------- */
.prose{max-width:70ch}
.prose h2{font-size:var(--step-3);margin-top:2.4em}
.prose h3{font-size:var(--step-1);margin-top:1.9em}
.prose h2:first-child,.prose h3:first-child{margin-top:0}
.prose>ul,.prose>ol{color:var(--ink-soft)}
.prose blockquote{
  margin:1.9rem 0;padding:1.1rem 1.4rem;border-left:4px solid var(--g500);
  background:var(--bg-inset);border-radius:0 var(--r-md) var(--r-md) 0;color:var(--ink-soft);font-style:normal;
}
.prose blockquote p:last-child{margin:0}
.callout{
  display:flex;gap:1rem;padding:1.15rem 1.35rem;border-radius:var(--r-md);
  background:var(--bg-inset);border:1px solid var(--line);margin:1.9rem 0;
}
.callout svg{width:1.4rem;height:1.4rem;flex:none;color:var(--brand);margin-top:.15rem}
.callout>div>*:last-child{margin-bottom:0}
.callout b{display:block;font-family:var(--f-head);color:var(--ink);margin-bottom:.25rem}
.callout--warn{background:#FFFBEB;border-color:#FDE68A}
.callout--warn svg{color:#B45309}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .callout--warn{background:#2A1F08;border-color:#54400F}}
:root[data-theme="dark"] .callout--warn{background:#2A1F08;border-color:#54400F}

/* ---------- 19. Page hero (interior) ---------- */
.phero{
  position:relative;overflow:hidden;isolation:isolate;
  background:radial-gradient(100% 120% at 85% 0%,#0A5A26,transparent 58%),linear-gradient(160deg,#062A15,#04140C);
  color:#B4D8C3;padding-block:clamp(2.75rem,6vw,4.75rem) clamp(3rem,6vw,5rem);
}
.phero h1{color:#fff;font-size:var(--step-5);max-width:20ch}
.phero .lede{color:#AFD6BF;max-width:58ch}
.phero .eyebrow{color:var(--g300)}
.phero--split .wrap{display:grid;gap:2.5rem;align-items:center}
@media(min-width:64rem){.phero--split .wrap{grid-template-columns:1.15fr .85fr}}
.crumbs{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;padding:0;margin:0 0 1.35rem;font-size:.82rem}
.crumbs li{margin:0;display:flex;align-items:center;gap:.4rem;color:#8FBBA1}
.crumbs li+li::before{content:"/";opacity:.5}
.crumbs a{color:#8FBBA1;text-decoration:none}
.crumbs a:hover{color:#fff;text-decoration:underline}
.crumbs [aria-current]{color:#DFF6E7}

/* ---------- 20. Forms ---------- */
.form-card{
  background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--r-xl);
  padding:clamp(1.5rem,3vw,2.5rem);box-shadow:var(--sh-3);
}
.fieldset{border:0;padding:0;margin:0 0 2rem}
.fieldset legend{
  font-family:var(--f-head);font-weight:800;font-size:.75rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--brand);padding:0;margin-bottom:1.1rem;
  display:flex;align-items:center;gap:.6rem;width:100%;
}
.fieldset legend::after{content:"";flex:1;height:1px;background:var(--line)}
.f-grid{display:grid;gap:1.1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr))}
.f-grid--full{grid-template-columns:1fr}
.field-row{display:flex;flex-direction:column;gap:.4rem}
.field-row--full{grid-column:1/-1}
label{font-family:var(--f-head);font-weight:650;font-size:.885rem;color:var(--ink)}
label .req{color:#B4231F;margin-left:.15rem}
.hint{font-size:.79rem;color:var(--ink-mute);line-height:1.45}
input[type=text],input[type=email],input[type=tel],input[type=url],input[type=number],input[type=date],select,textarea{
  width:100%;font:inherit;font-size:.97rem;color:var(--ink);background:var(--bg);
  border:1.5px solid var(--line);border-radius:var(--r-sm);padding:.78rem .95rem;
  transition:border-color .2s,box-shadow .2s,background .2s;
}
textarea{min-height:8.5rem;resize:vertical}
select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232F5F49' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .85rem center;background-size:1.05rem;padding-right:2.6rem}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--g500);box-shadow:0 0 0 4px color-mix(in srgb,var(--g500) 22%,transparent)}
input:user-invalid,textarea:user-invalid,select:user-invalid{border-color:#B4231F}
input::placeholder,textarea::placeholder{color:var(--ink-mute);opacity:.75}
.choice-grid{display:grid;gap:.7rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr))}
.choice{
  position:relative;display:flex;gap:.75rem;align-items:flex-start;
  border:1.5px solid var(--line);border-radius:var(--r-md);padding:.85rem 1rem;cursor:pointer;
  background:var(--bg);transition:border-color .2s,background .2s,box-shadow .2s,transform .2s;
}
.choice:hover{border-color:var(--g400);transform:translateY(-1px)}
.choice input{position:absolute;opacity:0;width:0;height:0}
.choice-box{
  width:1.25rem;height:1.25rem;border:2px solid var(--n300);border-radius:5px;flex:none;margin-top:.12rem;
  display:grid;place-items:center;transition:background .2s,border-color .2s;
}
.choice input[type=radio]+.choice-box{border-radius:50%}
.choice-box::after{content:"";width:.6rem;height:.6rem;border-radius:2px;background:#fff;opacity:0;transform:scale(.4);transition:opacity .2s,transform .2s}
.choice input[type=radio]+.choice-box::after{border-radius:50%}
.choice input:checked+.choice-box{background:var(--g700);border-color:var(--g700)}
.choice input:checked+.choice-box::after{opacity:1;transform:scale(1)}
.choice input:focus-visible+.choice-box{box-shadow:0 0 0 4px color-mix(in srgb,var(--g500) 25%,transparent)}
.choice:has(input:checked){border-color:var(--g600);background:var(--bg-inset);box-shadow:var(--sh-1)}
.choice-txt b{display:block;font-family:var(--f-head);font-weight:700;font-size:.93rem;color:var(--ink);line-height:1.35}
.choice-txt span{display:block;font-size:.79rem;color:var(--ink-mute);line-height:1.45;margin-top:.15rem}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.form-note{font-size:.83rem;color:var(--ink-mute);margin-top:1rem}
.form-msg{padding:1rem 1.2rem;border-radius:var(--r-md);margin-bottom:1.5rem;font-size:.94rem;border:1px solid}
.form-msg--ok{background:var(--g50);border-color:var(--g200);color:var(--g900)}
.form-msg--err{background:#FEF2F2;border-color:#FECACA;color:#7F1D1D}

/* progress bar for multi-step quote */
.f-progress{display:flex;gap:.4rem;margin-bottom:2rem;counter-reset:p}
.f-progress li{flex:1;list-style:none;margin:0;font-size:.75rem;font-family:var(--f-head);font-weight:700;color:var(--ink-mute);padding-top:.7rem;border-top:3px solid var(--line);transition:color .3s,border-color .3s}
.f-progress li[aria-current]{color:var(--brand);border-top-color:var(--g500)}

/* ---------- 21. Footer ---------- */
.site-footer{background:#04140C;color:#9FC2B0;padding-block:clamp(3rem,6vw,4.5rem) 0;position:relative;overflow:hidden}
.site-footer .f-head{font-family:var(--f-head);font-size:.76rem;letter-spacing:.13em;text-transform:uppercase;color:#fff;margin:0 0 1.1rem;font-weight:800}
.f-grid-main{display:grid;gap:2.5rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr))}
@media(min-width:64rem){.f-grid-main{grid-template-columns:1.6fr 1fr 1fr 1fr 1.2fr}}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{margin-bottom:.55rem}
.site-footer a{color:#9FC2B0;text-decoration:none;font-size:.92rem;transition:color .2s,padding-left .2s}
.site-footer a:hover{color:#63DB92;padding-left:3px}
.f-brand{max-width:22rem}
.f-brand p{font-size:.9rem;line-height:1.6;color:#8FBBA1}
.f-brand .brand-name{color:#fff}
.f-brand .brand-sub{color:#6F9C86}
.f-contact li{display:flex;gap:.65rem;align-items:flex-start;font-size:.92rem;color:#9FC2B0}
.f-contact svg{width:1.05rem;height:1.05rem;flex:none;margin-top:.25rem;color:#2ECB6C}
.f-badges{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1.4rem}
.f-badge{
  display:inline-flex;align-items:center;gap:.4rem;font-size:.72rem;font-weight:700;font-family:var(--f-head);
  padding:.4rem .7rem;border:1px solid #1B3D2B;border-radius:var(--r-pill);color:#CDF5DB;background:#08281700;
}
.f-badge svg{width:.85rem;height:.85rem;color:#2ECB6C}
.f-bottom{
  margin-top:3rem;border-top:1px solid #14301F;padding-block:1.5rem;
  display:flex;flex-wrap:wrap;gap:.75rem 1.5rem;justify-content:space-between;align-items:center;font-size:.82rem;color:#6F9C86;
}
.f-bottom ul{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem}
.f-bottom li{margin:0}
.f-bottom a{font-size:.82rem}
.socials{display:flex;gap:.5rem;margin-top:1.35rem}
.socials a{width:2.35rem;height:2.35rem;border:1px solid #1B3D2B;border-radius:10px;display:grid;place-items:center;color:#9FC2B0;transition:background .2s,color .2s,transform .2s,border-color .2s}
.socials a:hover{background:var(--g700);color:#fff;transform:translateY(-2px);padding-left:0;border-color:var(--g700)}
.socials svg{width:1.05rem;height:1.05rem}

/* ---------- 22. Blog ---------- */
.post-card{display:flex;flex-direction:column;background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;transition:transform .35s var(--ease-out),box-shadow .35s}
.post-card:hover{transform:translateY(-5px);box-shadow:var(--sh-3)}
.post-thumb{aspect-ratio:16/9;background:linear-gradient(150deg,var(--g700),var(--g950));position:relative;display:grid;place-items:center;overflow:hidden}
.post-thumb svg{width:38%;height:auto;opacity:.9}
.post-body{padding:1.4rem;display:flex;flex-direction:column;flex:1}
.post-meta{font-size:.78rem;color:var(--ink-mute);display:flex;gap:.7rem;flex-wrap:wrap;margin-bottom:.6rem}
.post-body h3{font-size:1.12rem;margin-bottom:.5rem;letter-spacing:-.015em}
.post-body h3 a{color:var(--ink);text-decoration:none}
.post-body h3 a:hover{color:var(--brand)}
.post-body p{font-size:.92rem;color:var(--ink-mute);margin-bottom:1rem}
.post-body .link-arrow{margin-top:auto}

/* ---------- 23. Anchor / on-page nav ---------- */
.jumpnav{position:sticky;top:5.2rem;align-self:start;font-size:.9rem}
.jumpnav .jump-head{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-mute);margin:0 0 .8rem;font-weight:800;font-family:var(--f-head)}
.jumpnav ul{list-style:none;margin:0;padding:0;border-left:2px solid var(--line)}
.jumpnav li{margin:0}
.jumpnav a{display:block;padding:.45rem 0 .45rem 1rem;color:var(--ink-mute);text-decoration:none;margin-left:-2px;border-left:2px solid transparent}
.jumpnav a:hover,.jumpnav a.is-active{color:var(--brand);border-left-color:var(--g500)}
@media(max-width:63.99rem){.jumpnav{display:none}}
.with-aside{display:grid;gap:clamp(2rem,5vw,4rem)}
@media(min-width:64rem){.with-aside{grid-template-columns:15rem 1fr}}

/* ---------- 24. Misc ---------- */
.pill-row{display:flex;flex-wrap:wrap;gap:.5rem}
.pill{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .85rem;border-radius:var(--r-pill);border:1px solid var(--line);background:var(--bg-elev);font-size:.83rem;color:var(--ink-soft);text-decoration:none;transition:border-color .2s,color .2s,transform .2s}
a.pill:hover{border-color:var(--g500);color:var(--brand);transform:translateY(-1px)}
.pill--on{background:var(--g700);border-color:var(--g700);color:#fff}
.theme-toggle{width:2.6rem;height:2.6rem;border:1px solid var(--line);background:var(--bg-elev);border-radius:var(--r-sm);display:grid;place-items:center;cursor:pointer;color:var(--ink);flex:none}
.theme-toggle svg{width:1.1rem;height:1.1rem}
.theme-toggle .moon{display:none}
:root[data-theme="dark"] .theme-toggle .sun{display:none}
:root[data-theme="dark"] .theme-toggle .moon{display:block}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .theme-toggle .sun{display:none}:root:not([data-theme="light"]) .theme-toggle .moon{display:block}}
.map-embed{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);aspect-ratio:16/10;background:var(--bg-inset)}
.map-embed iframe{width:100%;height:100%;border:0;display:block}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- 25. Scroll reveal ---------- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
.reveal.is-in{opacity:1;transform:none}
.reveal[data-d="1"]{transition-delay:.08s}
.reveal[data-d="2"]{transition-delay:.16s}
.reveal[data-d="3"]{transition-delay:.24s}
.reveal[data-d="4"]{transition-delay:.32s}
.reveal[data-d="5"]{transition-delay:.4s}
.reveal[data-d="6"]{transition-delay:.48s}

/* logo draw-in */
.jh-swoosh{stroke-dasharray:1200;stroke-dashoffset:1200;animation:draw 1.5s var(--ease-out) .2s forwards}
.jh-house{opacity:0;animation:popIn .5s var(--ease-out) 1.1s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes popIn{from{opacity:0;transform:translateY(8px) scale(.9)}to{opacity:1;transform:none}}
.brand svg .jh-house{transform-origin:70% 62%}

/* ---------- 26. Reduced motion & print ---------- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
  .jh-swoosh{stroke-dashoffset:0}
  .jh-house{opacity:1}
  .scene-stack{animation:none}
}
@media print{
  .site-header,.topbar,.mobile-nav,.scrim,.site-footer,.cta-band,.field,.btn{display:none!important}
  body{color:#000;background:#fff;font-size:11pt}
  a::after{content:" (" attr(href) ")";font-size:9pt;color:#555}
}
