:root{
  --ink:#0b150a; --navy:#13260f; --steel:#2c4a17; --steel-2:#27431a; --gold:#b58d4c; --gold-2:#d6b06c; --sand:#f4f0e8; --paper:#fbf9f5; --white:#fff;
  --leaf:#6b9a2a;--leaf-2:#8cc63f; --line:rgba(11,21,10,.12); --muted:#5b6b7c;
  --head:'Marcellus',Georgia,serif; --body:'Jost',system-ui,-apple-system,Segoe UI,sans-serif;
  --r:16px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{font-family:var(--body);color:var(--ink);background:var(--paper);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--head);font-weight:400;line-height:1.12;letter-spacing:.005em}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.eyebrow{font-size:12.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);font-weight:500;margin-bottom:16px;display:flex;align-items:center;gap:12px}
.eyebrow:before{content:"";width:34px;height:1px;background:currentColor}
.sec{padding:104px 0}
.sec h2{font-size:clamp(2rem,4.2vw,3.2rem);margin-bottom:20px}
.lede{font-size:1.14rem;color:var(--muted);max-width:660px}
.dark .lede{color:rgba(255,255,255,.72)}
.btn{display:inline-flex;align-items:center;gap:10px;padding:15px 28px;border-radius:999px;font:500 15px var(--body);letter-spacing:.04em;text-decoration:none;cursor:pointer;border:1.5px solid transparent;transition:transform .25s,box-shadow .25s,background .25s,color .25s}
.btn:hover{transform:translateY(-2px)}
.btn-gold{background:linear-gradient(135deg,var(--gold-2),var(--gold));color:#1a1206;box-shadow:0 10px 30px rgba(181,141,76,.35)}
.btn-gold:hover{box-shadow:0 14px 38px rgba(181,141,76,.5)}
.btn-ghost{border-color:rgba(255,255,255,.55);color:#fff;background:rgba(255,255,255,.06);backdrop-filter:blur(6px)}
.btn-ghost:hover{background:#fff;color:var(--ink)}
.btn-dark{background:var(--ink);color:#fff}
.btn-line{border-color:var(--ink);color:var(--ink)}
.btn-line:hover{background:var(--ink);color:#fff}
svg.i{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

/* nav */
nav.top{position:fixed;top:0;left:0;right:0;z-index:50;transition:background .3s,box-shadow .3s,padding .3s;padding:18px 0}
nav.top.solid{background:rgba(11,21,10,.94);backdrop-filter:blur(12px);box-shadow:0 6px 30px rgba(0,0,0,.25);padding:10px 0}
nav.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#fff}
.brand img{height:38px;width:auto}
.wordmark{font-family:var(--head);font-size:1.6rem;letter-spacing:.02em}
.wordmark b{font-weight:400;color:var(--gold-2)}
.links{display:flex;align-items:center;gap:26px}
.links a{color:rgba(255,255,255,.86);text-decoration:none;font-size:14.5px;letter-spacing:.04em}
.links a:hover{color:var(--gold-2)}
.links .btn{padding:10px 20px;font-size:13.5px}
.burger{display:none;background:none;border:0;color:#fff;cursor:pointer}
.burger svg{width:30px;height:30px}
@media(max-width:980px){
  .burger{display:block}
  .links{position:fixed;inset:0 0 auto 0;top:0;flex-direction:column;align-items:stretch;background:rgba(11,21,10,.98);padding:84px 28px 34px;gap:4px;transform:translateY(-110%);transition:transform .35s}
  .links.open{transform:none}
  .links a{padding:14px 4px;font-size:18px;border-bottom:1px solid rgba(255,255,255,.08)}
  .links .btn{margin-top:12px;justify-content:center}
  .burger{position:relative;z-index:60}
}

/* hero */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;color:#fff;background:#0b150a url(/images/port-hero-v3.webp) center/cover no-repeat;overflow:hidden}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(7,16,6,.93) 0%,rgba(7,16,6,.72) 48%,rgba(7,16,6,.28) 100%),linear-gradient(0deg,rgba(7,16,6,.9),transparent 34%)}
.hero .wrap{position:relative;padding-top:130px;padding-bottom:110px}
.hero .eyebrow{color:var(--gold-2)}
.hero h1{font-size:clamp(2.6rem,6.6vw,5.4rem);max-width:900px;margin-bottom:26px}
.hero h1 em{font-style:normal;background:linear-gradient(100deg,var(--gold-2),#f3dcae);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p.sub{font-size:clamp(1.05rem,1.7vw,1.32rem);color:rgba(255,255,255,.82);max-width:640px;margin-bottom:38px;font-weight:300}
.cta-row{display:flex;gap:16px;flex-wrap:wrap}
.hero .scroll{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.6);display:flex;flex-direction:column;align-items:center;gap:10px}
.hero .scroll:after{content:"";width:1px;height:38px;background:linear-gradient(var(--gold-2),transparent);animation:drip 2s infinite}
@keyframes drip{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* fleet strip */
.fleet{background:var(--ink);color:#fff;padding:34px 0}
.fleet .wrap{display:flex;align-items:center;gap:34px;flex-wrap:wrap;justify-content:center}
.fleet small{font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.55);max-width:210px;line-height:1.5}
.fleet .logos{display:flex;gap:30px;align-items:center;flex-wrap:wrap;justify-content:center}
.fleet .lg{background:rgba(255,255,255,.94);border-radius:12px;height:78px;width:150px;display:flex;align-items:center;justify-content:center;padding:10px}
.fleet .lg img{max-height:58px;max-width:128px;object-fit:contain}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:60px;border-top:1px solid var(--line)}
.stat{padding:30px 22px 6px 0}
.stat b{display:block;font-family:var(--head);font-size:clamp(2.2rem,4vw,3.3rem);font-weight:400;color:var(--steel);line-height:1}
.stat span{font-size:14px;color:var(--muted);display:block;margin-top:10px}
@media(max-width:820px){.stats{grid-template-columns:1fr 1fr}.stat{padding:24px 14px 6px 0}}

/* problem split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.split.rev .media{order:2}
@media(max-width:900px){.split{grid-template-columns:1fr;gap:38px}.split.rev .media{order:0}}
.media{position:relative}
.media img{border-radius:var(--r);box-shadow:0 30px 70px rgba(11,21,10,.28);width:100%}
.media:after{content:"";position:absolute;inset:18px -18px -18px 18px;border:1.5px solid var(--gold);border-radius:var(--r);z-index:-1;opacity:.55}
.pain{list-style:none;margin-top:30px;display:grid;gap:18px}
.pain li{display:grid;grid-template-columns:28px 1fr;gap:14px;font-size:1.02rem}
.pain li svg{color:var(--gold);margin-top:3px}
.pain b{display:block;font-weight:500}
.pain span{color:var(--muted);font-size:.96rem}

/* platform */
.platform{background:var(--sand)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:54px}
@media(max-width:980px){.grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.grid{grid-template-columns:1fr}}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:30px 28px 30px;position:relative;transition:transform .3s,box-shadow .3s,border-color .3s}
.card:hover{transform:translateY(-6px);box-shadow:0 22px 50px rgba(11,21,10,.14);border-color:var(--gold)}
.card .ic{width:52px;height:52px;border-radius:14px;background:linear-gradient(135deg,var(--navy),var(--steel));color:var(--gold-2);display:flex;align-items:center;justify-content:center;margin-bottom:20px}
.card h3{font-size:1.38rem;margin-bottom:10px}
.card p{color:var(--muted);font-size:.98rem}
.tag{position:absolute;top:20px;right:20px;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;padding:5px 10px;border-radius:999px;background:rgba(181,141,76,.15);color:#8a6528;font-weight:500}
.tag.live{background:rgba(46,160,110,.14);color:#1d7a50}

/* AI section */
.ai{background:radial-gradient(1200px 600px at 85% 0,#2b5219 0,transparent 60%),var(--ink);color:#fff}
.ai h2,.ai h3{color:#fff}
.chat{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:22px;padding:22px;backdrop-filter:blur(8px);max-width:460px;margin-left:auto;box-shadow:0 30px 80px rgba(0,0,0,.4)}
@media(max-width:900px){.chat{margin:0 auto}}
.chat .hd{display:flex;align-items:center;gap:12px;padding-bottom:16px;border-bottom:1px solid rgba(255,255,255,.12);margin-bottom:16px}
.chat .av{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--gold-2),var(--gold));display:flex;align-items:center;justify-content:center;color:#1a1206}
.chat .hd b{display:block;font-weight:500;font-size:15px}
.chat .hd span{font-size:12px;color:#7ee0a8}
.msgs{display:flex;flex-direction:column;gap:10px;min-height:306px}
.m{max-width:86%;padding:11px 15px;border-radius:16px;font-size:14.5px;line-height:1.45;opacity:0;transform:translateY(8px);transition:opacity .4s,transform .4s}
.m.show{opacity:1;transform:none}
.m.u{align-self:flex-end;background:var(--gold);color:#1a1206;border-bottom-right-radius:4px}
.m.a{align-self:flex-start;background:rgba(255,255,255,.12);border-bottom-left-radius:4px}
.m.a a{color:var(--gold-2)}
.chan{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
.chan span{font-size:13px;padding:8px 16px;border:1px solid rgba(255,255,255,.25);border-radius:999px;color:rgba(255,255,255,.85)}
.ticks{list-style:none;margin-top:28px;display:grid;gap:14px}
.ticks li{padding-left:34px;position:relative;color:rgba(255,255,255,.82)}
.ticks li:before{content:"";position:absolute;left:0;top:5px;width:18px;height:18px;border-radius:50%;background:rgba(181,141,76,.2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d6b06c' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/11px no-repeat}
.ticks b{color:#fff;font-weight:500}

/* compliance */
.flow3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px}
@media(max-width:700px){.flow3{grid-template-columns:1fr}}
.flow3 div{border:1px solid var(--line);border-radius:14px;padding:20px 18px;background:#fff}
.flow3 b{display:block;font-family:var(--head);font-weight:400;font-size:1.15rem;margin:8px 0 6px}
.flow3 small{font-size:11px;letter-spacing:.2em;color:var(--gold);font-weight:500}
.flow3 p{font-size:.93rem;color:var(--muted)}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.chips span{font-size:13px;padding:8px 14px;border-radius:999px;background:var(--sand);border:1px solid var(--line)}

/* ways to start */
.start{background:var(--navy);color:#fff}
.start h2{color:#fff}
.tiers{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:54px}
@media(max-width:1020px){.tiers{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.tiers{grid-template-columns:1fr}}
.tier{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:transform .3s,border-color .3s}
.tier:hover{transform:translateY(-8px);border-color:var(--gold-2)}
.tier .ph{height:170px;background-size:cover;background-position:center;position:relative}
.tier .ph:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(19,38,15,.95),transparent 60%)}
.tier .body{padding:22px 22px 26px;display:flex;flex-direction:column;flex:1}
.tier h3{color:#fff;font-size:1.55rem}
.tier em{font-style:normal;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-2);display:block;margin:4px 0 14px}
.tier ul{list-style:none;display:grid;gap:9px;margin-bottom:22px;flex:1}
.tier li{font-size:.95rem;color:rgba(255,255,255,.8);padding-left:20px;position:relative}
.tier li:before{content:"";position:absolute;left:0;top:10px;width:8px;height:1.5px;background:var(--gold-2)}
.tier .btn{justify-content:center;padding:12px 18px;font-size:14px}
.note{margin-top:34px;text-align:center;color:rgba(255,255,255,.62);font-size:.98rem}

/* who */
.who{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:46px}
@media(max-width:900px){.who{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.who{grid-template-columns:1fr}}
.who div{padding:24px 24px;border-left:2px solid var(--gold);background:#fff;border-radius:0 12px 12px 0;box-shadow:0 6px 24px rgba(11,21,10,.06)}
.who b{font-family:var(--head);font-weight:400;font-size:1.25rem;display:block;margin-bottom:6px}
.who span{color:var(--muted);font-size:.96rem}

/* shipyard next */
.next{position:relative;color:#fff;background:#0b150a url(/images/future-harbor-v3.webp) center/cover no-repeat}
.next:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,16,6,.92),rgba(7,16,6,.55))}
.next .wrap{position:relative}
.next h2{color:#fff}
.next .soon{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:44px}
@media(max-width:900px){.next .soon{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.next .soon{grid-template-columns:1fr}}
.next .soon div{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:14px;padding:20px;backdrop-filter:blur(8px)}
.next .soon b{display:block;font-family:var(--head);font-weight:400;font-size:1.15rem;margin-bottom:6px}
.next .soon span{font-size:.92rem;color:rgba(255,255,255,.75)}

/* demo CTA */
.demo{background:linear-gradient(135deg,#1d3a14,#0b150a);color:#fff;position:relative;overflow:hidden}
.demo:before{content:"";position:absolute;right:-160px;top:-160px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(181,141,76,.35),transparent 65%)}
.demo .wrap{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center}
@media(max-width:900px){.demo .wrap{grid-template-columns:1fr;gap:36px}}
.demo h2{color:#fff}
.dform{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);border-radius:20px;padding:28px;backdrop-filter:blur(10px)}
.dform label{display:block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.65);margin:0 0 7px}
.dform input,.dform select,.dform textarea{width:100%;padding:13px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;font:400 15.5px var(--body);margin-bottom:18px}
.dform select option{color:#000}
.dform input::placeholder,.dform textarea::placeholder{color:rgba(255,255,255,.45)}
.dform input:focus,.dform select:focus,.dform textarea:focus{outline:2px solid var(--gold-2);outline-offset:1px}
.dform .btn{width:100%;justify-content:center}
.fine{font-size:12.5px;color:rgba(255,255,255,.55);margin-top:14px;text-align:center}
.steps3{list-style:none;margin-top:28px;display:grid;gap:16px}
.steps3 li{display:grid;grid-template-columns:42px 1fr;gap:16px;align-items:start}
.steps3 .n{width:42px;height:42px;border-radius:50%;border:1.5px solid var(--gold-2);color:var(--gold-2);display:flex;align-items:center;justify-content:center;font-family:var(--head);font-size:1.15rem}
.steps3 b{display:block;font-weight:500}
.steps3 span{color:rgba(255,255,255,.7);font-size:.96rem}

/* process */
.proc{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin-top:52px;counter-reset:s}
@media(max-width:900px){.proc{grid-template-columns:1fr;gap:6px}}
.proc div{position:relative;padding:26px 22px 26px 0}
.proc div:before{counter-increment:s;content:"0" counter(s);font-family:var(--head);font-size:2.3rem;color:var(--gold);display:block;margin-bottom:10px}
.proc div:after{content:"";position:absolute;top:44px;right:12px;left:62px;height:1px;background:var(--line)}
.proc div:last-child:after{display:none}
@media(max-width:900px){.proc div:after{display:none}.proc div{border-bottom:1px solid var(--line);padding:18px 0}}
.proc b{display:block;font-weight:500;font-size:1.08rem;margin-bottom:6px}
.proc span{font-size:.95rem;color:var(--muted)}

/* about */
.about{background:var(--steel-2);color:#fff;position:relative;overflow:hidden}
.about:before{content:"";position:absolute;inset:0;background:url(/images/map-room-v3.webp) center/cover;opacity:.12}
.about .wrap{position:relative}
.about h2{color:#fff}
.about .cols{display:grid;grid-template-columns:1.15fr .85fr;gap:70px;margin-top:10px}
@media(max-width:900px){.about .cols{grid-template-columns:1fr;gap:30px}}
.about p{color:rgba(255,255,255,.86);margin-bottom:18px;font-size:1.06rem}
.about .quote{font-family:var(--head);font-size:clamp(1.4rem,2.4vw,1.9rem);color:var(--gold-2);line-height:1.35;border-left:2px solid var(--gold-2);padding-left:24px;margin:6px 0 30px}
.about ul{list-style:none;display:grid;gap:16px}
.about li{padding:18px 20px;border:1px solid rgba(255,255,255,.2);border-radius:14px;background:rgba(255,255,255,.06)}
.about li b{font-family:var(--head);font-weight:400;font-size:1.15rem;display:block;margin-bottom:4px}
.about li span{font-size:.94rem;color:rgba(255,255,255,.78)}
.sign{margin-top:30px;font-family:var(--head);font-size:1.7rem}
.sign small{display:block;color:var(--gold-2);font-style:italic;font-size:1.1rem;margin-top:4px}

/* contact + footer */
.contact{background:var(--sand)}
.contact .wrap{display:grid;grid-template-columns:1fr 1fr;gap:60px}
@media(max-width:900px){.contact .wrap{grid-template-columns:1fr;gap:34px}}
.cbox{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:30px}
.cbox label{display:block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0 0 7px}
.cbox input,.cbox textarea{width:100%;padding:13px 14px;border-radius:10px;border:1px solid var(--line);background:var(--paper);font:400 15.5px var(--body);margin-bottom:16px}
.cbox input:focus,.cbox textarea:focus{outline:2px solid var(--gold);outline-offset:1px}
.info{display:grid;gap:22px;margin-top:30px}
.info>div{display:grid;grid-template-columns:30px 1fr;gap:14px;align-items:start}
.info>div>div{display:block}
.info>div>div b{display:block;font-weight:500;color:var(--ink);margin-bottom:2px}
.info svg{color:var(--gold)}
.info b{display:block;font-weight:500}
.info span,.info a{color:var(--muted);text-decoration:none}
.info a:hover{color:var(--ink);text-decoration:underline}
footer{background:var(--ink);color:rgba(255,255,255,.7);padding:56px 0 36px;text-align:center}
footer .wordmark{color:#fff;font-size:2.2rem}
footer p{margin-top:10px;font-size:.98rem}
footer img{height:54px;margin:26px auto 0;opacity:.85}
footer .fine{color:rgba(255,255,255,.45);margin-top:22px}
footer a{color:rgba(255,255,255,.7)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.msg{margin-top:12px;font-size:14.5px;min-height:20px}
.msg.ok{color:#2a9d6b}.msg.err{color:#c0392b}
.dform .msg.ok{color:#7ee0a8}.dform .msg.err{color:#ff9d92}

/* reveal */
.rv{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s ease}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}.hero .scroll:after{animation:none}}

/* ---- v2 (11 Nov 2026): official compass logo, green theme, about page ---- */
.brand img{height:46px;width:auto}
.brand .wordmark{font-size:1.55rem}
.foot-logo{height:70px;width:auto;margin:0 auto 14px}
.nav-login{font-size:13.5px}
.page-hero{position:relative;min-height:64vh;display:flex;align-items:flex-end;color:#fff;background:#0b150a url(/images/map-room-v3.webp) center/cover no-repeat}
.page-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(7,16,6,.96),rgba(7,16,6,.55) 55%,rgba(7,16,6,.7))}
.page-hero .wrap{position:relative;padding-top:150px;padding-bottom:84px}
.page-hero h1{font-size:clamp(2.4rem,6vw,4.6rem);max-width:880px;margin-bottom:18px}
.page-hero p{font-size:clamp(1.05rem,1.6vw,1.28rem);color:rgba(255,255,255,.82);max-width:640px;font-weight:300}
.prose p{font-size:1.1rem;color:#3d4a3a;margin-bottom:20px;max-width:680px}
.prose p.lead{font-size:1.32rem;color:var(--ink);font-family:var(--head)}
.values{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:46px}
@media(max-width:860px){.values{grid-template-columns:1fr}}
.values div{background:#fff;border:1px solid var(--line);border-top:3px solid var(--leaf-2);border-radius:var(--r);padding:28px}
.values b{display:block;font-family:var(--head);font-weight:400;font-size:1.35rem;margin-bottom:8px}
.values span{color:var(--muted)}
.teaser{background:var(--forest,#13260f);color:#fff}
.teaser .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center}
@media(max-width:900px){.teaser .wrap{grid-template-columns:1fr;gap:34px}}
.teaser h2{color:#fff}
.teaser p{color:rgba(255,255,255,.8);font-size:1.08rem;margin-bottom:26px;max-width:560px}
.band-cta{background:linear-gradient(135deg,#1d3a14,#0b150a);color:#fff;text-align:center}
.band-cta h2{color:#fff;margin-bottom:14px}
.band-cta p{color:rgba(255,255,255,.78);max-width:560px;margin:0 auto 28px;font-size:1.1rem}
.eyebrow.c{justify-content:center}
.benefit{list-style:none;display:grid;gap:14px;margin-top:28px}
.benefit li{padding-left:34px;position:relative;color:var(--muted)}
.benefit li b{color:var(--ink);font-weight:500}
.benefit li:before{content:"";position:absolute;left:0;top:5px;width:18px;height:18px;border-radius:50%;background:rgba(107,154,42,.18) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b9a2a' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/11px no-repeat}
.tag{background:rgba(107,154,42,.16);color:#3f6a14}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:560px){.frow{grid-template-columns:1fr}}
.cbox button.btn{width:100%;justify-content:center;margin-top:4px}
.cbox textarea{resize:vertical;min-height:110px}
.cbox label{margin-top:0}
.demo .dform select{appearance:none}
.start .lede,.demo .lede,.teaser .lede{color:rgba(255,255,255,.76)}

/* v3: photos are back in their original colours; a 5% green wash ties them to the theme */
.media{isolation:isolate}
.media:before{content:"";position:absolute;inset:0;border-radius:var(--r);background:rgba(107,154,42,.05);pointer-events:none;z-index:1}
.tier .ph{background-blend-mode:normal}
.tier .ph:before{content:"";position:absolute;inset:0;background:rgba(107,154,42,.05);z-index:1;pointer-events:none}
.tier .ph:after{z-index:2}
.hero:after,.page-hero:after,.next:after{content:"";position:absolute;inset:0;background:rgba(107,154,42,.05);pointer-events:none}
.hero .wrap,.hero .scroll,.page-hero .wrap,.next .wrap{z-index:2}

/* FAQ (also feeds the FAQPage structured data) */
.faq{max-width:820px;margin-top:40px;display:grid;gap:12px}
.faq details{background:#fff;border:1px solid var(--line);border-radius:14px;padding:0 22px;transition:border-color .25s,box-shadow .25s}
.faq details[open]{border-color:var(--leaf-2);box-shadow:0 10px 30px rgba(14,26,10,.08)}
.faq summary{cursor:pointer;list-style:none;padding:20px 28px 20px 0;font-family:var(--head);font-size:1.16rem;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";position:absolute;right:2px;top:50%;transform:translateY(-50%);font:300 1.7rem var(--body);color:var(--gold);transition:transform .25s}
.faq details[open] summary:after{content:"\2212"}
.faq p{padding:0 0 22px;color:var(--muted);font-size:1.03rem;max-width:720px}