/* ============================================
   PUBG SQUAD PAGE — Military Luxury Dark Theme
   Accent: #F5A623 (Amber Gold)
   Birthday: #FFD700 (Pure Gold)
   ============================================ */

:root {
    --pubg-bg: #0A0A0A;
    --pubg-amber: #F5A623;
    --pubg-amber-dim: rgba(245,166,35,0.12);
    --pubg-gold: #FFD700;
    --pubg-gold-dim: rgba(255,215,0,0.1);
    --pubg-text: #ffffff;
    --pubg-text-sec: rgba(255,255,255,0.6);
    --pubg-text-muted: rgba(255,255,255,0.35);
    --pubg-glass: rgba(255,255,255,0.03);
    --pubg-glass-border: 1px solid rgba(255,255,255,0.06);
    --pubg-font: 'Syne', sans-serif;
    --pubg-font-hud: 'Rajdhani', sans-serif;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; }
body {
    font-family: var(--pubg-font);
    background: var(--pubg-bg);
    color: var(--pubg-text);
    line-height:1.6;
    overflow-x:hidden;
    -webkit-font-smoothing:antialiased;
}
a { color:inherit; text-decoration:none; }

.section__container { max-width:1200px; margin:0 auto; width:100%; padding:0 2rem; }

/* === Cursor Glow === */
.cursor-glow {
    position:fixed; width:400px; height:400px; border-radius:50%;
    background:radial-gradient(circle, rgba(245,166,35,0.06) 0%, transparent 70%);
    opacity:0.5; pointer-events:none; transform:translate(-50%,-50%); z-index:0;
    transition:opacity 0.4s;
}

/* === Nav === */
.pubg-nav {
    position:fixed; top:0; left:0; right:0; z-index:100;
    display:flex; align-items:center; justify-content:center; gap:1rem;
    padding:1.5rem 2rem;
    background:linear-gradient(180deg, rgba(10,10,10,0.9) 0%, transparent 100%);
}
.pubg-nav__link {
    font-size:0.8rem; font-weight:500; letter-spacing:0.15em; text-transform:uppercase;
    color:var(--pubg-text-sec); transition:color 0.3s;
}
.pubg-nav__link:hover { color:var(--pubg-amber); }
.pubg-nav__divider { color:var(--pubg-text-muted); font-size:0.7rem; }

/* === Shared Elements === */
.pubg-label {
    display:inline-flex; align-items:center; gap:8px;
    font-size:0.7rem; font-weight:600; letter-spacing:0.3em; text-transform:uppercase;
    color:var(--pubg-amber); margin-bottom:1rem;
}
.pubg-label::before {
    content:''; display:inline-block; width:24px; height:1px; background:var(--pubg-amber);
}
.pubg-heading {
    font-weight:700; font-size:clamp(2rem,5vw,3.5rem); letter-spacing:-0.03em;
    line-height:1.05; color:var(--pubg-text); margin-bottom:1.5rem;
}

/* Dividers */
.pubg-divider {
    display:flex; align-items:center; justify-content:center; gap:20px;
    padding:3rem 2rem;
    opacity:0; transform:translateY(15px);
    transition:opacity 0.8s cubic-bezier(0.16,1,0.3,1), transform 0.8s cubic-bezier(0.16,1,0.3,1);
}
.pubg-divider.revealed { opacity:1; transform:translateY(0); }
.pubg-divider__line {
    height:1px; flex:1; max-width:200px;
    background:linear-gradient(90deg, transparent, rgba(245,166,35,0.3), transparent);
    transform:scaleX(0); transition:transform 1.2s cubic-bezier(0.16,1,0.3,1) 0.3s;
}
.pubg-divider.revealed .pubg-divider__line { transform:scaleX(1); }
.pubg-divider__label {
    font-family:var(--pubg-font-hud); font-size:0.65rem; letter-spacing:0.15em;
    color:var(--pubg-amber); opacity:0.6; padding:6px 16px;
    border:1px solid rgba(245,166,35,0.15); border-radius:20px;
}
.pubg-divider.revealed .pubg-divider__label { opacity:1; }
.pubg-divider__line--gold { background:linear-gradient(90deg, transparent, rgba(255,215,0,0.4), transparent); }
.pubg-divider__label--gold { color:var(--pubg-gold); border-color:rgba(255,215,0,0.25); font-size:0.6rem; }

/* Reveal */
[data-reveal] {
    opacity:0; transform:translateY(30px);
    transition:opacity 0.8s cubic-bezier(0.16,1,0.3,1), transform 0.8s cubic-bezier(0.16,1,0.3,1);
}
[data-reveal].revealed { opacity:1; transform:translateY(0); }

/* ═══════════════════════════════════════
   HERO SECTION
   ═══════════════════════════════════════ */
.pubg-hero {
    position:relative; min-height:100vh; display:flex; align-items:center;
    justify-content:center; overflow:hidden;
}
.pubg-hero__bg { position:absolute; inset:0; z-index:0; }
.pubg-hero__bg-img {
    width:100%; height:100%; object-fit:cover; filter:brightness(0.35) saturate(0.8);
}
.pubg-hero__overlay {
    position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(10,10,10,0.4) 0%, rgba(10,10,10,0.2) 40%, rgba(10,10,10,0.8) 80%, #0A0A0A 100%);
}
.pubg-hero__particles { position:absolute; inset:0; z-index:1; pointer-events:none; }
.pubg-hero__content { position:relative; z-index:2; text-align:center; }
.pubg-hero__tag {
    display:inline-flex; align-items:center; gap:6px;
    font-family:var(--pubg-font-hud); font-size:0.85rem; font-weight:500;
    letter-spacing:0.4em; text-transform:uppercase; color:var(--pubg-amber);
    margin-bottom:1rem;
}
.pubg-hero__title {
    font-size:clamp(4rem,14vw,10rem); font-weight:800; letter-spacing:0.2em;
    background:linear-gradient(180deg, #fff 0%, rgba(255,255,255,0.5) 100%);
    -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
    line-height:0.95;
}
.pubg-hero__sub {
    font-family:var(--pubg-font-hud); font-size:1.1rem; font-weight:300;
    letter-spacing:0.15em; color:var(--pubg-text-sec); margin-top:1rem;
}
.pubg-hero__scroll {
    position:absolute; bottom:-40vh; left:50%; transform:translateX(-50%);
    display:flex; flex-direction:column; align-items:center; gap:0.5rem;
    font-size:0.7rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--pubg-text-muted);
}
.pubg-hero__scroll-line {
    width:1px; height:50px;
    background:linear-gradient(to bottom, var(--pubg-text-muted), transparent);
    animation:scrollPulse 2s ease-in-out infinite;
}
@keyframes scrollPulse { 0%,100%{opacity:1;transform:scaleY(1)} 50%{opacity:0.4;transform:scaleY(0.7)} }

/* ═══════════════════════════════════════
   SQUAD SHOWCASE
   ═══════════════════════════════════════ */
.squad-showcase { position:relative; padding:4rem 0 0; }
.squad-showcase__ambient {
    position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
    width:800px; height:600px; border-radius:50%;
    background:radial-gradient(circle, rgba(245,166,35,0.04) 0%, transparent 70%);
    pointer-events:none;
}
.squad-showcase__header { text-align:center; margin-bottom:3rem; }

/* Full-width cinematic frame */
.squad-cinematic {
    position:relative; width:100%; margin:0 0 3rem;
    overflow:hidden;
}
.squad-cinematic__img-wrap {
    position:relative; width:100%;
    aspect-ratio:21/9;
}
.squad-cinematic__img {
    display:block; width:100%; height:100%; object-fit:cover; object-position:center 50%;
    filter:brightness(0.65) contrast(1.15) saturate(0.9);
    transition:transform 8s ease-out;
}
.squad-cinematic:hover .squad-cinematic__img {
    transform:scale(1.03);
}
.squad-cinematic__vignette {
    position:absolute; inset:0; pointer-events:none;
    background:
        linear-gradient(180deg, #0A0A0A 0%, rgba(10,10,10,0.2) 20%, rgba(10,10,10,0.2) 70%, #0A0A0A 100%),
        linear-gradient(90deg, #0A0A0A 0%, transparent 15%, transparent 85%, #0A0A0A 100%);
}
.squad-cinematic__scanline {
    position:absolute; top:0; left:0; right:0; height:2px; z-index:3;
    background:linear-gradient(90deg, transparent, rgba(245,166,35,0.5), transparent);
    animation:scanline 5s linear infinite; pointer-events:none;
}
.squad-cinematic__overlay-text {
    position:absolute; bottom:2.5rem; left:0; right:0;
    text-align:center; z-index:5; pointer-events:none;
}
.squad-cinematic__tagline {
    font-family:var(--pubg-font-hud); font-size:clamp(1rem, 2.5vw, 1.6rem);
    font-weight:600; letter-spacing:0.3em; text-transform:uppercase;
    color:#fff;
    text-shadow:0 0 40px rgba(245,166,35,0.8), 0 2px 20px rgba(0,0,0,0.9);
    opacity:0; animation:taglineReveal 1.5s ease 0.8s forwards;
}
@keyframes taglineReveal {
    0% { opacity:0; transform:translateY(12px); letter-spacing:0.5em; }
    100% { opacity:1; transform:translateY(0); letter-spacing:0.3em; }
}



.squad-frame {
    position:relative; max-width:900px; margin:0 auto 3rem;
    border-radius:12px; overflow:hidden;
    perspective:1200px;
    transform-style:preserve-3d;
}
.squad-frame__glow {
    position:absolute; top:-40%; left:-20%; width:60%; height:180%;
    background:radial-gradient(ellipse, rgba(245,166,35,0.08) 0%, transparent 70%);
    pointer-events:none; z-index:0;
}
.squad-frame__glow--right {
    left:auto; right:-20%;
    background:radial-gradient(ellipse, rgba(255,215,0,0.05) 0%, transparent 70%);
}
.squad-frame__img {
    display:block; width:100%; height:auto; position:relative; z-index:1;
    transition:transform 0.4s ease-out, filter 0.4s ease;
    filter:contrast(1.2) brightness(1.15) saturate(1.2);
    animation:squadFloat 6s ease-in-out infinite;
    transform-origin: center center;
}
@keyframes squadFloat {
    0%,100%{transform:translateY(0) scale(1)} 50%{transform:translateY(-8px) scale(1.01)}
}
.squad-frame:hover .squad-frame__img {
    filter:contrast(1.25) brightness(1.2) saturate(1.3) drop-shadow(0 0 40px rgba(245,166,35,0.25));
    transition:transform 0.1s ease-out, filter 0.4s ease;
}
.squad-frame__overlay {
    position:absolute; inset:0; z-index:2; pointer-events:none;
    background:linear-gradient(180deg, transparent 60%, rgba(10,10,10,0.6) 100%),
               linear-gradient(90deg, rgba(10,10,10,0.3) 0%, transparent 15%, transparent 85%, rgba(10,10,10,0.3) 100%);
}
.squad-frame__scanline {
    position:absolute; top:0; left:0; right:0; height:2px; z-index:3;
    background:linear-gradient(90deg, transparent, rgba(245,166,35,0.4), transparent);
    animation:scanline 4s linear infinite; pointer-events:none;
}
@keyframes scanline { 0%{top:0} 100%{top:100%} }

.squad-frame__embers {
    position:absolute; inset:0; z-index:4; pointer-events:none;
    background:radial-gradient(circle at 50% 100%, rgba(245,166,35,0.15) 0%, transparent 60%);
    mix-blend-mode: screen;
}

.squad-frame__glare {
    position:absolute; top:0; left:0; width:150%; height:150%; z-index:5; pointer-events:none;
    background: radial-gradient(circle at center, rgba(255,255,255,0.15) 0%, transparent 50%);
    opacity: 0;
    transition: opacity 0.3s ease;
    mix-blend-mode: overlay;
    transform: translate(-50%, -50%);
}
.squad-frame:hover .squad-frame__glare {
    opacity: 1;
}

.squad-frame__border {
    position:absolute; inset:0; z-index:6; pointer-events:none;
    border:1px solid rgba(245,166,35,0.15); border-radius:12px;
}

/* Squad Names */
.squad-names {
    display:flex; justify-content:center; gap:2rem; flex-wrap:wrap;
    text-align:center;
}
.squad-name {
    display:flex; flex-direction:column; gap:2px;
    padding:0.75rem 1.25rem;
    background:var(--pubg-glass); border:var(--pubg-glass-border); border-radius:8px;
    transition:border-color 0.3s, background 0.3s;
}
.squad-name:hover { border-color:rgba(245,166,35,0.2); background:rgba(255,255,255,0.05); }
.squad-name__ign {
    font-family:var(--pubg-font-hud); font-size:0.85rem; font-weight:600;
    letter-spacing:0.1em; color:var(--pubg-amber);
}
.squad-name__real { font-size:0.7rem; color:var(--pubg-text-muted); letter-spacing:0.05em; }
.squad-name--me { border-color:rgba(245,166,35,0.2); }
.squad-name--me .squad-name__ign { color:#fff; }
.squad-name--birthday {
    border-color:rgba(255,215,0,0.25);
    background:rgba(255,215,0,0.04);
    animation:birthdayPulse 3s ease-in-out infinite;
}
.squad-name--birthday .squad-name__ign { color:var(--pubg-gold); }
@keyframes birthdayPulse {
    0%,100%{box-shadow:0 0 0 0 rgba(255,215,0,0)} 50%{box-shadow:0 0 20px 2px rgba(255,215,0,0.08)}
}

/* ═══════════════════════════════════════
   BIRTHDAY SECTION
   ═══════════════════════════════════════ */
.birthday-section { position:relative; padding:4rem 0 6rem; overflow:hidden; }
.birthday-ambient {
    position:absolute; top:30%; left:50%; transform:translate(-50%,-50%);
    width:600px; height:600px; border-radius:50%;
    background:radial-gradient(circle, rgba(255,215,0,0.05) 0%, transparent 70%);
    pointer-events:none;
}
.birthday-confetti { position:absolute; inset:0; pointer-events:none; z-index:1; overflow:hidden; }

.birthday-card {
    position:relative; z-index:2; max-width:600px; margin:0 auto;
    background:linear-gradient(135deg, rgba(255,215,0,0.04) 0%, rgba(10,10,10,0.9) 50%, rgba(245,166,35,0.03) 100%);
    border:1px solid rgba(255,215,0,0.15); border-radius:16px;
    padding:3.5rem 2.5rem; text-align:center; overflow:hidden;
}
.birthday-card__shimmer {
    position:absolute; inset:0;
    background:linear-gradient(105deg, transparent 40%, rgba(255,215,0,0.05) 50%, transparent 60%);
    background-size:200% 100%;
    animation:bdShimmer 4s ease-in-out infinite;
}
@keyframes bdShimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }

.birthday-card__spark {
    position:absolute; width:4px; height:4px; border-radius:50%;
    background:var(--pubg-gold); animation:sparkle 3s ease-in-out infinite;
}
.birthday-card__spark--1 { top:15%; left:10%; animation-delay:0s; }
.birthday-card__spark--2 { top:25%; right:15%; animation-delay:0.7s; }
.birthday-card__spark--3 { bottom:20%; left:20%; animation-delay:1.4s; }
.birthday-card__spark--4 { bottom:15%; right:10%; animation-delay:2.1s; }
@keyframes sparkle {
    0%,100%{opacity:0;transform:scale(0)} 50%{opacity:0.8;transform:scale(1.5)}
}

.birthday-card__content { position:relative; z-index:2; }
.birthday-card__date {
    font-family:var(--pubg-font-hud); font-size:0.7rem; letter-spacing:0.3em;
    color:var(--pubg-gold); opacity:0.7;
}
.birthday-card__title {
    font-size:clamp(2.5rem,6vw,3.5rem); font-weight:800; letter-spacing:-0.02em;
    background:linear-gradient(180deg, #FFD700 0%, #F5A623 50%, #FFD700 100%);
    background-size:100% 200%; animation:goldGradient 3s ease infinite;
    -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
    margin:0.5rem 0;
}
@keyframes goldGradient { 0%,100%{background-position:0 0} 50%{background-position:0 100%} }

.birthday-card__name {
    font-family:var(--pubg-font-hud); font-size:2rem; font-weight:700;
    letter-spacing:0.1em; color:#fff; margin-bottom:0.25rem;
}
.birthday-card__name .dim { opacity:0.4; }
.birthday-card__real {
    font-size:0.9rem; color:var(--pubg-text-sec); letter-spacing:0.05em; font-weight:300;
}

.birthday-card__ornament {
    display:flex; align-items:center; justify-content:center; gap:12px;
    margin:1.5rem 0;
}
.birthday-card__ornament-line { flex:1; max-width:80px; height:1px; background:rgba(255,215,0,0.2); }
.birthday-card__ornament-icon { display:inline-flex; }

.birthday-card__msg {
    font-size:0.95rem; color:var(--pubg-text-sec); line-height:1.8;
    font-weight:300; max-width:440px; margin:0 auto;
}
.birthday-card__sign {
    margin-top:1.5rem; font-family:var(--pubg-font-hud); font-size:0.75rem;
    letter-spacing:0.15em; color:var(--pubg-amber); opacity:0.7;
}

/* ═══════════════════════════════════════
   ROSTER SECTION
   ═══════════════════════════════════════ */
.roster-section { padding:4rem 0 6rem; }
.roster-header { text-align:center; margin-bottom:3rem; }
.roster-grid {
    display:grid; grid-template-columns:repeat(auto-fit, minmax(220px,1fr));
    gap:1.5rem;
}
.roster-card {
    position:relative; background:var(--pubg-glass);
    border:var(--pubg-glass-border); border-radius:12px;
    padding:2rem 1.5rem; text-align:center;
    transition:border-color 0.3s, transform 0.3s, background 0.3s;
}
.roster-card:hover {
    border-color:rgba(245,166,35,0.2); transform:translateY(-4px);
    background:rgba(255,255,255,0.05);
}
.roster-card__glow {
    position:absolute; top:0; left:50%; transform:translateX(-50%);
    width:120px; height:120px; border-radius:50%;
    background:radial-gradient(circle, rgba(245,166,35,0.06) 0%, transparent 70%);
    pointer-events:none;
}
.roster-card__glow--gold {
    background:radial-gradient(circle, rgba(255,215,0,0.08) 0%, transparent 70%);
}
.roster-card__icon { margin-bottom:1rem; }
.roster-card__role {
    font-family:var(--pubg-font-hud); font-size:0.6rem; font-weight:600;
    letter-spacing:0.2em; text-transform:uppercase; color:var(--pubg-amber);
    display:block; margin-bottom:0.75rem;
}
.roster-card__ign {
    font-family:var(--pubg-font-hud); font-size:1.25rem; font-weight:700;
    letter-spacing:0.05em; color:#fff; margin-bottom:0.25rem;
}
.roster-card__name { font-size:0.75rem; color:var(--pubg-text-muted); margin-bottom:0.75rem; }
.roster-card__desc { font-size:0.8rem; color:var(--pubg-text-sec); line-height:1.6; font-weight:300; }

/* IGL card */
.roster-card--igl { border-color:rgba(245,166,35,0.15); }
.roster-card--igl .roster-card__ign { color:var(--pubg-amber); }

/* Birthday card */
.roster-card--birthday {
    border-color:rgba(255,215,0,0.2);
    background:rgba(255,215,0,0.03);
}
.roster-card--birthday .roster-card__role { color:var(--pubg-gold); }
.roster-card--birthday .roster-card__ign { color:var(--pubg-gold); }
.roster-card__birthday-badge {
    position:absolute; top:12px; right:12px;
    display:inline-flex; align-items:center; gap:4px;
    font-family:var(--pubg-font-hud); font-size:0.55rem; font-weight:600;
    letter-spacing:0.15em; color:var(--pubg-gold);
    padding:3px 8px; border:1px solid rgba(255,215,0,0.2); border-radius:20px;
    background:rgba(255,215,0,0.05);
}

/* Extended roster header */
.roster-extended-header {
    text-align:center; margin:3rem 0 2rem; padding-top:2rem;
    border-top:1px solid rgba(245,166,35,0.06);
}
.roster-extended-sub {
    font-size:0.85rem; color:var(--pubg-text-muted); font-weight:300;
    letter-spacing:0.03em; margin-top:-0.5rem;
}
.roster-grid--extended { margin-top:0; }

/* OG Leader card */
.roster-card--og { border-color:rgba(245,166,35,0.2); }
.roster-card--og .roster-card__ign { color:var(--pubg-amber); }
.roster-card__og-badge {
    position:absolute; top:12px; right:12px;
    font-family:var(--pubg-font-hud); font-size:0.55rem; font-weight:600;
    letter-spacing:0.15em; color:var(--pubg-amber);
    padding:3px 8px; border:1px solid rgba(245,166,35,0.2); border-radius:20px;
    background:rgba(245,166,35,0.05);
}

/* Inactive / MIA cards */
.roster-card--inactive { opacity:0.65; }
.roster-card--inactive:hover { opacity:0.85; }
.roster-card__status {
    position:absolute; top:12px; right:12px;
    font-family:var(--pubg-font-hud); font-size:0.5rem; font-weight:600;
    letter-spacing:0.12em; color:var(--pubg-text-muted);
    padding:3px 8px; border:1px solid rgba(255,255,255,0.08); border-radius:20px;
    background:rgba(255,255,255,0.03);
}

/* Locked / Coming Soon cards */
.roster-card--locked {
    opacity:0.4;
    pointer-events:none;
    filter:grayscale(0.5);
}
.roster-card--locked:hover {
    transform:none;
    border-color:rgba(255,255,255,0.06);
    background:var(--pubg-glass);
}
.roster-card__locked-badge {
    position:absolute; top:12px; right:12px;
    display:inline-flex; align-items:center; gap:5px;
    font-family:var(--pubg-font-hud); font-size:0.55rem; font-weight:600;
    letter-spacing:0.15em; text-transform:uppercase;
    color:rgba(255,255,255,0.5);
    padding:3px 10px; border:1px solid rgba(255,255,255,0.1); border-radius:20px;
    background:rgba(255,255,255,0.04);
}

/* Clickable roster card (link wrapper) */
a.roster-card { text-decoration:none; color:inherit; display:block; }
a.roster-card:hover {
    border-color:rgba(255,215,0,0.3);
    transform:translateY(-4px);
    background:rgba(255,215,0,0.04);
}

/* ═══════════════════════════════════════
   STORY SECTION
   ═══════════════════════════════════════ */
.story-section { position:relative; padding:4rem 0 6rem; }
.story-section__ambient {
    position:absolute; bottom:0; left:50%; transform:translateX(-50%);
    width:800px; height:400px; border-radius:50%;
    background:radial-gradient(circle, rgba(245,166,35,0.03) 0%, transparent 70%);
    pointer-events:none;
}
.story-block { max-width:700px; margin:0 auto 3rem; text-align:center; }
.story-block__text {
    font-size:1.05rem; color:var(--pubg-text-sec); line-height:1.9;
    font-weight:300; margin-bottom:1.5rem;
}
.story-block__text--accent {
    color:var(--pubg-amber); font-weight:400; font-style:italic; font-size:1.1rem;
}

.story-stats {
    display:flex; align-items:center; justify-content:center; gap:2.5rem; flex-wrap:wrap;
    padding:2rem 2.5rem;
    background:var(--pubg-glass); border:var(--pubg-glass-border); border-radius:16px;
    max-width:700px; margin:0 auto;
}
.story-stat { display:flex; flex-direction:column; align-items:center; gap:6px; }
.story-stat__value {
    font-size:clamp(2rem,4vw,2.5rem); font-weight:800; letter-spacing:-0.02em;
    background:linear-gradient(180deg, #fff 0%, rgba(255,255,255,0.5) 100%);
    -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.story-stat__label {
    font-family:var(--pubg-font-hud); font-size:0.6rem; font-weight:600;
    letter-spacing:0.15em; text-transform:uppercase; color:var(--pubg-text-muted);
}
.story-stat__divider { width:1px; height:40px; background:rgba(255,255,255,0.06); }

/* ═══════════════════════════════════════
   END NAV
   ═══════════════════════════════════════ */
.pubg-endnav {
    padding:6rem 2rem; text-align:center;
    border-top:1px solid rgba(245,166,35,0.06);
}
.pubg-endnav__label {
    font-family:var(--pubg-font-hud); font-size:0.7rem; font-weight:500;
    letter-spacing:0.3em; color:var(--pubg-amber); opacity:0.5; margin-bottom:2rem;
}
.pubg-endnav__links { display:flex; align-items:center; justify-content:center; gap:1.5rem; }
.pubg-endnav__link {
    display:inline-flex; align-items:center; gap:8px;
    font-size:0.85rem; font-weight:500; letter-spacing:0.1em;
    color:var(--pubg-text-sec); transition:color 0.3s;
}
.pubg-endnav__link:hover { color:var(--pubg-amber); }
.pubg-endnav__dot { color:var(--pubg-text-muted); }


/* ═══════════════════════════════════════
   BIRTHDAY TEASER BANNER
   ═══════════════════════════════════════ */
.bday-teaser-section { padding:3rem 0; }
.bday-teaser {
    display:flex; align-items:center; justify-content:space-between;
    position:relative; overflow:hidden;
    background:linear-gradient(135deg, rgba(30,24,10,0.95) 0%, rgba(18,14,5,0.98) 100%);
    border:1px solid rgba(255,215,0,0.25);
    border-radius:16px;
    padding:2rem 2.5rem;
    text-decoration:none; color:inherit;
    cursor:pointer;
    transition:border-color 0.3s, transform 0.3s, box-shadow 0.3s;
    box-shadow:0 0 40px rgba(255,215,0,0.04), 0 8px 32px rgba(0,0,0,0.4);
    gap:2rem;
}
.bday-teaser:hover {
    border-color:rgba(255,215,0,0.55);
    transform:translateY(-2px);
    box-shadow:0 0 60px rgba(255,215,0,0.12), 0 16px 48px rgba(0,0,0,0.5);
}
.bday-teaser__pulse {
    position:absolute; inset:0; border-radius:16px; pointer-events:none;
    background:radial-gradient(ellipse at left center, rgba(255,215,0,0.06) 0%, transparent 60%);
    animation:bday-breathe 3s ease-in-out infinite;
}
@keyframes bday-breathe {
    0%,100%{ opacity:0.7; } 50%{ opacity:1.3; }
}
.bday-teaser__glow {
    position:absolute; left:-20px; top:50%; transform:translateY(-50%);
    width:200px; height:200px; border-radius:50%; pointer-events:none;
    background:radial-gradient(circle, rgba(255,215,0,0.1) 0%, transparent 70%);
    filter:blur(20px);
}
.bday-teaser__left { flex:1; position:relative; z-index:1; }
.bday-teaser__badge {
    display:inline-flex; align-items:center; gap:6px;
    background:rgba(255,215,0,0.1); border:1px solid rgba(255,215,0,0.3);
    border-radius:50px; padding:4px 12px;
    font-family:var(--pubg-font-hud); font-size:0.75rem; font-weight:600;
    letter-spacing:0.15em; text-transform:uppercase; color:rgba(255,215,0,0.9);
    margin-bottom:0.75rem;
}
.bday-teaser__title {
    font-family:var(--pubg-font); font-size:1.7rem; font-weight:700;
    color:#fff; margin-bottom:0.4rem; line-height:1.2;
}
.bday-teaser__title span { color:var(--pubg-gold); }
.bday-teaser__sub {
    font-family:var(--pubg-font-hud); font-size:0.9rem;
    color:rgba(255,255,255,0.45); letter-spacing:0.02em;
}
.bday-teaser__right {
    position:relative; z-index:1; flex-shrink:0;
    display:flex; flex-direction:column; align-items:center; gap:1rem;
}
.bday-teaser__cta {
    display:flex; align-items:center; gap:8px;
    background:rgba(255,215,0,0.12); border:1px solid rgba(255,215,0,0.4);
    border-radius:50px; padding:12px 24px;
    font-family:var(--pubg-font-hud); font-size:0.9rem; font-weight:600;
    letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,215,0,0.95);
    transition:background 0.3s, border-color 0.3s;
}
.bday-teaser:hover .bday-teaser__cta {
    background:rgba(255,215,0,0.2);
    border-color:rgba(255,215,0,0.7);
}
.bday-teaser__sparks { position:relative; width:80px; height:60px; }
.bday-spark {
    position:absolute; border-radius:50%;
    background:rgba(255,215,0,0.8);
    animation:spark-float 2s ease-in-out infinite;
    box-shadow:0 0 4px rgba(255,215,0,0.5);
}
.bday-spark--1 { width:4px; height:4px; top:0;    left:50%; animation-delay:0s;    animation-duration:2.0s; }
.bday-spark--2 { width:3px; height:3px; top:50%;  left:20%; animation-delay:0.5s;  animation-duration:2.4s; }
.bday-spark--3 { width:5px; height:5px; top:20%;  right:10%; animation-delay:1s;   animation-duration:1.8s; }
.bday-spark--4 { width:3px; height:3px; bottom:0; left:60%; animation-delay:1.5s;  animation-duration:2.2s; }
.bday-spark--5 { width:2px; height:2px; top:30%;  right:30%; animation-delay:0.3s; animation-duration:2.6s; }
.bday-spark--6 { width:4px; height:4px; bottom:15%; left:10%; animation-delay:0.8s; animation-duration:1.9s; }
.bday-spark--7 { width:3px; height:3px; top:10%;  left:40%; animation-delay:1.2s;  animation-duration:2.3s; }
.bday-spark--8 { width:2px; height:2px; bottom:10%; right:5%; animation-delay:1.8s; animation-duration:2.1s; }
@keyframes spark-float {
    0%,100%{ transform:translateY(0) scale(1); opacity:0.9; }
    50%{ transform:translateY(-10px) scale(0.6); opacity:0.2; }
}

/* ─── Full-card ambient particle layer ─── */
.bday-teaser__particles {
    position:absolute; inset:0;
    pointer-events:none; border-radius:16px; overflow:hidden;
    z-index:0;
}
.bt-p {
    position:absolute;
    border-radius:50%;
    background:rgba(255,215,0,0.7);
    animation:bt-float linear infinite;
}
/* Size, position and timing for each of the 16 particles */
.bt-p--1  { width:2px;  height:2px;  top:15%; left:8%;   animation-duration:7s;  animation-delay:0s;    opacity:0.6; }
.bt-p--2  { width:3px;  height:3px;  top:70%; left:5%;   animation-duration:9s;  animation-delay:1s;    opacity:0.45; }
.bt-p--3  { width:2px;  height:2px;  top:35%; left:18%;  animation-duration:11s; animation-delay:2.5s;  opacity:0.55; }
.bt-p--4  { width:4px;  height:4px;  top:80%; left:25%;  animation-duration:8s;  animation-delay:0.5s;  opacity:0.35; }
.bt-p--5  { width:2px;  height:2px;  top:20%; left:38%;  animation-duration:10s; animation-delay:3s;    opacity:0.6; }
.bt-p--6  { width:3px;  height:3px;  top:60%; left:45%;  animation-duration:12s; animation-delay:1.5s;  opacity:0.4; }
.bt-p--7  { width:2px;  height:2px;  top:10%; left:55%;  animation-duration:8.5s; animation-delay:4s;   opacity:0.65; }
.bt-p--8  { width:4px;  height:4px;  top:85%; left:58%;  animation-duration:7.5s; animation-delay:0.8s; opacity:0.3; }
.bt-p--9  { width:2px;  height:2px;  top:45%; left:65%;  animation-duration:13s; animation-delay:2s;    opacity:0.5; }
.bt-p--10 { width:3px;  height:3px;  top:25%; left:72%;  animation-duration:9.5s; animation-delay:3.5s; opacity:0.55; }
.bt-p--11 { width:2px;  height:2px;  top:75%; left:78%;  animation-duration:11s; animation-delay:1.2s;  opacity:0.45; }
.bt-p--12 { width:5px;  height:5px;  top:5%;  left:82%;  animation-duration:6.5s; animation-delay:0.3s; opacity:0.25; box-shadow:0 0 6px rgba(255,215,0,0.4); }
.bt-p--13 { width:2px;  height:2px;  top:55%; left:88%;  animation-duration:10s; animation-delay:4.5s;  opacity:0.6; }
.bt-p--14 { width:3px;  height:3px;  top:30%; left:92%;  animation-duration:8s;  animation-delay:2.2s;  opacity:0.4; }
.bt-p--15 { width:2px;  height:2px;  top:90%; left:30%;  animation-duration:7s;  animation-delay:1.8s;  opacity:0.5; }
.bt-p--16 { width:4px;  height:4px;  top:50%; left:50%;  animation-duration:14s; animation-delay:5s;    opacity:0.3; }
@keyframes bt-float {
    0%   { transform:translateY(0)    scale(1);   opacity:var(--op, 0.5); }
    40%  { transform:translateY(-18px) scale(1.3); opacity:calc(var(--op, 0.5) * 1.4); }
    70%  { transform:translateY(-8px)  scale(0.9); opacity:calc(var(--op, 0.5) * 0.6); }
    100% { transform:translateY(0)    scale(1);   opacity:var(--op, 0.5); }
}

/* ═══════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════ */
@media(max-width:768px) {
    .squad-names { gap:1rem; }
    .squad-name { padding:0.5rem 0.75rem; }
    .roster-grid { grid-template-columns:1fr 1fr; }
    .story-stats { gap:1.5rem; padding:1.5rem; }
    .birthday-card { padding:2.5rem 1.5rem; }
    /* Birthday teaser — stack on mobile */
    .bday-teaser {
        flex-direction:column;
        align-items:flex-start;
        padding:1.5rem 1.25rem 1.25rem;
        gap:1.25rem;
    }
    .bday-teaser__right {
        width:100%;
        flex-direction:row;
        justify-content:space-between;
        align-items:center;
        gap:1rem;
    }
    .bday-teaser__cta { flex:1; justify-content:center; }
    .bday-teaser__sparks { width:80px; height:40px; flex-shrink:0; }
    .bday-teaser__title { font-size:1.35rem; }
    .bday-teaser__glow { width:140px; height:140px; }
}
@media(max-width:480px) {
    .roster-grid { grid-template-columns:1fr; }
    .squad-names { flex-direction:column; align-items:center; }
    .pubg-hero__title { letter-spacing:0.1em; }
    .bday-teaser {
        padding:1.25rem 1rem 1rem;
        gap:1rem;
        border-radius:12px;
    }
    .bday-teaser__title { font-size:1.15rem; }
    .bday-teaser__sub { font-size:0.8rem; }
    .bday-teaser__badge { font-size:0.65rem; }
    .bday-teaser__cta { font-size:0.8rem; padding:10px 18px; }
    .bday-teaser__right {
        flex-direction:column;
        align-items:flex-start;
        gap:0.75rem;
    }
}