/* ============================================================
   Scholar Model UN Summit 2026
   Palette: UN light blue + gold
   ============================================================ */
:root{
  /* blues */
  --un-blue:#5B92E5;        /* official UN flag blue */
  --un-blue-lt:#8FBAF2;
  --un-blue-dp:#3A74C9;     /* deeper blue for contrast on white */
  --navy:#0D2A54;           /* dark sections */
  --navy-2:#143C71;
  --navy-3:#081D3D;
  /* gold */
  --gold:#C9A227;
  --gold-dp:#94700A;        /* gold text on light backgrounds (AA) */
  --gold-lt:#EFD07E;        /* gold on dark backgrounds */
  /* neutrals */
  --ink:#0F2A52;            /* headings */
  --text:#46608A;
  --muted:#5F728D;   /* was #6B7F9B — 4.09:1 on white, under the 4.5:1 AA floor */
  --bg-soft:#EEF4FC;
  --blue-soft:#E1EDFB;
  --gold-soft:#FBF3DE;
  --line:#DCE7F5;
  --white:#fff;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Poppins',sans-serif;color:var(--text);background:#fff;overflow-x:hidden}
h1,h2,h3,h4{font-family:'Sora','Poppins',sans-serif;color:var(--ink)}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:1360px;margin:0 auto;padding:0 40px}
@media(max-width:760px){.wrap{padding:0 20px}}
.section{padding:100px 0}
.center{text-align:center}

/* section labels & headings */
.kicker{font-family:'Montserrat',sans-serif;font-size:.76rem;font-weight:800;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-dp);display:inline-flex;align-items:center;gap:14px;margin-bottom:18px}
.kicker::before,.kicker::after{content:"";width:26px;height:2px;background:var(--gold);border-radius:2px}
.center .kicker{justify-content:center}
h2.title{font-size:clamp(2rem,4.3vw,3.3rem);font-weight:800;line-height:1.14;margin-bottom:20px;letter-spacing:-.01em}
h2.title em{font-style:normal;color:var(--un-blue-dp)}
p.lead{color:var(--muted);font-size:1.06rem;line-height:1.85;max-width:820px}
.center p.lead{margin-left:auto;margin-right:auto}

.reveal{opacity:0;transform:translateY(32px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;font-weight:700;padding:17px 36px;border-radius:999px;font-size:.98rem;transition:.3s;cursor:pointer;border:none;font-family:'Poppins',sans-serif}
.btn-gold{background:linear-gradient(100deg,#E0B84C,#C9A227);color:#2B1F00;box-shadow:0 12px 30px rgba(201,162,39,.35)}
.btn-gold:hover{transform:translateY(-3px);box-shadow:0 18px 42px rgba(201,162,39,.45)}
.btn-ghost{border:1.5px solid rgba(255,255,255,.45);color:#fff;background:transparent}
.btn-ghost:hover{background:rgba(255,255,255,.12);border-color:var(--gold-lt)}
.btn-white{background:#fff;color:var(--ink);font-family:'Montserrat',sans-serif;font-weight:800;letter-spacing:.1em;font-size:.82rem;border-radius:12px;width:100%;justify-content:center;padding:16px 20px}
.btn-white:hover{transform:translateY(-2px)}

/* ---------- header ---------- */
header{position:fixed;inset:0 0 auto 0;z-index:50;transition:.35s;padding:16px 0}
header.scrolled{background:rgba(13,42,84,.95);backdrop-filter:blur(14px);padding:8px 0;box-shadow:0 8px 30px rgba(6,20,44,.35)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{display:flex;align-items:center;gap:13px;color:#fff}
.logo b{font-family:'Montserrat',sans-serif;font-size:.78rem;font-weight:800;line-height:1.4;letter-spacing:.1em}
.logo b span{display:block;font-weight:600;font-size:.66rem;letter-spacing:.2em;color:var(--gold-lt)}
.nav-links{display:flex;gap:30px;list-style:none;align-items:center}
.nav-links a{color:rgba(255,255,255,.92);font-size:.94rem;font-weight:500;transition:.25s}
.nav-links a:hover{color:var(--gold-lt)}

/* mobile menu */
.nav-toggle{display:none;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.28);border-radius:11px;width:46px;height:46px;cursor:pointer;flex-direction:column;gap:5px;align-items:center;justify-content:center;flex:none}
.nav-toggle span{display:block;width:20px;height:2px;background:#fff;border-radius:2px;transition:.3s}
.nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle.open span:nth-child(2){opacity:0}
.nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-nav{display:none;position:fixed;top:0;left:0;right:0;background:rgba(11,34,68,.985);padding:96px 24px 30px;z-index:45;
  transform:translateY(-102%);transition:transform .4s cubic-bezier(.4,0,.2,1);box-shadow:0 20px 50px rgba(0,0,0,.45);max-height:100dvh;overflow-y:auto}
.mobile-nav.open{transform:translateY(0)}
.mobile-nav a{display:block;color:#fff;font-size:1.05rem;font-weight:600;padding:15px 2px;border-bottom:1px solid rgba(255,255,255,.1)}
.mobile-nav a:active{color:var(--gold-lt)}
.mobile-nav .btn{margin-top:22px;width:100%;justify-content:center;border-bottom:none}
@media(max-width:1079px){
  .nav-links{display:none}
  .nav-toggle{display:flex}
  .mobile-nav{display:block}
}

/* ---------- hero ---------- */
.hero{min-height:100vh;position:relative;display:flex;align-items:center;color:#fff;padding:120px 0 70px;overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:-2}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(105deg,rgba(8,26,56,.93) 0%,rgba(13,42,84,.82) 45%,rgba(58,116,201,.55) 100%)}
.hero-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:60px;align-items:center;width:100%}
@media(max-width:1080px){.hero-grid{grid-template-columns:1fr}}
.hero .eyebrow{display:inline-flex;align-items:center;gap:12px;font-family:'Montserrat',sans-serif;font-size:.72rem;font-weight:800;letter-spacing:.28em;color:var(--gold-lt);margin-bottom:22px}
.hero .eyebrow::before{content:"";width:34px;height:2px;background:var(--gold)}
.hero h1{font-size:clamp(2.3rem,4.8vw,3.9rem);font-weight:800;line-height:1.05;color:#fff;letter-spacing:-.015em}
.hero h1 em{font-style:normal;color:var(--gold-lt)}
.hero .tagline{font-family:'Montserrat',sans-serif;font-size:clamp(.8rem,1.4vw,.98rem);font-weight:700;letter-spacing:.3em;color:var(--un-blue-lt);margin:16px 0 16px}
.hero .sub{color:rgba(255,255,255,.82);font-size:1.02rem;line-height:1.75;max-width:560px;margin-bottom:24px}
.hero-tags{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:26px}
.hero-tags span{display:inline-flex;align-items:center;gap:9px;font-family:'Montserrat',sans-serif;font-size:.7rem;font-weight:800;letter-spacing:.15em;color:#fff;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);padding:9px 18px;border-radius:999px;backdrop-filter:blur(6px)}
.hero-tags i{width:6px;height:6px;border-radius:50%;background:var(--gold-lt);font-style:normal}
.count-pill{display:inline-flex;align-items:center;gap:10px;border:1px solid rgba(239,208,126,.45);border-radius:999px;padding:8px 20px;font-family:'Montserrat',sans-serif;font-size:.66rem;font-weight:800;letter-spacing:.22em;color:var(--gold-lt);margin-bottom:16px;background:rgba(13,42,84,.4)}
.count-pill::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--gold-lt);animation:pulseDot 1.6s ease-out infinite}
@keyframes pulseDot{0%{box-shadow:0 0 0 0 rgba(239,208,126,.65)}100%{box-shadow:0 0 0 12px rgba(239,208,126,0)}}
.countdown{display:flex;gap:9px;justify-content:center}
.count-box{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.2);border-bottom:3px solid var(--gold);border-radius:12px;padding:12px 6px;min-width:66px;text-align:center}
.count-box b{font-family:'Sora',sans-serif;font-size:1.7rem;display:block;color:#fff;line-height:1.1}
.count-box span{font-size:.53rem;letter-spacing:.16em;color:rgba(255,255,255,.7);font-family:'Montserrat',sans-serif;font-weight:700}
.hero-cta{display:flex;gap:16px;flex-wrap:wrap}

/* countdown panel — centred in the orbit on desktop, stacked below on smaller screens */
.hero-side{position:relative}
.countdown-panel{background:rgba(8,26,56,.6);border:1px solid rgba(255,255,255,.18);border-radius:20px;padding:22px 26px;text-align:center;backdrop-filter:blur(8px)}
@media(min-width:1080px){
  .hero-side{height:430px}
  .countdown-panel{position:absolute;inset:0;margin:auto;width:max-content;height:max-content}
}
@media(max-width:1079px){
  .orbit-ring,.info-card{display:none}
  .countdown-panel{margin-top:28px;max-width:420px}
}
.orbit-ring{position:absolute;inset:0;margin:auto;width:370px;height:370px;border:1.5px dashed rgba(143,186,242,.4);border-radius:50%;animation:spinSlow 34s linear infinite}
.orbit-ring::after{content:"";position:absolute;top:-7px;left:calc(50% - 7px);width:14px;height:14px;border-radius:50%;background:var(--gold);box-shadow:0 0 18px rgba(201,162,39,.8)}
.orbit-ring.inner{width:250px;height:250px;border-style:solid;border-color:rgba(255,255,255,.14);animation-duration:24s;animation-direction:reverse}
.orbit-ring.inner::after{background:var(--un-blue-lt);box-shadow:0 0 16px rgba(143,186,242,.8)}
@keyframes spinSlow{to{transform:rotate(360deg)}}
.info-card{position:absolute;background:#fff;border-radius:16px;padding:17px 22px;display:flex;gap:15px;align-items:center;box-shadow:0 22px 55px rgba(6,20,44,.4);animation:floatY 6s ease-in-out infinite;border-left:3px solid var(--gold)}
.info-card.c1{top:-4px;right:-24px}
.info-card.c2{bottom:-4px;left:-70px;animation-delay:-3s;border-left-color:var(--un-blue)}
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-15px)}}
.info-card .ic{width:44px;height:44px;border-radius:12px;background:var(--blue-soft);display:flex;align-items:center;justify-content:center;color:var(--un-blue-dp);font-size:1.15rem}
.info-card.c1 .ic{background:var(--gold-soft);color:var(--gold-dp)}
.info-card span{font-family:'Montserrat',sans-serif;font-size:.6rem;font-weight:800;letter-spacing:.18em;color:var(--muted);display:block;margin-bottom:4px}
.info-card b{font-family:'Sora',sans-serif;color:var(--ink);font-size:.95rem}

/* ---------- ticker ---------- */
.ticker{background:linear-gradient(90deg,var(--navy),var(--navy-2) 50%,var(--navy));color:var(--gold-lt);overflow:hidden;padding:16px 0;white-space:nowrap;border-top:1px solid rgba(239,208,126,.25);border-bottom:1px solid rgba(239,208,126,.25)}
.ticker-track{display:inline-flex;animation:scrollX 34s linear infinite}
.ticker-track span{font-family:'Montserrat',sans-serif;font-weight:800;font-size:.8rem;letter-spacing:.2em;padding:0 24px}
.ticker-track span.dot{color:var(--un-blue)}
@keyframes scrollX{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- about ---------- */
.about{background:linear-gradient(140deg,#F3F8FE 0%,#fff 48%,#FBF7EC 100%)}
.about-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}
@media(max-width:1000px){.about-grid{grid-template-columns:1fr}}
.about p{color:var(--text);font-size:1.05rem;line-height:1.9;margin-bottom:22px}
.about b{color:var(--ink)}
.quote-band{border-left:4px solid var(--gold);background:linear-gradient(90deg,var(--gold-soft),transparent);border-radius:0 14px 14px 0;padding:22px 28px;margin-bottom:28px}
.quote-band b{font-family:'Sora',sans-serif;font-size:1.25rem;color:var(--ink);display:block;line-height:1.4}
.quote-band span{font-family:'Montserrat',sans-serif;font-size:.7rem;font-weight:800;letter-spacing:.2em;color:var(--gold-dp);display:block;margin-top:8px}
.mini-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media(max-width:620px){.mini-stats{grid-template-columns:1fr 1fr}}
.mini{background:#fff;border:1px solid var(--line);border-bottom:3px solid var(--un-blue);border-radius:14px;padding:22px 18px;box-shadow:0 10px 28px rgba(13,42,84,.06);text-align:center}
.mini:nth-child(2){border-bottom-color:var(--gold)}
.mini:nth-child(3){border-bottom-color:var(--un-blue-dp)}
.mini:nth-child(4){border-bottom-color:var(--gold)}
.mini b{font-family:'Sora',sans-serif;font-size:2rem;color:var(--ink);display:block;line-height:1.1}
.mini span{font-family:'Montserrat',sans-serif;font-size:.62rem;font-weight:800;letter-spacing:.13em;color:var(--muted);display:block;margin-top:6px}
.about-visual{position:relative}
.about-visual .photo{width:100%;aspect-ratio:1/.95;border-radius:50% 50% 46% 54%/55% 50% 50% 45%;overflow:hidden;box-shadow:0 30px 70px rgba(13,42,84,.18)}
.edition-tag{position:absolute;left:-10px;bottom:34px;background:var(--navy);color:#fff;border-radius:18px;padding:20px 32px;text-align:center;box-shadow:0 20px 50px rgba(13,42,84,.4);border-bottom:3px solid var(--gold)}
.edition-tag b{font-family:'Sora',sans-serif;font-size:1.4rem;display:block}
.edition-tag span{font-family:'Montserrat',sans-serif;font-size:.64rem;font-weight:800;letter-spacing:.2em;color:var(--gold-lt)}

/* ---------- wave dividers ---------- */
.wave{display:block;width:100%;height:100px}

/* ---------- cards grids ---------- */
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(310px,100%),1fr));gap:26px;margin-top:56px}

/* pillar / icon cards */
.icard{background:#fff;border-radius:18px;padding:38px 32px;box-shadow:0 14px 40px rgba(13,42,84,.07);transition:.35s;border:1px solid var(--line);position:relative;overflow:hidden}
.icard::after{content:"";position:absolute;inset:auto 0 0 0;height:3px;background:linear-gradient(90deg,var(--gold),var(--un-blue));transform:scaleX(0);transform-origin:left;transition:.45s}
.icard:hover{transform:translateY(-8px);box-shadow:0 28px 58px rgba(13,42,84,.14);border-color:var(--un-blue-lt)}
.icard:hover::after{transform:scaleX(1)}
.icard .num{font-family:'Sora',sans-serif;font-size:.8rem;font-weight:800;letter-spacing:.16em;color:var(--gold-dp);display:block;margin-bottom:16px}
.icard .ic{width:60px;height:60px;border-radius:15px;display:flex;align-items:center;justify-content:center;font-size:1.4rem;color:#fff;margin-bottom:22px;box-shadow:0 12px 24px rgba(13,42,84,.18)}
.ic.b{background:linear-gradient(135deg,#7FB2F0,#3A74C9)}
.ic.g{background:linear-gradient(135deg,#E0B84C,#B08A12)}
.ic.n{background:linear-gradient(135deg,#1B4A88,#0D2A54)}
.icard h3{font-size:1.2rem;margin-bottom:13px;line-height:1.35}
.icard p{color:var(--muted);font-size:.94rem;line-height:1.8}

/* ---------- dark section ---------- */
.dark-sec{background:linear-gradient(160deg,#0F3163 0%,var(--navy) 55%,#081D3D 100%);color:#fff;position:relative;overflow:hidden}
.dark-sec h2.title,.dark-sec h3{color:#fff}
.dark-sec h2.title em{color:var(--gold-lt)}
.dark-sec p.lead{color:rgba(255,255,255,.78)}
.dark-sec .kicker{color:var(--gold-lt)}
.dark-sec .kicker::before,.dark-sec .kicker::after{background:var(--gold)}
.glow{position:absolute;width:760px;height:760px;border-radius:50%;pointer-events:none}
.glow.a{background:radial-gradient(circle,rgba(91,146,229,.34) 0%,rgba(91,146,229,.14) 42%,transparent 70%);top:-280px;right:-220px}
.glow.b{background:radial-gradient(circle,rgba(201,162,39,.22) 0%,rgba(201,162,39,.08) 42%,transparent 70%);bottom:-320px;left:-240px}

/* venue / why-city */
.venue-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:66px;align-items:center;position:relative;z-index:2}
@media(max-width:1000px){.venue-grid{grid-template-columns:1fr}}
.venue-photos{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.vphoto{border-radius:16px;overflow:hidden;position:relative;min-height:195px}
.vphoto.big{grid-column:1/-1;min-height:300px}
.vphoto .cap{position:absolute;left:20px;bottom:16px;z-index:2}
.vphoto .cap b{font-family:'Sora',sans-serif;color:#fff;display:block;font-size:1rem;text-shadow:0 2px 10px rgba(0,0,0,.7)}
.vphoto .cap span{font-family:'Montserrat',sans-serif;font-size:.6rem;font-weight:800;letter-spacing:.18em;color:var(--gold-lt)}
.fact-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(225px,100%),1fr));gap:18px;margin-top:56px;position:relative;z-index:2}
.fact{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.15);border-radius:15px;padding:22px 24px;display:flex;gap:15px;align-items:center;backdrop-filter:blur(4px);transition:.3s}
.fact:hover{background:rgba(255,255,255,.11);border-color:rgba(239,208,126,.45)}
.fact .ic{width:46px;height:46px;border-radius:12px;flex:none;display:flex;align-items:center;justify-content:center;font-size:1.05rem;color:#fff}
.fact b{font-family:'Sora',sans-serif;display:block;font-size:.98rem;margin-bottom:3px;color:#fff}
.fact span{color:rgba(255,255,255,.72);font-size:.85rem;line-height:1.5}

/* ---------- who can apply ---------- */
.acard{background:#fff;border:1px solid var(--line);border-radius:18px;padding:36px 30px;transition:.35s}
.acard:hover{transform:translateY(-8px);box-shadow:0 26px 56px rgba(13,42,84,.12);border-color:var(--gold)}
.acard .ic{width:56px;height:56px;border-radius:14px;background:var(--blue-soft);color:var(--un-blue-dp);display:flex;align-items:center;justify-content:center;font-size:1.25rem;margin-bottom:24px}
.acard:nth-child(even) .ic{background:var(--gold-soft);color:var(--gold-dp)}
.acard h3{font-size:1.18rem;margin-bottom:14px}
.acard p{color:var(--muted);font-size:.94rem;line-height:1.75;margin-bottom:22px}
.tag{font-family:'Montserrat',sans-serif;font-size:.64rem;font-weight:800;letter-spacing:.16em;color:var(--un-blue-dp);background:var(--blue-soft);padding:9px 17px;border-radius:999px;display:inline-block}
.acard:nth-child(even) .tag{color:var(--gold-dp);background:var(--gold-soft)}
.note-banner{margin-top:42px;border:1.5px solid #E8D7A4;background:linear-gradient(90deg,#FDF9EF,#F6FAFF);border-radius:16px;padding:32px 40px;text-align:center}
.note-banner b{color:var(--ink);font-size:1.1rem;font-family:'Sora',sans-serif;display:block;margin-bottom:10px}
.note-banner p{color:var(--muted);line-height:1.8;max-width:820px;margin:0 auto}

/* ---------- why join (numbered list) ---------- */
.why-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:66px;align-items:start}
@media(max-width:1000px){.why-grid{grid-template-columns:1fr}}
.gallery{position:relative}
.gallery .main-photo{border-radius:18px;overflow:hidden;aspect-ratio:3/3.6;position:relative;box-shadow:0 26px 60px rgba(13,42,84,.16)}
.gallery .badge{position:absolute;top:18px;right:18px;background:var(--gold);color:#2B1F00;border-radius:12px;padding:12px 18px;font-family:'Sora',sans-serif;font-weight:800;text-align:center;font-size:.85rem;z-index:2;box-shadow:0 12px 28px rgba(0,0,0,.28);line-height:1.3}
.thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;background:var(--navy);border-radius:13px;padding:9px;margin-top:12px}
.thumbs .t{aspect-ratio:1;border-radius:7px;overflow:hidden}
.gal-note{font-family:'Montserrat',sans-serif;font-size:.62rem;font-weight:800;letter-spacing:.2em;color:var(--muted);margin-top:14px;text-align:center}
.benefits{margin-top:28px;display:flex;flex-direction:column;gap:2px;list-style:none}
.benefits li{display:flex;gap:20px;align-items:flex-start;padding:20px 0;border-bottom:1px solid var(--line)}
.benefits li:last-child{border-bottom:none}
.benefits .n{flex:none;width:44px;height:44px;border-radius:12px;background:var(--blue-soft);color:var(--un-blue-dp);display:flex;align-items:center;justify-content:center;font-family:'Sora',sans-serif;font-weight:800;font-size:.9rem;transition:.3s}
.benefits li:hover .n{background:var(--gold);color:#2B1F00}
.benefits h3{font-size:1.05rem;margin-bottom:6px}
.benefits p{color:var(--muted);font-size:.93rem;line-height:1.75}

/* team cards */
.person-card{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 14px 38px rgba(13,42,84,.08);transition:.35s}
.person-card:hover{transform:translateY(-8px);box-shadow:0 26px 58px rgba(13,42,84,.14)}
.person-card .photo{aspect-ratio:3/4;overflow:hidden}
.person-card .info{padding:24px 22px 28px}
.person-card h3{font-size:1.08rem;padding-bottom:12px;position:relative;margin-bottom:12px;line-height:1.35}
.person-card h3::after{content:"";position:absolute;left:0;bottom:0;width:34px;height:3px;background:var(--gold);border-radius:2px}
.person-card p{color:var(--muted);font-size:.86rem;line-height:1.65}

/* ---------- gallery mosaic ---------- */
.mosaic{display:grid;grid-template-columns:1.2fr .5fr .5fr;grid-template-rows:210px 210px;gap:15px;margin-top:52px}
@media(max-width:900px){.mosaic{grid-template-columns:1fr 1fr;grid-template-rows:auto}}
.mos{border-radius:15px;overflow:hidden;position:relative;min-height:200px}
.mos.hero-tile{grid-row:1/3}
@media(max-width:900px){.mos.hero-tile{grid-column:1/-1}}
.mos .overlay{position:absolute;inset:auto 0 0 0;padding:26px;background:linear-gradient(transparent,rgba(6,20,44,.92));z-index:2}
.mos .pill{display:inline-block;background:var(--gold);color:#2B1F00;font-family:'Montserrat',sans-serif;font-size:.6rem;font-weight:800;letter-spacing:.14em;padding:8px 16px;border-radius:999px;margin-bottom:13px}
.mos h3{color:#fff;font-size:1.5rem;line-height:1.25}
.mos h3 em{font-style:normal;color:var(--gold-lt)}
.mos .overlay p{color:rgba(255,255,255,.82);font-size:.86rem;margin-top:9px;line-height:1.65}
.moments{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:15px;margin-top:15px}
.moment{border-radius:13px;overflow:hidden;position:relative;min-height:200px;border-top:3px solid var(--un-blue)}
.moment:nth-child(2){border-top-color:var(--gold)}
.moment:nth-child(3){border-top-color:var(--un-blue-lt)}
.moment:nth-child(4){border-top-color:var(--gold-lt)}
.moment .cap{position:absolute;left:18px;bottom:14px;z-index:2}
.moment .cap b{color:#fff;font-family:'Montserrat',sans-serif;font-size:.74rem;font-weight:800;letter-spacing:.1em;display:block;text-shadow:0 2px 8px rgba(0,0,0,.8)}
.moment .cap span{color:rgba(255,255,255,.78);font-size:.73rem}
.next-band{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;margin-top:42px;color:#fff}
.next-band b{font-family:'Sora',sans-serif;font-size:1.25rem}
.next-band b em{font-style:normal;color:var(--gold-lt)}
.next-band .actions{display:flex;gap:16px;flex-wrap:wrap}

/* ---------- FAQ ---------- */
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 24px;margin-top:52px;align-items:start}
@media(max-width:860px){.faq-grid{grid-template-columns:1fr}}
.faq{background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:0 8px 24px rgba(13,42,84,.05);overflow:hidden;transition:.3s}
.faq.open{border-color:var(--gold);box-shadow:0 14px 36px rgba(201,162,39,.14)}
.faq button{width:100%;background:none;border:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:18px;padding:22px 26px;font-family:'Poppins',sans-serif;font-size:1rem;font-weight:600;color:var(--ink);text-align:left;line-height:1.45}
.faq button .chev{flex:none;transition:.3s;color:var(--un-blue-dp);font-size:.72rem}
.faq.open button{color:var(--gold-dp)}
.faq.open .chev{transform:rotate(180deg);color:var(--gold-dp)}
.faq .ans{max-height:0;overflow:hidden;transition:max-height .4s ease}
.faq .ans p{padding:0 26px 24px;color:var(--muted);font-size:.93rem;line-height:1.85}

/* ---------- final CTA ---------- */
.cta-final{background:radial-gradient(900px 520px at 50% 115%,#1B4A88 0%,#12356A 45%,var(--navy) 100%);color:#fff;text-align:center;position:relative;overflow:hidden}
.cta-final .kicker{color:var(--gold-lt)}
.cta-final .kicker::before,.cta-final .kicker::after{background:var(--gold)}
.cta-final h2.title{color:#fff}
.cta-final h2.title em{color:var(--gold-lt)}
.cta-final p.lead{color:rgba(255,255,255,.82);margin:0 auto 40px}
.cta-final .actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;position:relative;z-index:2}
.cta-ring{position:absolute;border:1px solid rgba(143,186,242,.18);border-radius:50%;animation:floatY 9s ease-in-out infinite}
.cta-ring.r1{width:420px;height:420px;left:-140px;bottom:-160px}
.cta-ring.r2{width:280px;height:280px;right:-90px;top:-90px;animation-delay:-4s;border-color:rgba(239,208,126,.2)}

/* ---------- footer ---------- */
footer{background:#071A38;color:rgba(255,255,255,.62);padding:76px 0 36px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:46px;padding-bottom:46px;border-bottom:1px solid rgba(255,255,255,.1);margin-bottom:28px}
@media(max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.foot-grid{grid-template-columns:1fr}}
footer .desc{font-size:.88rem;line-height:1.9;max-width:340px;margin-top:18px}
.foot-grid h3{color:#fff;font-family:'Montserrat',sans-serif;font-size:.74rem;font-weight:800;letter-spacing:.18em;margin-bottom:20px}
.foot-grid a{display:block;font-size:.93rem;margin-bottom:13px;transition:.25s}
.foot-grid a:hover{color:var(--gold-lt)}
.foot-bottom{display:flex;justify-content:space-between;gap:28px;flex-wrap:wrap;font-size:.8rem;line-height:1.8}
.foot-bottom .disclaimer{max-width:600px;color:rgba(255,255,255,.42)}

/* floating action bubble */
.chat-fab{position:fixed;right:24px;bottom:24px;width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#E0B84C,#B08A12);display:flex;align-items:center;justify-content:center;color:#2B1F00;font-size:1.35rem;box-shadow:0 12px 30px rgba(13,42,84,.35);z-index:60;animation:floatY 4s ease-in-out infinite}

/* ---------- tier / package cards ---------- */
/* margin-top leaves room for the "MOST COMPLETE" badge, which overhangs the
   card by 13px and was landing on the paragraph above. */
.tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:26px;margin-top:48px}
.tier{border-radius:22px;padding:42px 36px;color:#fff;display:flex;flex-direction:column;position:relative;transition:.35s}
.tier:hover{transform:translateY(-8px);box-shadow:0 28px 60px rgba(13,42,84,.28)}
.tier.t1{background:linear-gradient(160deg,#C9A227,#8E6B08)}
.tier.t2{background:linear-gradient(160deg,#4A86DC,#28599E)}
.tier.t3{background:linear-gradient(160deg,#1B4A88,#0D2A54)}
.tier h3{color:#fff;font-size:1.6rem;letter-spacing:.02em;line-height:1.2}
.tier .sub{font-family:'Montserrat',sans-serif;font-size:.68rem;font-weight:800;letter-spacing:.18em;color:rgba(255,255,255,.8);margin:10px 0 26px}
.tier .price{font-family:'Sora',sans-serif;font-size:2.9rem;font-weight:800;line-height:1;margin-bottom:4px}
.tier ul{list-style:none;display:flex;flex-direction:column;margin-bottom:28px}
.tier ul li{padding:13px 0;border-bottom:1px solid rgba(255,255,255,.2);display:flex;gap:13px;font-size:.95rem;line-height:1.5}
.tier ul li::before{content:"—";color:rgba(255,255,255,.55);font-weight:700;flex:none}
.tier .foot{margin-top:auto;padding-top:20px;font-family:'Montserrat',sans-serif;font-size:.66rem;font-weight:800;letter-spacing:.13em;display:flex;gap:11px;color:rgba(255,255,255,.85)}
.tier .foot::before{content:"◆";color:var(--gold-lt)}
.tier.t1 .foot::before{color:#fff}
.flag{position:absolute;top:-13px;right:22px;background:var(--gold);color:#2B1F00;font-family:'Montserrat',sans-serif;font-size:.64rem;
  font-weight:800;letter-spacing:.13em;padding:9px 17px;border-radius:10px;box-shadow:0 8px 20px rgba(0,0,0,.25)}
.tier.t2 .flag{background:#fff;color:var(--navy)}

/* ---------- media / video ---------- */
.video-frame{max-width:1060px;margin:52px auto 0;border-radius:20px;overflow:hidden;box-shadow:0 30px 70px rgba(13,42,84,.22);
  position:relative;aspect-ratio:16/9;background:var(--navy);border:1px solid var(--line)}

/* ---------- testimonials ---------- */
.testi-sec{background:linear-gradient(180deg,#F2F7FD,#EAF2FB);overflow:hidden}
.testi-viewport{overflow:hidden;margin-top:52px;
  -webkit-mask:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.testi-track{display:flex;gap:24px;width:max-content;animation:scrollX 64s linear infinite}
.testi-track:hover{animation-play-state:paused}
.tcard{width:330px;flex:none;background:#fff;border-radius:18px;padding:28px 26px;box-shadow:0 16px 42px rgba(13,42,84,.1);
  display:flex;flex-direction:column;border-top:3px solid var(--gold)}
.tcard .qrow{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.tcard .qmark{font-family:Georgia,serif;font-size:3.2rem;line-height:.6;color:var(--gold)}
.tcard .qlbl{font-family:'Montserrat',sans-serif;font-size:.6rem;font-weight:800;letter-spacing:.2em;color:var(--muted)}
.tcard p{font-size:.88rem;line-height:1.75;color:var(--text);margin-bottom:22px}
.tcard .person{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:auto;border-top:1px solid var(--line);padding-top:16px}
.tcard .person b{font-family:'Sora',sans-serif;font-size:.9rem;color:var(--ink);display:block}
.tcard .person span{font-size:.72rem;color:var(--muted)}

/* package card CTA + scholarship helpers */
.tier .btn-white{margin-top:auto}
.tier ul.tight li{padding:12px 0}
.tier.t2 .flag{background:var(--gold);color:#2B1F00}

/* ============================================================
   SEAM FIX — waves must meet their neighbouring section in the
   exact same colour, so the dark sections use a VERTICAL gradient
   whose top and bottom edges are both #0D2A54 (the wave fill).
   ============================================================ */
/* No position/z-index here on purpose: lifting the wave made it paint OVER
   the section below, so its bottom edge (light background at the far left
   and right) covered the section and showed as a hairline across every
   curve. Left static, the section paints over the overlap instead. */
.wave{display:block;vertical-align:top;margin-bottom:-2px}
.dark-sec{background:linear-gradient(180deg,#0D2A54 0%,#123A72 32%,#0C2851 72%,#0D2A54 100%)}
.cta-final{background:linear-gradient(180deg,#0D2A54 0%,#123A72 45%,#17457F 100%)}
.cta-final::before{content:"";position:absolute;inset:22% -10% -12% -10%;pointer-events:none;
  background:radial-gradient(58% 68% at 50% 100%,rgba(91,146,229,.34) 0%,transparent 70%)}

/* ============================================================
   RESPONSIVE — tablet
   ============================================================ */
@media(max-width:1024px){
  .section{padding:76px 0}
  .wave{height:80px}
  .venue-photos{gap:14px}
  .next-band{justify-content:flex-start}
}

/* ============================================================
   RESPONSIVE — mobile
   ============================================================ */
@media(max-width:760px){
  .wrap{padding:0 18px}
  .section{padding:58px 0}
  .wave{height:52px}
  h2.title{font-size:clamp(1.7rem,7vw,2.2rem)}
  p.lead{font-size:.98rem;line-height:1.75}
  .kicker{font-size:.68rem;letter-spacing:.2em;margin-bottom:14px}
  .kicker::before,.kicker::after{width:18px}

  .grid3,.tiers,.moments{gap:18px;margin-top:34px}
  .icard,.acard{padding:28px 22px}
  .icard .ic,.acard .ic{width:52px;height:52px;font-size:1.2rem;margin-bottom:18px}
  .icard h3,.acard h3{font-size:1.1rem}

  .tier{padding:32px 26px}
  .tier h3{font-size:1.35rem}
  .note-banner{padding:24px 20px;margin-top:30px}
  .note-banner b{font-size:1rem}
  .benefits li{gap:14px;padding:16px 0}
  .benefits .n{width:38px;height:38px;font-size:.8rem}
  .mini-stats{gap:12px}
  .mini{padding:16px 10px}
  .mini b{font-size:1.6rem}

  /* hero */
  .hero{padding:104px 0 56px;min-height:auto}
  .hero .sub{font-size:.96rem}
  .hero-tags{gap:9px;margin-bottom:22px}
  .hero-tags span{font-size:.61rem;padding:7px 13px;letter-spacing:.11em}
  .countdown-panel{margin-top:24px}

  /* stacked CTA groups */
  .hero-cta,.cta-final .actions,.next-band .actions{flex-direction:column;align-items:stretch;width:100%}
  .hero-cta .btn,.cta-final .actions .btn,.next-band .actions .btn{width:100%;justify-content:center}
  .btn{padding:15px 26px;font-size:.93rem}

  /* media blocks */
  .venue-photos{grid-template-columns:1fr}
  .vphoto,.vphoto.big{min-height:180px}
  .mosaic{grid-template-columns:1fr;grid-template-rows:auto}
  .mos,.moment{min-height:170px}
  .mos.hero-tile{min-height:0}
  .mos h3{font-size:1.2rem}
  .mos .overlay{padding:18px}
  .video-frame{border-radius:14px;margin-top:34px}
  .about-visual .photo{aspect-ratio:1/.8}
  .edition-tag{padding:14px 20px;left:0;bottom:14px}
  .edition-tag b{font-size:1.1rem}
  .next-band{flex-direction:column;align-items:flex-start;gap:18px;margin-top:32px}

  /* text blocks */
  .tcard{width:268px;padding:22px 20px}
  .testi-viewport{margin-top:34px}
  .faq-grid{margin-top:32px}
  .faq button{padding:18px 20px;font-size:.94rem}
  .faq .ans p{padding:0 20px 18px}
  .foot-bottom{flex-direction:column;gap:14px}
  .foot-grid{gap:32px;padding-bottom:34px}
  footer{padding:56px 0 30px}
  .chat-fab{right:16px;bottom:16px;width:50px;height:50px;font-size:1.2rem}
}

/* ============================================================
   RESPONSIVE — small phones
   ============================================================ */
@media(max-width:420px){
  .countdown{gap:7px}
  .count-box{min-width:0;flex:1;padding:10px 4px}
  .count-box b{font-size:1.4rem}
  .count-box span{font-size:.48rem;letter-spacing:.1em}
  .countdown-panel{padding:18px 14px}
  .logo b{font-size:.66rem}
}
@media(max-width:480px){
  .logo b span{display:none}           /* tagline wraps to 3 lines and bloats the header */
  .logo b{font-size:.7rem;line-height:1.3}
  header{padding:12px 0}
}

/* The earlier `@media(max-width:1079px){.info-card{display:none}}` is defeated by the
   later base rule `.info-card{display:flex}`,so the floating hero cards reappeared
   below 1080px and ran off the right edge. Re-assert it here,after every base rule. */
@media(max-width:1079px){
  .info-card{display:none}
}

/* ============================================================
   CURVE SEAM — round two.
   Matching the edge colours was not enough. Two things still made
   the wave read as a darker band sitting on a lighter section:
     1) the section was a GRADIENT that only equalled #0D2A54 at
        exactly 0%, then brightened immediately — while the wave
        above it is flat #0D2A54 across its whole height;
     2) .glow.a was centred just 100px below the top edge, so it
        lit the top-right of the section while the wave stayed dark.
   Fix: flat base colour, and keep both glows clear of the edges.
   ============================================================ */
.dark-sec{background:#0D2A54}
.cta-final{background:#0D2A54}
.glow{width:720px;height:720px}
.glow.a{top:90px;right:-210px;bottom:auto;left:auto}
.glow.b{bottom:90px;left:-210px;top:auto;right:auto}

/* ============================================================
   MOTION LAYER
   Everything below animates transform/opacity only, so it stays
   on the compositor. No blur filters — those stalled rendering.
   ============================================================ */

/* --- reveal system: base + directions + stagger --- */
.reveal{opacity:0;transform:translateY(34px);
  transition:opacity .75s cubic-bezier(.22,.7,.24,1),transform .75s cubic-bezier(.22,.7,.24,1);
  transition-delay:calc(var(--i,0) * 75ms)}
.reveal.rv-l{transform:translateX(-46px)}
.reveal.rv-r{transform:translateX(46px)}
.reveal.rv-s{transform:scale(.93)}
.reveal.rv-up{transform:translateY(58px)}
.reveal.in{opacity:1;transform:none}

/* kicker rules draw themselves in */
.kicker::before,.kicker::after{transform:scaleX(0);transform-origin:left;
  transition:transform .6s cubic-bezier(.22,.7,.24,1) .22s}
.kicker.in::before,.kicker.in::after{transform:scaleX(1)}

/* --- hero: aurora drift + line-by-line headline --- */
.hero .aurora{position:absolute;inset:-25%;z-index:-1;opacity:.55;pointer-events:none;
  background:
    radial-gradient(38% 48% at 22% 32%,rgba(91,146,229,.55),transparent 62%),
    radial-gradient(34% 42% at 78% 18%,rgba(201,162,39,.30),transparent 62%),
    radial-gradient(44% 54% at 62% 82%,rgba(58,116,201,.45),transparent 62%);
  animation:auroraDrift 20s ease-in-out infinite alternate}
@keyframes auroraDrift{
  0%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(-3%,2.5%,0) scale(1.09)}
  100%{transform:translate3d(3.5%,-2%,0) scale(1.04)}
}
.hero h1 .line{display:block;overflow:hidden}
.hero h1 .line > span{display:block;transform:translateY(110%);opacity:0;
  transition:transform .95s cubic-bezier(.2,.75,.22,1),opacity .95s ease}
.hero h1.in .line > span{transform:none;opacity:1}
.hero h1.in .line:nth-child(2) > span{transition-delay:.13s}

/* --- buttons: sheen sweep --- */
.btn{position:relative;overflow:hidden;isolation:isolate}
.btn::after{content:"";position:absolute;top:0;left:-130%;width:55%;height:100%;z-index:-1;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.42),transparent);
  transform:skewX(-22deg);transition:left .65s cubic-bezier(.3,.7,.3,1)}
.btn:hover::after{left:150%}

/* --- cards: 3D tilt support + hover sheen --- */
.icard,.acard,.tier,.person-card{transform-style:preserve-3d}
/* The sheen used to slide with translateX, which needed overflow:hidden on the
   card — and that clipped the "MOST COMPLETE" badge hanging off the top edge.
   Moving the gradient instead keeps the shine inside the card with no clipping. */
.tier::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;border-radius:22px;
  background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.16) 50%,transparent 65%);
  background-size:300% 100%;background-position:100% 0;transition:opacity .3s}
.tier:hover::after{opacity:1;animation:tierSheen 1.1s ease forwards}
@keyframes tierSheen{from{background-position:100% 0}to{background-position:-100% 0}}

/* badge must sit above the card's own background layers */
.flag{z-index:3}

/* --- nav underline + scroll-spy --- */
.nav-links a:not(.btn){position:relative}
.nav-links a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:2px;
  border-radius:2px;background:var(--gold);transform:scaleX(0);transition:transform .35s cubic-bezier(.22,.7,.24,1)}
.nav-links a:not(.btn):hover::after,.nav-links a:not(.btn).active::after{transform:scaleX(1)}
.nav-links a:not(.btn).active{color:var(--gold-lt)}

/* --- media: gentle zoom once real photos are dropped in --- */
.vphoto,.mos,.moment,.gallery .main-photo,.about-visual .photo,.person-card .photo,.thumbs .t{overflow:hidden}
.vphoto img,.mos img,.moment img,.gallery .main-photo img,.about-visual .photo img,.person-card .photo img,.thumbs .t img{transition:transform .8s cubic-bezier(.22,.7,.24,1)}
.vphoto:hover img,.mos:hover img,.moment:hover img,.gallery .main-photo:hover img,.about-visual .photo:hover img,.person-card:hover .photo img{transform:scale(1.07)}

/* --- WhatsApp floating button --- */
.chat-fab{position:fixed;right:24px;bottom:24px;width:58px;height:58px;border-radius:50%;
  background:linear-gradient(135deg,#E0B84C,#B08A12);display:flex;align-items:center;justify-content:center;
  box-shadow:0 12px 30px rgba(13,42,84,.4);z-index:60;animation:floatY 4s ease-in-out infinite}
.chat-fab svg{width:30px;height:30px;fill:#2B1F00;position:relative;z-index:2}
.chat-fab::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--gold);
  animation:fabPulse 2.6s cubic-bezier(.2,.7,.3,1) infinite}
@keyframes fabPulse{0%{transform:scale(1);opacity:.75}100%{transform:scale(1.75);opacity:0}}
.chat-fab .tip{position:absolute;right:calc(100% + 14px);white-space:nowrap;background:var(--navy);color:#fff;
  padding:9px 15px;border-radius:9px;font-size:.78rem;font-weight:600;font-family:'Poppins',sans-serif;
  opacity:0;transform:translateX(10px);transition:.32s cubic-bezier(.22,.7,.24,1);pointer-events:none;
  box-shadow:0 10px 26px rgba(13,42,84,.35)}
.chat-fab:hover .tip{opacity:1;transform:none}
.chat-fab:hover{transform:scale(1.08)}
@media(max-width:760px){.chat-fab .tip{display:none}}

/* --- respect reduced motion --- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;
    transition-duration:.001ms !important;scroll-behavior:auto !important}
  .reveal{opacity:1 !important;transform:none !important}
  .hero h1 .line > span{opacity:1 !important;transform:none !important}
  }

/* --- draft Block 1: positioning + supporting statement in the hero --- */
.hero .positioning{font-family:'Sora',sans-serif;font-weight:700;color:#fff;
  font-size:clamp(1.02rem,1.7vw,1.28rem);line-height:1.45;margin:0 0 14px}
.hero .positioning span{color:var(--gold-lt)}
@media(max-width:760px){.hero .positioning{font-size:1rem;margin-bottom:12px}}

/* --- sub-heading inside the registration block --- */
.sub-head{font-size:clamp(1.25rem,2.2vw,1.7rem);font-weight:800;color:var(--ink);
  margin:44px 0 0;text-align:center}
.sub-head::after{content:"";display:block;width:52px;height:3px;border-radius:2px;
  background:var(--gold);margin:14px auto 0}

/* --- "Where It All Began" and "Moments That Tell the Story" are both dark
       sections sitting back to back, so they merged into one slab. The second
       one takes a deeper navy and a curved divider separates them. --- */
.dark-sec.deeper{background:#071A38}
.dark-sec.deeper .glow.a{background:radial-gradient(circle,rgba(91,146,229,.26) 0%,rgba(91,146,229,.10) 42%,transparent 70%)}
.dark-sec.deeper .glow.b{background:radial-gradient(circle,rgba(201,162,39,.20) 0%,rgba(201,162,39,.07) 42%,transparent 70%)}
.hero-bg img{width:100%;height:100%;object-fit:cover}
.about-visual .photo img,.gallery .main-photo img,.vphoto img,.mos img,.moment img,.person-card .photo img,.thumbs .t img{width:100%;height:100%;object-fit:cover}
.logo-img{width:52px;height:52px;object-fit:contain;flex:none}
@media(max-width:480px){.logo-img{width:42px;height:42px}}

/* --- day tabs --- */
.day-tabs{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:44px 0 38px}
.day-tab{background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:14px 24px;cursor:pointer;
  font-family:'Montserrat',sans-serif;font-weight:800;font-size:.72rem;letter-spacing:.13em;color:var(--muted);
  transition:.32s cubic-bezier(.22,.7,.24,1);position:relative;overflow:hidden;text-align:center;line-height:1.5}
.day-tab b{display:block;font-family:'Sora',sans-serif;font-size:1.05rem;letter-spacing:0;color:var(--ink);transition:.3s}
.day-tab:hover{border-color:var(--un-blue-lt);transform:translateY(-3px)}
.day-tab.active{background:linear-gradient(150deg,var(--navy),var(--navy-2));border-color:var(--gold);
  color:var(--gold-lt);box-shadow:0 16px 36px rgba(13,42,84,.28)}
.day-tab.active b{color:#fff}

/* --- rundown panels --- */
.rundown-panel{display:none}
.rundown-panel.active{display:block;animation:panelIn .55s cubic-bezier(.22,.7,.24,1)}
@keyframes panelIn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.rundown-head{text-align:center;margin-bottom:34px}
.rundown-head .date-chip{display:inline-flex;align-items:center;gap:10px;background:var(--gold-soft);
  border:1.5px solid #E8D7A4;color:var(--gold-dp);font-family:'Montserrat',sans-serif;font-weight:800;
  font-size:.7rem;letter-spacing:.16em;padding:10px 22px;border-radius:999px}
.rundown-head h3{font-size:clamp(1.35rem,2.6vw,1.9rem);margin-top:14px}

/* --- timeline --- */
.timeline{position:relative;max-width:900px;margin:0 auto;padding-left:8px}
.timeline::before{content:"";position:absolute;left:118px;top:8px;bottom:8px;width:2px;
  background:linear-gradient(180deg,var(--gold),var(--un-blue));transform-origin:top;
  animation:lineGrow .9s cubic-bezier(.22,.7,.24,1) forwards}
@keyframes lineGrow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.tl-row{display:grid;grid-template-columns:104px 34px 1fr;gap:0 18px;align-items:start;padding:14px 0;
  opacity:0;transform:translateX(24px);animation:rowIn .6s cubic-bezier(.22,.7,.24,1) forwards}
.tl-row:nth-child(1){animation-delay:.10s}.tl-row:nth-child(2){animation-delay:.18s}
.tl-row:nth-child(3){animation-delay:.26s}.tl-row:nth-child(4){animation-delay:.34s}
.tl-row:nth-child(5){animation-delay:.42s}.tl-row:nth-child(6){animation-delay:.50s}
.tl-row:nth-child(7){animation-delay:.58s}.tl-row:nth-child(8){animation-delay:.66s}
.tl-row:nth-child(9){animation-delay:.74s}.tl-row:nth-child(10){animation-delay:.82s}
@keyframes rowIn{to{opacity:1;transform:none}}
.tl-time{font-family:'Montserrat',sans-serif;font-weight:800;font-size:.7rem;letter-spacing:.06em;
  color:var(--un-blue-dp);text-align:right;padding-top:14px;line-height:1.5}
.tl-dot{position:relative;display:flex;justify-content:center;padding-top:16px}
.tl-dot span{width:14px;height:14px;border-radius:50%;background:#fff;border:3px solid var(--gold);z-index:2;
  box-shadow:0 0 0 5px rgba(201,162,39,.14);transition:.3s}
.tl-row:hover .tl-dot span{background:var(--gold);transform:scale(1.2)}
.tl-card{background:#fff;border:1px solid var(--line);border-left:3px solid var(--un-blue);border-radius:14px;
  padding:16px 22px;box-shadow:0 8px 24px rgba(13,42,84,.06);transition:.32s}
.tl-row:hover .tl-card{transform:translateX(6px);box-shadow:0 16px 38px rgba(13,42,84,.13);border-left-color:var(--gold)}
.tl-card b{font-family:'Sora',sans-serif;font-size:1.02rem;color:var(--ink);display:block;margin-bottom:4px}
.tl-card span{color:var(--muted);font-size:.9rem;line-height:1.6}
@media(max-width:700px){
  .timeline{padding-left:0}
  .timeline::before{left:7px}
  .tl-row{grid-template-columns:16px 1fr;gap:0 14px}
  .tl-time{grid-column:2;text-align:left;padding-top:0;padding-bottom:6px}
  .tl-dot{grid-row:1;grid-column:1;padding-top:2px;justify-content:flex-start}
  .tl-dot span{width:12px;height:12px;border-width:3px}
  .tl-card{grid-column:2}
  .tl-row:hover .tl-card{transform:none}
}

/* --- dress code strip --- */
.dress{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));gap:18px;margin-top:46px}
.dress-card{background:linear-gradient(150deg,var(--navy-2),var(--navy));color:#fff;border-radius:16px;
  padding:24px 26px;border-bottom:3px solid var(--gold)}
.dress-card span{font-family:'Montserrat',sans-serif;font-size:.64rem;font-weight:800;letter-spacing:.18em;
  color:var(--gold-lt);display:block;margin-bottom:8px}
.dress-card b{font-family:'Sora',sans-serif;font-size:1rem;font-weight:700;line-height:1.5}
.dress-note{margin-top:20px;text-align:center;color:var(--muted);font-size:.9rem;line-height:1.7}
.tier .incl{font-family:'Montserrat',sans-serif;font-size:.64rem;font-weight:800;letter-spacing:.16em;
  color:rgba(255,255,255,.75);margin-bottom:12px}

/* --- team: exactly three members --- */
.team-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:56px;max-width:1020px;
  margin-left:auto;margin-right:auto}
@media(max-width:900px){.team-3{grid-template-columns:1fr 1fr;max-width:640px}}
@media(max-width:600px){.team-3{grid-template-columns:1fr;max-width:380px}}
.person-card .role{font-family:'Montserrat',sans-serif;font-size:.62rem;font-weight:800;letter-spacing:.14em;
  color:var(--gold-dp);display:block;margin-bottom:8px}

/* --- perks --- */
.perk{background:#fff;border:1px solid var(--line);border-radius:18px;padding:32px 28px;
  box-shadow:0 12px 34px rgba(13,42,84,.07);transition:.35s;display:flex;gap:18px;align-items:flex-start}
.perk:hover{transform:translateY(-7px);box-shadow:0 26px 56px rgba(13,42,84,.14);border-color:var(--gold)}
.perk .ic{width:50px;height:50px;flex:none;border-radius:13px;display:flex;align-items:center;justify-content:center;
  font-size:1.2rem;color:#fff;background:linear-gradient(135deg,#7FB2F0,#3A74C9)}
.perk:nth-child(even) .ic{background:linear-gradient(135deg,#E0B84C,#B08A12)}
.perk h3{font-size:1.05rem;margin-bottom:8px;line-height:1.4}
.perk p{color:var(--muted);font-size:.9rem;line-height:1.7}

/* --- committee & agenda feature --- */
.agenda-card{max-width:940px;margin:52px auto 0;background:linear-gradient(150deg,var(--navy),var(--navy-2));
  border:1px solid rgba(239,208,126,.32);border-radius:22px;padding:48px 44px;color:#fff;text-align:center;
  position:relative;overflow:hidden}
.agenda-card .badge2{display:inline-block;background:var(--gold);color:#2B1F00;font-family:'Montserrat',sans-serif;
  font-size:.66rem;font-weight:800;letter-spacing:.18em;padding:9px 20px;border-radius:999px;margin-bottom:20px}
.agenda-card h3{color:#fff;font-size:clamp(1.4rem,3vw,2.1rem);margin-bottom:16px}
.agenda-card .agenda-txt{color:rgba(255,255,255,.85);font-size:1.02rem;line-height:1.8;max-width:720px;margin:0 auto}
.agenda-tags{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:26px}
.agenda-tags span{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.2);border-radius:999px;
  padding:9px 18px;font-size:.82rem;color:#fff}
@media(max-width:600px){.agenda-card{padding:34px 22px}}

/* --- local video --- */
.video-frame video{width:100%;height:100%;object-fit:cover;display:block;background:#000}

/* ============================================================
   KIYC — motion band, centred card rows, thumbnail swap
   ============================================================ */

/* --- home page video band --- */
.vid-band{background:linear-gradient(150deg,#0D2A54,#123A72 55%,#0D2A54);color:#fff;position:relative;overflow:hidden}
.vid-band h2.title{color:#fff}
.vid-band h2.title em{color:var(--gold-lt)}
.vid-band .kicker{color:var(--gold-lt)}
.vid-band .kicker::before,.vid-band .kicker::after{background:var(--gold)}
.vid-band p.lead{color:rgba(255,255,255,.8)}
.vid-two{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:52px}
@media(max-width:860px){.vid-two{grid-template-columns:1fr}}
.vid-card{position:relative;border-radius:20px;overflow:hidden;border:1px solid rgba(239,208,126,.3);
  box-shadow:0 24px 60px rgba(6,20,44,.45);background:#08203F;margin:0}
.vid-card video{width:100%;display:block;aspect-ratio:16/9;object-fit:cover}
.vid-card figcaption{position:absolute;inset:auto 0 0 0;padding:44px 24px 20px;text-align:left;
  background:linear-gradient(transparent,rgba(6,20,44,.92))}
.vid-card figcaption b{font-family:'Sora',sans-serif;color:#fff;font-size:1.05rem;display:block}
.vid-card figcaption span{font-family:'Montserrat',sans-serif;font-size:.62rem;font-weight:800;
  letter-spacing:.18em;color:var(--gold-lt)}
.vid-card .live-dot{position:absolute;top:16px;left:16px;display:inline-flex;align-items:center;gap:8px;
  background:rgba(8,26,56,.7);border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:7px 14px;
  font-family:'Montserrat',sans-serif;font-size:.58rem;font-weight:800;letter-spacing:.16em;color:#fff}
.vid-card .live-dot::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--gold-lt);
  animation:pulseDot 1.8s ease-out infinite}

/* --- centred flexible card rows (odd counts sit centred, not orphaned left) --- */
.grid-center{display:flex;flex-wrap:wrap;justify-content:center;gap:26px;margin-top:56px}
.grid-center > *{flex:0 1 340px;max-width:100%}
@media(max-width:760px){.grid-center{gap:18px;margin-top:34px}.grid-center > *{flex:1 1 100%}}

/* seventh perk runs full width so the last row never leaves a lone card */

/* --- clickable thumbnails that swap into the main photo --- */
.thumbs .t{cursor:pointer;position:relative;border:2px solid transparent;transition:.28s}
.thumbs .t::after{content:"";position:absolute;inset:0;background:rgba(13,42,84,.45);transition:.28s}
.thumbs .t:hover::after{background:rgba(13,42,84,.15)}
.thumbs .t.active{border-color:var(--gold)}
.thumbs .t.active::after{background:transparent}
.gallery .main-photo img{transition:opacity .35s ease}
.gallery .main-photo.swapping img{opacity:0}

/* --- testimonials without avatars --- */
.tcard .person.no-avatar{justify-content:flex-start}
.tcard .person .who b{font-family:'Sora',sans-serif;font-size:.92rem;color:var(--ink);display:block}
.tcard .person .who span{font-size:.74rem;color:var(--muted)}

/* ============================================================
   PHOTO FRAMES — fix runaway heights
   These frames had no aspect-ratio, so each took its image's
   natural proportions. patiala-heritage.png is portrait
   (853x1280) and stretched its column to 884px, which left the
   Why Patiala text floating in a huge centred gap. Fixing the
   ratio makes object-fit:cover crop instead.
   ============================================================ */
.vphoto{aspect-ratio:4/3;min-height:0}
.vphoto.big{aspect-ratio:16/10;min-height:0}
.mos{aspect-ratio:4/3;min-height:0}
.mos,.mos.hero-tile{min-width:0;max-width:100%}
.mos.hero-tile{aspect-ratio:auto}          /* spans two rows, height comes from the grid */
.moment{aspect-ratio:4/3;min-height:0}
@media(max-width:760px){
  .vphoto,.vphoto.big,.mos,.moment{aspect-ratio:16/10;min-height:0}
  .mos.hero-tile{aspect-ratio:4/3}
}

/* Why Patiala: keep the two columns close in height so the text
   is not marooned in the middle of a tall photo stack. */
.venue-grid{align-items:center}
@media(min-width:1001px){
  .venue-photos{align-self:center}
}

/* ============================================================
   COLOUR RHYTHM
   Eight consecutive light sections ran from "Who Can Join" to
   "Media Coverage". Perks and Registration now go dark so the
   page alternates instead of washing out.
   ============================================================ */
#perks.dark-sec,#register.dark-sec{background:#0D2A54}

/* white cards keep dark type — .dark-sec would otherwise force h3 to white */
.dark-sec .perk h3{color:var(--ink)}
.dark-sec .perk p{color:var(--muted)}
.dark-sec .tl-card b{color:var(--ink)}

/* registration on navy: the second tier was navy-on-navy, so it gets the
   brighter blue to stay distinct from the section behind it */
#register.dark-sec .tier.t3{background:linear-gradient(160deg,#4A86DC,#28599E)}
#register.dark-sec .tier{box-shadow:0 22px 54px rgba(0,0,0,.32)}

/* ============================================================
   Larger icons inside the cards
   ============================================================ */
.icard .ic{width:74px;height:74px;border-radius:18px;font-size:1.9rem;margin-bottom:24px}
.acard .ic{width:70px;height:70px;border-radius:17px;font-size:1.75rem;margin-bottom:26px}
.perk .ic{width:64px;height:64px;border-radius:16px;font-size:1.65rem}
.fact .ic{width:56px;height:56px;border-radius:14px;font-size:1.35rem}
.info-card .ic{width:52px;height:52px;border-radius:14px;font-size:1.4rem}

@media(max-width:760px){
  .icard .ic,.acard .ic{width:62px;height:62px;font-size:1.55rem;margin-bottom:18px}
  .perk .ic{width:56px;height:56px;font-size:1.45rem}
  .fact .ic{width:50px;height:50px;font-size:1.2rem}
}

/* ============================================================
   Perks: the 7th card used to stretch across the whole row.
   It is now a normal card, and the flex row centres the orphan
   so it lines up under the grid above it.
   ============================================================ */
.grid-center{align-items:stretch}
.grid-center > .perk{flex:0 1 340px}

/* ============================================================
   SVG ICONS
   Replaced the emoji that were being used as icons. Emoji render
   differently on every OS, cannot be recoloured to match the
   palette, and get announced by screen readers. These inherit
   their colour via currentColor and stay crisp at any size.
   ============================================================ */
svg.i{
  width:56%;height:56%;
  fill:none;stroke:currentColor;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round;
  display:block;flex:none;
}
/* icon tiles centre their glyph */
.ic{display:flex;align-items:center;justify-content:center}

/* date chip in the event rundown */
.date-chip svg.i{width:15px;height:15px;stroke-width:1.9}

/* FAQ chevron — rotates when the answer opens */
.faq .chev{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px}
.faq .chev svg.i{width:18px;height:18px;stroke-width:2.1}

/* ticker separator: a rotated square instead of a font glyph */
.ticker-track span.dot{display:inline-flex;align-items:center;padding:0 20px}
.ticker-track span.dot::before{
  content:"";width:6px;height:6px;background:currentColor;
  transform:rotate(45deg);opacity:.6;border-radius:1px;
}

@media(max-width:760px){
  .date-chip svg.i{width:13px;height:13px}
  .ticker-track span.dot{padding:0 14px}
}

/* ============================================================
   ZOOM / NARROW-VIEWPORT SAFETY
   Browser zoom shrinks the CSS viewport, which exposed items
   that could not shrink below a fixed basis. These let them.
   ============================================================ */
.grid-center > *,.grid-center > .perk{min-width:0}
.tl-card,.tl-row,.icard,.acard,.perk,.tier,.person-card,.day-tab{min-width:0}
.about-visual,.about-visual .photo,.gallery,.venue-photos{min-width:0;max-width:100%}
.mini,.fact,.dress-card,.comm{min-width:0}
/* belt and braces: nothing may create a horizontal scrollbar */
html,body{overflow-x:hidden;max-width:100%}

/* ============================================================
   WAVE HAIRLINE FIX
   The path used to close exactly on the element's bottom edge, so
   with preserveAspectRatio="none" and a fractional devicePixelRatio
   that edge anti-aliased against the svg's own (light) background
   and left a pale line across every curve. The path now runs past
   the viewBox and is clipped, and the overlap is a touch deeper, so
   the last pixel row is always solid fill.
   ============================================================ */
.wave{margin-bottom:-2px;shape-rendering:geometricPrecision;position:static;z-index:auto}

/* ============================================================
   TOUCH & LEGIBILITY
   Footer links were a 22px text line with no padding — under the
   44px tap target that iOS/Android guidance asks for, and easy to
   mis-tap. A few labels were also rendering at 8.5px.
   ============================================================ */
.foot-grid a{padding:11px 0;margin-bottom:0}   /* 44px tap target at every width */


/* countdown + info-card labels were too small to read on a phone */
.count-box span{font-size:.62rem}
.info-card span{font-size:.66rem}
@media(max-width:420px){
  .count-box span{font-size:.58rem;letter-spacing:.08em}
}

/* iOS: stop long strings (emails, URLs) forcing a wider layout */
.foot-grid a,.disclaimer,footer .desc{overflow-wrap:anywhere}

/* ============================================================
   TOUCH TARGETS ON LARGE TOUCH SCREENS
   An iPad in landscape is 1024-1366px wide but still finger-driven,
   so width-based rules missed it: header nav links sat at 21px and
   footer links at 36px. Keyed to pointer type instead of width.
   ============================================================ */
@media (pointer: coarse){
  .foot-grid a{padding:12px 0;margin-bottom:0}
  /* grow the header links' hit area without changing the header's height */
  .nav-links a:not(.btn){position:relative}
  .nav-links a:not(.btn)::before{content:"";position:absolute;inset:-14px -8px}
  .day-tab{padding-top:16px;padding-bottom:16px}
  /* logo sits at 42px on the smallest phones — hold the 44px touch minimum */
  .logo{min-height:44px}
}
