/* AISPG(TM) public site - V5 "Backlit Red" signature layer (homepage).
   Aesthetic-only: no content, copy, links or structure are changed here.
   Principles: light sits BEHIND shapes and letterforms; text stays crisp.
   Motion respects prefers-reduced-motion. */

:root {
  --bl-red: #ff2d5f;
  --bl-hot: #ff5c84;
  --bl-pale: #ffb3c6;
  --bl-deep: #5a0d2b;
  --bl-ink: #03040b;
  --bl-glow-lg: 0 0 38px rgba(255, 45, 95, .32), 0 0 90px rgba(255, 45, 95, .14);
  --bl-glow-sm: 0 0 14px rgba(255, 45, 95, .45), 0 0 34px rgba(255, 45, 95, .18);
}

/* ---------- 1. Atmosphere: a slow, breathing red backlight behind the whole page ---------- */
body { background-color: var(--bl-ink); }
.v5-atmos {
  position: fixed; inset: 0; z-index: -1; pointer-events: none; overflow: hidden;
}
.v5-atmos::before, .v5-atmos::after {
  content: ""; position: absolute; border-radius: 50%; filter: blur(0); will-change: transform, opacity;
}
.v5-atmos::before {
  width: 70vmax; height: 70vmax; right: -24vmax; top: -30vmax;
  background: radial-gradient(closest-side, rgba(255, 45, 95, .20), rgba(255, 45, 95, .06) 55%, transparent 72%);
  animation: v5Breathe 13s ease-in-out infinite alternate;
}
.v5-atmos::after {
  width: 64vmax; height: 64vmax; left: -26vmax; bottom: -34vmax;
  background: radial-gradient(closest-side, rgba(150, 12, 50, .26), rgba(150, 12, 50, .07) 55%, transparent 72%);
  animation: v5Breathe 17s ease-in-out -6s infinite alternate;
}
/* Film grain for depth (very low opacity, does not touch text legibility) */
.v5-grain {
  position: fixed; inset: -50%; z-index: 9998; pointer-events: none; opacity: .055; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  animation: v5Grain 1.2s steps(4) infinite;
}

/* Glowing scroll progress */
.site-progress, .scroll-bar { box-shadow: var(--bl-glow-sm); }

/* ---------- 2. Section seams: each section edge becomes a thin line of red light ---------- */
.v5-seam {
  position: absolute; left: 0; right: 0; top: -1px; height: 1px; pointer-events: none; z-index: 5;
  background: linear-gradient(90deg, transparent, rgba(255, 92, 132, .85) 22%, rgba(255, 179, 198, .95) 50%, rgba(255, 92, 132, .85) 78%, transparent);
  box-shadow: 0 0 18px 1px rgba(255, 45, 95, .45);
  opacity: .8;
}
.v5-seam::after {
  content: ""; position: absolute; top: -2px; left: 0; width: 22%; height: 5px; border-radius: 3px;
  background: radial-gradient(closest-side, rgba(255, 230, 238, .95), rgba(255, 92, 132, .6) 45%, transparent);
  box-shadow: 0 0 26px 6px rgba(255, 45, 95, .45);
  transform: translateX(-30vw); animation: v5Pulse 7s cubic-bezier(.55, .1, .3, 1) infinite;
}

/* ---------- 3. Hero: a red backlight blooming behind the headline ---------- */
.hero-v2 .hero-copy { position: relative; isolation: isolate; }
.hero-v2 .hero-copy::before {
  content: ""; position: absolute; z-index: -1; pointer-events: none;
  left: -18%; top: 0%; width: 100%; height: 68%;
  background:
    radial-gradient(52% 58% at 40% 50%, rgba(255, 45, 95, .46), rgba(255, 45, 95, .16) 52%, transparent 76%);
  animation: v5Bloom 7s ease-in-out infinite alternate;
}
.hero-v2 h1 { text-shadow: 0 0 1px rgba(255, 255, 255, .3), 0 0 30px rgba(255, 45, 95, .45), 0 0 110px rgba(255, 45, 95, .30); }
.crimson-shine, .scarlet, .hero-v2 h1 em, .hero-v2 h1 .crimson-shine {
  text-shadow: 0 0 18px rgba(255, 45, 95, .62), 0 0 54px rgba(255, 45, 95, .38), 0 0 120px rgba(255, 45, 95, .22);
}
.red-period, .red-beacon { filter: drop-shadow(0 0 10px rgba(255, 45, 95, .85)); }

/* Authority stage: halo ring and a slow light sweep around the shield */
.v5-sweep {
  position: absolute; z-index: 0; pointer-events: none; inset: 6% 8%; border-radius: 50%;
  background: conic-gradient(from 0deg, transparent 0 70%, rgba(255, 92, 132, .34) 82%, transparent 92%);
  -webkit-mask: radial-gradient(closest-side, transparent 72%, #000 74%, #000 76%, transparent 78%);
          mask: radial-gradient(closest-side, transparent 72%, #000 74%, #000 76%, transparent 78%);
  animation: v5Spin 16s linear infinite;
}
.v5-halo {
  position: absolute; z-index: -1; pointer-events: none; inset: 18% 20%; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(255, 45, 95, .34), rgba(255, 45, 95, .10) 60%, transparent 76%);
  animation: v5Bloom 6s ease-in-out infinite alternate;
}
.orbit-node { box-shadow: 0 0 0 1px rgba(255, 92, 132, .28), 0 10px 30px rgba(0, 0, 0, .45), 0 0 26px rgba(255, 45, 95, .16); transition: box-shadow .35s ease, transform .35s ease; }
.orbit-node:hover { box-shadow: 0 0 0 1px rgba(255, 140, 168, .7), 0 0 32px rgba(255, 45, 95, .5); transform: translateY(-2px); }

/* ---------- 4. Headlines across the page: backlit, never blurred ---------- */
section h2 { text-shadow: 0 0 1px rgba(255, 255, 255, .14), 0 0 34px rgba(255, 45, 95, .30), 0 0 100px rgba(255, 45, 95, .16); }
.eyebrow { text-shadow: 0 0 14px rgba(255, 45, 95, .35); }

/* Cinematic statement: light rays behind the type */
.v5-rays {
  position: absolute; z-index: -1; pointer-events: none; left: 30%; top: 34%;
  width: 150vmax; height: 150vmax; transform: translate(-50%, -50%);
  background: repeating-conic-gradient(from 0deg at 50% 50%, rgba(255, 45, 95, .075) 0 4deg, transparent 4deg 13deg);
  -webkit-mask: radial-gradient(closest-side, #000 0, rgba(0, 0, 0, .55) 40%, transparent 70%);
          mask: radial-gradient(closest-side, #000 0, rgba(0, 0, 0, .55) 40%, transparent 70%);
  animation: v5SpinC 120s linear infinite;
}

/* ---------- 5. Metrics strip: neon-backlit numerals ---------- */
.statline { position: relative; overflow: hidden; }
.statline::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(100deg, transparent 30%, rgba(255, 179, 198, .10) 45%, rgba(255, 92, 132, .16) 50%, transparent 62%);
  transform: translateX(-100%); animation: v5Sweep 9s ease-in-out 1.5s infinite;
}
.metric .num, .statline .num, .card-number {
  text-shadow: 0 0 1px rgba(255, 255, 255, .4), 0 0 20px rgba(255, 45, 95, .75), 0 0 60px rgba(255, 45, 95, .35);
}

/* ---------- 6. Cards: backlit edges and a pointer-following spotlight ---------- */
.card, .v3-frame, .vault-preview, .v3-paper-card, .quote-block, .visual-card, .flow-stage {
  transition: transform .45s cubic-bezier(.2, .7, .2, 1), box-shadow .45s ease, border-color .45s ease;
}
.v3-paper-card, .visual-card { position: relative; }
.card, .v3-frame, .vault-preview, .v3-paper-card, .visual-card {
  box-shadow: 0 0 0 1px rgba(255, 92, 132, .10), 0 0 30px rgba(255, 45, 95, .08);
}
.v5-spot {
  --mx: 50%; --my: 0%;
  position: absolute; inset: 0; pointer-events: none; border-radius: inherit; z-index: 3;
  background: radial-gradient(380px circle at var(--mx) var(--my), rgba(255, 45, 95, .20), transparent 62%);
  mix-blend-mode: screen; opacity: 0; transition: opacity .4s ease;
}
.v5-edge {
  position: absolute; left: 0; right: 0; top: 0; height: 1px; pointer-events: none; z-index: 4;
  background: linear-gradient(90deg, transparent, rgba(255, 92, 132, .8), transparent);
  box-shadow: 0 0 12px rgba(255, 45, 95, .5); opacity: .75; transition: opacity .4s ease;
}
.card:hover, .v3-frame:hover, .vault-preview:hover, .v3-paper-card:hover, .quote-block:hover, .visual-card:hover {
  transform: translateY(-4px);
  border-color: rgba(255, 120, 155, .62) !important;
  box-shadow: 0 0 0 1px rgba(255, 92, 132, .30), 0 24px 60px rgba(0, 0, 0, .45), 0 0 46px rgba(255, 45, 95, .22);
}
:hover > .v5-spot, :hover > .v5-edge { opacity: 1; }
.card-icon { filter: drop-shadow(0 0 10px rgba(255, 45, 95, .45)); }

/* Paper covers: hotter backlight behind the monogram */
.v3-paper-monogram { text-shadow: 0 0 30px rgba(255, 47, 93, .75), 0 0 80px rgba(255, 47, 93, .35); }
.v3-paper-cover { transition: filter .5s ease; }
.v3-paper-card:hover .v3-paper-cover { filter: saturate(1.15) brightness(1.08); }

/* Assurance chain stages */
.flow-stage { box-shadow: 0 0 0 1px rgba(255, 92, 132, .10), 0 0 24px rgba(255, 45, 95, .08); }
.flow-stage:hover { box-shadow: 0 0 0 1px rgba(255, 140, 168, .55), 0 0 34px rgba(255, 45, 95, .32); transform: translateY(-3px); }
.stage-selector button[aria-selected="true"], .stage-selector .active, .stage-selector [aria-pressed="true"] {
  box-shadow: 0 0 0 1px rgba(255, 140, 168, .6), var(--bl-glow-sm);
}

/* ---------- 7. Buttons: luminous primary with a passing light sweep ---------- */
.btn.primary { box-shadow: 0 0 0 1px rgba(255, 148, 172, .45), 0 0 36px rgba(255, 45, 95, .42), 0 12px 40px rgba(188, 8, 51, .35); }
.btn.primary::after {
  content: ""; position: absolute; inset: -1px; pointer-events: none;
  background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, .38) 48%, transparent 60%);
  transform: translateX(-120%); animation: v5Sweep 5.5s ease-in-out 2s infinite;
}
.btn.primary:hover { box-shadow: 0 0 0 1px rgba(255, 190, 205, .8), 0 0 54px rgba(255, 45, 95, .65), 0 16px 48px rgba(188, 8, 51, .45); }
.btn.secondary { transition: box-shadow .35s ease, border-color .35s ease; }
.btn.secondary:hover { border-color: rgba(255, 120, 155, .7); box-shadow: 0 0 26px rgba(255, 45, 95, .28); }

/* ---------- 8. Closing: a backlit red horizon ---------- */
.v2-closing { isolation: isolate; }
.v2-closing::before {
  content: ""; position: absolute; z-index: 0; pointer-events: none; left: 50%; bottom: -38%;
  width: 120%; height: 90%; transform: translateX(-50%); border-radius: 50%;
  background: radial-gradient(closest-side, rgba(255, 45, 95, .55), rgba(255, 45, 95, .18) 45%, transparent 70%);
  animation: v5Bloom 8s ease-in-out infinite alternate;
}
.v2-closing > * { position: relative; z-index: 1; }

/* ---------- 9. Entrance: headings ignite as they arrive ---------- */
.v5-ignite { animation: v5Ignite 1.4s cubic-bezier(.2, .7, .2, 1) both; }

/* ---------- Keyframes ---------- */
@keyframes v5Breathe { from { opacity: .65; transform: scale(1); } to { opacity: 1; transform: scale(1.08); } }
@keyframes v5Bloom { from { opacity: .7; } to { opacity: 1; } }
@keyframes v5Spin { to { transform: rotate(360deg); } }
@keyframes v5SpinC { from { transform: translate(-50%, -50%) rotate(0); } to { transform: translate(-50%, -50%) rotate(360deg); } }
@keyframes v5Pulse { 0% { transform: translateX(-30vw); opacity: 0; } 10% { opacity: 1; } 60% { transform: translateX(110vw); opacity: 1; } 61%, 100% { transform: translateX(110vw); opacity: 0; } }
@keyframes v5Sweep { 0% { transform: translateX(-120%); } 55%, 100% { transform: translateX(120%); } }
@keyframes v5Grain { 0% { transform: translate(0, 0); } 25% { transform: translate(-3%, 2%); } 50% { transform: translate(2%, -3%); } 75% { transform: translate(-2%, -1%); } 100% { transform: translate(1%, 3%); } }
@keyframes v5Ignite { from { text-shadow: 0 0 0 rgba(255, 45, 95, 0); } 45% { text-shadow: 0 0 2px rgba(255, 255, 255, .3), 0 0 50px rgba(255, 45, 95, .75), 0 0 140px rgba(255, 45, 95, .4); } to { text-shadow: 0 0 1px rgba(255, 255, 255, .14), 0 0 34px rgba(255, 45, 95, .30), 0 0 100px rgba(255, 45, 95, .16); } }

/* ---------- Small screens: keep the glow, trim the cost ---------- */
@media (max-width: 700px) {
  .v5-grain { display: none; }
  .v5-rays { display: none; }
  .card:hover, .v3-frame:hover, .vault-preview:hover, .v3-paper-card:hover, .quote-block:hover, .visual-card:hover { transform: none; }
}

/* ---------- Reduced motion: all light stays, nothing moves ---------- */
@media (prefers-reduced-motion: reduce) {
  .v5-atmos::before, .v5-atmos::after, .v5-grain, .hero-v2 .hero-copy::before, .v5-sweep, .v5-seam::after,
  .v5-halo, .v5-rays, .statline::before, .btn.primary::after, .v2-closing::before,
  .v5-ignite { animation: none !important; }
  .statline::before, .btn.primary::after { display: none; }
  .card, .v3-frame, .vault-preview, .v3-paper-card, .quote-block, .visual-card, .flow-stage, .orbit-node { transition: none !important; }
  .card:hover, .v3-frame:hover, .vault-preview:hover, .v3-paper-card:hover, .quote-block:hover, .visual-card:hover, .flow-stage:hover, .orbit-node:hover { transform: none; }
}

/* ---------- 10. Signature moments ---------- */
/* Backlight bloom behind every section heading block */
.section-head, .bridge-grid, .v3-publication-head, .vault-heading { position: relative; }
.v5-bloom {
  position: absolute; z-index: -1; pointer-events: none; left: -8%; top: -40%; width: 70%; height: 180%;
  background: radial-gradient(48% 46% at 30% 50%, rgba(255, 45, 95, .20), rgba(255, 45, 95, .07) 55%, transparent 75%);
  opacity: 0; transition: opacity 1.6s ease;
}
.v5-lit .v5-bloom, .v5-bloom.v5-on { opacity: 1; }
/* A slow diagonal light beam crossing the hero */
.v5-beam {
  position: absolute; z-index: 0; pointer-events: none; top: -20%; bottom: -20%; left: 0; width: 22%;
  background: linear-gradient(90deg, transparent, rgba(255, 92, 132, .10) 40%, rgba(255, 190, 205, .14) 50%, rgba(255, 92, 132, .10) 60%, transparent);
  transform: translateX(-60vw) skewX(-18deg); mix-blend-mode: screen;
  animation: v5Beam 11s cubic-bezier(.45, .05, .25, 1) 1s infinite;
}
@keyframes v5Beam { 0% { transform: translateX(-60vw) skewX(-18deg); opacity: 0; } 8% { opacity: 1; } 55% { transform: translateX(120vw) skewX(-18deg); opacity: 1; } 56%, 100% { transform: translateX(120vw) skewX(-18deg); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .v5-beam { display: none; } .v5-bloom { transition: none; } }

/* ---------- 11. Performance layer (look unchanged; less work per frame) ---------- */
/* Grain is static: same texture, no per-frame repaint */
.v5-grain { inset: 0; animation: none; }
/* Diagram glow: keep the glow, breathe with opacity (compositor) instead of re-filtering every frame */
.authority-paths { animation: v5PathBreathe 7s ease-in-out infinite; filter: drop-shadow(0 0 12px rgba(234, 39, 83, .5)); }
@keyframes v5PathBreathe { 50% { opacity: .82; } }
/* Anything animated pauses while its section is off-screen */
.v5-off, .v5-off *, .v5-off *::before, .v5-off *::after, .v5-off::before, .v5-off::after { animation-play-state: paused !important; }

/* Phones and tablets: the same backlit look, a lighter engine */
@media (max-width: 900px), (pointer: coarse) {
  .header, .header-v2 { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background: rgba(4, 6, 13, .97) !important; }
  .v5-atmos::before, .v5-atmos::after { animation: none; will-change: auto; opacity: .9; }
  .v5-grain, .v5-rays, .v5-spot, .v5-sweep { display: none; }
  .v5-beam { mix-blend-mode: normal; }
  .authority-aura { animation: none; filter: none; }
  .authority-paths { animation: none; }
  .authority-core::before { animation: none; }
  .v5-seam::after { animation-duration: 10s; }
  .hero-v2 h1 { text-shadow: 0 0 1px rgba(255, 255, 255, .3), 0 0 26px rgba(255, 45, 95, .45), 0 0 70px rgba(255, 45, 95, .26); }
  section h2 { text-shadow: 0 0 1px rgba(255, 255, 255, .14), 0 0 28px rgba(255, 45, 95, .30); }
}

/* ---------- 12. Still light (Oct 27): no looping motion, no wave, glow on hover only ---------- */
/* Every backlight is now static light. Nothing on the page animates on its own. */
.v5-atmos::before, .v5-atmos::after, .hero-v2 .hero-copy::before, .v5-halo, .v5-rays, .v2-closing::before,
.authority-aura, .authority-paths, .authority-core::before, .red-beacon, .v5-ignite { animation: none !important; }
.v5-atmos::before, .v5-atmos::after { will-change: auto; opacity: .85; }
.v5-grain, .v5-beam, .v5-sweep, .v5-spot, .v5-seam::after, .statline::before, .btn.primary::after { display: none !important; }
/* Header: solid instead of a live blur (the blur re-renders on every scroll frame) */
.header, .header-v2 { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background: rgba(4, 6, 13, .97) !important; }

/* Hero headline: crisp by default; "ASSURANCE" lights up only while the pointer is over the headline */
.hero-v2 h1 { text-shadow: none; }
.hero-v2 h1 .crimson-shine { text-shadow: none; transition: text-shadow .45s ease; }
.hero-v2 h1:hover .crimson-shine {
  text-shadow: 0 0 18px rgba(255, 45, 95, .55), 0 0 48px rgba(255, 45, 95, .32);
}
.hero-v2 h1 .red-period { filter: none; }
.hero-v2 .hero-copy::before { opacity: 0; transition: opacity .6s ease; }
.hero-v2 .hero-copy:has(h1:hover)::before { opacity: .75; }

/* ---------- 13. Governance circle: a still figure (no hover, no motion, no live effects) ---------- */
.authority-stage, .authority-stage * { pointer-events: none; }
.orbit-node, .orbit-node:hover { transition: none !important; transform: translate(-50%, -50%) !important;
  box-shadow: 0 0 0 1px rgba(255, 92, 132, .28), 0 10px 30px rgba(0, 0, 0, .45) !important; }
.v5-halo { display: none !important; }
.authority-paths { filter: none !important; }
