/* EventBuzz — Premium Dark Theme | Black/Charcoal + Red + Gold | No external assets */
:root{
  --bg:#0b0b0f; --bg-2:#121218; --bg-3:#1a1a22; --surface:#14141c; --surface-2:#1e1e27;
  --ink:#f6f3ec; --ink-soft:#cfcabf; --ink-muted:#9b968c; --ink-faint:#7a766f;
  --red:#e11d2e; --red-mid:#dc2626; --red-dark:#991b1b;
  --gold:#d4af37; --gold-mid:#c9a227; --gold-soft:#f3d47a;
  --border:rgba(212,175,55,.18); --border-strong:rgba(212,175,55,.32);
  --border-red:rgba(225,29,46,.28);
  --radius:18px; --radius-sm:12px; --radius-lg:24px;
  --shadow:0 6px 28px rgba(0,0,0,.45); --shadow-lg:0 18px 60px rgba(0,0,0,.60);
  --shadow-gold:0 8px 30px rgba(212,175,55,.12);
  --max:1180px;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html:focus-within{scroll-behavior:smooth}
body{margin:0;font-family:var(--font);color:var(--ink);background:var(--bg);line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--gold-soft);text-decoration:none}
a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
img{max-width:100%;height:auto;display:block}
.container{width:min(var(--max),100% - 32px);margin-inline:auto}
@media(min-width:640px){.container{width:min(var(--max),100% - 48px)}}
::selection{background:var(--red);color:#fff}

/* Skip link */
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{position:fixed;top:12px;left:12px;width:auto;height:auto;padding:10px 16px;background:var(--gold);color:#0b0b0f;z-index:100;border-radius:8px;font-weight:800}

/* Header — sticky dark, gold mark, red hover */
.site-header{position:sticky;top:0;z-index:50;background:rgba(11,11,15,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--border)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:70px}
.logo{display:flex;align-items:center;gap:10px;font-weight:900;font-size:1.32rem;letter-spacing:-.03em;color:#fff;text-decoration:none!important;line-height:1}
.logo-mark{width:40px;height:40px;border-radius:11px;background:linear-gradient(135deg,#f3d47a 0%,var(--gold) 38%,var(--red) 130%);display:grid;place-items:center;color:#0b0b0f;font-size:1.2rem;flex-shrink:0;box-shadow:0 4px 18px rgba(212,175,55,.35);border:1px solid rgba(255,255,255,.18)}
.logo span em{font-style:normal;color:var(--gold)}
.main-nav{display:none}
.main-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:2px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.main-nav a{padding:8px 10px;border-radius:999px;font-weight:650;font-size:.88rem;color:var(--ink-soft);text-decoration:none!important;white-space:nowrap;border:1px solid transparent}
.main-nav a:hover{background:rgba(225,29,46,.14);color:#fff;border-color:var(--border-red)}
.main-nav a.active{background:var(--red);color:#fff;border-color:var(--red);box-shadow:0 4px 14px rgba(225,29,46,.35)}
.nav-toggle{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border-strong);background:var(--bg-2);color:var(--ink);border-radius:999px;padding:9px 14px;font-weight:700;cursor:pointer;font-size:.92rem}
.nav-toggle:hover{border-color:var(--gold);color:#fff}
.nav-toggle:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.mobile-nav{display:none;border-top:1px solid var(--border);padding:12px 0 16px;background:var(--bg)}
.mobile-nav.open{display:block}
.mobile-nav ul{list-style:none;margin:0;padding:0;display:grid;gap:3px}
.mobile-nav a{display:block;padding:11px 12px;border-radius:10px;font-weight:650;color:var(--ink-soft)}
.mobile-nav a:hover,.mobile-nav a.active{background:rgba(212,175,55,.10);color:#fff;text-decoration:none}
@media(min-width:1020px){.main-nav{display:block}.nav-toggle{display:none}.mobile-nav{display:none!important}}
@media(min-width:860px) and (max-width:1019px){.main-nav{display:block}.main-nav a{font-size:.82rem;padding:7px 8px}.nav-toggle{display:none}.mobile-nav{display:none!important}}

/* Hero — big display, dramatic dark */
.hero{position:relative;overflow:hidden;background:radial-gradient(900px 420px at 12% -8%,rgba(225,29,46,.22),transparent 58%),radial-gradient(760px 380px at 92% 0%,rgba(212,175,55,.18),transparent 55%),linear-gradient(180deg,#0b0b0f 0%,#121218 58%,#0b0b0f 100%);border-bottom:1px solid var(--border);padding:56px 0 52px}
.hero::after{content:"";position:absolute;inset:auto 0 0 0;height:1px;background:linear-gradient(90deg,transparent,var(--border-strong),transparent)}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(212,175,55,.08);border:1px solid var(--border-strong);color:var(--gold-soft);font-weight:750;font-size:.82rem;letter-spacing:.06em;text-transform:uppercase;padding:7px 12px;border-radius:999px}
.hero h1{font-size:2.7rem;line-height:.98;letter-spacing:-.045em;margin:18px 0 14px;color:#fff;font-weight:900;max-width:820px}
.hero h1 .accent{color:var(--red);text-shadow:0 0 28px rgba(225,29,46,.35)}
.hero h1 .gold{color:var(--gold)}
.hero p.lead{font-size:1.14rem;color:var(--ink-soft);max-width:700px;margin:0;line-height:1.65}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 20px;border-radius:999px;font-weight:750;font-size:.96rem;border:1px solid transparent;text-decoration:none!important;transition:transform .16s ease,box-shadow .16s ease,background .16s ease,border-color .16s ease;cursor:pointer}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--red);color:#fff;box-shadow:0 8px 24px rgba(225,29,46,.32)}
.btn-primary:hover{background:var(--red-mid);color:#fff;transform:translateY(-1px);box-shadow:0 12px 28px rgba(225,29,46,.38)}
.btn-gold{background:linear-gradient(180deg,#e8c766,var(--gold));color:#0b0b0f;box-shadow:0 8px 22px rgba(212,175,55,.22)}
.btn-gold:hover{filter:brightness(1.06);transform:translateY(-1px)}
.btn-orange{background:var(--red);color:#fff;box-shadow:0 8px 24px rgba(225,29,46,.32)}
.btn-orange:hover{background:var(--red-mid);transform:translateY(-1px)}
.btn-outline{background:transparent;color:var(--gold-soft);border-color:var(--border-strong)}
.btn-outline:hover{background:rgba(212,175,55,.08);color:#fff;border-color:var(--gold)}
.hero-stats{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.stat{background:rgba(255,255,255,.03);border:1px solid var(--border);border-radius:16px;padding:14px 16px;min-width:132px;box-shadow:var(--shadow)}
.stat strong{display:block;font-size:1.28rem;line-height:1;color:#fff;letter-spacing:-.02em}
.stat span{font-size:.84rem;color:var(--ink-muted)}
@media(min-width:760px){.hero{padding:84px 0 68px}.hero h1{font-size:4.1rem}}

/* Sections & numbered labels — big presentation style */
.section{padding:56px 0}
.section-head{display:flex;flex-wrap:wrap;gap:14px;align-items:end;justify-content:space-between;margin-bottom:24px}
.section-label{display:flex;align-items:center;gap:14px;margin-bottom:10px}
.section-number{font-size:2.6rem;line-height:1;font-weight:900;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.2px var(--gold);opacity:.95}
.section-number.red{-webkit-text-stroke-color:var(--red)}
.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:.74rem;font-weight:850;color:var(--gold)}
.eyebrow.red{color:#ff6b7a}
.section-head h2{font-size:2rem;line-height:1.02;letter-spacing:-.035em;margin:0;color:#fff;font-weight:900}
.section-head p{margin:8px 0 0;color:var(--ink-soft);max-width:660px}
@media(min-width:760px){.section-head h2{font-size:2.55rem}.section-number{font-size:3.2rem}}

/* Featured — dramatic dark hero panel */
.featured-card{position:relative;display:grid;gap:0;overflow:hidden;border:1px solid var(--border-strong);border-radius:var(--radius-lg);background:radial-gradient(700px 360px at 8% 0%,rgba(225,29,46,.20),transparent 55%),linear-gradient(135deg,#17171f 0%,#121218 52%,#1c1214 100%);color:#fff;box-shadow:var(--shadow-lg)}
.featured-card::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:linear-gradient(90deg,var(--red),var(--gold),var(--red))}
.featured-body{padding:28px;position:relative}
.featured-body .tag{display:inline-flex;align-items:center;gap:8px;background:rgba(225,29,46,.16);border:1px solid var(--border-red);color:#fff;padding:6px 11px;border-radius:999px;font-size:.82rem;font-weight:750}
.featured-body .tag.gold{background:rgba(212,175,55,.12);border-color:var(--border-strong);color:var(--gold-soft)}
.featured-body h3{font-size:2.05rem;line-height:1.02;letter-spacing:-.03em;margin:14px 0 10px;color:#fff}
.featured-body p{color:var(--ink-soft);max-width:640px;margin:0}
.featured-meta{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 22px}
.featured-meta span{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);padding:8px 11px;border-radius:999px;font-size:.9rem;color:var(--ink-soft)}
.countdown{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0 6px}
.countdown-item{min-width:74px;text-align:center;background:rgba(0,0,0,.28);border:1px solid var(--border);border-radius:14px;padding:10px 8px}
.countdown-item strong{display:block;font-size:1.45rem;line-height:1;color:#fff;letter-spacing:-.03em}
.countdown-item span{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-soft);font-weight:800}
.featured-side{padding:0 28px 28px}
.mini-list{display:grid;gap:10px}
.mini-list a{display:flex;justify-content:space-between;gap:12px;background:rgba(255,255,255,.04);color:#fff;padding:14px 16px;border-radius:14px;border:1px solid rgba(255,255,255,.08);text-decoration:none!important;font-weight:650}
.mini-list a:hover{background:rgba(212,175,55,.08);border-color:var(--border-strong);color:#fff}
.mini-list a span:last-child{opacity:.75;color:var(--gold-soft)}
@media(min-width:900px){.featured-card{grid-template-columns:1.25fr .85fr}.featured-body{padding:40px}.featured-side{padding:40px 40px 40px 0;display:flex;flex-direction:column;justify-content:center}}

/* Cards grid */
.grid{display:grid;gap:18px}
@media(min-width:640px){.grid-2{grid-template-columns:repeat(2,1fr)}}
@media(min-width:900px){.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}}
@media(min-width:900px){.grid-3-lg{grid-template-columns:repeat(3,1fr)}}
.card{background:linear-gradient(180deg,var(--surface) 0%,var(--bg-2) 100%);border:1px solid var(--border);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.card:hover{transform:translateY(-3px);border-color:var(--border-strong);box-shadow:var(--shadow-lg),var(--shadow-gold)}
.card h3{margin:10px 0 8px;font-size:1.18rem;line-height:1.22;letter-spacing:-.015em;color:#fff}
.card h3 a{color:#fff;text-decoration:none!important}
.card h3 a:hover{color:var(--gold-soft)}
.card p{color:var(--ink-soft);margin:0 0 14px}
.card-meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:.86rem;color:var(--ink-muted)}
.pill{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;background:rgba(212,175,55,.10);color:var(--gold-soft);border:1px solid var(--border);font-weight:750;font-size:.78rem;letter-spacing:.02em}
.pill.orange,.pill.red{background:rgba(225,29,46,.14);color:#ffb3ba;border-color:var(--border-red)}
.pill.dark{background:rgba(255,255,255,.05);color:var(--ink-soft);border-color:rgba(255,255,255,.08)}
.read-more{font-weight:750;color:var(--gold-soft)}
.read-more:hover{color:#fff}
.category-card{text-align:left;position:relative;overflow:hidden}
.category-card::after{content:"";position:absolute;inset:auto 0 0 0;height:2px;background:linear-gradient(90deg,var(--red),var(--gold));opacity:.0;transition:opacity .18s ease}
.category-card:hover::after{opacity:1}
.category-icon{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;font-size:1.45rem;background:rgba(212,175,55,.10);border:1px solid var(--border);color:var(--gold-soft)}
.category-card.orange .category-icon,.category-card.red .category-icon{background:rgba(225,29,46,.12);border-color:var(--border-red);color:#ffb3ba}
.category-card p{min-height:48px}

/* Event calendar cards */
.event-card{position:relative;overflow:hidden}
.event-card .date-badge{display:inline-flex;flex-direction:column;align-items:flex-start;gap:2px;background:linear-gradient(180deg,#1e1e27,#121218);border:1px solid var(--border-strong);border-radius:14px;padding:10px 12px;margin-bottom:12px;min-width:118px}
.event-card .date-badge strong{font-size:1.02rem;line-height:1;color:#fff;letter-spacing:-.02em}
.event-card .date-badge span{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-soft);font-weight:850}
.event-card.live{border-color:var(--border-red);box-shadow:0 10px 34px rgba(225,29,46,.18)}
.event-card.live .date-badge{border-color:var(--border-red);background:linear-gradient(180deg,rgba(225,29,46,.18),rgba(225,29,46,.06))}
.status{display:inline-flex;align-items:center;gap:7px;font-size:.80rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.status::before{content:"";width:8px;height:8px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.05)}
.status.live{color:#ff8a95}
.status.soon{color:var(--gold-soft)}

/* Ad placeholders — dashed premium on dark */
.ad-slot{margin:26px 0;border:1.5px dashed rgba(212,175,55,.42);border-radius:16px;background:repeating-linear-gradient(45deg,rgba(212,175,55,.03),rgba(212,175,55,.03) 12px,rgba(255,255,255,.015) 12px,rgba(255,255,255,.015) 24px);padding:22px;text-align:center;color:var(--ink-muted)}
.ad-slot strong{display:block;color:var(--gold-soft);letter-spacing:.10em;text-transform:uppercase;font-size:.76rem}
.ad-slot span{font-size:.92rem}
.ad-slot.in-article{margin:30px 0}

/* Newsletter / CTA */
.cta-band{background:radial-gradient(700px 320px at 10% 0%,rgba(225,29,46,.22),transparent 55%),linear-gradient(135deg,#17171f,#121218 55%,#1a1214);color:#fff;border:1px solid var(--border-strong);border-radius:var(--radius-lg);padding:32px;overflow:hidden;position:relative;box-shadow:var(--shadow-lg)}
.cta-band::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:linear-gradient(90deg,var(--red),var(--gold))}
.cta-band h2{margin:0 0 10px;font-size:2rem;line-height:1.02;letter-spacing:-.03em;color:#fff}
.cta-band p{color:var(--ink-soft);max-width:640px}
.cta-form{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.cta-form input{flex:1 1 240px;padding:13px 16px;border-radius:999px;border:1px solid var(--border);background:rgba(255,255,255,.04);color:#fff}
.cta-form input::placeholder{color:var(--ink-muted)}
.cta-form input:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:var(--gold)}
.small-note{font-size:.86rem;color:var(--ink-muted);margin-top:10px}

/* Article / prose — framed premium reading panel on dark */
.breadcrumb{font-size:.92rem;color:var(--ink-muted);margin:22px 0 10px}
.breadcrumb a{color:var(--ink-soft)}
.breadcrumb a:hover{color:#fff}
.article-wrap{max-width:860px;margin:0 auto;padding:10px 0 56px}
.article-panel{background:linear-gradient(180deg,#fdfcf8 0%,#f7f3ea 100%);color:#17171f;border-radius:22px;padding:28px 22px;box-shadow:var(--shadow-lg);border:1px solid rgba(212,175,55,.28)}
@media(min-width:760px){.article-panel{padding:38px 40px}}
.article-wrap h1{font-size:2.35rem;line-height:1.02;letter-spacing:-.035em;margin:8px 0 14px;color:#fff;font-weight:900}
.article-panel h1{color:#0b0b0f}
.article-meta{display:flex;flex-wrap:wrap;gap:10px;color:var(--ink-muted);font-size:.92rem;margin-bottom:22px}
.article-panel .article-meta{color:#6b665e}
.article-body{font-size:1.06rem;color:#23232b}
.article-body h2{font-size:1.68rem;line-height:1.12;letter-spacing:-.02em;margin:36px 0 12px;color:#0b0b0f}
.article-body h3{font-size:1.28rem;margin:26px 0 10px;color:#0b0b0f}
.article-body p,.article-body li{line-height:1.78}
.article-body a{color:#9a1b26;text-decoration:underline;text-underline-offset:3px}
.article-body a:hover{color:var(--red)}
.article-body ul,.article-body ol{padding-left:22px}
.article-body blockquote{margin:22px 0;padding:18px 20px;border-left:4px solid var(--red);background:#fff7ed;border-radius:0 12px 12px 0;color:#3f2a12}
.article-body strong{color:#0b0b0f}
.faq{margin-top:34px}
.faq details{border:1px solid #e7dfc8;border-radius:12px;padding:16px 18px;margin-bottom:10px;background:#fff}
.faq summary{font-weight:750;cursor:pointer;color:#0b0b0f}
.related{margin-top:36px}
.notice{background:rgba(212,175,55,.08);border:1px solid var(--border-strong);color:var(--gold-soft);border-radius:14px;padding:14px 16px}
.page-hero{padding:46px 0 12px}
.page-hero h1{font-size:2.5rem;line-height:1.0;letter-spacing:-.04em;margin:10px 0;color:#fff;font-weight:900}
.page-hero p{color:var(--ink-soft);max-width:740px;font-size:1.08rem}
.prose{max-width:860px}
.prose h2{margin-top:32px;color:#fff}
.article-panel h2,.article-panel h3{color:#0b0b0f!important}
.article-panel p,.article-panel li{color:#23232b}
.article-panel .pill{background:rgba(225,29,46,.08);color:#7f1d1d;border-color:rgba(225,29,46,.18)}
.article-panel .ad-slot{border-color:rgba(154,27,38,.35);color:#6b665e;background:repeating-linear-gradient(45deg,rgba(212,175,55,.06),rgba(212,175,55,.06) 12px,#fff 12px,#fff 24px)}
.article-panel .ad-slot strong{color:#9a1b26}

/* Footer — deep charcoal */
.site-footer{background:#08080c;color:#d8d2c4;margin-top:24px;border-top:1px solid var(--border)}
.footer-grid{display:grid;gap:28px;padding:48px 0 28px}
@media(min-width:800px){.footer-grid{grid-template-columns:1.35fr 1fr 1fr 1fr}}
.site-footer h3,.site-footer h4{color:#fff;margin-top:0;letter-spacing:-.01em}
.site-footer a{color:#d8d2c4}
.site-footer a:hover{color:var(--gold-soft)}
.site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding:18px 0 26px;display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;color:var(--ink-muted);font-size:.92rem}

/* Forms (contact etc.) on dark */
input,select,textarea{font-family:var(--font)}
.card input,.card select,.card textarea{background:#0f0f14!important;color:var(--ink)!important;border-color:var(--border)!important}
.card input::placeholder,.card textarea::placeholder{color:var(--ink-muted)}

/* Utilities & focus */
.mt-0{margin-top:0}.mb-0{margin-bottom:0}.text-center{text-align:center}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:6px}
@media (prefers-reduced-motion: reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* ===== Design upgrade 2026-10: 3D depth, card media, hero visual, motion ===== */

/* Logo — premium glow + shine sweep (CSS only, same mark) */
.logo-mark{position:relative;overflow:hidden;box-shadow:0 6px 22px rgba(212,175,55,.42),0 12px 30px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.55),inset 0 -6px 12px rgba(154,27,38,.35);transition:transform .25s ease,box-shadow .25s ease}
.logo-mark::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 32%,rgba(255,255,255,.65) 50%,transparent 66%);transform:translateX(-130%) skewX(-8deg);animation:logoShine 4.6s ease-in-out infinite;pointer-events:none}
@keyframes logoShine{0%,55%{transform:translateX(-130%) skewX(-8deg)}82%,100%{transform:translateX(130%) skewX(-8deg)}}
.logo:hover .logo-mark{transform:translateY(-1px) scale(1.06);box-shadow:0 8px 28px rgba(212,175,55,.55),0 14px 34px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.6),inset 0 -6px 12px rgba(154,27,38,.35)}

/* Sticky header polish */
.site-header{box-shadow:0 12px 34px rgba(0,0,0,.38)}

/* Hero layout + 3D visual card stack */
.hero-grid{display:grid;gap:40px;align-items:center}
@media(min-width:1000px){.hero-grid{grid-template-columns:1.04fr .96fr;gap:48px}}
.hero-visual{perspective:1400px;padding:22px 6px 18px}
.hero-card-stack{position:relative;max-width:560px;margin-inline:auto}
.hero-card-stack::before,.hero-card-stack::after{content:"";position:absolute;inset:0;border-radius:22px;pointer-events:none;z-index:0}
.hero-card-stack::before{background:linear-gradient(135deg,rgba(225,29,46,.55),rgba(225,29,46,.12));transform:rotate(-4.5deg) translate(-10px,10px);border:1px solid rgba(225,29,46,.4)}
.hero-card-stack::after{background:linear-gradient(135deg,rgba(212,175,55,.5),rgba(212,175,55,.1));transform:rotate(3.5deg) translate(12px,6px);border:1px solid rgba(212,175,55,.4)}
.hero-card-main{position:relative;z-index:1;margin:0;border-radius:22px;overflow:hidden;background:#000;border:1px solid var(--border-strong);box-shadow:0 34px 90px rgba(0,0,0,.65),0 0 70px rgba(225,29,46,.16);transform:rotateY(-8deg) rotateX(3deg) rotateZ(-.5deg);transition:transform .5s ease}
.hero-card-stack:hover .hero-card-main{transform:rotateY(-2.5deg) rotateX(1deg) rotateZ(0)}
.hero-card-main img{width:100%;height:auto;filter:saturate(1.12) contrast(1.05)}
.hero-card-main::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.08),transparent 34%,transparent 62%,rgba(4,3,8,.78));pointer-events:none}
.hero-card-main figcaption{position:absolute;left:16px;right:16px;bottom:13px;z-index:2;color:#fff;font-weight:850;font-size:.98rem;letter-spacing:.01em;text-shadow:0 2px 10px rgba(0,0,0,.7)}
.hero-count-badge{position:absolute;z-index:2;top:-16px;right:-6px;transform:rotate(2.5deg);background:rgba(11,11,15,.92);border:1px solid var(--border-strong);border-radius:16px;padding:10px 12px;box-shadow:0 18px 44px rgba(0,0,0,.55),0 0 34px rgba(212,175,55,.14);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.hcb-label{display:block;font-size:.7rem;font-weight:850;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:6px;text-align:center}
.countdown-mini{margin:0;flex-wrap:nowrap;gap:6px}
.countdown-mini .countdown-item{min-width:52px;padding:7px 4px;border-radius:10px}
.countdown-mini .countdown-item strong{font-size:1.02rem}
.countdown-mini .countdown-item span{font-size:.6rem}
.hero-chip{position:absolute;z-index:2;left:-8px;bottom:26px;transform:rotate(-2.5deg);display:inline-flex;align-items:center;gap:10px;background:rgba(11,11,15,.92);color:#fff;border:1px solid var(--border-red);border-radius:999px;padding:11px 16px;font-weight:750;font-size:.92rem;text-decoration:none!important;box-shadow:0 18px 44px rgba(0,0,0,.55),0 0 30px rgba(225,29,46,.16);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.hero-chip:hover{color:#fff;border-color:var(--red)}
.hero-chip span:last-child{color:var(--gold-soft)}
@media(max-width:640px){.hero-visual{padding-top:10px}.hero-card-main{transform:rotateY(-3deg) rotateX(1.5deg)}.hero-count-badge{top:-10px;right:0}.hero-chip{left:0;bottom:14px}}

/* Article cards — media, color grading, 3D hover */
.card{position:relative}
.card-media{display:block;position:relative;margin:-22px -22px 16px;border-radius:var(--radius) var(--radius) 0 0;overflow:hidden;line-height:0;text-decoration:none!important}
.card-media img{width:100%;height:190px;object-fit:cover;filter:saturate(1.14) contrast(1.05);transition:transform .55s ease,filter .45s ease}
.card-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,11,15,.10),transparent 42%,rgba(11,11,15,.45));box-shadow:inset 0 0 0 1px rgba(255,255,255,.05);pointer-events:none}
.card:hover .card-media img{transform:scale(1.08);filter:saturate(1.24) contrast(1.07)}
@media(hover:hover) and (min-width:1020px){
  .card{transition:transform .3s ease,border-color .25s ease,box-shadow .3s ease}
  .card:hover{transform:perspective(950px) rotateX(1.8deg) rotateY(-1.8deg) translateY(-5px);box-shadow:0 30px 60px rgba(0,0,0,.55),0 0 34px rgba(212,175,55,.14)}
}

/* Article pages — framed hero image with light gradient overlay */
.hero-figure{position:relative;margin:0 0 26px;border-radius:16px;overflow:hidden;border:1px solid rgba(212,175,55,.45);box-shadow:0 24px 55px rgba(31,20,2,.28),0 0 44px rgba(225,29,46,.08);background:#0b0b0f}
.hero-figure img{margin:0!important;border-radius:0!important;filter:saturate(1.1) contrast(1.04)}
.hero-figure::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.10),transparent 30%,transparent 74%,rgba(24,12,2,.16));pointer-events:none}

/* Scroll reveal (class added by JS only; no-JS visitors see everything) */
.js-reveal .reveal{transition:opacity .6s ease,transform .6s ease}
.js-reveal .reveal:not(.in-view){opacity:0;transform:translateY(18px)}

/* Bookmark nudge */
.bookmark-hint{color:var(--ink-muted);font-size:.92rem}
.bookmark-hint kbd{background:#1e1e27;border:1px solid var(--border-strong);border-bottom-width:2px;border-radius:6px;padding:1px 6px;font-family:inherit;color:var(--gold-soft);font-size:.85em}

/* EventBuzz shop picks (affiliate) */
.shop-picks{margin:30px 0}
.shop-picks h2{margin-bottom:6px}
.shop-picks .shop-sub{color:#6b665e;font-size:14px;margin:0 0 16px}
.shop-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px}
.shop-card{background:#fff;border:1px solid rgba(212,175,55,.4);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 8px 24px rgba(0,0,0,.08)}
.shop-card img{width:100%;height:150px;object-fit:cover;display:block}
.shop-card .sc-body{padding:10px 12px 12px;display:flex;flex-direction:column;gap:6px;flex:1}
.shop-card .sc-title{font-size:14px;font-weight:600;color:#17171f;line-height:1.35}
.shop-card .sc-price{font-size:15px;font-weight:700;color:#9a1b26}
.shop-card .sc-btn{margin-top:auto;background:linear-gradient(135deg,#e11d2e,#9a1b26);color:#fff;text-align:center;padding:8px 10px;border-radius:9px;font-size:13px;font-weight:700;text-decoration:none}
.shop-card .sc-btn:hover{background:linear-gradient(135deg,#f03346,#b32334);color:#fff}
.shop-note{font-size:12px;color:#8a857c;margin-top:10px}

/* ============ Seasonal theme engine (auto, per nearest event) ============ */
:root{
  --theme-accent:#e11d2e;
  --theme-accent-soft:rgba(225,29,46,.32);
  --theme-glow:rgba(225,29,46,.14);
}
/* Accent recoloring — tasteful, brand-safe: headline accent word, countdown
   label, hero badge and category banner pick up the active event's color. */
html[data-theme] .hero h1 .accent{color:var(--theme-accent);text-shadow:0 0 28px var(--theme-glow)}
html[data-theme] .hcb-label{color:var(--theme-accent)}
html[data-theme] .hero-badge{border-color:var(--theme-accent-soft)}
html[data-theme] .page-hero{border-top:2px solid var(--theme-accent-soft);border-radius:0 0 4px 4px}

/* Themed category banner — wide, professional, slow Ken Burns zoom */
.theme-banner{position:relative;margin:0 0 26px;border-radius:20px;overflow:hidden;
  border:1px solid var(--theme-accent-soft);
  box-shadow:0 24px 70px rgba(0,0,0,.55),0 0 44px var(--theme-glow);
  aspect-ratio:21/7;min-height:170px;background:#0b0b0f}
.theme-banner img{width:100%;height:100%;object-fit:cover;filter:saturate(1.1) contrast(1.04);
  animation:themeKenBurns 26s ease-in-out infinite alternate;will-change:transform}
@keyframes themeKenBurns{
  from{transform:scale(1) translate(0,0)}
  to{transform:scale(1.12) translate(-1.5%,1.2%)}
}
.theme-banner::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(4,3,8,.05) 40%,rgba(4,3,8,.62) 100%)}
.theme-banner figcaption{position:absolute;left:16px;bottom:14px;z-index:2}
.theme-chip{display:inline-flex;align-items:center;gap:8px;background:rgba(11,11,15,.88);
  border:1px solid var(--theme-accent-soft);color:#fff;font-weight:800;font-size:.9rem;
  letter-spacing:.02em;padding:9px 15px;border-radius:999px;
  box-shadow:0 10px 26px rgba(0,0,0,.5)}

/* Professional CSS-crafted event art — used when no photo exists yet (e.g. Independence Day).
   Official-style flag SVG + event typography in theme colors; animated shine sweep. */
.theme-banner.theme-art{display:flex;align-items:center;justify-content:center;gap:26px;
  aspect-ratio:auto;min-height:210px;padding:34px 28px;text-align:center;
  background:
    radial-gradient(120% 160% at 50% 0%,var(--theme-glow) 0%,transparent 55%),
    linear-gradient(115deg,#04140b 0%,#01411C 42%,#0a9b4d 78%,#01411C 100%);
  border:1px solid var(--theme-accent-soft);
  box-shadow:0 24px 70px rgba(0,0,0,.55),0 0 60px var(--theme-glow),inset 0 0 90px rgba(0,0,0,.45)}
.theme-art{position:relative;overflow:hidden}
.theme-art-flag{width:min(300px,42%);filter:drop-shadow(0 14px 30px rgba(0,0,0,.6));
  border-radius:10px;overflow:hidden;border:1px solid rgba(255,255,255,.25);
  animation:themeFlagWave 7s ease-in-out infinite;transform-origin:50% 50%}
.theme-art-flag svg{display:block;width:100%;height:auto}
@keyframes themeFlagWave{
  0%,100%{transform:perspective(700px) rotateY(-7deg) scale(1)}
  50%{transform:perspective(700px) rotateY(7deg) scale(1.025)}
}
.theme-art-text{display:flex;flex-direction:column;gap:10px;align-items:flex-start;text-align:left}
.theme-banner.theme-art .theme-art-text{align-items:center;text-align:center}
.theme-art-kicker{font-size:.82rem;font-weight:800;letter-spacing:.32em;text-transform:uppercase;
  color:#f5d47a;text-shadow:0 2px 12px rgba(0,0,0,.6)}
.theme-art-title{font-size:clamp(2rem,5.4vw,3.6rem);font-weight:900;letter-spacing:.06em;color:#fff;
  text-shadow:0 3px 0 rgba(0,0,0,.35),0 0 34px var(--theme-glow);line-height:1.05}
.theme-art-emoji{font-size:clamp(3rem,8vw,5rem);line-height:1;filter:drop-shadow(0 10px 24px rgba(0,0,0,.55))}
.theme-art-shine{position:absolute;inset:-40%;pointer-events:none;z-index:1;
  background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.16) 50%,transparent 58%);
  animation:themeShine 6.5s ease-in-out infinite}
@keyframes themeShine{
  0%{transform:translateX(-55%)}
  55%,100%{transform:translateX(55%)}
}
.theme-art .theme-art-flag,.theme-art .theme-art-text{position:relative;z-index:2}
/* Homepage hero card variant */
.theme-art-hero{border-radius:16px;min-height:300px;display:flex;align-items:center;justify-content:center;
  gap:22px;padding:30px 24px;text-align:center;
  background:
    radial-gradient(120% 160% at 50% 0%,var(--theme-glow) 0%,transparent 55%),
    linear-gradient(115deg,#04140b 0%,#01411C 42%,#0a9b4d 78%,#01411C 100%)}
.theme-art-hero .theme-art-text{align-items:center;text-align:center}
@media(max-width:640px){
  .theme-banner.theme-art{flex-direction:column;gap:16px;min-height:0;padding:26px 18px}
  .theme-art-flag{width:min(230px,64%)}
  .theme-art-text{align-items:center;text-align:center}
}
@media (prefers-reduced-motion:reduce){
  .theme-art-flag,.theme-art-shine{animation:none!important}
}

/* Auto-matching country flag (National Days page) — inline SVG, official style */
.theme-flag{display:inline-block;width:40px;vertical-align:-7px;margin-left:8px;
  border-radius:5px;overflow:hidden;box-shadow:0 3px 12px rgba(0,0,0,.55);
  border:1px solid rgba(255,255,255,.22);line-height:0}
.theme-flag svg{display:block;width:100%;height:auto}

/* Subtle animated decoration layer — CSS-only particles, pointer-transparent */
.theme-fx{position:fixed;inset:0;z-index:70;pointer-events:none;overflow:hidden}
.theme-fx .fxp{position:absolute;top:-4%;opacity:.55;animation-name:fxFall;animation-timing-function:linear;animation-iteration-count:infinite}
.fx-leaves .fxp{border-radius:62% 6% 62% 6%}
.fx-snow .fxp{border-radius:50%;box-shadow:0 0 6px rgba(255,255,255,.5)}
.fx-petals .fxp{border-radius:58% 42% 55% 45%/48% 55% 45% 52%}
.fx-powder .fxp{border-radius:50%}
.fx-sparks .fxp{border-radius:50%;box-shadow:0 0 8px 2px currentColor;animation-name:fxRise;top:105%}
@keyframes fxFall{
  0%{transform:translateY(-6vh) translateX(0) rotate(0deg)}
  100%{transform:translateY(112vh) translateX(5vw) rotate(340deg)}
}
@keyframes fxRise{
  0%{transform:translateY(0) translateX(0);opacity:0}
  12%{opacity:.7}
  100%{transform:translateY(-118vh) translateX(-3vw);opacity:0}
}
@media (prefers-reduced-motion:reduce){
  .theme-banner img,.theme-fx .fxp{animation:none!important}
  .theme-fx{display:none}
}

/* ===== About page dark professional design ===== */
.about-dark{max-width:900px;margin:0 auto;padding:20px 0 40px}
.about-section{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:32px;margin-bottom:24px;position:relative;overflow:hidden;transition:transform .4s cubic-bezier(.2,.7,.2,1),border-color .3s,box-shadow .4s}
.about-section:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#ff5a5a,#ffb800,#ff5a5a);opacity:.7}
.about-section:hover{transform:translateY(-4px);border-color:rgba(255,184,0,.35);box-shadow:0 20px 40px -15px rgba(0,0,0,.6)}
.about-label{display:flex;align-items:center;gap:12px;margin-bottom:16px;font-size:12px;text-transform:uppercase;letter-spacing:.15em;color:#ffb800;font-weight:700}
.about-num{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#ff5a5a,#ffb800);color:#fff;font-size:14px;font-weight:800}
.about-section h2{color:#fff;font-size:clamp(24px,3.5vw,32px);margin:0 0 16px}
.about-section p{color:#d4d0c8;line-height:1.75;margin:0 0 14px}
.about-section p:last-child{margin-bottom:0}
.about-section a{color:#ffb800;text-decoration:none;border-bottom:1px solid rgba(255,184,0,.4)}
.about-section a:hover{color:#ffd54f;border-bottom-color:#ffd54f}
.about-section strong{color:#fff}
.about-values{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:20px}
@media(max-width:640px){.about-values{grid-template-columns:1fr}}
.about-value{display:flex;gap:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:18px;transition:transform .3s,border-color .3s}
.about-value:hover{transform:translateY(-3px);border-color:rgba(255,184,0,.3)}
.value-icon{font-size:28px;flex:none}
.about-value strong{display:block;color:#fff;margin-bottom:6px;font-size:15px}
.about-value p{margin:0;font-size:14px;color:#b8b4ac}
.about-audience{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.about-audience span{background:rgba(255,184,0,.08);border:1px solid rgba(255,184,0,.2);border-radius:50px;padding:10px 18px;font-size:14px;color:#e8e4dc;transition:transform .3s,background .3s}
.about-audience span:hover{transform:translateY(-2px) scale(1.03);background:rgba(255,184,0,.15)}
.about-cta{background:linear-gradient(135deg,rgba(255,90,90,.08),rgba(255,184,0,.08));border-color:rgba(255,184,0,.25)}
.about-notice{margin-top:20px;padding:16px 20px;background:rgba(255,255,255,.04);border-left:3px solid #ffb800;border-radius:0 10px 10px 0;font-size:13.5px;color:#a8a49c;line-height:1.6}

/* ===== Slow Ken Burns zoom animation for hero + card images ===== */
@keyframes kenburns{0%{transform:scale(1)}50%{transform:scale(1.12)}100%{transform:scale(1)}}
.hero-card-main{overflow:hidden}
.hero-card-main img{animation:kenburns 18s ease-in-out infinite}
.card-media{overflow:hidden}
.card-media img{animation:kenburns 22s ease-in-out infinite}
.card:hover .card-media img{animation-play-state:paused;transform:scale(1.08)}

/* ===== About hero professional title ===== */
.about-hero{text-align:center;padding:60px 0 30px}
.about-title-label{display:inline-flex;align-items:center;gap:10px;margin-bottom:20px;padding:10px 24px;background:rgba(255,184,0,.08);border:1px solid rgba(255,184,0,.25);border-radius:50px;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#ffb800}
.about-title-badge{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,#ff5a5a,#ffb800);color:#fff;font-size:14px}
.about-hero h1{font-size:clamp(36px,6vw,56px);background:linear-gradient(135deg,#fff,#ffb800);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin:0 0 18px}
.about-hero p{color:#d4d0c8;font-size:1.1rem;max-width:680px;margin:0 auto;line-height:1.7}

/* ===== Mobile shop cards responsive fix ===== */
@media(max-width:640px){
  .shop-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .shop-card img{height:120px}
  .shop-card .sc-title{font-size:12.5px}
  .shop-card .sc-price{font-size:13.5px}
  .shop-card .sc-btn{font-size:12px;padding:7px 8px}
}
@media(max-width:380px){
  .shop-grid{grid-template-columns:1fr;gap:12px}
  .shop-card img{height:180px}
}
.shop-card img{aspect-ratio:1/1;object-fit:cover}
.shop-card{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.shop-card:hover{transform:translateY(-5px);box-shadow:0 16px 32px -10px rgba(0,0,0,.25)}

/* Logo image (2026-10-22): real logo file in header/footer, replaces CSS-only mark */
.logo-img{height:40px;width:auto;display:block}

/* ===== Batch 2026-10-29: unified 3D card system, pagination, event ribbon ===== */
/* 3D depth for every article card grid (homepage, category pages, related cards) */
.grid{perspective:1400px}
.card{transform-style:preserve-3d}
.card-media{transform:translateZ(18px)}
.card h3,.card p,.card-meta{transform:translateZ(8px)}
@media (hover:hover){
  .card:hover{transform:perspective(950px) rotateX(1.8deg) rotateY(-1.8deg) translateY(-5px);box-shadow:0 30px 60px rgba(0,0,0,.55),0 0 34px rgba(212,175,55,.14)}
  .card:hover .card-media img{animation:none;transform:scale(1.08)}
}
@media (prefers-reduced-motion:reduce){
  .card:hover{transform:none!important}
  .card-media,.card h3,.card p,.card-meta{transform:none!important}
  .card:hover .card-media img{transform:none!important}
}

/* Category pagination */
.pagination{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:28px 0 4px}
.pagination a,.pagination span[aria-current]{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px;border-radius:999px;border:1px solid var(--border-strong);color:var(--ink-soft);font-weight:750;text-decoration:none!important;background:rgba(255,255,255,.03)}
.pagination a:hover{color:#fff;border-color:var(--gold)}
.pagination span[aria-current]{background:var(--red);border-color:var(--red);color:#fff}
.pagination .pg-label{border:0;background:none;min-width:0;padding:0 4px;color:var(--ink-muted);font-weight:650}
.pagination .pg-prev,.pagination .pg-next{padding:0 16px}

/* Nearest-event ribbon on article pages (injected by seasonal-theme.js) */
.event-ribbon{display:flex;flex-wrap:wrap;gap:10px;align-items:center;background:#14141c;border:1px solid rgba(212,175,55,.45);border-left:5px solid var(--theme-accent,#e11d2e);color:#f6f3ec;border-radius:14px;padding:12px 16px;margin:0 0 22px;font-size:.95rem;box-shadow:0 10px 26px rgba(0,0,0,.35)}
.event-ribbon strong{color:#f3d47a}
.event-ribbon a{color:#f3d47a;font-weight:750}
.event-ribbon .ribbon-chip{background:rgba(225,29,46,.16);border:1px solid rgba(225,29,46,.4);border-radius:999px;padding:3px 10px;font-size:.82rem;font-weight:800;white-space:nowrap}