/* =============================================================== tokens */
:root{
  --ink:#050D20;
  --ink-2:#08142C;
  --well:#030814;
  --gold:#BD924C;
  --gold-lit:#E8C88A;
  --gold-dim:rgba(189,146,76,.34);
  --gold-faint:rgba(189,146,76,.15);
  --pearl:#F2ECE0;
  --pearl-ink:#0D1830;
  --pearl-rule:rgba(13,24,48,.18);
  --haze:#9AA6BA;
  --paper:#DCE3EF;

  --display:"Marcellus",Georgia,serif;
  --sans:"Jost",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;

  --gut:clamp(1.25rem,4vw,3.25rem);
  --shell:1240px;

  /* sikku kolam — two strokes weaving around a row of pulli (dots) */
  --kolam:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='44' viewBox='0 0 96 44'%3E%3Cg fill='none' stroke='%23BD924C' stroke-width='1.4'%3E%3Cpath d='M0 22 C16 1 32 1 48 22 C64 43 80 43 96 22'/%3E%3Cpath d='M0 22 C16 43 32 43 48 22 C64 1 80 1 96 22'/%3E%3C/g%3E%3Cg fill='%23BD924C'%3E%3Ccircle cx='24' cy='22' r='2'/%3E%3Ccircle cx='72' cy='22' r='2'/%3E%3Ccircle cx='0' cy='22' r='1.4'/%3E%3Ccircle cx='48' cy='22' r='1.4'/%3E%3Ccircle cx='96' cy='22' r='1.4'/%3E%3C/g%3E%3C/svg%3E");

  /* jaali — 8-point star lattice, the Deccan pierced screen */
  --jaali:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cg fill='none' stroke='%23BD924C' stroke-width='1'%3E%3Cpath d='M28 2 L54 28 L28 54 L2 28 Z'/%3E%3Cpath d='M10 10 H46 V46 H10 Z'/%3E%3Ccircle cx='28' cy='28' r='6.5'/%3E%3Cpath d='M10 10 L0 0 M46 10 L56 0 M46 46 L56 56 M10 46 L0 56'/%3E%3C/g%3E%3C/svg%3E");
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0; background:var(--ink); color:var(--paper);
  font-family:var(--sans); font-weight:300;
  font-size:clamp(1rem,.95rem + .22vw,1.09rem); line-height:1.75;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; }
:focus-visible{ outline:2px solid var(--gold-lit); outline-offset:3px; }
.shell{ width:100%; max-width:var(--shell); margin-inline:auto; padding-inline:var(--gut); }
.defs{ position:absolute; width:0; height:0; overflow:hidden; }

/* ========================================================== typography */
h1,h2,h3{ font-family:var(--display); font-weight:400; margin:0; letter-spacing:.005em; }
h1{ font-size:clamp(2.15rem,1.2rem + 4.1vw,4rem); line-height:1.05; }
h2{ font-size:clamp(1.9rem,1.2rem + 2.7vw,3.15rem); line-height:1.1; }
h3{ font-size:clamp(1.15rem,1.03rem + .5vw,1.38rem); line-height:1.32; }
p{ margin:0 0 1.15em; max-width:62ch; }
p:last-child{ margin-bottom:0; }
.lede{ font-size:clamp(1.08rem,1rem + .45vw,1.3rem); line-height:1.68; color:#C4CEDE; max-width:56ch; }
.muted{ color:var(--haze); }

/* ============================================================== ornament */
.orn{ display:block; width:40px; height:40px; color:var(--gold); }
.orn path,.orn use{ fill:none; stroke:currentColor; stroke-width:1.4; vector-effect:non-scaling-stroke; }
.band--pearl .orn{ color:var(--pearl-ink); opacity:.6; }

/* =================================================================== nav */
.nav{
  position:sticky; top:0; z-index:70;
  background:rgba(5,13,32,.84);
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid transparent; transition:border-color .3s, background .3s;
}
.nav.is-stuck{ border-bottom-color:var(--gold-faint); background:rgba(5,13,32,.95); }
.nav__in{ display:flex; align-items:center; gap:1.5rem; min-height:78px; }
.brand{ display:flex; align-items:center; text-decoration:none; margin-right:auto; }
.brand img{ width:auto; }
/* the lockup is a wide horizontal mark, so narrow headers fall back to the
   monogram rather than shrinking the wordmark past legibility.
   Both selectors carry the same weight as .brand img, or that rule wins. */
.brand .brand__lockup{ display:block; height:42px; }
.brand .brand__mark{ display:none; height:52px; }
@media (max-width:620px){
  .brand .brand__lockup{ display:none; }
  .brand .brand__mark{ display:block; }
}
.nav__links{ display:flex; gap:1.7rem; }
.nav__links a{ text-decoration:none; font-size:.9rem; color:var(--haze); padding-block:.4rem; position:relative; transition:color .25s; }
.nav__links a::after{ content:""; position:absolute; left:0; right:100%; bottom:0; height:1px; background:var(--gold); transition:right .3s; }
.nav__links a:hover{ color:#fff; }
.nav__links a:hover::after{ right:0; }
.nav .nav__cta{ white-space:nowrap; }
@media (max-width:1000px){
  .nav__links{ display:none; }
  .nav .nav__cta{ padding:.62rem 1rem; font-size:.7rem; letter-spacing:.07em; }
}
@media (max-width:400px){ .nav .nav__cta{ padding:.55rem .78rem; font-size:.65rem; } }

/* =============================================================== buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  font-family:var(--sans); font-size:.87rem; font-weight:500;
  letter-spacing:.1em; text-transform:uppercase;
  padding:.95rem 1.75rem; text-decoration:none; cursor:pointer;
  border:1px solid var(--gold); color:var(--ink);
  background:linear-gradient(135deg,#B98A44 0%,#E0BC7C 48%,#B98A44 100%);
  transition:filter .25s, color .25s, border-color .25s;
}
.btn:hover{ filter:brightness(1.12); }
.btn--ghost{ background:none; color:var(--gold-lit); border-color:var(--gold-dim); }
.btn--ghost:hover{ filter:none; color:#fff; border-color:var(--gold); }
.btn--wide{ width:100%; padding-block:1.05rem; }

/* ================================================================== hero */
.hero{ position:relative; padding-block:clamp(1rem,3vw,2.5rem) clamp(2rem,5vw,4rem); }
.hero::before{
  content:""; position:absolute; inset:0;
  background-image:var(--jaali); background-size:124px 124px;
  opacity:.038; pointer-events:none;
  -webkit-mask-image:radial-gradient(120% 80% at 50% 35%,#000 20%,transparent 78%);
  mask-image:radial-gradient(120% 80% at 50% 35%,#000 20%,transparent 78%);
}
.hero .shell{ max-width:1460px; }
.hero__frame{ position:relative; max-width:1420px; margin-inline:auto; }
.arcade{ display:block; width:100%; height:auto; }
.arcade--sm{ display:none; width:100vw; margin-left:calc(50% - 50vw); }
.arcade .line{ fill:none; stroke:var(--gold); stroke-width:1.5; vector-effect:non-scaling-stroke; }
.arcade .thin{ fill:none; stroke:var(--gold); stroke-width:1; opacity:.55; vector-effect:non-scaling-stroke; }
.arcade .screen{ stroke:none; }
.arcade .stud{ fill:var(--gold); stroke:none; }
.arcade .bud{ fill:none; stroke:var(--gold); stroke-width:1.2; vector-effect:non-scaling-stroke; }
@media (max-width:900px){
  .arcade--lg{ display:none; }
  .arcade--sm{ display:block; }
}

.hero__body{ text-align:center; }
@media (min-width:901px){
  .hero__body{ position:absolute; left:50%; top:33%; transform:translateX(-50%); width:41%; max-width:580px; }
}
@media (max-width:900px){ .hero__body{ margin-top:2rem; } }
.hero__eyebrow{
  font-size:.76rem; letter-spacing:.3em; text-transform:uppercase;
  color:var(--gold); margin-bottom:1.15rem;
}
.hero h1{ color:#fff; text-wrap:balance; font-size:clamp(2.05rem,1.2rem + 3.5vw,3.6rem); }
.hero__sub{ margin:1.35rem auto 2rem; color:#B7C2D4; max-width:44ch; }
.hero__acts{ display:flex; flex-wrap:wrap; gap:.85rem; justify-content:center; }
.hero__meta{ margin-top:1.5rem; font-size:.85rem; letter-spacing:.05em; color:var(--haze); line-height:2.1; }
.hero__meta b{ color:var(--gold-lit); font-weight:400; }

/* page load: the arcade draws itself, then the inscription appears */
.arcade [data-draw]{ opacity:0; }
.arcade.go [data-draw]{ opacity:1; }
@keyframes draw{ from{ stroke-dashoffset:var(--L); } to{ stroke-dashoffset:0; } }
.arcade [data-fade]{ opacity:0; }
.arcade.go [data-fade]{ animation:lit 1s ease 1.15s forwards; }
@keyframes lit{ to{ opacity:1; } }
.hero__body > *{ opacity:0; animation:rise .9s cubic-bezier(.22,.7,.28,1) forwards; }
.hero__eyebrow{ animation-delay:.7s; }
.hero h1{ animation-delay:.85s; }
.hero__sub{ animation-delay:1s; }
.hero__acts{ animation-delay:1.15s; }
.hero__meta{ animation-delay:1.3s; }
@keyframes rise{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:none; } }

.crown [data-draw],.crown [data-fade]{ opacity:1 !important; animation:none !important; }

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  .arcade [data-draw],.arcade [data-fade],.hero__body > *{ opacity:1 !important; animation:none !important; }
  .ribbon__row{ animation:none !important; }
  *{ transition-duration:.01ms !important; }
}

/* ================================================================ ribbon */
.ribbon{ border-block:1px solid var(--gold-faint); background:var(--well); overflow:hidden; padding-block:.95rem; }
.ribbon__row{ display:flex; width:max-content; animation:slide 46s linear infinite; }
.ribbon:hover .ribbon__row{ animation-play-state:paused; }
@keyframes slide{ to{ transform:translateX(-50%); } }
.ribbon__set{ display:flex; align-items:center; flex:none; }
.ribbon span{ font-size:.8rem; letter-spacing:.3em; text-transform:uppercase; color:var(--haze); padding-inline:2rem; white-space:nowrap; }
.ribbon .orn{ width:22px; height:22px; flex:none; opacity:.8; }

/* ============================================================== sections */
.band{ padding-block:clamp(4rem,9vw,7.5rem); }
.band--well{ background:var(--well); }
.band--pearl{ background:var(--pearl); color:var(--pearl-ink); position:relative; }
.band--pearl h2,.band--pearl h3{ color:var(--pearl-ink); }
.band--pearl .lede{ color:#28344C; }
.band--pearl::before{
  content:""; position:absolute; inset:0; opacity:.05; pointer-events:none;
  background-image:var(--jaali); background-size:120px 120px; filter:grayscale(1) brightness(.25);
  -webkit-mask-image:radial-gradient(120% 90% at 50% 50%,transparent 25%,#000 88%);
  mask-image:radial-gradient(120% 90% at 50% 50%,transparent 25%,#000 88%);
}
.band--pearl .shell{ position:relative; }

.head{ max-width:62ch; margin-bottom:clamp(2.5rem,5vw,3.75rem); }
.head .orn{ margin-bottom:1.5rem; }
.band--pearl .head h2{ color:#fff; text-wrap:balance; margin-bottom:1.25rem; }
.band--pearl .head h2{ color:var(--pearl-ink); }

/* ============================================== niches (arcaded panels) */
.niches{ display:grid; gap:clamp(1rem,2vw,1.5rem); grid-template-columns:1fr; }
@media (min-width:640px){ .niches{ grid-template-columns:1fr 1fr; } }
@media (min-width:1060px){ .niches{ grid-template-columns:repeat(4,1fr); } }
.niche{ display:flex; flex-direction:column; }
.niche__arch{ display:block; width:100%; height:82px; overflow:visible; }
.niche__arch .line{ fill:none; stroke:var(--gold-dim); stroke-width:1; vector-effect:non-scaling-stroke; }
.niche__arch .screen{ stroke:none; }
.niche__body{
  flex:1; border:1px solid var(--gold-faint); border-top:0;
  padding:.7rem clamp(1.15rem,2vw,1.6rem) clamp(1.5rem,2.5vw,2rem);
  background:linear-gradient(180deg,rgba(189,146,76,.05),transparent 55%);
}
.niche h3{ color:#fff; margin-bottom:.6rem; }
.niche p{ color:var(--haze); font-size:.96rem; margin:0; }

/* ================================================================ stats */
.stats{ position:relative; border-block:1px solid var(--gold-faint); }
.stats::before{ content:""; position:absolute; inset:0; background-image:var(--jaali); background-size:84px 84px; opacity:.07; }
.stats__in{ position:relative; display:grid; grid-template-columns:1fr; }
@media (min-width:720px){ .stats__in{ grid-template-columns:repeat(3,1fr); } }
.stat{ padding:clamp(2rem,4vw,3rem) 1rem; text-align:center; border-top:1px solid var(--gold-faint); }
.stat:first-child{ border-top:0; }
@media (min-width:720px){
  .stat{ border-top:0; border-left:1px solid var(--gold-faint); }
  .stat:first-child{ border-left:0; }
}
.stat b{ display:block; font-family:var(--display); font-weight:400; font-size:clamp(2.6rem,2rem + 2.6vw,4rem); color:var(--gold-lit); line-height:1; }
.stat span{ display:block; margin-top:.85rem; font-size:.88rem; color:var(--haze); letter-spacing:.04em; }

/* ================================================== who's in the room */
.stages{ display:grid; grid-template-columns:1fr; }
@media (min-width:820px){ .stages{ grid-template-columns:repeat(3,1fr); } }
.stage{ padding:2rem 0; border-top:1px solid var(--pearl-rule); }
@media (min-width:820px){
  .stage{ padding:0 2.4rem; border-top:0; border-left:1px solid var(--pearl-rule); }
  .stage:first-child{ padding-left:0; border-left:0; }
  .stage:last-child{ padding-right:0; }
}
.stage h3{ margin-bottom:.8rem; }
.stage p{ color:#2E3A52; font-size:.97rem; margin:0; }
.notin{ margin-top:clamp(2.5rem,5vw,3.5rem); border-top:1px solid var(--pearl-rule); padding-top:1.75rem; }
.notin p{ color:#38445E; font-size:.95rem; max-width:72ch; margin:0; }
.notin b{ color:var(--pearl-ink); font-weight:500; }

/* ================================================================== run */
.run{ border-top:1px solid var(--gold-faint); }
.step{ display:grid; grid-template-columns:auto 1fr; gap:.3rem 1.5rem; padding:1.6rem 0; border-bottom:1px solid var(--gold-faint); }
.step__no{ font-family:var(--display); color:var(--gold); font-size:1rem; letter-spacing:.14em; padding-top:.2rem; }
.step__time{ color:var(--gold-lit); font-size:.88rem; letter-spacing:.06em; }
.step__body{ grid-column:2; }
.step__body h3{ color:#fff; margin-bottom:.4rem; }
.step p{ color:var(--haze); font-size:.97rem; margin:0; }
@media (min-width:760px){
  .step{ grid-template-columns:60px 118px 1fr; align-items:baseline; gap:0 2.5rem; padding:1.9rem 0; }
  .step__body{ grid-column:auto; }
}
.venue{ margin-top:1.75rem; font-size:.9rem; color:var(--haze); }

/* ================================================================= form */
.apply{ display:grid; gap:clamp(2.5rem,5vw,4.5rem); grid-template-columns:1fr; align-items:start; }
@media (min-width:960px){ .apply{ grid-template-columns:minmax(0,.82fr) minmax(0,1fr); } }
.formwrap{ display:flex; flex-direction:column; }
.formwrap .niche__arch{ height:74px; }
.form{ border:1px solid var(--gold-dim); border-top:0; background:var(--ink-2); padding:clamp(1.4rem,3vw,2.4rem) clamp(1.4rem,3vw,2.4rem) clamp(1.8rem,3vw,2.6rem); }
.grid2{ display:grid; gap:1.35rem; grid-template-columns:1fr; }
@media (min-width:580px){ .grid2{ grid-template-columns:1fr 1fr; } }
.field{ display:block; margin-bottom:1.35rem; }
.field:last-of-type{ margin-bottom:1.9rem; }
.field span{ display:block; font-size:.76rem; letter-spacing:.14em; color:var(--haze); margin-bottom:.5rem; text-transform:uppercase; }
.field input,.field select,.field textarea{
  width:100%; background:transparent; border:0; border-bottom:1px solid rgba(189,146,76,.38);
  color:#fff; font-family:var(--sans); font-weight:300; font-size:1rem; padding:.6rem 0; transition:border-color .25s;
}
.field textarea{ resize:vertical; min-height:90px; line-height:1.6; }
.field select{ appearance:none; cursor:pointer; }
.field select option{ background:var(--ink-2); color:#fff; }
.field input:focus,.field select:focus,.field textarea:focus{ outline:0; border-bottom-color:var(--gold-lit); }
.field input::placeholder,.field textarea::placeholder{ color:#5D6B84; }
.formnote{ margin-top:1.05rem; font-size:.82rem; color:var(--haze); }
.done{ text-align:center; padding:clamp(2.5rem,6vw,4rem) 1rem; }
.done .orn{ margin:0 auto; }
.done h3{ color:var(--gold-lit); margin:1.1rem 0 .8rem; }
.done p{ color:var(--haze); margin-inline:auto; }
[hidden]{ display:none !important; }
.pledge{ margin-top:2rem; display:grid; gap:1.35rem; }
.pledge b{ display:block; font-family:var(--display); font-weight:400; color:#fff; font-size:1.05rem; margin-bottom:.2rem; }
.pledge p{ font-size:.95rem; color:var(--haze); margin:0; }

/* ================================================================== faq */
.faq{ border-top:1px solid var(--gold-faint); max-width:860px; }
.faq details{ border-bottom:1px solid var(--gold-faint); }
.faq summary{
  cursor:pointer; list-style:none; padding:1.55rem 2.6rem 1.55rem 0;
  font-family:var(--display); font-size:clamp(1.05rem,1rem + .3vw,1.24rem);
  color:#fff; position:relative; transition:color .25s;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary:hover{ color:var(--gold-lit); }
.faq summary::after{
  content:""; position:absolute; right:.4rem; top:50%; width:11px; height:11px; margin-top:-6px;
  border-right:1px solid var(--gold); border-bottom:1px solid var(--gold);
  transform:rotate(45deg); transition:transform .3s;
}
.faq details[open] summary::after{ transform:rotate(-135deg); }
.faq .ans{ padding:0 2rem 1.6rem 0; }
.faq .ans p{ color:var(--haze); font-size:.97rem; margin:0; }

/* =============================================================== footer */
.foot{ background:var(--well); border-top:1px solid var(--gold-faint); padding-block:clamp(3rem,6vw,4.5rem) 2rem; }
.foot__top{ display:grid; gap:2.5rem; grid-template-columns:1fr; }
@media (min-width:780px){ .foot__top{ grid-template-columns:1.35fr 1fr 1fr; gap:3rem; } }
.foot img{ width:66px; height:66px; object-fit:cover; margin-bottom:1.1rem; }
.foot h4{ font-family:var(--sans); font-weight:500; font-size:.75rem; letter-spacing:.21em; text-transform:uppercase; color:var(--gold); margin:0 0 1.1rem; }
.foot p,.foot a{ color:var(--haze); font-size:.93rem; text-decoration:none; }
.foot a:hover{ color:#fff; }
.foot ul{ list-style:none; margin:0; padding:0; display:grid; gap:.65rem; }
.tagline{ font-family:var(--display); color:var(--gold-lit); font-size:1.05rem; letter-spacing:.15em; }
.foot__end{ margin-top:3rem; padding-top:1.75rem; border-top:1px solid var(--gold-faint); display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between; font-size:.82rem; color:#5F6C83; }
/* ======================================================== page header
   Used on sub-pages: a single cusped crown instead of the full arcade. */
.pagehead{ position:relative; padding-block:clamp(2rem,5vw,3.5rem) clamp(2.5rem,5vw,4rem); text-align:center; overflow:hidden; }
.pagehead::before{
  content:""; position:absolute; inset:0; background-image:var(--jaali); background-size:104px 104px;
  opacity:.05; pointer-events:none;
  -webkit-mask-image:radial-gradient(100% 70% at 50% 25%,#000 15%,transparent 75%);
  mask-image:radial-gradient(100% 70% at 50% 25%,#000 15%,transparent 75%);
}
.pagehead .shell{ position:relative; }
.crown{ display:block; width:min(880px,100%); height:auto; margin:0 auto clamp(1.5rem,3vw,2.25rem); }
/* the Thoranam crop loses its detail on a phone, so the cable bridge — which
   is wide and reads at any size — takes over below 760px */
@media (max-width:760px){
  .crown--lg{ display:none; }
  .crown--sm{ width:100vw; margin-left:calc(50% - 50vw); }
}
@media (min-width:761px){ .crown--sm{ display:none; } }
.crown .line{ fill:none; stroke:var(--gold); stroke-width:1.5; vector-effect:non-scaling-stroke; }
.crown .thin{ fill:none; stroke:var(--gold); stroke-width:1; opacity:.6; vector-effect:non-scaling-stroke; }
.crown .stud{ fill:var(--gold); stroke:none; }
.crown .bud{ fill:none; stroke:var(--gold); stroke-width:1.2; vector-effect:non-scaling-stroke; }
.crown .screen{ stroke:none; }
.pagehead h1{ color:#fff; margin-bottom:1.1rem; }
.pagehead .lede{ margin-inline:auto; }

/* ============================================================ next room */
.feature{ display:grid; grid-template-columns:1fr; border:1px solid var(--gold-dim); border-top:0; background:var(--ink-2); }
@media (min-width:840px){ .feature{ grid-template-columns:290px 1fr; } }
.feature__when{
  padding:clamp(1.75rem,3vw,2.5rem);
  border-bottom:1px solid var(--gold-faint);
  background:linear-gradient(180deg,rgba(189,146,76,.08),transparent 70%);
}
@media (min-width:840px){ .feature__when{ border-bottom:0; border-right:1px solid var(--gold-faint); } }
.feature__day{ font-family:var(--display); font-size:clamp(3.4rem,2.4rem + 3.4vw,5rem); line-height:.9; color:var(--gold-lit); }
.feature__mon{ font-family:var(--display); font-size:1.35rem; color:#fff; margin-top:.4rem; }
.feature__when dl{ margin:1.75rem 0 0; display:grid; gap:.85rem; font-size:.92rem; }
.feature__when dt{ color:var(--haze); font-size:.72rem; letter-spacing:.15em; text-transform:uppercase; }
.feature__when dd{ margin:.15rem 0 0; color:#E4EAF4; }
.feature__what{ padding:clamp(1.75rem,3vw,2.5rem); }
.feature__what h2{ color:#fff; font-size:clamp(1.6rem,1.2rem + 1.6vw,2.3rem); margin-bottom:.9rem; }
.feature__what p{ color:var(--haze); }
.feature__acts{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.75rem; }

.pill{
  display:inline-flex; align-items:center; gap:.5rem;
  font-size:.72rem; letter-spacing:.15em; text-transform:uppercase;
  border:1px solid var(--gold-dim); color:var(--gold-lit);
  padding:.35rem .8rem; white-space:nowrap;
}
.pill--open{ border-color:rgba(120,190,150,.45); color:#8FD6AC; }
.pill--wait{ border-color:rgba(189,146,76,.45); color:var(--gold-lit); }
.pill--tbc{ border-color:rgba(154,166,186,.35); color:var(--haze); }

/* ======================================================= upcoming list */
.evlist{ border-top:1px solid var(--gold-faint); }
.ev{
  display:grid; grid-template-columns:1fr; gap:.6rem;
  padding:1.75rem 0; border-bottom:1px solid var(--gold-faint);
}
@media (min-width:800px){
  .ev{ grid-template-columns:130px 1fr 190px; gap:0 2.5rem; align-items:start; }
}
.ev__date{ font-family:var(--display); color:var(--gold-lit); font-size:1.1rem; line-height:1.4; }
.ev__date small{ display:block; font-family:var(--sans); font-size:.78rem; letter-spacing:.1em; color:var(--haze); text-transform:uppercase; margin-top:.15rem; }
.ev__body h3{ color:#fff; margin-bottom:.45rem; }
.ev__body p{ color:var(--haze); font-size:.96rem; margin:0; }
.ev__side{ display:flex; flex-direction:column; align-items:flex-start; gap:.8rem; }
@media (min-width:800px){ .ev__side{ align-items:flex-end; } }
.ev__side a{ font-size:.85rem; color:var(--gold-lit); text-decoration:none; border-bottom:1px solid var(--gold-dim); padding-bottom:2px; }
.ev__side a:hover{ color:#fff; border-color:var(--gold); }

/* ============================================================ past rooms */
.past{ display:grid; gap:0; grid-template-columns:1fr; }
@media (min-width:820px){ .past{ grid-template-columns:repeat(3,1fr); } }
.past__item{ padding:2rem 0; border-top:1px solid var(--pearl-rule); }
@media (min-width:820px){
  .past__item{ padding:0 2.3rem; border-top:0; border-left:1px solid var(--pearl-rule); }
  .past__item:first-child{ padding-left:0; border-left:0; }
  .past__item:last-child{ padding-right:0; }
}
.past__when{ font-family:var(--display); color:#8A6A2E; font-size:1rem; letter-spacing:.06em; margin-bottom:.5rem; }
.past__item h3{ margin-bottom:.7rem; }
.past__item p{ color:#2E3A52; font-size:.96rem; margin:0; }

/* ============================================================= chapters */
.chapters{ display:grid; gap:clamp(1rem,2vw,1.5rem); grid-template-columns:1fr; }
@media (min-width:760px){ .chapters{ grid-template-columns:repeat(3,1fr); } }
.chapter{ border:1px solid var(--gold-faint); padding:clamp(1.5rem,2.5vw,2rem); background:linear-gradient(180deg,rgba(189,146,76,.045),transparent 60%); }
.chapter h3{ color:#fff; margin:.9rem 0 .6rem; }
.chapter p{ color:var(--haze); font-size:.95rem; margin:0; }

/* =============================================================== vision */
.vision__lead{
  font-family:var(--display); font-weight:400;
  font-size:clamp(1.6rem,1.1rem + 2.1vw,2.7rem); line-height:1.24;
  color:#fff; max-width:22ch; margin:0 0 1.5rem;
}
.vision__grid{ display:grid; gap:0; grid-template-columns:1fr; margin-top:clamp(2.5rem,5vw,3.5rem);
  border-top:1px solid var(--gold-faint); border-left:1px solid var(--gold-faint); }
@media (min-width:700px){ .vision__grid{ grid-template-columns:1fr 1fr; } }
.vision__cell{ padding:clamp(1.6rem,3vw,2.4rem); border-right:1px solid var(--gold-faint); border-bottom:1px solid var(--gold-faint); }
.vision__cell h3{ color:var(--gold-lit); margin-bottom:.6rem; }
.vision__cell p{ color:var(--haze); font-size:.96rem; margin:0; }

/* =============================================================== notify */
.notify{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.75rem; max-width:520px; }
.notify input{
  flex:1 1 240px; background:transparent; border:0; border-bottom:1px solid rgba(189,146,76,.38);
  color:#fff; font-family:var(--sans); font-weight:300; font-size:1rem; padding:.7rem 0;
}
.notify input:focus{ outline:0; border-bottom-color:var(--gold-lit); }
.notify input::placeholder{ color:#5D6B84; }
.notifynote{ margin-top:1rem; font-size:.85rem; color:var(--haze); }

/* ============================================ Hyderabad landmark artwork
   Line-drawn monuments used as faint watermarks behind sections. Never
   more than one per section, always behind the content, never carrying
   meaning on their own. */
.band,.stats,.hero,.pagehead{ position:relative; overflow:hidden; }
.band > .shell,.stats > .shell,.pagehead > .shell{ position:relative; z-index:1; }
.mono{
  position:absolute; bottom:0; z-index:0; pointer-events:none;
  opacity:.10; line-height:0;
}
/* <use> builds a shadow tree that outer class selectors cannot reach, so the
   linework has to be styled with inheritable SVG properties instead. */
.mono svg{
  display:block; width:100%; height:auto;
  fill:none; stroke:var(--gold); stroke-width:1.9;
  stroke-linejoin:round; stroke-linecap:round;
}
.band--pearl .mono{ opacity:.06; }
.band--pearl .mono svg{ stroke:var(--pearl-ink); }

.mono--br{ right:-2%; bottom:0; width:clamp(230px,30vw,480px); }
.mono--bl{ left:-3%; bottom:0; width:clamp(230px,29vw,460px); }
.mono--tall{ right:3%; bottom:-4%; width:clamp(96px,12vw,190px); }
/* sparse linework needs more weight to register at all */
.mono--wide{ left:50%; transform:translateX(-50%); bottom:-4%; width:clamp(420px,74vw,1040px); opacity:.085; }
.mono--centre{ left:50%; transform:translateX(-50%); bottom:-8%; width:clamp(190px,24vw,330px); }
@media (max-width:760px){
  .mono{ opacity:.07; }
  .mono--br,.mono--bl{ width:64vw; }
}

/* ===================================================== stat blocks (§3) */
.figures{ display:grid; grid-template-columns:1fr; margin-top:clamp(2.5rem,5vw,3.5rem);
  border-top:1px solid var(--gold-faint); border-left:1px solid var(--gold-faint); }
@media (min-width:700px){ .figures{ grid-template-columns:repeat(3,1fr); } }
.figure{ padding:clamp(1.75rem,3.5vw,2.5rem); border-right:1px solid var(--gold-faint); border-bottom:1px solid var(--gold-faint); }
.figure b{ display:block; font-family:var(--display); font-weight:400; line-height:1;
  font-size:clamp(2.8rem,2rem + 3vw,4.4rem); color:var(--gold-lit); }
.figure span{ display:block; margin-top:.9rem; font-size:.94rem; color:var(--haze); }

/* ================================================ who's in the room (§6) */
.profiles{ display:grid; gap:0; grid-template-columns:1fr;
  border-top:1px solid var(--pearl-rule); border-left:1px solid var(--pearl-rule); }
@media (min-width:640px){ .profiles{ grid-template-columns:1fr 1fr; } }
@media (min-width:1000px){ .profiles{ grid-template-columns:repeat(3,1fr); } }
.profile{ padding:clamp(1.5rem,2.6vw,2rem); border-right:1px solid var(--pearl-rule); border-bottom:1px solid var(--pearl-rule); }
.profile h3{ font-size:1.15rem; margin-bottom:.5rem; }
.profile p{ color:#2E3A52; font-size:.94rem; margin:0; }

/* ====================================================== steps (§7) */
.steps{ display:grid; grid-template-columns:1fr; border-top:1px solid var(--gold-faint); }
.stepnum{ display:grid; grid-template-columns:auto 1fr; gap:0 1.6rem; padding:1.7rem 0; border-bottom:1px solid var(--gold-faint); }
.stepnum b{ font-family:var(--display); font-weight:400; color:var(--gold); font-size:1.5rem; line-height:1; width:2.2rem; }
.stepnum h3{ color:#fff; margin-bottom:.4rem; }
.stepnum p{ color:var(--haze); font-size:.96rem; margin:0; }

/* ============================================ Room 01 + next Room (§8,§9) */
.roomcard{ border:1px solid var(--gold-dim); background:var(--ink-2); padding:clamp(1.75rem,3.5vw,2.75rem); }
.roomcard__top{ display:flex; flex-wrap:wrap; gap:1rem; align-items:baseline; justify-content:space-between; margin-bottom:1.25rem; }
.roomcard h3{ color:#fff; font-size:clamp(1.5rem,1.2rem + 1.2vw,2.1rem); }
.roomcard dl{ margin:1.5rem 0 0; display:grid; gap:1rem; grid-template-columns:1fr; }
@media (min-width:660px){ .roomcard dl{ grid-template-columns:repeat(3,1fr); } }
.roomcard dt{ font-size:.72rem; letter-spacing:.15em; text-transform:uppercase; color:var(--haze); }
.roomcard dd{ margin:.3rem 0 0; color:#E4EAF4; }
.roomcard dd b{ color:var(--gold-lit); font-weight:400; }
.roomcard .btn{ margin-top:1.9rem; }

/* ================================================== closing CTA (§12) */
.closing{ text-align:center; }
.closing h2{ color:#fff; margin-bottom:1.1rem; text-wrap:balance; }
.closing p{ margin:0 auto 2rem; color:var(--haze); }


/* ================================================== Hyderabad skyline
   An original panorama assembled from the landmark symbols, all sat on
   one ground line. Used as the floor of the closing section. */
.band--closing{ padding-bottom:clamp(12.5rem,23vw,19rem); }
.skyline{
  position:absolute; left:0; right:0; bottom:0; z-index:0;
  display:flex; justify-content:center; pointer-events:none;
}
.skyline__art{
  display:block; width:100%; min-width:1180px; height:auto;
  fill:none; stroke:var(--gold); stroke-width:1.5;
  stroke-linejoin:round; stroke-linecap:round;
  opacity:.3;
}
@media (max-width:760px){ .skyline__art{ min-width:960px; opacity:.26; } }

/* ==================================================== mobile navigation
   Below 1000px the inline links are replaced by a panel, so the menu is
   reachable rather than just hidden. */
.visually-hidden{
  position:absolute; width:1px; height:1px; margin:-1px; padding:0;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.navtoggle{
  display:none; width:46px; height:46px; flex:none; margin-left:.25rem;
  background:none; border:1px solid var(--gold-dim); cursor:pointer;
  align-items:center; justify-content:center; padding:0;
}
.navtoggle__bars{ display:block; width:20px; }
.navtoggle__bars i{
  display:block; height:1.5px; background:var(--gold-lit); margin:4px 0;
  transition:transform .28s ease, opacity .2s ease;
}
.navtoggle[aria-expanded="true"] .navtoggle__bars i:nth-child(1){ transform:translateY(5.5px) rotate(45deg); }
.navtoggle[aria-expanded="true"] .navtoggle__bars i:nth-child(2){ opacity:0; }
.navtoggle[aria-expanded="true"] .navtoggle__bars i:nth-child(3){ transform:translateY(-5.5px) rotate(-45deg); }

.navpanel{
  border-top:1px solid var(--gold-faint);
  background:rgba(5,13,32,.98);
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  padding:.5rem var(--gut) 1.25rem;
}
.navpanel nav{ display:grid; }
.navpanel a{
  display:block; padding:.95rem 0; text-decoration:none; color:var(--paper);
  font-size:1.05rem; border-bottom:1px solid var(--gold-faint);
}
.navpanel a:last-child{ border-bottom:0; }
.navpanel a:active{ color:var(--gold-lit); }
@media (max-width:1000px){ .navtoggle{ display:flex; } }
/* below 620px the bar only has room for the wordmark and the toggle, so the
   apply button moves into the panel rather than crowding the brand */
@media (max-width:620px){ .nav .nav__cta{ display:none; } }
@media (min-width:1001px){ .navpanel{ display:none !important; } }

/* ======================================= text + illustration side by side */
.split{ display:grid; gap:clamp(2.5rem,5vw,4.5rem); grid-template-columns:1fr; align-items:center; }
@media (min-width:920px){ .split{ grid-template-columns:1.05fr .95fr; } }
.split__art{ margin:0; }
.split__art svg{
  display:block; width:100%; max-width:340px; height:auto; margin-inline:auto;
  fill:none; stroke:var(--gold); stroke-width:1.9;
  stroke-linejoin:round; stroke-linecap:round; opacity:.55;
}
.split__art figcaption{
  margin-top:1.1rem; text-align:center; font-size:.76rem;
  letter-spacing:.22em; text-transform:uppercase; color:var(--haze);
}
@media (max-width:919px){ .split__art svg{ max-width:210px; } }

/* ============================================ morning / evening switch */
.sched{ display:inline-flex; border:1px solid var(--gold-dim); margin-bottom:2.25rem; }
.sched__btn{
  font-family:var(--sans); font-size:.8rem; font-weight:400; letter-spacing:.1em;
  text-transform:uppercase; color:var(--haze); background:none; border:0;
  padding:.8rem 1.15rem; cursor:pointer; min-height:44px;
  transition:color .25s, background .25s;
}
.sched__btn + .sched__btn{ border-left:1px solid var(--gold-dim); }
.sched__btn:hover{ color:#fff; }
.sched__btn.is-on{ background:var(--gold); color:var(--ink); }

/* ======================================================= mobile polish */
@media (max-width:760px){
  body{ -webkit-tap-highlight-color:rgba(189,146,76,.2); }
  .band{ padding-block:clamp(3rem,11vw,4.5rem); }
  /* comfortable tap targets throughout */
  .faq summary{ padding-block:1.25rem; min-height:52px; }
  .foot ul a,.navpanel a{ min-height:44px; display:flex; align-items:center; }
  .btn{ min-height:48px; }
  .ev__side a,.link{ padding-block:.5rem; display:inline-block; }
  /* stop long words and URLs forcing sideways scroll */
  h1,h2,h3,p,dd{ overflow-wrap:anywhere; }
  .sched{ width:100%; }
  .sched__btn{ flex:1; padding-inline:.5rem; }
  .roomcard dl{ gap:1.25rem; }
  .figures .figure{ padding-block:1.5rem; }
}
@media (max-width:420px){
  .btn{ font-size:.8rem; letter-spacing:.08em; padding-inline:1.2rem; }
  .split__art svg{ max-width:172px; }
}

/* anchor targets must clear the sticky header when jumped to */
section[id],div[id],main[id]{ scroll-margin-top:92px; }
@media (max-width:1000px){ section[id],div[id],main[id]{ scroll-margin-top:80px; } }


/* ================================================ kolam section dividers
   Muggu drawn on a Telangana doorstep is a threshold marker, which is
   exactly the job here: it tells you one part of the page has ended. */
.kolam{ position:relative; height:46px; background:var(--ink); }
.kolam::before{
  content:""; position:absolute; inset:0;
  background-image:var(--kolam); background-repeat:repeat-x;
  background-position:center; background-size:auto 46px; opacity:.7;
}
/* the divider takes the tone of the section it follows, so it reads as a
   threshold rather than a stripe of a slightly different navy */
.band--well + .kolam{ background:var(--well); }
@media (max-width:760px){
  .kolam{ height:34px; }
  .kolam::before{ background-size:auto 34px; }
}