/* Joy Services — Vision design pack — diwali.css (1.4.0)
   The Diwali theme of the homepage, in two palettes that follow the site's own light / dark choice (the header button,
   shared with the console, or the system setting when the visitor has not chosen):
     light — "dawn": ivory and peach, marigold and saffron, deep aubergine text, white glass cards
     dark  — "night": midnight blue, gold and amber, soft violet, glass cards over a starry sky
   The layout loads this file only while V_DIWALI is on (views/web/_vision.php) and only on the homepage; every rule is
   scoped to html[data-festive="diwali"], so it can never reach another page. Built on site.css: the same tokens and the
   same components, rounded and glassed; everything that differs between the palettes is a token (section 1).
   Performance: CSS gradients and small inline SVGs only, no filter:blur on big layers; motion is transform + opacity,
   either finite (fireworks, light twinkle) or paused when off screen or in a hidden tab (diya flames). Reduced motion:
   a still scene. Forced colours: the decoration steps aside. */

/* ============================================================ 1 · tokens
   light is the default (as in site.css); dark comes from data-theme="dark" or, with no choice made, from the system.
   Keep the two dark blocks the same. */
html:root[data-festive="diwali"]{
  color-scheme:light;
  --dw-radius:16px;
  /* site tokens */
  --bg:#fffaf2;--bg-2:#fff3e2;--bg-3:#fbe7cc;--bg-4:#f5d9b3;
  --line:#f0dcc0;--line-2:#e2c39b;
  --text:#1e1530;--text-2:#45385a;--text-3:#685c7d;
  --accent:#e8850c;--accent-2:#963e0a;--accent-3:#7c3306;
  --green:#157a46;--purple:#6b3fd0;--teal:#0b7a73;--magenta:#b8235a;
  --glow-a:rgba(255,170,60,.22);--glow-b:rgba(150,110,255,.14);--glow-c:rgba(255,140,60,.20);
  --grid:rgba(180,90,20,.03);--hud-bg:#1b1426;
  /* festive tokens */
  --dw-gold:#e8930c;--dw-amber:#ea580c;--dw-hi-text:#963e0a;--dw-focus:#9a3412;--dw-focus-btn:#7c2d12;
  --dw-edge:rgba(200,130,50,.22);--dw-edge-hi:rgba(232,133,12,.50);
  --dw-card:linear-gradient(180deg,rgba(255,255,255,.94),rgba(255,255,255,.80) 60%,rgba(255,251,244,.78));
  --dw-card-hi:linear-gradient(180deg,#fff,rgba(255,255,255,.92));
  --dw-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(120,60,10,.06),0 14px 32px -20px rgba(120,60,10,.28);
  --dw-shadow-hi:0 18px 40px -22px rgba(232,120,12,.45);
  --dw-veil:rgba(255,250,242,.58);
  --dw-band:radial-gradient(70% 50% at 50% 0%,rgba(255,170,60,.12),transparent 70%),radial-gradient(60% 60% at 90% 100%,rgba(150,110,255,.08),transparent 70%),rgba(255,246,232,.72);
  --dw-glass:rgba(255,255,255,.72);--dw-tint:rgba(200,110,20,.09);
  --dw-ghost-edge:rgba(180,90,20,.32);--dw-ghost-edge-hi:rgba(180,90,20,.55);
  --dw-btn-edge:rgba(170,80,10,.45);
  --dw-btn-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 1px 2px rgba(120,60,10,.25),0 10px 24px -12px rgba(232,120,12,.6);
  --dw-btn-shadow-hi:inset 0 1px 0 rgba(255,255,255,.65),0 1px 2px rgba(120,60,10,.25),0 12px 28px -10px rgba(232,120,12,.75);
  --dw-hdr:rgba(255,250,242,.94);--dw-hdr-wide:rgba(255,250,242,.80);--dw-hdr-edge:rgba(200,130,50,.20);
  --dw-panel:#fffaf2;--dw-panel-grad:linear-gradient(180deg,#fff3e6,#fffaf2 40%);
  --dw-ticker:linear-gradient(90deg,rgba(255,170,60,.12),rgba(150,110,255,.08)),rgba(255,246,232,.92);
  --dw-footer:#fff3e4;--dw-soft-panel:rgba(255,255,255,.86);
  --dw-rule:rgba(180,90,20,.34);--dw-numeral:rgba(180,90,20,.20);
  --dw-div-line:rgba(200,120,30,.30);--dw-div-dot:#e8930c;
  --dw-sky:
    radial-gradient(1.4px 1.4px at 14% 22%,rgba(214,130,20,.50) 50%,transparent 52%),
    radial-gradient(1.1px 1.1px at 63% 9%,rgba(214,130,20,.40) 50%,transparent 52%),
    radial-gradient(1.3px 1.3px at 81% 64%,rgba(140,90,220,.34) 50%,transparent 52%),
    radial-gradient(1.1px 1.1px at 37% 71%,rgba(214,130,20,.34) 50%,transparent 52%),
    radial-gradient(1.7px 1.7px at 52% 38%,rgba(230,120,30,.32) 50%,transparent 52%),
    radial-gradient(1.1px 1.1px at 8% 83%,rgba(200,60,100,.28) 50%,transparent 52%),
    radial-gradient(120% 60% at 50% -12%,rgba(255,184,140,.45),transparent 62%),
    radial-gradient(80% 45% at 50% 112%,rgba(255,170,70,.22),transparent 64%),
    linear-gradient(180deg,#fff0e2 0%,#fffaf2 46%,#fff7ec 100%);
  --dw-floor-line:rgba(190,95,20,.30);--dw-floor-op:.45;
  --dw-hero-glow:
    radial-gradient(38% 46% at 78% 46%,rgba(150,110,255,.14),transparent 70%),
    radial-gradient(42% 36% at 20% 92%,rgba(255,160,50,.16),transparent 72%),
    radial-gradient(60% 26% at 50% 100%,rgba(255,140,40,.16),transparent 76%),
    radial-gradient(30% 30% at 46% 12%,rgba(255,200,110,.14),transparent 70%);
  --dw-ledge:rgba(200,110,20,.55);--dw-ledge-pool:rgba(255,160,50,.16);
  --dw-h1-glow:none;--dw-em:linear-gradient(90deg,#b45309,#c2410c 30%,#7c3aed 62%,#b45309);
  --dw-wire:rgba(150,80,20,.40);--dw-bulb-g:#f2a20c;--dw-bulb-a:#ea580c;--dw-bulb-v:#8b5cf6;--dw-bulb-glow:.55;
  --dw-fw1:#e8850c;--dw-fw1b:#c2410c;--dw-fw2:#7c3aed;--dw-fw2b:#db2777;--dw-fw3:#be123c;--dw-fw3b:#f59e0b;--dw-fw-rest:.24;
  --dw-halo:radial-gradient(circle,rgba(255,176,60,.34) 0%,rgba(255,140,40,.10) 30%,transparent 62%);
  --dw-reflect:rgba(230,130,30,.35);
  --dw-ring:rgba(180,90,20,.30);--dw-ring-solid:rgba(180,90,20,.16);--dw-node:#d97706;--dw-pulse:rgba(255,170,60,.42);
  --dw-disc:radial-gradient(circle at 50% 38%,rgba(255,196,110,.26),rgba(160,120,255,.10) 48%,rgba(255,255,255,.62) 72%);
  --dw-disc-edge:rgba(200,130,50,.24);
  --dw-disc-shadow:inset 0 1px 0 #fff,inset 0 0 40px rgba(150,110,255,.10),0 34px 60px -34px rgba(120,60,10,.40),0 0 70px -20px rgba(255,170,60,.30);
  --dw-rangoli:rgba(200,110,20,.55);
  --dw-spark-1:#f59e0b;--dw-spark-2:#ea580c;--dw-spark-3:#d97706;
  --dw-flash-ring:#f59e0b;--dw-flash-glow:rgba(245,140,20,.55);--dw-flash-core:#ffd36b;--dw-spark-tip:#c2410c;--dw-spark-blur:3px;
  --dw-manifesto:linear-gradient(180deg,rgba(150,110,255,.07),rgba(255,160,60,.07)),rgba(255,248,238,.8);
  --dw-close-glow:radial-gradient(60% 80% at 50% 100%,rgba(255,150,50,.14),transparent 70%);
  --dw-m1:#e8930c;--dw-m2:#db2777;--dw-m3:#7c3aed;--dw-m-fill:.16;--dw-m-op:.55;
}
html:root[data-festive="diwali"][data-theme="dark"]{
  color-scheme:dark;
  --bg:#0b0a1c;--bg-2:#110f27;--bg-3:#1b1836;--bg-4:#262246;
  --line:#272343;--line-2:#3b3562;
  --text:#f7f0e3;--text-2:#d3cadf;--text-3:#a79fbe;
  --accent:#f5a524;--accent-2:#ffc663;--accent-3:#ffe0a6;
  --green:#5ed38c;--purple:#b9a3ff;--teal:#4fd6c8;--magenta:#ff8fb3;
  --glow-a:rgba(255,168,56,.26);--glow-b:rgba(138,100,255,.30);--glow-c:rgba(255,128,48,.24);
  --grid:rgba(255,214,150,.028);--hud-bg:#07060f;
  --dw-gold:#ffd36b;--dw-amber:#ff9f1c;--dw-hi-text:#ffd36b;--dw-focus:#ffd36b;--dw-focus-btn:#fff4d6;
  --dw-edge:rgba(255,222,170,.11);--dw-edge-hi:rgba(255,206,130,.32);
  --dw-card:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.018) 42%,rgba(255,255,255,.01)),rgba(18,16,40,.80);
  --dw-card-hi:linear-gradient(180deg,rgba(255,236,200,.075),rgba(255,255,255,.028) 42%,rgba(255,255,255,.012)),rgba(22,19,46,.86);
  --dw-shadow:inset 0 1px 0 rgba(255,240,215,.07),0 1px 2px rgba(0,0,0,.35),0 16px 36px -20px rgba(0,0,0,.8);
  --dw-shadow-hi:0 18px 44px -24px rgba(245,165,36,.38);
  --dw-veil:rgba(10,9,26,.52);
  --dw-band:radial-gradient(70% 50% at 50% 0%,rgba(255,170,60,.08),transparent 70%),radial-gradient(60% 60% at 90% 100%,rgba(138,100,255,.07),transparent 70%),rgba(10,9,26,.62);
  --dw-glass:rgba(255,255,255,.045);--dw-tint:rgba(255,214,150,.07);
  --dw-ghost-edge:rgba(255,214,150,.26);--dw-ghost-edge-hi:rgba(255,214,150,.44);
  --dw-btn-edge:rgba(255,236,190,.55);
  --dw-btn-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 1px 2px rgba(0,0,0,.45),0 10px 26px -12px rgba(245,160,40,.7);
  --dw-btn-shadow-hi:inset 0 1px 0 rgba(255,255,255,.55),0 1px 2px rgba(0,0,0,.45),0 12px 30px -10px rgba(245,160,40,.85);
  --dw-hdr:rgba(10,9,26,.93);--dw-hdr-wide:rgba(10,9,26,.74);--dw-hdr-edge:rgba(255,214,150,.10);
  --dw-panel:#110f27;--dw-panel-grad:linear-gradient(180deg,#0e0c24,#0b0a1c 40%);
  --dw-ticker:linear-gradient(90deg,rgba(255,170,60,.06),rgba(140,100,255,.07)),rgba(14,12,32,.84);
  --dw-footer:rgba(9,8,22,.92);--dw-soft-panel:rgba(13,11,30,.9);
  --dw-rule:rgba(255,206,130,.28);--dw-numeral:rgba(255,206,130,.13);
  --dw-div-line:rgba(255,206,130,.22);--dw-div-dot:#ffd36b;
  --dw-sky:
    radial-gradient(1.3px 1.3px at 14% 22%,rgba(255,244,220,.85) 50%,transparent 52%),
    radial-gradient(1px 1px at 63% 9%,rgba(255,244,220,.7) 50%,transparent 52%),
    radial-gradient(1.2px 1.2px at 81% 64%,rgba(214,198,255,.75) 50%,transparent 52%),
    radial-gradient(1px 1px at 37% 71%,rgba(255,244,220,.55) 50%,transparent 52%),
    radial-gradient(1.6px 1.6px at 52% 38%,rgba(255,226,170,.65) 50%,transparent 52%),
    radial-gradient(1px 1px at 8% 83%,rgba(214,198,255,.6) 50%,transparent 52%),
    radial-gradient(120% 60% at 50% -12%,rgba(92,62,190,.34),transparent 62%),
    radial-gradient(80% 45% at 50% 112%,rgba(255,132,40,.16),transparent 64%),
    linear-gradient(180deg,#0e0c24 0%,#0b0a1c 46%,#0a0918 100%);
  --dw-floor-line:rgba(255,196,110,.30);--dw-floor-op:.5;
  --dw-hero-glow:
    radial-gradient(38% 46% at 78% 46%,rgba(130,95,255,.22),transparent 70%),
    radial-gradient(42% 36% at 20% 92%,rgba(255,160,50,.15),transparent 72%),
    radial-gradient(60% 26% at 50% 100%,rgba(255,140,40,.16),transparent 76%),
    radial-gradient(30% 30% at 46% 12%,rgba(255,200,110,.08),transparent 70%);
  --dw-ledge:rgba(255,214,150,.6);--dw-ledge-pool:rgba(255,170,60,.16);
  --dw-h1-glow:0 0 34px rgba(255,180,80,.22);--dw-em:linear-gradient(90deg,#ffd36b,#ff9f1c 30%,#c9a8ff 62%,#ffd36b);
  --dw-wire:rgba(255,220,170,.34);--dw-bulb-g:#ffd36b;--dw-bulb-a:#ff9f1c;--dw-bulb-v:#c4adff;--dw-bulb-glow:.9;
  --dw-fw1:#ffd36b;--dw-fw1b:#fff1c7;--dw-fw2:#c4adff;--dw-fw2b:#ffd6ea;--dw-fw3:#ff9f1c;--dw-fw3b:#ffe0a6;--dw-fw-rest:.18;
  --dw-halo:radial-gradient(circle,rgba(255,200,96,.42) 0%,rgba(255,150,50,.16) 30%,transparent 62%);
  --dw-reflect:rgba(255,170,60,.45);
  --dw-ring:rgba(255,214,150,.30);--dw-ring-solid:rgba(255,214,150,.16);--dw-node:#ffd36b;--dw-pulse:rgba(255,190,80,.5);
  --dw-disc:radial-gradient(circle at 50% 38%,rgba(255,190,90,.14),rgba(120,90,255,.10) 48%,rgba(17,15,38,.45) 72%);
  --dw-disc-edge:rgba(255,222,170,.12);
  --dw-disc-shadow:inset 0 1px 0 rgba(255,240,215,.10),inset 0 0 40px rgba(155,123,255,.14),0 34px 70px -34px rgba(0,0,0,.9),0 0 80px -20px rgba(255,170,60,.25);
  --dw-rangoli:rgba(255,210,130,.46);
  --dw-spark-1:#ffd36b;--dw-spark-2:#ff9f1c;--dw-spark-3:#fff4d6;
  --dw-flash-ring:#fff3d2;--dw-flash-glow:rgba(255,176,60,.85);--dw-flash-core:#fffaf0;--dw-spark-tip:#fffaf0;--dw-spark-blur:7px;
  --dw-manifesto:linear-gradient(180deg,rgba(130,95,255,.08),rgba(255,160,60,.04)),rgba(12,11,30,.72);
  --dw-close-glow:radial-gradient(60% 80% at 50% 100%,rgba(255,150,50,.10),transparent 70%);
  --dw-m1:#ffd36b;--dw-m2:#ff8fb3;--dw-m3:#b9a3ff;--dw-m-fill:.07;--dw-m-op:.42;
}
@media (prefers-color-scheme:dark){
  html:root[data-festive="diwali"]:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#0b0a1c;--bg-2:#110f27;--bg-3:#1b1836;--bg-4:#262246;
    --line:#272343;--line-2:#3b3562;
    --text:#f7f0e3;--text-2:#d3cadf;--text-3:#a79fbe;
    --accent:#f5a524;--accent-2:#ffc663;--accent-3:#ffe0a6;
    --green:#5ed38c;--purple:#b9a3ff;--teal:#4fd6c8;--magenta:#ff8fb3;
    --glow-a:rgba(255,168,56,.26);--glow-b:rgba(138,100,255,.30);--glow-c:rgba(255,128,48,.24);
    --grid:rgba(255,214,150,.028);--hud-bg:#07060f;
    --dw-gold:#ffd36b;--dw-amber:#ff9f1c;--dw-hi-text:#ffd36b;--dw-focus:#ffd36b;--dw-focus-btn:#fff4d6;
    --dw-edge:rgba(255,222,170,.11);--dw-edge-hi:rgba(255,206,130,.32);
    --dw-card:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.018) 42%,rgba(255,255,255,.01)),rgba(18,16,40,.80);
    --dw-card-hi:linear-gradient(180deg,rgba(255,236,200,.075),rgba(255,255,255,.028) 42%,rgba(255,255,255,.012)),rgba(22,19,46,.86);
    --dw-shadow:inset 0 1px 0 rgba(255,240,215,.07),0 1px 2px rgba(0,0,0,.35),0 16px 36px -20px rgba(0,0,0,.8);
    --dw-shadow-hi:0 18px 44px -24px rgba(245,165,36,.38);
    --dw-veil:rgba(10,9,26,.52);
    --dw-band:radial-gradient(70% 50% at 50% 0%,rgba(255,170,60,.08),transparent 70%),radial-gradient(60% 60% at 90% 100%,rgba(138,100,255,.07),transparent 70%),rgba(10,9,26,.62);
    --dw-glass:rgba(255,255,255,.045);--dw-tint:rgba(255,214,150,.07);
    --dw-ghost-edge:rgba(255,214,150,.26);--dw-ghost-edge-hi:rgba(255,214,150,.44);
    --dw-btn-edge:rgba(255,236,190,.55);
    --dw-btn-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 1px 2px rgba(0,0,0,.45),0 10px 26px -12px rgba(245,160,40,.7);
    --dw-btn-shadow-hi:inset 0 1px 0 rgba(255,255,255,.55),0 1px 2px rgba(0,0,0,.45),0 12px 30px -10px rgba(245,160,40,.85);
    --dw-hdr:rgba(10,9,26,.93);--dw-hdr-wide:rgba(10,9,26,.74);--dw-hdr-edge:rgba(255,214,150,.10);
    --dw-panel:#110f27;--dw-panel-grad:linear-gradient(180deg,#0e0c24,#0b0a1c 40%);
    --dw-ticker:linear-gradient(90deg,rgba(255,170,60,.06),rgba(140,100,255,.07)),rgba(14,12,32,.84);
    --dw-footer:rgba(9,8,22,.92);--dw-soft-panel:rgba(13,11,30,.9);
    --dw-rule:rgba(255,206,130,.28);--dw-numeral:rgba(255,206,130,.13);
    --dw-div-line:rgba(255,206,130,.22);--dw-div-dot:#ffd36b;
    --dw-sky:
      radial-gradient(1.3px 1.3px at 14% 22%,rgba(255,244,220,.85) 50%,transparent 52%),
      radial-gradient(1px 1px at 63% 9%,rgba(255,244,220,.7) 50%,transparent 52%),
      radial-gradient(1.2px 1.2px at 81% 64%,rgba(214,198,255,.75) 50%,transparent 52%),
      radial-gradient(1px 1px at 37% 71%,rgba(255,244,220,.55) 50%,transparent 52%),
      radial-gradient(1.6px 1.6px at 52% 38%,rgba(255,226,170,.65) 50%,transparent 52%),
      radial-gradient(1px 1px at 8% 83%,rgba(214,198,255,.6) 50%,transparent 52%),
      radial-gradient(120% 60% at 50% -12%,rgba(92,62,190,.34),transparent 62%),
      radial-gradient(80% 45% at 50% 112%,rgba(255,132,40,.16),transparent 64%),
      linear-gradient(180deg,#0e0c24 0%,#0b0a1c 46%,#0a0918 100%);
    --dw-floor-line:rgba(255,196,110,.30);--dw-floor-op:.5;
    --dw-hero-glow:
      radial-gradient(38% 46% at 78% 46%,rgba(130,95,255,.22),transparent 70%),
      radial-gradient(42% 36% at 20% 92%,rgba(255,160,50,.15),transparent 72%),
      radial-gradient(60% 26% at 50% 100%,rgba(255,140,40,.16),transparent 76%),
      radial-gradient(30% 30% at 46% 12%,rgba(255,200,110,.08),transparent 70%);
    --dw-ledge:rgba(255,214,150,.6);--dw-ledge-pool:rgba(255,170,60,.16);
    --dw-h1-glow:0 0 34px rgba(255,180,80,.22);--dw-em:linear-gradient(90deg,#ffd36b,#ff9f1c 30%,#c9a8ff 62%,#ffd36b);
    --dw-wire:rgba(255,220,170,.34);--dw-bulb-g:#ffd36b;--dw-bulb-a:#ff9f1c;--dw-bulb-v:#c4adff;--dw-bulb-glow:.9;
    --dw-fw1:#ffd36b;--dw-fw1b:#fff1c7;--dw-fw2:#c4adff;--dw-fw2b:#ffd6ea;--dw-fw3:#ff9f1c;--dw-fw3b:#ffe0a6;--dw-fw-rest:.18;
    --dw-halo:radial-gradient(circle,rgba(255,200,96,.42) 0%,rgba(255,150,50,.16) 30%,transparent 62%);
    --dw-reflect:rgba(255,170,60,.45);
    --dw-ring:rgba(255,214,150,.30);--dw-ring-solid:rgba(255,214,150,.16);--dw-node:#ffd36b;--dw-pulse:rgba(255,190,80,.5);
    --dw-disc:radial-gradient(circle at 50% 38%,rgba(255,190,90,.14),rgba(120,90,255,.10) 48%,rgba(17,15,38,.45) 72%);
    --dw-disc-edge:rgba(255,222,170,.12);
    --dw-disc-shadow:inset 0 1px 0 rgba(255,240,215,.10),inset 0 0 40px rgba(155,123,255,.14),0 34px 70px -34px rgba(0,0,0,.9),0 0 80px -20px rgba(255,170,60,.25);
    --dw-rangoli:rgba(255,210,130,.46);
    --dw-spark-1:#ffd36b;--dw-spark-2:#ff9f1c;--dw-spark-3:#fff4d6;
    --dw-flash-ring:#fff3d2;--dw-flash-glow:rgba(255,176,60,.85);--dw-flash-core:#fffaf0;--dw-spark-tip:#fffaf0;--dw-spark-blur:7px;
    --dw-manifesto:linear-gradient(180deg,rgba(130,95,255,.08),rgba(255,160,60,.04)),rgba(12,11,30,.72);
    --dw-close-glow:radial-gradient(60% 80% at 50% 100%,rgba(255,150,50,.10),transparent 70%);
    --dw-m1:#ffd36b;--dw-m2:#ff8fb3;--dw-m3:#b9a3ff;--dw-m-fill:.07;--dw-m-op:.42;
  }
}

/* ============================================================ 2 · base, focus, selection */
html[data-festive="diwali"] body{background:var(--bg)}
html[data-festive="diwali"] ::selection{background:#ffd36b;color:#1a1206}
html[data-festive="diwali"] :focus-visible{outline:2px solid var(--dw-focus);outline-offset:3px}
html[data-festive="diwali"] .skip{background:#ffd36b;color:#1a1206;border-radius:8px}
html[data-festive="diwali"] .preview-bar{background:#5a3fc8}
html[data-festive="diwali"] .progress i{background:linear-gradient(90deg,var(--dw-amber),var(--dw-gold),var(--purple))}

/* ============================================================ 3 · the page background: one fixed 3D scene behind everything
   A sky (night stars, or dawn glitter), a glow at the top and at the horizon, the site's drifting glows recoloured, and a
   perspective floor of gold lines at the bottom of the viewport that fades in once the hero (with its own, stronger floor)
   has scrolled away. Sections lay a veil over it: the scene is strongest in the hero and softer behind the cards. */
html[data-festive="diwali"] .bg{
  background-color:var(--bg);background-image:var(--dw-sky);
  background-size:230px 230px,310px 310px,270px 270px,190px 190px,420px 420px,350px 350px,100% 100%,100% 100%,100% 100%;
}
html[data-festive="diwali"] body::after{
  content:"";position:fixed;left:-40%;right:-40%;bottom:-1px;height:44vh;z-index:-1;pointer-events:none;
  background-image:linear-gradient(var(--dw-floor-line) 1.5px,transparent 1.5px),linear-gradient(90deg,var(--dw-floor-line) 1.5px,transparent 1.5px);
  background-size:80px 80px;background-position:50% 100%;
  transform:perspective(380px) rotateX(66deg);transform-origin:50% 100%;
  -webkit-mask-image:linear-gradient(to top,#000 0%,rgba(0,0,0,.55) 30%,transparent 78%);
  mask-image:linear-gradient(to top,#000 0%,rgba(0,0,0,.55) 30%,transparent 78%);
  opacity:0;transition:opacity .6s var(--ease);
}
html[data-festive="diwali"][data-dw-past] body::after{opacity:var(--dw-floor-op)}

/* ============================================================ 4 · header, menus, ticker, footer (glass; menus opaque) */
html[data-festive="diwali"] .hdr{background:var(--dw-hdr);border-bottom-color:var(--dw-hdr-edge)}
@media (min-width:1056px){html[data-festive="diwali"] .hdr{background:var(--dw-hdr-wide)}}   /* site.css blurs what is behind it here */
html[data-festive="diwali"] .nav>li>a.active{border-bottom-color:var(--dw-gold)}
html[data-festive="diwali"] .mega{background:var(--dw-panel);border:1px solid var(--dw-edge);border-top:2px solid var(--dw-gold);border-radius:0 0 14px 14px;box-shadow:0 26px 50px -22px rgba(0,0,0,.45)}
html[data-festive="diwali"] .mega a{border-radius:8px}
html[data-festive="diwali"] .mega a:hover{background:var(--dw-tint)}
html[data-festive="diwali"] .icon-btn{border-radius:10px}
html[data-festive="diwali"] .icon-btn:hover{background:var(--dw-tint)}
html[data-festive="diwali"] .hdr .cur{border-radius:8px;background:var(--dw-glass);border-color:var(--dw-edge)}
html[data-festive="diwali"] .mnav{background:var(--dw-panel-grad)}   /* opaque: menu text never sits on page text */
html[data-festive="diwali"] .mnav a{border-bottom-color:var(--dw-edge)}
html[data-festive="diwali"] .ticker{background:var(--dw-ticker);border-color:var(--dw-edge)}
html[data-festive="diwali"] .ticker span{border-right-color:var(--dw-edge)}
html[data-festive="diwali"] .ticker span::before{color:var(--dw-hi-text)}
html[data-festive="diwali"] .ftr{background:var(--dw-footer);border-top-color:var(--dw-edge)}

/* ============================================================ 5 · buttons (subtle hover, clear focus) */
html[data-festive="diwali"] .btn{
  background:linear-gradient(180deg,#ffd982 0%,#f8b53e 52%,#ee922a 100%);color:#1d1305;
  border:1px solid var(--dw-btn-edge);border-radius:12px;font-weight:600;box-shadow:var(--dw-btn-shadow);
  transition:box-shadow .2s var(--ease),filter .2s var(--ease),transform .15s var(--ease),background-color .2s,border-color .2s;
}
html[data-festive="diwali"] .btn:hover{filter:brightness(1.05);box-shadow:var(--dw-btn-shadow-hi)}
html[data-festive="diwali"] .btn.ghost{background:var(--dw-glass);color:var(--text);border:1px solid var(--dw-ghost-edge);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 8px 22px -16px rgba(0,0,0,.6)}
html[data-festive="diwali"] .btn.ghost:hover{filter:none;background:var(--dw-tint);border-color:var(--dw-ghost-edge-hi)}
html[data-festive="diwali"] .btn.lg{border-radius:14px}
html[data-festive="diwali"] .btn.sm{border-radius:10px}
html[data-festive="diwali"] .btn:focus-visible{outline:2px solid var(--dw-focus-btn);outline-offset:3px}

/* ============================================================ 6 · sections and cards: rounded, glass, depth */
html[data-festive="diwali"] .sec{background:var(--dw-veil);border-bottom:0}
/* the divider between chapters: a fading line with three lamp-dots at its middle */
html[data-festive="diwali"] .sec::after{content:"";position:absolute;left:0;right:0;bottom:0;height:9px;pointer-events:none;--div:var(--dw-div-line);
  background:
    radial-gradient(circle at calc(50% - 14px) 50%,var(--dw-div-dot) 0 1.5px,transparent 2px),
    radial-gradient(circle at 50% 50%,var(--dw-div-dot) 0 3px,transparent 3.5px),
    radial-gradient(circle at calc(50% + 14px) 50%,var(--dw-div-dot) 0 1.5px,transparent 2px),
    linear-gradient(90deg,transparent 4%,var(--div) 30%,var(--div) calc(50% - 24px),transparent calc(50% - 24px),transparent calc(50% + 24px),var(--div) calc(50% + 24px),var(--div) 70%,transparent 96%) 50% 50%/100% 1px no-repeat}
html[data-festive="diwali"] .sec.band,html[data-festive="diwali"] #offers{background:var(--dw-band)}
html[data-festive="diwali"] .sec .numeral{-webkit-text-stroke:1px var(--dw-numeral)}
html[data-festive="diwali"] .chapter::after{background:linear-gradient(90deg,var(--dw-rule),transparent)}
html[data-festive="diwali"] :is(.tiles,.stack,.flow,.aud,.rq,.pillars,.prod,.facts-grid,.pops,.plans,.specs,.regions,.steps,.contacts,.results,.posts,.listings)>*{
  border-radius:var(--dw-radius);border-color:var(--dw-edge);background:var(--dw-card);box-shadow:var(--dw-shadow);
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease);
}
html[data-festive="diwali"] :is(.tiles,.stack,.flow,.aud,.rq,.pillars,.prod,.facts-grid,.plans,.specs,.regions,.steps,.contacts,.results,.posts,.listings)>*:hover{
  background:var(--dw-card-hi);border-color:var(--dw-edge-hi);box-shadow:var(--dw-shadow),var(--dw-shadow-hi);
}
html[data-festive="diwali"] .pops{border-radius:var(--dw-radius)}
html[data-festive="diwali"] .pop.hl{background:var(--dw-card-hi);border-color:var(--dw-edge-hi)}
html[data-festive="diwali"] .layer,html[data-festive="diwali"] .aud .a{overflow:hidden}
html[data-festive="diwali"] .layer .items span{border-radius:999px;background:var(--dw-tint);color:var(--text-2)}
html[data-festive="diwali"] .flow .node::after{background:var(--bg-2);border-color:var(--dw-edge-hi);border-radius:999px;color:var(--dw-hi-text)}
html[data-festive="diwali"] .pillar .ic{border-radius:9px;border-color:var(--dw-gold)}
html[data-festive="diwali"] .pillar .ic::after{border-radius:5px;background:linear-gradient(180deg,var(--dw-gold),var(--dw-amber))}
html[data-festive="diwali"] .tile::after,html[data-festive="diwali"] .post-card::after{background:linear-gradient(90deg,var(--dw-amber),var(--dw-gold))}
html[data-festive="diwali"] .facts-grid b strong{color:var(--dw-hi-text)}
html[data-festive="diwali"] :is(.prod .st,.tile .tag,.mega a .st,.region .st){border-radius:999px;padding-left:8px;padding-right:8px}
html[data-festive="diwali"] .bts{border-color:var(--dw-edge);border-radius:var(--dw-radius);overflow:hidden;background:var(--dw-card);box-shadow:var(--dw-shadow)}
html[data-festive="diwali"] .bts .tabs{background:var(--dw-tint);border-color:var(--dw-edge)}
html[data-festive="diwali"] .bts .tabs button.on{background:var(--dw-soft-panel);border-left-color:var(--dw-gold)}
html[data-festive="diwali"] .anim{border-color:var(--dw-edge);border-radius:12px;background:var(--dw-soft-panel)}
html[data-festive="diwali"] .anim-cap{background:var(--dw-soft-panel);border-top-color:var(--dw-edge)}
html[data-festive="diwali"] .fabric-wrap{border-color:var(--dw-edge);border-radius:var(--dw-radius);background:var(--dw-soft-panel);box-shadow:var(--dw-shadow)}
html[data-festive="diwali"] .fabric-wrap .cap{background:linear-gradient(180deg,transparent,var(--dw-soft-panel))}
html[data-festive="diwali"] .tl::before{border-radius:50%;border-color:var(--dw-gold)}
html[data-festive="diwali"] .tl.now::before{background:var(--dw-gold);border-color:var(--dw-gold);box-shadow:0 0 0 4px rgba(255,180,70,.18),0 0 14px rgba(255,170,60,.6)}
html[data-festive="diwali"] .manifesto{background:var(--dw-manifesto)}
html[data-festive="diwali"] .globe-tip{border-radius:10px;background:var(--dw-panel);border-color:var(--dw-edge)}

/* ============================================================ 7 · hero */
html[data-festive="diwali"] .hero{isolation:isolate}
html[data-festive="diwali"] .hero .wrap{position:relative;z-index:1}
html[data-festive="diwali"] .hero h1 strong{text-shadow:var(--dw-h1-glow)}
html[data-festive="diwali"] .hero h1 em{background-image:var(--dw-em)}
html[data-festive="diwali"] .hero-meta span{padding:5px 11px;border-radius:999px;background:var(--dw-glass);border:1px solid var(--dw-edge)}

/* the greeting above the eyebrow */
html[data-festive="diwali"] .dw-greet{display:flex;width:fit-content;max-width:100%;align-items:center;gap:8px;margin:0 0 18px;padding:5px 14px 5px 7px;
  border-radius:999px;background:var(--dw-glass);border:1px solid var(--dw-edge-hi);box-shadow:var(--dw-shadow);
  font-size:12.5px;line-height:1.3;font-weight:600;color:var(--dw-hi-text)}
html[data-festive="diwali"] .dw-greet .dw-diya{position:relative;flex:none;width:22px;margin-top:-3px}
html[data-festive="diwali"] .dw-greet .dw-diya::before{width:200%;animation:none}
html[data-festive="diwali"] .dw-greet .dw-diya::after{display:none}
html[data-festive="diwali"] .dw-greet .dw-flame{animation:none}
html[data-festive="diwali"] .dw-greet .sep{opacity:.45;font-weight:400}
html[data-festive="diwali"] .dw-greet [lang]{font-weight:500;color:var(--text-2)}

/* the decoration layer behind the hero's text: glows, the floor, the lights, three fireworks, a row of diyas */
html[data-festive="diwali"] .dw-defs{position:absolute;width:0;height:0;overflow:hidden}
html[data-festive="diwali"] .dw-hero{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;contain:layout paint}
html[data-festive="diwali"] .dw-glow{position:absolute;inset:0;background:var(--dw-hero-glow)}
html[data-festive="diwali"] .dw-floor{position:absolute;left:0;right:0;bottom:0;height:120px;background:radial-gradient(48% 90% at 50% 100%,var(--dw-ledge-pool),transparent 72%)}
html[data-festive="diwali"] .dw-floor::after{content:"";position:absolute;left:-30%;right:-30%;bottom:0;height:300px;
  background-image:linear-gradient(var(--dw-floor-line) 1.5px,transparent 1.5px),linear-gradient(90deg,var(--dw-floor-line) 1.5px,transparent 1.5px);
  background-size:64px 64px;background-position:50% 100%;
  transform:perspective(420px) rotateX(70deg);transform-origin:50% 100%;
  -webkit-mask-image:linear-gradient(to top,#000 0%,rgba(0,0,0,.4) 40%,transparent 85%);
  mask-image:linear-gradient(to top,#000 0%,rgba(0,0,0,.4) 40%,transparent 85%)}
html[data-festive="diwali"] .dw-floor::before{content:"";position:absolute;z-index:1;left:4%;right:4%;bottom:20px;height:1px;background:linear-gradient(90deg,transparent,var(--dw-ledge) 18%,var(--dw-ledge) 82%,transparent)}

/* string of lights */
html[data-festive="diwali"] .dw-lights{position:absolute;left:0;right:0;top:0;margin:0 auto;width:100%;height:auto;max-width:1680px;min-height:54px;aspect-ratio:1200/72;overflow:visible}
html[data-festive="diwali"] .dw-lights .wire{fill:none;stroke:var(--dw-wire);stroke-width:1.2}
html[data-festive="diwali"] .dw-lights .b line{stroke:var(--dw-wire);stroke-width:1}
html[data-festive="diwali"] .dw-lights .bulb{fill:var(--dw-bulb-g)}
html[data-festive="diwali"] .dw-lights .a .bulb{fill:var(--dw-bulb-a)}
html[data-festive="diwali"] .dw-lights .v .bulb{fill:var(--dw-bulb-v)}
html[data-festive="diwali"] .dw-lights .glow{opacity:var(--dw-bulb-glow);animation:dw-twinkle 2.6s ease-in-out 1.2s 6 alternate both}
html[data-festive="diwali"] .dw-lights .b:nth-child(3n+2) .glow{animation-delay:.3s}
html[data-festive="diwali"] .dw-lights .b:nth-child(3n) .glow{animation-delay:2.1s}
@keyframes dw-twinkle{from{opacity:var(--dw-bulb-glow)}to{opacity:.25}}

/* fireworks: three bursts each, then a faint afterglow — one finite animation; diwali.js replays a single round when the
   visitor comes back to the hero after a while */
html[data-festive="diwali"] .dw-fw{position:absolute;display:block;width:160px;height:auto;max-width:none;aspect-ratio:1;overflow:visible;opacity:var(--dw-fw-rest);
  animation:dw-fw 7.5s linear .4s 1 both}
html[data-festive="diwali"] .dw-fw line{stroke:var(--fw);stroke-width:1.7;stroke-linecap:round}
html[data-festive="diwali"] .dw-fw line.i{stroke:var(--fw2);stroke-width:1.2}
html[data-festive="diwali"] .dw-fw circle{fill:var(--fw2)}
html[data-festive="diwali"] .dw-fw.f1{--fw:var(--dw-fw1);--fw2:var(--dw-fw1b);top:9%;left:calc(50% - 100px);width:170px}   /* the gap between the headline and the orbit */
html[data-festive="diwali"] .dw-fw.f2{--fw:var(--dw-fw2);--fw2:var(--dw-fw2b);top:7%;right:3%;width:128px;animation-delay:1.3s}
html[data-festive="diwali"] .dw-fw.f3{--fw:var(--dw-fw3);--fw2:var(--dw-fw3b);bottom:15%;left:52%;width:112px;animation-delay:2.2s}
html[data-festive="diwali"] .dw-hero[data-replay="a"] .dw-fw{animation:dw-fw-once-a 3.2s linear .1s 1 both}
html[data-festive="diwali"] .dw-hero[data-replay="b"] .dw-fw{animation:dw-fw-once-b 3.2s linear .1s 1 both}
html[data-festive="diwali"] .dw-hero[data-replay] .dw-fw.f2{animation-delay:.55s}
html[data-festive="diwali"] .dw-hero[data-replay] .dw-fw.f3{animation-delay:1s}
@keyframes dw-fw{
  0%{opacity:0;transform:scale(.2);animation-timing-function:cubic-bezier(.12,.75,.3,1)}
  4%{opacity:1}
  26%{opacity:0;transform:scale(1)}
  33%{opacity:0;transform:scale(.2);animation-timing-function:cubic-bezier(.12,.75,.3,1)}
  37%{opacity:1}
  59%{opacity:0;transform:scale(1)}
  66%{opacity:0;transform:scale(.2);animation-timing-function:cubic-bezier(.12,.75,.3,1)}
  70%{opacity:1}
  92%{opacity:.06;transform:scale(1)}
  100%{opacity:var(--dw-fw-rest);transform:scale(1)}
}
@keyframes dw-fw-once-a{0%{opacity:0;transform:scale(.2);animation-timing-function:cubic-bezier(.12,.75,.3,1)}10%{opacity:1}62%{opacity:0;transform:scale(1)}100%{opacity:var(--dw-fw-rest);transform:scale(1)}}
@keyframes dw-fw-once-b{0%{opacity:0;transform:scale(.2);animation-timing-function:cubic-bezier(.12,.75,.3,1)}10%{opacity:1}62%{opacity:0;transform:scale(1)}100%{opacity:var(--dw-fw-rest);transform:scale(1)}}

/* diyas: clay lamps on a glowing ledge; the flame sways, the halo breathes (paused off screen and in hidden tabs) */
html[data-festive="diwali"] .dw-row{position:absolute;left:0;right:0;bottom:17px;height:0;max-width:1680px;margin:0 auto}
html[data-festive="diwali"] .dw-diya{position:absolute;display:block;width:44px;aspect-ratio:1}
html[data-festive="diwali"] .dw-row .dw-diya{bottom:-6px}
html[data-festive="diwali"] .dw-diya svg{position:relative;width:100%;height:100%;overflow:visible}
html[data-festive="diwali"] .dw-diya::before{content:"";position:absolute;left:50%;top:36%;width:280%;aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);
  background:var(--dw-halo);animation:dw-halo 2.8s ease-in-out infinite alternate}
html[data-festive="diwali"] .dw-diya::after{content:"";position:absolute;left:8%;right:8%;bottom:-5px;height:9px;border-radius:50%;background:radial-gradient(closest-side,var(--dw-reflect),transparent)}
html[data-festive="diwali"] .dw-flame{transform-box:view-box;transform-origin:32px 37px;animation:dw-flicker 1.7s ease-in-out infinite alternate}
html[data-festive="diwali"] .dw-row .d1{left:5%;width:36px}
html[data-festive="diwali"] .dw-row .d2{left:25%;width:42px}
html[data-festive="diwali"] .dw-row .d3{left:calc(50% - 26px);width:52px}
html[data-festive="diwali"] .dw-row .d4{right:25%;width:42px}
html[data-festive="diwali"] .dw-row .d5{right:5%;width:36px}
html[data-festive="diwali"] .dw-row .d2 .dw-flame,html[data-festive="diwali"] .dw-row .d2::before{animation-delay:-.5s}
html[data-festive="diwali"] .dw-row .d3 .dw-flame,html[data-festive="diwali"] .dw-row .d3::before{animation-delay:-1.1s}
html[data-festive="diwali"] .dw-row .d4 .dw-flame,html[data-festive="diwali"] .dw-row .d4::before{animation-delay:-.2s}
html[data-festive="diwali"] .dw-row .d5 .dw-flame,html[data-festive="diwali"] .dw-row .d5::before{animation-delay:-1.4s}
@keyframes dw-flicker{0%{transform:scale(1,1) rotate(0)}30%{transform:scale(.95,1.06) rotate(-2.5deg)}60%{transform:scale(1.04,.95) rotate(1.8deg)}100%{transform:scale(.98,1.03) rotate(-1deg)}}
@keyframes dw-halo{from{opacity:.72}to{opacity:1}}

/* the orbit becomes a rangoli of light with a lamp at its core: a glass disc, a ring of petals, gold rings and nodes */
html[data-festive="diwali"] .orbit svg{position:relative;z-index:1}
html[data-festive="diwali"] .orbit::before{content:"";position:absolute;inset:23%;border-radius:50%;z-index:0;
  background:var(--dw-disc);border:1px solid var(--dw-disc-edge);box-shadow:var(--dw-disc-shadow)}
html[data-festive="diwali"] .orbit::after{content:"";position:absolute;inset:3%;border-radius:50%;z-index:0;
  background:repeating-conic-gradient(from 2deg,var(--dw-rangoli) 0deg 1.3deg,transparent 1.3deg 7.5deg);
  -webkit-mask-image:radial-gradient(circle,transparent 59.6%,rgba(0,0,0,.6) 60%,rgba(0,0,0,.6) 61.4%,transparent 61.8%,transparent 89.4%,#000 89.8%,#000 91%,transparent 91.4%);
  mask-image:radial-gradient(circle,transparent 59.6%,rgba(0,0,0,.6) 60%,rgba(0,0,0,.6) 61.4%,transparent 61.8%,transparent 89.4%,#000 89.8%,#000 91%,transparent 91.4%)}
html[data-festive="diwali"] .orbit .ring{stroke:var(--dw-ring)}
html[data-festive="diwali"] .orbit .ring.solid{stroke:var(--dw-ring-solid)}
html[data-festive="diwali"] .orbit .core,html[data-festive="diwali"] .orbit .core-in{display:none}
html[data-festive="diwali"] .orbit .node{fill:var(--bg);stroke:var(--dw-node)}
html[data-festive="diwali"] .orbit .node.p{stroke:var(--purple)}
html[data-festive="diwali"] .orbit .node.t{stroke:var(--dw-amber)}
html[data-festive="diwali"] .orbit .node.g{stroke:var(--teal)}
html[data-festive="diwali"] .orbit .pulse{fill:var(--dw-pulse)}
html[data-festive="diwali"] .orbit .arc{stroke:var(--dw-node)}
html[data-festive="diwali"] .orbit .arc.p{stroke:var(--purple)}
html[data-festive="diwali"] .orbit .arc.t{stroke:var(--dw-amber)}
html[data-festive="diwali"] .dw-core{position:absolute;left:50%;top:50%;z-index:2;width:17%;transform:translate(-50%,-64%);pointer-events:none}
html[data-festive="diwali"] .dw-core .dw-diya{position:relative;width:100%}

/* ============================================================ 8 · the closing: a rangoli with a lamp behind the last call to action */
html[data-festive="diwali"] .close{isolation:isolate;background:var(--dw-close-glow)}
html[data-festive="diwali"] .close .wrap{position:relative;z-index:1}
html[data-festive="diwali"] .dw-close{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;contain:layout paint}
html[data-festive="diwali"] .dw-mandala{position:absolute;top:50%;right:max(2%,calc(50% - 760px));width:min(500px,44vw);height:auto;max-width:none;aspect-ratio:1;transform:translateY(-50%);opacity:var(--dw-m-op);overflow:visible}
html[data-festive="diwali"] .dw-mandala :is(circle,ellipse,path){fill:none;stroke-width:.8}
html[data-festive="diwali"] .dw-mandala .m1{stroke:var(--dw-m1)}
html[data-festive="diwali"] .dw-mandala .m2{stroke:var(--dw-m2)}
html[data-festive="diwali"] .dw-mandala .m3{stroke:var(--dw-m3)}
html[data-festive="diwali"] .dw-mandala .f{fill:currentColor;fill-opacity:var(--dw-m-fill)}
html[data-festive="diwali"] .dw-mandala .m1.f{color:var(--dw-m1)}
html[data-festive="diwali"] .dw-mandala .m2.f{color:var(--dw-m2)}
html[data-festive="diwali"] .dw-mandala .m3.f{color:var(--dw-m3)}
html[data-festive="diwali"] .dw-mandala .dot{fill:var(--dw-m1);stroke:none}
html[data-festive="diwali"] .dw-close-lamp{position:absolute;top:50%;right:calc(max(2%,calc(50% - 760px)) + min(500px,44vw) / 2);width:56px;transform:translate(50%,-62%)}
html[data-festive="diwali"] .dw-close-lamp .dw-diya{position:relative;width:100%}

/* ============================================================ 9 · the firecracker burst (diwali.js fills this layer)
   One fixed layer over the page: sparks can leave the button without moving anything, and it never takes input. */
html[data-festive="diwali"] .dw-fx{position:fixed;inset:0;z-index:70;pointer-events:none;overflow:hidden;contain:strict}
html[data-festive="diwali"] .dw-burst{position:absolute;left:0;top:0;width:0;height:0}
html[data-festive="diwali"] .dw-burst i{position:absolute;display:block}
html[data-festive="diwali"] .dw-flash{left:-18px;top:-18px;width:36px;height:36px;border-radius:50%;border:2px solid var(--dw-flash-ring);box-shadow:0 0 16px 2px var(--dw-flash-glow),inset 0 0 10px var(--dw-flash-glow);
  opacity:0;animation:dw-flash 240ms cubic-bezier(.2,.7,.3,1) both}
html[data-festive="diwali"] .dw-flash::after{content:"";position:absolute;left:50%;top:50%;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;background:var(--dw-flash-core);box-shadow:0 0 12px 4px var(--dw-flash-glow)}
html[data-festive="diwali"] .dw-spark{left:-1px;top:-7px;width:2.5px;height:14px;border-radius:2px;background:linear-gradient(to top,transparent,var(--c) 45%,var(--dw-spark-tip));box-shadow:0 0 var(--dw-spark-blur) var(--c);
  opacity:0;transform:rotate(var(--a)) translateY(-8px);animation:dw-spark var(--t,300ms) cubic-bezier(.12,.7,.3,1) both}
html[data-festive="diwali"] .dw-spark.g{--c:var(--dw-spark-1)}
html[data-festive="diwali"] .dw-spark.a{--c:var(--dw-spark-2)}
html[data-festive="diwali"] .dw-spark.w{--c:var(--dw-spark-3)}
/* the crackle: a few specks that pop just beyond the sparks as they fade */
html[data-festive="diwali"] .dw-glit{left:-1.5px;top:-1.5px;width:3px;height:3px;border-radius:50%;background:var(--dw-flash-core);box-shadow:0 0 6px 1px var(--dw-spark-1);
  opacity:0;transform:rotate(var(--a)) translateY(calc(var(--d) * -1)) scale(0);animation:dw-glit 170ms ease-out var(--gd,140ms) both}
@keyframes dw-flash{0%{opacity:1;transform:scale(.25)}100%{opacity:0;transform:scale(1.4)}}
@keyframes dw-spark{0%{opacity:1;transform:rotate(var(--a)) translateY(-8px) scaleY(1)}60%{opacity:1}100%{opacity:0;transform:rotate(var(--a)) translateY(calc(var(--d) * -1)) scaleY(.4)}}
@keyframes dw-glit{0%{opacity:1;transform:rotate(var(--a)) translateY(calc(var(--d) * -1)) scale(0)}40%{opacity:1;transform:rotate(var(--a)) translateY(calc(var(--d) * -1)) scale(1.3)}100%{opacity:0;transform:rotate(var(--a)) translateY(calc(var(--d) * -1)) scale(.2)}}

/* ============================================================ 10 · smaller screens: fewer decorations */
@media (min-width:1056px) and (max-width:1439px){
  html[data-festive="diwali"] .dw-fw.f1{top:auto;bottom:9%;left:auto;right:2%;width:140px}   /* a laptop's headline reaches the middle */
}
@media (max-width:1055px){
  html[data-festive="diwali"] .dw-fw.f2{display:none}
  html[data-festive="diwali"] .dw-fw.f1{top:auto;bottom:34%;left:auto;right:2%;width:150px}
  html[data-festive="diwali"] .dw-fw.f3{bottom:8%;left:3%;width:110px}
  html[data-festive="diwali"] .dw-mandala{right:-12%;width:min(440px,70vw);opacity:calc(var(--dw-m-op) * .7)}
  html[data-festive="diwali"] .dw-close-lamp{display:none}
}
@media (max-width:767px){
  html[data-festive="diwali"] .dw-fw.f3{display:none}
  html[data-festive="diwali"] .dw-fw.f1{bottom:14%;right:-24px;width:110px}   /* over the orbit, clear of the text */
  html[data-festive="diwali"] .dw-row .d2,html[data-festive="diwali"] .dw-row .d4{display:none}
  html[data-festive="diwali"] .dw-row{bottom:12px}
  html[data-festive="diwali"] .dw-row .d1{left:7%;width:30px}
  html[data-festive="diwali"] .dw-row .d3{left:calc(50% - 20px);width:40px}
  html[data-festive="diwali"] .dw-row .d5{right:7%;width:30px}
  html[data-festive="diwali"] .dw-floor{height:90px}
  html[data-festive="diwali"] .dw-floor::before{bottom:14px}
  html[data-festive="diwali"] .dw-floor::after{height:200px;background-size:48px 48px}
  html[data-festive="diwali"] .dw-lights{min-height:46px}
  html[data-festive="diwali"] body::after{height:30vh}
  html[data-festive="diwali"][data-dw-past] body::after{opacity:calc(var(--dw-floor-op) * .65)}
  html[data-festive="diwali"] .hero-meta span{padding:4px 9px}
  html[data-festive="diwali"] .dw-mandala{top:0;right:-30%;width:86vw;transform:none;opacity:calc(var(--dw-m-op) * .55)}
}

/* ============================================================ 11 · motion controls
   diwali.js sets html[data-dw-paused] while the tab is hidden, and .dw-idle on the hero / the closing while off screen. */
html[data-festive="diwali"][data-dw-paused] :is(.dw-hero,.dw-core,.dw-close) *,
html[data-festive="diwali"][data-dw-paused] :is(.dw-hero,.dw-core,.dw-close) *::before,
html[data-festive="diwali"][data-dw-paused] .bg::before,
html[data-festive="diwali"][data-dw-paused] .bg::after,
html[data-festive="diwali"] .dw-idle :is(.dw-hero,.dw-core,.dw-close) *,
html[data-festive="diwali"] .dw-idle :is(.dw-hero,.dw-core,.dw-close) *::before{animation-play-state:paused}

/* reduced motion: a still scene, and a static glow on the festive CTAs instead of the burst */
@media (prefers-reduced-motion:reduce){
  html[data-festive="diwali"] :is(.dw-hero,.dw-core,.dw-close,.dw-greet) *,
  html[data-festive="diwali"] :is(.dw-hero,.dw-core,.dw-close,.dw-greet) *::before{animation:none !important}   /* beats every per-element animation rule above */
  html[data-festive="diwali"] .dw-fw{opacity:.3;transform:none}
  html[data-festive="diwali"] .dw-lights .glow{opacity:var(--dw-bulb-glow)}
  html[data-festive="diwali"] .dw-burst{display:none}
  html[data-festive="diwali"] body::after{transition:none}
  html[data-festive="diwali"] :is(.hero-cta,#solutions .cta,.close .cta) .btn{box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 0 0 1px rgba(255,190,90,.35),0 0 24px -6px rgba(255,170,60,.6);transition:none}
  html[data-festive="diwali"] :is(.hero-cta,#solutions .cta,.close .cta) .btn.dw-lit{box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 0 0 2px rgba(255,180,80,.8),0 0 34px 2px rgba(255,160,50,.65)}
}

/* Windows high contrast / forced colours: the system palette takes over; the decoration and the sparks step aside */
@media (forced-colors:active){
  html[data-festive="diwali"] :is(.dw-hero,.dw-core,.dw-close,.dw-fx),html[data-festive="diwali"] body::after,html[data-festive="diwali"] .sec::after{display:none}
  html[data-festive="diwali"] .dw-greet .dw-diya{display:none}
  html[data-festive="diwali"] .orbit .core,html[data-festive="diwali"] .orbit .core-in{display:inline}
}
