/* ============ RESET / TOKENS ============ */
*{box-sizing:border-box;}
:root{
  --red:#c8102e; --red-dark:#7a0a1c;
  --gold:#ffc93c; --gold-soft:#ffe49a;
  --ink:#0b0b10;
  --cream:#fdf6e8; --cream-2:#f6ead0;
  --white-70:rgba(255,255,255,.7); --white-50:rgba(255,255,255,.5);
  --maxw:1200px;
}
html,body{margin:0; padding:0; background:var(--red); overflow-x:hidden;}
html{ scroll-padding-top:122px; }
@media(min-width:768px){ html{ scroll-padding-top:134px; } }
.scroll-smooth{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ .scroll-smooth{ scroll-behavior:auto; } }
body{font-family:'Plus Jakarta Sans',Arial,sans-serif; color:var(--ink); line-height:1.5; -webkit-font-smoothing:antialiased;}
img,svg{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
h1,h2,h3,p{margin:0;}
button{font:inherit; cursor:pointer; background:none; border:none; color:inherit;}
::selection{ background:var(--gold); color:var(--ink); }

.font-display{font-family:'Anton',Impact,sans-serif; font-weight:400; letter-spacing:0.01em;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 20px; counter-reset:faq;}
.hidden{display:none !important;}

/* grain overlay */
.grain{position:absolute; inset:0; z-index:2; pointer-events:none; opacity:.16; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

.text-gradient-gold{ background:linear-gradient(135deg,#ffe49a 0%,#ffc93c 45%,#e0a300 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }

/* tag / small label */
.tag{ font-family:'Space Grotesk',monospace,sans-serif; font-weight:700; letter-spacing:.2em; text-transform:uppercase; font-size:11px; }

/* marquee */
.marquee-wrap{ background:var(--gold); padding:14px 0; overflow:hidden; border-top:4px solid var(--red-dark); border-bottom:4px solid var(--red-dark); }
.marquee-track{ display:flex; width:max-content; animation:marquee 32s linear infinite; }
.marquee-wrap:hover .marquee-track{ animation-play-state:paused; }
@keyframes marquee{ from{transform:translateX(0);} to{transform:translateX(-50%);} }
.marquee-item{ font-family:'Anton',sans-serif; color:var(--ink); font-size:22px; padding:0 24px; white-space:nowrap; }
@media(min-width:768px){ .marquee-item{font-size:26px;} }

/* header */
#site-header{ position:fixed; top:0; left:0; width:100%; z-index:999; padding:16px 20px; transition:background-color .35s ease, backdrop-filter .35s ease, border-color .35s ease; }
#site-header.scrolled{ background-color:rgba(122,10,28,.92); backdrop-filter:blur(10px); border-bottom:1px solid rgba(255,201,60,.18); }
.header-inner{ max-width:var(--maxw); margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.logo{ font-family:'Anton',sans-serif; font-size:26px; color:#fff; letter-spacing:.02em; display:inline-flex; align-items:center; }
.logo span{ color:var(--gold); }
.logo-stacked{ height:72px; width:auto; display:block; }
@media(min-width:768px){ .logo-stacked{ height:84px; } }
.footer .logo-stacked{ height:96px; }
.main-nav{ display:none; align-items:center; gap:28px; }
@media(min-width:1024px){ .main-nav{display:flex;} }
.nav-link{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--white-70); transition:color .2s ease; }
.nav-link:hover{ color:var(--gold); }
.header-right{ display:flex; align-items:center; gap:10px; }

.btn{ font-family:'Space Grotesk',sans-serif; font-weight:700; letter-spacing:.08em; text-transform:uppercase; font-size:12px; padding:14px 26px; border-radius:999px; display:inline-flex; align-items:center; gap:8px; transition:transform .2s ease, box-shadow .2s ease, color .2s ease, border-color .2s ease; }
.btn-gold{ background:var(--gold); color:var(--ink); box-shadow:0 8px 24px -8px rgba(255,201,60,.6); }
.btn-gold:hover{ transform:translateY(-2px); box-shadow:0 12px 28px -6px rgba(255,201,60,.75); }
.btn-outline{ background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,.5); }
.btn-outline:hover{ border-color:var(--gold); color:var(--gold); }
.btn-sm-hide{ display:none; }
@media(min-width:640px){ .btn-sm-hide{display:inline-flex;} }

.icon-btn{ display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px; width:40px; height:40px; border-radius:999px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); }
@media(min-width:1024px){ .icon-btn{display:none;} }
.icon-btn span{ width:16px; height:2px; background:#fff; }

.mobile-menu{ max-width:var(--maxw); margin:16px auto 0; background:var(--red-dark); border:1px solid rgba(255,255,255,.1); border-radius:18px; padding:10px; display:flex; flex-direction:column; gap:2px; box-shadow:0 24px 48px -12px rgba(0,0,0,.6); }
@media(min-width:1024px){ .mobile-menu{display:none !important;} }
.mobile-menu a{ padding:14px 16px; border-radius:12px; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:13px; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.8); transition:background-color .2s ease, color .2s ease; }
.mobile-menu a:hover{ background:rgba(255,255,255,.06); color:var(--gold); }
.mobile-menu a.cta{ background:var(--gold); color:var(--ink); text-align:center; margin-top:6px; }
.mobile-menu a.cta:hover{ background:var(--gold); color:var(--ink); }

/* lang dropdown */
.lang-wrap{ position:relative; }
.lang-btn{ display:flex; align-items:center; gap:6px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); border-radius:999px; padding:10px 14px; font-family:'Space Grotesk',sans-serif; font-size:12px; font-weight:700; color:#fff; }
.lang-btn:hover{ background:rgba(255,255,255,.2); }
.lang-drop-menu{ display:none; position:absolute; top:calc(100% + 10px); right:0; background:#fff; color:var(--ink); border-radius:12px; box-shadow:0 20px 40px -12px rgba(0,0,0,.45); padding:6px; min-width:190px; z-index:200; }
.lang-drop-menu.open{ display:block; }
.lang-drop-item{ font:inherit; line-height:inherit; letter-spacing:inherit; text-transform:inherit; color:inherit; background:none; border:0; margin:0; width:100%; text-align:left; }
.lang-drop-item{ padding:9px 12px; border-radius:8px; font-family:'Space Grotesk',sans-serif; font-size:12.5px; font-weight:700; cursor:pointer; display:flex; align-items:center; gap:8px; }
.lang-drop-item:hover{ background:#f3f0e6; }
.lang-drop-item.active{ background:var(--cream-2); }

/* hero */
.hero{ position:relative; min-height:60vh; display:flex; flex-direction:column; align-items:center; justify-content:center; overflow:hidden; padding:144px 20px 40px; background:var(--red); }
.hero-video-wrap{ position:absolute; inset:0; z-index:0; overflow:hidden; background:url('../images/hero-crowd.jpg') center 30%/cover no-repeat; }
.hero-video-wrap iframe{ position:absolute; top:50%; left:50%; width:100vw; height:56.25vw; min-height:100vh; min-width:177.78vh; transform:translate(-50%,-50%); pointer-events:none; border:0; }
.hero-overlay{ position:absolute; inset:0; z-index:1;
  background:
    radial-gradient(120% 90% at 50% -10%, rgba(200,16,46,.5) 0%, rgba(122,10,28,.58) 55%),
    radial-gradient(80% 60% at 85% 100%, rgba(255,201,60,.16) 0%, transparent 60%),
    linear-gradient(rgba(122,10,28,.28), rgba(122,10,28,.45)); }
.lantern{ position:absolute; z-index:3; width:60px; opacity:.8; }
.lantern svg{ width:100%; height:auto; }
.lantern-a{ top:110px; left:6%; }
.lantern-b{ top:170px; right:7%; width:48px; opacity:.7; }
@media(min-width:768px){ .lantern-a{width:80px;} .lantern-b{width:64px;} }
@keyframes floatA{ 0%,100%{transform:translateY(0) rotate(-2deg);} 50%{transform:translateY(-16px) rotate(2deg);} }
@keyframes floatB{ 0%,100%{transform:translateY(0) rotate(2deg);} 50%{transform:translateY(-22px) rotate(-3deg);} }

/* ============ FORTUNE MOTIFS ============ */
.motif{ position:absolute; z-index:3; pointer-events:none; }
.motif svg{ width:100%; height:auto; display:block; }
.motif-firecracker{ width:30px; opacity:.85; }
.motif-fu-badge{ width:40px; opacity:.9; }
@media(min-width:768px){ .motif-firecracker{width:40px;} .motif-fu-badge{width:52px;} }
.sub-hero-motif{ position:absolute; bottom:22px; right:22px; width:42px; opacity:.55; z-index:2; pointer-events:none; }
.sub-hero-motif svg{ width:100%; height:auto; display:block; }
@media(min-width:768px){ .sub-hero-motif{width:56px; bottom:30px; right:30px;} }
.footer-motif{ position:absolute; top:26px; right:26px; width:46px; opacity:.28; z-index:0; pointer-events:none; }
.footer-motif svg{ width:100%; height:auto; display:block; }
@media(min-width:768px){ .footer-motif{width:64px; top:34px; right:34px;} }
.footer-motif-bottom{ top:auto; bottom:26px; left:26px; right:auto; }
@media(min-width:768px){ .footer-motif-bottom{ bottom:34px; left:34px; } }
.footer-grid{ position:relative; z-index:1; }
.hero-inner{ position:relative; z-index:10; max-width:var(--maxw); margin:0 auto; text-align:center; }
.kicker{ display:inline-flex; align-items:center; gap:8px; padding:7px 16px; border-radius:999px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); color:var(--gold-soft); margin-bottom:16px; }
.kicker .dot{ width:6px; height:6px; border-radius:999px; background:var(--gold); animation:pulse 1.6s ease-in-out infinite; }
@keyframes pulse{ 0%,100%{opacity:1;} 50%{opacity:.3;} }
.hero-title{ color:#fff; line-height:.92; font-size:15vw; }
.hero-title .line2{ font-size:15vw; }
@media(min-width:640px){ .hero-title, .hero-title .line2{font-size:9vw;} }
@media(min-width:1024px){ .hero-title, .hero-title .line2{font-size:6.8rem;} }
.hero-sub{ font-family:'Space Grotesk',sans-serif; color:var(--white-70); font-size:14px; letter-spacing:.15em; text-transform:uppercase; margin-top:14px; }
.pill-row{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:12px; margin-top:18px; }
.pill{ padding:10px 20px; border-radius:999px; font-family:'Space Grotesk',sans-serif; font-weight:700; letter-spacing:.1em; font-size:14px; }
.pill-gold{ border:1px solid rgba(255,201,60,.5); color:var(--gold); }
.pill-white{ border:1px solid rgba(255,255,255,.25); color:var(--white-70); }
.countdown{ display:flex; align-items:center; justify-content:center; gap:14px; margin-top:22px; }
@media(min-width:768px){ .countdown{gap:20px;} }
.cd-num{ font-family:'Anton',sans-serif; font-size:clamp(2.2rem,6vw,3.6rem); line-height:1; color:var(--gold); }
.cd-sep{ color:rgba(255,255,255,.3); font-family:'Anton',sans-serif; font-size:1.8rem; margin-top:-14px; }
.cd-label{ color:var(--white-50); margin-top:4px; }
.hero-ctas{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:16px; margin-top:24px; }
.scroll-cue{ position:absolute; bottom:28px; left:50%; transform:translateX(-50%); color:var(--white-50); animation:bounce 2s infinite; }
@keyframes bounce{ 0%,100%{transform:translate(-50%,0);} 50%{transform:translate(-50%,8px);} }

/* generic section */
.section{ padding:96px 20px; position:relative; }
.section-dark{ background-color:var(--red); background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><g fill='none' stroke='%23ffc93c' stroke-opacity='0.18' stroke-width='2'><circle cx='35' cy='35' r='13'/><rect x='29' y='29' width='12' height='12'/><circle cx='105' cy='95' r='9'/><rect x='100' y='90' width='10' height='10'/></g><g fill='%23ffc93c' fill-opacity='0.13'><rect x='95' y='25' width='9' height='9' transform='rotate(45 99.5 29.5)'/><rect x='20' y='95' width='7' height='7' transform='rotate(45 23.5 98.5)'/></g></svg>"); background-repeat:repeat; background-size:140px 140px; }
.section-cream{ background:var(--cream); }
.section-head{ text-align:center; margin-bottom:56px; }
.section-title{ font-size:2.4rem; line-height:.95; }
@media(min-width:768px){ .section-title{font-size:4rem;} }

/* stats */
.stats-grid{ max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:repeat(2,1fr); gap:32px; text-align:center; position:relative; z-index:1; }
@media(min-width:768px){ .stats-grid{grid-template-columns:repeat(4,1fr);} }
.stat-num{ font-family:'Anton',sans-serif; font-size:clamp(2.4rem,6vw,4rem); color:var(--gold); line-height:1; }

/* about */
.about-grid{ max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:1fr; gap:48px; align-items:center; }
@media(min-width:1024px){ .about-grid{grid-template-columns:1fr 1.1fr;} }
.about-title{ font-size:2.2rem; line-height:.98; margin:16px 0 22px; }
@media(min-width:768px){ .about-title{font-size:3rem;} }
.about-p{ color:rgba(11,11,16,.7); font-size:1.05rem; line-height:1.7; margin-bottom:16px; }
.about-quote{ margin-top:28px; border-left:4px solid var(--red); padding-left:20px; font-size:1.5rem; line-height:1.25; }
@media(min-width:768px){ .about-quote{font-size:1.9rem;} }
.about-visual{ border-radius:28px; overflow:hidden; position:relative; aspect-ratio:4/5;
  background:
    linear-gradient(155deg, rgba(200,16,46,.4) 0%, rgba(122,10,28,.6) 60%, rgba(122,10,28,.88) 100%),
    url('../images/gallery/gallery-hall-aerial.jpg') center 38%/cover no-repeat; }
.about-visual-caption{ position:absolute; left:24px; right:24px; bottom:24px; color:#fff; text-shadow:0 2px 12px rgba(0,0,0,.5); }

/* pavilions */
.pav-grid{ max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:1fr; gap:22px; position:relative; z-index:1; }
@media(min-width:640px){ .pav-grid{grid-template-columns:1fr 1fr;} }
@media(min-width:1024px){ .pav-grid{grid-template-columns:repeat(3,1fr);} }
.pav-card{ border-radius:22px; padding:30px; transition:transform .3s ease; background-size:cover; background-position:center; }
.pav-card:hover{ transform:translateY(-6px); }
.pav-card-photo{ min-height:280px; display:flex; flex-direction:column; justify-content:flex-end; }

/* gallery */
.gallery-grid{ max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
@media(min-width:640px){ .gallery-grid{grid-template-columns:repeat(4,1fr);} }
.gallery-item{ border-radius:14px; overflow:hidden; aspect-ratio:1; position:relative; }
.gallery-item img{ width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.gallery-item:hover img{ transform:scale(1.08); }
.pav-icon{ font-size:2.4rem; margin-bottom:14px; }
.pav-title{ font-size:1.5rem; color:#fff; margin-bottom:10px; }
.pav-desc{ color:rgba(255,255,255,.72); font-size:.92rem; line-height:1.55; }
.pav-explore{ display:inline-flex; color:rgba(255,255,255,.6); margin-top:16px; }

/* path split (visitor / vendor) */
.path-grid{ max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:1fr; gap:22px; }
@media(min-width:768px){ .path-grid{grid-template-columns:1fr 1fr;} }
.path-card{ display:flex; flex-direction:column; justify-content:flex-end; border-radius:26px; padding:44px 36px; transition:transform .3s ease; background-size:cover; background-position:center; min-height:380px; }
.path-card:hover{ transform:translateY(-6px); }
.path-title{ font-size:2rem; color:#fff; margin-bottom:12px; }
.path-desc{ color:rgba(255,255,255,.75); font-size:1rem; line-height:1.55; max-width:420px; }

/* lineup */
.lineup-head{ max-width:var(--maxw); margin:0 auto 40px; display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px; }
.lineup-list{ max-width:var(--maxw); margin:0 auto; }
.lineup-line{ font-family:'Anton',sans-serif; text-transform:uppercase; line-height:1.05; color:#fff; opacity:.92; margin:2px 0; font-size:9vw; transition:color .2s ease; }
.lineup-line.small{ font-size:7vw; color:rgba(255,255,255,.6); }
.lineup-line.gold{ font-size:6vw; color:var(--gold); }
@media(min-width:768px){ .lineup-line{font-size:4.2rem;} .lineup-line.small{font-size:3rem;} .lineup-line.gold{font-size:2.4rem;} }
.lineup-line:hover{ color:var(--gold); }

/* visit */
.visit-grid{ max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:1fr; gap:18px; }
@media(min-width:640px){ .visit-grid{grid-template-columns:1fr 1fr;} }
@media(min-width:1024px){ .visit-grid{grid-template-columns:repeat(4,1fr);} }
.visit-card{ background:#fff; border-radius:18px; padding:28px; border:1px solid rgba(0,0,0,.06); box-shadow:0 1px 3px rgba(0,0,0,.04); }
.visit-icon{ font-size:1.8rem; margin-bottom:10px; }
.visit-title{ font-size:1.2rem; margin-bottom:6px; }
.visit-body{ color:rgba(11,11,16,.65); font-size:.92rem; line-height:1.5; }
.map-frame{ max-width:var(--maxw); margin:24px auto 0; border-radius:18px; overflow:hidden; border:1px solid rgba(0,0,0,.06); box-shadow:0 1px 3px rgba(0,0,0,.04); }
.map-frame iframe{ width:100%; height:320px; border:0; filter:grayscale(1) contrast(1.15); }

/* tickets band */
.tickets-band{ padding:88px 20px; text-align:center; position:relative; overflow:hidden; background:linear-gradient(120deg,var(--red) 0%, var(--red-dark) 100%); }
.tickets-title{ color:#fff; font-size:2.1rem; line-height:1; margin-bottom:18px; }
@media(min-width:768px){ .tickets-title{font-size:3.6rem;} }
.tickets-body{ color:rgba(255,255,255,.8); max-width:560px; margin:0 auto 30px; }
.tickets-note{ color:rgba(255,255,255,.65); font-size:.85rem; margin-top:18px; }

/* vendors */

/* social */
.social-box{ max-width:640px; margin:0 auto; text-align:center; }
.social-links{ display:flex; align-items:center; justify-content:center; gap:16px; margin-top:22px; }
.social-circle{ width:48px; height:48px; border-radius:999px; background:var(--red); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:12px; transition:background-color .2s ease; }
.social-circle:hover{ background:var(--red); }

/* sponsor logo marquee */
.logo-marquee-section{ padding:56px 20px; background-color:var(--red); background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><g fill='none' stroke='%23ffc93c' stroke-opacity='0.18' stroke-width='2'><circle cx='35' cy='35' r='13'/><rect x='29' y='29' width='12' height='12'/><circle cx='105' cy='95' r='9'/><rect x='100' y='90' width='10' height='10'/></g><g fill='%23ffc93c' fill-opacity='0.13'><rect x='95' y='25' width='9' height='9' transform='rotate(45 99.5 29.5)'/><rect x='20' y='95' width='7' height='7' transform='rotate(45 23.5 98.5)'/></g></svg>"); background-repeat:repeat; background-size:140px 140px; overflow:hidden; position:relative; }
.logo-marquee-row{ overflow:hidden; margin-bottom:16px;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  mask-image:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.logo-marquee-row:last-of-type{ margin-bottom:0; }
.logo-marquee-track{ display:flex; align-items:center; width:max-content; gap:18px; }
.logo-track-ltr{ animation:logoScrollLtr 78s linear infinite; }
.logo-track-rtl{ animation:logoScrollRtl 78s linear infinite; }
.logo-marquee-row:hover .logo-marquee-track{ animation-play-state:paused; }
@keyframes logoScrollLtr{ from{transform:translateX(0);} to{transform:translateX(-50%);} }
@keyframes logoScrollRtl{ from{transform:translateX(-50%);} to{transform:translateX(0);} }
.logo-tile{ width:122px; height:60px; background:#fff; border-radius:10px; display:flex; align-items:center; justify-content:center; padding:10px; flex-shrink:0; }
.logo-tile img{ max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; }
@media(min-width:768px){ .logo-tile{ width:148px; height:72px; padding:12px; } .logo-marquee-track{ gap:22px; } }
.sponsor-note{ text-align:center; color:rgba(255,255,255,.88); font-size:.95rem; line-height:1.5; max-width:640px; margin:24px auto 0; }
.sponsor-cta-row{ text-align:center; margin-top:28px; }

/* footer */
.footer{ background-color:var(--red-dark); background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><g fill='none' stroke='%23ffc93c' stroke-opacity='0.18' stroke-width='2'><circle cx='35' cy='35' r='13'/><rect x='29' y='29' width='12' height='12'/><circle cx='105' cy='95' r='9'/><rect x='100' y='90' width='10' height='10'/></g><g fill='%23ffc93c' fill-opacity='0.13'><rect x='95' y='25' width='9' height='9' transform='rotate(45 99.5 29.5)'/><rect x='20' y='95' width='7' height='7' transform='rotate(45 23.5 98.5)'/></g></svg>"); background-repeat:repeat; background-size:140px 140px; padding:64px 20px 30px; border-top:1px solid rgba(255,255,255,.1); position:relative; overflow:hidden; }
.footer-grid{ max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:1fr; gap:36px; margin-bottom:48px; }
@media(min-width:768px){ .footer-grid{grid-template-columns:repeat(4,1fr);} }
.footer-desc{ color:var(--white-50); font-size:.92rem; line-height:1.6; margin-top:16px; }
.footer-links{ display:flex; flex-direction:column; gap:10px; }
.footer-bottom{ max-width:var(--maxw); margin:0 auto; padding-top:24px; border-top:1px solid rgba(255,255,255,.1); display:flex; flex-direction:column; gap:10px; align-items:center; justify-content:center; color:var(--white-50); font-size:12px; }
@media(min-width:768px){ .footer-bottom{flex-direction:row;} }
.footer-bottom a{ color:rgba(255,255,255,.7); text-decoration:underline; }
.footer-bottom a:hover{ color:var(--gold); }

/* reveal */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s ease; }
.reveal.in{ opacity:1; transform:translateY(0); }

/* misc layout helpers */

/* ---- sub-hero background video (visitor / vendor pages) ---- */
.subhero-video-wrap{ position:absolute; inset:0; z-index:0; overflow:hidden; }
.subhero-video-wrap iframe{ position:absolute; top:50%; left:50%; width:100vw; height:56.25vw; min-height:100vh; min-width:177.78vh; transform:translate(-50%,-50%); pointer-events:none; border:0; }
.subhero-overlay{ position:absolute; inset:0; z-index:1;
  background:
    radial-gradient(120% 90% at 50% -10%, rgba(200,16,46,.5) 0%, rgba(122,10,28,.58) 55%),
    radial-gradient(80% 60% at 85% 100%, rgba(255,201,60,.16) 0%, transparent 60%),
    linear-gradient(rgba(122,10,28,.28), rgba(122,10,28,.45)); }

/* ---- red envelope giveaway section (homepage) ---- */
.red-envelope-section{ padding:72px 20px; text-align:center; position:relative; overflow:hidden;
  background:
    linear-gradient(rgba(58,5,16,.74), rgba(58,5,16,.84)),
    url('../images/red-envelope-cash-banner.jpg') center 40%/cover no-repeat; }
.red-envelope-section::before{ content:""; position:absolute; inset:0; background:radial-gradient(60% 90% at 50% 0%, rgba(255,201,60,.16) 0%, transparent 65%); pointer-events:none; }
.red-envelope-inner{ position:relative; z-index:1; max-width:640px; margin:0 auto; }
.red-envelope-icons{ display:flex; justify-content:center; align-items:flex-end; gap:16px; margin-bottom:18px; }
.re-icon{ display:inline-block; font-size:2.3rem; filter:drop-shadow(0 8px 16px rgba(0,0,0,.35)); animation:reBounce 2.6s ease-in-out infinite; }
.re-icon-1{ animation-delay:0s; }
.re-icon-2{ font-size:3rem; animation-delay:.3s; }
.re-icon-3{ animation-delay:.6s; }
@keyframes reBounce{ 0%,100%{ transform:translateY(0) rotate(-4deg); } 50%{ transform:translateY(-12px) rotate(4deg); } }
@media (prefers-reduced-motion: reduce){ .re-icon, .red-envelope-badge{ animation:none; } }

.red-envelope-body{ color:rgba(255,255,255,.8); font-size:1.05rem; line-height:1.6; margin:18px auto 30px; max-width:520px; }
.red-envelope-badge{ display:inline-block; border:none; cursor:pointer; background:var(--gold); color:var(--red-dark); font-family:'Space Grotesk',sans-serif; font-weight:800; font-size:clamp(1.2rem, 6vw, 2.34rem); line-height:1.15; white-space:nowrap; letter-spacing:.05em; text-transform:uppercase; padding:.64em 1.76em; border-radius:999px; transform:rotate(-4deg); box-shadow:0 10px 24px rgba(0,0,0,.35); margin-bottom:24px; transition:transform .2s ease; -webkit-tap-highlight-color:transparent; }
.red-envelope-badge{ animation:badgeGlow 2.6s ease-in-out infinite; }
.red-envelope-badge:hover{ transform:rotate(-4deg) scale(1.05); }
.red-envelope-badge:focus-visible{ outline:3px solid #fff; outline-offset:5px; }
@keyframes badgeGlow{ 0%,100%{ box-shadow:0 10px 24px rgba(0,0,0,.35); } 50%{ box-shadow:0 10px 30px rgba(255,201,60,.7); } }
/* tap/click: the badge shakes and gold coins burst out (coins are added by main.js) */
/* "Click to Win Cash!" hint above the badge; after a click it says where the real prizes are */
.re-hint{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:clamp(1rem, 3.8vw, 1.35rem); letter-spacing:.04em; color:#fff; margin:0 0 16px; text-shadow:0 2px 10px rgba(0,0,0,.45); }
.re-hint-arrow{ display:inline-block; animation:reHintBob 1.1s ease-in-out infinite; }
@keyframes reHintBob{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(6px); } }
.re-hint.is-done{ color:var(--gold); }
.re-hint.is-done .re-hint-arrow{ display:none; }
@media (prefers-reduced-motion: reduce){ .re-hint-arrow{ animation:none; } }
.red-envelope-badge.is-shaking{ animation:badgeShake .6s ease-in-out, badgeGlow 2.6s ease-in-out infinite; }
@keyframes badgeShake{ 0%,100%{ transform:rotate(-4deg); } 15%{ transform:rotate(-13deg) scale(1.08); } 30%{ transform:rotate(7deg) scale(1.08); } 45%{ transform:rotate(-11deg) scale(1.06); } 60%{ transform:rotate(3deg) scale(1.04); } 78%{ transform:rotate(-7deg); } }
.coin-pop{ position:absolute; width:30px; height:30px; margin:-15px 0 0 -15px; pointer-events:none; z-index:5; will-change:transform, opacity;
  background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'><circle cx='20' cy='20' r='18.5' fill='%23ffc93c' stroke='%23b8860b' stroke-width='2'/><circle cx='20' cy='20' r='13.5' fill='none' stroke='%237a0a1c' stroke-width='1.2' opacity='.45'/><rect x='15' y='15' width='10' height='10' fill='%237a0a1c'/></svg>") center/contain no-repeat; filter:drop-shadow(0 3px 5px rgba(0,0,0,.35)); }

/* ---- hero high-energy layer: fireworks + confetti + lanterns ---- */
.hero-energy{ position:absolute; inset:0; z-index:4; pointer-events:none; overflow:hidden; }
.firework{ position:absolute; opacity:0; transform:scale(.4); animation:fireworkBurst 4.2s ease-out infinite; filter:drop-shadow(0 0 6px rgba(255,201,60,.5)); }
.firework svg{ width:100%; height:100%; display:block; }
.firework-a{ top:12%; left:10%; width:110px; animation-delay:.1s; }
.firework-b{ top:8%; right:9%; width:86px; animation-delay:1.5s; }
.firework-c{ top:34%; left:48%; width:70px; animation-delay:2.9s; }
@media(min-width:768px){ .firework-a{width:170px;} .firework-b{width:130px;} .firework-c{width:108px;} }
@keyframes fireworkBurst{
  0%{ opacity:0; transform:scale(.25) rotate(0deg); }
  9%{ opacity:1; transform:scale(1) rotate(5deg); }
  30%{ opacity:.85; transform:scale(1.14) rotate(0deg); }
  58%{ opacity:0; transform:scale(1.3) rotate(-4deg); }
  100%{ opacity:0; transform:scale(1.32); }
}
.confetti-piece{ position:absolute; top:-30px; opacity:0; animation:confettiFall linear infinite; border-radius:2px; }
/* shorter page-top banners (Visitor, Vendor): shorter fall so the same number of pieces stays in view */
.sub-hero .confetti-piece{ --fall:62vh; }
/* falling gold coins + red envelopes (replaced the plain color sparks, September 25) */
.confetti-coin{ background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'><circle cx='20' cy='20' r='18.5' fill='%23ffc93c' stroke='%23b8860b' stroke-width='2'/><circle cx='20' cy='20' r='13.5' fill='none' stroke='%237a0a1c' stroke-width='1.2' opacity='.45'/><rect x='15' y='15' width='10' height='10' fill='%237a0a1c'/></svg>") center/contain no-repeat; border-radius:50%; filter:drop-shadow(0 1px 2px rgba(0,0,0,.3)); }
.confetti-envelope{ background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 39'><rect x='1' y='1' width='28' height='37' rx='2.5' fill='%23e0142f' stroke='%23ffc93c' stroke-width='1.6'/><path d='M1.5 3 L15 15 L28.5 3' fill='none' stroke='%23ffc93c' stroke-width='1.6'/><circle cx='15' cy='22' r='5' fill='%23ffc93c'/></svg>") center/contain no-repeat; border-radius:2px; filter:drop-shadow(0 1px 2px rgba(0,0,0,.3)); }
@keyframes confettiFall{
  0%{ opacity:0; transform:translateY(0) translateX(0) rotate(0deg); }
  6%{ opacity:.95; }
  90%{ opacity:.55; }
  100%{ opacity:0; transform:translateY(var(--fall,115vh)) translateX(var(--drift,24px)) rotate(340deg); }
}
.lantern-a{ animation:floatA 5.5s ease-in-out infinite; }
.lantern-b{ animation:floatB 6.4s ease-in-out infinite; }
.hero-glow{ position:absolute; inset:0; z-index:2; pointer-events:none;
  background: radial-gradient(38% 46% at 50% 30%, rgba(255,201,60,.22) 0%, transparent 70%); }

/* ===== EXPERIENCE HIGHLIGHTS STRIP ===== */
.highlights-strip{ display:flex; flex-wrap:wrap; justify-content:center; align-items:flex-start; max-width:var(--maxw); margin:0 auto; position:relative; z-index:1; }
.highlight-item{ flex:1 1 0; min-width:130px; text-align:center; padding:0 18px; position:relative; }
.highlight-item:not(:last-child){ border-right:1px solid rgba(11,11,16,.1); }
@media(max-width:700px){
  .highlight-item{ flex:1 1 45%; border-right:none; margin-bottom:22px; }
}
.highlight-icon{ font-size:1.9rem; margin-bottom:10px; }
.highlight-title{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:.88rem; color:var(--ink); text-transform:uppercase; letter-spacing:.01em; margin-bottom:4px; }
.highlight-sub{ font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:.68rem; letter-spacing:.05em; text-transform:uppercase; color:rgba(11,11,16,.5); }
.highlights-strip.on-dark .highlight-item:not(:last-child){ border-right-color:rgba(255,255,255,.18); }
.highlights-strip.on-dark .highlight-title{ color:#fff; }
.highlights-strip.on-dark .highlight-sub{ color:rgba(255,255,255,.55); }

/* ===== FAQ NUMBERING ===== */
.faq-item{ counter-increment:faq; }
.faq-q::before{ content:counter(faq) "."; color:var(--red); font-family:'Space Grotesk',sans-serif; font-weight:700; margin-right:8px; }

/* ===== Consolidated shared component styles (moved from per-page <style> blocks) ===== */
.crumb{ font-family:'Space Grotesk',sans-serif; font-size:12px; letter-spacing:.1em; color:rgba(255,255,255,.5); margin-bottom:18px; text-transform:uppercase; }
.crumb a{ color:rgba(255,255,255,.8); }
.crumb a:hover{ color:var(--gold); }
.hub-card{ display:flex; flex-direction:column; gap:10px; background:#fff; border:1px solid rgba(0,0,0,.08); border-radius:20px; padding:26px 22px; transition:transform .2s ease, box-shadow .2s ease; }
.hub-card:hover{ transform:translateY(-4px); box-shadow:0 16px 40px rgba(0,0,0,.1); }
.hub-card .hub-ico{ font-size:1.8rem; }
.hub-card .hub-title{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.05rem; color:var(--ink); }
.hub-card .hub-desc{ color:rgba(11,11,16,.6); font-size:.88rem; line-height:1.5; flex:1; }
.hub-card .hub-arrow{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:var(--red); }
.hub-grid-dark .hub-card{ background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); }
.hub-grid-dark .hub-card .hub-title{ color:#fff; }
.hub-grid-dark .hub-card .hub-desc{ color:rgba(255,255,255,.62); }
.faq-item{ border-bottom:1px solid rgba(11,11,16,.1); padding:22px 0; }
.faq-q{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.05rem; margin-bottom:8px; }
.faq-a{ color:rgba(11,11,16,.68); line-height:1.6; }

.info-card{ background:#fff; border:1px solid rgba(0,0,0,.08); border-radius:18px; padding:26px; }
.info-card.dark{ background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); }
.info-card.dark .info-title{ color:#fff; }
.info-card.dark .info-body{ color:rgba(255,255,255,.65); }
.info-title{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.05rem; color:var(--ink); margin-bottom:8px; }
.info-body{ color:rgba(11,11,16,.65); font-size:.92rem; line-height:1.6; }
.doc-ico{ font-size:1.4rem; flex-shrink:0; margin-top:2px; }
.doc-title{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:.95rem; color:var(--ink); margin-bottom:4px; }
.doc-link:hover{ text-decoration:underline; }

.cat-chip{ background:#fff; border:1px solid rgba(0,0,0,.08); border-radius:14px; padding:16px 14px; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:.85rem; letter-spacing:.02em; color:var(--ink); text-align:center; }
.cat-chip.food{ background:var(--gold); border-color:var(--gold); }
.hotel-visual{ position:relative; min-height:240px; background:
    linear-gradient(155deg, rgba(200,16,46,.4) 0%, rgba(122,10,28,.6) 60%, rgba(122,10,28,.9) 100%),
    url('../assets/images/vendor-hero.jpg') center/cover; padding:28px; display:flex; flex-direction:column; justify-content:flex-end; }
.hotel-visual .stars{ color:var(--gold); font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:.85rem; margin-bottom:8px; }
.hotel-visual h2{ color:#fff; font-family:'Anton',sans-serif; font-size:1.7rem; line-height:1.1; }
.hotel-body{ padding:32px 30px; }
.rate-row{ display:flex; align-items:baseline; gap:10px; margin-bottom:6px; }
.rate-num{ font-family:'Anton',sans-serif; font-size:2.6rem; color:var(--red); line-height:1; }
.rate-unit{ font-family:'Space Grotesk',sans-serif; font-size:.85rem; color:rgba(11,11,16,.5); }
.rate-note{ color:rgba(11,11,16,.55); font-size:.82rem; margin-bottom:22px; }
.hotel-facts{ display:flex; flex-direction:column; gap:10px; margin-bottom:26px; }
.hotel-fact{ display:flex; gap:10px; font-size:.88rem; color:rgba(11,11,16,.72); }
.hotel-fact .ico{ flex-shrink:0; }
.hotel-cta{ display:flex; gap:10px; flex-wrap:wrap; }
.booth-diagram-card{ background:#fff; border:1px solid rgba(0,0,0,.08); border-radius:16px; padding:16px; text-align:center; }
.booth-diagram-card img{ width:100%; height:auto; max-width:340px; display:block; margin:0 auto 10px; }
.booth-diagram-label{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:.9rem; color:var(--ink); margin-bottom:4px; }
.booth-diagram-desc{ color:rgba(11,11,16,.6); font-size:.82rem; line-height:1.5; }
.booth-single-frame{ max-width:520px; margin:0 auto 28px; background:#fff; border:1px solid rgba(0,0,0,.08); border-radius:16px; padding:20px; text-align:center; }
.booth-single-frame img{ width:100%; height:auto; max-width:420px; display:block; margin:0 auto; }


/* ---- Shared page components (moved here from identical copies in page <style> blocks) ---- */
.info-grid{ max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:1fr; gap:18px; }
.info-card .hub-ico{ font-size:1.8rem; margin-bottom:8px; }
.hub-grid{ max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:1fr; gap:16px; }
.booth-diagram-grid{ max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:1fr; gap:16px; }
.steps{ max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:1fr; gap:20px; }
@media(min-width:768px){ .info-grid{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:640px){ .hub-grid{ grid-template-columns:repeat(2,1fr); } .booth-diagram-grid{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:1024px){ .hub-grid{ grid-template-columns:repeat(4,1fr); } .steps{ grid-template-columns:repeat(3,1fr); } }

/* ---- Hub card rows with fewer than 4 cards: keep them centered instead of hugging the left ---- */
@media(min-width:640px) and (max-width:1023px){ .hub-grid.cols-3 > :last-child{ grid-column:1 / -1; justify-self:center; width:calc(50% - 8px); } }
@media(min-width:1024px){ .hub-grid.cols-2{ grid-template-columns:repeat(2, minmax(0, 288px)); justify-content:center; } .hub-grid.cols-3{ grid-template-columns:repeat(3, minmax(0, 1fr)); } }

/* ---- Respect "reduce motion" (fireworks, confetti, floating icons, marquees, reveal slide-ins) ---- */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}

/* ============ LANGUAGE-AWARE TYPOGRAPHY ============
   Anton, Space Grotesk and Plus Jakarta Sans have no Chinese, Japanese or Korean letters, so
   browsers fall back to the visitor's system font for those (chosen by <html lang>, which
   main.js sets on every language switch). These rules only adjust weight, spacing and line
   breaks for the non-English languages. English only changes in rule 8 (header). */
:root{ --cjk-font: sans-serif; }
:lang(zh-CN){ --cjk-font:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC","Noto Sans CJK SC","Source Han Sans SC",sans-serif; }
:lang(zh-TW){ --cjk-font:"PingFang TC","Microsoft JhengHei","Noto Sans TC","Noto Sans CJK TC","Source Han Sans TC",sans-serif; }
:lang(ja){ --cjk-font:"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic","Meiryo","Noto Sans JP","Noto Sans CJK JP",sans-serif; }
:lang(ko){ --cjk-font:"Apple SD Gothic Neo","Malgun Gothic","Noto Sans KR","Noto Sans CJK KR",sans-serif; }

/* 1. CJK headlines: bold native font (Anton keeps the numbers and Latin words), no fake bold on Anton, room between lines */
:is(:lang(zh),:lang(ja),:lang(ko)) .font-display{ font-family:'Anton', var(--cjk-font); font-weight:900; font-synthesis:none; letter-spacing:0; }
:is(:lang(zh),:lang(ja),:lang(ko)) :is(.section-title,.about-title,.tickets-title,h1.font-display,h2.font-display,h3.font-display){ line-height:1.18; }
html:is(:lang(zh),:lang(ko)) h1.hero-title{ line-height:1.1; }  /* hero shows the Chinese/Korean name */
html:is(:lang(ja),:lang(vi),:lang(tl)) h1.hero-title{ line-height:.92; } /* hero shows the English name */

/* 2. CJK small labels: English-style wide letter-spacing breaks words apart; 11px is too small for CJK */
:is(:lang(zh),:lang(ja),:lang(ko)) :is(.tag,.nav-link,.btn,.hero-sub,.crumb,.mobile-menu a,.hub-arrow,.highlight-title,.highlight-sub,.red-envelope-badge){ letter-spacing:.03em; }
:is(:lang(zh),:lang(ja),:lang(ko)) :is(.tag,.highlight-sub,.price-cat,.zod-label,.zod-meta-label,.crumb){ font-size:12.5px; }
:is(:lang(zh),:lang(ja),:lang(ko)) :is(.nav-link,.btn){ font-size:13px; }
:is(:lang(zh),:lang(ja),:lang(ko)) .hero-sub{ font-size:15px; }

/* 3. Korean breaks lines between words, not inside them */
:lang(ko){ word-break:keep-all; overflow-wrap:break-word; }

/* 4. Even line lengths in headlines, so no line ends with one lonely character */
:is(:lang(zh),:lang(ja),:lang(ko),:lang(vi),:lang(tl)) :is(h1,h2,h3,.faq-q){ text-wrap:balance; }

/* 5. Vietnamese: stacked accents need a little more line height in the big headlines */
:lang(vi) :is(.section-title,.about-title,.tickets-title,h1.font-display,h2.font-display,h3.font-display){ line-height:1.15; }

/* 6. Longer Vietnamese/Tagalog menu words: keep each menu item and the Tickets button on one line */
:is(:lang(vi),:lang(tl)) .nav-link{ letter-spacing:.05em; white-space:nowrap; }
:is(:lang(vi),:lang(tl)) .main-nav{ gap:18px; } /* ≥1280px */
#site-header .btn{ white-space:nowrap; }

/* 7. Chinese headlines break at the spaces between phrases (not inside a word like 品牌);
      Japanese headlines break between natural phrases where the browser supports it */
:lang(zh) .cjk-phrases{ word-break:keep-all; overflow-wrap:anywhere; } /* class added by main.js to headlines that contain spaces */
:lang(ja) :is(h1,h2,h3){ word-break:auto-phrase; }

/* 8. Header, all languages: the logo keeps its shape and menu items never break onto two lines */
#site-header .logo{ flex-shrink:0; }
.main-nav .nav-link{ white-space:nowrap; }
@media(min-width:1024px) and (max-width:1199px){ .main-nav{ gap:16px; } .main-nav .nav-link{ letter-spacing:.06em; } }
/* Vietnamese and Tagalog menus are too long for one row below 1280px: use the menu button there */
@media(min-width:1024px) and (max-width:1279px){
  :is(:lang(vi),:lang(tl)) .main-nav{ display:none; }
  :is(:lang(vi),:lang(tl)) .icon-btn{ display:flex; }
  html:is(:lang(vi),:lang(tl)) .mobile-menu:not(.hidden){ display:flex !important; }
}

/* ===== 2027 Year of the Ram mascot (animated WebP with transparency; still image for reduce-motion) ===== */
.ram-mascot{ pointer-events:none; filter:drop-shadow(0 14px 22px rgba(0,0,0,.35)); }
.ram-mascot img{ display:block; width:100%; height:auto; }
/* homepage hero: girl-with-dragon mascot. Phones/tablets: small, centered under the buttons (lighter -sm file). Desktop: bottom-right */
.girl-mascot-hero{ display:block; position:relative; z-index:5; width:150px; margin:18px auto 30px; }
@media(min-width:1024px){ .girl-mascot-hero{ display:block; position:absolute; z-index:5; right:3%; bottom:3%; width:clamp(210px,19vw,300px); margin:0; } }
/* homepage Win Cash section: small and centered above the badge on phones/tablets, beside the text on desktop */
.ram-mascot-envelope{ position:relative; z-index:1; width:170px; margin:0 auto 18px; }
@media(max-width:1023px){ .red-envelope-section .red-envelope-icons{ display:none; } }
@media(min-width:1024px){ .ram-mascot-envelope{ position:absolute; left:6%; bottom:48px; width:clamp(220px,19vw,290px); margin:0; } }
/* Lunar New Year page, Year of the Ram section: centered above the heading */
.ram-mascot-lny{ position:relative; z-index:1; width:clamp(170px,22vw,240px); margin:0 auto 10px; }

/* ---- YouTube videos (Vendor & Sponsor pages): a thumbnail first; the YouTube player loads only after a click ---- */
.video-group{ max-width:1100px; margin:0 auto; position:relative; z-index:3; }
.video-group + .video-group{ margin-top:52px; }
.video-group-label{ display:flex; align-items:center; gap:14px; margin-bottom:20px; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); }
.video-group-label::before, .video-group-label::after{ content:""; flex:1; height:1px; background:rgba(255,201,60,.35); }
.video-grid{ display:grid; gap:18px; }
@media(max-width:767px){ .video-grid{ grid-auto-flow:column; grid-auto-columns:82%; overflow-x:auto; scroll-snap-type:x mandatory; padding:4px 2px 14px; scrollbar-width:thin; scrollbar-color:rgba(255,201,60,.5) transparent; } .video-card{ scroll-snap-align:center; } }
@media(min-width:768px){ .video-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; } }
.video-card{ margin:0; }
.yt-lite, .yt-frame{ position:relative; display:block; width:100%; aspect-ratio:16/9; padding:0; border:2px solid rgba(255,201,60,.35); border-radius:16px; overflow:hidden; background:#000; box-shadow:0 18px 40px -18px rgba(0,0,0,.6); }
.yt-lite{ cursor:pointer; }
.yt-lite img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .35s ease; }
.yt-lite:hover img, .yt-lite:focus-visible img{ transform:scale(1.04); }
.yt-lite:focus-visible{ outline:3px solid var(--gold); outline-offset:3px; }
.yt-play{ position:absolute; left:50%; top:50%; width:64px; height:46px; transform:translate(-50%,-50%); background:var(--red); border:2px solid var(--gold); border-radius:14px; box-shadow:0 8px 24px rgba(0,0,0,.45); transition:transform .2s ease; }
.yt-play::before{ content:""; position:absolute; left:52%; top:50%; transform:translate(-50%,-50%); border-style:solid; border-width:10px 0 10px 17px; border-color:transparent transparent transparent #fff; }
.yt-lite:hover .yt-play{ transform:translate(-50%,-50%) scale(1.08); }
.yt-frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.video-card figcaption{ margin-top:12px; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.85); text-align:center; }
@media (prefers-reduced-motion: reduce){ .yt-lite img, .yt-play{ transition:none; } }
@media(min-width:768px){ .footer-bottom{ column-gap:28px; } }

/* ---- Language menu in the slim headers (Apply form, thank-you and 404 pages) ---- */
.slim-header{ position:relative; z-index:60; }
.slim-header .lang-wrap{ position:absolute; right:16px; top:50%; transform:translateY(-50%); }
@media(min-width:768px){ .slim-header .lang-wrap{ right:28px; } }
/* Small phones: logo moves to the left so it never sits under the language button */
@media(max-width:479px){ header.slim-header{ justify-content:flex-start; } }

/* ---- No lone last word on its own line (all pages, all languages) ---- */
/* Headings, labels and centered lines: even line lengths. Body text: the last line always keeps at least 2 words. */
h1,h2,h3,h4,.font-display,.faq-q,.tag,.highlight-title,.highlight-sub,.hero-sub,.crumb,figcaption,.map-caption,.sponsor-note,.section-head p,.red-envelope-body,.re-hint{ text-wrap:balance; }
p,li,dd,blockquote,summary,.faq-a,.info-body,.pav-desc,.visit-body{ text-wrap:pretty; }

/* Phones: headline size follows the screen width a little, so the last two words fit on one line */
@media(max-width:767px){ .section-title{ font-size:clamp(2rem, 9.6vw, 2.4rem); } }

/* ---- Pavilion card with a looping background video (Red Envelope Giveaway on the homepage) ---- */
.pav-card-video{ position:relative; overflow:hidden; isolation:isolate; }
.pav-card-video .pav-bg-video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; pointer-events:none; }
.pav-card-video .pav-bg-shade{ position:absolute; inset:0; z-index:-1; pointer-events:none; background:linear-gradient(180deg, rgba(200,16,46,.08) 0%, rgba(58,5,16,.30) 45%, rgba(58,5,16,.92) 90%); }
/* Red Envelopes page: a thin line between the two cream sections (Brand Ambassadors, then The Tradition) */
#ambassadors + .section-cream{ border-top:1px solid rgba(11,11,16,.08); }

/* Header: menu button whenever the full menu does not fit on one row (class set by main.js; all languages) */
@media(min-width:1024px){
  html.nav-compact .main-nav{ display:none; }
  html.nav-compact .icon-btn{ display:flex; }
  html.nav-compact .mobile-menu:not(.hidden){ display:flex !important; }
}

/* Header with 8 menu items: slightly tighter spacing from 1200px up, so the full menu fits the 1200px content width */
@media(min-width:1200px){
  .main-nav{ gap:20px; }
  .main-nav .nav-link{ letter-spacing:.08em; }
  :is(:lang(vi),:lang(tl)) .main-nav{ gap:14px; }
  :is(:lang(vi),:lang(tl)) .main-nav .nav-link{ font-size:11px; letter-spacing:.05em; }
}

/* CJK: page-specific small labels also get 12.5px (these pages set their own sizes after style.css) */
html:is(:lang(zh),:lang(ja),:lang(ko)) :is(.tag,.price-card .price-cat,.lp-stat-label,.lp-note,.ty-badge,.jump-label){ font-size:12.5px; }
/* Apply page headline: room for CJK glyphs and Vietnamese accents */
html:is(:lang(zh),:lang(ja),:lang(ko)) .lp-hero h1{ line-height:1.18; }
html:lang(vi) .lp-hero h1{ line-height:1.15; }

/* Homepage hero label on phones: the longer claim runs to 2–3 lines, so it becomes a rounded box that hides the lanterns behind it */
@media(max-width:639px){ .hero .kicker{ border-radius:16px; background-color:rgba(90,8,22,.82); line-height:1.5; } }