:root {
    color-scheme: dark;
    --navy: #233547;
    --navy-deep: #182736;
    --ink: #ffffff;
    --muted: #c7d4df;
    --line: rgba(255, 255, 255, .12);
    --orange: #ff641a;
    --orange-light: #ffad7f;
}

* { box-sizing: border-box; }

html { min-width: 320px; background: var(--navy); }

body {
    margin: 0;
    color: var(--ink);
    background:
        radial-gradient(circle at 48% -20%, rgba(255, 100, 26, .16), transparent 43%),
        linear-gradient(145deg, var(--navy) 0%, var(--navy-deep) 55%, #1e3041 100%);
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    -webkit-font-smoothing: antialiased;
}

.launch-shell {
    position: relative;
    display: grid;
    min-height: 100svh;
    place-items: center;
    overflow: hidden;
    padding: clamp(34px, 6vw, 76px) 22px;
}

.launch-shell::before {
    position: absolute;
    inset: 0;
    background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
    background-size: 64px 64px;
    content: "";
    mask-image: linear-gradient(to bottom, black, transparent 85%);
}

.ambient { position: absolute; border-radius: 999px; filter: blur(2px); pointer-events: none; }
.ambient-one { width: 420px; height: 420px; top: -210px; right: -90px; border: 1px solid rgba(255, 100, 26, .18); box-shadow: 0 0 100px rgba(255, 100, 26, .05) inset; }
.ambient-two { width: 280px; height: 280px; bottom: -160px; left: -40px; border: 1px solid rgba(255, 173, 127, .13); }

.launch-card { position: relative; z-index: 1; width: min(100%, 950px); text-align: center; }

.launch-kicker {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 26px;
    color: #bfcaD8;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .17em;
    text-transform: uppercase;
}

.launch-kicker span { width: 28px; height: 1px; background: var(--orange); }

h1 { margin: 0; font-size: clamp(3.15rem, 8.8vw, 7.4rem); font-weight: 700; letter-spacing: -.065em; line-height: .91; }
h1 em { color: var(--orange); font-style: normal; font-weight: 500; }

.launch-intro { max-width: 620px; margin: 28px auto 0; color: var(--muted); font-size: clamp(1rem, 2vw, 1.14rem); line-height: 1.7; }

.countdown { display: flex; align-items: flex-start; justify-content: center; gap: clamp(10px, 3vw, 30px); margin: clamp(36px, 6vw, 58px) 0; }
.countdown div { min-width: clamp(56px, 9vw, 92px); }
.countdown strong { display: block; color: #fff; font-size: clamp(2rem, 5.4vw, 4rem); font-variant-numeric: tabular-nums; font-weight: 600; letter-spacing: -.055em; line-height: 1; }
.countdown span { display: block; margin-top: 10px; color: #7f8fa4; font-size: .64rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.countdown i { margin-top: -.08em; color: rgba(255,255,255,.22); font-size: clamp(1.8rem, 4.8vw, 3.6rem); font-style: normal; font-weight: 300; line-height: 1; }

.support-access {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    max-width: 850px;
    margin: 0 auto;
    padding: 22px 24px;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: rgba(255, 255, 255, .045);
    box-shadow: 0 20px 70px rgba(0, 0, 0, .18);
    text-align: left;
    backdrop-filter: blur(14px);
}

.support-copy { display: flex; align-items: center; gap: 15px; }
.support-icon { display: grid; flex: 0 0 44px; width: 44px; height: 44px; border: 1px solid rgba(255, 100, 26, .32); border-radius: 13px; color: var(--orange-light); background: rgba(255, 100, 26, .11); place-items: center; }
.support-icon svg { width: 23px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.6; }
.support-copy p { margin: 0 0 3px; color: var(--orange-light); font-size: .66rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.support-copy h2 { margin: 0; font-size: clamp(.94rem, 2vw, 1.08rem); font-weight: 600; letter-spacing: -.02em; }

.support-actions { display: flex; flex: 0 0 auto; gap: 10px; }
.support-actions a { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 44px; padding: 0 17px; border: 1px solid rgba(255,255,255,.15); border-radius: 9px; color: #edf3f8; font-size: .78rem; font-weight: 700; text-decoration: none; transition: border-color .2s, background .2s, transform .2s; }
.support-actions a:hover, .support-actions a:focus-visible { border-color: rgba(255,100,26,.72); background: rgba(255,255,255,.06); transform: translateY(-1px); }
.support-actions a.primary { border-color: var(--orange); color: #fff; background: linear-gradient(135deg, #ff762f, #ff5410); box-shadow: 0 10px 24px rgba(255, 100, 26, .2); }
.support-actions a.primary:hover, .support-actions a.primary:focus-visible { background: linear-gradient(135deg, #ff853f, #ff641a); }
.support-actions a:focus-visible { outline: 3px solid rgba(255,100,26,.3); outline-offset: 3px; }

@media (max-width: 720px) {
    .support-access { align-items: stretch; flex-direction: column; padding: 20px; }
    .support-actions { width: 100%; }
    .support-actions a { flex: 1 1 50%; }
}

@media (max-width: 460px) {
    .launch-shell { padding-inline: 16px; }
    .countdown { gap: 7px; }
    .countdown div { min-width: 50px; }
    .countdown span { font-size: .54rem; letter-spacing: .08em; }
    .support-actions { flex-direction: column; }
    .support-actions a { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}