/* Style variations, activated via ?theme=b or ?theme=c
   A (default, no param) = poster energy, alternating light/dark, green accents
   B = editorial light: calm, airy, soft shadows, minimal green
   C = dark premium: deep green-black throughout, glow accents */

/* ============ THEME B: editorial light ============ */
html[data-theme="b"] body { background: var(--paper); color: var(--ink); }

html[data-theme="b"] .topbar { background: var(--paper); border-bottom: 1px solid var(--sand); }
html[data-theme="b"] .logo { color: var(--ink); }
html[data-theme="b"] .logo em { color: var(--living); }
html[data-theme="b"] .topbar-cta { background: var(--living); color: var(--paper); }
html[data-theme="b"] .topbar-avatar { border-color: var(--living); }

html[data-theme="b"] .hero { background: var(--paper); }
html[data-theme="b"] .hero-grid { display: none; }
html[data-theme="b"] .hero-sub { font-weight: 500; }
/* soft drifting glow behind the hero photo for a bit of life */
html[data-theme="b"] .hero-photo { position: relative; }
html[data-theme="b"] .hero-photo::before {
  content: ""; position: absolute; inset: -12%;
  background: radial-gradient(circle at 50% 45%, rgba(116, 217, 159, 0.35), rgba(58, 125, 68, 0.12) 55%, transparent 72%);
  filter: blur(4px);
  animation: blobDrift 9s ease-in-out infinite alternate;
  z-index: 0; pointer-events: none;
}
@keyframes blobDrift {
  from { transform: translate(-4%, -3%) scale(0.96); }
  to { transform: translate(4%, 4%) scale(1.06); }
}
html[data-theme="b"] .photo-card { position: relative; z-index: 1; transition: transform 0.4s ease; }
html[data-theme="b"] .photo-card:hover { transform: translateY(-6px) rotate(-1deg); }
@media (prefers-reduced-motion: reduce) { html[data-theme="b"] .hero-photo::before { animation: none; } }
html[data-theme="b"] .btn-primary { background: var(--living); color: var(--paper); box-shadow: 0 10px 24px rgba(58, 125, 68, 0.25); border-radius: 999px; }
html[data-theme="b"] .btn-primary:hover { transform: translateY(-2px); box-shadow: 0 14px 28px rgba(58, 125, 68, 0.3); }
html[data-theme="b"] .photo-card { transform: none; padding: 0; background: none; box-shadow: 0 24px 48px rgba(28, 24, 19, 0.18); border-radius: 16px; overflow: hidden; }
html[data-theme="b"] .photo-card img { object-position: 50% 25%; }
html[data-theme="b"] .photo-card img { border-radius: 16px; }
html[data-theme="b"] .photo-fallback { inset: 0; border-radius: 16px; }
html[data-theme="b"] .photo-tag { display: none; }

html[data-theme="b"] .marquee { display: none; }

html[data-theme="b"] .shift { background: var(--bone); }
html[data-theme="b"] .step { border: 1px solid var(--sand); box-shadow: 0 6px 18px rgba(28, 24, 19, 0.06); background: var(--paper); border-radius: 14px; }
html[data-theme="b"] .step:hover { transform: translateY(-3px); }

html[data-theme="b"] .proof { background: var(--paper); border-block: 1px solid var(--sand); }
html[data-theme="b"] .proof-big { color: var(--living); }
html[data-theme="b"] .proof-item .mono { color: var(--muted); opacity: 1; }

html[data-theme="b"] .about { background: var(--paper); color: var(--ink); }
html[data-theme="b"] .about .eyebrow { color: var(--living); }
html[data-theme="b"] .about-copy em { color: var(--living); }
html[data-theme="b"] .ig-link { color: var(--living); }

html[data-theme="b"] .quiz-section { background: var(--bone); }
html[data-theme="b"] .quiz-card { border: 1px solid var(--sand); box-shadow: 0 16px 40px rgba(28, 24, 19, 0.1); border-radius: 18px; }
html[data-theme="b"] .q-opt { border: 1px solid var(--sand); background: var(--paper); border-radius: 12px; }
html[data-theme="b"] .q-opt:hover { background: var(--living); color: var(--paper); transform: none; }
html[data-theme="b"] #contactForm input { border: 1px solid var(--sand); }
html[data-theme="b"] .footer { background: var(--ink); }

/* ============ THEME C: dark premium ============ */
html[data-theme="c"] body { background: #07211a; }

html[data-theme="c"] .topbar { background: rgba(7, 33, 26, 0.9); border-bottom: 1px solid rgba(116, 217, 159, 0.12); backdrop-filter: blur(8px); }
html[data-theme="c"] .hero { background: radial-gradient(ellipse 80% 60% at 70% 20%, rgba(58, 125, 68, 0.35), transparent), #07211a; color: var(--paper); }
html[data-theme="c"] .hero-grid { background-image: linear-gradient(rgba(116, 217, 159, 0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(116, 217, 159, 0.05) 1px, transparent 1px); }
html[data-theme="c"] .hero-title .outline { -webkit-text-stroke: 2px var(--signal); }
html[data-theme="c"] .hero-title .accent { color: var(--signal); text-shadow: 0 0 40px rgba(116, 217, 159, 0.5); }
html[data-theme="c"] .hero-sub { color: rgba(250, 247, 240, 0.85); }
html[data-theme="c"] .hero-note { color: rgba(250, 247, 240, 0.6); }
html[data-theme="c"] .btn-primary { background: var(--signal); color: var(--pine); box-shadow: 0 0 32px rgba(116, 217, 159, 0.35); border-radius: 10px; }
html[data-theme="c"] .btn-primary:hover { transform: translateY(-2px); box-shadow: 0 0 44px rgba(116, 217, 159, 0.5); }
html[data-theme="c"] .photo-card { background: rgba(250, 247, 240, 0.06); padding: 10px 10px 10px; border: 1px solid rgba(116, 217, 159, 0.25); box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5); border-radius: 14px; }
html[data-theme="c"] .photo-card img { border-radius: 8px; }
html[data-theme="c"] .photo-fallback { inset: 10px; border-radius: 8px; }
html[data-theme="c"] .photo-tag { background: var(--signal); color: var(--pine); }

html[data-theme="c"] .marquee { background: #051a14; }

html[data-theme="c"] .shift { background: #0a2820; color: var(--paper); }
html[data-theme="c"] .shift .eyebrow { color: var(--signal); }
html[data-theme="c"] .step { background: rgba(250, 247, 240, 0.04); border: 1px solid rgba(116, 217, 159, 0.18); box-shadow: none; border-radius: 12px; color: var(--paper); }
html[data-theme="c"] .step:hover { border-color: rgba(116, 217, 159, 0.5); transform: translateY(-3px); }
html[data-theme="c"] .step-num { color: var(--signal); }

html[data-theme="c"] .proof { background: #051a14; }

html[data-theme="c"] .about { background: #07211a; }

html[data-theme="c"] .quiz-section { background: #0a2820; color: var(--paper); }
html[data-theme="c"] .quiz-section .eyebrow { color: var(--signal); }
html[data-theme="c"] .quiz-card { background: rgba(250, 247, 240, 0.05); border: 1px solid rgba(116, 217, 159, 0.25); box-shadow: 0 24px 60px rgba(0, 0, 0, 0.4); border-radius: 16px; color: var(--paper); }
html[data-theme="c"] .quiz-progress { background: rgba(250, 247, 240, 0.12); }
html[data-theme="c"] .quiz-progress-bar { background: var(--signal); }
html[data-theme="c"] .q-label { color: rgba(250, 247, 240, 0.5); }
html[data-theme="c"] .q-opt { background: rgba(250, 247, 240, 0.05); border: 1px solid rgba(116, 217, 159, 0.25); color: var(--paper); border-radius: 10px; }
html[data-theme="c"] .q-opt:hover { background: var(--signal); color: var(--pine); }
html[data-theme="c"] #contactForm input { background: rgba(250, 247, 240, 0.06); border: 1px solid rgba(116, 217, 159, 0.25); color: var(--paper); }
html[data-theme="c"] #contactForm label { color: var(--paper); }
html[data-theme="c"] .form-note { color: rgba(250, 247, 240, 0.5); }
html[data-theme="c"] .q-back { color: rgba(250, 247, 240, 0.5); }
html[data-theme="c"] .q-back:hover { color: var(--paper); }
html[data-theme="c"] .done-mark { background: var(--signal); color: var(--pine); }
html[data-theme="c"] .done-sig { color: var(--signal); }
html[data-theme="c"] .footer { background: #051a14; }