:root{
  --base-deepest:#0A0806; --base-deep:#110E0A; --base-dark:#1A1510;
  --terracotta:#D46830; --terracotta-glow:#E87A40;
  --sage:#6B8F71; --sage-bright:#7DA882;
  --cream:#EDE4D4; --cream-dim:#DDD0BE; --cream-muted:#B8A890;
  --gold-muted:#C4A878; --amber:#D4A030; --white:#FFFFFF;
  --border:#443828; --border-subtle:#332A1E;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Manrope',sans-serif;background:var(--base-deepest);color:var(--cream);line-height:1.6;overflow-x:hidden}

@keyframes fade-in{0%{opacity:0}100%{opacity:1}}
@keyframes fade-up{0%{opacity:0;transform:translateY(28px)}100%{opacity:1;transform:translateY(0)}}
@keyframes glow-text{0%,100%{text-shadow:0 0 14px rgba(232,122,64,.18)}50%{text-shadow:0 0 30px rgba(232,122,64,.45),0 0 60px rgba(232,122,64,.18)}}
@keyframes glow-sage{0%,100%{text-shadow:0 0 14px rgba(125,168,130,.18)}50%{text-shadow:0 0 30px rgba(125,168,130,.45),0 0 60px rgba(125,168,130,.18)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0ms!important;transition-duration:0ms!important}}

a{color:inherit}

/* ---- NAV ---- */
.markline{position:fixed;top:0;left:0;right:0;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:20px 40px;background:linear-gradient(180deg,rgba(10,8,6,.85),rgba(10,8,6,0));backdrop-filter:blur(6px);animation:fade-in 1.2s ease-out .2s both}
.wordmark{display:flex;align-items:center;gap:13px;text-decoration:none;color:var(--cream)}
.wordmark .name{font-family:'Libre Baskerville',serif;font-size:17px;font-weight:700;letter-spacing:.2px;color:var(--white)}
.navlinks{display:flex;align-items:center;gap:30px}
.navlinks a{font-size:14px;font-weight:500;color:var(--cream-dim);text-decoration:none;transition:color .2s;padding:8px 2px}
.navlinks a:hover,.navlinks a.active{color:var(--white)}

/* ---- HERO (layout is per page) ---- */
.stage{position:absolute;inset:0;overflow:hidden;background:radial-gradient(120% 120% at 50% 35%, #1A1510 0%, #0E0B08 55%, #0A0806 100%);z-index:0}
#field{position:absolute;inset:0;width:100%;height:100%;z-index:0;transition:opacity 1.2s ease}
#bgvideo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;opacity:0;transition:opacity 1.2s ease}
#bgvideo.ready{opacity:1}

h1{font-family:'Libre Baskerville',serif;font-weight:700;font-size:clamp(34px,5.4vw,68px);line-height:1.08;color:var(--white);max-width:15em;margin-bottom:24px;animation:fade-up 1s ease-out .6s both}
.subhero{font-size:clamp(19px,2.4vw,26px);font-weight:300;color:var(--cream-dim);max-width:30em;line-height:1.6;margin-bottom:36px;animation:fade-up 1s ease-out .75s both}

.actions{display:flex;gap:15px;flex-wrap:wrap;justify-content:center;animation:fade-up 1s ease-out .9s both}
.btn{padding:15px 28px;border-radius:11px;font-family:'Manrope',sans-serif;font-size:15px;font-weight:600;border:none;cursor:pointer;text-decoration:none;transition:transform .25s,box-shadow .25s,background .25s,border-color .25s;display:inline-flex;align-items:center;gap:9px}
.btn-ghost{background:rgba(237,228,212,.04);color:var(--cream);border:1px solid var(--border)}
.btn-ghost:hover{border-color:var(--cream-muted);background:rgba(237,228,212,.08);transform:translateY(-2px)}
.btn .arrow{transition:transform .25s}
.btn:hover .arrow{transform:translateX(3px)}

/* ---- SECTION SHELL ---- */
section.block{position:relative;z-index:5;padding:96px 28px;max-width:1080px;margin:0 auto}
.sec-eyebrow{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-muted);text-align:center;margin-bottom:16px}
.sec-title{font-family:'Libre Baskerville',serif;font-weight:700;font-size:clamp(28px,3.6vw,44px);line-height:1.12;color:var(--white);text-align:center;max-width:18em;margin:0 auto 18px}
.sec-lead{font-size:clamp(17px,1.9vw,20px);font-weight:300;color:var(--cream-dim);text-align:center;max-width:36em;margin:0 auto 56px;line-height:1.6}

/* steps */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.steps.steps-3{grid-template-columns:repeat(3,1fr)}
.step{background:linear-gradient(180deg,rgba(26,21,16,.7),rgba(17,14,10,.5));border:1px solid var(--border-subtle);border-radius:16px;padding:26px 22px;transition:transform .25s,border-color .25s}
.step:hover{transform:translateY(-4px);border-color:var(--border)}
.step .num{font-family:'JetBrains Mono',monospace;font-size:13px;letter-spacing:.1em;margin-bottom:14px}
.step h3{font-family:'Libre Baskerville',serif;font-size:19px;color:var(--white);margin-bottom:10px;line-height:1.25}
.step p{font-size:15px;color:var(--cream-muted);line-height:1.55}

/* cards */
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.cards.cards-3{grid-template-columns:repeat(3,1fr)}
.card{background:linear-gradient(180deg,rgba(26,21,16,.6),rgba(17,14,10,.4));border:1px solid var(--border-subtle);border-radius:16px;padding:30px 28px;transition:transform .25s,border-color .25s}
.card:hover{transform:translateY(-4px);border-color:var(--border)}
.card .ic{width:42px;height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center;margin-bottom:18px}
.card h3{font-family:'Libre Baskerville',serif;font-size:21px;color:var(--white);margin-bottom:10px}
.card p{font-size:16px;color:var(--cream-dim);line-height:1.6}
.card h3.card-stat{font-size:34px;font-family:'Libre Baskerville',serif}
.card-before h3{color:var(--cream-muted)}

/* privacy band */
.trust{background:linear-gradient(180deg,#120F0B,#0C0A07);border-top:1px solid var(--border-subtle);border-bottom:1px solid var(--border-subtle)}
.trust .inner{max-width:1080px;margin:0 auto;padding:90px 28px;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.trust h2{font-family:'Libre Baskerville',serif;font-weight:700;font-size:clamp(26px,3.2vw,38px);color:var(--white);line-height:1.15;margin-bottom:18px}
.trust p{font-size:17px;color:var(--cream-dim);line-height:1.65;margin-bottom:16px}
.trust .pill{display:inline-flex;align-items:center;gap:9px;font-size:14px;color:var(--cream);background:rgba(125,168,130,.08);border:1px solid rgba(125,168,130,.28);border-radius:999px;padding:8px 14px;margin:4px 6px 0 0}
.trust .pill .dot{width:7px;height:7px;border-radius:50%;background:var(--sage-bright);box-shadow:0 0 8px rgba(125,168,130,.6)}
.list-label{font-size:14px;color:var(--cream-muted);margin-bottom:14px;font-family:'JetBrains Mono',monospace;letter-spacing:.1em;text-transform:uppercase}
.seelist{list-style:none}
.seelist li{display:flex;gap:12px;align-items:flex-start;font-size:16px;color:var(--cream-dim);padding:11px 0;border-bottom:1px solid var(--border-subtle)}
.seelist li:last-child{border-bottom:none}
.seelist .tick{flex:none;width:20px;height:20px;border-radius:50%;background:rgba(125,168,130,.16);border:1px solid rgba(125,168,130,.4);display:flex;align-items:center;justify-content:center;color:var(--sage-bright);font-size:12px;margin-top:2px}

/* final CTA */
.cta{position:relative;z-index:5;text-align:center;padding:100px 28px 110px;max-width:760px;margin:0 auto}
.cta h2{font-family:'Libre Baskerville',serif;font-weight:700;font-size:clamp(28px,3.6vw,44px);color:var(--white);margin-bottom:16px;line-height:1.15}
.cta p{font-size:18px;color:var(--cream-dim);margin-bottom:30px}
.cta .note{font-size:14px;color:var(--cream-muted);margin-top:22px}
.cta .note a{text-decoration:none}

/* footer */
footer{border-top:1px solid var(--border-subtle);padding:40px 28px;text-align:center}
footer .links{display:flex;gap:24px;justify-content:center;flex-wrap:wrap;margin-bottom:14px}
footer a{font-size:14px;color:var(--cream-muted);text-decoration:none;transition:color .2s}
footer a:hover{color:var(--cream)}
footer .copy{font-size:13px;color:var(--cream-muted)}

@media (max-width:900px){
  .steps{grid-template-columns:repeat(2,1fr)}
  .trust .inner{grid-template-columns:1fr;gap:30px}
  .cards.cards-3{grid-template-columns:1fr}
}
@media (max-width:640px){
  .markline{padding:16px 20px}
  .navlinks{gap:16px}
  .navlinks a{font-size:13px}
  .cards{grid-template-columns:1fr}
  section.block{padding:72px 22px}
}

/* ===================== ADAPTIVE COMFORT SYSTEM ===================== */
.lang-plain{display:none}
body[data-language="plain"] .lang-rich{display:none}
body[data-language="plain"] .lang-plain{display:inline}

body[data-motion="reduced"] #field{display:none}
body[data-motion="reduced"] h1 em{animation:none}
body[data-motion="off"] *{animation:none!important;transition:none!important}
body[data-motion="off"]{scroll-behavior:auto}
body[data-motion="off"] #field{display:none}
body[data-motion="off"] h1 em{animation:none}

body[data-visuals="calm"] #bgvideo.ready{opacity:.4}
body[data-visuals="calm"] h1 em{animation:none;text-shadow:none}
body[data-visuals="calm"] .btn-primary{box-shadow:none}
body[data-visuals="calm"] .uc-tab.active{box-shadow:none}

body[data-contrast="high"] .veil{background:rgba(8,6,4,.72)}
body[data-contrast="high"] h1,
body[data-contrast="high"] .subhero,
body[data-contrast="high"] .sec-title,
body[data-contrast="high"] .sec-lead,
body[data-contrast="high"] .step h3,
body[data-contrast="high"] .card h3,
body[data-contrast="high"] .callout p,
body[data-contrast="high"] .trust h2,
body[data-contrast="high"] .trust p,
body[data-contrast="high"] .cta h2,
body[data-contrast="high"] .cta p{color:#FFFFFF}
body[data-contrast="high"] .step p,
body[data-contrast="high"] .card p,
body[data-contrast="high"] .seelist li{color:#F2ECE0}

body[data-text="large"] h1{font-size:clamp(30px,4.8vw,60px)}
body[data-text="large"] .subhero{font-size:clamp(20px,2.7vw,28px)}
body[data-text="large"] .sec-title{font-size:clamp(30px,3.9vw,48px)}
body[data-text="large"] .sec-lead{font-size:clamp(18px,2.1vw,22px)}
body[data-text="large"] .step h3,body[data-text="large"] .card h3{font-size:22px}
body[data-text="large"] .step p,body[data-text="large"] .card p{font-size:17px}
body[data-text="large"] .btn{font-size:17px}
body[data-text="large"] .cta p,body[data-text="large"] .trust p{font-size:19px}
body[data-text="xlarge"] h1{font-size:clamp(34px,5.4vw,66px)}
body[data-text="xlarge"] .subhero{font-size:clamp(22px,3.1vw,31px)}
body[data-text="xlarge"] .sec-title{font-size:clamp(33px,4.3vw,52px)}
body[data-text="xlarge"] .sec-lead{font-size:clamp(20px,2.4vw,25px)}
body[data-text="xlarge"] .step h3,body[data-text="xlarge"] .card h3{font-size:24px}
body[data-text="xlarge"] .step p,body[data-text="xlarge"] .card p{font-size:19px}
body[data-text="xlarge"] .btn{font-size:19px}
body[data-text="xlarge"] .cta p,body[data-text="xlarge"] .trust p{font-size:21px}

body[data-density="spacious"] section.block{padding:120px 28px}
body[data-density="spacious"] .card,body[data-density="spacious"] .step{padding:36px 32px}
body[data-density="spacious"] .subhero{line-height:1.9}
body[data-density="compact"] section.block{padding:64px 28px}
body[data-density="compact"] .card,body[data-density="compact"] .step{padding:20px 18px}
body[data-density="compact"] .sec-lead{margin-bottom:36px}
body[data-density="compact"] .subhero{line-height:1.45}

body[data-reading="on"]{font-family:'Atkinson Hyperlegible',sans-serif;letter-spacing:.012em}
body[data-reading="on"] h1,
body[data-reading="on"] .sec-title,
body[data-reading="on"] .card h3,
body[data-reading="on"] .step h3,
body[data-reading="on"] .trust h2,
body[data-reading="on"] .cta h2,
body[data-reading="on"] .btn{font-family:'Atkinson Hyperlegible',sans-serif!important}
body[data-reading="on"] .subhero,
body[data-reading="on"] .card p,
body[data-reading="on"] .step p{line-height:1.8}

body[data-surfaces="solid"] .markline{background:var(--base-deepest);backdrop-filter:none}
body[data-surfaces="solid"] .card,body[data-surfaces="solid"] .step{background:var(--base-dark)}
body[data-surfaces="solid"] .panel{background:var(--base-dark)}
body[data-surfaces="solid"] .comfort-backdrop{backdrop-filter:none;background:rgba(6,4,3,.85)}

body[data-links="underline"] a:not(.btn):not(.wordmark):not(.uc-tab){text-decoration:underline;text-underline-offset:3px}

.comfort-invite{display:inline-flex;align-items:center;gap:10px;margin:0 auto 30px;padding:12px 22px;border-radius:999px;border:1px solid var(--gold-muted);background:rgba(196,168,120,.12);color:var(--cream);font-family:'Manrope',sans-serif;font-size:15px;font-weight:600;cursor:pointer;animation:fade-in 1s ease-out .3s both;transition:background .2s,border-color .2s,transform .2s}
.comfort-invite:hover{background:rgba(196,168,120,.22);border-color:var(--cream);transform:translateY(-1px)}
.comfort-invite svg{display:block}
.comfort-invite .pulse-dot{width:8px;height:8px;border-radius:50%;animation:invite-pulse 2s ease-in-out infinite}
@keyframes invite-pulse{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.3)}}
body[data-motion="off"] .comfort-invite .pulse-dot,body[data-motion="reduced"] .comfort-invite .pulse-dot{animation:none;opacity:.9}

.comfort-backdrop{position:fixed;inset:0;z-index:60;background:rgba(6,4,3,.62);backdrop-filter:blur(3px);display:none}
.comfort-backdrop.open{display:block}
.panel{position:fixed;z-index:61;top:50%;left:50%;transform:translate(-50%,-50%);width:430px;max-width:calc(100vw - 30px);max-height:86vh;overflow:auto;background:linear-gradient(180deg,#1B1611,#110E0A);border:1px solid var(--border);border-radius:20px;padding:26px 26px 22px;box-shadow:0 30px 80px rgba(0,0,0,.6);display:none}
.panel.open{display:block}
.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:4px}
.panel h4{font-family:'Libre Baskerville',serif;color:var(--white);font-size:20px}
.panel .sub{color:var(--cream-muted);font-size:13px;margin-bottom:18px;line-height:1.5}
.panel-close{background:none;border:none;color:var(--cream-muted);font-size:24px;line-height:1;cursor:pointer;padding:0 2px}
.panel-close:hover{color:var(--cream)}
.crow{margin-bottom:16px}
.crow .clabel{display:block;font-size:13px;font-weight:600;color:var(--cream-dim);margin-bottom:7px;letter-spacing:.02em}
.seg{display:flex;gap:6px;flex-wrap:wrap}
.seg button{flex:1;min-width:62px;padding:9px 8px;border-radius:9px;border:1px solid var(--border-subtle);background:transparent;color:var(--cream-muted);font-family:'Manrope',sans-serif;font-size:13px;font-weight:600;cursor:pointer;transition:all .15s}
.seg button:hover{border-color:var(--border);color:var(--cream)}
.panel .creset{width:100%;margin-top:4px;padding:11px;border-radius:9px;border:1px solid var(--border);background:transparent;color:var(--cream-dim);font-family:'Manrope',sans-serif;font-weight:600;cursor:pointer}
.panel .creset:hover{border-color:var(--cream-muted);color:var(--cream)}
.panel .cnote{margin-top:13px;font-size:12px;color:var(--cream-muted);line-height:1.5}
