@font-face{font-family:"EB Garamond";src:url(fonts/eb-garamond-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"EB Garamond";src:url(fonts/eb-garamond-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Jost";src:url(fonts/jost-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Jost";src:url(fonts/jost-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}

:root{
  --bg:#0c1219;
  --bg-2:#111922;
  --surface:#151e29;
  --ink:#f4efe4;
  --muted:#a3acb8;
  --gold:#d1b06b;
  --line:#26313e;
  --serif:"EB Garamond",Georgia,serif;
  --sans:"Jost",system-ui,sans-serif;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:5.5rem}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.0625rem/1.65 var(--sans)}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

.wrap{width:min(1120px,100% - 3rem);margin-inline:auto}

.eyebrow{margin:0 0 1rem;color:var(--gold);font-size:.75rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase}
h1,h2,h3{margin:0;font-family:var(--serif);font-weight:400;line-height:1.08}
h1{font-size:clamp(2.9rem,6.6vw,5.1rem);letter-spacing:-.012em}
h1 em{color:var(--gold);font-style:normal}
h2{font-size:clamp(2rem,4vw,3rem)}
h3{font-size:1.6rem;font-weight:500}
.section-lead{max-width:58ch;margin:1rem 0 0;color:var(--muted)}

.site-head{position:sticky;top:0;z-index:10;background:rgba(12,18,25,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding-block:.9rem}
.brand{display:flex;align-items:center;gap:.85rem;text-decoration:none}
.brand img{width:54px}
.brand span{font-family:var(--serif);font-size:1.3rem;line-height:1.15}
.brand small{display:block;margin-top:.15rem;color:var(--gold);font-family:var(--sans);font-size:.66rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase}
.site-head nav{display:flex;align-items:center;gap:1.75rem;font-size:.95rem}
.site-head nav a{color:var(--muted);text-decoration:none;transition:color .15s}
.site-head nav a:hover{color:var(--ink)}
.site-head nav a.call{padding:.4rem 1rem;border:1px solid var(--gold);color:var(--gold);transition:background .15s,color .15s}
.site-head nav a.call:hover{background:var(--gold);color:var(--bg)}

.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line);background:radial-gradient(70% 90% at 78% 15%,#1b2a3a 0,transparent 70%)}
#net{position:absolute;inset:0;width:100%;height:100%}
.hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 370px;gap:4rem;align-items:center;padding-block:clamp(4rem,9vw,7.5rem)}
.hero .lead{max-width:50ch;margin:1.6rem 0 2.2rem;color:var(--muted);font-size:1.2rem}
.actions{display:flex;flex-wrap:wrap;gap:.9rem}
.btn{display:inline-block;padding:.8rem 1.6rem;border:1px solid var(--gold);background:var(--gold);color:var(--bg);font:500 1rem var(--sans);text-decoration:none;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.btn:hover{background:#e3c687;border-color:#e3c687}
.btn.ghost{background:transparent;border-color:var(--line);color:var(--ink)}
.btn.ghost:hover{border-color:var(--gold);color:var(--gold);background:transparent}

.card{padding:2rem;background:rgba(21,30,41,.86);border:1px solid var(--line);border-top:2px solid var(--gold)}
.card .who{font-family:var(--serif);font-size:1.9rem;line-height:1.1}
.card .role{margin:.35rem 0 1.5rem;color:var(--gold);font-size:.72rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase}
.card ul{display:grid;gap:.85rem;margin:0 0 1.6rem;padding:0;list-style:none}
.card li{display:flex;align-items:center;gap:.75rem;overflow-wrap:anywhere}
.card li svg{flex:none;width:18px;height:18px;color:var(--gold)}
.card li a{text-decoration:none}
.card li a:hover{color:var(--gold)}
.card .btn{display:block;text-align:center}

section.block{padding-block:clamp(4rem,8vw,6.5rem);border-bottom:1px solid var(--line)}
section.alt{background:var(--bg-2)}

.services{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;margin-top:3rem}
.services article{padding:2rem 1.75rem;background:var(--surface);border:1px solid var(--line);transition:border-color .2s,transform .2s}
.services article:hover{border-color:var(--gold);transform:translateY(-3px)}
.services svg{width:30px;height:30px;margin-bottom:1.25rem;color:var(--gold)}
.services p{margin:.8rem 0 0;color:var(--muted)}

.check{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:3rem;margin-top:3rem;align-items:start}
.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem}
.tile{position:relative;display:block;padding:1.25rem 3rem 1.25rem 1.25rem;background:var(--surface);border:1px solid var(--line);cursor:pointer;transition:border-color .15s,background .15s,transform .15s}
.tile:hover{border-color:var(--gold);transform:translateY(-2px)}
.tile input{position:absolute;opacity:0}
.tile strong{display:block;font-family:var(--serif);font-size:1.3rem;font-weight:500;line-height:1.2}
.tile small{display:block;margin-top:.3rem;color:var(--muted);font-size:.92rem;line-height:1.4}
.tick{position:absolute;top:1.2rem;right:1.1rem;width:22px;height:22px;border:1px solid var(--muted);border-radius:50%;transition:all .15s}
.tick::after{content:"";position:absolute;left:7px;top:3px;width:6px;height:11px;border:solid var(--bg);border-width:0 2px 2px 0;transform:rotate(45deg);opacity:0}
.tile:has(input:checked){border-color:var(--gold);background:#1f2a33}
.tile input:checked~.tick{background:var(--gold);border-color:var(--gold)}
.tile input:checked~.tick::after{opacity:1}
.tile input:focus-visible~.tick{outline:2px solid var(--gold);outline-offset:3px}

.result{position:sticky;top:6rem;padding:2rem;background:var(--surface);border:1px solid var(--line);text-align:center}
.ring{position:relative;width:150px;margin:0 auto 1.25rem}
.ring svg{transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:8}
.ring .track{stroke:var(--line)}
.ring .bar{stroke:var(--gold);stroke-dasharray:339.3;stroke-dashoffset:339.3;transition:stroke-dashoffset .45s ease}
.ring b{position:absolute;inset:0;display:grid;place-items:center;font:400 2.3rem var(--serif)}
.result h3{font-size:1.4rem}
.result p{margin:.6rem 0 0;color:var(--muted);font-size:.98rem}
.result .btn{margin-top:1.25rem}
.result .btn[hidden]{display:none}
.note{margin:1.25rem 0 0;color:var(--muted);font-size:.85rem}

.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem;margin:3rem 0 0;padding:0;list-style:none;counter-reset:step}
.steps li{position:relative;padding-top:1.25rem;border-top:1px solid var(--gold);counter-increment:step}
.steps li::before{content:counter(step,decimal-leading-zero);display:block;margin-bottom:.5rem;color:var(--gold);font-family:var(--serif);font-size:1.5rem}
.steps p{margin:.5rem 0 0;color:var(--muted)}

.cta{text-align:center}
.cta p{margin:1rem auto 2rem;max-width:46ch;color:var(--muted)}
.cta .actions{justify-content:center}

.legal{padding-block:clamp(3rem,6vw,4.5rem);max-width:68ch}
.legal h1{font-size:clamp(2.2rem,5vw,3rem)}
.legal h2{margin-top:2.25rem;font-size:1.5rem}
.legal p,.legal ul{color:var(--muted)}

.site-foot{color:var(--muted);font-size:.9rem}
.site-foot .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem 2rem;padding-block:1.75rem}
.site-foot nav{display:flex;gap:1.5rem}

.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.js .reveal.in{opacity:1;transform:none}

@media (max-width:900px){
  .hero-grid,.check{grid-template-columns:minmax(0,1fr)}
  .hero-grid{gap:2.5rem}
  .result{position:static}
  .services,.steps{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:760px){
  .wrap{width:calc(100% - 2rem)}
  .site-head nav a:not(.call){display:none}
  .brand img{width:46px}
  .brand small{font-size:.58rem;letter-spacing:.12em}
  .tiles{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none!important}
  .js .reveal{opacity:1;transform:none}
}