/* =========================
   Brand Tokens & Resets
========================== */
@font-face {
    font-family: "Bungee";
    src: url("../assets/fonts/Bungee-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

:root {
    /* Brand */
    /* Brand - Updated to match In-Game Screenshot */
    --brand-red: #A93838;
    /* Muted Red from icons */
    --brand-green: #5E8F73;
    /* Muted Green from Play button */
    --brand-dark: #1A222E;
    /* Dark Navy from Planet */
    --brand-light: #5F7A6A;
    /* Foggy green background tone */
    --brand-mid: #4a6358;
    --brand-blue: #48759C;
    /* UI */
    --bg: #1c2630;
    /* News Page Dark Blue */
    --bg-dark: #0f1820;
    --bg-2: #22303b;
    --ink: #ffffff;
    /* White text for dark background */
    /* White text for dark background */
    /* White text for dark background */
    --muted: rgba(255, 255, 255, 0.7);
    --accent: var(--brand-green);
    --accent-2: #ebd263;
    /* Sun/Coin Yellow */
    --accent-3: var(--brand-red);
    --accent-4: #f59e0b;
    --card: #eef3f6;
    --shadow: 0 10px 30px rgba(0, 0, 0, .15), 0 2px 8px rgba(0, 0, 0, .08);
    --radius: 18px;
    /* spacing */
    --gutter: clamp(36px, 7vw, 96px);
    --gap: clamp(12px, 3vw, 32px);
    /* fx */
    --blur-max: 16px;
    --jump-height: -80px;
    --jump-duration: 1s;
    color-scheme: light dark;
}

* {
    box-sizing: border-box;
}

html,
body {
    height: 100%;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font: clamp(15px, 1.6vw, 16.5px)/1.6 system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Arial;
    background: radial-gradient(1200px 700px at 50% -120px, rgba(72, 117, 156, .22), rgba(0, 0, 0, 0) 62%), radial-gradient(900px 500px at 15% 10%, rgba(32, 138, 116, .16), rgba(0, 0, 0, 0) 60%), linear-gradient(var(--bg), var(--bg-2));
    color: var(--ink);
    -webkit-text-size-adjust: 100%;
    text-rendering: optimizeLegibility;
}

img {
    max-width: 100%;
    display: block;
}

a {
    color: inherit;
    text-decoration: none;
}

.container {
    width: min(1120px, 100% - 2rem);
    margin-inline: auto;
    padding-inline: 1rem;
}

:focus-visible {
    outline: 3px solid var(--accent-2);
    outline-offset: 2px;
}

/* Screenreader-only */
.sr-only {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

h1,
h2,
h3 {
    font-family: 'Bungee', system-ui;
    font-weight: 400;
    color: #161D28;
    margin: 10px 0 .35em;
    line-height: 1.15;
}

p {
    margin: 0 0 1em;
}

.lead {
    font-size: clamp(1rem, 2.2vw, 1.15rem);
    max-width: 60ch;
    margin-inline: auto;
    opacity: .92;
}

.h1 {
    font-size: clamp(2.2rem, 6vw, 5.7rem);
    line-height: 1;
    letter-spacing: .0em;
    text-transform: uppercase;
}

.h1 small {
    display: block;
    font-size: .33em;
    letter-spacing: 0;
    opacity: .95;
}

.h2 {
    font-size: clamp(1.5rem, 3.2vw, 2.35rem);
    line-height: 1.15;
    color: #ffffff;
}

/* Sections */
main {
    display: block;
}

.section {
    position: relative;
    padding: clamp(3.5rem, 7vw, 5rem) 0;
    border-bottom: 48px solid #16222E;
}

.section.is-light {
    background: transparent;
}

.section .center {
    max-width: 1120px;
    margin-inline: auto;
    text-align: center;
}