/* Aevix Advisory — B1 Verdigris. Palette from tools/brand/palette.py; no literal
   colour lives here that is not in that file. Fonts are SELF-HOSTED: no Google
   Fonts, no CDN, no third-party request from a visitor's browser. */
@font-face{font-family:'IBM Plex Sans';src:url('fonts/IBMPlexSans-Light.woff2') format('woff2');font-weight:300;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url('fonts/IBMPlexSans-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url('fonts/IBMPlexSans-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url('fonts/IBMPlexSans-SemiBold.woff2') format('woff2');font-weight:600;font-display:swap}

:root{
  --ink:#164742;--ink-2:#0F3330;--accent:#2E8B7E;--accent-dk:#27766B;--reversed:#CFE8E3;
  --ground:#F5F7F5;--line:#DCE3E1;--panel:#FFFFFF;--body:#1B1F24;--body2:#3A4654;--muted:#5B6B7C;
  --ease:cubic-bezier(.22,.61,.36,1);--dur:.7s;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--panel);color:var(--body);
  font-family:'IBM Plex Sans','Segoe UI',Helvetica,Arial,sans-serif;font-size:17px;line-height:1.6}
a{color:var(--accent-dk)}
.wrap{max-width:1120px;margin:0 auto;padding:0 32px}
@media(max-width:640px){.wrap{padding:0 20px}}

/* ---------- nav ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;padding:18px 0;transition:background .35s,box-shadow .35s,padding .35s}
.nav .wrap{display:flex;align-items:center;justify-content:space-between}
.nav.solid{background:rgba(255,255,255,.92);backdrop-filter:saturate(1.2) blur(10px);-webkit-backdrop-filter:saturate(1.2) blur(10px);box-shadow:0 1px 0 var(--line);padding:12px 0}
.mark{font-size:21px;letter-spacing:-.3px;text-decoration:none;color:#fff;transition:color .35s;display:inline-flex;align-items:baseline;gap:.28em}
.mark b{font-weight:600}.mark span{font-weight:300}
.nav.solid .mark{color:var(--ink)}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:28px;align-items:center}
.nav a.link{font-size:15px;text-decoration:none;color:rgba(255,255,255,.82);transition:color .35s}
.nav.solid a.link{color:var(--body2)}
.nav a.link:hover{color:#fff}.nav.solid a.link:hover{color:var(--ink)}
/* current page. The bar is reversed over the dark hero (8.1:1 on ink) and
   accent-dk once the nav goes solid (5.4:1 on white). */
.nav a.link{position:relative}
.nav a.link[aria-current="page"]{color:#fff;font-weight:500}
.nav.solid a.link[aria-current="page"]{color:var(--ink)}
.nav a.link[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:2px;border-radius:2px;background:var(--reversed)}
.nav.solid a.link[aria-current="page"]::after{background:var(--accent-dk)}
.nav a.btn{font-size:14px;font-weight:500;padding:9px 16px;border-radius:6px;text-decoration:none;background:var(--accent);color:#fff;transition:transform .25s var(--ease),background .25s}
.nav a.btn:hover{background:var(--accent-dk);transform:translateY(-1px)}
.nav a.btn,.nav a.link,.mark{white-space:nowrap}
/* COMPACT TOOLBAR. The four links need 830px to sit on one line (measured
   21 Sep 2026), so below 900px they give way to a single current-page label;
   they never wrap. .compact carries the same rules and is set by site.js if
   the links overflow for any other reason - larger browser text, a zoom level
   between breakpoints. */
@media(max-width:900px){
  .nav ul{gap:18px}
  .nav a.link{display:none}
  .nav a.link[aria-current="page"]{display:inline-block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--reversed);font-weight:500}
  .nav.solid a.link[aria-current="page"]{color:var(--accent-dk)}
  .nav a.link[aria-current="page"]::after{display:none}
  .nav a.link.home[aria-current="page"]{display:none}}
.nav.compact ul{gap:18px}
.nav.compact a.link{display:none}
.nav.compact a.link[aria-current="page"]{display:inline-block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--reversed);font-weight:500}
.nav.compact.solid a.link[aria-current="page"]{color:var(--accent-dk)}
.nav.compact a.link[aria-current="page"]::after{display:none}
.nav.compact a.link.home[aria-current="page"]{display:none}
/* phones: smaller button, and the wordmark drops "Advisory" to make room for the label */
@media(max-width:640px){.nav ul{gap:12px}.nav a.btn{font-size:13px;padding:8px 13px}
  .nav a.link[aria-current="page"]{font-size:10px;letter-spacing:.07em}
  .nav .mark{font-size:19px}
  .nav .wrap:has(a.link[aria-current="page"]:not(.home)) .mark span{display:none}}

/* ---------- hero ---------- */
.hero{position:relative;min-height:100svh;background:var(--ink);color:#fff;overflow:hidden;display:flex;align-items:center}
.hero canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.6}
.hero .fade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(22,71,66,.92) 0%,rgba(22,71,66,.55) 55%,rgba(22,71,66,.15) 100%)}
.hero .wrap{position:relative;padding-top:120px;padding-bottom:96px}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--reversed);font-weight:500;margin:0 0 26px}
.eyebrow::before{content:"";width:28px;height:2px;background:var(--accent)}
.hero h1{font-size:clamp(34px,5.6vw,66px);line-height:1.06;font-weight:300;letter-spacing:-.02em;margin:0 0 28px;max-width:17ch}
.hero h1 b{font-weight:600}
.hero p.lead{font-size:clamp(17px,1.5vw,20px);line-height:1.55;color:var(--reversed);max-width:58ch;margin:0 0 36px;font-weight:300}
.hero .actions{display:flex;gap:14px;flex-wrap:wrap}
.cta-primary,.cta-ghost{display:inline-flex;align-items:center;gap:10px;padding:14px 22px;border-radius:8px;text-decoration:none;font-weight:500;font-size:16px;transition:transform .25s var(--ease),background .25s,border-color .25s}
.cta-primary{background:var(--accent);color:#fff}.cta-primary:hover{background:#34A08F;transform:translateY(-2px)}
.cta-ghost{border:1px solid rgba(207,232,227,.45);color:#fff}.cta-ghost:hover{border-color:var(--reversed);transform:translateY(-2px)}
.cta-primary svg,.cta-ghost svg{transition:transform .25s var(--ease)}
.cta-primary:hover svg,.cta-ghost:hover svg{transform:translateX(4px)}
.scroll-hint{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);color:var(--reversed);opacity:.7;font-size:12px;letter-spacing:.12em;text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:8px}
.scroll-hint i{display:block;width:1px;height:38px;background:linear-gradient(var(--reversed),transparent);animation:drop 1.8s var(--ease) infinite}
@keyframes drop{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}}
.hero .reveal{opacity:0;transform:translateY(18px);animation:up .9s var(--ease) forwards}
.hero .reveal:nth-child(1){animation-delay:.15s}.hero .reveal:nth-child(2){animation-delay:.3s}
.hero .reveal:nth-child(3){animation-delay:.45s}.hero .reveal:nth-child(4){animation-delay:.6s}
@keyframes up{to{opacity:1;transform:none}}

/* ---------- sections ---------- */
section{padding:104px 0}
@media(max-width:640px){section{padding:72px 0}}
.k{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-dk);font-weight:500;margin:0 0 14px;display:flex;align-items:center;gap:10px}
.k::before{content:"";width:22px;height:2px;background:var(--accent)}
.dark .k{color:var(--reversed)}
h2{font-size:clamp(28px,3.4vw,42px);line-height:1.15;font-weight:300;letter-spacing:-.02em;color:var(--ink);margin:0 0 20px;max-width:22ch}
h2 b{font-weight:600}
.sub{font-size:19px;line-height:1.55;color:var(--body2);max-width:62ch;margin:0 0 44px}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
@media(max-width:820px){.grid-2{grid-template-columns:1fr;gap:32px}}
.grid-2.mid{align-items:center}
/* home 01: the question, as each party asks it. Paraphrase, not quotation -
   no quote marks, so nothing reads as a regulator's own words. */
.asks{display:grid;gap:12px}
.ask{background:#fff;border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:10px;padding:16px 20px;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.ask:hover{transform:translateX(4px);box-shadow:0 14px 34px -22px rgba(22,71,66,.35)}
.ask .who{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-dk);font-weight:500;margin:0 0 6px}
.ask p{margin:0;font-size:16px;color:var(--ink);line-height:1.45}
.ask.whose{background:var(--ink);border-color:var(--ink);border-left-color:var(--reversed);margin-top:6px}
.ask.whose p{color:var(--reversed);font-size:19px;font-weight:300}
.ask.whose b{color:#fff;font-weight:600}
.ground{background:var(--ground)}
.dark{background:var(--ink);color:#fff}
.dark h2{color:#fff}.dark .sub{color:var(--reversed)}

/* ---------- problem ---------- */
.problem p{font-size:18px;color:var(--body2);margin:0 0 18px}
.pull{border-left:3px solid var(--accent);padding:6px 0 6px 22px;font-size:22px;line-height:1.4;color:var(--ink);font-weight:300;margin:26px 0 0}
.pull b{font-weight:600}
.signals{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.signal{background:#fff;border:1px solid var(--line);border-radius:10px;padding:22px 22px 20px;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s}
.signal:hover{transform:translateY(-4px);box-shadow:0 18px 40px -22px rgba(22,71,66,.35);border-color:var(--accent)}
.signal .ic{width:38px;height:38px;border-radius:9px;background:var(--reversed);display:grid;place-items:center;margin-bottom:14px;color:var(--ink)}
.signal h4{margin:0 0 6px;font-size:16px;font-weight:600;color:var(--ink)}
.signal p{margin:0;font-size:15px;color:var(--muted);line-height:1.5}
@media(max-width:480px){.signals{grid-template-columns:1fr}}

/* ---------- two conditions (home, section 01) ---------- */
.conds{display:grid;gap:14px}
.cond{background:#fff;border:1px solid var(--line);border-radius:12px;padding:24px 24px 20px;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s}
.cond:hover{transform:translateY(-4px);box-shadow:0 18px 40px -22px rgba(22,71,66,.35);border-color:var(--accent)}
.cond .n{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-dk);font-weight:500;margin:0 0 8px}
.cond h4{margin:0 0 8px;font-size:20px;font-weight:600;color:var(--ink);line-height:1.25}
.cond p{margin:0 0 12px;font-size:15.5px;color:var(--body2);line-height:1.55}
.cond a{display:inline-flex;align-items:center;gap:8px;font-weight:500;text-decoration:none;color:var(--accent-dk);font-size:15px}
.cond a svg{transition:transform .25s var(--ease)}.cond a:hover svg{transform:translateX(4px)}
.cond.either{background:var(--ground);border-style:dashed}
/* who-it-is-for strip */
.fit{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:8px}
@media(max-width:820px){.fit{grid-template-columns:1fr}}
.fit div{border-top:2px solid var(--accent);padding-top:16px}
.fit h4{margin:0 0 8px;font-size:17px;font-weight:600;color:var(--ink)}
.fit p{margin:0;font-size:15.5px;color:var(--body2);line-height:1.55}

/* ---------- offers ---------- */
.offers{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.offers.four{grid-template-columns:repeat(2,1fr)}
.offers.six{grid-template-columns:repeat(3,1fr)}
.offers.six .offer{padding:24px 22px 22px}.offers.six .offer h3{font-size:18px}
.offers.five{grid-template-columns:repeat(6,1fr)}
.offers.five .offer{grid-column:span 2;padding:24px 22px 22px}.offers.five .offer h3{font-size:18px}
.offers.five .offer:nth-child(4){grid-column:2/span 2}
.offers.five .offer:nth-child(5){grid-column:4/span 2}
@media(max-width:900px){.offers,.offers.four,.offers.six,.offers.five{grid-template-columns:1fr}
  .offers.five .offer,.offers.five .offer:nth-child(4),.offers.five .offer:nth-child(5){grid-column:auto}}
.offer{position:relative;background:#fff;border:1px solid var(--line);border-radius:14px;padding:32px 28px 28px;display:flex;flex-direction:column;transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s}
.offer::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;border-radius:14px 14px 0 0;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.offer:hover{transform:translateY(-6px);box-shadow:0 30px 60px -30px rgba(22,71,66,.45);border-color:transparent}
.offer:hover::before{transform:scaleX(1)}
.offer .n{font-size:13px;letter-spacing:.12em;color:var(--accent-dk);font-weight:500;margin:0 0 14px}
.offer h3{font-size:22px;line-height:1.25;font-weight:600;color:var(--ink);margin:0 0 10px}
.offer .meta{font-size:14px;color:var(--muted);margin:0 0 18px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.offer p{margin:0 0 14px;font-size:16px;line-height:1.55;color:var(--body2)}
.offer ul{margin:0 0 18px;padding-left:18px;color:var(--body2);font-size:15px}
.offer li{margin:0 0 6px}
.offer .more{margin-top:auto;display:inline-flex;align-items:center;gap:8px;font-weight:500;text-decoration:none;color:var(--accent-dk);font-size:15px}
.offer .more svg{transition:transform .25s var(--ease)}
.offer .more:hover svg{transform:translateX(4px)}
/* three tones of one hue, no hero. Contrast measured 20 Sep:
   t1 ink: white 10.43:1, reversed 8.10:1 | t2 accent-dk: white 5.40:1 (reversed
   would be 4.19 and fail, so meta is white) | t3 reversed: ink 8.10:1, body2 7.47:1 */
.offer.t1{background:var(--ink);border-color:var(--ink);color:#fff}
.offer.t1 h3,.offer.t1 .n,.offer.t1 .more{color:#fff}
.offer.t1 .meta{color:var(--reversed);border-color:rgba(207,232,227,.25)}
.offer.t1 p,.offer.t1 ul{color:var(--reversed)}
.offer.t2{background:var(--accent-dk);border-color:var(--accent-dk);color:#fff}
.offer.t2 h3,.offer.t2 .n,.offer.t2 .more,.offer.t2 p,.offer.t2 ul{color:#fff}
.offer.t2 .meta{color:rgba(255,255,255,.92);border-color:rgba(255,255,255,.28)}
.offer.t2::before{background:var(--reversed)}
.offer.t3{background:var(--reversed);border-color:var(--reversed);color:var(--ink)}
.offer.t3 h3,.offer.t3 .n,.offer.t3 .more{color:var(--ink)}
.offer.t3 .meta{color:var(--body2);border-color:rgba(22,71,66,.18)}
.offer.t3 p,.offer.t3 ul{color:var(--body2)}
.offer.t3::before{background:var(--ink)}
.offer .n{letter-spacing:.14em}

/* ---------- process (animated line) ---------- */
.steps{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin-top:52px}
.steps::before{content:"";position:absolute;left:24px;right:24px;top:24px;height:2px;background:var(--line);z-index:0}
.steps::after{content:"";position:absolute;left:24px;top:24px;height:2px;width:0;background:var(--accent);transition:width 1.6s var(--ease);z-index:0}
.process.in .steps::after{width:calc(100% - 48px)}
.step{position:relative;padding-top:64px}
.step .dot{position:absolute;z-index:2;top:12px;left:12px;width:26px;height:26px;border-radius:50%;background:#fff;border:2px solid var(--line);display:grid;place-items:center;font-size:12px;font-weight:600;color:var(--muted);transition:border-color .4s,color .4s,background .4s}
.process.in .step .dot{border-color:var(--accent);color:var(--ink);background:var(--reversed)}
.process.in .step:nth-child(1) .dot{transition-delay:.15s}.process.in .step:nth-child(2) .dot{transition-delay:.55s}
.process.in .step:nth-child(3) .dot{transition-delay:.95s}.process.in .step:nth-child(4) .dot{transition-delay:1.35s}
.step h4{font-size:17px;font-weight:600;color:var(--ink);margin:0 0 8px}
.step p{margin:0;font-size:15px;color:var(--body2);line-height:1.55}
.step .t{font-size:13px;color:var(--accent-dk);font-weight:500;margin:0 0 6px}
@media(max-width:820px){.steps{grid-template-columns:1fr;gap:26px}
  .steps::before{left:24px;right:auto;top:0;bottom:0;width:2px;height:auto}
  .steps::after{left:24px;top:0;width:2px;height:0;transition:height 1.6s var(--ease)}
  .process.in .steps::after{width:2px;height:100%}
  .step{padding:0 0 0 64px}.step .dot{top:2px}}

/* ---------- deliverables ---------- */
.deliv{display:grid;grid-template-columns:1fr 1fr;gap:22px}
@media(max-width:820px){.deliv{grid-template-columns:1fr}}
.dcard{background:#fff;border-radius:14px;padding:34px 30px;border:1px solid var(--line);position:relative;overflow:hidden}
.dcard::after{content:"";position:absolute;right:-70px;bottom:-70px;width:150px;height:150px;border-radius:50%;background:var(--reversed);opacity:.55;transition:transform .6s var(--ease)}
.dcard:hover::after{transform:scale(1.35)}
.dcard *{position:relative}
.dcard .num{font-size:44px;font-weight:300;color:var(--accent);line-height:1;margin:0 0 14px}
.dcard h3{font-size:22px;font-weight:600;color:var(--ink);margin:0 0 10px}
.dcard p{margin:0;font-size:16px;line-height:1.55;color:var(--body2)}
.honest{margin-top:26px;padding:22px 26px;background:var(--ink);color:var(--reversed);border-radius:12px;font-size:17px;line-height:1.55}
.honest b{color:#fff;font-weight:600}

/* ---------- founder ---------- */
.founder{display:grid;grid-template-columns:1.2fr .8fr;gap:56px;align-items:center}
@media(max-width:820px){.founder{grid-template-columns:1fr}}
.founder p{font-size:18px;line-height:1.6;color:var(--body2);margin:0 0 16px}
.founder .quote{font-size:24px;line-height:1.35;color:var(--ink);font-weight:300;margin:0 0 22px}
.founder .quote b{font-weight:600}
.facts{display:grid;gap:12px}
.fact{display:flex;gap:16px;align-items:flex-start;padding:18px 20px;background:#fff;border:1px solid var(--line);border-radius:10px;transition:transform .35s var(--ease),border-color .35s}
.fact:hover{transform:translateX(6px);border-color:var(--accent)}
.fact .big{font-size:28px;font-weight:300;color:var(--accent-dk);line-height:1;min-width:72px}
.fact div p{margin:0;font-size:15px;line-height:1.45;color:var(--body2)}
.fact div p b{color:var(--ink);font-weight:600;display:block;margin-bottom:2px}

/* ---------- scope ---------- */
.scope{display:grid;grid-template-columns:1fr 1fr;gap:40px}
@media(max-width:820px){.scope{grid-template-columns:1fr}}
.scope ul{list-style:none;margin:0;padding:0}
.scope li{display:flex;gap:14px;padding:12px 0;border-bottom:1px solid var(--line);font-size:16px;color:var(--body2);line-height:1.5}
.scope li svg{flex:none;margin-top:4px}
.scope h3{font-size:18px;font-weight:600;color:var(--ink);margin:0 0 10px}

/* ---------- final CTA ---------- */
.final{background:var(--ink);color:#fff;position:relative;overflow:hidden}
.final::before{content:"";position:absolute;width:640px;height:640px;border-radius:50%;background:radial-gradient(circle,rgba(46,139,126,.45),transparent 65%);right:-200px;top:-200px}
.final .wrap{position:relative}
.final h2{color:#fff;max-width:20ch}
.final p{color:var(--reversed);font-size:19px;max-width:52ch;margin:0 0 30px}
.final .email{display:inline-flex;align-items:center;gap:12px;font-size:clamp(18px,2.4vw,26px);color:#fff;text-decoration:none;font-weight:500;border-bottom:2px solid var(--accent);padding-bottom:4px;transition:border-color .25s,gap .25s var(--ease)}
.final .email:hover{border-color:#fff;gap:18px}

/* ---------- footer ---------- */
footer{background:var(--ink-2);color:rgba(207,232,227,.75);padding:36px 0 40px;font-size:13px;line-height:1.6}
footer .wrap{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:flex-start}
footer a{color:var(--reversed);text-decoration:none}footer a:hover{color:#fff}
footer .legal{max-width:52ch;color:rgba(207,232,227,.55);font-size:12px}
.legal .nb{display:block;margin-top:5px}
footer .mark{font-size:18px;color:#fff}

/* ---------- scroll reveal ---------- */
.r{opacity:0;transform:translateY(26px);transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease)}
.r.in{opacity:1;transform:none}
.r.d1{transition-delay:.1s}.r.d2{transition-delay:.2s}.r.d3{transition-delay:.3s}.r.d4{transition-delay:.4s}

/* ---------- inner pages ---------- */
.page-head{background:var(--ink);color:#fff;padding:150px 0 70px}
.page-head h1{font-size:clamp(32px,4.4vw,52px);font-weight:300;letter-spacing:-.02em;line-height:1.1;margin:0 0 16px;max-width:18ch}
.page-head h1 b{font-weight:600}
.page-head p{color:var(--reversed);font-size:19px;max-width:56ch;margin:0}
.prose{max-width:760px}
.prose h2{font-size:26px;margin:44px 0 12px}
.prose h2:first-child{margin-top:0}
.prose p{font-size:17px;line-height:1.65;color:var(--body2);margin:0 0 16px}
.prose p b{color:var(--ink);font-weight:600}
.prose .meta{color:var(--muted);font-size:15px}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .r,.hero .reveal{opacity:1;transform:none;transition:none;animation:none}
  .scroll-hint i{animation:none}
  .steps::after{transition:none}
  .offer,.signal,.fact,.dcard::after,.cta-primary,.cta-ghost{transition:none}
}

/* ---------- contact panel (no form, no backend) ---------- */
dialog.contact{border:0;padding:0;background:transparent;max-width:min(560px,calc(100vw - 32px));width:100%}
dialog.contact::backdrop{background:rgba(15,51,48,.62);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
dialog.contact .panel{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 40px 80px -30px rgba(15,51,48,.6);transform:translateY(14px);opacity:0;transition:transform .35s var(--ease),opacity .35s}
dialog.contact[open] .panel{transform:none;opacity:1}
dialog.contact .head{background:var(--ink);color:#fff;padding:26px 28px 22px;position:relative}
dialog.contact .head .k{color:var(--reversed);margin-bottom:10px}
dialog.contact .head h3{margin:0 0 6px;font-size:26px;font-weight:300;letter-spacing:-.01em}
dialog.contact .head h3 b{font-weight:600}
dialog.contact .head p{margin:0;color:var(--reversed);font-size:15px;line-height:1.5}
dialog.contact .x{position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:50%;border:0;background:rgba(255,255,255,.1);color:#fff;cursor:pointer;display:grid;place-items:center;transition:background .2s}
dialog.contact .x:hover{background:rgba(255,255,255,.22)}
dialog.contact .body{padding:24px 28px 28px}
dialog.contact .addr{display:block;font-size:clamp(17px,2.6vw,21px);font-weight:500;color:var(--ink);word-break:break-all;padding:16px 18px;background:var(--ground);border:1px solid var(--line);border-radius:10px;margin:0 0 14px;font-variant-ligatures:none}
dialog.contact .row{display:flex;gap:10px;flex-wrap:wrap}
dialog.contact .b{flex:1 1 200px;display:inline-flex;justify-content:center;align-items:center;gap:9px;padding:13px 16px;border-radius:8px;font:inherit;font-size:15px;font-weight:500;cursor:pointer;text-decoration:none;border:1px solid transparent;transition:background .2s,border-color .2s,transform .2s var(--ease)}
dialog.contact .b.primary{background:var(--accent);color:#fff}dialog.contact .b.primary:hover{background:var(--accent-dk);transform:translateY(-1px)}
dialog.contact .b.ghost{background:#fff;color:var(--ink);border-color:var(--line)}dialog.contact .b.ghost:hover{border-color:var(--accent);transform:translateY(-1px)}
dialog.contact .b.done{background:var(--ink);color:#fff}
dialog.contact .hint{margin:18px 0 0;font-size:14px;line-height:1.55;color:var(--muted)}
dialog.contact .hint b{color:var(--body2);font-weight:500}
@media(prefers-reduced-motion:reduce){dialog.contact .panel{transition:none}}

/* ---------- formal notice ---------- */
.notice h2{font-size:20px;font-weight:600;margin:38px 0 10px;max-width:none}
.notice h2 span{color:var(--accent-dk);font-weight:500;margin-right:10px}
.notice p,.notice li{font-size:16px;line-height:1.65;color:var(--body2)}
.notice ol{padding-left:22px}.notice li{margin:0 0 8px}
.notice table{width:100%;border-collapse:collapse;font-size:15px;margin:10px 0 18px}
.notice th{text-align:left;background:var(--ink);color:#fff;font-weight:500;padding:9px 12px;font-size:13px;letter-spacing:.06em;text-transform:uppercase}
.notice td{border-bottom:1px solid var(--line);padding:10px 12px;vertical-align:top;color:var(--body2);line-height:1.5}
.notice td:first-child{color:var(--ink);font-weight:500;width:34%}
@media(max-width:640px){
  .notice table,.notice tbody,.notice tr,.notice td{display:block;width:auto}
  .notice thead{display:none}
  .notice tr{border:1px solid var(--line);border-radius:10px;padding:12px 14px 6px;margin:0 0 10px;background:#fff}
  .notice td{border:0;padding:0 0 10px}
  .notice td:first-child{width:auto;font-size:16px}
  .notice td[data-l]::before{content:attr(data-l);display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-dk);font-weight:500;margin:0 0 3px}
}