/* LUMEN foundation — Phase 1 of the approved LUMEN Design Reset.
 *
 * This file is shared infrastructure only. Nothing in this file is
 * enqueued anywhere yet — DBL_BCS_Lumen_Assets::enqueue_foundation() is a
 * helper future modules (Session Explorer, Booking, Contract, Studio
 * Control) call from their OWN page-specific asset hooks, so this never
 * loads on a page that doesn't actually use it. That's the whole point of
 * Phase 1: build the shared pieces once, without changing what anyone
 * currently sees.
 *
 * Three things live here:
 *   1. The color system, as CSS custom properties on .lumen-scope (never
 *      on :root/body — a page that doesn't opt in is untouched).
 *   2. The four-role typography setup.
 *   3. The three named transitions from the approved proposal —
 *      Aperture-Open, Focus-Lock, Frame-Construct — as reusable classes,
 *      used consistently everywhere instead of one-off animations.
 *
 * Everything here is transform/opacity/filter based — no canvas, no
 * WebGL, nothing that runs continuously without a real trigger — per the
 * performance rules in the approved implementation plan.
 */

/* v0.39.1 — performance correction: the Google Fonts @import that used to
   live here was removed. A CSS @import forces the browser to fetch and
   parse THIS ENTIRE stylesheet first, discover the @import only then, and
   only THEN start fetching the font CSS — a fully sequential, render-
   blocking chain instead of a parallel request. DBL_BCS_Lumen_Assets::
   enqueue_foundation() now enqueues that same font stylesheet directly
   (as its own <link>, alongside a preconnect hint) so it starts loading
   in parallel with everything else instead of behind it. Nothing about
   which fonts/weights load, or font-display:swap, changed — same exact
   families and weights as before, just fetched correctly. */

/* ── 1. Color system ─────────────────────────────────────────────────
   Fixed brand base, always the same. The --lumen-ambient-* variables are
   the ONLY ones a per-photograph ambient shift (Living Light Field) is
   allowed to touch — everything else (status colors, brand gold/black)
   stays constant regardless of what photo is on screen. */
.lumen-scope {
	--lumen-ground: #0a0a0b;
	--lumen-ground-raised: #101216;
	--lumen-gold: #d9a441;
	--lumen-gold-bright: #e8c766;
	--lumen-gold-deep: #b8862c;
	--lumen-red: #9b1e28;
	--lumen-ink: #ece7da;
	--lumen-ink-dim: #a99f88;
	--lumen-ink-faint: #6b6558;

	/* Status meanings — fixed regardless of ambient shift. */
	--lumen-status-active: var(--lumen-gold);
	--lumen-status-off: var(--lumen-ink-faint);
	--lumen-status-attention: #d75a5a;
	--lumen-status-healthy: #6fbf8a;

	/* Ambient layer only — a photograph's sampled tone may shift these,
	   nothing else. Defaults to the brand base. */
	--lumen-ambient-a: rgba(217, 164, 65, 0.18);
	--lumen-ambient-b: rgba(155, 30, 40, 0.14);

	color: var(--lumen-ink);
}

/* ── 2. Typography system — four roles, not one font doing everything. */
.lumen-scope .lumen-display {
	font-family: 'Cinzel', serif;
	font-weight: 700;
	letter-spacing: 0.02em;
}
.lumen-scope .lumen-body {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	line-height: 1.6;
}
.lumen-scope .lumen-technical {
	font-family: 'Space Mono', monospace;
	font-size: 11px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.lumen-scope .lumen-editorial {
	font-family: 'Cinzel', serif;
	font-weight: 600;
	font-size: clamp(32px, 6vw, 72px);
	line-height: 0.95;
}

/* ── 3. The three signature transitions ──────────────────────────────
   Used everywhere, always meaning the same thing, per the approved
   proposal — this repetition is what makes it a language, not a pile of
   one-off effects. */

/* Aperture-Open — first-entrance moments only. */
.lumen-aperture-open {
	animation: lumen-aperture-open 0.7s cubic-bezier(0.5, 0, 0.2, 1) both;
}
@keyframes lumen-aperture-open {
	from { clip-path: circle(0% at 50% 50%); opacity: 0.3; }
	to   { clip-path: circle(75% at 50% 50%); opacity: 1; }
}

/* Focus-Lock — confirmations and selections, ~180ms blur-to-sharp snap. */
.lumen-focus-lock {
	animation: lumen-focus-lock 0.18s ease-out both;
}
@keyframes lumen-focus-lock {
	from { filter: blur(4px); opacity: 0.6; }
	to   { filter: blur(0); opacity: 1; }
}

/* Frame-Construct — a new structural panel appearing. Corner brackets
   draw themselves inward via a stroke-dasharray reveal on an inline SVG
   frame; the class handles the panel's own fade/scale partner motion. */
.lumen-frame-construct {
	animation: lumen-frame-construct 0.4s ease both;
}
@keyframes lumen-frame-construct {
	from { opacity: 0; transform: scale(0.98); }
	to   { opacity: 1; transform: scale(1); }
}
.lumen-frame-construct-corners rect,
.lumen-frame-construct-corners path {
	stroke-dasharray: 40;
	stroke-dashoffset: 40;
	animation: lumen-frame-draw 0.5s ease forwards;
}
@keyframes lumen-frame-draw {
	to { stroke-dashoffset: 0; }
}

/* Photographic Focus System — the shared sharp/soft treatment reused in
   the Session Explorer, the booking time-picker, and the admin System
   Map (per the approved proposal, same grammar in three contexts). */
.lumen-focus-soft {
	filter: blur(2px) saturate(0.7);
	opacity: 0.7;
	transform: scale(0.98);
	transition: filter 0.3s ease, opacity 0.3s ease, transform 0.3s ease;
}
.lumen-focus-sharp {
	filter: none;
	opacity: 1;
	transform: scale(1);
	transition: filter 0.3s ease, opacity 0.3s ease, transform 0.3s ease;
}

@media (prefers-reduced-motion: reduce) {
	.lumen-aperture-open,
	.lumen-focus-lock,
	.lumen-frame-construct,
	.lumen-frame-construct-corners rect,
	.lumen-frame-construct-corners path {
		animation: none !important;
		clip-path: none !important;
		filter: none !important;
		opacity: 1 !important;
		transform: none !important;
		stroke-dashoffset: 0 !important;
	}
	.lumen-focus-soft,
	.lumen-focus-sharp {
		transition: none !important;
	}
}