/*
 * Godz Casino - design system
 * Dark Norse "casino of the gods": walnut wood, teal stone, burnished gold, icy-cyan rune light.
 */

:root {
    --c-ink: #070d10;
    --c-navy: #0b1620;
    --c-slate-900: #141f24;
    --c-slate-800: #1c2a30;
    --c-slate-700: #2a3b42;
    --c-slate-500: #5b7178;
    --c-teal-950: #06191b;
    --c-teal-900: #0c2628;
    --c-teal-800: #12363a;
    --c-teal-700: #1a4a4d;
    --c-gold-100: #fff0bd;
    --c-gold-300: #f3d27a;
    --c-gold-500: #e2b65a;
    --c-gold-700: #a8792c;
    --c-gold-900: #4e320c;
    --c-bronze: #9a6a35;
    --c-ice-200: #c9f5ff;
    --c-ice-400: #7fe3ff;
    --c-ice-600: #2fb3dc;
    --c-ember: #e8823a;
    --c-amber: #f0a73a;
    --c-crimson-700: #6e1218;
    --c-crimson-900: #33070c;
    --c-wood: #24150c;
    --c-wood-dark: #160d07;
    --c-outline: #1b1006;
    --c-text: #eef3f2;
    --c-text-soft: #c3d1d0;
    --c-danger: #d33b3b;

    --f-brand: "Cinzel", Georgia, "Times New Roman", serif;
    --f-display: "Fira Sans Condensed", "Arial Narrow", Arial, sans-serif;
    --f-body: "Fira Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

    --radius-s: 6px;
    --radius-m: 12px;
    --container: 1180px;
    --gutter: clamp(1rem, 4vw, 2rem);
    --section-y: clamp(3rem, 7vw, 5.5rem);

    --shadow-panel: 0 18px 40px rgba(0, 0, 0, .45), inset 0 0 0 1px rgba(255, 240, 189, .08), inset 0 0 28px rgba(0, 0, 0, .45);
    --glow-ice: 0 0 14px rgba(127, 227, 255, .55);
    --hex: polygon(16px 0, calc(100% - 16px) 0, 100% 50%, calc(100% - 16px) 100%, 16px 100%, 0 50%);
    --header-bottom: 64px;

    --band-ice: url("data:image/svg+xml,%3Csvg%20xmlns=%27http%3A//www.w3.org/2000/svg%27%20width=%2756%27%20height=%2718%27%20viewBox=%270%200%2056%2018%27%3E%3Cg%20fill=%27none%27%20stroke=%27%237fe3ff%27%20stroke-width=%271.5%27%3E%3Cpath%20d=%27M0%205c7%200%207%208%2014%208s7-8%2014-8%207%208%2014%208%207-8%2014-8%27/%3E%3Cpath%20d=%27M0%2013c7%200%207-8%2014-8s7%208%2014%208%207-8%2014-8%207%208%2014%208%27/%3E%3Cpath%20d=%27M0%201.5h56M0%2016.5h56%27%20stroke-width=%27.9%27%20stroke=%27%2343c6ea%27/%3E%3C/g%3E%3Cpath%20d=%27M13%207v4l2-2M41%207l1.5%202%201.5-2%27%20fill=%27none%27%20stroke=%27%23d8f8ff%27%20stroke-width=%271.1%27/%3E%3C/svg%3E");
    --band-gold: url("data:image/svg+xml,%3Csvg%20xmlns=%27http%3A//www.w3.org/2000/svg%27%20width=%2756%27%20height=%2718%27%20viewBox=%270%200%2056%2018%27%3E%3Cg%20fill=%27none%27%20stroke=%27%23e2b65a%27%20stroke-width=%271.5%27%3E%3Cpath%20d=%27M0%205c7%200%207%208%2014%208s7-8%2014-8%207%208%2014%208%207-8%2014-8%27/%3E%3Cpath%20d=%27M0%2013c7%200%207-8%2014-8s7%208%2014%208%207-8%2014-8%207%208%2014%208%27/%3E%3Cpath%20d=%27M0%201.5h56M0%2016.5h56%27%20stroke-width=%27.9%27%20stroke=%27%23a8792c%27/%3E%3C/g%3E%3Cpath%20d=%27M13%207v4l2-2M41%207l1.5%202%201.5-2%27%20fill=%27none%27%20stroke=%27%23fff0bd%27%20stroke-width=%271.1%27/%3E%3C/svg%3E");
    --chev-gold: url("data:image/svg+xml,%3Csvg%20xmlns=%27http%3A//www.w3.org/2000/svg%27%20viewBox=%270%200%2016%2016%27%3E%3Cpath%20d=%27M5%202l6%206-6%206%27%20fill=%27none%27%20stroke=%27%23f3d27a%27%20stroke-width=%272.4%27%20stroke-linecap=%27round%27%20stroke-linejoin=%27round%27/%3E%3C/svg%3E");
    --rune-bullet: url("data:image/svg+xml,%3Csvg%20xmlns=%27http%3A//www.w3.org/2000/svg%27%20viewBox=%270%200%2012%2016%27%3E%3Cpath%20d=%27M4%201v14M4%205l5-3M4%209l5-3%27%20fill=%27none%27%20stroke=%27%237fe3ff%27%20stroke-width=%271.6%27%20stroke-linecap=%27round%27/%3E%3C/svg%3E");
}

/* ============================================
   OVERFLOW PREVENTION - Safety Net
   ============================================ */

*,
*::before,
*::after {
    box-sizing: border-box;
}

img, video, iframe, embed, object, svg {
    max-width: 100%;
    height: auto;
}

[class*="grid"] > *,
[class*="flex"] > * {
    min-width: 0;
}

pre, code, .code-block, [class*="code"] {
    max-width: 100%;
    overflow-x: auto;
}

pre code,
.code-block code {
    display: block;
    min-width: 0;
}

.table-wrapper,
[class*="table-"] {
    max-width: 100%;
    overflow-x: auto;
}

p, li, td, th {
    overflow-wrap: break-word;
}

details {
    height: fit-content;
}

:where(p, li, blockquote, figcaption, dd, .prose, .seo-text, article)
  a:not([class]) {
    text-decoration: underline;
    text-underline-offset: 0.15em;
}

input, textarea, select {
    max-width: 100%;
}

section {
    overflow: clip;
}

/* ============================================
   BASE
   ============================================ */

html {
    -webkit-text-size-adjust: 100%;
    scroll-padding-top: calc(var(--header-bottom) + 1rem);
}

@media (prefers-reduced-motion: no-preference) {
    html { scroll-behavior: smooth; }
}

body {
    margin: 0;
    background: var(--c-ink);
    color: var(--c-text);
    font-family: var(--f-body);
    font-size: 1rem;
    line-height: 1.65;
    text-rendering: optimizeLegibility;
}

body.nav-open {
    overflow: hidden;
}

img {
    display: block;
}

h1, h2, h3, h4 {
    font-family: var(--f-display);
    font-weight: 700;
    line-height: 1.15;
    color: var(--c-gold-300);
    margin: 0 0 .6em;
    text-shadow: 0 2px 0 rgba(0, 0, 0, .55);
    overflow-wrap: break-word;
}

h1 { font-size: clamp(2rem, 6vw, 3.4rem); letter-spacing: .005em; }
h2 { font-size: clamp(1.65rem, 4vw, 2.5rem); }
h3 { font-size: clamp(1.2rem, 2.4vw, 1.45rem); color: var(--c-gold-100); }
h4 { font-size: 1.1rem; }

p { margin: 0 0 1em; }

a {
    color: var(--c-ice-400);
}

a:hover {
    color: var(--c-ice-200);
}

strong { color: var(--c-gold-100); font-weight: 600; }

ul, ol { padding-left: 1.25rem; }

:focus-visible {
    outline: 3px solid var(--c-ice-400);
    outline-offset: 3px;
}

main {
    display: block;
    background: var(--c-slate-900) url("./assets/2477b2c2a82106de7ed13bd9258deb06.webp") center top / max(100%, 1280px) auto repeat-y;
}

main:focus { outline: none; }

.svg-sprite {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
}

.visually-hidden {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

.skip-link {
    position: absolute;
    left: 1rem;
    top: -4rem;
    z-index: 100;
    padding: .75rem 1rem;
    background: var(--c-gold-500);
    color: #1b1006;
    font-weight: 600;
    border-radius: var(--radius-s);
    text-decoration: none;
}

.skip-link:focus { top: 1rem; }

.icon {
    width: 1.5rem;
    height: 1.5rem;
    flex: none;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* ============================================
   LAYOUT PRIMITIVES
   ============================================ */

.container {
    width: 100%;
    max-width: var(--container);
    margin-inline: auto;
    padding-inline: var(--gutter);
}

.section {
    position: relative;
    padding-block: var(--section-y);
}

.section--tight { padding-block: clamp(2rem, 5vw, 3.5rem); }

.prose {
    max-width: 70ch;
}

.prose p, .prose li {
    color: var(--c-text-soft);
}

.prose li + li { margin-top: .4em; }

.lead {
    font-size: clamp(1.05rem, 2vw, 1.2rem);
    color: var(--c-text);
}

.eyebrow {
    font-family: var(--f-display);
    font-weight: 600;
    font-size: .95rem;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--c-ice-400);
    margin-bottom: .5rem;
}

.card-grid {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
}

.split {
    display: grid;
    gap: clamp(1.5rem, 4vw, 3rem);
    grid-template-columns: minmax(0, 1fr);
}

.split > * { min-width: 0; }

@media (min-width: 1024px) {
    .split {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: center;
    }
    .split--reverse > :first-child { order: 2; }
}

.gold-rule {
    height: 6px;
    border: 0;
    margin: 0;
    background: linear-gradient(180deg, var(--c-gold-500) 0 2px, var(--c-wood) 2px 4px, var(--c-gold-700) 4px 6px);
}

.text-link {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    min-height: 44px;
    color: var(--c-ice-400);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: .2em;
}

.text-link:hover { color: var(--c-ice-200); }

/* ============================================
   BUTTONS & CTA
   ============================================ */

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    min-height: 44px;
    padding: .6rem 1.4rem;
    font-family: var(--f-display);
    font-weight: 700;
    font-size: 1.08rem;
    letter-spacing: .02em;
    line-height: 1.1;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    border: 0;
    white-space: nowrap;
    transition: background-color .2s ease, box-shadow .2s ease, color .2s ease;
}

.btn--ice {
    border: 1.5px solid var(--c-ice-400);
    border-radius: 999px;
    color: var(--c-ice-200);
    background: rgba(6, 25, 27, .85);
    box-shadow: inset 0 0 10px rgba(127, 227, 255, .25);
}

.btn--ice:hover {
    color: #fff;
    background: #0f3036;
    box-shadow: var(--glow-ice), inset 0 0 10px rgba(127, 227, 255, .35);
}

.btn--gold {
    position: relative;
    isolation: isolate;
    color: #2b1a05;
    background: var(--c-gold-900);
    clip-path: var(--hex);
    padding: .65rem 2rem;
    text-shadow: 0 1px 0 rgba(255, 240, 189, .6);
}

.btn--gold::before {
    content: "";
    position: absolute;
    inset: 2px;
    z-index: -1;
    clip-path: var(--hex);
    background: linear-gradient(180deg, #fff3c4 0%, #f2cf72 38%, #c8922e 62%, #ecc76d 100%);
    transition: filter .2s ease;
}

.btn--gold:hover,
.btn--gold:focus-visible {
    color: #1b1006;
    outline: none;
}

.btn--gold:hover::before { filter: brightness(1.08); }

.btn--lg {
    font-size: clamp(1.15rem, 2.4vw, 1.35rem);
    min-height: 56px;
    padding: .85rem 2.75rem;
}

.btn--block { width: 100%; }

.hex-wrap {
    display: inline-flex;
    border-radius: 4px;
    filter: drop-shadow(0 3px 4px rgba(0, 0, 0, .55));
}

.hex-wrap--block { display: flex; width: 100%; }

.hex-wrap:focus-within {
    outline: 3px solid var(--c-ice-400);
    outline-offset: 3px;
}

@media (prefers-reduced-motion: no-preference) {
    .hex-wrap:hover { animation: goldPulse 1.6s ease-in-out infinite; }
}

@media (prefers-reduced-motion: reduce) {
    .hex-wrap:hover { filter: drop-shadow(0 0 10px rgba(243, 210, 122, .7)); }
}

@keyframes goldPulse {
    0%, 100% { filter: drop-shadow(0 0 4px rgba(243, 210, 122, .45)); }
    50% { filter: drop-shadow(0 0 16px rgba(243, 210, 122, .9)); }
}

.cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .75rem;
    max-width: 100%;
}

.cta__strand {
    width: 64px;
    height: 14px;
    color: var(--c-ice-400);
    filter: drop-shadow(0 0 4px rgba(127, 227, 255, .6));
    flex: none;
}

.cta__strand--end { transform: scaleX(-1); }

@media (max-width: 419px) {
    .cta__strand { display: none; }
}

.cta-note {
    display: block;
    margin-top: .5rem;
    font-size: .875rem;
    color: var(--c-text-soft);
}

.terms-line {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .25rem 0;
    font-size: .9375rem;
    color: var(--c-text-soft);
    margin: .85rem 0;
}

.terms-line span + span::before {
    content: "•";
    margin: 0 .55em;
    color: var(--c-gold-500);
}

/* ============================================
   PANELS & ORNAMENTS
   ============================================ */

.panel {
    position: relative;
    background: linear-gradient(180deg, rgba(18, 54, 58, .95), rgba(9, 34, 37, .96));
    border: 2px solid var(--c-gold-500);
    border-radius: var(--radius-s);
    box-shadow: 0 0 0 2px var(--c-outline), var(--shadow-panel);
    padding: clamp(1.4rem, 3.5vw, 2.4rem);
}

.panel--stone {
    background: linear-gradient(180deg, #1a2a33, #0f1a21);
    border: 4px solid;
    border-color: #8a959a #4a5459 #3b4449 #6d787d;
    outline: 1px solid var(--c-gold-700);
    outline-offset: -9px;
}

.panel--crimson {
    background: linear-gradient(115deg, var(--c-crimson-700), var(--c-crimson-900));
    border: 4px double var(--c-gold-500);
}

.panel--slate {
    background: linear-gradient(180deg, #26353b, #18242a);
    border-color: #4c5d63;
}

.panel-ribbon {
    position: relative;
    width: fit-content;
    max-width: 100%;
    margin: calc(-1 * clamp(2.6rem, 6vw, 3.4rem)) auto 1.25rem;
    padding: .5rem clamp(1.4rem, 4vw, 2.6rem);
    background: linear-gradient(180deg, #1d5156, #0f3134);
    border: 2px solid var(--c-gold-500);
    border-radius: 999px / 45%;
    box-shadow: 0 0 0 2px var(--c-outline), 0 6px 14px rgba(0, 0, 0, .45), inset 0 0 12px rgba(0, 0, 0, .4);
    font-family: var(--f-display);
    font-weight: 700;
    font-size: clamp(1.25rem, 3vw, 1.85rem);
    color: var(--c-gold-100);
    text-align: center;
    line-height: 1.2;
}

.knot-corners {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
}

.knot-corner {
    position: absolute;
    width: clamp(36px, 6vw, 64px);
    height: clamp(36px, 6vw, 64px);
    color: var(--c-gold-500);
    filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .5));
}

.knot-corners--ice .knot-corner {
    color: var(--c-ice-400);
    filter: drop-shadow(0 0 4px rgba(127, 227, 255, .55));
}

.knot-corner--tl { top: -10px; left: -10px; }
.knot-corner--tr { top: -10px; right: -10px; transform: scaleX(-1); }
.knot-corner--bl { bottom: -10px; left: -10px; transform: scaleY(-1); }
.knot-corner--br { bottom: -10px; right: -10px; transform: scale(-1, -1); }

.medallion {
    display: grid;
    place-items: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, #22595f, #0a2427 70%);
    border: 2px solid var(--c-gold-500);
    box-shadow: 0 0 0 2px var(--c-outline), 0 0 12px rgba(226, 182, 90, .45);
    color: var(--c-gold-100);
    font-family: var(--f-display);
    font-weight: 700;
    font-size: 1.1rem;
    line-height: 1;
}

/* Rune heading with flanking icy knot bands */
.rune-heading-wrap { margin-bottom: clamp(1.5rem, 4vw, 2.25rem); }

.rune-heading {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(.75rem, 2vw, 1.5rem);
}

.rune-heading__title {
    margin: 0;
    min-width: 0;
    text-align: center;
    flex: 0 1 auto;
}

.rune-heading__band {
    flex: 1 1 0;
    min-width: 28px;
    max-width: 320px;
    height: 18px;
    background: var(--band-ice) repeat-x center / auto 18px;
    filter: drop-shadow(0 0 4px rgba(127, 227, 255, .45));
}

.rune-heading--gold .rune-heading__band {
    background-image: var(--band-gold);
    filter: drop-shadow(0 0 3px rgba(226, 182, 90, .4));
}

.rune-heading__band--start {
    -webkit-mask-image: linear-gradient(to right, transparent, #000 70%);
    mask-image: linear-gradient(to right, transparent, #000 70%);
}

.rune-heading__band--end {
    -webkit-mask-image: linear-gradient(to left, transparent, #000 70%);
    mask-image: linear-gradient(to left, transparent, #000 70%);
}

.rune-heading__lead {
    max-width: 64ch;
    margin: .9rem auto 0;
    text-align: center;
    color: var(--c-text-soft);
}

.rune-heading-wrap--start .rune-heading { justify-content: flex-start; }
.rune-heading-wrap--start .rune-heading__band--start { display: none; }
.rune-heading-wrap--start .rune-heading__title { text-align: left; }
.rune-heading-wrap--start .rune-heading__lead { margin-left: 0; text-align: left; }

@media (max-width: 479px) {
    .rune-heading__band { min-width: 18px; }
}

/* Rune particles */
.rune-field {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

.rune-glyph {
    position: absolute;
    left: var(--x);
    top: var(--y);
    width: var(--s, 18px);
    height: calc(var(--s, 18px) * 1.4);
    fill: none;
    stroke: var(--c-ice-400);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    filter: drop-shadow(0 0 4px rgba(127, 227, 255, .9));
}

@media (prefers-reduced-motion: no-preference) {
    .rune-glyph { animation: runeFlicker 4.6s ease-in-out var(--d, 0s) infinite; }
}

@keyframes runeFlicker {
    0%, 100% { opacity: .35; }
    40% { opacity: 1; }
    55% { opacity: .6; }
    70% { opacity: .95; }
}

.anim-zone.is-paused *,
.anim-zone.is-paused,
html.is-hidden .anim-zone *,
html.is-hidden .hex-wrap {
    animation-play-state: paused !important;
}

/* ============================================
   HEADER
   ============================================ */

.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: var(--c-wood) url("./assets/971f487cc29cffa44ab05e22c28fb8ed.webp") center / cover no-repeat;
    border-bottom: 2px solid var(--c-gold-700);
    box-shadow: 0 2px 0 #000, 0 8px 22px rgba(0, 0, 0, .55);
}

.site-header__inner {
    display: flex;
    align-items: center;
    gap: .75rem;
    min-height: 64px;
    max-width: var(--container);
    margin-inline: auto;
    padding: .5rem var(--gutter);
}

.site-brand {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    margin-right: auto;
    min-height: 44px;
    text-decoration: none;
    color: var(--c-gold-300);
    flex: none;
}

.site-brand__text {
    font-family: var(--f-brand);
    font-weight: 700;
    font-size: clamp(1.05rem, 4.4vw, 1.6rem);
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--c-gold-300);
    text-shadow: 0 0 10px rgba(226, 182, 90, .35), 0 2px 0 #000;
    white-space: nowrap;
}

.site-brand:hover .site-brand__text { color: var(--c-gold-100); }

.brand-knot {
    width: 26px;
    height: 22px;
    color: var(--c-ice-400);
    filter: drop-shadow(0 0 5px rgba(127, 227, 255, .75));
    flex: none;
}

.nav-toggle {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 46px;
    height: 46px;
    padding: 0;
    flex: none;
    background: rgba(12, 38, 40, .85);
    border: 1.5px solid var(--c-gold-700);
    border-radius: var(--radius-s);
    cursor: pointer;
}

.nav-toggle__bar {
    display: block;
    width: 22px;
    height: 2px;
    background: var(--c-gold-300);
    border-radius: 2px;
    transition: transform .2s ease, opacity .2s ease;
}

.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.site-nav {
    display: none;
    position: fixed;
    top: var(--header-bottom);
    left: 0;
    right: 0;
    bottom: 0;
    height: auto;
    z-index: 60;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 1rem var(--gutter) 2.5rem;
    background: var(--c-wood-dark);
    border-top: 1px solid var(--c-gold-700);
}

.site-nav.is-open { display: block; }

.site-nav__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.site-nav__link {
    display: flex;
    align-items: center;
    min-height: 48px;
    padding: .5rem .25rem;
    font-family: var(--f-display);
    font-weight: 600;
    font-size: 1.25rem;
    color: var(--c-text);
    text-decoration: none;
    border-bottom: 1px solid rgba(168, 121, 44, .35);
}

.site-nav__link:hover,
.site-nav__link.is-active {
    color: var(--c-gold-300);
}

.site-nav__link.is-active {
    box-shadow: inset 3px 0 0 var(--c-ice-400);
    padding-left: .75rem;
}

.site-nav__actions {
    display: flex;
    flex-direction: column;
    gap: .9rem;
    margin-top: 1.5rem;
}

.site-nav__note {
    margin: .25rem 0 0;
    text-align: center;
    font-size: .9375rem;
    color: var(--c-text-soft);
}

.header-actions {
    display: none;
    align-items: center;
    gap: .75rem;
    flex: none;
}

.header-actions .header-cta { padding-inline: 1.6rem; }

@media (min-width: 768px) {
    .header-actions { display: flex; }
    .site-nav__actions { display: none; }
    .site-header__inner { min-height: 72px; }
    .brand-knot { width: 30px; height: 25px; }
}

@media (min-width: 1024px) {
    .nav-toggle { display: none; }

    .site-nav,
    .site-nav.is-open {
        display: flex;
        position: static;
        flex: 1 1 auto;
        justify-content: center;
        padding: 0;
        overflow: visible;
        background: none;
        border: 0;
    }

    .site-nav__list {
        display: flex;
        align-items: center;
        gap: clamp(.25rem, 1.2vw, 1rem);
    }

    .site-nav__link {
        min-height: 44px;
        padding: .4rem .7rem;
        font-size: 1.12rem;
        border-bottom: 0;
        text-shadow: 0 2px 0 rgba(0, 0, 0, .7);
    }

    .site-nav__link.is-active {
        padding-left: .7rem;
        box-shadow: inset 0 -2px 0 var(--c-ice-400);
    }

    .site-brand { margin-right: 0; }
}

/* ============================================
   BREADCRUMBS & PAGE HERO
   ============================================ */

.breadcrumbs ol {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .25rem;
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: .9375rem;
}

.breadcrumbs li {
    display: inline-flex;
    align-items: center;
    color: var(--c-text);
    text-shadow: 0 1px 3px #000;
}

.breadcrumbs li + li::before {
    content: "›";
    margin-right: .35rem;
    color: var(--c-gold-500);
}

.breadcrumbs a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    color: var(--c-ice-200);
}

.breadcrumbs [aria-current="page"] { color: var(--c-gold-100); }

.page-hero {
    position: relative;
    isolation: isolate;
    overflow: clip;
    padding: .5rem 0 clamp(3rem, 8vw, 5rem);
    background: var(--c-slate-900);
}

.page-hero__bg {
    position: absolute;
    inset: 0;
    z-index: -2;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: var(--hero-pos-m, var(--hero-pos, center));
}

.page-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(180deg, rgba(7, 13, 16, .35) 0%, rgba(7, 13, 16, 0) 22%, rgba(20, 31, 36, .55) 70%, var(--c-slate-900) 100%);
}

.page-hero__inner {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
}

.page-hero .breadcrumbs { grid-column: 1 / -1; }

.page-hero__panel {
    margin-top: clamp(8rem, 42vw, 15rem);
}

.page-hero--figure .page-hero__panel { margin-top: 0; }

.page-hero__title { margin-bottom: .5em; }

.page-hero__lead {
    color: var(--c-text);
    font-size: clamp(1.02rem, 2vw, 1.15rem);
}

.page-hero__panel > :last-child { margin-bottom: 0; }

.page-hero__figure {
    display: flex;
    justify-content: center;
    align-items: flex-end;
}

.page-hero__figure img {
    width: auto;
    max-height: 300px;
    object-fit: contain;
    filter: drop-shadow(0 12px 24px rgba(0, 0, 0, .55));
}

@media (min-width: 1024px) {
    .page-hero {
        display: flex;
        flex-direction: column;
        min-height: clamp(540px, 68vh, 700px);
        padding: .75rem 0 4.5rem;
    }

    .page-hero__bg { background-position: var(--hero-pos, center); }

    .page-hero::after {
        background:
            linear-gradient(180deg, rgba(7, 13, 16, .3) 0%, rgba(7, 13, 16, 0) 18%, rgba(7, 13, 16, 0) 72%, var(--c-slate-900) 100%);
    }

    .page-hero__inner {
        flex: 1;
        grid-template-columns: minmax(0, 1fr) minmax(0, 36rem);
        grid-template-rows: auto 1fr;
        align-items: center;
        column-gap: clamp(2rem, 4vw, 4rem);
    }

    .page-hero__panel {
        grid-column: 2;
        grid-row: 2;
        margin-top: 0;
    }

    .page-hero--left .page-hero__panel { grid-column: 1; }

    .page-hero__figure {
        grid-column: 1;
        grid-row: 2;
        align-self: end;
        margin-bottom: -4.5rem;
    }

    .page-hero__figure img { max-height: 600px; }
}

/* ============================================
   OFFER STEPS (welcome package)
   ============================================ */

.offer-steps {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 2.4rem;
}

.offer-step {
    position: relative;
    display: grid;
    justify-items: center;
    gap: .15rem;
    padding: 1.6rem 1rem 1.1rem;
    text-align: center;
    background: linear-gradient(180deg, rgba(10, 40, 46, .92), rgba(6, 25, 27, .92));
    border: 1.5px solid var(--c-ice-600);
    border-radius: var(--radius-s);
    box-shadow: inset 0 0 18px rgba(127, 227, 255, .15), 0 6px 16px rgba(0, 0, 0, .4);
}

.offer-step .knot-corner {
    width: 26px;
    height: 26px;
}

.offer-step .knot-corner--tl,
.offer-step .knot-corner--tr { top: -7px; }
.offer-step .knot-corner--bl,
.offer-step .knot-corner--br { bottom: -7px; }
.offer-step .knot-corner--tl,
.offer-step .knot-corner--bl { left: -7px; }
.offer-step .knot-corner--tr,
.offer-step .knot-corner--br { right: -7px; }

.offer-step__num {
    position: absolute;
    top: -1.25rem;
    left: 1.25rem;
    z-index: 2;
}

.offer-step__label {
    font-size: .875rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--c-ice-200);
}

.offer-step__amount {
    font-family: var(--f-display);
    font-weight: 700;
    font-size: clamp(1.5rem, 4vw, 1.9rem);
    line-height: 1.1;
    color: var(--c-gold-100);
}

.offer-step__extra {
    font-family: var(--f-display);
    font-weight: 600;
    font-size: 1.1rem;
    color: var(--c-text);
}

.offer-step__note {
    font-size: .875rem;
    color: var(--c-text-soft);
}

.offer-step + .offer-step::before {
    content: "";
    position: absolute;
    left: 50%;
    top: -2.05rem;
    width: 20px;
    height: 20px;
    margin-left: -10px;
    background: var(--chev-gold) center / contain no-repeat;
    transform: rotate(90deg);
    filter: drop-shadow(0 0 4px rgba(226, 182, 90, .6));
}

@media (min-width: 560px) {
    .offer-steps {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 1.9rem;
    }

    .offer-step { padding-top: 1.8rem; }

    .offer-step__num {
        left: 50%;
        margin-left: -1.25rem;
    }

    .offer-step + .offer-step::before {
        left: -1.55rem;
        top: 50%;
        margin: -10px 0 0;
        transform: none;
    }
}

/* ============================================
   GUIDE STEPS (numbered process with cyan route)
   ============================================ */

.guide-steps {
    position: relative;
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 1.5rem;
}

.guide-steps::before {
    content: "";
    position: absolute;
    left: calc(1.25rem - 2px);
    top: 1.25rem;
    bottom: 1.25rem;
    width: 4px;
    border-radius: 4px;
    background: linear-gradient(180deg, var(--c-ice-400), var(--c-ice-600) 60%, var(--c-gold-500));
    box-shadow: 0 0 12px rgba(127, 227, 255, .7), 0 0 26px rgba(47, 179, 220, .35);
}

.guide-step {
    position: relative;
    display: grid;
    grid-template-columns: 2.5rem minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.guide-step__num { position: relative; z-index: 1; }

.guide-step__body {
    padding: 1rem 1.15rem;
    background: linear-gradient(180deg, rgba(28, 42, 48, .94), rgba(16, 26, 31, .96));
    border: 1px solid #44575e;
    border-radius: var(--radius-s);
}

.guide-step__title {
    font-size: 1.15rem;
    margin-bottom: .35em;
}

.guide-step__body p {
    margin: 0;
    color: var(--c-text-soft);
}

@media (min-width: 1024px) {
    .guide-steps {
        grid-auto-flow: column;
        grid-auto-columns: minmax(0, 1fr);
        gap: 1.25rem;
    }

    .guide-steps::before {
        left: 1.25rem;
        right: 1.25rem;
        top: calc(1.25rem - 2px);
        bottom: auto;
        width: auto;
        height: 4px;
        background: linear-gradient(90deg, var(--c-ice-400), var(--c-ice-600) 60%, var(--c-gold-500));
    }

    .guide-step {
        grid-template-columns: minmax(0, 1fr);
        justify-items: center;
        text-align: center;
    }

    .guide-step__body { width: 100%; height: 100%; }
}

/* ============================================
   CARDS, TILES, CHIPS
   ============================================ */

.feature-card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    height: 100%;
    padding: 1.4rem 1.25rem 1.3rem;
    background: linear-gradient(180deg, var(--c-teal-800), var(--c-teal-950));
    border: 1px solid rgba(168, 121, 44, .55);
    border-top: 3px solid var(--c-gold-500);
    border-radius: var(--radius-s);
    box-shadow: 0 10px 22px rgba(0, 0, 0, .4), inset 0 0 20px rgba(0, 0, 0, .3);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.feature-card__icon {
    display: inline-grid;
    place-items: center;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    color: var(--c-ice-400);
    background: rgba(6, 25, 27, .9);
    border: 1px solid rgba(127, 227, 255, .5);
    box-shadow: 0 0 12px rgba(127, 227, 255, .3);
}

.feature-card__icon .icon { width: 1.6rem; height: 1.6rem; }

.feature-card__title {
    margin: .25rem 0 0;
    font-size: 1.25rem;
    color: var(--c-gold-100);
}

.feature-card__link {
    color: inherit;
    text-decoration: none;
}

.feature-card__link::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
}

.feature-card__link:focus-visible { outline: none; }

.feature-card--link:focus-within {
    outline: 3px solid var(--c-ice-400);
    outline-offset: 3px;
}

.feature-card__text {
    margin: 0;
    color: var(--c-text-soft);
}

.feature-card--link:hover {
    transform: translateY(-3px);
    border-color: var(--c-gold-500);
    box-shadow: 0 14px 26px rgba(0, 0, 0, .5), 0 0 18px rgba(226, 182, 90, .3);
}

.feature-card--crimson {
    background: linear-gradient(140deg, var(--c-crimson-700), var(--c-crimson-900));
    border: 4px double var(--c-gold-500);
}

.feature-card--crimson .feature-card__icon {
    color: var(--c-gold-300);
    border-color: var(--c-gold-500);
    background: rgba(51, 7, 12, .9);
}

.feature-card--stone {
    background: linear-gradient(180deg, #23323a, #121c22);
    border: 1px solid #56666c;
    border-top: 3px solid var(--c-ice-600);
}

@media (prefers-reduced-motion: reduce) {
    .feature-card, .feature-card--link:hover { transition: none; transform: none; }
}

.stat-tile {
    position: relative;
    display: grid;
    justify-items: center;
    gap: .35rem;
    padding: 1.5rem 1rem 1.3rem;
    text-align: center;
    background: linear-gradient(180deg, var(--c-teal-800), var(--c-teal-950));
    border: 1px solid rgba(168, 121, 44, .6);
    border-radius: var(--radius-s);
    box-shadow: 0 10px 20px rgba(0, 0, 0, .4);
}

.stat-tile__icon { color: var(--c-ice-400); }

.stat-tile__value {
    font-family: var(--f-display);
    font-weight: 700;
    font-size: clamp(2rem, 6vw, 2.9rem);
    line-height: 1;
    color: var(--c-gold-300);
    text-shadow: 0 0 14px rgba(226, 182, 90, .35), 0 2px 0 #000;
}

.stat-tile__value::after {
    content: "";
    display: block;
    width: 112px;
    height: 12px;
    margin: .6rem auto 0;
    background: var(--band-ice) repeat-x center / auto 12px;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 25%, #000 75%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 25%, #000 75%, transparent);
}

.stat-tile__label {
    color: var(--c-text);
    font-weight: 600;
}

.chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.chip {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    min-height: 44px;
    padding: .45rem 1rem;
    border-radius: 999px;
    border: 1px solid var(--c-gold-700);
    background: rgba(28, 42, 48, .92);
    color: var(--c-text);
    font-weight: 600;
    font-size: .95rem;
    text-decoration: none;
    white-space: nowrap;
    transition: box-shadow .2s ease, border-color .2s ease, color .2s ease;
}

.chip .icon { width: 1.15rem; height: 1.15rem; color: var(--c-ice-400); }

a.chip:hover,
.chip-list--glow .chip:hover {
    border-color: var(--c-gold-300);
    color: var(--c-gold-100);
    box-shadow: 0 0 12px rgba(226, 182, 90, .4);
}

.chip-list--teal .chip {
    background: rgba(12, 38, 40, .94);
    border-color: var(--c-gold-500);
}

.chip-list--scroll {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding: .25rem .1rem .6rem;
    scrollbar-width: thin;
    scrollbar-color: var(--c-gold-700) transparent;
}

.chip-list--scroll .chip {
    background: rgba(12, 38, 40, .94);
    border-color: var(--c-gold-500);
}

@media (min-width: 1024px) {
    .chip-list--scroll { flex-wrap: wrap; overflow: visible; }
}

/* ============================================
   TABLES
   ============================================ */

.table-wrap {
    overflow-x: auto;
    border: 2px solid #4b5c62;
    border-radius: var(--radius-s);
    background: linear-gradient(180deg, #1e2d33, #121c21);
    box-shadow: 0 0 0 2px var(--c-outline), 0 12px 26px rgba(0, 0, 0, .45);
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .98rem;
}

.data-table caption {
    padding: .9rem 1rem .4rem;
    text-align: left;
    font-family: var(--f-display);
    font-weight: 600;
    color: var(--c-gold-300);
}

.data-table th,
.data-table td {
    padding: .85rem 1rem;
    text-align: left;
    vertical-align: top;
}

.data-table thead th {
    font-family: var(--f-display);
    font-weight: 700;
    font-size: 1.02rem;
    color: var(--c-gold-100);
    background: rgba(6, 25, 27, .85);
    border-bottom: 2px solid var(--c-gold-500);
    white-space: nowrap;
}

.data-table tbody tr:nth-child(odd) { background: rgba(18, 54, 58, .55); }
.data-table tbody tr:nth-child(even) { background: rgba(12, 38, 40, .55); }

.data-table tbody th {
    font-weight: 600;
    color: var(--c-text);
    padding-left: 2rem;
    background: var(--rune-bullet) no-repeat .85rem 1.05rem / 10px 14px;
}

.data-table td { color: var(--c-text-soft); }

.data-table tr.is-highlight {
    background: rgba(78, 50, 12, .55);
    box-shadow: inset 0 0 0 2px var(--c-gold-500), inset 0 0 18px rgba(243, 210, 122, .25);
}

.data-table tr.is-highlight th,
.data-table tr.is-highlight td { color: var(--c-gold-100); }

@media (max-width: 639px) {
    .data-table--stack thead {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
    }

    .data-table--stack,
    .data-table--stack tbody,
    .data-table--stack tr,
    .data-table--stack th,
    .data-table--stack td {
        display: block;
        width: 100%;
    }

    .data-table--stack tbody tr {
        padding: .4rem 0;
        border-bottom: 1px solid rgba(168, 121, 44, .5);
    }

    .data-table--stack tbody th {
        font-family: var(--f-display);
        font-size: 1.1rem;
        color: var(--c-gold-100);
        padding: .7rem 1rem .4rem 2rem;
        background-position: .85rem .95rem;
    }

    .data-table--stack td {
        padding: .35rem 1rem .5rem 2rem;
    }

    .data-table--stack td::before {
        content: attr(data-label);
        display: block;
        font-size: .875rem;
        font-weight: 600;
        color: var(--c-gold-300);
    }
}

/* ============================================
   FAQ (details/summary)
   ============================================ */

.faq-list {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .85rem;
    align-items: start;
}

.faq-item {
    align-self: start;
    background: linear-gradient(180deg, #23333a, #172329);
    border: 1px solid #4a5b61;
    border-left: 3px solid var(--c-gold-700);
    border-radius: var(--radius-s);
    box-shadow: 0 6px 16px rgba(0, 0, 0, .35);
}

.faq-item[open] {
    border-left-color: var(--c-ice-400);
}

.faq-item__q {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 56px;
    padding: .85rem 1.1rem;
    cursor: pointer;
    list-style: none;
}

.faq-item__q::-webkit-details-marker { display: none; }

.faq-item__q:focus-visible {
    outline: 3px solid var(--c-ice-400);
    outline-offset: 2px;
    border-radius: var(--radius-s);
}

.faq-item__text {
    margin: 0;
    font-family: var(--f-display);
    font-weight: 600;
    font-size: clamp(1.05rem, 2.2vw, 1.2rem);
    color: var(--c-gold-300);
    text-shadow: none;
}

.faq-item__chevron {
    color: var(--c-ice-400);
    filter: drop-shadow(0 0 4px rgba(127, 227, 255, .6));
    transition: transform .2s ease;
}

.faq-item[open] .faq-item__chevron { transform: rotate(180deg); }

.faq-item__a {
    padding: 0 1.1rem 1.1rem;
    color: var(--c-text-soft);
}

.faq-item__a > :last-child { margin-bottom: 0; }

@media (prefers-reduced-motion: reduce) {
    .faq-item__chevron { transition: none; }
}

/* ============================================
   CALLOUTS & BADGES
   ============================================ */

.callout {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
    padding: 1.25rem 1.3rem;
    border-radius: var(--radius-s);
    background: linear-gradient(180deg, rgba(12, 38, 40, .96), rgba(6, 25, 27, .97));
    border: 2px solid var(--c-ice-600);
    box-shadow: 0 0 18px rgba(47, 179, 220, .2), 0 10px 22px rgba(0, 0, 0, .4);
}

.callout__icon {
    display: inline-grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 50%;
    color: var(--c-ice-400);
    border: 1px solid rgba(127, 227, 255, .55);
    background: rgba(6, 25, 27, .9);
}

.callout__title {
    margin-bottom: .35em;
    font-size: 1.2rem;
}

.callout__body > :last-child { margin-bottom: 0; }
.callout__body p { color: var(--c-text); }

.callout--warning {
    background: linear-gradient(180deg, #2a2618, #1a1810);
    border: 1px solid #5d5132;
    border-left: 5px solid var(--c-amber);
}

.callout--warning .callout__icon {
    color: var(--c-amber);
    border-color: rgba(240, 167, 58, .6);
    background: rgba(26, 24, 16, .9);
}

.callout--calm {
    background: linear-gradient(180deg, #24333a, #18242a);
    border: 1px solid #4a5b61;
    border-left: 5px solid var(--c-ice-400);
    box-shadow: 0 10px 22px rgba(0, 0, 0, .35);
}

.age-badge {
    display: inline-flex;
    align-items: center;
    gap: .65rem;
    margin: 0;
    font-weight: 600;
    color: var(--c-text);
}

.age-badge__circle {
    display: inline-grid;
    place-items: center;
    width: 2.6rem;
    height: 2.6rem;
    flex: none;
    border-radius: 50%;
    background: #fff;
    border: 3px solid var(--c-danger);
    color: #111;
    font-family: var(--f-display);
    font-weight: 700;
    font-size: .95rem;
    line-height: 1;
    box-shadow: 0 0 0 2px rgba(0, 0, 0, .5);
}

.age-badge a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    color: var(--c-text);
}

.age-badge a:hover { color: var(--c-gold-100); }

/* ============================================
   FRAMED MEDIA
   ============================================ */

.framed-media {
    position: relative;
    margin: 0;
}

.framed-media__frame {
    position: relative;
    border: 3px solid var(--c-gold-500);
    border-radius: 4px;
    background: #0a1316;
    box-shadow: 0 0 0 2px var(--c-outline), inset 0 0 0 2px var(--c-outline), 0 16px 32px rgba(0, 0, 0, .5);
}

.framed-media__frame img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.framed-media--ice .framed-media__frame {
    border-color: var(--c-ice-400);
    box-shadow: 0 0 0 2px var(--c-outline), 0 0 18px rgba(127, 227, 255, .35), 0 16px 32px rgba(0, 0, 0, .5);
}

.framed-media__caption {
    position: relative;
    z-index: 2;
    width: fit-content;
    max-width: 90%;
    margin: -1.35rem auto 0;
    padding: .45rem 1.2rem;
    border-radius: 999px;
    background: var(--c-navy);
    border: 1.5px solid var(--c-gold-500);
    box-shadow: 0 6px 14px rgba(0, 0, 0, .5);
    color: var(--c-text);
    font-size: .9375rem;
    text-align: center;
}

/* ============================================
   LINK PLANKS
   ============================================ */

.link-plank {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .25rem 1rem;
    align-items: center;
    padding: 1.15rem 1.25rem;
    min-height: 44px;
    text-decoration: none;
    background: linear-gradient(180deg, rgba(42, 27, 16, .96), rgba(22, 13, 7, .97));
    border: 1px solid var(--c-gold-700);
    border-radius: var(--radius-s);
    box-shadow: 0 8px 18px rgba(0, 0, 0, .4), inset 0 0 0 1px rgba(255, 240, 189, .06);
    transition: border-color .2s ease, box-shadow .2s ease;
}

.link-plank__title {
    font-family: var(--f-display);
    font-weight: 700;
    font-size: 1.2rem;
    color: var(--c-gold-300);
    text-decoration: underline;
    text-underline-offset: .2em;
    text-decoration-color: rgba(243, 210, 122, .5);
}

.link-plank__text {
    grid-column: 1;
    color: var(--c-text-soft);
    font-size: .98rem;
}

.link-plank__arrow {
    grid-column: 2;
    grid-row: 1 / span 2;
    color: var(--c-ice-400);
}

.link-plank:hover {
    border-color: var(--c-gold-300);
    box-shadow: 0 10px 22px rgba(0, 0, 0, .5), 0 0 14px rgba(226, 182, 90, .3);
}

/* ============================================
   CAROUSEL
   ============================================ */

.carousel {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .75rem;
}

.carousel__viewport {
    position: relative;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    border-radius: var(--radius-s);
}

.carousel__viewport::-webkit-scrollbar { display: none; }

.carousel__track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(220px, 78%);
    gap: 1rem;
    list-style: none;
    margin: 0;
    padding: .5rem .25rem 1rem;
}

.carousel__slide {
    scroll-snap-align: start;
    min-width: 0;
}

@media (min-width: 768px) {
    .carousel__track { grid-auto-columns: calc((100% - 2rem) / 3); }
}

@media (min-width: 1024px) {
    .carousel__track { grid-auto-columns: calc((100% - 3rem) / 4); }
}

.carousel__controls {
    display: none;
    align-items: center;
    justify-content: center;
    gap: .5rem;
}

.carousel.is-ready .carousel__controls { display: flex; }
.carousel.is-ready.is-static .carousel__controls { display: none; }

.carousel__btn {
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border-radius: 50%;
    border: 1.5px solid var(--c-gold-500);
    background: rgba(12, 38, 40, .92);
    color: var(--c-gold-300);
    cursor: pointer;
    transition: box-shadow .2s ease, color .2s ease;
}

.carousel__btn--prev .icon { transform: rotate(90deg); }
.carousel__btn--next .icon { transform: rotate(-90deg); }

.carousel__btn:hover:not(:disabled) {
    color: var(--c-gold-100);
    box-shadow: 0 0 14px rgba(226, 182, 90, .5);
}

.carousel__btn:disabled {
    cursor: default;
    color: var(--c-slate-500);
    border-color: var(--c-slate-500);
}

.carousel__dots {
    display: flex;
    align-items: center;
}

.carousel__dot {
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
}

.carousel__dot::before {
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--c-slate-500);
    box-shadow: 0 0 0 1px #000;
    transition: background-color .2s ease, transform .2s ease;
}

.carousel__dot.is-active::before {
    background: var(--c-gold-300);
    transform: scale(1.25);
    box-shadow: 0 0 8px rgba(243, 210, 122, .7);
}

@media (min-width: 1024px) {
    .carousel.is-ready:not(.is-static) {
        padding-inline: 3.5rem;
    }

    .carousel.is-ready .carousel__btn {
        position: absolute;
        top: calc(50% - 2.5rem);
        z-index: 2;
    }

    .carousel__btn--prev { left: 0; }
    .carousel__btn--next { right: 0; }
}

/* ============================================
   CTA BANNER
   ============================================ */

.cta-banner {
    position: relative;
    padding-block: clamp(2.5rem, 6vw, 4.5rem);
}

.cta-banner__panel {
    position: relative;
    max-width: 880px;
    margin-inline: auto;
    padding: clamp(1.75rem, 4vw, 2.75rem) clamp(1.25rem, 4vw, 3rem);
    text-align: center;
    border: 3px solid var(--c-gold-500);
    border-radius: var(--radius-s);
    box-shadow: 0 0 0 2px var(--c-outline), 0 18px 40px rgba(0, 0, 0, .55), inset 0 0 30px rgba(0, 0, 0, .45);
    background:
        linear-gradient(180deg, rgba(18, 54, 58, .9), rgba(6, 25, 27, .94)),
        var(--c-teal-900);
}

.cta-banner--wood .cta-banner__panel {
    background:
        linear-gradient(180deg, rgba(14, 44, 47, .9), rgba(22, 13, 7, .92)),
        var(--c-wood) url("./assets/971f487cc29cffa44ab05e22c28fb8ed.webp") center / cover no-repeat;
}

.cta-banner--crimson .cta-banner__panel {
    background:
        linear-gradient(115deg, rgba(110, 18, 24, .97), rgba(51, 7, 12, .97) 60%, rgba(12, 38, 40, .97));
    border-style: double;
    border-width: 4px;
}

.cta-banner__title { margin-bottom: .4em; }

.cta-banner__text {
    max-width: 60ch;
    margin: 0 auto 1.4rem;
    color: var(--c-text);
}

.cta-banner .age-badge {
    margin-top: 1rem;
    justify-content: center;
}

/* ============================================
   FOOTER
   ============================================ */

.site-footer {
    position: relative;
    color: var(--c-text-soft);
    border-top: 2px solid var(--c-gold-700);
    background:
        linear-gradient(180deg, rgba(14, 8, 4, .55), rgba(10, 6, 3, .78)),
        var(--c-wood) url("./assets/971f487cc29cffa44ab05e22c28fb8ed.webp") center / cover no-repeat;
    box-shadow: inset 0 2px 0 #000;
}

.site-footer__inner {
    padding-top: clamp(2.5rem, 6vw, 3.5rem);
    padding-bottom: 1.5rem;
}

.footer-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 2rem;
}

@media (min-width: 640px) {
    .footer-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .footer-brand { grid-column: 1 / -1; }
}

@media (min-width: 1024px) {
    .footer-grid { grid-template-columns: minmax(0, 2fr) repeat(3, minmax(0, 1fr)); }
    .footer-brand { grid-column: auto; }
}

.footer-brand__name {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .75rem;
    font-family: var(--f-brand);
    font-weight: 700;
    font-size: clamp(1.4rem, 4vw, 1.9rem);
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--c-gold-300);
    text-shadow: 0 0 10px rgba(226, 182, 90, .35), 0 2px 0 #000;
}

.footer-brand__text {
    max-width: 44ch;
    color: var(--c-text-soft);
}

.footer-col__title {
    font-size: 1.15rem;
    margin-bottom: .5rem;
    color: var(--c-gold-300);
}

.footer-links {
    list-style: none;
    margin: 0;
    padding: 0;
}

.footer-link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    color: var(--c-text);
    text-decoration: none;
}

.footer-link:hover {
    color: var(--c-gold-100);
    text-decoration: underline;
    text-underline-offset: .2em;
}

.footer-legal {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(168, 121, 44, .45);
    font-size: .9375rem;
}

.footer-legal__licence {
    max-width: 90ch;
    color: var(--c-text-soft);
}

.footer-legal__row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.footer-legal__copy {
    margin: 0;
    color: var(--c-text-soft);
}

.footer-strip {
    display: block;
    width: 100%;
    height: 24px;
}

/* ============================================
   HOMEPAGE
   ============================================ */

.home-small-note {
    margin: .75rem 0 0;
    font-size: .9375rem;
    color: var(--c-text-soft);
}

.home-cta-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem 1.25rem;
    margin-top: 1.25rem;
}

/* ---------- Shared forest (hero + slots) ---------- */
.home-forest {
    position: relative;
    isolation: isolate;
    overflow: clip;
}

.home-forest__bg {
    position: absolute;
    inset: 0;
    z-index: -3;
    background: var(--c-teal-950) url("./assets/a3fc3dd0108f409ef4c60c12b025cf9f.webp") 30% top / cover no-repeat;
}

.home-forest::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 140px;
    z-index: -2;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(7, 13, 16, .55), rgba(7, 13, 16, 0));
}

.home-forest::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 180px;
    z-index: -1;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(22, 13, 7, 0), var(--c-wood-dark));
}

.home-forest__runes {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 55%;
    z-index: -2;
    pointer-events: none;
}

@media (min-width: 1024px) {
    .home-forest__bg { background-position: center top; }
}

/* ---------- Hero ---------- */
.home-hero {
    position: relative;
    padding: clamp(1.5rem, 5vw, 3rem) 0 clamp(2.5rem, 6vw, 4rem);
}

.home-hero__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 4rem;
}

.home-hero__intro { position: relative; }

.home-hero__copy {
    position: relative;
    z-index: 1;
    padding: 1.25rem;
    border-radius: var(--radius-m);
    background: linear-gradient(180deg, rgba(7, 13, 16, .74), rgba(7, 13, 16, .58));
}

.home-hero__copy h1 { margin-bottom: .45em; }

.home-hero__copy .lead { margin-bottom: 1.1rem; }

.home-hero__login {
    margin: 1rem 0 0;
    color: var(--c-text-soft);
}

.home-hero__valkyrie {
    position: absolute;
    right: -1rem;
    top: -1rem;
    z-index: 0;
    width: min(58%, 260px);
    opacity: .3;
    pointer-events: none;
}

.home-offer {
    width: 100%;
    max-width: 38rem;
    margin-inline: auto;
}

.home-offer__title {
    text-align: center;
    font-size: clamp(1.45rem, 3.6vw, 2rem);
    color: var(--c-gold-100);
    margin-bottom: 2.25rem;
}

.home-offer .terms-line { margin-top: 1.25rem; }

.home-offer__cta {
    display: flex;
    justify-content: center;
    margin-top: .5rem;
}

.home-offer__foot {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: .25rem 1.5rem;
    margin-top: .75rem;
}

@media (min-width: 768px) {
    .home-hero__valkyrie { width: 280px; opacity: .4; }
    .home-hero__copy { padding-right: 34%; }
}

@media (min-width: 1024px) {
    .home-hero__inner {
        grid-template-columns: minmax(0, 1fr) minmax(0, 36rem);
        align-items: center;
        column-gap: 3rem;
    }

    .home-hero__intro {
        display: flex;
        flex-direction: column;
        align-self: stretch;
    }

    .home-hero__copy {
        max-width: 34rem;
        padding-right: 1.25rem;
    }

    .home-hero__valkyrie {
        position: relative;
        right: auto;
        top: auto;
        width: auto;
        max-height: 520px;
        margin: 1rem 0 0 2.5rem;
        margin-top: auto;
        align-self: flex-start;
        opacity: 1;
        filter: drop-shadow(0 18px 26px rgba(0, 0, 0, .45));
    }
}

/* ---------- Popular slots ---------- */
.home-slots {
    position: relative;
    padding: clamp(1rem, 3vw, 2rem) 0 clamp(4.5rem, 9vw, 6.5rem);
}

.home-slots .rune-heading__lead {
    padding: .75rem 1rem;
    border-radius: var(--radius-m);
    background: rgba(7, 13, 16, .68);
    color: var(--c-text);
}

.slot-grid {
    list-style: none;
    margin: 0 auto;
    padding: 0;
    max-width: 920px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.75rem 1rem;
}

.slot-tile__link {
    position: relative;
    display: block;
    padding-bottom: 1rem;
    text-decoration: none;
    transition: transform .2s ease;
}

.slot-tile__link:focus-visible { outline: none; }

.slot-tile__frame {
    position: relative;
    display: block;
    border: 3px solid var(--c-gold-500);
    border-radius: 6px;
    background: #0a1316;
    box-shadow: 0 0 0 2px var(--c-outline), inset 0 0 0 2px var(--c-outline), 0 10px 22px rgba(0, 0, 0, .5);
    transition: box-shadow .2s ease;
}

.slot-tile__frame img {
    width: 100%;
    height: auto;
    aspect-ratio: 5 / 4;
    object-fit: cover;
    border-radius: 3px;
}

.slot-tile--silver .slot-tile__frame { border-color: #aeb8bc; }

.knot-corners--silver .knot-corner {
    color: #c7d0d3;
    filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .55));
}

.slot-tile .knot-corner,
.live-tile .knot-corner {
    width: 30px;
    height: 30px;
}

.slot-tile__pill,
.live-tile__pill {
    position: absolute;
    left: 50%;
    bottom: 0;
    z-index: 2;
    transform: translateX(-50%);
    padding: .3rem .95rem;
    border-radius: 999px;
    background: var(--c-navy);
    border: 1.5px solid var(--c-gold-500);
    box-shadow: 0 4px 10px rgba(0, 0, 0, .5);
    color: var(--c-text);
    font-family: var(--f-display);
    font-weight: 600;
    font-size: .9rem;
    line-height: 1.2;
    white-space: nowrap;
}

.slot-tile__link:hover,
.slot-tile__link:focus-visible { transform: translateY(-4px); }

.slot-tile__link:hover .slot-tile__frame,
.slot-tile__link:focus-visible .slot-tile__frame {
    box-shadow: 0 0 0 2px var(--c-outline), 0 0 22px rgba(243, 210, 122, .55), 0 14px 26px rgba(0, 0, 0, .55);
}

.slot-tile__link:focus-visible .slot-tile__frame {
    outline: 3px solid var(--c-ice-400);
    outline-offset: 4px;
}

.home-slots__cta {
    display: flex;
    justify-content: center;
    margin-top: 2.25rem;
}

@media (min-width: 768px) {
    .slot-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 2rem 1.5rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .slot-tile__link,
    .slot-tile__link:hover,
    .slot-tile__link:focus-visible { transition: none; transform: none; }
}

/* ---------- Live casino band ---------- */
.live-band {
    position: relative;
    isolation: isolate;
    z-index: 2;
    overflow-x: clip;
    overflow-y: visible;
    padding-block: clamp(2.5rem, 6vw, 3.5rem);
    background: var(--c-teal-950);
    border-block: 2px solid var(--c-gold-500);
    box-shadow: 0 -4px 0 var(--c-wood), 0 4px 0 var(--c-wood), 0 -6px 0 var(--c-gold-700), 0 6px 0 var(--c-gold-700);
}

.live-band__bg {
    position: absolute;
    inset: 0;
    z-index: -1;
    overflow: hidden;
    background: url("./assets/22ddc1ec6ade41b0256e5efa2fe23400.webp") 20% center / cover no-repeat;
}

.live-band__bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(6, 25, 27, .25), rgba(6, 25, 27, .55));
}

.live-band .container { max-width: 1320px; }

.live-band__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 2rem;
    align-items: center;
}

.live-band__copy {
    padding: 1.25rem;
    border-radius: var(--radius-m);
    background: linear-gradient(180deg, rgba(7, 13, 16, .8), rgba(7, 13, 16, .66));
}

.live-band__copy p { color: var(--c-text); }

.live-band__stage {
    position: relative;
    width: 100%;
    max-width: 380px;
    margin-inline: auto;
}

.live-compass {
    position: absolute;
    left: 50%;
    top: 44%;
    z-index: 0;
    width: 108%;
    transform: translate(-50%, -50%);
    color: var(--c-ice-400);
    filter: drop-shadow(0 0 6px rgba(127, 227, 255, .75)) drop-shadow(0 0 18px rgba(47, 179, 220, .4));
}

.live-band__dealer {
    position: relative;
    z-index: 1;
    width: 100%;
}

.live-band__ribbon { display: none; }

.live-grid-band {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-bottom: 1.25rem;
}

.live-grid-band__bar {
    width: 56px;
    height: 6px;
    flex: none;
    border-radius: 3px;
    background: #9aa6aa;
}

.live-grid {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem 1rem;
}

.live-tile {
    position: relative;
    margin: 0;
    padding-bottom: .9rem;
}

.live-tile__frame {
    position: relative;
    display: block;
    border: 2px solid var(--c-ice-400);
    border-radius: 4px;
    background: #0a1316;
    box-shadow: 0 0 0 2px var(--c-outline), 0 0 14px rgba(127, 227, 255, .3), 0 10px 20px rgba(0, 0, 0, .5);
}

.live-tile__frame img {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: 2px;
}

.live-tile .knot-corner {
    width: 24px;
    height: 24px;
}

.live-tile__pill {
    font-size: .85rem;
    padding: .25rem .8rem;
}

@media (min-width: 768px) {
    .live-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
    .live-band__bg { background-position: left center; }

    .live-band__bg::after {
        background: linear-gradient(90deg, rgba(7, 13, 16, .3), rgba(7, 13, 16, .05) 45%, rgba(6, 25, 27, .2));
    }

    .live-band__inner {
        grid-template-columns: minmax(0, 1fr) minmax(0, .9fr) 44px minmax(0, 1.45fr);
        gap: 1.5rem;
    }

    .live-band__stage { max-width: none; }

    .live-band__ribbon {
        display: block;
        position: relative;
        align-self: stretch;
        margin-block: calc(-1 * clamp(2.5rem, 6vw, 3.5rem) - 12px);
    }

    .live-band__ribbon-strip {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        filter: drop-shadow(0 0 6px rgba(0, 0, 0, .6));
    }

    .live-band__cap {
        position: absolute;
        left: 50%;
        width: 46px;
        height: 38px;
        transform: translateX(-50%);
        color: var(--c-gold-300);
        filter: drop-shadow(0 0 2px #000) drop-shadow(0 2px 4px rgba(0, 0, 0, .7));
    }

    .live-band__cap--top { top: -14px; }
    .live-band__cap--bottom { bottom: -14px; }
}

/* ---------- Sportsbook teaser ---------- */
.home-sports { padding-bottom: clamp(2rem, 5vw, 3rem); }

.sports-panel {
    position: relative;
    display: flex;
    flex-direction: column;
    max-width: 1060px;
    margin-inline: auto;
    background: linear-gradient(135deg, #13253a, #0b1620 70%);
    border: 5px solid;
    border-color: #8a959a #4a5459 #3b4449 #6d787d;
    outline: 1px solid var(--c-gold-700);
    outline-offset: -11px;
    box-shadow: 0 0 0 2px var(--c-outline), 0 18px 40px rgba(0, 0, 0, .55);
}

.sports-panel__media { order: -1; }

.sports-panel__media img {
    width: 100%;
    height: auto;
    aspect-ratio: 15 / 8;
    object-fit: cover;
    object-position: 60% center;
}

.sports-panel__shield {
    position: relative;
    z-index: 2;
    width: 140px;
    margin: -72px auto -10px;
    filter: drop-shadow(0 10px 16px rgba(0, 0, 0, .6));
}

.sports-panel__copy {
    position: relative;
    z-index: 1;
    padding: 1.25rem 1.4rem 1.9rem;
}

.sports-panel__copy p { color: var(--c-text); }

.sports-panel .terms-line { justify-content: flex-start; }

@media (min-width: 1024px) {
    .sports-panel {
        display: grid;
        grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
        min-height: 320px;
    }

    .sports-panel__media {
        order: 0;
        grid-column: 2;
        grid-row: 1;
    }

    .sports-panel__media img {
        height: 100%;
        aspect-ratio: auto;
    }

    .sports-panel__copy {
        grid-column: 1;
        grid-row: 1;
        align-self: center;
        padding: 2.25rem 150px 2.25rem 2.5rem;
    }

    .sports-panel__shield {
        position: absolute;
        left: 51.2%;
        top: -36px;
        width: 300px;
        height: calc(100% + 72px);
        margin: 0;
        object-fit: contain;
        transform: translateX(-50%);
    }
}

/* ---------- Games & providers band ---------- */
.ygg-band {
    position: relative;
    isolation: isolate;
    padding-block: clamp(3rem, 7vw, 4.75rem);
}

.ygg-band__bg {
    position: absolute;
    inset: 0;
    z-index: -2;
    background: var(--c-teal-900) url("./assets/b3f6abf3d73cee8d6cdedd870483d97f.webp") center / cover no-repeat;
}

.ygg-band::before,
.ygg-band::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: -1;
    width: 18%;
    pointer-events: none;
    background: radial-gradient(ellipse at center, rgba(127, 227, 255, .4), rgba(127, 227, 255, 0) 65%);
    opacity: .3;
}

.ygg-band::before { left: 0; }
.ygg-band::after { right: 0; }

@media (prefers-reduced-motion: no-preference) {
    .ygg-band::before,
    .ygg-band::after { animation: yggShimmer 6s ease-in-out infinite alternate; }
    .ygg-band::after { animation-delay: -3s; }
}

.ygg-band.is-paused::before,
.ygg-band.is-paused::after,
html.is-hidden .ygg-band::before,
html.is-hidden .ygg-band::after {
    animation-play-state: paused;
}

@keyframes yggShimmer {
    0% { opacity: .18; }
    100% { opacity: .7; }
}

.ygg-band__plate {
    max-width: 920px;
    margin-inline: auto;
    padding: 1.5rem 1rem;
    text-align: center;
    border-radius: 40px;
    background: radial-gradient(ellipse at center, rgba(6, 25, 27, .82), rgba(6, 25, 27, .6) 70%, rgba(6, 25, 27, .35));
}

.ygg-band__title { margin-bottom: .45em; }

.ygg-band__lead {
    max-width: 62ch;
    margin: 0 auto 1.25rem;
    color: var(--c-text);
}

.ygg-band .chip-list { justify-content: center; }

.ygg-band .carousel {
    margin-top: 1.75rem;
    text-align: left;
}

@media (min-width: 1024px) {
    .ygg-band__plate {
        max-width: min(920px, 74vw);
        padding: 1.75rem 1.5rem;
    }

    .ygg-band .carousel__track { grid-auto-columns: calc((100% - 2rem) / 3); }
}

/* ---------- VIP teaser ---------- */
.home-vip { padding-block: clamp(2rem, 5vw, 3rem); }

.vip-panel {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    max-width: 1060px;
    margin-inline: auto;
    background: linear-gradient(115deg, var(--c-crimson-700), var(--c-crimson-900) 70%);
    border: 5px double var(--c-gold-500);
    box-shadow: 0 0 0 2px var(--c-outline), var(--shadow-panel);
}

.vip-panel__stud {
    position: absolute;
    top: 50%;
    z-index: 2;
    width: 14px;
    height: 14px;
    background: linear-gradient(135deg, var(--c-gold-100), var(--c-gold-700));
    box-shadow: 0 0 0 2px var(--c-outline);
    transform: translate(-50%, -50%) rotate(45deg);
}

.vip-panel__stud--l { left: -3px; }
.vip-panel__stud--r { left: calc(100% + 3px); }

.vip-panel__copy { padding: 1.75rem 1.4rem; }

.vip-panel__copy > p:not(.home-small-note) { color: var(--c-text); }

.vip-panel__strip { display: none; }

.vip-panel__media img {
    width: 100%;
    height: auto;
    aspect-ratio: 12 / 7;
    object-fit: cover;
}

.vip-ladder {
    position: relative;
    margin: 1.5rem 0 .5rem;
}

.vip-ladder__line { display: none; }

.vip-ladder__list {
    position: relative;
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: .6rem;
}

.vip-ladder__list::before {
    content: "";
    position: absolute;
    left: 15px;
    top: 16px;
    bottom: 16px;
    width: 2px;
    background: linear-gradient(180deg, var(--c-bronze), var(--c-gold-100));
}

.vip-ladder__step {
    position: relative;
    display: flex;
    align-items: center;
    gap: .75rem;
}

.vip-ladder__node {
    position: relative;
    width: 32px;
    height: 32px;
    flex: none;
}

.vip-ladder__step:nth-child(1) .vip-ladder__node { color: #8a5a2b; }
.vip-ladder__step:nth-child(2) .vip-ladder__node { color: #a8792c; }
.vip-ladder__step:nth-child(3) .vip-ladder__node { color: #c99a45; filter: drop-shadow(0 0 3px rgba(226, 182, 90, .35)); }
.vip-ladder__step:nth-child(4) .vip-ladder__node { color: #e2b65a; filter: drop-shadow(0 0 5px rgba(226, 182, 90, .55)); }
.vip-ladder__step:nth-child(5) .vip-ladder__node { color: #fff0bd; filter: drop-shadow(0 0 8px rgba(243, 210, 122, .85)); }

.vip-ladder__name {
    font-family: var(--f-display);
    font-weight: 600;
    font-size: .95rem;
    line-height: 1.2;
    color: var(--c-text);
}

.vip-ladder__step:last-child .vip-ladder__name { color: var(--c-gold-100); }

@media (min-width: 640px) {
    .vip-ladder__line {
        display: block;
        position: absolute;
        left: 0;
        bottom: 2.6rem;
        width: 100%;
        height: 86px;
        filter: drop-shadow(0 0 4px rgba(226, 182, 90, .5));
    }

    .vip-ladder__list {
        grid-template-columns: repeat(5, minmax(0, 1fr));
        align-items: end;
        gap: .5rem;
    }

    .vip-ladder__list::before { display: none; }

    .vip-ladder__step {
        flex-direction: column;
        gap: .35rem;
        text-align: center;
        margin-bottom: calc((var(--n) - 1) * .85rem);
    }

    .vip-ladder__name {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        min-height: 2.25rem;
        font-size: .85rem;
    }

    .vip-ladder__step { margin-bottom: 0; padding-bottom: 0; }
    .vip-ladder__node { margin-bottom: calc((var(--n) - 1) * .85rem); order: -1; }
    .vip-ladder__name { order: 1; }
    .vip-ladder__step { flex-direction: column-reverse; }
}

@media (min-width: 1024px) {
    .vip-panel {
        grid-template-columns: minmax(0, 1.2fr) 44px minmax(0, 1fr);
    }

    .vip-panel__copy {
        padding: 2.25rem 2rem 2.25rem 2.5rem;
        align-self: center;
    }

    .vip-panel__strip {
        display: block;
        position: relative;
    }

    .vip-panel__strip-svg {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
    }

    .vip-panel__media img {
        height: 100%;
        aspect-ratio: auto;
        object-position: 40% center;
    }
}

/* ---------- Trust block ---------- */
.home-trust { padding-top: clamp(4.5rem, 9vw, 5.5rem); }

.trust-panel {
    position: relative;
    max-width: 1060px;
    margin-inline: auto;
    background: linear-gradient(180deg, #26353b, #141f24);
    border: 4px solid;
    border-color: #8a959a #4a5459 #3b4449 #6d787d;
    box-shadow: 0 0 0 2px var(--c-outline), 0 18px 40px rgba(0, 0, 0, .55);
}

.trust-panel__band {
    display: block;
    width: 100%;
    height: 22px;
}

.trust-panel__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.75rem;
    padding: 1.5rem 1.4rem 2rem;
}

.trust-panel__title {
    font-size: clamp(1.5rem, 3.4vw, 2.1rem);
    margin-bottom: .75rem;
}

.trust-col__title {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: 1.25rem;
}

.trust-col__title .icon { color: var(--c-ice-400); }

.trust-col p { color: var(--c-text-soft); }

.trust-list {
    list-style: none;
    margin: 0 0 1rem;
    padding: 0;
    display: grid;
    gap: .65rem;
}

.trust-list li {
    display: flex;
    align-items: flex-start;
    gap: .65rem;
    color: var(--c-text);
}

.trust-list .icon {
    color: var(--c-ice-400);
    margin-top: .1rem;
}

.trust-panel__emblem {
    position: relative;
    z-index: 2;
    order: -1;
    justify-self: center;
    width: 130px;
    margin-top: calc(-1.5rem - 22px - 3.25rem);
}

.trust-panel__emblem::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 22%;
    width: 70%;
    height: 20%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: radial-gradient(ellipse at center, rgba(127, 227, 255, .6), rgba(127, 227, 255, 0) 70%);
    filter: blur(6px);
}

.trust-panel__emblem img {
    position: relative;
    width: 100%;
    filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .6));
}

@media (min-width: 1024px) {
    .trust-panel__grid {
        grid-template-columns: minmax(0, 1fr) 220px minmax(0, 1fr);
        column-gap: 2rem;
        align-items: center;
        padding: 2rem 2.5rem;
    }

    .trust-panel__emblem {
        order: 0;
        grid-column: 2;
        grid-row: 1;
        align-self: stretch;
        width: auto;
        margin: calc(-2rem - 22px - 2.5rem) 0;
    }

    .trust-panel__emblem img {
        height: 100%;
        object-fit: contain;
    }
}

/* ---------- Homepage FAQ ---------- */
.home-faq__inner { max-width: 880px; }

.home-faq__more {
    margin: 1.25rem 0 0;
    text-align: center;
}

.home-faq__more .icon {
    width: 1.15rem;
    height: 1.15rem;
}

/* ============================================
   BONUSSER
   ============================================ */

.offer-summary {
    display: grid;
    margin: 1rem 0 1.25rem;
}

.offer-summary div {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
    padding: .55rem 0;
    border-bottom: 1px solid rgba(168, 121, 44, .45);
}

.offer-summary dt {
    color: var(--c-text-soft);
    font-size: .95rem;
}

.offer-summary dd {
    margin: 0;
    text-align: right;
    font-family: var(--f-display);
    font-weight: 700;
    color: var(--c-gold-100);
}

.bonus-hero__cta {
    display: flex;
    justify-content: center;
}

.bonus-section { padding-block: clamp(2.25rem, 5vw, 3.75rem); }

.bonus-prose {
    max-width: 72ch;
    margin: 0 auto 1.75rem;
    padding: 1.1rem 1.25rem;
    border-radius: var(--radius-m);
    background: rgba(7, 13, 16, .66);
}

.bonus-prose p { color: var(--c-text); }
.bonus-prose > :last-child { margin-bottom: 0; }

.bonus-steps {
    max-width: 860px;
    margin: 2.5rem auto 1.5rem;
}

.bonus-cta {
    display: grid;
    justify-items: center;
    text-align: center;
}

.bonus-tip {
    max-width: 72ch;
    margin: 0 auto;
    text-align: center;
    color: var(--c-text);
}

/* Calculation strip */
.calc-strip {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    margin: 0 0 1.5rem;
    padding: 0;
}

.calc-tile {
    display: grid;
    justify-items: center;
    min-width: 7.5rem;
    padding: .9rem 1rem;
    text-align: center;
    background: linear-gradient(180deg, var(--c-teal-800), var(--c-teal-950));
    border: 1px solid rgba(168, 121, 44, .6);
    border-radius: var(--radius-s);
    box-shadow: 0 8px 16px rgba(0, 0, 0, .4);
}

.calc-tile__value {
    font-family: var(--f-display);
    font-weight: 700;
    font-size: 1.6rem;
    line-height: 1.1;
    color: var(--c-gold-300);
}

.calc-tile__label {
    font-size: .875rem;
    color: var(--c-text-soft);
}

.calc-tile--result {
    border-color: var(--c-ice-400);
    box-shadow: var(--glow-ice), inset 0 0 18px rgba(127, 227, 255, .25);
}

.calc-tile--result .calc-tile__value { color: var(--c-gold-100); }

.calc-op {
    font-family: var(--f-display);
    font-weight: 700;
    font-size: 1.8rem;
    color: var(--c-gold-500);
}

/* Sports card */
.sports-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
    max-width: 880px;
    margin-inline: auto;
    padding: clamp(1.4rem, 3.5vw, 2.25rem);
    background: linear-gradient(135deg, #13253a, #0b1620 70%);
    border: 5px solid;
    border-color: #8a959a #4a5459 #3b4449 #6d787d;
    outline: 1px solid var(--c-gold-700);
    outline-offset: -11px;
    box-shadow: 0 0 0 2px var(--c-outline), 0 18px 40px rgba(0, 0, 0, .55);
}

.sports-card__icon {
    width: 72px;
    height: 72px;
    filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .6));
}

.sports-card__body p { color: var(--c-text); }
.sports-card .terms-line { justify-content: flex-start; }

@media (min-width: 640px) {
    .sports-card { grid-template-columns: 88px minmax(0, 1fr); }
}

/* Reload layout */
.reload-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 2rem;
    align-items: start;
}

.reload-art .framed-media__frame {
    box-shadow: 0 0 0 2px var(--c-outline), 0 0 34px rgba(232, 130, 58, .45), 0 16px 32px rgba(0, 0, 0, .5);
}

.reload-art img { aspect-ratio: 5 / 3; }

@media (min-width: 1024px) {
    .reload-layout { grid-template-columns: minmax(0, .8fr) minmax(0, 1.5fr); }
    .reload-art { position: sticky; top: calc(var(--header-bottom) + 1rem); }
    .reload-layout .data-table { font-size: .92rem; }
}

/* Blessing banner */
.blessing {
    position: relative;
    max-width: 880px;
    margin-inline: auto;
    padding: clamp(1.4rem, 3.5vw, 2rem) clamp(1.25rem, 4vw, 2.5rem);
    background: linear-gradient(115deg, var(--c-crimson-700), var(--c-crimson-900) 70%);
    border: 5px double var(--c-gold-500);
    box-shadow: 0 0 0 2px var(--c-outline), var(--shadow-panel);
}

.blessing h2 { font-size: clamp(1.4rem, 3.2vw, 1.9rem); }
.blessing p { color: var(--c-text); margin-bottom: 0; }

/* Cashback tiles */
.cashback-tiles {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
    gap: 1.25rem;
    max-width: 640px;
    margin: 0 auto 1.75rem;
}

/* ============================================
   SPIL
   ============================================ */

.page-hero__panel { min-width: 0; }

.spil-hero__chips { margin: 1.1rem 0 1.25rem; }

.spil-hero__cta {
    display: flex;
    margin-bottom: 1rem;
}

.spil-section { padding-block: clamp(2.25rem, 5vw, 3.75rem); }

.spil-section--band {
    background: rgba(7, 13, 16, .55);
    border-block: 1px solid rgba(168, 121, 44, .35);
}

.spil-head {
    max-width: 72ch;
    margin-bottom: 1.5rem;
}

.spil-head p { color: var(--c-text); }
.spil-head > :last-child { margin-bottom: 0; }
.spil-head--after { margin-top: 2rem; margin-bottom: 0; }

.spil-note {
    max-width: 72ch;
    margin: 1.5rem 0 0;
    color: var(--c-text);
}

.spil-cta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem 1.25rem;
    margin-top: 1.75rem;
}

.spil-stats {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    margin: 1.5rem 0 2rem;
}

@media (min-width: 640px) {
    .spil-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.spil-split {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(1.5rem, 4vw, 2.5rem);
    align-items: start;
}

.spil-copy p { color: var(--c-text); }

@media (min-width: 1024px) {
    .spil-split {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        align-items: center;
    }

    .spil-split--rev > :first-child { order: 2; }
}

.spil-media { padding: 12px 12px 0; }

.spil-media--std img { aspect-ratio: 10 / 7; }
.spil-media--wide img { aspect-ratio: 15 / 8; }

.spil-media .framed-media { margin-bottom: 1.5rem; }

.spil-media--live { max-width: 960px; margin-inline: auto; }

.mechanic-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 1rem;
}

.crash-minis {
    list-style: none;
    margin: 2.5rem 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
}

@media (min-width: 640px) {
    .crash-minis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.crash-mini {
    display: grid;
    justify-items: center;
    align-content: start;
    gap: .35rem;
    padding: 1.4rem 1.1rem 1.25rem;
    text-align: center;
    background: linear-gradient(180deg, var(--c-teal-800), var(--c-teal-950));
    border: 1px solid rgba(168, 121, 44, .6);
    border-top: 3px solid var(--c-gold-500);
    border-radius: var(--radius-s);
    box-shadow: 0 10px 22px rgba(0, 0, 0, .4);
}

.crash-mini__icon {
    width: 64px;
    height: 64px;
    filter: drop-shadow(0 0 6px rgba(127, 227, 255, .45));
}

.crash-mini__title { margin: 0; font-size: 1.3rem; }
.crash-mini p { margin: 0; color: var(--c-text-soft); }

.spil-copy .callout { margin-top: 1.25rem; }

.sports-panel--plain .sports-panel__copy { padding: 1.4rem 1.4rem 1.9rem; }
.sports-panel--plain .sports-panel__copy h2 { font-size: clamp(1.5rem, 3.4vw, 2.1rem); }

@media (min-width: 1024px) {
    .sports-panel--plain .sports-panel__copy { padding: 2.25rem 2.5rem; }
}

.spil-providers .chip-list { gap: .6rem; }

.spil-providers .chip {
    background: var(--c-slate-800);
    border-color: var(--c-gold-700);
    min-height: 40px;
}

@media (max-width: 479px) {
    .spil-providers .chip { white-space: normal; }
}

/* Wheel */
.wheel-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
    align-items: center;
}

.wheel-emblem {
    position: relative;
    width: min(100%, 300px);
    margin-inline: auto;
}

.wheel-emblem::before {
    content: "";
    position: absolute;
    inset: -12%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(127, 227, 255, .35), rgba(127, 227, 255, 0) 68%);
}

.wheel-emblem img {
    position: relative;
    width: 100%;
    height: auto;
    object-fit: contain;
}

@media (prefers-reduced-motion: no-preference) {
    .wheel-emblem img { animation: wheelSpin 60s linear infinite; }
}

@keyframes wheelSpin {
    to { transform: rotate(360deg); }
}

.wheel-copy { margin: 0; }

@media (min-width: 768px) {
    .wheel-layout { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 2.5rem; }
    .wheel-emblem { width: min(100%, 380px); }
}

/* ============================================
   OM OS
   ============================================ */

.about-hero__meta {
    display: grid;
    gap: .9rem;
    margin-top: 1.1rem;
}

.about-prose { max-width: 72ch; }

.about-prose + .spil-stats,
.about-prose + .table-wrap { margin-top: 1.5rem; }

.about-cards { margin-bottom: 1.5rem; }

.about-cards--two {
    max-width: 760px;
    margin-bottom: 0;
}

.about-answer {
    max-width: 72ch;
    margin-bottom: 1.5rem;
}

.about-facts {
    max-width: 820px;
    margin-top: 1.5rem;
    background: linear-gradient(180deg, #26353b, #141f24);
    border-color: #6d787d;
}

.about-facts .data-table tbody tr:nth-child(odd),
.about-facts .data-table tbody tr:nth-child(even) { background: transparent; }

.about-facts .data-table tbody tr {
    border-bottom: 1px solid rgba(226, 182, 90, .55);
}

.about-facts .data-table tbody tr:last-child { border-bottom: 0; }

.about-facts .data-table thead th { background: rgba(7, 13, 16, .6); }

.about-facts__head {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
}

.about-facts__head .icon {
    width: 1.3rem;
    height: 1.3rem;
    color: var(--c-ice-400);
}

.about-list {
    list-style: none;
    margin: 1rem 0 1.25rem;
    padding: 0;
    display: grid;
    gap: .7rem;
}

.about-list li {
    padding-left: 1.6rem;
    color: var(--c-text);
    background: var(--rune-bullet) no-repeat 0 .4rem / 10px 14px;
}

.about-faq { max-width: 880px; }

.about-planks {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
    gap: 1rem;
}

/* ============================================
   VIP
   ============================================ */

.vip-hero::after {
    background:
        linear-gradient(180deg, rgba(7, 13, 16, .3) 0%, rgba(7, 13, 16, 0) 20%, rgba(7, 13, 16, 0) 58%, rgba(51, 7, 12, .55) 84%, var(--c-slate-900) 100%);
}

.vip-hero .cta { margin-top: .25rem; }

.vip-section { padding-block: clamp(2.25rem, 5vw, 3.75rem); }

.vip-narrow { max-width: 880px; }

.vip-facts {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
}

/* Ascending path */
.vip-path {
    position: relative;
    margin: 1.5rem 0 0;
}

.vip-conduit {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
    pointer-events: none;
    filter: drop-shadow(0 0 5px rgba(127, 227, 255, .8)) drop-shadow(0 0 14px rgba(47, 179, 220, .45));
    -webkit-mask-image: linear-gradient(180deg, #000 calc(100% - 150px), transparent);
    mask-image: linear-gradient(180deg, #000 calc(100% - 150px), transparent);
}

.vip-conduit__d { display: none; }

.vip-drift {
    position: absolute;
    z-index: 0;
    left: 48px;
    top: calc(48px + var(--p) * (100% - 200px));
    width: 14px;
    height: 20px;
    transform: translate(-50%, -50%);
    fill: none;
    stroke: var(--c-ice-200);
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
    pointer-events: none;
    filter: drop-shadow(0 0 4px rgba(127, 227, 255, .95));
}

.vip-path__list {
    position: relative;
    z-index: 1;
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 1.75rem;
}

.vip-step {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
    --ring: #8a5a2b;
    --glow: 4px;
    --ring-glow: rgba(138, 90, 43, .45);
}

.vip-step:nth-child(2) { --ring: #a8792c; --glow: 8px; --ring-glow: rgba(168, 121, 44, .55); }
.vip-step:nth-child(3) { --ring: #c99a45; --glow: 12px; --ring-glow: rgba(201, 154, 69, .65); }
.vip-step:nth-child(4) { --ring: #e2b65a; --glow: 16px; --ring-glow: rgba(226, 182, 90, .8); }
.vip-step:nth-child(5) { --ring: #fff0bd; --glow: 24px; --ring-glow: rgba(243, 210, 122, .95); }

.vip-step__emblem {
    position: relative;
    display: grid;
    place-items: center;
    width: 96px;
    height: 96px;
}

.vip-step__emblem::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    border-radius: 50%;
    border: 3px solid var(--ring);
    background: radial-gradient(circle, #0c1a1d 55%, #06191b);
    box-shadow: 0 0 var(--glow) var(--ring-glow), inset 0 0 12px rgba(0, 0, 0, .6);
}

.vip-step__emblem img {
    position: relative;
    z-index: 1;
    width: 88%;
    height: 88%;
    object-fit: contain;
}

.vip-step__body {
    padding: .8rem 1rem;
    border-radius: var(--radius-m);
    background: rgba(7, 13, 16, .78);
}

.vip-step__body p { margin: 0; color: var(--c-text-soft); font-size: .98rem; }

.vip-step__body .vip-step__level {
    margin-bottom: .1rem;
    font-size: .85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--c-ice-200);
}

.vip-step__name {
    margin: 0 0 .3em;
    font-size: 1.2rem;
}

.vip-step:last-child .vip-step__name { color: var(--c-gold-300); }

@media (prefers-reduced-motion: no-preference) {
    .vip-drift {
        animation: vipDriftV 8s linear infinite;
        animation-delay: calc(var(--p) * -8s);
    }
}

@keyframes vipDriftV {
    0% { top: 48px; opacity: 0; }
    15% { opacity: 1; }
    85% { opacity: 1; }
    100% { top: calc(100% - 150px); opacity: 0; }
}

@keyframes vipDriftD {
    0% { left: 10%; top: 284px; opacity: 0; }
    15% { opacity: 1; }
    85% { opacity: 1; }
    100% { left: 90%; top: 60px; opacity: 0; }
}

@media (min-width: 1024px) {
    .vip-conduit {
        height: 344px;
        -webkit-mask-image: none;
        mask-image: none;
    }

    .vip-conduit__d { display: block; }
    .vip-conduit__v { display: none; }

    .vip-drift {
        left: calc(10% + var(--p) * 80%);
        top: calc(284px - var(--p) * 224px);
    }

    .vip-path__list {
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 0;
        align-items: start;
    }

    .vip-step {
        grid-template-columns: minmax(0, 1fr);
        justify-items: center;
        gap: .75rem;
        padding: calc((5 - var(--n)) * 56px) .5rem 0;
        text-align: center;
    }

    .vip-step__emblem { width: 120px; height: 120px; }

    .vip-step__body { width: 100%; }
}

@media (min-width: 1024px) and (prefers-reduced-motion: no-preference) {
    .vip-drift { animation-name: vipDriftD; }
}

/* Table swatches */
.vip-table .table-wrap {
    background: linear-gradient(180deg, #26353b, #141f24);
    border-color: #6d787d;
}

.swatch {
    display: inline-block;
    width: .8rem;
    height: .8rem;
    margin-right: .55rem;
    border-radius: 50%;
    vertical-align: -1px;
    box-shadow: 0 0 0 1px #000;
}

.swatch--1 { background: #8a5a2b; }
.swatch--2 { background: #e2b65a; }
.swatch--3 { background: linear-gradient(135deg, #2fb3dc, #8a5fd0); }
.swatch--4 { background: #9fdcff; }
.swatch--5 { background: #fff0bd; box-shadow: 0 0 0 1px #000, 0 0 8px rgba(243, 210, 122, .8); }

.vip-table .data-table tbody th { white-space: normal; }

.vip-narrow .callout + .spil-note { margin-top: 1.25rem; }
.vip-narrow .callout .age-badge { margin-top: .85rem; }

/* ============================================
   BETALINGER
   ============================================ */

.pay-facts {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
    gap: 1rem;
}

.pay-fact {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: .9rem;
    align-items: center;
    padding: 1rem 1.15rem;
    background: linear-gradient(135deg, #26353b, var(--c-teal-900));
    border: 1px solid #4c5d63;
    border-left: 3px solid var(--c-gold-500);
    border-radius: var(--radius-s);
    box-shadow: 0 8px 18px rgba(0, 0, 0, .4);
}

.pay-fact__icon {
    grid-row: 1 / span 2;
    display: grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 50%;
    color: var(--c-ice-400);
    border: 1px solid rgba(127, 227, 255, .5);
    background: rgba(6, 25, 27, .9);
}

.pay-fact__value {
    font-family: var(--f-display);
    font-weight: 700;
    font-size: 1.55rem;
    line-height: 1.1;
    color: var(--c-gold-300);
}

.pay-fact__label {
    font-size: .95rem;
    color: var(--c-text-soft);
}

.pay-table .table-wrap {
    border: 4px solid;
    border-color: #8a959a #4a5459 #3b4449 #6d787d;
    max-height: 520px;
}

.pay-table .data-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
}

.pay-flag {
    display: inline-block;
    padding: .1rem .7rem;
    border-radius: 999px;
    border: 1px solid var(--c-amber);
    background: #2a2618;
    color: #ffd48a;
    font-weight: 600;
    font-size: .9rem;
    white-space: nowrap;
}

.pay-flag--ok {
    border-color: var(--c-ice-400);
    background: #0c2628;
    color: var(--c-ice-200);
}

.pay-split {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
}

.pay-explain p { color: var(--c-text); }
.pay-explain > :last-child { margin-bottom: 0; }

.pay-methods {
    padding: 1.4rem;
    background: rgba(7, 13, 16, .72);
    border: 1px solid #4c5d63;
    border-radius: var(--radius-m);
}

.pay-methods .chip-list { margin-bottom: 1rem; }
.pay-methods .chip { white-space: normal; }

@media (min-width: 1024px) {
    .pay-split { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); }
}

.pay-vein {
    position: relative;
    margin: 1.5rem 0 2rem;
    padding: .5rem 0;
}

.pay-vein__svg {
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    height: 40px;
    transform: translateY(-50%);
    filter: drop-shadow(0 0 5px rgba(127, 227, 255, .8)) drop-shadow(0 0 14px rgba(47, 179, 220, .45));
}

.pay-vein__nodes {
    position: relative;
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .5rem;
    justify-items: center;
}

.pay-node {
    display: grid;
    place-items: center;
    align-content: center;
    width: clamp(82px, 26vw, 150px);
    aspect-ratio: 1;
    border-radius: 50%;
    border: 4px solid var(--c-gold-500);
    background: radial-gradient(circle, #0f2a2e, #06191b);
    box-shadow: 0 0 0 2px var(--c-outline), 0 0 16px rgba(127, 227, 255, .35), inset 0 0 14px rgba(0, 0, 0, .6);
    text-align: center;
}

.pay-node__amount {
    font-family: var(--f-display);
    font-weight: 700;
    font-size: clamp(1.05rem, 4vw, 1.65rem);
    line-height: 1.1;
    color: var(--c-gold-100);
}

.pay-node__label {
    font-size: clamp(.75rem, 2.4vw, .95rem);
    color: var(--c-text);
}

.pay-route { position: relative; }

.pay-route__end {
    display: flex;
    align-items: center;
    gap: .9rem;
    margin-top: 1.5rem;
    padding: .75rem 1rem;
    width: fit-content;
    max-width: 100%;
    border-radius: var(--radius-m);
    background: rgba(7, 13, 16, .72);
}

.pay-route__end p {
    margin: 0;
    color: var(--c-text);
    font-weight: 600;
}

.pay-route__shield {
    flex: none;
    filter: drop-shadow(0 0 8px rgba(243, 210, 122, .6));
}

@media (min-width: 1024px) {
    .pay-route__end { margin-inline: auto; }
}

.pay-loop {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
    align-items: center;
    gap: 0;
    margin: 1.5rem 0;
}

.pay-loop__box {
    width: 100%;
    max-width: 320px;
    padding: 1rem;
    text-align: center;
    color: var(--c-text);
    background: linear-gradient(180deg, #23333a, #121c22);
    border: 2px solid var(--c-gold-500);
    border-radius: var(--radius-s);
    box-shadow: 0 8px 18px rgba(0, 0, 0, .4);
}

.pay-loop__link {
    width: 120px;
    height: 40px;
    margin-block: 40px;
    transform: rotate(90deg);
    filter: drop-shadow(0 0 4px rgba(127, 227, 255, .6));
}

@media (min-width: 640px) {
    .pay-loop {
        grid-template-columns: minmax(0, 1fr) 120px minmax(0, 1fr);
        gap: .5rem;
    }

    .pay-loop__box { max-width: none; }

    .pay-loop__link {
        margin-block: 0;
        transform: none;
    }
}

.pay-shields {
    list-style: none;
    margin: 0 0 1.5rem;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
    gap: 1rem;
}

.pay-shield {
    display: grid;
    justify-items: center;
    align-content: start;
    gap: .35rem;
    padding: 1.4rem 1rem 2.2rem;
    text-align: center;
    background: linear-gradient(180deg, #23333a, #121c22);
    border: 2px solid var(--c-gold-700);
    border-radius: 12px 12px 50% 50% / 12px 12px 22% 22%;
    box-shadow: 0 10px 22px rgba(0, 0, 0, .4), inset 0 0 18px rgba(0, 0, 0, .35);
}

.pay-shield__icon {
    display: grid;
    place-items: center;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    color: var(--c-ice-400);
    border: 1px solid rgba(127, 227, 255, .5);
    background: rgba(6, 25, 27, .9);
}

.pay-shield h3 { margin: .25rem 0 0; font-size: 1.2rem; }
.pay-shield p { margin: 0; color: var(--c-text-soft); font-size: .95rem; }

.pay-compare {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    margin: 1.25rem 0 1.5rem;
}

.pay-compare__side {
    padding: 1.25rem;
    background: linear-gradient(180deg, var(--c-teal-800), var(--c-teal-950));
    border: 1px solid rgba(168, 121, 44, .6);
    border-top: 3px solid var(--c-gold-500);
    border-radius: var(--radius-s);
}

.pay-compare__side h3 { margin-bottom: .3em; }
.pay-compare__side p { margin: 0; color: var(--c-text-soft); }

.pay-compare__rune { display: none; }

@media (min-width: 768px) {
    .pay-compare { grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr); }

    .pay-compare__rune {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: .5rem;
    }

    .pay-compare__rune::before,
    .pay-compare__rune::after {
        content: "";
        flex: 1;
        width: 2px;
        background: linear-gradient(180deg, transparent, var(--c-gold-500));
    }

    .pay-compare__rune::after { transform: scaleY(-1); }
}

.pay-resp {
    display: grid;
    gap: .75rem;
    padding: 1.25rem 1.4rem;
    background: linear-gradient(180deg, #26353b, #18242a);
    border: 1px solid #4c5d63;
    border-left: 5px solid var(--c-slate-500);
    border-radius: var(--radius-s);
}

.pay-resp p { margin: 0; color: var(--c-text); }

.pay-links {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
}

@media (min-width: 768px) {
    .pay-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ============================================
   FAQ
   ============================================ */

.faq-hero { position: relative; }

.faq-hero .page-hero__panel {
    background: linear-gradient(180deg, rgba(10, 44, 48, .97), rgba(6, 25, 27, .98));
    box-shadow: 0 0 0 2px var(--c-outline), var(--shadow-panel), inset 0 0 38px rgba(127, 227, 255, .18);
}

.faq-hero__short {
    margin: 1.1rem 0 .6rem;
    font-weight: 600;
    color: var(--c-gold-100);
}

.faq-hero__branch { display: none; }

@media (min-width: 1024px) {
    .faq-hero__branch {
        display: block;
        position: absolute;
        z-index: 1;
        bottom: 9rem;
        left: calc(50% + min(50%, 590px) - var(--gutter) - 44rem);
        width: 8rem;
        height: auto;
        pointer-events: none;
        filter: drop-shadow(0 0 5px rgba(127, 227, 255, .6));
    }
}

/* Topic navigation */
.faq-topics { padding-block: clamp(1.75rem, 4vw, 2.75rem) 0; }

.faq-topics__title {
    margin-bottom: .75rem;
    font-size: clamp(1.3rem, 3vw, 1.7rem);
}

.faq-topics__list {
    list-style: none;
    display: flex;
    gap: .6rem;
    margin: 0;
    padding: .35rem .15rem .8rem;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scrollbar-width: thin;
    scrollbar-color: var(--c-gold-700) transparent;
}

.faq-topics__list li { flex: none; scroll-snap-align: start; }

.rune-plate {
    display: flex;
    align-items: center;
    gap: .55rem;
    min-height: 52px;
    padding: .55rem 1.1rem;
    font-family: var(--f-display);
    font-weight: 600;
    font-size: 1.02rem;
    line-height: 1.2;
    white-space: nowrap;
    text-decoration: none;
    color: var(--c-text);
    background: linear-gradient(180deg, #2a3b42, #18242a);
    border: 1px solid #4c5d63;
    border-top: 3px solid var(--c-slate-500);
    border-radius: var(--radius-s);
    box-shadow: 0 6px 14px rgba(0, 0, 0, .35);
    transition: border-color .2s ease, box-shadow .2s ease, color .2s ease;
}

.rune-plate__rune {
    flex: none;
    fill: none;
    stroke: var(--c-gold-500);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.rune-plate:hover,
.rune-plate.is-active {
    color: var(--c-ice-200);
    border-color: var(--c-ice-400);
    border-top-color: var(--c-ice-400);
    box-shadow: var(--glow-ice), inset 0 0 12px rgba(127, 227, 255, .22);
}

.rune-plate:hover .rune-plate__rune,
.rune-plate.is-active .rune-plate__rune { stroke: var(--c-ice-400); }

@media (min-width: 1024px) {
    .faq-topics__list { flex-wrap: wrap; overflow: visible; }
    .faq-topics__list li { flex: 1 1 auto; }
    .rune-plate { justify-content: center; }
}

/* Root system and groups */
.faq-main { padding-top: clamp(1.5rem, 4vw, 2.5rem); }

.faq-roots {
    --root-pad: 2rem;
    position: relative;
    padding-left: var(--root-pad);
    max-width: 980px;
    margin-inline: auto;
}

@media (min-width: 768px) {
    .faq-roots { --root-pad: 3.5rem; }
}

.faq-roots__trunk {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 0;
    width: var(--root-pad);
    height: 100%;
    pointer-events: none;
    filter: drop-shadow(0 0 4px rgba(127, 227, 255, .35));
}

.faq-group {
    position: relative;
    z-index: 1;
    overflow: visible;
}

.faq-group + .faq-group { margin-top: clamp(2.5rem, 6vw, 4rem); }

.faq-group__head { position: relative; }

.faq-branch {
    position: absolute;
    left: calc(-1 * var(--root-pad));
    top: 50%;
    width: var(--root-pad);
    height: 40px;
    transform: translateY(-50%);
    margin-top: -.9rem;
    overflow: visible;
    pointer-events: none;
}

.faq-group .rune-heading__title { font-size: clamp(1.35rem, 3.4vw, 2rem); }

.faq-group .rune-heading__band--end { max-width: 160px; }

.faq-group .faq-item__a {
    padding-top: .85rem;
    border-top: 1px solid rgba(168, 121, 44, .35);
    color: var(--c-text);
}

.faq-item__a ol,
.faq-item__a ul { margin: 0 0 1em; padding-left: 1.25rem; }

.faq-item__a li + li { margin-top: .35em; }

.faq-plate {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem 1.5rem;
    margin-top: 1.25rem;
    padding: 1.1rem 1.3rem;
    background: linear-gradient(180deg, #26353b, #141f24);
    border: 2px solid var(--c-ice-600);
    border-radius: var(--radius-s);
    box-shadow: 0 0 16px rgba(47, 179, 220, .2), 0 8px 18px rgba(0, 0, 0, .4);
}

.faq-plate .age-badge { font-size: 1.05rem; color: #fff; }
.faq-plate p { margin: 0; color: var(--c-text); flex: 1 1 240px; }

/* Related mosaic */
.faq-mosaic {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
}

.faq-tile { display: flex; }

.faq-tile__link {
    position: relative;
    display: block;
    width: 100%;
    padding: 1.6rem 1.4rem 1.4rem;
    color: var(--c-text-soft);
    text-decoration: none;
    background: linear-gradient(180deg, #1a2a33, #0f1a21);
    border: 4px solid;
    border-color: #8a959a #4a5459 #3b4449 #6d787d;
    outline: 1px solid var(--c-gold-700);
    outline-offset: -9px;
    box-shadow: 0 0 0 2px var(--c-outline), 0 12px 26px rgba(0, 0, 0, .45);
    transition: box-shadow .2s ease, transform .2s ease;
}

.faq-tile__link p { margin: 0; }

.faq-tile__title {
    margin-bottom: .4em;
    font-size: clamp(1.2rem, 2.4vw, 1.5rem);
    color: var(--c-gold-300);
    text-decoration: underline;
    text-decoration-color: rgba(243, 210, 122, .5);
    text-underline-offset: .2em;
}

.faq-tile__link:hover,
.faq-tile__link:focus-visible {
    transform: translateY(-3px);
    box-shadow: 0 0 0 2px var(--c-outline), 0 0 20px rgba(243, 210, 122, .35), 0 14px 28px rgba(0, 0, 0, .5);
}

.faq-tile .knot-corner { width: 30px; height: 30px; }

@media (min-width: 768px) {
    .faq-mosaic { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .faq-tile { grid-column: span 2; }
    .faq-tile--wide { grid-column: span 3; }
    .faq-tile--wide .faq-tile__link { padding: 2rem 1.9rem 1.8rem; }
}

@media (prefers-reduced-motion: reduce) {
    .faq-tile__link,
    .faq-tile__link:hover,
    .faq-tile__link:focus-visible,
    .rune-plate { transition: none; transform: none; }
}

/* Final panel */
.faq-final { padding-block: clamp(1.5rem, 4vw, 2.5rem) clamp(3rem, 7vw, 5rem); }

.faq-final__panel {
    position: relative;
    max-width: 880px;
    margin-inline: auto;
    padding: clamp(1.5rem, 4vw, 2.4rem) clamp(1.25rem, 4vw, 2.75rem);
    text-align: center;
    background: linear-gradient(115deg, var(--c-crimson-700), var(--c-crimson-900) 55%, var(--c-teal-900));
    border: 5px double var(--c-gold-500);
    box-shadow: 0 0 0 2px var(--c-outline), var(--shadow-panel);
}

.faq-final__title { font-size: clamp(1.5rem, 3.6vw, 2.2rem); }

.faq-final__panel > p {
    max-width: 62ch;
    margin: 0 auto 1.4rem;
    color: var(--c-text);
}

.faq-final .age-badge {
    margin-top: 1rem;
    justify-content: center;
}