/* =============================================================================
   बालसंस्कार फेस्टिवल २०२६ — shared stylesheet for all eleven pages
   -----------------------------------------------------------------------------
   1. Typography system (Devanagari-safe)
   2. Tokens (colour, spacing, per-competition accents)
   3. Shared chrome: header, navigation, footer
   4. Homepage: hero, cards, eligibility, explorer, FAQ
   5. Competition pages (four layout personalities)
   6. Registration form
   7. Responsive + reduced motion
   ========================================================================== */

/* ==========================================================================
   1. TYPOGRAPHY
   --------------------------------------------------------------------------
   Marathi (Devanagari) and Latin are served by different families on purpose.
     • --font-marathi      : Devanagari body + headings (also covers the Latin
                             letters that appear inside Marathi sentences, so
                             mixed text such as "कृत्रिम बुद्धिमत्ता (AI) आणि…"
                             keeps one consistent rhythm).
     • --font-display      : Noto Serif Devanagari — used only for page titles.
     • --font-latin        : Inter — English-only interface text
                             (.english-text: badges, "Group Dance", step numbers).
   Every family the site depends on is loaded with weights 400 / 500 / 600 / 700
   (see the <link> in each HTML file) and each stack ends in system fallbacks so
   the site stays readable offline.
   ========================================================================== */
:root{
  --font-marathi: "Noto Sans Devanagari", "Nirmala UI", "Kokila", "Mangal", "Sahyadri",
                  system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-display: "Noto Serif Devanagari", "Noto Sans Devanagari", "Kokila", "Nirmala UI",
                  Georgia, "Times New Roman", serif;
  --font-latin:   "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* ==========================================================================
   1b. ORGANISER NAME SIZE
   --------------------------------------------------------------------------
   The organiser identity (श्री राधाकृष्ण फ्रेंड्स क्लब, शिरवळ) is sized from one
   place: every --org-size-* value is the size the element used to have
   multiplied by --organizer-scale (1.5). Change the single scale variable to
   make the organiser name larger or smaller everywhere at once.

   Every .org-name instance keeps line-height 1.5 and normal wrapping so the
   bigger Devanagari type never clips a vowel sign or a conjunct.
   ========================================================================== */
:root{
  --organizer-scale: 1.5;

  --org-size-brand:  calc(0.74rem * var(--organizer-scale));   /* header brand  */
  --org-size-hero:   calc(0.85rem * var(--organizer-scale));   /* hero eyebrow  */
  --org-size-footer: calc(0.88rem * var(--organizer-scale));   /* footer        */
}

/* one shared class — no scattered, arbitrary overrides */
.org-name{
  font-family:var(--font-display);
  font-weight:700;
  color:var(--maroon);
  line-height:1.5;
  letter-spacing:0;
  text-transform:none;
  overflow-wrap:break-word;
}

/* ==========================================================================
   2. TOKENS
   ========================================================================== */
:root{
  --ivory:      #FDF9F1;
  --ivory-2:    #FAF3E6;
  --cream:      #F5EADA;
  --cream-2:    #EFE1CC;
  --paper:      #FFFDF8;

  --saffron:    #E8890C;
  --maroon:     #7A1F2B;
  --maroon-2:   #5C131C;
  --red:        #C1272D;
  --green:      #1E7A52;
  --green-2:    #2F9C6A;
  --gold:       #C99A3C;
  --teal:       #10696F;

  /* Muted blue with ivory undertones: scoped to the organiser card. */
  --org-blue:       #365F88;
  --org-blue-deep:  #264767;
  --org-blue-soft:  #EAF0F5;
  --org-blue-line:  #BCCDDD;

  --ink:        #2B2118;
  --ink-2:      #54453A;
  --ink-3:      #7A6A5C;

  --line:       #E9D9BF;
  --line-2:     #F1E5CF;

  --shadow-sm:  0 2px 8px rgba(90, 60, 20, .06);
  --shadow-md:  0 12px 30px rgba(122, 31, 43, .08), 0 2px 6px rgba(90, 60, 20, .05);
  --shadow-lg:  0 26px 60px rgba(122, 31, 43, .13), 0 4px 14px rgba(90, 60, 20, .07);

  --grad-warm:   linear-gradient(135deg, #F2A63B 0%, #E8890C 50%, #C1272D 100%);
  --grad-maroon: linear-gradient(135deg, #8E2532 0%, #7A1F2B 55%, #5C131C 100%);

  --radius-sm: 10px;
  --radius:    14px;
  --radius-lg: 20px;
  --radius-xl: 28px;

  --container: 1160px;
  --header-h:  74px;
}

/* Per-competition accents — one variable, nine identities. */
[data-accent]{
  --accent: var(--maroon);
  --accent-deep: var(--maroon-2);
  --accent-soft: rgba(122, 31, 43, .10);
  --accent-line: rgba(122, 31, 43, .22);
  --accent-grad: var(--grad-maroon);
}
[data-accent="saffron"]{ --accent:#C9750A; --accent-deep:#9A5A05; --accent-soft:rgba(232,137,12,.12); --accent-line:rgba(232,137,12,.28); --accent-grad:linear-gradient(135deg,#F2A63B,#E8890C); }
[data-accent="green"]  { --accent:#1E7A52; --accent-deep:#125840; --accent-soft:rgba(30,122,82,.11); --accent-line:rgba(30,122,82,.26); --accent-grad:linear-gradient(135deg,#4E9E63,#1E7A52); }
[data-accent="maroon"] { --accent:#7A1F2B; --accent-deep:#5C131C; --accent-soft:rgba(122,31,43,.10); --accent-line:rgba(122,31,43,.24); --accent-grad:linear-gradient(135deg,#8E2532,#5C131C); }
[data-accent="gold"]   { --accent:#A87A22; --accent-deep:#7E5A12; --accent-soft:rgba(201,154,60,.14); --accent-line:rgba(201,154,60,.34); --accent-grad:linear-gradient(135deg,#E0B45A,#A87A22); }
[data-accent="red"]    { --accent:#C1272D; --accent-deep:#8E1B20; --accent-soft:rgba(193,39,45,.10); --accent-line:rgba(193,39,45,.24); --accent-grad:linear-gradient(135deg,#D6454B,#8E1B20); }
[data-accent="teal"]   { --accent:#10696F; --accent-deep:#0A474C; --accent-soft:rgba(16,105,111,.10); --accent-line:rgba(16,105,111,.24); --accent-grad:linear-gradient(135deg,#1E7A52,#10696F); }
[data-accent="plum"]   { --accent:#7B2E5B; --accent-deep:#5A1F42; --accent-soft:rgba(123,46,91,.10); --accent-line:rgba(123,46,91,.24); --accent-grad:linear-gradient(135deg,#A44A7C,#7B2E5B); }
[data-accent="indigo"] { --accent:#3C5A8C; --accent-deep:#2A4169; --accent-soft:rgba(60,90,140,.10); --accent-line:rgba(60,90,140,.24); --accent-grad:linear-gradient(135deg,#5F7FB5,#3C5A8C); }
[data-accent="bronze"] { --accent:#8A5A2B; --accent-deep:#5F3D1B; --accent-soft:rgba(138,90,43,.11); --accent-line:rgba(138,90,43,.26); --accent-grad:linear-gradient(135deg,#C08A4E,#8A5A2B); }

/* ---------------------------------- reset --------------------------------- */
*,*::before,*::after{ box-sizing:border-box; }
html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--header-h) + 20px);
}
body{
  margin:0;
  font-family:var(--font-marathi);
  font-weight:400;
  font-size:1rem;
  line-height:1.85;              /* Devanagari vowel signs need room */
  color:var(--ink);
  background:var(--ivory);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  overflow-wrap:break-word;      /* long Marathi compounds must never overflow */
}
img,svg{ max-width:100%; }
button{ font:inherit; color:inherit; }
a{ color:var(--maroon); text-decoration:none; }
a:hover{ color:var(--red); }
ul,ol{ margin:0 0 1em; padding:0; }

/* Headings: one rhythm on all eleven pages. No letter-spacing on Devanagari,
   no uppercase, and line-heights that never clip the शिरोरेखा or vowel marks. */
h1,h2,h3,h4,h5{
  margin:0 0 .5em;
  font-family:var(--font-marathi);
  font-weight:700;
  color:var(--maroon);
  overflow-wrap:break-word;      /* long Marathi words must not overflow */
  word-break:normal;
  hyphens:none;
  text-wrap:balance;
}
h1{ font-family:var(--font-display); font-weight:700; font-size:clamp(1.9rem, 4.6vw, 2.95rem); line-height:1.26; }
h2{ font-size:clamp(1.35rem, 3vw, 1.95rem); line-height:1.34; }
h3{ font-size:clamp(1.1rem, 2.1vw, 1.3rem);  line-height:1.45; }
h4{ font-size:1.05rem; line-height:1.5; }
p{ margin:0 0 1em; }
:focus-visible{ outline:3px solid var(--saffron); outline-offset:3px; border-radius:6px; }

/* English-only interface text → Inter. Safe to track + uppercase here. */
.english-text{
  font-family:var(--font-latin);
  font-weight:600;
  font-feature-settings:"liga" 1,"kern" 1;
}

.container{ width:100%; max-width:var(--container); margin:0 auto; padding:0 22px; }
.skip-link{
  position:absolute; left:16px; top:-60px; z-index:300;
  background:var(--maroon); color:#fff; padding:10px 18px; border-radius:0 0 12px 12px;
  transition:top .2s ease; font-size:.9rem;
}
.skip-link:focus{ top:0; color:#fff; }

.sprite{ position:absolute; width:0; height:0; overflow:hidden; }
.icon{ width:1em; height:1em; display:inline-block; vertical-align:-.14em; fill:none;
       stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }

.noscript-note{
  background:#FFF3D6; border:1px solid var(--gold); color:#6B4E10;
  padding:14px 18px; border-radius:var(--radius); margin:0 0 20px; font-size:.95rem;
}

/* --------------------------------- buttons -------------------------------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  padding:.72em 1.5em; border:1.5px solid transparent; border-radius:999px;
  font-family:var(--font-marathi); font-weight:600; font-size:1rem; line-height:1.6;
  cursor:pointer; text-align:center;
  transition:transform .18s ease, box-shadow .18s ease, background .2s ease, color .2s ease, border-color .2s ease;
}
.btn--lg{ padding:.85em 1.9em; font-size:1.05rem; }
.btn--primary{ background:var(--grad-warm); color:#fff; box-shadow:0 10px 24px rgba(193,39,45,.24); }
.btn--primary:hover{ color:#fff; transform:translateY(-2px); box-shadow:0 16px 32px rgba(193,39,45,.3); }
.btn--outline{ background:transparent; border-color:var(--maroon); color:var(--maroon); }
.btn--outline:hover{ background:var(--maroon); color:#fff; transform:translateY(-2px); }
.btn--ghost{ background:transparent; border-color:var(--line); color:var(--ink-2); }
.btn--ghost:hover{ background:var(--cream); color:var(--ink); }
.btn:active{ transform:translateY(0); }
.btn[disabled]{ opacity:.6; cursor:not-allowed; transform:none; box-shadow:none; }
.btn .icon{ width:1.05em; height:1.05em; transition:transform .2s ease; }
.btn:hover .icon{ transform:translateX(4px); }

/* WhatsApp group button — warm cream/white with a WhatsApp-inspired green accent
   that sits inside the existing saffron / maroon palette. 44px minimum tap
   target, visible focus ring, readable contrast. */
.btn--whatsapp{
  /* #1F7F4E → #166B41 keeps white label text above 4.5:1 (WCAG AA) */
  background:linear-gradient(135deg, #1F7F4E 0%, #166B41 100%);
  color:#FFFFFF; border-color:#12583A;
  box-shadow:0 10px 24px rgba(18,88,58,.24);
}
.btn--whatsapp:hover{
  color:#FFFFFF; transform:translateY(-2px);
  background:linear-gradient(135deg, #1B7448 0%, #115638 100%);
  box-shadow:0 16px 30px rgba(18,88,58,.3);
}
.btn--whatsapp:focus-visible{ outline:3px solid var(--saffron); outline-offset:3px; }
.btn--whatsapp .wa-btn__icon{ width:1.25em; height:1.25em; }
.btn--whatsapp:hover .wa-btn__icon{ transform:none; }
.btn--whatsapp .wa-btn__label{ font-family:var(--font-latin); font-weight:600; letter-spacing:.01em; }
.btn--sm{ padding:.42em 1.05em; font-size:.9rem; }

/* ==========================================================================
   3. SHARED CHROME
   ========================================================================== */
.site-header{
  position:sticky; top:0; z-index:120;
  background:rgba(253,249,241,.88);
  backdrop-filter:blur(12px) saturate(140%);
  -webkit-backdrop-filter:blur(12px) saturate(140%);
  border-bottom:1px solid transparent;
  transition:box-shadow .25s ease, border-color .25s ease;
}
.site-header.is-scrolled{ border-bottom-color:var(--line); box-shadow:0 6px 22px rgba(90,60,20,.07); }
.header__inner{ min-height:var(--header-h); display:flex; align-items:center; justify-content:space-between; gap:18px; }

.brand{ display:flex; align-items:center; gap:12px; color:var(--maroon); flex:0 0 auto; }
.brand__emblem{
  width:42px; height:42px; flex:0 0 42px; display:grid; place-items:center; border-radius:50%;
  color:var(--saffron); background:radial-gradient(circle at 50% 45%, #FFF6E2, #FBEBD0);
  box-shadow:inset 0 0 0 1.5px rgba(201,154,60,.45), 0 3px 10px rgba(122,31,43,.12);
}
.brand__emblem .icon{ width:28px; height:28px; }
.brand__text{ display:flex; flex-direction:column; line-height:1.35; }
.brand__title{ font-family:var(--font-display); font-weight:700; font-size:1.02rem; color:var(--maroon); }
.brand__sub{
  font-size:var(--org-size-brand); line-height:1.45; color:var(--ink-2);
  overflow-wrap:break-word;
}

.nav{ display:flex; align-items:center; gap:22px; }
.nav__list{ display:flex; align-items:center; gap:20px; list-style:none; margin:0; }
.nav__item{ position:relative; }
.nav__link{
  position:relative; display:inline-flex; align-items:center; gap:6px;
  font-size:.95rem; font-weight:500; color:var(--ink-2); background:none; border:0;
  padding:8px 0; cursor:pointer; transition:color .2s ease;
}
.nav__link::after{
  content:""; position:absolute; left:0; right:100%; bottom:0; height:2px; border-radius:2px;
  background:var(--grad-warm); transition:right .25s ease;
}
.nav__link:hover, .nav__link.is-active{ color:var(--maroon); }
.nav__link:hover::after, .nav__link.is-active::after{ right:0; }
.nav__chevron{ width:.9em; height:.9em; transform:rotate(90deg); transition:transform .25s ease; }
.nav__item--has-menu.is-open .nav__chevron,
.nav__item--has-menu:hover .nav__chevron{ transform:rotate(-90deg); }

.nav__menu{
  position:absolute; top:calc(100% + 12px); right:0; left:auto; z-index:130;
  min-width:min(310px, calc(100vw - 44px)); list-style:none; margin:0; padding:8px;
  background:var(--paper); border:1px solid var(--line-2); border-radius:var(--radius);
  box-shadow:var(--shadow-lg);
  opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s ease;
}
.nav__item--has-menu:hover > .nav__menu,
.nav__item--has-menu:focus-within > .nav__menu,
.nav__item--has-menu.is-open > .nav__menu{ opacity:1; visibility:visible; transform:none; }
.nav__menu::before{ content:""; position:absolute; top:-10px; left:0; right:0; height:10px; }
.nav__menu-link{
  display:flex; align-items:center; gap:12px; padding:9px 12px; border-radius:var(--radius-sm);
  color:var(--ink-2); font-size:.95rem; transition:background .16s ease, color .16s ease;
}
.nav__menu-link:hover, .nav__menu-link.is-current{ background:var(--ivory-2); color:var(--maroon); }
.nav__menu-icon{
  width:32px; height:32px; flex:0 0 32px; display:grid; place-items:center; border-radius:10px;
  color:#fff; background:var(--accent-grad); box-shadow:0 4px 10px rgba(90,60,20,.14);
}
.nav__menu-icon .icon{ width:18px; height:18px; }
.nav__menu-text{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.nav__actions{ display:flex; align-items:center; gap:10px; }
.nav__cta{ white-space:nowrap; }
.nav__wa{ min-height:44px; white-space:nowrap; }
.nav__wa .wa-btn__label{ font-family:var(--font-marathi); }
@media (max-width: 1180px){
  /* keep the header on one line: the WhatsApp group stays reachable as an
     icon button with an aria-label instead of a wide text button */
  .nav__wa-text{ display:none; }
  .nav__wa{ padding:.5em .7em; }
}
.footer__wa{ margin-top:16px; }
.footer__wa .btn{ width:100%; max-width:280px; justify-content:center; }
.footer__wa-note{
  margin:8px 0 0; font-size:.8rem; line-height:1.5; color:rgba(246,231,211,.72);
  max-width:34ch;
}

.nav-toggle{
  display:none; width:44px; height:44px; border-radius:12px; border:1px solid var(--line);
  background:var(--paper); cursor:pointer; padding:0; place-items:center;
}
.nav-toggle__bars{ display:block; width:20px; }
.nav-toggle__bars i{ display:block; height:2px; border-radius:2px; background:var(--maroon); margin:4px 0; transition:transform .25s ease, opacity .2s ease; }
.nav-toggle[aria-expanded="true"] i:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] i:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] i:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

/* badges + tags */
.badge{
  display:inline-flex; align-items:center; gap:8px; flex-wrap:wrap;
  border-radius:999px; padding:.34em .9em; font-size:.82rem; font-weight:600;
  color:var(--green); background:rgba(30,122,82,.09); border:1px solid rgba(30,122,82,.24);
}
.badge--online{ color:#0A6D6D; background:rgba(16,105,111,.08); border-color:rgba(16,105,111,.28); }
.badge--online .icon{ width:1.05em; height:1.05em; }
.badge__latin{ font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; font-weight:700; }
.badge__mr{ font-size:.82rem; }
.badge__mr::before{ content:"·"; margin-right:6px; opacity:.6; }
.badge--sm{ padding:.22em .68em; font-size:.72rem; }
.badge--sm .badge__latin{ font-size:.62rem; }

.tag{
  display:inline-flex; align-items:center; border-radius:999px; padding:.1em .6em;
  font-size:.68rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  border:1px solid var(--line); color:var(--ink-3); background:var(--paper);
}
.tag--online{ color:#0A6D6D; border-color:rgba(16,105,111,.3); background:rgba(16,105,111,.07); }
.tag--num{ font-family:var(--font-marathi); font-size:.74rem; letter-spacing:0; text-transform:none; color:var(--ink-3); }

/* footer */
.site-footer{
  background:var(--grad-maroon); color:#F6E7D3; padding:clamp(38px, 5vw, 58px) 0 28px;
  position:relative; overflow:hidden; margin-top:0;
}
.site-footer::before{
  content:""; position:absolute; inset:0;
  background-image:radial-gradient(rgba(255,255,255,.08) 1px, transparent 1px);
  background-size:20px 20px; opacity:.5;
}
.footer__inner{ position:relative; }
.footer__top{
  display:grid; gap:28px; grid-template-columns:minmax(0,1.1fr) minmax(0,1.3fr) minmax(0,.9fr);
  padding-bottom:26px; border-bottom:1px solid rgba(255,255,255,.14);
}
.footer__brand{ display:flex; align-items:flex-start; justify-content:center; gap:14px; text-align:center; }
.brand__emblem--footer{ background:rgba(255,255,255,.10); box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.26); color:var(--saffron); }
.footer__brand > div{ text-align:center; }
.footer__title{ font-family:var(--font-display); font-size:1.25rem; margin:0; color:#FFF3E0; }
.footer__org{ font-size:var(--org-size-footer); line-height:1.5; margin:.2em 0 0; color:rgba(255,243,224,.92); }
.footer__nav-title{ font-size:.8rem; font-weight:700; color:#FFD79A; margin:0 0 10px; }
.footer__nav ul{ list-style:none; display:grid; gap:6px; }
.footer__nav a{ color:rgba(246,231,211,.86); font-size:.9rem; }
.footer__nav a:hover{ color:#FFD79A; text-decoration:underline; text-underline-offset:4px; }
.footer__note{ max-width:62ch; margin:22px auto 14px; font-size:.92rem; color:rgba(246,231,211,.78); text-align:center; }
.footer__copy{ margin:0; font-size:.82rem; color:rgba(246,231,211,.6); text-align:center; }

/* ==========================================================================
   4. HOMEPAGE
   ========================================================================== */
.section{ padding:clamp(48px, 6.5vw, 84px) 0; position:relative; }
.section--cream{ background:var(--ivory-2); border-top:1px solid var(--line-2); border-bottom:1px solid var(--line-2); }
.section--plain{ background:var(--ivory); }
.section-head{ max-width:720px; margin:0 auto clamp(28px, 4vw, 46px); text-align:center; }
.section-head__kicker{
  display:inline-block; margin:0 0 .5em; font-size:.8rem; font-weight:700; color:var(--green);
  background:rgba(30,122,82,.09); border:1px solid rgba(30,122,82,.2); padding:.3em 1em; border-radius:999px;
}
.section-head__title{ margin-bottom:.3em; }
.ornament{ display:block; width:140px; height:14px; margin:0 auto 1em; position:relative; }
.ornament::before,.ornament::after{
  content:""; position:absolute; top:50%; width:46px; height:1.5px; transform:translateY(-50%);
  background:linear-gradient(90deg, transparent, var(--gold));
}
.ornament::before{ left:0; }
.ornament::after{ right:0; background:linear-gradient(90deg, var(--gold), transparent); }
.ornament{
  background:radial-gradient(circle at 50% 50%, var(--red) 0 3.4px, transparent 4px),
             radial-gradient(circle at 50% 50%, rgba(201,154,60,.6) 0 7px, transparent 7.6px);
  background-repeat:no-repeat;
}
.section-head__lede{ color:var(--ink-2); margin:0; }
.section-head__lede strong{ color:var(--maroon); }

/* hero */
.hero{
  position:relative; overflow:hidden; padding:clamp(44px, 6.5vw, 84px) 0 clamp(70px, 9vw, 110px);
  background:
    radial-gradient(1100px 560px at 84% 10%, #FFF1D6 0%, rgba(255,241,214,0) 60%),
    radial-gradient(820px 480px at 6% 92%, #FBE6D6 0%, rgba(251,230,214,0) 62%),
    linear-gradient(180deg, #FDF9F1 0%, #FBF4E7 60%, #F7EDDC 100%);
  isolation:isolate;
}
.hero__decor{ position:absolute; inset:0; z-index:-1; pointer-events:none; }
.hero__decor .grain{
  position:absolute; inset:0; opacity:.45;
  background-image:radial-gradient(rgba(201,154,60,.2) 1px, transparent 1px);
  background-size:22px 22px;
  mask-image:radial-gradient(circle at 50% 30%, #000 0%, transparent 70%);
  -webkit-mask-image:radial-gradient(circle at 50% 30%, #000 0%, transparent 70%);
}
.hero__inner{ display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:clamp(24px,4vw,52px); align-items:center; }
.hero__content{ min-width:0; text-align:center; margin:0 auto; }
.hero__title::after{ margin-left:auto; margin-right:auto; }
.hero__lede{ margin-left:auto; margin-right:auto; }
.hero__tagline{ text-wrap:balance; }
.hero__chips{ justify-content:center; }
.hero__actions{ justify-content:center; }

/* --- अध्यक्षांचे छायाचित्र (logo-left.png) ---------------------------------
   A quiet card below the lede: circular portrait, अध्यक्ष badge, name, club & phone.
   Hidden entirely by the script while the photo is missing. */
.hero__organizer{ display:flex; justify-content:center; margin:16px 0 24px; }
.org-card{
  display:inline-flex; align-items:center; gap:14px; margin:0; text-align:left;
  padding:10px 20px 10px 10px;
  background:linear-gradient(135deg, var(--org-blue-soft), var(--ivory)); border:1px solid var(--org-blue-line);
  border-radius:24px; box-shadow:0 4px 18px rgba(54,95,136,.12);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  max-width:100%;
}
.org-card__frame{
  flex:0 0 auto; width:76px; height:76px; border-radius:50%; overflow:hidden;
  display:grid; place-items:center; background:var(--org-blue-soft);
  box-shadow:inset 0 0 0 2px var(--paper), 0 0 0 2px var(--org-blue), 0 4px 12px rgba(54,95,136,.14);
}
.org-card__photo{ display:block; width:100%; height:100%; object-fit:cover; }
/* shape: "square" in data.js keeps logos / group photos uncropped */
.hero__organizer:not(.hero__organizer--circle) .org-card__frame{ border-radius:16px; }
.hero__organizer:not(.hero__organizer--circle) .org-card__photo{ object-fit:contain; }
.org-card__caption{ display:grid; gap:2px; min-width:0; }
.org-card__role{
  font-size:.8rem; font-weight:700; color:var(--org-blue-deep);
  background:var(--org-blue-soft); border:1px solid var(--org-blue-line);
  border-radius:999px; padding:.12em .75em; justify-self:start;
}
.org-card__name{ font-size:1.02rem; font-weight:700; color:var(--org-blue-deep); line-height:1.4; overflow-wrap:break-word; }
.org-card__club{ font-size:.82rem; font-weight:500; color:var(--org-blue-deep); line-height:1.3; }
.org-card__phone{
  font-size:.85rem; font-weight:600; color:var(--org-blue); text-decoration:none;
  display:inline-flex; align-items:center; gap:5px; margin-top:2px;
  transition:color .18s ease;
}
.org-card__phone:hover, .org-card__phone:focus{ color:var(--org-blue-deep); text-decoration:underline; }
.org-card__phone .icon{ color:currentColor; }
.hero__eyebrow{
  display:inline-flex; align-items:center; gap:10px; margin:0 0 16px; font-size:.85rem; font-weight:600;
  color:var(--maroon); background:rgba(255,255,255,.7); border:1px solid var(--line);
  padding:.4em 1em; border-radius:999px; box-shadow:var(--shadow-sm);
}
.hero__eyebrow::before{ display:none; }
/* the organiser name is the hero's organiser heading */
.hero__eyebrow.org-name{
  display:flex; justify-content:center; text-align:center;
  font-size:var(--org-size-hero); font-weight:700; line-height:1.5;
  padding:.45em 1.1em; max-width:100%;
}
.hero__eyebrow::before{ content:""; width:24px; height:2px; border-radius:2px; background:var(--grad-warm); }
.hero__title{
  margin:0 0 .3em;
  /* Homepage festival name. Flat maroon is the baseline: it is what browsers
     without gradient text (and Windows High Contrast) actually paint, and it
     keeps the title readable if the gradient below is unsupported. */
  color:var(--maroon);
}

/* pink → blue → purple → orange → red → maroon, left to right across the words.
   Nothing is loaded and no extra markup is needed: the text itself is clipped to
   the gradient. Every stop — and the blends between them — clears 4.5:1 against
   the cream hero (#EFE1CC), so the heading stays WCAG AA at every size it uses:
   #C2185B 4.6:1 · #1E4E9A 6.3:1 · #6A1B9A 7.3:1 · #9C4300 5.1:1 · #C1272D 4.5:1
   · #7A1F2B 7.9:1. The ::after bar keeps its own saffron gradient. */
@supports (-webkit-background-clip:text){
  .hero__title{
    background-image:linear-gradient(95deg,#C2185B 0%,#1E4E9A 22%,#6A1B9A 42%,#9C4300 62%,#C1272D 82%,#7A1F2B 100%);
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
    color:transparent;
  }
}

/* High-contrast / forced-colours mode: drop the gradient so the title keeps the
   system's text colour instead of turning into an invisible transparent box. */
@media (forced-colors: active){
  .hero__title{
    background-image:none;
    -webkit-text-fill-color:currentColor;
    color:CanvasText;
  }
}

/* Print and text-only fallbacks: solid maroon again, never a blank heading. */
@media print{
  .hero__title{ background-image:none; -webkit-text-fill-color:currentColor; color:var(--maroon); }
}
.hero__title::after{ content:""; display:block; width:104px; height:5px; margin-top:.42em; border-radius:99px; background:var(--grad-warm); }
.hero__tagline{ font-family:var(--font-display); font-size:clamp(1.1rem, 2.4vw, 1.45rem); color:var(--red); margin:0 0 .6em; line-height:1.55; }
.hero__lede{ max-width:54ch; color:var(--ink-2); margin:0 0 1.5em; }
.hero__actions{ display:flex; flex-wrap:wrap; gap:14px; margin-bottom:24px; }
.hero__chips{ display:flex; flex-wrap:wrap; gap:10px; list-style:none; margin:0; }
.hero__chips .chip{ background:rgba(255,255,255,.75); }
.chip{
  display:inline-flex; align-items:center; gap:8px; font-size:.85rem; color:var(--ink-2);
  background:var(--paper); border:1px solid var(--line); border-radius:999px; padding:.36em .95em;
}
.chip .icon{ color:var(--green); width:1.05em; height:1.05em; }
.chip--soft{ font-size:.82rem; color:var(--ink-2); background:var(--paper); border:1px solid var(--line-2); padding:.28em .8em; }
.chip__no{ font-family:var(--font-latin); font-size:.7rem; font-weight:700; color:#fff; background:var(--accent-grad); border-radius:99px; padding:.05em .5em; }

.hero__art{ position:relative; min-height:clamp(260px, 34vw, 400px); display:grid; place-items:center; }
.hero__mandala{ width:min(100%, 430px); aspect-ratio:1; filter:drop-shadow(0 16px 34px rgba(122,31,43,.14)); }
.hero__mandala .m-ring{ transform-box:view-box; transform-origin:110px 110px; animation:spin 120s linear infinite; }
.hero__mandala .m-ring--2{ animation-duration:84s; animation-direction:reverse; }
.hero__mandala .m-ring--3{ animation-duration:160s; }
@keyframes spin{ to{ transform:rotate(360deg); } }
.art-diya{ position:absolute; bottom:2%; left:2%; width:88px; }
.art-diya .diya-body{ fill:var(--maroon); }
.art-diya .diya-flame{ fill:#F2A63B; animation:flicker 2.8s ease-in-out infinite; transform-origin:32px 17px; }
.art-diya .diya-base{ fill:var(--gold); }
@keyframes flicker{ 0%,100%{ transform:scaleY(1); opacity:1; } 50%{ transform:scaleY(1.12); opacity:.88; } }
.art-book{
  position:absolute; top:4%; right:4%; width:92px; height:66px; border-radius:8px; transform:rotate(-8deg);
  background:linear-gradient(120deg, #FFFFFF, #FFF3DC);
  box-shadow:inset 0 0 0 1.5px rgba(201,154,60,.5), 0 12px 24px rgba(122,31,43,.14);
}
.art-book::before{
  content:""; position:absolute; inset:0; border-radius:8px;
  background:linear-gradient(90deg, transparent 46%, var(--maroon) 47%, var(--maroon) 53%, transparent 54%); opacity:.6;
}
.art-flower{
  position:absolute; bottom:12%; right:0; width:68px; height:68px; border-radius:50%; opacity:.7;
  background:
    radial-gradient(circle at 50% 50%, var(--red) 0 13%, transparent 14%),
    conic-gradient(from 0deg, rgba(193,39,45,.5) 0 8%, transparent 8% 12.5%,
                   rgba(193,39,45,.5) 12.5% 20.5%, transparent 20.5% 25%,
                   rgba(193,39,45,.5) 25% 33%, transparent 33% 37.5%,
                   rgba(193,39,45,.5) 37.5% 45.5%, transparent 45.5% 50%,
                   rgba(193,39,45,.5) 50% 58%, transparent 58% 62.5%,
                   rgba(193,39,45,.5) 62.5% 70.5%, transparent 70.5% 75%,
                   rgba(193,39,45,.5) 75% 83%, transparent 83% 87.5%,
                   rgba(193,39,45,.5) 87.5% 95.5%, transparent 95.5% 100%);
  animation:spin 80s linear infinite;
}
.hero__wave{ position:absolute; left:0; right:0; bottom:-1px; line-height:0; }
.hero__wave svg{ width:100%; height:clamp(42px, 6vw, 76px); display:block; }
.hero__wave path{ fill:var(--ivory); }

/* competition cards (home) */
.cards{ display:grid; gap:18px; grid-template-columns:repeat(3, minmax(0,1fr)); }
.ccard{
  display:flex; flex-direction:column; gap:10px; padding:22px 22px 18px;
  background:var(--paper); border:1px solid var(--line-2); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-sm); position:relative; overflow:hidden;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.ccard::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px; background:var(--accent-grad); }
.ccard::after{
  content:""; position:absolute; right:-42px; top:-42px; width:120px; height:120px; border-radius:50%;
  background:var(--accent-grad); opacity:.06; transition:transform .35s ease, opacity .35s ease;
}
.ccard:hover{ transform:translateY(-5px); box-shadow:var(--shadow-lg); border-color:var(--cream-2); color:inherit; }
.ccard:hover::after{ transform:scale(1.25); opacity:.11; }
.ccard__top{ display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:42px; }
.ccard__icon{
  width:46px; height:46px; display:grid; place-items:center; border-radius:14px; color:#fff;
  background:var(--accent-grad); box-shadow:0 8px 18px rgba(122,31,43,.14);
}
.ccard__icon .icon{ width:24px; height:24px; }
.ccard__title{ margin:2px 0 0; font-size:1.16rem; line-height:1.45; color:var(--maroon); }
.ccard__latin{ display:block; font-weight:500; font-size:.86rem; color:var(--ink-3); }
.ccard__desc{ margin:0; font-size:.93rem; color:var(--ink-2); flex:1 1 auto; }
.ccard__meta{ font-size:.82rem; color:var(--ink-3); }
.ccard__pending{ color:var(--accent); font-weight:600; }
.ccard__go{
  display:inline-flex; align-items:center; gap:8px; font-size:.88rem; font-weight:600; color:var(--accent);
  border-top:1px dashed var(--line); padding-top:12px; margin-top:2px;
}
.ccard__go .icon{ width:1em; height:1em; transition:transform .2s ease; }
.ccard:hover .ccard__go .icon{ transform:translateX(4px); }

/* online strip */
.online-strip{ display:grid; gap:14px; grid-template-columns:repeat(auto-fit, minmax(250px, 1fr)); margin-top:26px; }
.online-card{
  display:flex; align-items:flex-start; gap:14px; padding:18px 20px; background:var(--paper);
  border:1px dashed var(--accent-line); border-radius:var(--radius); transition:box-shadow .2s ease, transform .2s ease;
}
.online-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); color:inherit; }
.online-card__icon{
  width:40px; height:40px; flex:0 0 40px; display:grid; place-items:center; border-radius:12px;
  color:#fff; background:var(--accent-grad);
}
.online-card__icon .icon{ width:21px; height:21px; }
.online-card__body{ flex:1 1 auto; min-width:0; }
.online-card__name{ display:block; font-weight:700; color:var(--maroon); font-size:1rem; }
.online-card__latin{ font-weight:500; color:var(--ink-3); }
.online-card__note{ display:block; font-size:.84rem; color:var(--ink-3); margin-top:4px; line-height:1.7; }
.online-card__go{ color:var(--accent); flex:0 0 auto; }

/* eligibility overview (no topic lists here — they live on each page) */
.erows{ display:grid; gap:16px; grid-template-columns:repeat(2, minmax(0,1fr)); }
.erow{
  padding:18px 20px; background:var(--paper); border:1px solid var(--line-2);
  border-radius:var(--radius); box-shadow:var(--shadow-sm); border-left:3px solid var(--accent);
}
.erow__head{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:12px; }
.erow__icon{
  width:38px; height:38px; flex:0 0 38px; display:grid; place-items:center; border-radius:11px;
  color:#fff; background:var(--accent-grad);
}
.erow__icon .icon{ width:20px; height:20px; }
.erow__title{ margin:0; font-size:1.05rem; }
.erow__title a{ color:var(--maroon); }
.erow__title a:hover{ color:var(--accent); }
.erow__range{ margin:0; font-size:.85rem; color:var(--ink-3); flex:1 1 100%; }
.erow__chips{ list-style:none; display:flex; flex-wrap:wrap; gap:8px; margin:0; }

/* explorer */
.explorer{
  background:var(--paper); border:1px solid var(--line-2); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-md); padding:clamp(18px, 3vw, 30px);
}
.explorer__control{ display:flex; flex-wrap:wrap; align-items:flex-end; gap:16px; padding-bottom:20px; border-bottom:1px dashed var(--line); }
.explorer__control .field{ min-width:min(300px, 100%); }
.explorer__hint{ margin:0; font-size:.9rem; color:var(--ink-3); flex:1 1 220px; }
.explorer__results{ padding-top:20px; }
.explorer__empty{ margin:0; text-align:center; color:var(--ink-3); padding:18px 8px; }
.ex-group + .ex-group{ margin-top:20px; }
.ex-group__title{ margin:0 0 10px; font-size:.86rem; font-weight:700; color:var(--ink-3); }
.ex-list{ list-style:none; display:grid; gap:10px; grid-template-columns:repeat(2, minmax(0,1fr)); margin:0; }
.ex-item{
  display:flex; align-items:center; gap:12px; padding:12px 14px; border:1px solid var(--line-2);
  border-radius:var(--radius-sm); background:var(--ivory-2);
}
.ex-item--online{ border-style:dashed; border-color:var(--accent-line); background:var(--paper); }
.ex-item__icon{
  width:34px; height:34px; flex:0 0 34px; display:grid; place-items:center; border-radius:10px;
  color:#fff; background:var(--accent-grad);
}
.ex-item__icon .icon{ width:18px; height:18px; }
.ex-item__body{ flex:1 1 auto; min-width:0; }
.ex-item__name{ display:block; font-weight:600; color:var(--maroon); font-size:.98rem; }
.ex-item__group{ display:block; font-size:.82rem; color:var(--ink-3); }
.ex-item__go{ color:var(--accent); flex:0 0 auto; }

/* faq */
.faq-list{ display:grid; gap:12px; max-width:840px; margin:0 auto; }
.faq{ background:var(--paper); border:1px solid var(--line-2); border-radius:var(--radius); box-shadow:var(--shadow-sm); overflow:hidden; }
.faq > summary{
  list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:16px 20px; font-weight:600; color:var(--maroon);
}
.faq > summary::-webkit-details-marker{ display:none; }
.faq > summary:hover{ background:var(--ivory-2); }
.faq__q{ font-size:1rem; }
.faq__toggle{
  width:32px; height:32px; flex:0 0 32px; display:grid; place-items:center; border-radius:50%;
  border:1px solid var(--line); background:var(--paper); color:var(--maroon);
}
.faq__toggle .icon{ transition:transform .3s ease; }
.faq[open] .faq__toggle .icon{ transform:rotate(90deg); }
.faq__a{ padding:0 20px 18px; border-top:1px dashed var(--line); }
.faq__a p{ margin:14px 0 0; color:var(--ink-2); font-size:.96rem; }

/* CTA band */
.cta-band{
  background:var(--grad-maroon); border-radius:var(--radius-xl); color:#F7E9D6;
  padding:clamp(26px, 4vw, 44px); text-align:center; position:relative; overflow:hidden;
}
.cta-band::before{
  content:""; position:absolute; inset:0;
  background-image:radial-gradient(rgba(255,255,255,.09) 1px, transparent 1px); background-size:20px 20px; opacity:.6;
}
.cta-band__inner{ position:relative; }
.cta-band h2{ color:#FFF3E0; }
.cta-band p{ max-width:56ch; margin:0 auto 20px; color:rgba(247,233,214,.85); }
.cta-band .btn--outline{ border-color:rgba(255,255,255,.5); color:#FFF3E0; }
.cta-band .btn--outline:hover{ background:rgba(255,255,255,.14); color:#fff; }

/* ==========================================================================
   4b. PHOTO GALLERY (carousel)
   ========================================================================== */
.carousel{ position:relative; display:grid; gap:16px; justify-items:center; }
.carousel:focus-visible{ outline:3px solid var(--saffron); outline-offset:6px; border-radius:var(--radius); }
.carousel__stage{
  position:relative; width:100%; max-width:920px; margin:0 auto;
  border-radius:var(--radius-lg); overflow:hidden; background:var(--cream);
  border:1px solid var(--line); box-shadow:var(--shadow-md);
}
.carousel__track{ list-style:none; margin:0; padding:0; position:relative; }
.carousel__slide{ display:none; margin:0; }
.carousel__slide.is-active{ display:block; }
.carousel__figure{ margin:0; }
.carousel__img{
  display:block; width:100%; height:auto; object-fit:contain;   /* never stretched */
  background:var(--cream); touch-action:pan-y;
}
.carousel__caption{
  padding:.7em 1.1em; text-align:center; font-size:.92rem; color:var(--ink-2);
  background:var(--paper); border-top:1px solid var(--line-2);
}
.carousel__nav{
  position:absolute; top:50%; transform:translateY(-50%); z-index:2;
  width:46px; height:46px; display:grid; place-items:center; cursor:pointer;
  border-radius:50%; border:1px solid var(--line); background:rgba(255,253,248,.92);
  color:var(--maroon); box-shadow:var(--shadow-sm);
  transition:background .2s ease, transform .2s ease, color .2s ease;
}
.carousel__nav:hover{ background:var(--maroon); color:#fff; border-color:var(--maroon); }
.carousel__nav:focus-visible{ outline:3px solid var(--saffron); outline-offset:3px; }
.carousel__nav .icon{ width:22px; height:22px; stroke-width:2.4; }
.carousel__nav--prev{ left:12px; }
.carousel__nav--next{ right:12px; }
.carousel__dots{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; }
/* 50+ photographs: every image still gets its own dot, packed tighter */
.carousel__dots--many{ gap:7px; max-width:min(100%, 720px); }
.carousel__dots--many .carousel__dot{ width:10px; height:10px; border-width:1.2px; }
.carousel__dot{
  width:12px; height:12px; padding:0; border-radius:50%; cursor:pointer;
  border:1.5px solid var(--gold); background:transparent;
  transition:background .2s ease, transform .2s ease;
}
.carousel__dot:hover{ transform:scale(1.15); }
.carousel__dot.is-active{ background:var(--accent-grad); border-color:var(--accent); }
.carousel__dot:focus-visible{ outline:3px solid var(--saffron); outline-offset:3px; }
.carousel__count{ margin:0; font-size:.88rem; color:var(--ink-3); font-variant-numeric:tabular-nums; }
.carousel__empty{
  margin:0 auto; max-width:60ch; text-align:center; color:var(--ink-3);
  background:var(--paper); border:1px dashed var(--line); border-radius:var(--radius); padding:20px;
}
@media (max-width: 640px){
  .carousel__nav{ width:40px; height:40px; }
  .carousel__dots--many{ gap:6px; }
  .carousel__dots--many .carousel__dot{ width:11px; height:11px; }
  .carousel__nav--prev{ left:8px; }
  .carousel__nav--next{ right:8px; }
}

/* ==========================================================================
   5. COMPETITION PAGES
   ========================================================================== */
.page{ padding:clamp(24px, 4vw, 40px) 0 clamp(48px, 6vw, 80px); }

.breadcrumb{ font-size:.85rem; color:var(--ink-3); margin-bottom:22px; }
.breadcrumb ol{ list-style:none; display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; }
.breadcrumb li + li::before{ content:"›"; margin-right:8px; color:var(--gold); }
.breadcrumb a{ color:var(--ink-3); }
.breadcrumb a:hover{ color:var(--maroon); }
.breadcrumb [aria-current]{ color:var(--maroon); font-weight:600; }

.cp-head{ position:relative; overflow:hidden; border-radius:var(--radius-xl); padding:clamp(26px, 4vw, 48px); margin-bottom:clamp(26px, 4vw, 40px);
  background:linear-gradient(180deg, #FFFCF5 0%, #FBF4E7 100%); border:1px solid var(--line-2); box-shadow:var(--shadow-md); }
.cp-head__decor{ position:absolute; inset:0; pointer-events:none; }
.cp-dots{
  position:absolute; inset:0; opacity:.5;
  background-image:radial-gradient(var(--accent-line) 1px, transparent 1px); background-size:20px 20px;
  mask-image:radial-gradient(circle at 88% 12%, #000 0%, transparent 58%);
  -webkit-mask-image:radial-gradient(circle at 88% 12%, #000 0%, transparent 58%);
}
.cp-arc{ position:absolute; border-radius:50%; border:1px dashed var(--accent-line); opacity:.5; }
.cp-arc--1{ width:280px; height:280px; right:-90px; top:-110px; }
.cp-arc--2{ width:180px; height:180px; right:60px; bottom:-110px; opacity:.35; }

/* every competition page is centred as a whole; only dense lists stay left */
.cp-head__inner{ position:relative; max-width:760px; margin:0 auto; text-align:center; }
.cp-head__eyebrow{ margin:0 0 12px; font-size:.85rem; font-weight:600; color:var(--accent); }
.cp-head .badge{ margin-bottom:14px; }
.cp-head__title{ margin:0 0 .5em; }
.cp-head__title::after,
.cp-head__title::before{ margin-left:auto; margin-right:auto; }
.cp-head__latin{ display:block; font-family:var(--font-latin); font-weight:500; font-size:.6em; color:var(--ink-3); margin-top:.35em; }
.cp-head__intro{ color:var(--ink-2); font-size:1.05rem; margin:0 auto 1.2em; max-width:60ch; }
.cp-head__actions{ justify-content:center; }
.cp-head .facts{ justify-content:center; }

.facts{ list-style:none; display:flex; flex-wrap:wrap; gap:10px; margin:0 0 1.4em; padding:0; }
.facts li{
  background:var(--paper); border:1px solid var(--line-2); border-radius:var(--radius-sm);
  padding:.5em .9em; min-width:150px;
}
.fact__k{ display:block; font-size:.74rem; color:var(--ink-3); }
.fact__v{ display:block; font-weight:700; color:var(--maroon); font-size:.98rem; }
.cp-head__actions{ display:flex; flex-wrap:wrap; gap:14px; }

/* --- layout personalities ------------------------------------------------ */
/* समूह नृत्य — typography-led with movement-inspired decoration */
.cp-head--typography{ background:linear-gradient(180deg, #FFFDF9 0%, #F7F0F4 100%); }
.cp-head--typography .cp-head__inner{ max-width:none; }
.cp-head--typography .cp-head__title{ font-size:clamp(2.1rem, 6vw, 3.6rem); line-height:1.2; }
.cp-head--typography .cp-arc--1{ width:360px; height:360px; right:-140px; top:-160px; opacity:.45; }
.cp-head--typography .cp-arc--2{ width:240px; height:240px; right:120px; bottom:-160px; border-style:dotted; }
.cp-head--typography .cp-head__eyebrow{ letter-spacing:0; }
.cp-head--typography::after{
  content:""; position:absolute; left:-6%; bottom:-40px; width:112%; height:120px; pointer-events:none;
  background:
    radial-gradient(ellipse at 20% 100%, var(--accent-soft) 0%, transparent 60%),
    radial-gradient(ellipse at 72% 0%, var(--accent-soft) 0%, transparent 62%);
  opacity:.9;
}
.cp-head--typography .cp-head__title{ position:relative; }
.cp-head--typography .cp-head__title::after{
  content:""; display:block; width:130px; height:4px; margin-top:.5em; border-radius:99px;
  background:var(--accent-grad);
}

/* समूह गायन — clean, restrained musical motifs */
.cp-head--music{ background:linear-gradient(180deg, #FFFDF8 0%, #EEF3F7 100%); text-align:center; }
.cp-head--music .cp-head__inner{ margin:0 auto; max-width:640px; }
.cp-head--music .cp-head__title::after{
  content:""; display:block; width:90px; height:1.5px; margin:.55em auto 0; background:var(--accent-line);
}
.cp-head--music .facts{ justify-content:center; }
.cp-head--music .cp-head__actions{ justify-content:center; }
.cp-head--music .cp-arc{ display:none; }
.cp-head--music .cp-dots{ opacity:.35; }
.cp-head--music::after{                      /* staff lines */
  content:""; position:absolute; left:0; right:0; bottom:26px; height:26px; pointer-events:none; opacity:.5;
  background:repeating-linear-gradient(180deg, var(--accent-line) 0 1px, transparent 1px 6px);
  mask-image:linear-gradient(90deg, transparent, #000 20%, #000 80%, transparent);
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 20%, #000 80%, transparent);
}
.cp-head--music .cp-head__eyebrow::after{
  content:"♫"; font-family:var(--font-latin); margin-left:10px; color:var(--accent); font-size:1.1rem;
}

/* समूह फॅशन शो — elegant, editorial */
.cp-head--editorial{ background:linear-gradient(180deg, #FFFCF6 0%, #F6EFE4 100%); border-radius:var(--radius); }
.cp-head--editorial .cp-head__inner{ max-width:700px; margin:0 auto; text-align:center; }
.cp-head--editorial .cp-head__title{ font-size:clamp(2rem, 5.4vw, 3.3rem); font-weight:700; }
.cp-head--editorial .cp-head__title::before,
.cp-head--editorial .cp-head__title::after{
  content:""; display:block; width:64px; height:1px; margin:0 auto; background:var(--gold);
}
.cp-head--editorial .cp-head__title::before{ margin-bottom:.5em; }
.cp-head--editorial .cp-head__title::after{ margin-top:.5em; }
.cp-head--editorial .cp-arc{ display:none; }
.cp-head--editorial .cp-dots{ opacity:.35; }
.cp-head--editorial .facts{ justify-content:center; }
.cp-head--editorial .facts li{ background:transparent; border:0; border-top:1px solid var(--line); border-radius:0; }
.cp-head--editorial .cp-head__actions{ justify-content:center; }

/* --- body blocks --------------------------------------------------------- */
.cp-body{ display:grid; gap:clamp(24px, 3.4vw, 36px); }
.cp-block{ scroll-margin-top:calc(var(--header-h) + 24px); text-align:center; }
.cp-block__title{ margin-bottom:.4em; }
.cp-block__lead{ color:var(--ink-2); max-width:70ch; margin-left:auto; margin-right:auto; }
/* dense content stays left-aligned for readability */
.cp-block .topics,
.cp-block .rules,
.cp-block .criteria,
.cp-block .steps,
.cp-block .groups{ text-align:left; }
.cp-block .groups{ justify-content:center; }
.cp-note{ justify-content:center; text-align:left; }

.groups{ display:grid; gap:16px; grid-template-columns:repeat(2, minmax(0,1fr)); }
.group{
  border:1px solid var(--line-2); border-radius:var(--radius); padding:18px 20px;
  background:linear-gradient(180deg, #FFFDF8 0%, #FDF7EC 100%); border-left:3px solid var(--accent);
}
.group__title{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:0 0 .7em; font-size:1.05rem; }
.group__badge{
  font-size:.76rem; font-weight:700; color:#fff; background:var(--accent-grad);
  border-radius:999px; padding:.22em .8em;
}
/* --- date / time / venue -------------------------------------------------- */
.sched{
  list-style:none; margin:0 auto; padding:0; display:grid; gap:1px;
  max-width:640px; text-align:left;
  background:var(--line-2); border:1px solid var(--line-2); border-radius:var(--radius);
  overflow:hidden;
}
.sched__row{
  display:grid; grid-template-columns:minmax(120px, 34%) 1fr; gap:14px;
  padding:.75em 1.1em; background:var(--paper);
}
.sched__k{ font-size:.85rem; font-weight:600; color:var(--ink-3); }
.sched__v{ font-weight:600; color:var(--maroon); }
#schedule .sched__row{ background:var(--paper); }

/* homepage schedule list */
.srows{ list-style:none; margin:0; padding:0; display:grid; gap:14px; }
.srow{
  display:grid; grid-template-columns:minmax(120px, 150px) 1fr; gap:clamp(14px, 2.4vw, 26px);
  align-items:start; text-align:left;
  background:var(--paper); border:1px solid var(--line-2); border-left:3px solid var(--accent);
  border-radius:var(--radius); padding:16px 18px; box-shadow:var(--shadow-sm);
}
.srow__date{ display:grid; gap:2px; text-align:center; }
.srow__day{ font-family:var(--font-display); font-weight:700; color:var(--maroon); font-size:1.06rem; line-height:1.4; }
.srow__weekday{ font-size:.74rem; color:var(--ink-3); letter-spacing:0; }
.srow__body{ display:grid; gap:6px; min-width:0; }
.srow__name{ font-weight:600; color:var(--maroon); font-size:1.02rem; }
.srow__latin{ font-size:.8em; font-weight:500; color:var(--ink-3); }
.srow__meta{ display:grid; grid-template-columns:minmax(84px, 120px) 1fr; gap:10px; font-size:.92rem; }
.srow__meta .sched__k{ font-size:.8rem; }
.srow__meta .sched__v{ font-weight:500; color:var(--ink); }

/* the date line on the competition cards */
.ccard__date{
  display:flex; align-items:center; gap:8px; margin-top:auto; padding-top:10px;
  font-size:.86rem; font-weight:600; color:var(--maroon);
}
.ccard__date .icon{ width:1.05em; height:1.05em; flex:0 0 auto; color:var(--green); }
.online-card__date{
  display:flex; align-items:center; gap:8px; font-size:.82rem; font-weight:600; color:var(--maroon);
}
.online-card__date .icon{ width:1em; height:1em; flex:0 0 auto; color:var(--green); }

.group__label{ color:var(--maroon); }
.group__note{ font-size:.8rem; font-weight:600; color:var(--green); background:rgba(30,122,82,.1);
  border:1px solid rgba(30,122,82,.2); border-radius:999px; padding:.18em .75em; }
.topics{ list-style:none; display:grid; gap:8px; margin:0; }
.topics li{
  display:flex; gap:10px; align-items:flex-start; font-size:.96rem; color:var(--ink-2);
  background:var(--paper); border:1px solid var(--line-2); border-radius:var(--radius-sm); padding:.5em .85em;
}
.topics li .icon{ color:var(--accent); flex:0 0 auto; width:1.05em; height:1.05em; margin-top:.45em; stroke-width:2.2; }

.notice{
  display:flex; gap:14px; padding:20px 22px; border-radius:var(--radius);
  background:#FFF8E9; border:1px solid rgba(201,154,60,.45);
}
.notice__icon{ color:var(--gold); flex:0 0 auto; }
.notice__icon .icon{ width:1.4em; height:1.4em; margin-top:.2em; }
.notice__body p{ margin:0 0 .5em; }
.notice__body p:last-child{ margin-bottom:0; }
.notice__lead{ font-weight:600; color:var(--ink); }
.notice__label{ font-size:.9rem; color:var(--ink-3); }
.notice__list{ list-style:none; display:grid; gap:6px; grid-template-columns:repeat(2, minmax(0,1fr)); margin:0 0 .8em; }
.notice__list li{ display:flex; gap:8px; align-items:flex-start; font-size:.93rem; color:var(--ink-2); }
.notice__list .icon{ color:var(--gold); flex:0 0 auto; width:1em; height:1em; margin-top:.5em; }
.notice__foot{ font-size:.88rem; color:var(--ink-3); }

.steps{ list-style:none; display:grid; gap:12px; grid-template-columns:repeat(2, minmax(0,1fr)); margin:0 0 1em; counter-reset:step; }
.steps li{
  display:flex; gap:12px; align-items:flex-start; background:var(--paper); border:1px solid var(--line-2);
  border-radius:var(--radius-sm); padding:.8em 1em; font-size:.95rem; color:var(--ink-2);
}
.steps__no{
  width:26px; height:26px; flex:0 0 26px; display:grid; place-items:center; border-radius:50%;
  background:var(--accent-grad); color:#fff; font-size:.8rem; font-weight:700; margin-top:.15em;
}
.cp-note{ display:flex; gap:10px; align-items:flex-start; font-size:.88rem; color:var(--ink-3); margin:0; }
.cp-note .icon{ flex:0 0 auto; margin-top:.35em; color:var(--gold); }

.cp-others{ margin-top:clamp(30px, 4vw, 46px); text-align:center; }
.cp-others__title{ margin-bottom:.6em; text-align:center; }
.minis{ display:grid; gap:10px; grid-template-columns:repeat(4, minmax(0,1fr)); }
.mini{
  display:flex; align-items:center; gap:10px; padding:12px 14px; background:var(--paper);
  border:1px solid var(--line-2); border-radius:var(--radius-sm); color:var(--ink-2); font-size:.9rem;
  transition:border-color .2s ease, color .2s ease, transform .2s ease;
}
.mini:hover{ border-color:var(--accent-line); color:var(--maroon); transform:translateY(-2px); }
.mini__icon{
  width:32px; height:32px; flex:0 0 32px; display:grid; place-items:center; border-radius:9px;
  color:#fff; background:var(--accent-grad);
}
.mini__icon .icon{ width:17px; height:17px; }
.mini__name{ flex:1 1 auto; min-width:0; }

.cp-cta{ margin-top:clamp(26px, 4vw, 40px); }
.cp-cta__inner{
  text-align:center; padding:clamp(24px, 3.6vw, 40px); border-radius:var(--radius-lg);
  background:linear-gradient(135deg, rgba(122,31,43,.05), rgba(232,137,12,.08));
  border:1px solid var(--line-2);
}
.cp-cta__title{ margin-bottom:.4em; }
.cp-cta__text{ max-width:60ch; margin:0 auto 20px; color:var(--ink-2); }

/* ==========================================================================
   6. REGISTRATION
   ========================================================================== */
.register-card{
  background:var(--paper); border:1px solid var(--line-2); border-radius:var(--radius-xl);
  box-shadow:var(--shadow-lg); padding:clamp(20px, 3.4vw, 38px); position:relative; overflow:hidden;
}
.register-card::before{ content:""; position:absolute; top:0; left:0; right:0; height:5px; background:var(--grad-warm); }
.config-note{
  display:flex; gap:10px; align-items:flex-start; margin:0 0 22px; font-size:.9rem;
  background:#FFF6E0; border:1px solid var(--gold); color:#6B4E10; border-radius:var(--radius); padding:12px 16px;
}
.config-note .icon{ flex:0 0 auto; margin-top:.35em; }

.form__block{ border:0; padding:0; margin:0 0 28px; }
.form__legend{ display:flex; align-items:center; gap:12px; padding:0; margin-bottom:16px; font-size:1.12rem; color:var(--maroon); font-weight:700; }
.form__legend-num{
  width:32px; height:32px; flex:0 0 32px; display:grid; place-items:center; border-radius:50%;
  background:var(--grad-warm); color:#fff; font-size:.9rem; font-weight:700; box-shadow:0 6px 14px rgba(193,39,45,.2);
}
.form__grid{ display:grid; gap:16px 20px; grid-template-columns:repeat(2, minmax(0,1fr)); }
.field{ display:flex; flex-direction:column; gap:6px; min-width:0; }
.field--full{ grid-column:1 / -1; }
.field__label{ font-size:.93rem; font-weight:600; color:var(--ink-2); }
.req{ color:var(--red); text-decoration:none; margin-left:2px; }
.opt{ color:var(--ink-3); font-weight:500; font-size:.85rem; }
.field__input{
  width:100%; font-family:var(--font-marathi); font-size:1rem; font-weight:400; color:var(--ink);
  background:var(--ivory); border:1.5px solid var(--line); border-radius:var(--radius-sm);
  padding:.65em .9em; min-height:48px; appearance:none; -webkit-appearance:none;
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.field__input::placeholder{ color:#A99784; }
.field__input:hover{ border-color:var(--cream-2); }
.field__input:focus{ outline:none; background:var(--paper); border-color:var(--saffron); box-shadow:0 0 0 4px rgba(232,137,12,.14); }
.field__select{ position:relative; display:block; }
.field__select select{ padding-right:2.6em; cursor:pointer; }
.field__chevron{ position:absolute; right:14px; top:50%; width:1.1em; height:1.1em; color:var(--maroon); transform:translateY(-50%) rotate(90deg); pointer-events:none; }
.field__hint{ font-size:.82rem; color:var(--ink-3); }
.field__error{ display:none; font-size:.84rem; font-weight:600; color:var(--red); align-items:center; gap:6px; }
.field.is-invalid .field__input{ border-color:var(--red); background:#FFF6F5; box-shadow:0 0 0 4px rgba(193,39,45,.1); }
.field.is-invalid .field__error{ display:flex; }
.field.is-invalid .field__label{ color:var(--red); }

.picked-standard, .preselect-note{
  display:flex; gap:10px; align-items:flex-start; margin-bottom:16px; font-size:.93rem;
  color:var(--maroon); background:rgba(232,137,12,.09); border:1px dashed var(--gold);
  border-radius:var(--radius-sm); padding:10px 14px;
}
.picked-standard .icon, .preselect-note .icon{ flex:0 0 auto; margin-top:.4em; }

.selection__empty{
  display:flex; gap:10px; align-items:flex-start; margin:0 0 16px; color:var(--ink-3);
  background:var(--ivory); border:1px dashed var(--line); border-radius:var(--radius); padding:16px 18px; font-size:.95rem;
}
.selection__empty .icon{ flex:0 0 auto; color:var(--gold); margin-top:.35em; }
.selection__group + .selection__group{ margin-top:22px; }
.selection__title{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-size:1rem; color:var(--maroon); margin:0 0 10px; }
.selection__note{ font-size:.86rem; color:var(--ink-3); margin:0 0 12px; }
.selection__list{ display:grid; gap:14px; grid-template-columns:repeat(2, minmax(0,1fr)); }
.selection__list:empty{ display:none; }

.comp-pick{
  border:1.5px solid var(--line); border-radius:var(--radius); background:var(--ivory);
  padding:14px 16px; transition:border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.comp-pick.is-selected{ border-color:var(--accent); background:var(--accent-soft); box-shadow:0 0 0 3px var(--accent-soft); }
.comp-pick__top{ display:flex; align-items:flex-start; gap:12px; }
.comp-pick__icon{
  width:38px; height:38px; flex:0 0 38px; display:grid; place-items:center; border-radius:11px;
  color:#fff; background:var(--accent-grad);
}
.comp-pick__icon .icon{ width:21px; height:21px; }
.comp-pick__name{ display:block; font-weight:700; color:var(--maroon); font-size:1rem; line-height:1.5; }
.comp-pick__latin{ font-weight:500; color:var(--ink-3); font-size:.86rem; }
.comp-pick__elig{ display:block; font-size:.8rem; color:var(--ink-3); line-height:1.6; }
.comp-pick__body{ margin-top:12px; }
.comp-pick__group{
  display:inline-flex; align-items:center; gap:8px; font-size:.85rem; font-weight:600; color:var(--green);
  background:rgba(30,122,82,.09); border:1px solid rgba(30,122,82,.22); border-radius:999px; padding:.22em .85em; margin-bottom:12px;
}
.comp-pick__pending{
  display:flex; gap:10px; align-items:flex-start; font-size:.86rem; color:#6B4E10;
  background:#FFF8E9; border:1px solid rgba(201,154,60,.4); border-radius:var(--radius-sm); padding:.7em .9em; margin:0;
}
.comp-pick__pending .icon{ flex:0 0 auto; margin-top:.4em; color:var(--gold); }
.comp-pick__topic{ margin-top:2px; }
.comp-pick__topic .field__label{ font-size:.88rem; }
.comp-pick__topic select{ min-height:44px; font-size:.94rem; background:var(--paper); }

/* The checkbox is a real, visible form control — no hidden input, no overlay,
   nothing positioned on top of it. The tick is drawn in CSS, so it cannot
   disappear if an icon fails to load. */
.check{ position:relative; display:flex; gap:12px; align-items:flex-start; cursor:pointer; flex:1 1 auto; min-width:0; }
.check .check__input,
.check input[type="checkbox"]{
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  flex:0 0 auto; width:26px; height:26px; margin:.15em 0 0; padding:0;
  border:2px solid var(--gold); border-radius:7px; background:var(--paper);
  display:grid; place-content:center; cursor:pointer;
  position:static; opacity:1;                 /* never hidden, never covered */
  transition:background .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.check .check__input::after,
.check input[type="checkbox"]::after{
  content:""; width:13px; height:7px;
  border-left:3px solid #fff; border-bottom:3px solid #fff;
  transform:rotate(-45deg) translate(1px, -2px);
  opacity:0; transition:opacity .16s ease;
}
.check .check__input:checked,
.check input[type="checkbox"]:checked{ background:var(--accent-grad); border-color:var(--accent); }
.check .check__input:checked::after,
.check input[type="checkbox"]:checked::after{ opacity:1; }
.check .check__input:focus-visible,
.check input[type="checkbox"]:focus-visible{ outline:3px solid var(--saffron); outline-offset:3px; }
.check__text{ min-width:0; }
.check.is-invalid .check__input,
.check.is-invalid input[type="checkbox"]{ border-color:var(--red); box-shadow:0 0 0 3px rgba(193,39,45,.14); }

/* --- terms and conditions ------------------------------------------------- */
.tnc{
  background:var(--ivory-2); border:1px solid var(--line); border-radius:var(--radius);
  padding:16px 18px; display:grid; gap:10px;
}
.tnc__intro{ margin:0 0 12px; color:var(--ink-2); font-size:.98rem; }
.tnc__link-row{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:0 0 14px; }
.tnc__link{
  display:inline-flex; align-items:center; gap:9px; padding:.6em 1.1em;
  font-size:.98rem; font-weight:600; color:var(--maroon);
  background:var(--paper); border:1.5px solid var(--gold); border-radius:999px;
  box-shadow:var(--shadow-sm); transition:background .2s ease, color .2s ease, transform .2s ease;
}
.tnc__link:hover{ background:var(--maroon); color:#fff; border-color:var(--maroon); }
.tnc__link:focus-visible{ outline:3px solid var(--saffron); outline-offset:3px; }
.tnc__link .icon{ width:1.1em; height:1.1em; flex:0 0 auto; }
.tnc__link-hint{ font-size:.84rem; color:var(--ink-3); }
.check--tnc{ align-items:flex-start; cursor:pointer; }
.check--tnc .check__text{ font-size:1rem; font-weight:600; color:var(--ink); }
.check__declaration{ margin:0; font-size:.92rem; color:var(--ink-2); }

/* submit loading state */
.spinner{
  display:inline-block; width:1em; height:1em; margin-inline-end:.6em; vertical-align:-.12em;
  border:2px solid rgba(255,255,255,.45); border-top-color:#fff; border-radius:50%;
  animation:spin .7s linear infinite;
}
@keyframes spin{ to{ transform:rotate(360deg); } }

.form__status{ border-radius:var(--radius); padding:14px 18px; margin:0 0 20px; font-size:.95rem; display:flex; gap:10px; align-items:flex-start; }
.form__status--error{ background:#FDEDEC; border:1px solid #E8A9A6; color:#8C1D19; }
.form__status--info{ background:#FFF6E0; border:1px solid var(--gold); color:#6B4E10; }
.form__status .icon{ flex:0 0 auto; margin-top:.35em; }
.form__status ul{ margin:.5em 0 0; padding-left:1.2em; }
.form__actions{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; }
.form__note{ display:flex; gap:10px; align-items:flex-start; margin:20px 0 0; font-size:.88rem; color:var(--ink-3); border-top:1px dashed var(--line); padding-top:16px; }
.form__note .icon{ flex:0 0 auto; margin-top:.35em; color:var(--gold); }

.success{ text-align:center; padding:clamp(16px, 3vw, 34px) 8px; }
.success__emblem{
  width:84px; height:84px; margin:0 auto 16px; display:grid; place-items:center; border-radius:50%;
  color:var(--saffron); background:radial-gradient(circle at 50% 40%, #FFF6E2, #FBEBD0);
  box-shadow:inset 0 0 0 2px rgba(201,154,60,.4);
}
.success__emblem .icon{ width:54px; height:54px; }
.success__title{ font-family:var(--font-display); color:var(--green); }
.success__text{ max-width:52ch; margin:0 auto 20px; color:var(--ink-2); }
.success__summary{
  max-width:660px; margin:0 auto 22px; text-align:right; background:var(--ivory);
  border:1px solid var(--line-2); border-radius:var(--radius); padding:16px 20px;
}
.success__summary dl{ margin:0; display:grid; grid-template-columns:auto 1fr; gap:8px 16px; }
.success__picks{ margin-top:14px; border-top:1px dashed var(--line); padding-top:14px; }
.success__summary dt{ color:var(--ink-3); font-size:.9rem; }
.success__summary dd{ margin:0; font-weight:600; font-size:.95rem; }
.success__actions{ display:flex; justify-content:center; gap:14px; }

.rules{ list-style:none; display:grid; gap:10px; margin:0 0 1em; }
.rules li{
  display:flex; gap:10px; align-items:flex-start; font-size:.98rem; color:var(--ink-2);
  background:var(--paper); border:1px solid var(--line-2); border-radius:var(--radius-sm);
  padding:.6em .9em; border-left:3px solid var(--accent);
}
.rules li .icon{ color:var(--accent); flex:0 0 auto; width:1.05em; height:1.05em; margin-top:.45em; stroke-width:2.2; }
.rules--plain li{ background:transparent; border:0; border-left:0; padding:.15em 0; }
.rules--plain li .icon{ color:var(--green); }

.criteria{
  width:100%; border-collapse:collapse; margin:0 0 1.1em; font-size:.97rem;
  background:var(--paper); border:1px solid var(--line-2); border-radius:var(--radius); overflow:hidden;
}
.criteria th, .criteria td{ padding:.7em 1em; text-align:left; border-bottom:1px solid var(--line-2); }
.criteria thead th{
  background:linear-gradient(180deg, rgba(122,31,43,.05), rgba(232,137,12,.06));
  font-size:.86rem; color:var(--maroon); font-weight:700;
}
.criteria thead th:last-child{ text-align:right; }
.criteria tbody th{ font-weight:500; color:var(--ink-2); }
.criteria tbody td{ text-align:right; font-weight:700; color:var(--maroon); width:96px; font-variant-numeric:tabular-nums; }
.criteria tbody tr:last-child th, .criteria tbody tr:last-child td{ border-bottom:0; }
.criteria__total th, .criteria__total td{
  background:rgba(232,137,12,.08); font-weight:700; color:var(--maroon);
  border-top:1px solid var(--accent-line);
}

.field__input--area{ min-height:120px; resize:vertical; line-height:1.75; }

.notice--info{ background:#FFF8E9; border-color:rgba(201,154,60,.45); }
.notice--pending{ background:#FFF3E0; border-color:var(--gold); }

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

/* ==========================================================================
   7. RESPONSIVE + MOTION
   ========================================================================== */
.reveal{ opacity:0; transform:translateY(16px); transition:opacity .55s ease, transform .55s ease; }
.reveal.is-visible{ opacity:1; transform:none; }

@media (max-width: 1000px){
  .cards{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .erows{ grid-template-columns:1fr; }
  .groups{ grid-template-columns:1fr; }
  .minis{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .online-strip{ grid-template-columns:1fr; }
  .footer__top{ grid-template-columns:1fr 1fr; }
  .footer__brand{ grid-column:1 / -1; }
}
@media (max-width: 900px){
  .nav-toggle{ display:grid; }
  .nav{
    position:absolute; top:100%; left:0; right:0; flex-direction:column; align-items:stretch; gap:0;
    background:var(--paper); border-top:1px solid var(--line); box-shadow:0 18px 34px rgba(90,60,20,.12);
    max-height:0; overflow:hidden; transition:max-height .3s ease; border-radius:0 0 var(--radius-lg) var(--radius-lg);
  }
  .nav.is-open{ max-height:min(80vh, 560px); overflow-y:auto; }
  .nav__list{ flex-direction:column; align-items:stretch; gap:0; padding:6px 0; }
  .nav__list > li{ border-bottom:1px solid var(--line-2); }
  .nav__link{ display:flex; justify-content:space-between; width:100%; padding:14px 22px; font-size:1rem; color:var(--ink); }
  .nav__link::after{ display:none; }
  .nav__cta{ margin:0; }
  .nav__actions{ flex-direction:column; align-items:stretch; gap:10px; margin:14px 22px 20px; }
  .nav__actions .btn{ width:100%; }
  .nav__wa{ justify-content:center; }
  .nav__wa-text{ display:inline; }   /* label is back once the menu is stacked */
  .nav__item--has-menu{ display:flex; flex-wrap:wrap; }
  .nav__item--has-menu .nav__link--button{ width:auto; }
  .nav__menu{
    position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; border:0;
    min-width:0; width:100%; padding:0 14px; background:transparent;
    max-height:0; overflow:hidden; transition:max-height .28s ease, padding .28s ease;
    display:grid; gap:0;
  }
  .nav__item--has-menu.is-open > .nav__menu{ max-height:600px; padding:0 14px 12px; }
  .nav__item--has-menu:hover > .nav__menu{ max-height:0; padding:0 14px; }
  .nav__item--has-menu.is-open:hover > .nav__menu{ max-height:600px; padding:0 14px 12px; }
  .nav__menu::before{ display:none; }
  .nav__menu-link{ padding:10px 12px; }
  .hero__inner{ grid-template-columns:1fr; }
  .hero__art{ min-height:clamp(200px, 48vw, 300px); margin-top:4px; }
  .hero__mandala{ width:min(74%, 320px); }
  .art-book{ width:74px; height:54px; }
  .art-diya{ width:70px; }
  .art-flower{ width:56px; height:56px; bottom:4%; }
  .ex-list{ grid-template-columns:1fr; }
  .selection__list{ grid-template-columns:1fr; }
  .steps{ grid-template-columns:1fr; }
  .notice__list{ grid-template-columns:1fr; }
  .form__grid{ grid-template-columns:1fr; }
  .srows{ gap:12px; }
  .srow{ grid-template-columns:1fr; gap:10px; }
  .srow__date{ display:flex; flex-wrap:wrap; align-items:baseline; gap:8px; text-align:left; }
  .srow__meta{ grid-template-columns:1fr; gap:2px; }
  .sched__row{ grid-template-columns:1fr; gap:4px; padding:.7em 1em; }
}
@media (max-width: 640px){
  body{ font-size:.97rem; }
  .criteria th, .criteria td{ padding:.6em .7em; font-size:.92rem; }
  .criteria tbody td{ width:64px; }
  .cards{ grid-template-columns:1fr; }
  .minis{ grid-template-columns:1fr; }
  .footer__top{ grid-template-columns:1fr; }
  /* the organiser name keeps the same 1.5× scale on phones — it wraps */
  .brand__sub{ display:block; font-size:var(--org-size-brand); line-height:1.35; }
  .brand__title{ font-size:.95rem; }
  .brand{ gap:10px; max-width:62vw; }
  .hero__actions .btn{ width:100%; }
  .hero__actions .btn--whatsapp{ min-height:48px; }
  .cp-head__actions .btn{ width:100%; }
  .facts li{ min-width:120px; flex:1 1 auto; }
  .success__summary dl{ grid-template-columns:1fr; gap:2px 0; }
  .success__summary dt{ margin-top:10px; }
  .tnc__link-row{ gap:6px; }
  .org-card{ gap:10px; padding:8px 16px 8px 8px; border-radius:20px; }
  .org-card__frame{ width:64px; height:64px; }
  .org-card__name{ font-size:.95rem; }
  .org-card__club{ font-size:.78rem; }
  .org-card__phone{ font-size:.82rem; }
  .check .check__input,
  .check input[type="checkbox"]{ width:28px; height:28px; }   /* bigger tap target */
  .check--tnc .check__text{ font-size:1rem; }
}

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .reveal{ opacity:1; transform:none; }
}
