:root{--ink:#132a27;--muted:#667571;--green:#087b58;--green-bright:#0c9a6b;--mint:#eaf5ef;--paper:#f7f8f4;--white:#fff;--line:#e6ebe6;--navy:#102b27;--shadow:0 24px 70px rgba(26,58,47,.12);--sans:'DM Sans',Arial,sans-serif;--display:'Manrope','DM Sans',Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}.site-header{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 max(calc((100vw - 1280px)/2),5.5%);background:rgba(255,255,255,.9);border-bottom:1px solid rgba(18,48,41,.07);position:sticky;top:0;z-index:20;backdrop-filter:blur(16px)}.brand{display:inline-flex;align-items:center;gap:11px;min-width:208px}.brand-mark{width:34px;height:34px;background:var(--green);border-radius:10px;display:grid;grid-template-columns:repeat(2,6px);grid-template-rows:repeat(2,6px);gap:3px;align-content:center;justify-content:center;transform:rotate(-5deg)}.brand-mark span{background:#fff;border-radius:1px}.brand-mark span:nth-child(2){opacity:.66}.brand-mark span:nth-child(3){opacity:.82}.brand-name{font:800 17px var(--display);letter-spacing:.07em;line-height:1}.brand-name small{display:block;font:500 8px var(--sans);color:#75817c;letter-spacing:.04em;margin-top:5px}.primary-nav{display:flex;gap:35px;margin-left:auto;margin-right:45px}.primary-nav a,.sign-in{font-size:13px;font-weight:600;color:#50605b;transition:color .2s}.primary-nav a:hover,.sign-in:hover{color:var(--green)}.header-actions{display:flex;align-items:center;gap:25px}.button{min-height:52px;padding:0 22px;border:0;border-radius:9px;background:var(--green);color:#fff;font-size:13px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:18px;box-shadow:0 8px 20px rgba(8,123,88,.18);transition:transform .2s,background .2s,box-shadow .2s}.button:hover{background:#066747;transform:translateY(-2px);box-shadow:0 12px 24px rgba(8,123,88,.22)}.button span{font-size:17px;font-weight:400}.button-small{min-height:42px;padding:0 16px;font-size:12px;gap:12px}.menu-toggle{display:none}.section-wrap{max-width:1280px;margin:0 auto;padding-left:34px;padding-right:34px}.hero{min-height:664px;padding-top:94px;padding-bottom:90px;display:grid;grid-template-columns:.94fr 1.06fr;align-items:center;gap:46px;overflow:hidden}.hero-copy{position:relative;z-index:2;padding-bottom:8px}.eyebrow{display:flex;align-items:center;gap:9px;color:#56736a;font-size:10px;font-weight:700;letter-spacing:.16em}.eyebrow-dot{width:7px;height:7px;border-radius:50%;background:#12a06f;box-shadow:0 0 0 4px rgba(18,160,111,.11)}h1,h2,h3,p{margin-top:0}.hero h1{font:800 clamp(42px,4.3vw,63px)/1.12 var(--display);letter-spacing:-.058em;margin:24px 0 21px;max-width:610px}.hero h1 em,h2 em{font-style:normal;color:var(--green)}.hero-description{max-width:525px;color:#60706b;font-size:16px;line-height:1.8;margin:0 0 28px}.hero-actions{display:flex;align-items:center;gap:29px}.text-link{font-size:13px;font-weight:700;color:#253b35}.text-link span{color:var(--green);font-size:18px;margin-left:8px;vertical-align:-1px}.reassurance{display:flex;flex-wrap:wrap;gap:12px 22px;margin-top:24px;color:#6c7a75;font-size:10px}.reassurance b{color:var(--green);margin-right:5px}.product-visual{position:relative;min-width:0;padding:34px 0 30px 10px}.visual-glow{position:absolute;width:480px;height:480px;right:-7%;top:4%;border-radius:50%;background:radial-gradient(circle,rgba(31,157,109,.13),rgba(31,157,109,.04) 53%,transparent 72%)}.dashboard-window{position:relative;z-index:1;border:1px solid #dfe8e2;border-radius:16px;background:#fff;box-shadow:var(--shadow);overflow:hidden;transform:perspective(1400px) rotateY(-3deg) rotateX(1deg)}.window-top{height:48px;display:flex;align-items:center;padding:0 17px;background:#fff;border-bottom:1px solid #eef1ed;font-size:10px;color:#6d7c76}.window-top>span:nth-child(2){margin-left:12px}.window-top b{color:#b6c3bc;margin:0 5px}.window-dots{display:flex;gap:5px}.window-dots i{width:6px;height:6px;background:#d4ded7;border-radius:50%}.window-dots i:first-child{background:#91c8ac}.window-period{margin-left:auto!important;padding:6px 9px;background:#f5f8f5;border-radius:5px}.window-period span{margin-left:10px}.dashboard-body{display:grid;grid-template-columns:145px 1fr;min-height:405px}.dash-sidebar{padding:16px 10px;border-right:1px solid #edf0ed;display:flex;flex-direction:column;gap:8px;font-size:9px;color:#77837f}.side-logo{display:flex;align-items:center;gap:7px;color:#233b32;font-weight:800;font-size:9px;letter-spacing:.07em;margin:0 0 13px 5px}.mini-mark{background:var(--green);color:#fff;font:700 9px var(--display);border-radius:4px;width:19px;height:19px;display:grid;place-items:center}.side-active,.side-item{display:flex;align-items:center;gap:8px;padding:8px 8px;border-radius:6px}.side-active{background:#eaf5ef;color:#167653;font-weight:700}.side-active i{width:6px;height:6px;border-radius:2px;background:#16865f}.side-item i{width:6px;height:6px;border:1px solid #bdc9c2;border-radius:2px}.side-spacer{flex:1;min-height:55px}.side-profile{border-top:1px solid #edf0ed;padding:12px 2px 0;display:flex;align-items:center;gap:7px;font-size:8px;color:#273c34;font-weight:600}.side-profile small{display:block;color:#85918b;font-size:7px;font-weight:400;margin-top:2px}.avatar{width:22px;height:22px;background:#f8e7d3;color:#986335;border-radius:50%;display:grid;place-items:center;font-size:7px}.dash-main{padding:21px 20px 17px;min-width:0}.dash-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.dash-heading small{display:block;color:#94a09a;font-size:7px;letter-spacing:.1em;margin-bottom:4px}.dash-heading h2{font:700 15px var(--display);letter-spacing:-.03em;margin:0}.dash-heading h2 span{color:#e1ae49;font-size:12px}.dash-company{border:1px solid #e8ece8;border-radius:5px;padding:6px 8px;font-size:7px;color:#66736d;white-space:nowrap}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.metric-card{border:1px solid #edf0ed;border-radius:7px;padding:10px 9px;min-width:0}.metric-card>span{display:flex;justify-content:space-between;color:#7e8b85;font-size:8px}.metric-card>span i{font-style:normal;color:#a2ada7}.metric-card strong{display:block;font:700 clamp(13px,1.35vw,19px) var(--display);margin:6px 0 3px;letter-spacing:-.04em;white-space:nowrap}.metric-card>small{font-size:7px;color:#91a099;white-space:nowrap}.metric-card>small.positive{color:#17855d}.metric-card>small span{color:#96a29b}.metric-highlight{background:#eff8f2;border-color:#d8eee0}.chart-card{border:1px solid #edf0ed;border-radius:7px;margin-top:11px;padding:11px 12px 6px}.chart-title{display:flex;justify-content:space-between;align-items:center}.chart-title strong{font:700 9px var(--display);display:block}.chart-title small{display:block;color:#99a39f;font-size:7px;margin-top:2px}.chart-title>span{font-size:7px;color:#76827c;border:1px solid #edf0ed;border-radius:4px;padding:5px 7px}.chart-legend{display:flex;gap:11px;margin-top:9px;font-size:7px;color:#7e8a84}.chart-legend i{display:inline-block;width:6px;height:6px;border-radius:2px;margin-right:3px}.legend-income{background:#159368}.legend-expense{background:#a9d8c0}.chart{height:97px;position:relative;margin-top:7px}.chart-lines{position:absolute;inset:5px 0 16px;display:flex;flex-direction:column;justify-content:space-between}.chart-lines i{border-top:1px dashed #e7ece8}.bar-set{position:absolute;inset:5px 9px 0;display:flex;align-items:stretch;justify-content:space-around}.bar-pair{height:100%;width:11%;display:flex;align-items:end;justify-content:center;gap:3px;position:relative;padding-bottom:17px}.bar-pair b{position:relative;z-index:1;width:7px;height:var(--h);background:linear-gradient(180deg,#34ae7c,#138359);border-radius:3px 3px 0 0}.bar-pair b:nth-child(2){background:#bbdfcc}.bar-pair small{position:absolute;bottom:1px;font-size:7px;color:#929d97}.compliance-card{margin-top:10px;border:1px solid #dcefe4;background:#f4faf6;border-radius:7px;padding:9px;display:flex;align-items:center;gap:9px}.compliance-icon{width:20px;height:20px;border-radius:6px;background:#d9f0e2;color:#078354;display:grid;place-items:center;font-size:11px}.compliance-card strong{font-size:8px;display:block}.compliance-card small{display:block;font-size:7px;color:#7e8c84;margin-top:2px}.compliance-card small span{color:#16855c;margin-left:6px}.compliance-card>a{margin-left:auto;color:var(--green);font-size:14px}.float-note{position:absolute;z-index:3;right:-20px;bottom:1px;display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #e7eee8;border-radius:10px;padding:11px 14px;box-shadow:0 12px 35px rgba(24,56,44,.12)}.float-check{width:25px;height:25px;display:grid;place-items:center;color:white;background:#12875f;border-radius:7px;font-size:12px}.float-note strong{display:block;font-size:10px}.float-note small{display:block;color:#84918a;font-size:8px;margin-top:2px}.trust-strip{background:var(--navy);color:#fff}.trust-inner{max-width:1280px;margin:auto;padding:24px 34px;display:flex;align-items:center;gap:48px}.trust-label{font-size:8px;letter-spacing:.13em;color:#a8beb4;line-height:1.7;white-space:nowrap}.trust-label strong{color:#fff}.trust-items{display:flex;flex:1;align-items:center;justify-content:space-between;gap:14px}.trust-items span{font:700 11px var(--display);letter-spacing:.06em;color:#e6f0e9}.platform{padding-top:112px;padding-bottom:110px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:50px;margin-bottom:41px}.section-heading h2,.how h2,.pricing h2{font:800 clamp(34px,3.5vw,47px)/1.16 var(--display);letter-spacing:-.055em;margin:18px 0 0}.section-heading>p{max-width:390px;color:var(--muted);font-size:14px;line-height:1.8;margin:0 2% 5px 0}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.feature-card{background:#fff;border:1px solid #e8ede8;border-radius:11px;padding:25px 24px 21px;min-height:211px;transition:transform .2s,box-shadow .2s}.feature-card:hover{transform:translateY(-3px);box-shadow:0 15px 35px rgba(24,56,44,.08)}.feature-icon{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:18px;font-weight:600}.icon-green{background:#eaf6ee;color:#158158}.icon-peach{background:#fff0e7;color:#ca8051}.icon-blue{background:#eaf2fb;color:#5489ba}.icon-lilac{background:#f2effb;color:#8070bc}.icon-yellow{background:#fbf4de;color:#a77e1b}.feature-card h3{font:700 14px var(--display);letter-spacing:-.02em;margin:18px 0 7px}.feature-card p{font-size:11px;line-height:1.7;color:#78857e;margin-bottom:16px;max-width:300px}.feature-card>a{font-size:10px;font-weight:700;color:#3e564d}.feature-card>a span{color:var(--green);margin-left:5px}.feature-card-dark{background:#17352d;border-color:#17352d;color:#fff}.feature-card-dark p{color:#b7c9c0}.feature-card-dark>a{color:#fff}.icon-dark{background:#254a3d;color:#abe0c1}.how{display:grid;grid-template-columns:.8fr 1.2fr;gap:110px;padding-top:70px;padding-bottom:115px}.how-intro>p{max-width:310px;color:var(--muted);font-size:13px;line-height:1.8;margin:19px 0 23px}.steps{border-top:1px solid #dfe7e0}.steps article{display:grid;grid-template-columns:56px 1fr;gap:17px;padding:21px 0;border-bottom:1px solid #dfe7e0}.step-number{font:700 12px var(--display);color:#17855e;padding-top:3px}.steps h3{font:700 14px var(--display);margin:0 0 5px}.steps p{font-size:11px;color:#728078;line-height:1.7;margin:0;max-width:475px}.pricing{background:#eef4ee;border-radius:20px;margin-bottom:112px;padding-top:68px;padding-bottom:68px;display:grid;grid-template-columns:1fr .7fr;align-items:center;gap:65px}.pricing-copy p{color:#66756e;font-size:13px;margin:18px 0}.price-card{background:#fff;border:1px solid #e3ebe4;border-radius:13px;padding:26px 28px;box-shadow:0 14px 38px rgba(29,70,52,.07)}.price-top{display:flex;justify-content:space-between;align-items:center;font-size:10px;font-weight:700;letter-spacing:.09em}.popular{color:#16815b;background:#eaf5ee;border-radius:4px;padding:5px 8px;font-size:8px}.price{display:flex;align-items:baseline;gap:8px;margin:20px 0 7px}.price strong{font:800 39px var(--display);letter-spacing:-.06em}.price span{font-size:10px;color:#748179}.price-card>p{font-size:11px;color:#76827c}.price-card ul{list-style:none;margin:17px 0 20px;padding:0;display:grid;gap:9px}.price-card li{font-size:11px;color:#41584e}.price-card li:before{content:'✓';color:#17855e;margin-right:9px;font-weight:700}.price-card .button{width:100%;min-height:45px;font-size:11px}.price-card>small{display:block;text-align:center;color:#87938d;font-size:8px;margin-top:11px}.final-cta{position:relative;overflow:hidden;background:#12382e;color:#fff;padding:76px max(calc((100vw - 1212px)/2),7%)}.cta-pattern{position:absolute;right:5%;top:-130px;width:460px;height:460px;border:1px solid rgba(193,232,207,.13);border-radius:50%;box-shadow:0 0 0 38px rgba(193,232,207,.035),0 0 0 90px rgba(193,232,207,.025),0 0 0 145px rgba(193,232,207,.018)}.cta-content{position:relative;z-index:1}.eyebrow-light{color:#a8c8b6}.final-cta h2{font:800 clamp(36px,4vw,52px)/1.16 var(--display);letter-spacing:-.055em;margin:20px 0 12px}.final-cta h2 em{color:#9bddb8}.final-cta p{color:#c0d1c8;font-size:13px;margin-bottom:23px}.button-light{background:#fff;color:#154a37;box-shadow:none}.button-light:hover{background:#e7f5ed;color:#154a37}.cta-talk{font-size:12px;font-weight:600;color:#d7e4dd}.cta-talk span{font-size:17px;margin-left:7px;color:#9bddb8}.site-footer{max-width:1280px;margin:auto;padding:42px 34px 24px;display:grid;grid-template-columns:1fr 1.5fr;gap:12px 40px;align-items:center}.site-footer>p{margin:0;color:#77847d;font-size:10px}.footer-links{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;padding:18px 0;border-top:1px solid #e4e9e4;border-bottom:1px solid #e4e9e4;margin-top:17px}.footer-links a{font-size:10px;color:#64736b}.copyright{grid-column:1/-1;font-size:9px;color:#89958e;margin-top:1px}
@media(max-width:1000px){.site-header{padding:0 4%}.primary-nav{gap:20px;margin-right:24px}.hero{gap:22px;grid-template-columns:.94fr 1.06fr;padding-top:75px;min-height:600px}.section-wrap{padding-left:5%;padding-right:5%}.dashboard-body{grid-template-columns:115px 1fr}.dash-main{padding:17px 12px}.trust-inner{padding-left:5%;padding-right:5%;gap:24px}.trust-items span{font-size:9px}.how{gap:60px}.pricing{gap:35px}.float-note{right:-10px}}
@media(max-width:720px){.site-header{height:68px;padding:0 5%}.brand{min-width:0}.brand-name{font-size:15px}.header-actions{margin-left:auto;margin-right:12px}.header-actions .sign-in{display:none}.button-small{min-height:38px;padding:0 11px;font-size:10px}.menu-toggle{display:flex;width:34px;height:34px;background:transparent;border:1px solid #e1e9e2;border-radius:7px;flex-direction:column;gap:5px;align-items:center;justify-content:center;order:3}.menu-toggle span{width:14px;height:1.5px;background:#355249}.primary-nav{display:none;position:absolute;left:0;right:0;top:67px;background:#fff;border-bottom:1px solid var(--line);padding:13px 5% 18px;margin:0;flex-direction:column;gap:0;box-shadow:0 15px 25px rgba(24,56,44,.08)}.primary-nav.is-open{display:flex}.primary-nav a{padding:10px 0}.hero{display:flex;flex-direction:column;align-items:stretch;gap:17px;padding-top:60px;padding-bottom:51px;min-height:auto}.hero h1{font-size:clamp(39px,9vw,54px);margin-top:20px}.hero-description{font-size:14px;line-height:1.75}.reassurance{gap:9px 15px;margin-top:18px;font-size:9px}.product-visual{padding:23px 3px 27px}.dashboard-window{transform:none}.dashboard-body{grid-template-columns:88px 1fr;min-height:345px}.dash-sidebar{padding:12px 6px;gap:5px}.side-item,.side-active{padding:7px 4px;gap:5px;font-size:7px}.side-logo{margin-left:1px;font-size:7px}.dash-main{padding:14px 9px}.dash-heading h2{font-size:12px}.dash-heading small{font-size:6px}.dash-company{font-size:6px;padding:5px}.metric-grid{gap:4px}.metric-card{padding:7px 5px}.metric-card>span{font-size:6px}.metric-card strong{font-size:clamp(10px,3.2vw,15px)}.metric-card>small{font-size:6px}.chart-card{padding:9px 7px 5px}.chart-title strong{font-size:8px}.chart-title small,.chart-title>span{font-size:6px}.chart{height:80px}.compliance-card{padding:7px;gap:6px}.compliance-card strong{font-size:7px}.compliance-card small{font-size:6px}.float-note{right:-2px;bottom:0;padding:8px 10px}.trust-inner{padding:20px 5%;display:block}.trust-label br{display:none}.trust-items{margin-top:15px;flex-wrap:wrap;justify-content:flex-start;gap:13px 21px}.trust-items span{font-size:9px}.platform{padding-top:75px;padding-bottom:70px}.section-heading{display:block;margin-bottom:28px}.section-heading h2,.how h2,.pricing h2{font-size:34px}.section-heading>p{font-size:12px;margin:18px 0 0}.feature-grid{grid-template-columns:repeat(2,1fr);gap:9px}.feature-card{padding:17px 15px;min-height:205px}.feature-card h3{font-size:12px;margin-top:15px}.feature-card p{font-size:10px}.feature-card>a{font-size:9px}.feature-icon{width:31px;height:31px;font-size:16px}.how{display:block;padding-top:15px;padding-bottom:75px}.how-intro{margin-bottom:35px}.how-intro>p{font-size:12px}.steps article{grid-template-columns:38px 1fr;gap:10px;padding:17px 0}.steps h3{font-size:12px}.steps p{font-size:10px}.pricing{display:block;margin-bottom:70px;padding:37px 6%;border-radius:15px}.pricing-copy{margin-bottom:24px}.pricing-copy p{font-size:11px}.price-card{padding:22px 19px}.final-cta{padding:59px 6%}.final-cta h2{font-size:39px}.final-cta p{font-size:12px;max-width:320px}.cta-pattern{right:-250px;top:-80px}.site-footer{padding:33px 6% 22px;display:block}.site-footer>p{margin:12px 0 0;max-width:340px}.footer-links{flex-wrap:wrap;gap:13px 20px;margin-top:20px;padding:17px 0}.copyright{display:block;margin-top:17px}}
@media(max-width:390px){.brand-name small{font-size:7px}.button-small{font-size:9px;gap:6px;padding:0 8px}.header-actions{margin-right:8px}.hero-actions{gap:20px}.reassurance{font-size:8px}.dashboard-body{grid-template-columns:72px 1fr}.side-logo{font-size:6px}.side-item,.side-active{font-size:6px}.dash-company{display:none}.dash-heading h2{font-size:11px}.metric-card strong{font-size:10px}.feature-grid{grid-template-columns:1fr}.feature-card{min-height:auto}.feature-card p{max-width:100%}.footer-links{gap:12px 16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}


/* ── Local adaptations to the mockup ────────────────────────────────────────
   The mockup drew a placeholder mark with four squares; CALACC has a real logo,
   so .brand-logo carries it at the same 34px footprint. */
.brand-logo{width:34px;height:34px;border-radius:9px;display:block;flex:0 0 auto}
.site-footer .brand-logo{width:30px;height:30px;border-radius:8px}
.primary-nav{gap:24px}
.primary-nav a.active{color:var(--green)}
.final-cta .eyebrow-dot{background:#9bddb8;box-shadow:0 0 0 4px rgba(155,221,184,.16)}

/* Illustration honesty: the dashboard is sample data, and says so. */
.sample-flag{position:absolute;z-index:4;right:14px;top:14px;background:#fff;border:1px solid #e3ebe4;
  color:#7c8a83;font-size:9px;letter-spacing:.06em;font-weight:600;padding:4px 8px;border-radius:20px}


/* Eight nav items is more than the mockup carried. Tighten the spacing before the
   mobile breakpoint rather than letting the bar collide with the buttons. */
@media(max-width:1180px){
  .primary-nav{gap:16px;margin-right:26px}
  .primary-nav a{font-size:12px}
}
@media(max-width:1020px){
  .primary-nav{gap:12px;margin-right:16px}
  .primary-nav a{font-size:11px}
  .header-actions{gap:14px}
  .brand{min-width:0}
}


/* ── Real product screenshot in the hero ────────────────────────────────────
   The mockup drew a dashboard; this is a capture of the running app, so it needs
   the frame rather than the drawing's own window chrome. */
.product-shot{
  position:relative;z-index:2;display:block;width:100%;height:auto;
  border-radius:14px;border:1px solid #dfe7e2;background:#fff;
  box-shadow:var(--shadow);
}
@media(max-width:720px){.product-shot{border-radius:10px}}


/* Full-page capture: cap the height so the hero does not run off the screen,
   and keep the top of the page in view. */
.product-visual{display:flex;align-items:flex-start;justify-content:center}
.product-shot{max-height:min(76vh,720px);width:auto;max-width:100%;object-fit:contain;object-position:top}


/* ── Capability popup ───────────────────────────────────────────────────────
   A native <dialog>. The backdrop comes from ::backdrop, so no overlay element
   and no z-index negotiation with the sticky header. */
.cap-dialog{
  width:min(920px, 94vw); max-height:88vh; padding:0; border:1px solid #dfe7e2;
  border-radius:18px; background:#fff; color:var(--ink);
  box-shadow:0 40px 90px rgba(16,43,39,.28); overflow:hidden;
}
.cap-dialog::backdrop{background:rgba(16,43,39,.5); backdrop-filter:blur(3px)}
.cap-dialog[open]{display:flex; flex-direction:column}
.cap-head{
  display:flex; justify-content:space-between; align-items:flex-start; gap:24px;
  padding:26px 30px 18px; border-bottom:1px solid #e9eee9; background:#fbfcf9;
}
.cap-head h2{font:800 clamp(24px,2.6vw,32px)/1.15 var(--display); letter-spacing:-.045em; margin:12px 0 6px}
.cap-lede{font-size:12.5px; color:#5d6f68; max-width:52ch; margin:0}
.cap-close{
  flex:0 0 auto; width:36px; height:36px; border-radius:9px; border:1px solid #dfe7e2;
  background:#fff; color:#5d6f68; font-size:20px; line-height:1; cursor:pointer;
}
.cap-close:hover{background:#f1f5f0; color:#132a27}
.cap-body{
  overflow-y:auto; padding:22px 30px 8px;
  display:grid; grid-template-columns:1fr 1fr; gap:2px 34px;
}
.cap-group{break-inside:avoid; padding:14px 0; border-bottom:1px solid #eef2ee}
.cap-group h3{
  font:700 12px var(--display); text-transform:uppercase; letter-spacing:.1em;
  color:#087b58; margin:0 0 8px;
}
.cap-group ul{margin:0; padding-left:16px}
.cap-group li{font-size:12.5px; line-height:1.65; color:#4f6259; margin-bottom:4px}
.cap-group strong{color:#132a27}
.cap-group--limits{grid-column:1/-1; border-bottom:0}
.cap-group--limits h3{color:#a77e1b}
.cap-group--limits li{color:#6b5b3a}
.cap-foot{
  display:flex; align-items:center; gap:22px; padding:18px 30px;
  border-top:1px solid #e9eee9; background:#fbfcf9;
}
@media(max-width:820px){
  .cap-body{grid-template-columns:1fr; padding:18px 20px 6px}
  .cap-head{padding:20px 20px 14px}
  .cap-foot{padding:14px 20px; gap:14px}
  .cap-dialog{max-height:92vh; border-radius:14px}
}
@media(prefers-reduced-motion:no-preference){
  .cap-dialog[open]{animation:capIn .18s ease-out}
  @keyframes capIn{from{opacity:0; transform:translateY(8px)} to{opacity:1; transform:none}}
}


/* ── Hero spacing ───────────────────────────────────────────────────────────
   The copy column is far shorter than the product screenshot, and the grid was
   centring it vertically — which pushed the eyebrow ~180px below the header and
   read as a gap. Both columns now start at the top, and the screenshot is capped
   so the hero does not become a full screen tall. */
.hero{align-items:start;padding-top:44px;padding-bottom:60px;min-height:0}
.hero-copy{padding-top:0}
.product-visual{padding:0 0 20px 10px}
.product-shot{max-height:min(62vh,560px)}
@media(max-width:1000px){.hero{padding-top:34px;padding-bottom:48px}}
@media(max-width:720px){
  .hero{padding-top:24px;padding-bottom:38px;gap:14px}
  .product-visual{padding:0 0 12px}
  .product-shot{max-height:none}
}
