/* Food Fest accent layer on top of chitra.css — warm kitchen pigments, same Dasara purple/gold chrome */
:root{--p-vermilion:#D7263D;--p-indigo:#2B3A8F;--p-leaf:#3E8E41;--p-turmeric:#E8A317;--p-rose:#C8531E;--p-sky:#2F9BD6;--chilli:#C8102E;--turmeric:#E8A317;--banana:#3E8E41;--copper:#B8651B}
.fsection-title .mark{background:var(--chilli)}.fsection-title .mark.m2{background:var(--turmeric)}.fsection-title .mark.m3{background:var(--banana)}.fsection-title .mark.m4{background:var(--copper)}.fsection-title .mark.m5{background:var(--p-indigo)}
.card .swatch{border-radius:50% 50% 50% 8px}
/* the stall row (signature) */
.wall .stall{transform-box:fill-box;transform-origin:50% 100%}
.wall .steam{animation:steam 4s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 100%;opacity:.8}
.wall .steam:nth-of-type(2){animation-delay:-1.3s}.wall .steam:nth-of-type(3){animation-delay:-2.6s}
@keyframes steam{0%{transform:translateY(0) scale(1);opacity:.75}100%{transform:translateY(-22px) scale(1.25);opacity:0}}
.wall .bulb{animation:twinkle 2.2s ease-in-out infinite}
.wall .bulb:nth-child(odd){animation-delay:-1.1s}
@keyframes twinkle{0%,100%{opacity:1}50%{opacity:.35}}
.lp-hero .veil{background:linear-gradient(90deg,rgba(27,11,51,.96) 0%,rgba(27,11,51,.84) 42%,rgba(60,20,20,.45) 75%,rgba(27,11,51,.6) 100%),linear-gradient(180deg,rgba(27,11,51,.35),rgba(27,11,51,0) 30%,rgba(27,11,51,.92) 100%)}
.lp-hero h1{color:#FFE7A3}
.band i{border-radius:50% 50% 50% 8px}
.who .card ul li::marker{color:var(--chilli)}
.finale::before{background:url(/hero-palace.webp) center 60%/cover no-repeat;opacity:.16}


/* Wordmark standing in for the Drawing Competition logo until artwork is supplied */
.dc-wordmark{display:flex;flex-direction:column;align-items:center;gap:2px;line-height:1}
.dc-wordmark .wm-kn{font-family:var(--kn,inherit);font-weight:800;font-size:clamp(2rem,7vw,3.6rem);color:var(--gold,#F0D98C);text-shadow:0 3px 0 rgba(0,0,0,.25)}
.dc-wordmark .wm-en{font-family:var(--display,inherit);font-weight:800;letter-spacing:.14em;text-transform:uppercase;font-size:clamp(.85rem,2.4vw,1.35rem);color:#fff;opacity:.95}
.dc-wordmark .wm-yr{font-family:var(--display,inherit);font-weight:900;font-size:clamp(1.4rem,4.5vw,2.4rem);color:var(--gold-2,#E8A317);letter-spacing:.08em}

/* Anchor targets sit below the 65px sticky header, so the section heading is not clipped
   when a quick-link (#rules, #how, #gallery, #faq) is tapped. */
main > section[id] { scroll-margin-top: 84px; }

/* Gallery capped at 4 photos: one even row of four (2×2 on phones) instead of the 8-photo
   featured-tile mosaic, which leaves a hole when only four are shown. */
.gal[data-limit="4"]{grid-template-columns:repeat(4,1fr);grid-auto-rows:210px}
.gal[data-limit="4"] a:nth-child(n){grid-column:auto;grid-row:auto}
@media(max-width:900px){.gal[data-limit="4"]{grid-template-columns:repeat(2,1fr);grid-auto-rows:170px}}
@media(max-width:560px){.gal[data-limit="4"]{grid-auto-rows:140px}}

/* Hero stats panel carries FIVE cells here (Fest dates, Venue, Timings, Applications close in, Places).
   The base grid is 4-up, which strands "Places" alone on a second row. */
.glance .panel{grid-template-columns:repeat(5,1fr)}
@media(max-width:900px){
  .glance .panel{grid-template-columns:1fr 1fr}
  .glance .cell:nth-child(n+3){border-bottom:1px solid rgba(255,255,255,.1)}
  .glance .cell:nth-child(4){border-right:0}
  .glance .cell:last-child{grid-column:1/-1;border-right:0;border-bottom:0}
}
@media(max-width:520px){
  /* phones: back to one stacked column (the ≤900px rule above would otherwise win by source order) */
  .glance .panel{grid-template-columns:1fr}
  .glance .cell,.glance .cell:nth-child(4),.glance .cell:last-child{grid-column:auto;border-right:0;border-bottom:1px solid rgba(255,255,255,.1)}
  .glance .cell:last-child{border-bottom:0}
}

/* Hero: the round Drawing badge sits above the text wordmark (Food Fest uses a wide logo instead of text). */
.lp-hero h1.dc-wordmark img.wm-badge{display:block;width:min(240px,55vw);height:auto;margin:0 auto 10px;filter:drop-shadow(0 16px 36px rgba(0,0,0,.55))}
@media(max-width:860px){.lp-hero h1.dc-wordmark img.wm-badge{width:min(190px,50vw);margin-bottom:6px}}
