
/* Layout: a full-bleed moving-water opener, then calm wide sections; one deep green band carries the regulation story. */
:root{
  --paper:#f5f7f4;
  --card:#ffffff;
  --ink:#122a1f;
  --ink-2:#4d6157;
  --rule:#d7e0da;
  --leaf:#2f9e5f;
  --leaf-strong:#1d7444;
  --leaf-tint:#e2f2e8;
  --gold:#b5832f;
  --band:#123326;
  --band-ink:#eef5f0;
  --band-ink-2:#a8c3b4;
  --draft:#fff4d6; --draft-ink:#6b4e00;
  --logo-bg:transparent;
  --display:"Red Hat Display", "Segoe UI", system-ui, sans-serif;
  --body:"Red Hat Text", "Segoe UI", system-ui, sans-serif;
  --wrap:1180px;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --paper:#0d1813; --card:#13221b; --ink:#e7f0ea; --ink-2:#a4b8ad; --rule:#26392f;
  --leaf:#4cc580; --leaf-strong:#6fd89a; --leaf-tint:#173126; --gold:#e0ae63;
  --band:#0a2a1c; --draft:#3a2f10; --draft-ink:#f3d58a; --logo-bg:#f5f7f4; color-scheme:dark}}
:root[data-theme="dark"]{
  --paper:#0d1813; --card:#13221b; --ink:#e7f0ea; --ink-2:#a4b8ad; --rule:#26392f;
  --leaf:#4cc580; --leaf-strong:#6fd89a; --leaf-tint:#173126; --gold:#e0ae63;
  --band:#0a2a1c; --draft:#3a2f10; --draft-ink:#f3d58a; --logo-bg:#f5f7f4; color-scheme:dark}

*{box-sizing:border-box}
body{background:var(--paper);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.62}
a{color:var(--leaf-strong)}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--leaf);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
h1,h2,h3{font-family:var(--display);line-height:1.1;letter-spacing:-.015em;text-wrap:balance;margin:0}
h1{font-size:clamp(2.3rem,5vw,3.9rem);font-weight:700}
h2{font-size:clamp(1.65rem,3vw,2.4rem);font-weight:700}
h3{font-size:1.2rem;font-weight:700;letter-spacing:-.005em}
p{margin:0}
.kicker{font-family:var(--display);font-weight:600;font-size:1rem;color:var(--leaf-strong)}
.lede{font-size:1.18rem;color:var(--ink-2);max-width:62ch}
.btn{display:inline-flex;align-items:center;gap:.5em;font:600 1rem var(--body);padding:.8em 1.35em;border-radius:999px;text-decoration:none;border:1.5px solid var(--leaf-strong);cursor:pointer}
.btn-solid{background:var(--leaf-strong);color:#fff}
.btn-ghost{background:transparent;color:var(--leaf-strong)}
.btn-row{display:flex;flex-wrap:wrap;gap:12px}
section{padding-block:clamp(56px,8vw,104px)}
.flush{padding-top:0}
.sec-head{display:grid;gap:12px;max-width:780px;margin-bottom:40px}
.muted{color:var(--ink-2)}

.draft{background:var(--draft);color:var(--draft-ink);font-size:.88rem}
.draft .wrap{padding-block:8px;display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center}

/* header + services menu */
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--paper)}
header.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--paper) 94%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--rule)}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:12px;flex-wrap:wrap}
.mark{display:block;background:var(--logo-bg);padding:4px 8px;border-radius:10px}
.logo{height:44px;width:auto;display:block}
nav.main{display:flex;flex-wrap:wrap;gap:4px 22px;align-items:center}
nav.main > a, .dd > button{color:var(--ink);text-decoration:none;font:500 .98rem var(--body);padding:6px 0;border:0;border-bottom:2px solid transparent;background:none;cursor:pointer}
nav.main a[aria-current="page"], .dd.current > button{border-bottom-color:var(--leaf)}
nav.main a.cta{background:var(--leaf-strong);color:#fff;padding:8px 18px;border-radius:999px;border:0}
.dd{position:relative;display:flex;align-items:center;gap:0}
.dd > a{color:var(--ink);text-decoration:none;font:500 .98rem var(--body);padding:6px 0;border-bottom:2px solid transparent}
.dd.current > a{border-bottom-color:var(--leaf)}
.dd-caret{padding:6px 4px 6px 8px!important}
.dd > button::after{content:"";display:inline-block;margin-left:7px;width:7px;height:7px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:translateY(-3px) rotate(45deg)}
.dd-menu{position:absolute;top:calc(100% + 10px);left:-16px;min-width:300px;background:var(--card);border:1px solid var(--rule);border-radius:14px;padding:8px;box-shadow:0 18px 40px -18px rgba(10,40,25,.35);display:grid;z-index:40}
.dd-menu[hidden]{display:none}
.dd-menu a{display:grid;gap:1px;padding:10px 12px;border-radius:10px;text-decoration:none;color:var(--ink)}
.dd-menu a span{font-size:.85rem;color:var(--ink-2)}
.dd-menu a b{font-weight:600}
.dd-menu a:hover,.dd-menu a:focus-visible{background:var(--leaf-tint)}

/* video hero */
.vhero{position:relative;overflow:hidden;color:#fff;background:#0e2a1e;padding-block:clamp(84px,12vw,150px) clamp(72px,10vw,120px)}
.vhero video,.vhero .poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vhero::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(9,32,22,.88) 0%,rgba(9,32,22,.66) 48%,rgba(9,32,22,.35) 100%)}
.vhero .wrap{position:relative;z-index:1;display:grid;gap:24px}
.vhero h1{max-width:15ch;color:#fff}
.vhero .lede{color:rgba(255,255,255,.86)}
.vhero .kicker{color:#8fe3b2}
.vhero .btn-solid{background:#3fbf77;border-color:#3fbf77;color:#0b2418}
.vhero .btn-ghost{color:#fff;border-color:rgba(255,255,255,.7)}
.vtoggle{position:absolute;right:max(16px,env(safe-area-inset-right,0px));bottom:16px;z-index:2;font:500 .8rem var(--body);color:#fff;background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.4);border-radius:999px;padding:6px 12px;cursor:pointer}
@media (prefers-reduced-motion:reduce){.vhero video{display:none}}

.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));border-bottom:1px solid var(--rule)}
.stat{padding:24px 20px 24px 0;display:grid;gap:4px}
.stat b{font-family:var(--display);font-size:2.2rem;font-weight:800;color:var(--leaf-strong);line-height:1;font-variant-numeric:tabular-nums}
.stat span{color:var(--ink-2);font-size:.96rem}

/* page hero (inner pages) */
.hero{padding-block:clamp(48px,7vw,92px) clamp(36px,5vw,64px)}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(28px,5vw,64px);align-items:center}
.hero-copy{display:grid;gap:20px}
.facts{display:grid;border-top:2px solid var(--ink)}
.fact{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;padding:16px 0;border-bottom:1px solid var(--rule);align-items:baseline}
.fact b{font-family:var(--display);font-size:1.9rem;font-weight:800;color:var(--gold);line-height:1;font-variant-numeric:tabular-nums}
.fact span{color:var(--ink-2);font-size:.96rem}

/* regulation band */
.band{background:var(--band);color:var(--band-ink)}
.band .kicker{color:#8fe3b2}
.band .lede{color:var(--band-ink-2)}
.regs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr));gap:1px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.12);border-radius:16px;overflow:hidden;margin-top:36px}
.reg{background:var(--band);padding:22px 24px;display:grid;gap:6px;align-content:start}
.reg h3{font-size:1.05rem;color:#fff}
.reg p{color:var(--band-ink-2);font-size:.95rem}
.reg .rule-name{color:#8fe3b2;font-size:.85rem;font-weight:600}
.reg.lead{background:rgba(63,191,119,.12)}

/* services */
.services{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);border-radius:16px;overflow:hidden}
.svc{background:var(--card);padding:28px;display:grid;gap:10px;align-content:start}
.svc .tag{font-size:.85rem;font-weight:600;color:var(--ink-2)}
.svc p{color:var(--ink-2)}
.svc a{font-weight:600;text-decoration:none}
.svc.entry{background:var(--leaf-tint)}

.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,64px);align-items:center}
.stack{display:grid;gap:18px}
.video{position:relative;display:block;aspect-ratio:16/9;max-width:100%;border-radius:16px;overflow:hidden;text-decoration:none;color:#fff;background:radial-gradient(120% 90% at 20% 10%,#3fbf77 0%,transparent 55%),radial-gradient(100% 80% at 90% 100%,#b5832f 0%,transparent 50%),linear-gradient(160deg,#173d2c,#0c2219)}
.video .play{position:absolute;inset:0;display:grid;place-items:center}
.video .play i{width:76px;height:76px;border-radius:50%;background:rgba(255,255,255,.95);display:grid;place-items:center;transition:transform .2s}
.video .play i::after{content:"";border-left:22px solid #123326;border-top:13px solid transparent;border-bottom:13px solid transparent;margin-left:6px}
.video:hover .play i{transform:scale(1.06)}
.video .cap{position:absolute;left:20px;right:20px;bottom:18px;display:grid;gap:2px}
.video .cap b{font-family:var(--display);font-size:1.15rem}
.video .cap span{font-size:.85rem;opacity:.85}
@media (prefers-reduced-motion:reduce){.video .play i{transition:none}}

.quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:24px}
blockquote{margin:0;display:grid;gap:14px;align-content:start;padding-top:18px;border-top:2px solid var(--leaf)}
blockquote.feature{max-width:880px;margin-bottom:40px;border-top:0;border-left:4px solid var(--leaf);padding:4px 0 4px 28px}
blockquote.feature p{font-family:var(--display);font-size:clamp(1.2rem,2vw,1.5rem);line-height:1.45;font-weight:500}
blockquote footer{font-size:.9rem;color:var(--ink-2)}
blockquote footer b{color:var(--ink);display:block}
.note{font-size:.88rem;color:var(--ink-2);background:var(--leaf-tint);border-radius:10px;padding:10px 14px;margin-top:28px}

.photo{margin:0;display:grid;gap:8px}
.photo img{width:100%;height:auto;display:block;border-radius:16px}
.photo figcaption{font-size:.86rem;color:var(--ink-2)}

.tbl-wrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;min-width:440px}
th,td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--rule);font-variant-numeric:tabular-nums}
th{font-size:.85rem;color:var(--ink-2);font-weight:600}
td.num{font-family:var(--display);font-weight:800;font-size:1.25rem;color:var(--gold)}

.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:20px;counter-reset:s}
.steps li{counter-increment:s;display:grid;gap:8px;align-content:start;padding:22px;border-radius:14px;background:var(--card);border:1px solid var(--rule)}
.steps li::before{content:counter(s);font-family:var(--display);font-weight:800;font-size:1.7rem;color:var(--leaf);line-height:1}
.steps p{color:var(--ink-2);font-size:.96rem}

.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips span{border:1px solid var(--rule);background:var(--card);border-radius:999px;padding:6px 12px;font-size:.9rem}

.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:20px}
.card{background:var(--card);border:1px solid var(--rule);border-radius:16px;padding:26px;display:grid;gap:10px;align-content:start}
.card .tag{font-size:.85rem;font-weight:600;color:var(--leaf-strong)}
.card p{color:var(--ink-2)}

.spec{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr));border-top:2px solid var(--ink);margin:0}
.spec div{padding:16px 16px 16px 0;border-bottom:1px solid var(--rule);display:grid;gap:4px}
.spec dt{font-size:.85rem;color:var(--ink-2)}
.spec dd{margin:0;font-family:var(--display);font-weight:700;font-size:1.3rem}
ul.ticks{list-style:none;padding:0;margin:0;display:grid;gap:12px}
ul.ticks li{padding-left:30px;position:relative}
ul.ticks li::before{content:"";position:absolute;left:2px;top:.42em;width:14px;height:8px;border-left:2.5px solid var(--leaf);border-bottom:2.5px solid var(--leaf);transform:rotate(-45deg)}

.callout{background:var(--card);border:1px solid var(--rule);border-left:4px solid var(--leaf);border-radius:12px;padding:22px 24px;display:grid;gap:8px}
.callout .rule-name{font-size:.85rem;font-weight:600;color:var(--ink-2)}

.team{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:24px}
.team article{display:grid;gap:4px;align-content:start}
.team img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:14px;margin-bottom:8px}
.team p{color:var(--ink-2);font-size:.95rem}
.team .mail{font-size:.85rem;user-select:all}

.form{display:grid;gap:16px;background:var(--card);border:1px solid var(--rule);border-radius:16px;padding:clamp(20px,3vw,32px)}
.form label{display:grid;gap:6px;font-weight:600;font-size:.92rem}
.form input,.form select,.form textarea{font:inherit;font-weight:400;padding:.7em .8em;border:1.5px solid var(--rule);border-radius:10px;background:var(--paper);color:var(--ink);width:100%}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--leaf)}
.form button{justify-self:start}
.form-msg{font-size:.92rem;color:var(--leaf-strong);min-height:1.4em}

.cta-band{background:var(--leaf-tint)}
.cta-band .wrap{display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;align-items:center}
footer.site{border-top:1px solid var(--rule);padding-block:40px;font-size:.92rem;color:var(--ink-2)}
footer.site .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:24px}
footer.site b{color:var(--ink);display:block;margin-bottom:6px;font-family:var(--display)}
footer.site a{color:var(--ink-2)}
.addr{user-select:all}

.fact .ico{width:30px;height:30px;border-radius:50%;background:var(--leaf-tint);display:grid;place-items:center}
.fact .ico::after{content:"";width:11px;height:6px;border-left:2.5px solid var(--leaf-strong);border-bottom:2.5px solid var(--leaf-strong);transform:translateY(-1px) rotate(-45deg)}
.reglist{list-style:none;margin:32px 0 0;padding:0;display:grid;border-top:1px solid rgba(255,255,255,.18)}
.reglist li{display:grid;grid-template-columns:minmax(0,200px) minmax(0,1fr);gap:6px 28px;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.18)}
.reglist b{color:#fff;font-family:var(--display)}
.reglist span{color:var(--band-ink-2)}
.reglist em{font-style:normal;color:#8fe3b2;font-weight:600}
.qlogo{height:34px;width:auto;align-self:start;background:#fff;border-radius:6px;padding:4px 6px}
.logos{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.logos img{height:64px;width:auto;background:#fff;border:1px solid var(--rule);border-radius:10px;padding:8px 12px}
.gallery{display:grid;grid-auto-flow:column;grid-auto-columns:min(78%,720px);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px}
.gallery figure{margin:0;scroll-snap-align:start}
.gallery img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:14px;display:block}
.vids{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:12px}
.vid{display:flex;align-items:center;gap:12px;padding:14px 16px;border:1px solid var(--rule);border-radius:12px;background:var(--card);text-decoration:none;color:var(--ink);font-weight:600}
.vid i{flex:none;width:34px;height:34px;border-radius:50%;background:var(--leaf-strong);display:grid;place-items:center}
.vid i::after{content:"";border-left:11px solid #fff;border-top:7px solid transparent;border-bottom:7px solid transparent;margin-left:3px}
.vid:hover{border-color:var(--leaf)}
.ybooks{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:24px}
.ybook{display:grid;gap:10px;text-decoration:none;color:var(--ink)}
.ybook img{width:100%;height:auto;border-radius:10px;border:1px solid var(--rule);box-shadow:0 14px 30px -18px rgba(10,40,25,.45)}
.ybook b{font-family:var(--display)}
.ybook span{color:var(--ink-2);font-size:.9rem}
@media (max-width:640px){.reglist li{grid-template-columns:minmax(0,1fr)}}

@media (max-width:820px){
  .hero .wrap,.split{grid-template-columns:minmax(0,1fr)}
  nav.main{gap:4px 16px}
  .dd-menu{position:fixed;left:max(16px,env(safe-area-inset-left,0px));right:max(16px,env(safe-area-inset-right,0px));top:auto;min-width:0}
}

html{-webkit-text-size-adjust:100%}
body{margin:0}
img{max-width:100%}
[hidden]{display:none!important}
button.video{border:0;padding:0;width:100%;cursor:pointer;font:inherit;text-align:left}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.legal{max-width:780px}
.legal b{font-family:var(--display)}
.skip{position:absolute;left:-9999px;top:8px;z-index:50;background:var(--card);padding:8px 12px;border-radius:8px}
.skip:focus{left:16px}
