/* =========================================================
   Shree Ganesh – round 2 colour themes (white-led)
   Load AFTER style.css + themes.css (round 1 light base).
   blue | green | white | grey
   ========================================================= */
html[data-theme="blue"]{
  --red:#0057B8; --red-600:#00428C; --red-50:#EAF2FC;
  --acc2:#4A8FE0; --em:#0057B8; --hl:#0057B8;
  --panel:#F3F7FC; --ink:#0F1A2A; --slate:#3C4859; --charcoal:#1C2A3D;
  --foot:#062C5F; --ring:rgba(0,87,184,.06); --tile-ring:rgba(0,87,184,.16);
}
html[data-theme="green"]{
  --red:#0F6B47; --red-600:#0A5236; --red-50:#E8F4EE;
  --acc2:#3FA57A; --em:#12855A; --hl:#0F6B47;
  --panel:#F2F8F5; --ink:#12201A; --slate:#3B4B44; --charcoal:#1C2E26;
  --foot:#0B3D2A; --ring:rgba(15,107,71,.06); --tile-ring:rgba(15,107,71,.16);
}
html[data-theme="grey"]{
  --red:#4A525C; --red-600:#353B42; --red-50:#EFF1F3;
  --acc2:#8A939E; --em:#6B7580; --hl:#4A525C;
  --panel:#F4F5F6; --ink:#1A1D21; --slate:#474D55; --charcoal:#2E3339;
  --foot:#2A2F35; --ring:rgba(74,82,92,.06); --tile-ring:rgba(74,82,92,.14);
}
html[data-theme="white"]{
  --red:#111315; --red-600:#000; --red-50:#F5F5F4;
  --acc2:#8A9097; --em:#8A9097; --hl:#111315;
  --panel:#FAFAFA; --ink:#111315; --slate:#4A4F56; --charcoal:#24282D;
  --foot:#FFFFFF; --ring:rgba(0,0,0,.04); --tile-ring:rgba(0,0,0,.08);
}

/* blue / green / grey: solid colour stats band (the main colour moment under the white hero) */
html[data-theme="blue"] .stats,html[data-theme="green"] .stats,html[data-theme="grey"] .stats{background:var(--red);color:#fff;border:0}
html[data-theme="blue"] .stat,html[data-theme="green"] .stat,html[data-theme="grey"] .stat{border-color:rgba(255,255,255,.22) !important}
html[data-theme="blue"] .stat .n,html[data-theme="green"] .stat .n,html[data-theme="grey"] .stat .n{color:#fff}
html[data-theme="blue"] .stat .l,html[data-theme="green"] .stat .l,html[data-theme="grey"] .stat .l{color:rgba(255,255,255,.82)}

/* grey: the red mark stays as the single warm spark */
html[data-theme="grey"] .hero .bg::after{background:#C8102E;width:22%}

/* white: monochrome, black type, hairlines, white footer */
html[data-theme="white"] .topbar{background:#fff}
html[data-theme="white"] .section.grey,html[data-theme="white"] .section.dark{background:#FAFAFA}
html[data-theme="white"] .hero .bg::after{background:#111315;width:18%}
html[data-theme="white"] .hero .bg{box-shadow:0 24px 48px -30px rgba(0,0,0,.28)}
html[data-theme="white"] .stat .n{color:var(--ink)}
html[data-theme="white"] .cta-band{background:#fff;border:1px solid var(--g-200)}
html[data-theme="white"] .tile.red{background:#fff;color:var(--ink);border:1px solid var(--g-200);border-top:3px solid #111315}
html[data-theme="white"] .tile.red .pct{color:var(--ink)}
html[data-theme="white"] .section.dark .tile.red p,html[data-theme="white"] .tile.red p{color:var(--slate) !important}
html[data-theme="white"] .tile.red::after{border-color:var(--tile-ring)}
html[data-theme="white"] .tile .pct,html[data-theme="white"] .tile .num{color:var(--ink) !important}
html[data-theme="white"] .tl .yr{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}
html[data-theme="white"] .site-footer{background:#fff;color:var(--slate);border-top:1px solid var(--g-200)}
html[data-theme="white"] .f-brand .brand .wm b,html[data-theme="white"] .site-footer h4{color:var(--ink)}
html[data-theme="white"] .f-brand p{color:var(--g-500)}
html[data-theme="white"] .f-brand .brand img{background:none;padding:0}
html[data-theme="white"] .site-footer a:hover{color:var(--ink)}
html[data-theme="white"] .f-certs span{border-color:var(--g-200);color:var(--slate)}
html[data-theme="white"] .f-bottom{border-top-color:var(--g-200);color:var(--g-500)}
html[data-theme="white"] .site-footer .btn-red{background:#111315;color:#fff}
html[data-theme="white"] .site-footer .btn-red:hover{background:#000}
html[data-theme="white"] .f-ph{color:#87631A;border-color:#D9A845}

/* blue / green / grey: utility bar in the theme colour (colour visible on first screen) */
html[data-theme="blue"] .topbar,html[data-theme="green"] .topbar,html[data-theme="grey"] .topbar{background:var(--red);color:rgba(255,255,255,.88);border-bottom:0}
html[data-theme="blue"] .topbar a:hover,html[data-theme="green"] .topbar a:hover,html[data-theme="grey"] .topbar a:hover{color:#fff}
html[data-theme="blue"] .site-header,html[data-theme="green"] .site-header,html[data-theme="grey"] .site-header{border-top:0}
