*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;scroll-padding-top:96px;}

:root{
  --noir:#0D0D0D;
  --ivory:#F7F3EE;
  --crimson:#C41E3A;
  --crimson-dk:#a01830;
  --mid:#6B6B6B;
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Inter',system-ui,sans-serif;
  --line-l:rgba(13,13,13,0.10);
  --line-d:rgba(247,243,238,0.10);
}

body{font-family:var(--sans);background:var(--ivory);color:var(--noir);overflow-x:hidden;}
a{text-decoration:none;color:inherit;}
strong{font-weight:600;}

/* ── BUTTONS ─────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;border:none;transition:all .3s;}
.btn-red{background:var(--crimson);color:var(--ivory);padding:16px 40px;}
.btn-red:hover{background:var(--crimson-dk);transform:translateY(-2px);}

/* ── TOP BAR ─────────────────────────────────────────── */
.topbar{background:var(--noir);border-bottom:1px solid var(--line-d);padding:18px 40px;display:flex;align-items:center;justify-content:space-between;gap:16px;}
.brand{display:block;line-height:0;}
.brand img{height:44px;width:auto;}
.brand-foot img{height:52px;}
.back{font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:rgba(247,243,238,.45);transition:color .3s;}
.back:hover{color:var(--ivory);}

/* ── HERO ────────────────────────────────────────────── */
.hero{background:var(--noir);padding:88px 40px 96px;text-align:center;position:relative;overflow:hidden;}
.hero::before{content:'';position:absolute;top:-150px;right:-150px;width:500px;height:500px;background:radial-gradient(circle,rgba(196,30,58,.13) 0%,transparent 70%);pointer-events:none;}
.hero::after{content:'';position:absolute;bottom:-100px;left:-100px;width:400px;height:400px;background:radial-gradient(circle,rgba(196,30,58,.07) 0%,transparent 70%);pointer-events:none;}
.hero-inner{max-width:720px;margin:0 auto;position:relative;}
.hero-badge{display:inline-block;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--crimson);border:1px solid rgba(196,30,58,.35);padding:6px 16px;margin-bottom:32px;}
.hero h1{font-family:var(--serif);font-size:clamp(44px,7vw,84px);font-weight:300;line-height:1.03;color:var(--ivory);margin-bottom:24px;text-wrap:balance;}
.hero h1 em{font-style:italic;color:var(--crimson);}
.hero-sub{font-size:15px;font-weight:300;line-height:1.85;color:rgba(247,243,238,.58);max-width:540px;margin:0 auto 28px;}
.hero-sub:last-child{margin-bottom:0;}

/* ── LAYOUT ──────────────────────────────────────────── */
.wrap{max-width:1040px;margin:0 auto;padding:88px 40px 120px;display:grid;grid-template-columns:220px 1fr;gap:72px;align-items:start;}

/* TOC */
.toc{position:sticky;top:32px;}
.toc-label{font-size:10px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--crimson);margin-bottom:18px;display:block;}
.toc ol{list-style:none;border-left:1px solid var(--line-l);}
.toc a{display:block;padding:8px 0 8px 18px;margin-left:-1px;border-left:2px solid transparent;font-size:12px;line-height:1.4;color:var(--mid);transition:color .3s,border-color .3s;}
.toc a:hover{color:var(--noir);}
.toc a.active{color:var(--noir);font-weight:600;border-left-color:var(--crimson);}

/* SUMMARY */
.summary{background:var(--noir);padding:44px 44px 40px;margin-bottom:72px;position:relative;overflow:hidden;}
.summary::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--crimson);}
.eyebrow{display:block;font-size:10px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--crimson);margin-bottom:16px;}
.summary h2{font-family:var(--serif);font-size:clamp(26px,3.4vw,36px);font-weight:300;color:var(--ivory);line-height:1.15;margin-bottom:22px;}
.summary h2 em{font-style:italic;color:var(--crimson);}
.summary ul{list-style:none;display:flex;flex-direction:column;gap:12px;}
.summary li{font-size:14px;line-height:1.7;color:rgba(247,243,238,.68);display:flex;gap:12px;}
.summary li::before{content:'✓';color:var(--crimson);font-weight:700;flex-shrink:0;}
.summary li strong{color:var(--ivory);}
.summary .fine{margin-top:22px;font-size:12px;line-height:1.7;color:rgba(247,243,238,.38);}

/* SECTIONS */
.sec{padding-bottom:64px;margin-bottom:64px;border-bottom:1px solid var(--line-l);}
.sec:last-of-type{border-bottom:none;margin-bottom:0;padding-bottom:0;}
.sec-head{display:flex;align-items:baseline;gap:18px;margin-bottom:24px;}
.sec-no{font-family:var(--serif);font-size:40px;font-weight:300;color:rgba(196,30,58,.28);line-height:1;flex-shrink:0;}
.sec h2{font-family:var(--serif);font-size:clamp(28px,3.6vw,40px);font-weight:300;line-height:1.1;text-wrap:balance;}
.sec h2 em{font-style:italic;color:var(--crimson);}
.sec p{font-size:14px;line-height:1.9;color:#3d3d3d;margin-bottom:16px;max-width:64ch;}
.sec p:last-child{margin-bottom:0;}
.sec a.link{color:var(--crimson);border-bottom:1px solid rgba(196,30,58,.35);transition:border-color .3s;}
.sec a.link:hover{border-color:var(--crimson);}
.sec ul.plain{list-style:none;margin:0 0 16px;display:flex;flex-direction:column;gap:10px;max-width:64ch;}
.sec ul.plain li{font-size:14px;line-height:1.8;color:#3d3d3d;padding-left:22px;position:relative;}
.sec ul.plain li::before{content:'';position:absolute;left:0;top:.8em;width:10px;height:1px;background:var(--crimson);}

/* NOTE */
.note{background:#fff;border-left:3px solid var(--crimson);padding:20px 24px;font-size:13px;line-height:1.8;color:var(--mid);margin:8px 0 20px;max-width:64ch;}
.note strong{color:var(--noir);}

/* CONTACT */
.contact{background:var(--noir);padding:48px 44px;text-align:center;margin-top:8px;position:relative;overflow:hidden;}
.contact::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--crimson);}
.contact .eyebrow{margin-bottom:14px;}
.contact-t{font-family:var(--serif);font-size:clamp(22px,3vw,30px);font-weight:300;color:var(--ivory);line-height:1.3;margin-bottom:10px;text-wrap:balance;}
.contact-t em{font-style:italic;color:var(--crimson);}
.sec .contact .contact-d{font-size:13px;line-height:1.8;color:rgba(247,243,238,.5);max-width:440px;margin:0 auto 28px;}

/* ── FOOTER ──────────────────────────────────────────── */
footer{background:var(--noir);border-top:1px solid var(--line-d);padding:40px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:20px;}
.footer-links{display:flex;gap:24px;}
.footer-links a{font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:rgba(247,243,238,.3);transition:color .3s;}
.footer-links a:hover,.footer-links a[aria-current]{color:var(--ivory);}
.footer-copy{font-size:10px;color:rgba(247,243,238,.2);}

/* ── RESPONSIVE ──────────────────────────────────────── */
@media(max-width:900px){
  .topbar{padding:16px 24px;}
  .hero{padding:72px 24px 80px;}
  .wrap{grid-template-columns:1fr;gap:40px;padding:56px 24px 80px;}
  .toc{position:static;background:#fff;border:1px solid var(--line-l);padding:22px 22px 14px;}
  .toc ol{border-left:none;display:grid;grid-template-columns:1fr 1fr;column-gap:20px;}
  .toc a{padding:7px 0;border-left:none;margin-left:0;}
  .toc a.active{border-left:none;}
  .summary{padding:36px 28px 32px;margin-bottom:56px;}
  footer{flex-direction:column;text-align:center;padding:32px 24px;}
  .footer-links{flex-wrap:wrap;justify-content:center;}
}
@media(max-width:600px){
  .toc ol{grid-template-columns:1fr;}
  .sec-head{gap:12px;}
  .sec-no{font-size:32px;}
  .contact{padding:40px 24px;}
}

/* ── MOTION ──────────────────────────────────────────── */
:root{--spring:cubic-bezier(.34,1.56,.64,1);--out:cubic-bezier(.22,1,.36,1);}

/* hero: staggered entrance, drifting glows, floating logo */
@keyframes heroIn{from{opacity:0;transform:translateY(26px) scale(.97)}to{opacity:1;transform:none}}
.hero-inner>*{animation:heroIn .9s var(--spring) both;}
.hero-inner>*:nth-child(1){animation-delay:.1s}
.hero-inner>*:nth-child(2){animation-delay:.22s}
.hero-inner>*:nth-child(3){animation-delay:.34s}
.hero-inner>*:nth-child(4){animation-delay:.46s}
.hero::before{animation:drift 14s ease-in-out infinite alternate;}
.hero::after{animation:drift2 18s ease-in-out infinite alternate;}
@keyframes drift{to{transform:translate(-70px,60px) scale(1.18)}}
@keyframes drift2{to{transform:translate(60px,-50px) scale(1.15)}}
.topbar .brand img{transition:transform .5s var(--spring);}
.topbar .brand:hover img{transform:scale(1.06);}
.back{transition:color .3s,transform .4s var(--spring);}
.back:hover{transform:translateX(-4px);}

/* scroll reveal (individual translate/scale so hover transforms never collide) */
.r{opacity:0;translate:0 34px;scale:.97;transition:opacity .7s var(--out),translate .9s var(--spring),scale .9s var(--spring),transform .5s var(--spring),box-shadow .4s var(--out),border-color .3s,background-color .3s;}
.r.on{opacity:1;translate:0 0;scale:1;}
.r.rd{transition-delay:0s!important;}

/* section numbers pop in with their heading */
@keyframes popIn{0%{opacity:0;transform:scale(.3) rotate(-18deg)}100%{opacity:1;transform:none}}
.sec-head:not(.on) .sec-no{opacity:0;}
.sec-head.on .sec-no{animation:popIn .8s var(--spring) .1s both;}

/* list rows spring in one after another */
@keyframes rowIn{from{opacity:0;transform:translateX(-18px) scale(.97)}to{opacity:1;transform:none}}
.summary:not(.on) li{opacity:0;}
.summary.on li{animation:rowIn .65s var(--spring) both;animation-delay:calc(var(--i,0)*80ms + .25s);}

/* hover: cards lift with a springy bounce */
.right-card,.step,.dd-col,.note,.summary,.contact{transition:transform .5s var(--spring),box-shadow .4s var(--out),border-color .3s,background-color .3s;}
.right-card:hover,.step:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(13,13,13,.12);}
.dd-col:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(13,13,13,.14);}
.note:hover{transform:translateX(6px);}
.tbl tbody tr{transition:background-color .3s;}
.tbl tbody tr:hover{background:rgba(196,30,58,.035);}
.sec ul.plain li{transition:transform .4s var(--spring);}
.sec ul.plain li:hover{transform:translateX(6px);}
.toc a{transition:color .3s,border-color .3s,padding-left .4s var(--spring);}
.toc a:hover{padding-left:24px;}
.sec a.link{transition:border-color .3s,color .3s;}

/* buttons: spring on hover, squish on press, soft ring on the main CTA */
.btn{transition:transform .4s var(--spring),background-color .3s,box-shadow .3s;}
.btn:hover{transform:translateY(-3px) scale(1.03);}
.btn:active{transform:translateY(0) scale(.96);transition-duration:.12s;}
.btn-red:hover{box-shadow:0 12px 30px rgba(196,30,58,.38);}
.contact .btn-red{animation:ring 2.8s ease-out infinite;}
.contact .btn-red:hover{animation:none;}
@keyframes ring{0%{box-shadow:0 0 0 0 rgba(196,30,58,.5)}70%{box-shadow:0 0 0 16px rgba(196,30,58,0)}100%{box-shadow:0 0 0 0 rgba(196,30,58,0)}}

/* footer links */
.footer-links a{transition:color .3s,transform .4s var(--spring);display:inline-block;}
.footer-links a:hover{transform:translateY(-2px);}

/* scroll progress bar */
.progress{position:fixed;top:0;left:0;height:3px;width:100%;background:var(--crimson);transform:scaleX(0);transform-origin:left;z-index:1000;pointer-events:none;}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important;transition-delay:0s!important;}
  .r{opacity:1;translate:none;scale:none;}
  .sec-head:not(.on) .sec-no,.summary:not(.on) li{opacity:1;}
  .progress{display:none;}
}