:root{
  --brand:#ED9A09; --brand-600:#cf8400; --ink:#0b0f16; --ink-2:#141b25;
  --text:#1b2027; --dim:#5c6570; --line:#e4e8ee; --mist:#f5f7fa; --white:#fff;
  --r:16px; --r-sm:10px; --wrap:1160px; --ease:cubic-bezier(.4,0,.2,1);
  --fb:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --fd:'Oswald','Inter',sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--fb);color:var(--text);background:var(--white);line-height:1.65;font-size:17px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 22px}
a{color:var(--brand-600);text-decoration:none}a:hover{text-decoration:underline}
img{max-width:100%;height:auto;display:block}
h1,h2,h3{font-family:var(--fd);line-height:1.16;color:var(--ink);font-weight:600;letter-spacing:.3px}
h1{font-size:clamp(2rem,4.6vw,3.2rem);margin:.15em 0 .35em;text-transform:uppercase}
h2{font-size:1.6rem;margin:1.9em 0 .5em}
h3{font-size:1.18rem;margin:0 0 .3em}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;padding:8px;z-index:99}

/* header */
.hdr{background:var(--ink);position:sticky;top:0;z-index:40;box-shadow:0 1px 0 rgba(255,255,255,.06)}
.hdr-in{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:64px}
.brand img{display:block}
.navtoggle{display:none;background:none;border:0;color:#fff;font-size:1.5rem;cursor:pointer}
.nav{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.nav a{color:#cdd5df;font-size:.92rem;white-space:nowrap}.nav a:hover,.nav a.on{color:var(--brand);text-decoration:none}
.nav .cta{background:var(--brand);color:#1a1304;padding:9px 17px;border-radius:var(--r-sm);font-weight:700;font-family:var(--fd);text-transform:uppercase;font-size:.82rem;letter-spacing:.03em}
.nav .cta:hover{background:#fff}

/* hero with image */
.hero{position:relative;color:#eef2f7;padding:96px 0 84px;overflow:hidden;
  background:linear-gradient(105deg,rgba(8,11,17,.94) 0%,rgba(8,11,17,.74) 48%,rgba(8,11,17,.4) 100%),var(--bg) center/cover no-repeat,var(--ink)}
.hero::after{content:"";position:absolute;inset:0;background:radial-gradient(900px 380px at 82% -10%,rgba(237,154,9,.22),transparent);pointer-events:none}
.hero-in{position:relative;max-width:780px}
.eyebrow{color:var(--brand);font-family:var(--fd);letter-spacing:.18em;text-transform:uppercase;font-size:.82rem;margin:0 0 .7em}
.hero h1{color:#fff}
.hero .lead{font-size:1.28rem;color:#cdd5df;max-width:680px}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.btn{display:inline-block;background:var(--brand);color:#1a1304;font-family:var(--fd);text-transform:uppercase;font-weight:700;letter-spacing:.03em;padding:13px 26px;border-radius:var(--r-sm);transition:transform .18s var(--ease),background .18s}
.btn:hover{background:var(--brand-600);color:#1a1304;text-decoration:none;transform:translateY(-2px)}
.btn.ghost{background:transparent;border:2px solid rgba(255,255,255,.35);color:#fff}
.btn.ghost:hover{background:var(--brand);border-color:var(--brand);color:#1a1304}

/* stats band */
.stats{background:var(--ink-2);color:#fff}
.stats-in{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:26px 0}
.stat{text-align:center}
.stat .num{display:block;font-family:var(--fd);font-size:1.9rem;color:var(--brand);font-weight:700}
.stat .lbl{display:block;font-size:.82rem;color:#9fb0c0;letter-spacing:.04em;text-transform:uppercase}

/* features */
.features{padding:54px 0 8px;background:var(--white)}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.card{background:var(--mist);border:1px solid var(--line);border-radius:var(--r);padding:24px 22px;transition:box-shadow .2s,transform .2s}
.card:hover{box-shadow:0 14px 32px rgba(15,22,35,.1);transform:translateY(-3px)}
.card .ico{display:inline-flex;width:46px;height:46px;align-items:center;justify-content:center;border-radius:12px;background:var(--ink);color:var(--brand);font-size:1.5rem;margin-bottom:12px}
.card h3{font-size:1.08rem}.card p{margin:.2em 0 0;color:var(--dim);font-size:.96rem}

/* inner page hero */
.phead{position:relative;color:#eef2f7;padding:62px 0 46px;
  background:linear-gradient(100deg,rgba(8,11,17,.95),rgba(8,11,17,.7) 70%,rgba(8,11,17,.5)),var(--bg) center/cover no-repeat,var(--ink)}
.phead h1{color:#fff}.phead .lead{font-size:1.18rem;color:#cdd5df;max-width:760px;margin:.2em 0 0}
.crumbs{font-size:.85rem;color:#a9b6c4;margin-bottom:.6em}.crumbs a{color:#cdd5df}.crumbs span{margin:0 7px}

/* body */
.body{padding:40px 0 56px}
.flow{max-width:830px}
.flow p,.flow ul,.flow ol{margin:0 0 1em}
.flow ul,.flow ol{padding-left:1.25em}.flow li{margin:.35em 0}
.flow table{width:100%;border-collapse:collapse;margin:1.3em 0;font-size:.95rem;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.flow th,.flow td{border:1px solid var(--line);padding:10px 13px;text-align:left;vertical-align:top}
.flow thead th{background:var(--ink);color:#fff;font-family:var(--fd);font-weight:600}
.flow tbody tr:nth-child(even){background:var(--mist)}
.flow code{background:var(--mist);padding:2px 6px;border-radius:5px;font-size:.9em}
.flow h3{margin-top:1.5em}

.faq details{border:1px solid var(--line);border-radius:var(--r-sm);padding:2px 18px;margin:.55em 0;background:var(--white)}
.faq summary{cursor:pointer;font-weight:600;font-family:var(--fd);padding:12px 0}
.faq details[open]{background:var(--mist)}.faq details>div{padding-bottom:10px}

.callout{background:var(--ink);color:#eef2f7;border-radius:var(--r);padding:30px 30px;margin:40px 0}
.callout h2{color:#fff;margin-top:0}.callout a{color:var(--brand)}
.callout-btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:6px}
.callout .btn.ghost{border-color:rgba(255,255,255,.4)}

.related ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.related li a{display:inline-block;background:var(--mist);border:1px solid var(--line);border-radius:999px;padding:8px 16px;font-size:.92rem}

/* explore grid (home) */
.explore{padding:18px 0 64px;background:var(--white)}
.ex-h{text-align:center;margin:0 0 26px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.tile{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--white);color:inherit;transition:box-shadow .2s,transform .2s}
.tile:hover{box-shadow:0 16px 36px rgba(15,22,35,.13);transform:translateY(-3px);text-decoration:none}
.tile .thumb{display:block;aspect-ratio:16/9;background:var(--ink) center/cover no-repeat}
.tile .t-body{padding:16px 18px}
.tile strong{display:block;font-family:var(--fd);font-size:1.05rem;color:var(--ink);margin-bottom:4px}
.tile .t-body span{color:var(--dim);font-size:.9rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* footer */
.ftr{background:#080b11;color:#9fb0c0;padding:54px 0 26px;font-size:.92rem;margin-top:40px}
.ftr-in{display:grid;grid-template-columns:1.5fr 1fr;gap:34px}
.ftr-brand img{margin-bottom:12px}
.ftr a{color:#cdd5df}.ftr a:hover{color:var(--brand)}
.ftr-nav{display:flex;flex-direction:column;gap:9px}
.mono{font-size:.85rem;color:#7d8c9b}
.ftr-bot{border-top:1px solid #1a232e;margin-top:30px;padding-top:18px;font-size:.85rem;color:#7d8c9b}

@media(max-width:900px){
  .cards,.grid{grid-template-columns:repeat(2,1fr)}
  .stats-in{grid-template-columns:repeat(2,1fr);gap:18px}
}
@media(max-width:680px){
  .navtoggle{display:block}
  .nav{display:none;flex-direction:column;align-items:flex-start;width:100%;gap:12px;padding:8px 0 14px}
  body.navopen .nav{display:flex}
  .hdr-in{flex-wrap:wrap;min-height:0;padding:10px 0}
  .cards,.grid{grid-template-columns:1fr}
  .ftr-in{grid-template-columns:1fr}
}