/* White theme: switched on with the sun/moon button in the top menu.
   The neon (dark) theme stays the default and is untouched; everything here only applies
   when <html data-theme="light">. theme-light.css holds the per-page colour fixes. */

/* ---------- Colours (same names as pro.css, site.css and the Events page) ---------- */
html[data-theme="light"] {
  color-scheme: light;
  /* backgrounds */
  --ink: #FFFFFF; --ink-2: #F5F3EF; --ink-3: #EAE7E0;
  --bg: #FFFFFF;  --bg-2: #F5F3EF;  --bg-3: #EAE7E0;
  /* text */
  --white: #15171B; --cream: #15171B; --muted: #5B616C;
  /* lines */
  --hair: rgba(165,114,0,.4); --hair-soft: rgba(21,23,27,.12); --line: rgba(21,23,27,.12);
  --glass: rgba(255,255,255,.72); --glass-line: rgba(21,23,27,.12);
  /* brand colours: pink, yellow and green become a family of golds for a premium look */
  --pink: #A57200; /* pink becomes deep gold in the white theme */ --blue: #1F63E0; --yellow: #8A6400; --green: #9A7B2F; --purple: #7A3FE0;
}
html[data-theme="light"] body { background: #FFFFFF; color: #15171B; }

/* Neon glows look muddy on white: keep the colours, drop the glow */
html[data-theme="light"] *,
html[data-theme="light"] *::before,
html[data-theme="light"] *::after { text-shadow: none !important; }
html[data-theme="light"] .btn,
html[data-theme="light"] .btn-gold,
html[data-theme="light"] .btn-pink,
html[data-theme="light"] .ticket,
html[data-theme="light"] .panel,
html[data-theme="light"] .door { box-shadow: none !important; }
html[data-theme="light"] .logo svg,
html[data-theme="light"] .brand svg { filter: none !important; }
html[data-theme="light"] body::after { opacity: .03; }

/* Softer colour clouds behind the headings */
html[data-theme="light"] .glow { opacity: .14 !important; }
html[data-theme="light"] .page-hero::before,
html[data-theme="light"] .page-hero::after,
html[data-theme="light"] .cta-band::before,
html[data-theme="light"] .cta-band::after { opacity: .14 !important; }
html[data-theme="light"] .meet::before,
html[data-theme="light"] .tcard::before,
html[data-theme="light"] .member::before,
html[data-theme="light"] .door::before { opacity: .1 !important; }
/* Register page: the blurred poster behind the form becomes a light wash */
html[data-theme="light"] .stage .poster-wash { filter: blur(60px) saturate(1.2) brightness(1.5) !important; opacity: .35; }
html[data-theme="light"] .stage .tint { opacity: .15 !important; }
html[data-theme="light"] .stage canvas { opacity: .25; }

/* Highlighted words were white with a coloured glow; on white they take the colour itself */
html[data-theme="light"][data-page] .display em { color: var(--pink) !important; }
html[data-theme="light"][data-page] .sec .display em { color: var(--blue) !important; }
html[data-theme="light"][data-page] .cta-band .display em,
html[data-theme="light"][data-page] .sec:nth-of-type(odd) .display em { color: var(--green) !important; }
html[data-theme="light"][data-page] .neon-pink { color: var(--pink) !important; }
html[data-theme="light"][data-page] .neon-blue { color: var(--blue) !important; }
html[data-theme="light"][data-page] .neon-yellow { color: var(--yellow) !important; }
html[data-theme="light"][data-page] .neon-green { color: var(--green) !important; }
html[data-theme="light"][data-page] .neon-purple { color: var(--purple) !important; }
/* Text colours written straight into the page */
html[data-theme="light"] [style*="color:#d4d0c8"],
html[data-theme="light"] [style*="color:#C9CDD4"] { color: #3A3F47 !important; }
html[data-theme="light"] [style*="color:#fff"] { color: #15171B !important; }

/* ---------- The switch itself ---------- */
.theme-toggle {
  display: inline-grid; place-items: center; flex-shrink: 0; cursor: pointer;
  width: 38px; height: 38px; border-radius: 50%; padding: 0;
  border: 1.5px solid rgba(244,239,230,.3); background: transparent; color: #F4EFE6;
  transition: border-color .2s, transform .2s;
}
.theme-toggle:hover { border-color: #FFE14D; transform: rotate(-12deg); }
.theme-toggle svg { width: 18px; height: 18px; }
html[data-theme="light"] .theme-toggle { border-color: rgba(21,23,27,.25); color: #15171B; }
html[data-theme="light"] .theme-toggle:hover { border-color: var(--pink); }
.theme-toggle.floating { position: fixed; right: 16px; bottom: 16px; z-index: 200; background: rgba(11,13,15,.9); }
@media (max-width: 1000px) {
  .menu .theme-toggle { margin: 14px 24px 0; }
}

/* Logo: the yellow arch and white star get darker so they show on white */
html[data-theme="light"] .logo svg path[fill="none"],
html[data-theme="light"] #arch path[fill="none"] { stroke: #D9A400; }
html[data-theme="light"] .logo svg path:not([fill="none"]),
html[data-theme="light"] #arch path:not([fill="none"]) { fill: #15171B; }
html[data-theme="light"] .t-rank { color: var(--yellow) !important; }

/* Pink icons drawn straight into the pages become gold too */
html[data-theme="light"] [stroke="#FF3EA5"] { stroke: #A57200; }
html[data-theme="light"] [fill="#FF3EA5"] { fill: #A57200; }
html[data-theme="light"] [stroke="#39FF88"] { stroke: #9A7B2F; }
html[data-theme="light"] [stroke="#FFE14D"]:not(#arch *) { stroke: #8A6400; }

/* =====================================================================
   White theme, premium touches: warm cream, drifting gold light,
   glass cards, gold shimmer on highlighted words, gentle fade-up.
   ===================================================================== */
html[data-theme="light"] { background: linear-gradient(180deg, #FBF7EF 0%, #FFFFFF 35%, #FCF8F0 70%, #FFFFFF 100%) fixed; }
html[data-theme="light"] body { background: transparent; }
html[data-theme="light"] body::after { opacity: .045; }

/* Drifting gold light behind everything (added by theme.js) */
.lux-bg { display: none; }
html[data-theme="light"] .lux-bg { display: block; position: fixed; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.lux-bg span { position: absolute; border-radius: 50%; filter: blur(80px); opacity: .5; animation: lux-drift 26s ease-in-out infinite alternate; }
.lux-bg span:nth-child(1) { width: 520px; height: 520px; left: -140px; top: -120px; background: radial-gradient(circle, #F3D58A, transparent 70%); }
.lux-bg span:nth-child(2) { width: 460px; height: 460px; right: -120px; top: 30%; background: radial-gradient(circle, #EBC7A3, transparent 70%); animation-duration: 32s; animation-delay: -8s; }
.lux-bg span:nth-child(3) { width: 420px; height: 420px; left: 30%; bottom: -160px; background: radial-gradient(circle, #F6E3B4, transparent 70%); animation-duration: 38s; animation-delay: -16s; }
@keyframes lux-drift { 0% { transform: translate(0, 0) scale(1); } 50% { transform: translate(60px, 40px) scale(1.12); } 100% { transform: translate(-40px, 70px) scale(.95); } }

/* Header: frosted cream glass with a thin gold line */
html[data-theme="light"][data-page] .site-head,
html[data-theme="light"][data-page] header.top,
html[data-theme="light"][data-page] body > header { background: rgba(255,252,245,.72) !important; border-bottom: 1px solid rgba(165,114,0,.18) !important; }

/* Alternating cream bands with thin gold dividers */
html[data-theme="light"] main > section:nth-of-type(even):not(.page-hero):not(.hero) { background: linear-gradient(180deg, rgba(250,243,228,.75), rgba(255,250,240,.55)); }
html[data-theme="light"] main > section + section { border-top: 1px solid rgba(165,114,0,.12); }

/* Glass cards with soft deep shadows that lift on hover */
html[data-theme="light"] :is(.panel, .grid-3 > *, .ws, .ev, .quote, .roles > div, .steps .step, .tcard, .trophy, .ticket, .map-card, .who-card, .meet, .bubble, .partner, .feature, .portrait, .numbers, .flagship, .next, .series > div, .service) {
  background: rgba(255,255,255,.82) !important; border-color: rgba(165,114,0,.16) !important;

  box-shadow: 0 1px 0 rgba(255,255,255,.9) inset, 0 18px 40px -22px rgba(80,55,10,.35) !important;
  transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s, border-color .35s;
}
html[data-theme="light"] :is(.panel, .grid-3 > *, .ws, .ev, .quote, .roles > div, .tcard, .trophy, .partner, .service):hover {
  transform: translateY(-6px); border-color: rgba(165,114,0,.38) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.9) inset, 0 28px 50px -24px rgba(80,55,10,.45) !important;
}
/* Team portraits keep their colour glow; just add the soft shadow */
html[data-theme="light"] .portrait:has(.pic img[src$=".png"]) { background: radial-gradient(circle at 50% 42%, color-mix(in srgb, var(--c) 22%, #fff), #FFFDF8 70%) !important; }

/* Gold buttons with a gentle sheen */
html[data-theme="light"] :is(.btn-gold, .btn-pink) {
  background: linear-gradient(135deg, #A87B1F, #946800 55%, #7A5600) !important; border-color: #A57200 !important; color: #fff !important;
  box-shadow: 0 10px 24px -12px rgba(165,114,0,.8) !important;
}
html[data-theme="light"] :is(.btn-gold, .btn-pink):hover { box-shadow: 0 14px 30px -12px rgba(165,114,0,.95) !important; }

/* Gold shimmer on highlighted words */
html[data-theme="light"][data-page] :is(.display em, .sec .display em, .sec:nth-of-type(odd) .display em, .cta-band .display em, .neon-pink, .neon-yellow, .neon-green) {
  background: linear-gradient(100deg, #8A6400 0%, #A57200 35%, #E9C766 50%, #A57200 65%, #8A6400 100%);
  background-size: 250% 100%; -webkit-background-clip: text; background-clip: text; color: transparent !important;
  animation: lux-shimmer 6s ease-in-out infinite;
}
@keyframes lux-shimmer { 0%, 100% { background-position: 100% 0; } 50% { background-position: 0 0; } }

/* Fade-up on scroll (classes added by theme.js) */
html[data-theme="light"] .lux-reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
html[data-theme="light"] .lux-reveal.lux-in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  .lux-bg span, html[data-theme="light"][data-page] .display em { animation: none !important; }
  html[data-theme="light"] .lux-reveal { opacity: 1; transform: none; transition: none; }
}

/* ---------- WhatsApp chat button (both themes) ---------- */
.wa-float {
  position: fixed; right: 18px; bottom: 18px; z-index: 150; display: inline-flex; align-items: center; gap: 10px;
  padding: 12px 18px 12px 14px; border-radius: 999px; background: #25D366; color: #06210f; font: 700 14px/1 "Space Grotesk", system-ui, sans-serif;
  box-shadow: 0 10px 28px -8px rgba(37,211,102,.7); transition: transform .25s, box-shadow .25s;
  animation: wa-in .6s 1s cubic-bezier(.3,1.6,.5,1) both;
}
.wa-float svg { width: 26px; height: 26px; }
.wa-float:hover { transform: translateY(-3px) scale(1.03); box-shadow: 0 14px 34px -8px rgba(37,211,102,.9); }
@keyframes wa-in { from { opacity: 0; transform: translateY(20px) scale(.8); } to { opacity: 1; transform: none; } }
@media (max-width: 640px) { .wa-float span { display: none; } .wa-float { padding: 13px; } }
@media (prefers-reduced-motion: reduce) { .wa-float { animation: none; } }
html[data-theme="light"] .wa-float { color: #fff; background: #1FAE55; }
/* Instagram version of the chat button (used until a WhatsApp number is added) */
.wa-float.ig, html[data-theme="light"] .wa-float.ig { background: linear-gradient(45deg, #F58529, #DD2A7B 50%, #8134AF); color: #fff; box-shadow: 0 10px 28px -8px rgba(221,42,123,.7); }
.wa-float.ig svg { width: 22px; height: 22px; }