/* ============================================================
   HALO — soft, airy boutique override layer for Lumière.
   Loaded AFTER lumiere.css. A warmer, lighter canvas; a centred hero
   over a photo faded to cream (dark ink text, no heavy scrim); arched
   media and extra rounding. Everything else inherited from lumiere.css.
   ============================================================ */

.halo {
  --l-bg: #fdf9f6;
  --l-surface: #ffffff;
  --l-muted-surface: #f6efe9;
  --l-border: #ecdfd6;
  --l-ink: #2a211d;
  --l-ink-muted: #6b5d54;
  --l-radius-card: 22px;
  --l-radius-media: 26px;
}
body.halo { background: var(--l-bg); color: var(--l-ink); }

/* ---- Nav: soft translucent cream ---- */
.halo #nav { background: color-mix(in srgb, var(--l-bg) 80%, transparent); backdrop-filter: blur(12px); border-bottom: 1px solid var(--l-border); }

/* ---- Hero: centred, airy, photo faded to the cream canvas ---- */
.halo .l-hero { min-height: 94vh; min-height: 94svh; align-items: center; text-align: center; }
.halo .l-hero-scrim {
  background:
    radial-gradient(120% 90% at 50% 8%, color-mix(in srgb, var(--accent) 8%, transparent) 0%, transparent 55%),
    linear-gradient(to bottom, rgba(253,249,246,.62) 0%, rgba(253,249,246,.8) 55%, rgba(253,249,246,.96) 100%);
}
.halo .l-hero-inner { position: relative; margin: 0 auto; max-width: 52rem; align-items: center; }
.halo .l-hero .eyebrow { color: var(--accent); opacity: 1; }
.halo .l-hero-h1 { color: var(--l-ink); text-shadow: none; font-size: clamp(3rem, 7vw, 6.6rem); letter-spacing: -0.02em; }
.halo .l-hero-h1 em { color: var(--accent); }
.halo .l-hero-tag { color: var(--l-ink-muted); opacity: 1; margin: 1.6rem auto 0; max-width: 44ch; }
.halo .l-hero-cta { justify-content: center; }
.halo .l-hero-rating { color: var(--l-ink-muted); justify-content: center; }
.halo .l-hero-rating .stars { color: var(--accent); }
.halo .l-scroll-hint { display: none; }

/* ghost button on a light canvas */
.halo .btn-ghost { color: var(--l-ink); border-color: var(--l-border); }
.halo .btn-ghost:hover { background: color-mix(in srgb, var(--l-ink) 5%, transparent); border-color: var(--l-ink); }

/* ---- Signature: arched media (about + section image blocks) ---- */
.halo .l-about-media,
.halo .bs-edu-media { border-radius: 50vw 50vw var(--l-radius-media) var(--l-radius-media) / 34vh 34vh var(--l-radius-media) var(--l-radius-media); }

/* softer, rounder gallery + cards */
.halo .gallery-grid img { border-radius: var(--l-radius-media); }
.halo .review-card { border-radius: var(--l-radius-card); }

/* thin accent rule under section eyebrows — the delicate boutique tell */
.halo .section-eyebrow::after {
  content: ""; display: inline-block; vertical-align: middle; width: 34px; height: 1px;
  margin-left: .6rem; background: color-mix(in srgb, var(--accent) 60%, transparent);
}

@media (max-width: 640px) {
  .halo .l-hero { min-height: 86vh; min-height: 86svh; }
}

/* Reviews section: blend with this light layout instead of the inherited dark
   band (Kevin 2026-07-30 — the black slab clashed on the light layouts). */
.halo .l-reviews { background: color-mix(in srgb, var(--accent) 7%, var(--l-bg)); color: var(--l-ink); }
.halo .l-reviews .section-eyebrow { color: var(--accent); }
.halo .review-stat .num { color: var(--l-ink); }
.halo .review-stat .count { color: var(--l-ink-muted); }
.halo .review-card { background: var(--l-surface); border: 1px solid var(--l-border); }
.halo .review-card:hover { background: var(--l-surface); }
.halo .review-card .rtext { color: var(--l-ink); }
.halo .review-card .rauthor { color: var(--l-ink-muted); }
