:root{
            --bg:#191b20;
            --bg-2:#181b22;
            --panel:#23262b;
            --panel-2:#1f2228;
            --text:#f2f2f2;
            --muted:#b9bcc4;
            --accent:#e63946;
            --accent-2:#ffd700;
            --border:rgba(255,255,255,.08);
            --shadow:0 16px 42px rgba(0,0,0,.35);
            --radius:18px;
        }

        *{box-sizing:border-box}

        html{scroll-behavior:smooth}

        body{
            margin:0;
            color:var(--text);
            font-family:'Roboto', Arial, sans-serif;
            background:
                radial-gradient(circle at top, rgba(230,57,70,.16), transparent 26%),
                linear-gradient(180deg, rgba(25,27,32,.96), rgba(17,19,24,.98)),
                #191b20;
        }

        a{color:inherit}

        .topbar{
            position:sticky;
            top:0;
            z-index:20;
            backdrop-filter:blur(10px);
            background:rgba(24,27,34,.86);
            border-bottom:1px solid rgba(255,255,255,.05);
        }

        .topbar__inner{
            max-width:1180px;
            margin:0 auto;
            padding:1rem 1.25rem;
            display:flex;
            justify-content:space-between;
            align-items:center;
            gap:1rem;
        }

        .brand{
            display:flex;
            align-items:center;
            gap:.8rem;
            min-width:0;
        }

        .brand__ball{
            width:18px;
            height:18px;
            border-radius:50%;
            background:radial-gradient(circle at 30% 30%, #ffa751, #c86617 65%, #7c3600);
            box-shadow:0 0 0 2px rgba(255,215,0,.15);
            flex:0 0 auto;
        }

        .brand__text{
            font-family:'Oswald', Arial, sans-serif;
            letter-spacing:.08em;
            text-transform:uppercase;
            color:var(--accent-2);
            white-space:nowrap;
            overflow:hidden;
            text-overflow:ellipsis;
        }

        .topbar__link{
            display:inline-flex;
            align-items:center;
            justify-content:center;
            min-height:44px;
            padding:.8rem 1.1rem;
            border-radius:999px;
            text-decoration:none;
            font-weight:700;
            color:#fff;
            background:linear-gradient(135deg, rgba(230,57,70,.95), rgba(184,28,50,.95));
            box-shadow:0 10px 24px rgba(230,57,70,.18);
            transition:transform .2s ease, box-shadow .2s ease;
        }

        .topbar__link:hover{
            transform:translateY(-1px);
            box-shadow:0 14px 28px rgba(230,57,70,.24);
        }

        .page{
            max-width:1180px;
            margin:0 auto;
            padding:2rem 1.25rem 2.8rem;
        }

        .hero{
            background:linear-gradient(145deg, rgba(35,38,43,.98), rgba(24,27,34,.96));
            border:1px solid var(--border);
            border-radius:28px;
            padding:2rem;
            box-shadow:var(--shadow);
            overflow:hidden;
            position:relative;
        }

        .hero::before{
            content:"";
            position:absolute;
            inset:auto -10% -30% 55%;
            height:340px;
            background:radial-gradient(circle, rgba(255,215,0,.09), transparent 60%);
            pointer-events:none;
        }

        .hero__eyebrow{
            display:inline-flex;
            align-items:center;
            gap:.55rem;
            padding:.45rem .9rem;
            border-radius:999px;
            background:rgba(255,215,0,.08);
            border:1px solid rgba(255,215,0,.16);
            color:var(--accent-2);
            font-size:.82rem;
            letter-spacing:.12em;
            text-transform:uppercase;
            margin-bottom:1rem;
        }

        .hero__title{
            margin:0;
            font-family:'Oswald', Arial, sans-serif;
            font-size:clamp(2.3rem, 6vw, 4.2rem);
            line-height:.95;
            letter-spacing:.04em;
            text-transform:uppercase;
            color:var(--accent);
            text-shadow:0 2px 18px rgba(230,57,70,.16);
        }

        .hero__lede{
            max-width:76ch;
            margin:1rem 0 0;
            font-size:1.05rem;
            line-height:1.85;
            color:#d6d8de;
        }

        .hero__meta{
            display:grid;
            grid-template-columns:repeat(3, minmax(0, 1fr));
            gap:1rem;
            margin-top:1.5rem;
        }

        .meta{
            background:rgba(255,255,255,.035);
            border:1px solid rgba(255,255,255,.06);
            border-radius:18px;
            padding:1rem 1rem .95rem;
        }

        .meta strong{
            display:block;
            font-family:'Oswald', Arial, sans-serif;
            font-size:1.4rem;
            color:var(--accent-2);
            margin-bottom:.3rem;
            letter-spacing:.03em;
        }

        .meta span{
            color:var(--muted);
            line-height:1.6;
            font-size:.95rem;
        }

        .intro{
            margin:1.6rem 0 2rem;
            display:grid;
            grid-template-columns:1.15fr .85fr;
            gap:1.2rem;
        }

        .intro__panel,
        .note{
            background:linear-gradient(180deg, rgba(35,38,43,.98), rgba(28,31,37,.96));
            border:1px solid var(--border);
            border-radius:24px;
            padding:1.4rem 1.5rem;
            box-shadow:var(--shadow);
        }

        .intro__panel h2,
        .note h2{
            margin:0 0 .85rem;
            font-family:'Oswald', Arial, sans-serif;
            text-transform:uppercase;
            letter-spacing:.05em;
            color:var(--accent-2);
            font-size:1.45rem;
        }

        .intro__panel p,
        .note p{
            margin:.75rem 0 0;
            line-height:1.8;
            color:#d7d9df;
        }

        .note ul{
            margin:.8rem 0 0;
            padding-left:1.05rem;
            color:#d7d9df;
            line-height:1.9;
        }

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

        .card{
            display:grid;
            grid-template-columns:220px minmax(0, 1fr);
            gap:1.1rem;
            align-items:center;
            background:linear-gradient(180deg, rgba(35,38,43,.98), rgba(28,31,37,.96));
            border:1px solid var(--border);
            border-radius:24px;
            padding:1rem;
            box-shadow:var(--shadow);
            min-height:100%;
        }

        .card__figure{
            margin:0;
            background:#050608;
            border-radius:18px;
            overflow:hidden;
            border:1px solid rgba(255,255,255,.06);
            box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);
        }

        .card__figure img{
            display:block;
            width:100%;
            height:auto;
            aspect-ratio: 395 / 260;
            object-fit:cover;
        }

        .card__season{
            display:inline-flex;
            align-items:center;
            gap:.45rem;
            padding:.35rem .7rem;
            border-radius:999px;
            background:rgba(255,215,0,.08);
            border:1px solid rgba(255,215,0,.18);
            color:var(--accent-2);
            font-size:.76rem;
            letter-spacing:.11em;
            text-transform:uppercase;
            margin-bottom:.7rem;
        }

        .card__title{
            margin:0;
            font-family:'Oswald', Arial, sans-serif;
            font-size:1.55rem;
            color:#fff;
            letter-spacing:.03em;
            text-transform:uppercase;
        }

        .card__text{
            margin:.7rem 0 0;
            color:#d6d8de;
            line-height:1.8;
            font-size:.98rem;
        }

        .closing{
            margin-top:1.7rem;
            background:linear-gradient(145deg, rgba(35,38,43,.98), rgba(24,27,34,.96));
            border:1px solid var(--border);
            border-radius:24px;
            padding:1.5rem;
            box-shadow:var(--shadow);
        }

        .closing h2{
            margin:0 0 .75rem;
            font-family:'Oswald', Arial, sans-serif;
            text-transform:uppercase;
            letter-spacing:.05em;
            color:var(--accent-2);
        }

        .closing p{
            margin:0;
            color:#d6d8de;
            line-height:1.85;
        }

        footer{
            padding:0 1.25rem 2rem;
        }

        .footer__inner{
            max-width:1180px;
            margin:0 auto;
            color:#9ea4af;
            text-align:center;
            font-size:.95rem;
            padding-top:1.2rem;
            border-top:1px solid rgba(255,255,255,.08);
        }

        @media (max-width: 980px){
            .hero__meta,
            .intro,
            .grid{
                grid-template-columns:1fr;
            }
        }

        @media (max-width: 760px){
            .page{padding:1.35rem .9rem 2rem}
            .hero{padding:1.25rem}
            .card{grid-template-columns:1fr}
            .topbar__inner{padding:.9rem}
            .brand__text{font-size:.92rem}
        }

        @media (max-width: 540px){
            .topbar__inner{flex-direction:column; align-items:stretch}
            .topbar__link{width:100%}
            .hero__title{font-size:2.3rem}
        }