:root{color-scheme:dark;--black:#080808;--panel:#111;--gray:#1a1a1a;--gold:#f5b700;--orange:#ff8a00;--gold-dark:#c58a00;--white:#fff;--muted:#aaa;--line:#292929;--font:'Inter',sans-serif;--heading:'Montserrat','Inter',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body.landing-body{margin:0;background:var(--black);color:#fff;font-family:var(--font);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:4px}.skip-link{position:fixed;z-index:99;top:8px;left:8px;padding:12px;background:var(--gold);color:#080808;transform:translateY(-150%)}.skip-link:focus{transform:none}.site-header{height:86px;position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:22px;padding:0 clamp(20px,5vw,80px);background:rgba(8,8,8,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(16px)}.brand{display:flex;align-items:center;gap:11px;flex-shrink:0}.brand img{width:46px;height:46px;object-fit:contain}.brand span{display:flex;flex-direction:column;gap:4px;letter-spacing:.14em;line-height:1}.brand strong{font:900 12px var(--heading)}.brand small{font-size:9px;color:var(--gold);letter-spacing:.32em}.site-nav{display:flex;align-items:center;gap:clamp(13px,2vw,28px);font-size:11px;font-weight:700;color:#ccc}.site-nav>a:not(.button):hover,.site-footer a:hover{color:var(--gold)}.nav-actions{display:flex;gap:8px}.menu-toggle{display:none}.button{min-height:49px;padding:0 19px;display:inline-flex;align-items:center;justify-content:center;gap:12px;border:1px solid transparent;border-radius:3px;font-size:10px;font-weight:800;letter-spacing:.055em;transition:transform .2s,background .2s,border-color .2s}.button:hover{transform:translateY(-2px)}.button-small{min-height:39px;padding:0 12px;font-size:8px;white-space:nowrap}.button-gold{background:var(--gold);border-color:var(--gold);color:#090909}.button-gold:hover{background:#ffd34a}.button-dark{background:#121212;border-color:#444;color:white}.button-dark:hover{border-color:var(--gold-dark);color:var(--gold)}.hero{min-height:min(760px,calc(100svh - 86px));position:relative;isolation:isolate;display:flex;align-items:center;overflow:hidden;padding:90px clamp(24px,9vw,140px) 95px;border-bottom:1px solid var(--line);background:#0c0b09}.hero-backdrop{position:absolute;z-index:-3;inset:0;background:linear-gradient(90deg,rgba(8,8,8,.98),rgba(8,8,8,.86) 46%,rgba(8,8,8,.42)),linear-gradient(0deg,#080808,transparent 35%),radial-gradient(ellipse at 77% 30%,rgba(245,183,0,.24),transparent 37%),linear-gradient(135deg,#241908,#12100b 48%,#080808)}.hero-backdrop:after{content:"";position:absolute;inset:0;opacity:.17;background:repeating-linear-gradient(120deg,transparent 0 70px,rgba(245,183,0,.22) 71px,transparent 73px 145px)}.hero-ring{position:absolute;z-index:-2;right:7%;top:10%;width:min(42vw,520px);aspect-ratio:1;border:1px solid rgba(245,183,0,.25);border-radius:50%;box-shadow:inset 0 0 65px rgba(245,183,0,.04),0 0 70px rgba(245,183,0,.04)}.hero-ring:before,.hero-ring:after{content:"";position:absolute;inset:9%;border:1px solid rgba(255,138,0,.22);border-radius:50%}.hero-ring:after{inset:20%;border-style:dashed}.hero-content{max-width:720px;position:relative;z-index:2}.eyebrow{display:flex;align-items:center;gap:9px;color:var(--gold);font-size:10px;font-weight:800;letter-spacing:.16em;line-height:1.7}.eyebrow>span{width:7px;height:7px;border-radius:50%;background:var(--orange);box-shadow:0 0 15px var(--orange)}.eyebrow b{color:#777}.hero h1{margin:25px 0 22px;font:900 clamp(44px,6.4vw,86px)/1.03 var(--heading);letter-spacing:-.06em}.hero h1 em,.section-heading h2 em{font-style:normal;color:var(--gold)}.hero-description{max-width:570px;color:#c2c2c2;font-size:15px;line-height:1.9}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}.hero-note{margin-top:43px;color:#888;font-size:9px;font-weight:700;letter-spacing:.16em}.hero-emblem{position:absolute;right:clamp(35px,13vw,190px);top:50%;transform:translateY(-50%);width:min(23vw,285px);aspect-ratio:1;display:flex;align-items:center;justify-content:center;border:1px solid rgba(245,183,0,.42);border-radius:50%;box-shadow:0 0 85px rgba(245,183,0,.07),inset 0 0 45px rgba(245,183,0,.06)}.hero-emblem:before,.hero-emblem:after{content:"";position:absolute;inset:8%;border:1px solid rgba(245,183,0,.2);border-radius:50%}.hero-emblem:after{inset:17%;border-style:dashed}.hero-emblem img{width:54%;height:54%;object-fit:contain;z-index:1}.hero-emblem span{position:absolute;bottom:13%;font-size:8px;letter-spacing:.2em;color:#f7d36a;z-index:2}.hero-footer{position:absolute;bottom:0;left:clamp(24px,9vw,140px);right:clamp(24px,9vw,140px);height:47px;display:flex;align-items:center;gap:15px;color:#777;font-size:9px;font-weight:800;letter-spacing:.14em}.hero-footer i{height:1px;max-width:150px;flex:1;background:linear-gradient(90deg,var(--gold-dark),transparent)}.section{padding:90px clamp(24px,9vw,140px)}.section-index{display:flex;align-items:center;gap:12px;color:#777;font-size:9px;font-weight:800;letter-spacing:.16em}.section-index:first-letter{color:var(--gold)}.section-index i{width:32px;height:1px;background:var(--gold-dark)}.split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(35px,8vw,110px);align-items:start;margin-top:38px}.section-heading h2{margin:13px 0;font:900 clamp(32px,4.4vw,57px)/1.12 var(--heading);letter-spacing:-.05em}.copy{padding-top:8px;color:var(--muted);font-size:14px;line-height:1.95}.copy p:first-child{margin-top:0;color:#e3e3e3;font-size:16px}.text-link{display:inline-block;margin-top:13px;color:var(--gold);font-size:10px;font-weight:800;letter-spacing:.12em}.features{background:#101010;border-block:1px solid var(--line)}.centered{text-align:center;max-width:700px;margin:35px auto 0}.centered .eyebrow{justify-content:center}.centered>p:last-child{color:var(--muted);font-size:13px;line-height:1.8}.feature-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:44px}.feature-card{min-height:230px;padding:24px;border:1px solid #303030;background:linear-gradient(145deg,#171717,#101010);transition:transform .25s,border-color .25s}.feature-card:hover,.faction-card:hover{transform:translateY(-4px);border-color:rgba(245,183,0,.55)}.feature-card small{display:block;color:#777;font-size:9px;font-weight:800;letter-spacing:.12em}.feature-card>b{display:block;margin:25px 0 16px;color:var(--gold);font-size:27px}.feature-card h3,.step-card h3{margin:0 0 10px;font:800 14px var(--heading)}.feature-card p,.step-card p{margin:0;color:#aaa;font-size:12px;line-height:1.85}.faction-intro{align-items:end}.faction-intro .copy{max-width:440px}.faction-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:40px}.faction-card{min-height:105px;display:grid;grid-template-columns:28px 1fr 20px;align-items:center;gap:14px;padding:19px 21px;border:1px solid #292929;background:#111;transition:transform .2s,border-color .2s}.faction-card small{align-self:start;padding-top:4px;color:var(--gold-dark);font-size:10px;font-weight:800}.faction-card h3{margin:0 0 7px;font:800 14px var(--heading)}.faction-card p{margin:0;color:#999;font-size:11px;line-height:1.65}.faction-card>b{color:#777}.faction-card:hover>b{color:var(--gold)}.steps-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:45px}.step-card{min-height:180px;padding:25px;border-top:1px solid var(--gold-dark);background:linear-gradient(#17140b,transparent)}.step-card>b{display:block;margin-bottom:27px;color:var(--gold);font:900 24px var(--heading)}.centered-actions{justify-content:center}.final-cta{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:30px;padding:75px clamp(24px,9vw,140px);background:linear-gradient(110deg,#1a1407,#0d0d0d 70%);border-block:1px solid rgba(245,183,0,.2)}.final-cta:after{content:"";position:absolute;right:8%;top:-150px;width:430px;aspect-ratio:1;border:1px solid rgba(245,183,0,.2);border-radius:50%;box-shadow:0 0 80px rgba(245,183,0,.05);pointer-events:none}.final-cta .section-heading{position:relative;z-index:1}.final-cta .section-heading>p:last-of-type{color:#aaa;font-size:13px}.cta-logo{position:relative;z-index:1;width:150px;max-width:22%;object-fit:contain;filter:drop-shadow(0 10px 30px rgba(245,183,0,.15))}.site-footer{padding:35px clamp(24px,5vw,80px) 0;background:#070707}.footer-main{display:grid;grid-template-columns:1fr 1fr 1.4fr;align-items:center;gap:25px;padding-bottom:28px}.footer-main>p{color:#888;font-size:11px;line-height:1.8}.footer-main nav{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:13px 18px;color:#aaa;font-size:10px}.footer-bottom{display:flex;justify-content:space-between;gap:15px;padding:18px 0;border-top:1px solid #252525;color:#777;font-size:9px}.footer-bottom a{font-weight:800;letter-spacing:.1em}.reveal{opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s ease}.reveal.is-visible{opacity:1;transform:none}
@media(max-width:1100px){.site-header{padding-inline:24px}.site-nav{gap:12px;font-size:10px}.nav-actions{gap:5px}.button-small{padding-inline:9px;font-size:8px}.hero-emblem{right:5%;width:25vw}.section{padding-inline:6vw}.feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:820px){.site-header{height:76px}.brand img{width:43px;height:43px}.menu-toggle{display:flex;width:43px;height:41px;flex-direction:column;justify-content:center;align-items:center;gap:5px;background:#111;border:1px solid #333;border-radius:3px}.menu-toggle i{width:19px;height:2px;background:#fff;transition:transform .2s,opacity .2s}.menu-toggle[aria-expanded=true] i:first-child{transform:translateY(7px) rotate(45deg)}.menu-toggle[aria-expanded=true] i:nth-child(2){opacity:0}.menu-toggle[aria-expanded=true] i:last-child{transform:translateY(-7px) rotate(-45deg)}.site-nav{display:none;position:absolute;top:75px;left:0;right:0;align-items:stretch;flex-direction:column;gap:0;padding:12px 22px 22px;background:rgba(8,8,8,.99);border-bottom:1px solid #292929}.site-nav.is-open{display:flex}.site-nav>a:not(.button){padding:15px 4px;border-bottom:1px solid #222;font-size:13px}.nav-actions{display:grid;grid-template-columns:1fr 1fr;margin-top:15px}.button-small{min-height:43px;font-size:9px}.hero{min-height:650px;padding:80px 26px 90px}.hero-emblem{right:5%;top:12%;transform:none;width:190px;opacity:.2}.hero h1{font-size:clamp(43px,8vw,70px)}.hero-footer{left:26px;right:26px}.section{padding:72px 26px}.split{grid-template-columns:1fr;gap:18px}.faction-intro .copy{max-width:650px}.final-cta{padding:65px 26px}.cta-logo{width:100px}.footer-main{grid-template-columns:1fr 1fr}.footer-main nav{grid-column:1/-1;justify-content:flex-start;border-top:1px solid #222;padding-top:20px}}
@media(max-width:560px){.hero{min-height:620px;padding:70px 22px 85px}.hero h1{font-size:clamp(38px,10.7vw,55px)}.hero-description{font-size:13px}.hero-actions:not(.centered-actions){display:grid;grid-template-columns:1fr}.hero-actions .button{width:100%}.hero-note{font-size:8px;letter-spacing:.1em}.hero-footer{left:22px;right:22px;font-size:8px;gap:9px}.hero-footer i{max-width:50px}.section{padding:60px 22px}.section-heading h2{font-size:clamp(30px,8.8vw,42px)}.centered{text-align:left}.centered .eyebrow{justify-content:flex-start}.feature-grid,.faction-grid,.steps-grid{grid-template-columns:1fr}.feature-card{min-height:180px}.feature-card>b{margin:18px 0 12px}.faction-card{padding:17px 14px;grid-template-columns:24px 1fr 18px}.centered-actions{display:grid}.centered-actions .button{width:100%}.final-cta{padding-block:55px}.cta-logo{display:none}.footer-main{grid-template-columns:1fr;gap:12px}.footer-main nav{grid-column:auto}.footer-bottom{flex-direction:column;gap:10px}.nav-actions{grid-template-columns:1fr}.button-small{font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}

/* CTA de dashboard: acento dorado/naranja con mejor jerarquía y proporciones. */
.nav-actions .button-gold,
.hero-actions .button-gold {
  color: #111;
  background: linear-gradient(115deg, #ffe38a 0%, #f5b700 52%, #ff8a00 100%);
  border: 1px solid rgba(255, 211, 74, .9);
  box-shadow: 0 8px 24px rgba(245, 183, 0, .14);
  font-weight: 800;
  letter-spacing: .035em;
}
.nav-actions .button-gold {
  min-height: 44px;
  padding-inline: 20px;
}
.hero-actions .button-gold {
  min-height: 52px;
  padding-inline: 25px;
}
.nav-actions .button-gold:hover,
.hero-actions .button-gold:hover {
  color: #080808;
  background: linear-gradient(115deg, #ffe9a5 0%, #ffc928 50%, #ff9b32 100%);
  border-color: #ffe9a5;
  box-shadow: 0 12px 30px rgba(245, 183, 0, .24);
  transform: translateY(-2px);
}
.nav-actions .button-gold:focus-visible,
.hero-actions .button-gold:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 4px;
}
@media (max-width: 560px) {
  .hero-actions:not(.centered-actions) .button-gold { min-height: 50px; }
  .nav-actions .button-gold { min-height: 46px; }
}
@media (prefers-reduced-motion: reduce) {
  .nav-actions .button-gold, .hero-actions .button-gold { transition: none; }
}


/* Nueva dirección visual de la landing: editorial, cálida y menos saturada. */
:root {
  --black: #0b0b0a;
  --panel: #151512;
  --gray: #201e19;
  --gold: #e7b84b;
  --orange: #d97736;
  --gold-dark: #9f792e;
  --white: #fff8e9;
  --muted: #b7b0a2;
  --line: #353027;
}
body.landing-body {
  background:
    radial-gradient(ellipse at 80% 0%, rgba(217,119,54,.055), transparent 36%),
    #0b0b0a;
  color: #f5f0e6;
}
.site-header {
  background: rgba(11,11,10,.94);
  border-bottom-color: #302a1d;
  box-shadow: 0 8px 28px rgba(0,0,0,.18);
}
.brand img { filter: drop-shadow(0 4px 12px rgba(231,184,75,.14)); }
.brand small { color: #e7b84b; }
.site-nav { color: #d1cabb; }
.site-nav>a:not(.button):hover, .site-footer a:hover { color: #f5d27c; }
.button { border-radius: 8px; min-height: 50px; transition: transform .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease; }
.button-gold {
  color: #17120a;
  background: linear-gradient(115deg, #f5d27c 0%, #e7b84b 56%, #d97736 100%);
  border-color: #edc566;
  box-shadow: 0 8px 24px rgba(231,184,75,.12);
}
.button-gold:hover {
  color: #100e09;
  background: linear-gradient(115deg, #ffe8a7, #f0c665 55%, #e58b4a);
  border-color: #ffe8a7;
  box-shadow: 0 12px 28px rgba(231,184,75,.2);
}
.button-dark {
  background: #171714;
  border-color: #494133;
  color: #f5f0e6;
}
.button-dark:hover { border-color: #e7b84b; color: #f5d27c; }
.hero {
  background:
    radial-gradient(ellipse at 84% 18%, rgba(217,119,54,.14), transparent 31%),
    radial-gradient(ellipse at 75% 0%, rgba(231,184,75,.11), transparent 38%),
    linear-gradient(115deg, #111110, #0b0b0a 58%, #1a1510);
}
.hero::after { border-color: rgba(231,184,75,.16); }
.hero h1 { letter-spacing: -.055em; }
.hero h1 em, .section-heading h2 em, .final-cta h2 em { color: #e7b84b; }
.eyebrow { color: #e7b84b; }
.hero-description, .section-heading p, .split p, .step-card p, .feature-card p { color: #b7b0a2; }
.feature-card, .faction-card, .step-card {
  background: linear-gradient(145deg, #171714, #111110);
  border-color: #363025;
  border-radius: 13px;
}
.feature-card:hover, .faction-card:hover, .step-card:hover {
  border-color: rgba(231,184,75,.52);
  background: linear-gradient(145deg, #201d16, #121210);
}
.feature-card>b, .step-card>b, .section-index { color: #e7b84b; }
.faction-card .faction-number { color: #d97736; }
.final-cta {
  background:
    radial-gradient(ellipse at 10% 90%, rgba(217,119,54,.12), transparent 36%),
    linear-gradient(115deg, #151512, #0b0b0a);
  border-top: 1px solid #393020;
  border-bottom: 1px solid #393020;
}
.site-footer { background: #090909; }
.footer-bottom { border-top-color: #302a1d; color: #a69e90; }
.menu-toggle { border-color: #494133; color: #f5d27c; }
@media (max-width: 760px) {
  .site-nav { background: rgba(11,11,10,.99); border-bottom-color: #353027; }
  .site-nav>a:not(.button) { border-bottom-color: #29251d; }
}
@media (prefers-reduced-motion: reduce) {
  .button, .feature-card, .faction-card, .step-card { transition: none; }
}


/* Cartagena Roleplay — landing palette aligned with dashboard and login. */
:root {
  --black: #0b0d10;
  --panel: #15191f;
  --gray: #20242b;
  --gold: #e9b04b;
  --orange: #dc8544;
  --gold-dark: #b9852e;
  --white: #f4f1e9;
  --muted: #aeb3bc;
  --line: #303640;
  --font: 'Inter', sans-serif;
  --heading: 'Montserrat', 'Inter', sans-serif;
}
body.landing-body {
  background: radial-gradient(ellipse at 78% 0%, rgba(237,135,56,.055), transparent 35%), #0b0d10;
  color: #f4f1e9;
}
.site-header {
  background: rgba(11,13,16,.95);
  border-bottom-color: #303640;
  box-shadow: 0 8px 28px rgba(0,0,0,.18);
}
.brand small, .eyebrow, .section-index { color: #e9b04b; }
.site-nav { color: #c4c6ca; }
.site-nav>a:not(.button):hover, .site-footer a:hover { color: #ffe0a0; }
.button { border-radius: 8px; }
.button-gold {
  color: #17140c;
  background: linear-gradient(115deg, #f5d58e, #e9b04b 60%, #dc8544);
  border-color: #e9bc61;
  box-shadow: 0 8px 24px rgba(233,176,75,.12);
}
.button-gold:hover {
  color: #14110b;
  background: linear-gradient(115deg, #ffe7b0, #f2c46b 60%, #e99a59);
  border-color: #ffe7b0;
  box-shadow: 0 12px 28px rgba(233,176,75,.19);
}
.button-dark {
  background: #191d23;
  border-color: #3b424c;
  color: #f4f1e9;
}
.button-dark:hover { border-color: #e9b04b; color: #ffe0a0; }
.hero {
  background:
    radial-gradient(ellipse at 84% 18%, rgba(220,133,68,.14), transparent 31%),
    radial-gradient(ellipse at 75% 0%, rgba(233,176,75,.10), transparent 38%),
    linear-gradient(115deg, #171b21, #0b0d10 58%, #201912);
}
.hero::after { border-color: rgba(233,176,75,.16); }
.hero h1 { letter-spacing: -.055em; }
.hero h1 em, .section-heading h2 em, .final-cta h2 em { color: #e9b04b; }
.hero-description, .section-heading p, .split p, .step-card p, .feature-card p { color: #aeb3bc; }
.feature-card, .faction-card, .step-card {
  background: linear-gradient(145deg, #1a1e24, #12161b);
  border-color: #303640;
  border-radius: 13px;
}
.feature-card:hover, .faction-card:hover, .step-card:hover {
  border-color: rgba(233,176,75,.48);
  background: linear-gradient(145deg, #222831, #15191f);
}
.feature-card>b, .step-card>b { color: #e9b04b; }
.faction-card .faction-number { color: #dc8544; }
.final-cta {
  background: radial-gradient(ellipse at 10% 90%, rgba(220,133,68,.12), transparent 36%), linear-gradient(115deg, #171b21, #0b0d10);
  border-color: #303640;
}
.site-footer { background: #090b0e; }
.footer-bottom { border-top-color: #303640; color: #aeb3bc; }
.menu-toggle { border-color: #3b424c; color: #f5d58e; }
@media (max-width: 760px) {
  .site-nav { background: rgba(11,13,16,.99); border-bottom-color: #303640; }
  .site-nav>a:not(.button) { border-bottom-color: #292f38; }
}


/* ==========================================================
   CARTAGENA ROLEPLAY — LANDING PAGE LAYOUT V2
   Nueva composición editorial; solo afecta a la página pública.
   ========================================================== */
:root {
  --black: #0b0d10;
  --panel: #151a20;
  --gray: #20262e;
  --gold: #e9b653;
  --orange: #d98448;
  --gold-dark: #a67d35;
  --white: #f5f1e8;
  --muted: #aab0ba;
  --line: #303640;
}
html { scroll-padding-top: 82px; }
body.landing-body {
  background: #0b0d10;
  color: var(--white);
}
.site-header {
  height: 78px;
  padding-inline: clamp(22px, 6vw, 96px);
  background: rgba(11,13,16,.94);
  border-bottom: 1px solid #2c323b;
}
.brand { gap: 12px; }
.brand img {
  width: 45px;
  height: 45px;
  filter: drop-shadow(0 4px 12px rgba(233,182,83,.12));
}
.brand strong { font-size: 12px; letter-spacing: .16em; }
.brand small { color: var(--gold); }
.site-nav { gap: clamp(12px, 1.8vw, 25px); color: #c1c5cb; }
.site-nav > a:not(.button) { transition: color .18s ease; }
.nav-actions { gap: 9px; }
.button {
  min-height: 48px;
  padding-inline: 21px;
  border-radius: 8px;
  letter-spacing: .035em;
}
.button-small { min-height: 40px; padding-inline: 13px; font-size: 9px; }
.button-gold {
  color: #1a160e;
  background: linear-gradient(115deg, #f4d995 0%, #e9b653 56%, #d98448 100%);
  border-color: #e9b653;
  box-shadow: 0 7px 22px rgba(233,182,83,.12);
}
.button-gold:hover {
  color: #17130c;
  background: linear-gradient(115deg, #ffe8b0, #f1c873 56%, #e99a5d);
  border-color: #ffe8b0;
  box-shadow: 0 11px 28px rgba(233,182,83,.2);
}
.button-dark {
  background: #171c22;
  border-color: #3b424c;
  color: #f5f1e8;
}
.button-dark:hover { border-color: #d7a84f; color: #ffe3a5; }

/* Hero: split layout, stronger title, emblem stays in the flow. */
.hero {
  min-height: 650px;
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(280px, .88fr);
  align-items: center;
  column-gap: clamp(24px, 5vw, 80px);
  padding: 78px clamp(28px, 8vw, 126px) 92px;
  background: #0d1014;
  border-bottom: 1px solid #303640;
}
.hero-backdrop {
  background:
    radial-gradient(ellipse at 82% 40%, rgba(217,132,72,.14), transparent 30%),
    radial-gradient(ellipse at 72% 12%, rgba(233,182,83,.12), transparent 37%),
    linear-gradient(125deg, #171b21 0%, #0d1014 58%, #17130f 100%);
}
.hero-backdrop:after {
  opacity: .12;
  background: linear-gradient(90deg, transparent 49.8%, rgba(233,182,83,.12) 50%, transparent 50.2%),
              linear-gradient(0deg, transparent 49.8%, rgba(233,182,83,.09) 50%, transparent 50.2%);
  background-size: 72px 72px;
}
.hero-ring { display: none; }
.hero-content {
  width: 100%;
  max-width: 680px;
  grid-column: 1;
  grid-row: 1;
}
.eyebrow {
  color: #e9b653;
  font-size: 10px;
  letter-spacing: .17em;
}
.hero h1 {
  margin: 24px 0 20px;
  font-size: clamp(46px, 5.5vw, 78px);
  line-height: .99;
  letter-spacing: -.065em;
}
.hero h1 em { color: #e9b653; }
.hero-description {
  max-width: 500px;
  color: #b8bec7;
  font-size: 14px;
  line-height: 1.9;
}
.hero-actions { gap: 11px; margin-top: 27px; }
.hero-note { margin-top: 34px; color: #8e949e; }
.hero-emblem {
  position: relative;
  top: auto;
  right: auto;
  transform: none;
  grid-column: 2;
  grid-row: 1;
  justify-self: center;
  width: min(100%, 340px);
  aspect-ratio: 1;
  opacity: 1;
  border: 1px solid rgba(233,182,83,.38);
  background: radial-gradient(circle, rgba(233,182,83,.075), rgba(11,13,16,.04) 65%);
  box-shadow: 0 0 80px rgba(233,182,83,.055), inset 0 0 45px rgba(233,182,83,.035);
}
.hero-emblem:before { inset: 7%; border-color: rgba(233,182,83,.22); }
.hero-emblem:after { inset: 15%; border-color: rgba(217,132,72,.26); }
.hero-emblem img {
  width: 57%;
  height: 57%;
  filter: drop-shadow(0 8px 24px rgba(233,182,83,.18));
}
.hero-emblem span {
  bottom: 12%;
  color: #e9c77f;
  font-size: 8px;
  letter-spacing: .22em;
}
.hero-footer {
  left: clamp(28px, 8vw, 126px);
  right: clamp(28px, 8vw, 126px);
  height: 48px;
  color: #858b95;
  border-top: 1px solid rgba(255,255,255,.055);
}
.hero-footer i { max-width: 180px; background: linear-gradient(90deg, #a67d35, transparent); }

/* Sections share a consistent content width and clearer vertical rhythm. */
.section {
  padding: clamp(64px, 7.5vw, 108px) clamp(28px, 8vw, 126px);
}
.section-index { color: #969ca6; letter-spacing: .15em; }
.section-index i { background: #a67d35; }
.split {
  grid-template-columns: minmax(0, 1fr) minmax(280px, .78fr);
  gap: clamp(35px, 7vw, 100px);
  margin-top: 34px;
}
.section-heading h2 {
  font-size: clamp(34px, 4.1vw, 58px);
  line-height: 1.08;
}
.section-heading h2 em, .final-cta h2 em { color: #e9b653; }
.copy { color: #aab0ba; font-size: 13px; line-height: 1.9; }
.copy p:first-child { color: #e1e3e6; font-size: 15px; }
.text-link { color: #e9b653; }
.features {
  background: linear-gradient(180deg, #12161b 0%, #0e1115 100%);
  border-block-color: #2d333d;
}
.centered { max-width: 720px; margin-top: 32px; }
.centered > p:last-child { color: #aab0ba; }
.feature-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-top: 38px;
}
.feature-card {
  min-height: 225px;
  padding: 23px;
  border: 1px solid #303640;
  border-radius: 13px;
  background: linear-gradient(145deg, #1a1f26, #12161b);
}
.feature-card small { color: #9da3ad; }
.feature-card > b { color: #e9b653; }
.feature-card h3, .step-card h3 { color: #f5f1e8; }
.feature-card p, .step-card p { color: #aab0ba; }
.feature-card:hover, .faction-card:hover {
  border-color: rgba(233,182,83,.48);
  box-shadow: 0 12px 30px rgba(0,0,0,.18);
}
.faction-intro { align-items: end; }
.faction-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 35px;
}
.faction-card {
  min-height: 100px;
  grid-template-columns: 34px minmax(0,1fr) 22px;
  gap: 15px;
  padding: 19px 22px;
  border-color: #303640;
  border-radius: 11px;
  background: linear-gradient(110deg, #191e24, #12161b);
}
.faction-card small { color: #d7a84f; }
.faction-card h3 { color: #f5f1e8; font-size: 13px; }
.faction-card p { color: #aab0ba; }
.faction-card > b { color: #aab0ba; }
.steps-grid {
  gap: 14px;
  margin-top: 38px;
}
.step-card {
  min-height: 190px;
  padding: 24px;
  border: 1px solid #303640;
  border-top: 2px solid #a67d35;
  border-radius: 12px;
  background: linear-gradient(145deg, #1a1f26, #12161b);
}
.step-card > b { color: #e9b653; }
.final-cta {
  padding: clamp(55px, 7vw, 88px) clamp(28px, 8vw, 126px);
  background:
    radial-gradient(ellipse at 85% 30%, rgba(217,132,72,.13), transparent 32%),
    linear-gradient(115deg, #1a1e24, #101317 70%, #1c1712);
  border-block-color: #303640;
}
.final-cta:after { border-color: rgba(233,182,83,.16); }
.final-cta .section-heading > p:last-of-type { color: #aab0ba; }
.cta-logo { filter: drop-shadow(0 10px 30px rgba(233,182,83,.12)); }
.site-footer { padding: 34px clamp(22px, 6vw, 96px) 0; background: #090b0e; }
.footer-main { grid-template-columns: 1fr 1fr 1.25fr; gap: 28px; }
.footer-main > p, .footer-bottom { color: #969ca6; }
.footer-main nav { color: #b5bac2; }
.footer-bottom { border-top-color: #2b3038; }
.reveal { transition: opacity .55s ease, transform .55s ease; }

@media (max-width: 1100px) {
  .site-header { padding-inline: 24px; }
  .site-nav { gap: 12px; }
  .hero { padding-inline: 6vw; column-gap: 24px; }
  .hero-emblem { width: min(100%, 290px); }
  .section { padding-inline: 6vw; }
  .feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
  .site-header { height: 76px; }
  .site-nav {
    top: 75px;
    background: rgba(11,13,16,.99);
    border-bottom-color: #303640;
  }
  .site-nav > a:not(.button) { border-bottom-color: #292f38; }
  .hero {
    min-height: auto;
    grid-template-columns: minmax(0,1fr);
    gap: 28px;
    padding: 65px 26px 78px;
  }
  .hero-content { grid-column: 1; grid-row: 1; }
  .hero-emblem {
    grid-column: 1;
    grid-row: 2;
    justify-self: start;
    width: 170px;
    margin-left: 4px;
  }
  .hero-footer { left: 26px; right: 26px; }
  .section { padding: 70px 26px; }
  .split { grid-template-columns: minmax(0,1fr); gap: 20px; }
  .final-cta { padding: 64px 26px; }
  .footer-main { grid-template-columns: 1fr 1fr; }
  .footer-main nav { grid-column: 1 / -1; justify-content: flex-start; border-top: 1px solid #292f38; padding-top: 20px; }
}
@media (max-width: 560px) {
  .site-header { padding-inline: 18px; }
  .brand img { width: 40px; height: 40px; }
  .brand strong { font-size: 11px; }
  .hero { padding: 56px 21px 76px; }
  .hero h1 { font-size: clamp(39px, 11vw, 55px); }
  .hero-description { font-size: 13px; line-height: 1.8; }
  .hero-actions:not(.centered-actions) { display: grid; grid-template-columns: 1fr; }
  .hero-actions .button { width: 100%; }
  .hero-emblem { width: 142px; }
  .hero-footer { left: 21px; right: 21px; font-size: 8px; gap: 9px; }
  .hero-footer i { max-width: 48px; }
  .section { padding: 57px 21px; }
  .section-heading h2 { font-size: clamp(30px, 8.8vw, 42px); }
  .centered { text-align: left; }
  .centered .eyebrow { justify-content: flex-start; }
  .feature-grid, .faction-grid, .steps-grid { grid-template-columns: minmax(0,1fr); }
  .feature-card { min-height: 170px; }
  .feature-card > b { margin: 17px 0 12px; }
  .faction-card { padding: 17px 15px; }
  .centered-actions { display: grid; }
  .centered-actions .button { width: 100%; }
  .final-cta { padding: 54px 21px; }
  .cta-logo { display: none; }
  .footer-main { grid-template-columns: minmax(0,1fr); gap: 13px; }
  .footer-main nav { grid-column: auto; }
  .footer-bottom { flex-direction: column; gap: 10px; }
  .nav-actions { grid-template-columns: 1fr; }
  .button-small { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; transition: none; }
  .button, .feature-card, .faction-card { transition: none; }
}