/* Deepavali theme (loaded only when SITE_THEME=diwali). Look only: no words, links or layout change.
   Built from Tamil Deepavali itself: kumkum red and turmeric-marigold colours, a mango-leaf and marigold thoranam over the door,
   a row of lit lamps and a kolam border, and a short shower of marigold petals on arrival (public/js/festival.js).
   Switching it off returns the site exactly as it was. */
/* Brand colours, logo and layout are untouched. Only decoration and brass-gold accents are added. */
html.fest { --fest-brass: #c9962b; --fest-brass-light: #f0d48a; }

/* Marigold flower garland strung along the bottom of the header; it stays with the header while you scroll */
.fest .site-head::after {
  content: ''; position: absolute; left: 0; right: 0; top: 100%; pointer-events: none;
  height: clamp(20px, 2vw, 32px);
  background: url('/img/diwali-garland.svg') repeat-x top center / auto 100%;
  filter: drop-shadow(0 1px 0 rgba(58, 8, 18, .22));
}

/* Hanging brass lamps (thookku vilakku) with glowing flames, hung from the garland at the top of the page */
.fest-lamps { position: absolute; left: 0; right: 0; height: 200px; z-index: 49; pointer-events: none; overflow: visible; }
.fest-lamp { position: absolute; top: clamp(10px, 1.2vw, 20px); transform-origin: 50% 0; margin-left: -30px; animation: fest-swing 5.2s ease-in-out var(--d, 0s) infinite alternate; filter: drop-shadow(0 6px 8px rgba(58, 8, 18, .28)); }
@keyframes fest-swing { from { transform: rotate(-2.6deg); } to { transform: rotate(2.6deg); } }
.fest-lamp .fest-glow { transform-origin: 50% 50%; animation: fest-glow 2.4s ease-in-out var(--d, 0s) infinite; }
.fest-lamp .fest-flame { transform-origin: 30px 80%; animation: fest-flame 1.5s ease-in-out var(--d, 0s) infinite alternate; }
@keyframes fest-glow { 0%, 100% { opacity: .85; transform: scale(1); } 50% { opacity: 1; transform: scale(1.14); } }
@keyframes fest-flame { from { transform: scale(1, 1) rotate(-1.5deg); } to { transform: scale(.94, 1.08) rotate(1.5deg); } }
@media (max-width: 700px) { .fest-lamps { height: 110px; } .fest-lamp { transform: scale(.8); } }

/* Sparks that drift over the whole site; clicks and taps pass straight through */
.fest-sparks { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 55; pointer-events: none; }

/* A thin brass thread under the header and the menu bar */
.fest .masthead { box-shadow: inset 0 -1px 0 rgba(240, 212, 138, .6); }
.fest .navbar { border-bottom: 1px solid var(--fest-brass); }
.fest .nav-dd__panel { border-top: 2px solid var(--fest-brass); }

/* Footer: a row of lit lamps along its top edge (Deepavali means "a row of lights"), footer colours unchanged */
.fest .site-foot { --foot-line: rgba(240, 212, 138, .22); }
.fest .foot-band { position: relative; border-top: 1px solid var(--fest-brass); padding-top: 22px; }
.fest .foot-band::before {
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 30px;
  background: url('/img/diwali-lamps.svg') repeat-x center / auto 30px;
  filter: drop-shadow(0 0 5px rgba(255, 170, 40, .55));
  animation: fest-flicker 3.2s ease-in-out infinite;
}
@keyframes fest-flicker { 0%, 100% { opacity: .92; } 40% { opacity: 1; } 55% { opacity: .84; } 70% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .fest .foot-band::before { animation: none; } }
.fest .foot-grid { padding-top: 32px; }

/* Keep page titles clear of the garland (the home page starts under it) */
.fest body:not(.is-home) main { padding-top: clamp(18px, 1.9vw, 30px); }

/* Opening card: Deepavali wish with the gift card promotion (views/partials/festival-pop.njk, shown by ui.js) */
.fest-pop { width: min(460px, calc(100vw - 24px), calc((100dvh - 150px) * 0.8)); max-width: none; max-height: none; padding: 0; border: 0; border-radius: 22px; background: #2a0c18; color: #fff; box-shadow: 0 40px 100px -20px rgba(20, 8, 14, .6); overflow: hidden; }
.fest-pop[open] { display: flex; flex-direction: column; animation: nudgeIn .45s var(--spring, cubic-bezier(.34, 1.56, .64, 1)) both; }
.fest-pop::backdrop { background: rgba(26, 6, 14, .62); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
.fest-pop__pic { display: block; line-height: 0; }
.fest-pop__pic img { display: block; width: 100%; height: auto; }
.fest-pop__close { position: absolute; top: 10px; right: 10px; z-index: 2; width: 38px; height: 38px; display: grid; place-items: center; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .92); color: #4a0818; box-shadow: 0 4px 14px rgba(0, 0, 0, .35); cursor: pointer; }
.fest-pop__close:hover { background: #fff; }
.fest-pop__actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; background: #2a0c18; }
.fest-pop__actions .btn { flex: 1; justify-content: center; }
.fest-pop__later { border: 0; background: none; color: #f0d48a; font: inherit; font-weight: 600; padding: 10px 12px; cursor: pointer; }
.fest-pop__later:hover { color: #fff; }
@media (prefers-reduced-motion: reduce) { .fest-pop[open] { animation: none; } }