:root {
    --bg: #05080d;
    --bg-deep: #020408;
    --surface: #0c1119;
    --surface-2: #111722;
    --border: #303744;
    --border-soft: #202733;
    --text: #f7f8fa;
    --muted: #a8afbb;
    --orange: #ff5a0a;
    --orange-light: #ff7a2f;
    --violet: #9857ff;
    --container: 1480px;
    --radius: 16px;
    --shadow: 0 28px 80px rgba(0, 0, 0, .42);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    color: var(--text);
    background: radial-gradient(circle at 52% 23%, #101622 0, var(--bg) 35%, var(--bg-deep) 78%);
    font: 16px/1.6 Roboto, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    min-height: 100vh;
    overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
img, svg { display: block; max-width: 100%; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { line-height: 1.12; letter-spacing: -.025em; }
p { color: var(--muted); }
.container { width: min(calc(100% - 48px), var(--container)); margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: 12px; left: 12px; z-index: 999; padding: 10px 14px; background: #fff; color: #000; transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }
.site-glow { position: fixed; z-index: -1; width: 380px; height: 380px; border-radius: 50%; background: rgba(255, 77, 0, .13); filter: blur(100px); pointer-events: none; }
.site-glow--left { left: -260px; top: 330px; }
.site-glow--right { right: -260px; top: 250px; }

.site-header { position: fixed; top: 0; left: 0; right: 0; z-index: 20; height: 104px; background: rgba(5, 8, 13, .97); border-bottom: 1px solid var(--border-soft); }
html { scroll-padding-top: 120px; }
.header-inner { height: 100%; display: flex; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; align-items: center; gap: 15px; font-size: clamp(1.55rem, 2vw, 2.25rem); font-weight: 900; letter-spacing: -.045em; }
.brand-mark { width: 43px; color: #fff; filter: drop-shadow(0 0 13px rgba(255, 91, 10, .78)); }
.primary-nav { display: flex; align-items: center; gap: clamp(24px, 2.7vw, 48px); }
.primary-nav > a:not(.button) { color: #eceef2; font-weight: 600; position: relative; }
.primary-nav > a:not(.button)::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -9px; height: 2px; background: var(--orange); transition: right .2s ease; }
.primary-nav > a:hover::after, .primary-nav > a[aria-current="page"]::after { right: 0; }
.menu-toggle { display: none; padding: 8px; border: 0; background: transparent; color: white; }
.menu-toggle span:not(.sr-only) { display: block; width: 26px; height: 2px; margin: 5px; background: currentColor; }

.button { display: inline-flex; min-height: 58px; padding: 0 34px; align-items: center; justify-content: center; border: 1px solid var(--orange); border-radius: 9px; background: linear-gradient(135deg, var(--orange-light), var(--orange)); color: #fff; font-weight: 800; box-shadow: 0 12px 30px rgba(255, 74, 0, .2); transition: transform .2s ease, box-shadow .2s ease; cursor: pointer; }
.button:hover { transform: translateY(-2px); box-shadow: 0 16px 34px rgba(255, 74, 0, .3); }
.button:disabled { color: #8d939c; background: #151a22; border-color: #343a44; box-shadow: none; cursor: not-allowed; }
.button--small { min-height: 46px; padding-inline: 28px; }
.button--outline { background: transparent; color: var(--orange-light); box-shadow: none; }
.text-link { display: inline-flex; align-items: center; gap: 12px; color: var(--orange-light); font-weight: 800; }
.text-link span { font-size: 2rem; line-height: 1; }
.eyebrow { margin-bottom: 15px; color: var(--orange-light); font-size: .9rem; font-weight: 900; letter-spacing: .19em; text-transform: uppercase; }

.hero { display: grid; grid-template-columns: .79fr 1.38fr; align-items: center; min-height: 505px; padding-top: 22px; }
.hero-copy { position: relative; z-index: 3; padding-left: 2px; }
.hero h1 { margin-bottom: 20px; max-width: 640px; font-size: clamp(3.4rem, 4.7vw, 5.15rem); }
.hero-lead { max-width: 580px; margin-bottom: 26px; font-size: clamp(1.08rem, 1.5vw, 1.35rem); line-height: 1.42; }
.hero-actions { display: flex; align-items: center; gap: 38px; }
.hero-visual { position: relative; min-width: 0; padding: 0 0 75px 42px; }

.process-strip { position: relative; z-index: 4; display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: center; gap: 22px; min-height: 122px; padding: 22px 42px; border: 1px solid var(--border); border-radius: var(--radius); background: linear-gradient(135deg, rgba(14, 19, 27, .96), rgba(7, 11, 17, .96)); box-shadow: var(--shadow); }
.process-strip article { display: grid; grid-template-columns: 58px 48px 1fr; align-items: center; gap: 18px; }
.process-strip h2 { margin: 0 0 2px; font-size: 1.08rem; }
.process-strip p { margin: 0; font-size: .94rem; line-height: 1.35; }
.step-number { display: grid; width: 58px; height: 58px; place-items: center; border: 1px solid var(--orange); border-radius: 50%; color: var(--orange-light); font-size: 1.55rem; font-weight: 800; }
.step-icon { color: var(--orange-light); font-size: 2.2rem; text-align: center; }
.step-arrow { color: #818894; font-size: 2rem; }

.section-block { padding-block: 62px 96px; }
.section-heading { text-align: center; }
.section-heading h2 { margin-bottom: 30px; font-size: clamp(2rem, 3vw, 3rem); }
.feature-grid, .guide-grid, .requirement-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.feature-card { min-height: 178px; padding: 30px 30px 26px 108px; border: 1px solid var(--border); border-radius: var(--radius); background: linear-gradient(150deg, rgba(18, 23, 32, .96), rgba(8, 12, 18, .92)); position: relative; }
.feature-card h3 { margin-bottom: 6px; font-size: 1.2rem; }
.feature-card p { margin-bottom: 0; }
.feature-icon { position: absolute; left: 35px; top: 38px; display: grid; width: 48px; height: 48px; place-items: center; color: #ad66ff; border: 2px solid #8f4ae8; border-radius: 14px; font-size: 1.7rem; box-shadow: 0 0 24px rgba(150, 77, 255, .2); }

.page-hero { max-width: 1000px; margin-left: max(24px, calc((100vw - var(--container)) / 2)); padding: 100px 0 70px; }
.page-hero h1 { margin-bottom: 24px; font-size: clamp(3rem, 6vw, 6rem); }
.page-hero h1 span { color: var(--orange-light); }
.page-hero > p:last-child { max-width: 750px; font-size: 1.22rem; }
.panel { border: 1px solid var(--border); border-radius: var(--radius); background: linear-gradient(145deg, rgba(17, 23, 33, .96), rgba(7, 11, 17, .96)); box-shadow: var(--shadow); }

.site-footer { margin-top: 90px; padding: 60px 0 24px; border-top: 1px solid var(--border-soft); background: #03060a; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 60px; }
.brand--footer { margin-bottom: 12px; font-size: 1.6rem; }
.footer-links { display: grid; align-content: start; gap: 10px; color: var(--muted); }
.footer-links a:hover { color: var(--orange-light); }
.footer-bottom { display: flex; justify-content: space-between; margin-top: 45px; padding-top: 22px; border-top: 1px solid var(--border-soft); color: #737b88; font-size: .86rem; }

/* Keep the fixed navigation outside the page flow. */
body { padding-top: 104px; }