/* ============================================================
   PMPWS V7 — Void Intro Overlay
   File: assets/css/void-intro.css
   Version: 4.1
   Date: 2026-05-05
   Owner: Bravo 1

   Pure CSS. Zero JavaScript. 14-second sequenced overlay.
   Loads on V7 index.html as decorative aria-hidden intro.
   ============================================================ */

for UAT only: externalise to /assets/css/ for CSP
    - aria-hidden=true: decorative, screen-reader transparent
    - prefers-reduced-motion respected
    - No localStorage/cookies: GDPR clean for this component
    - Image content-security: backdrop-image is same-origin
    - SVG: not used in this build (photographic approach)

  CLAUDE CODE HANDOFF — UAT acceptance criteria:
    [ ] Backdrop image loads cleanly, no 404s
    [ ] Image licence verified or swapped to public-domain source
    [ ] Backdrop applies Ken Burns slow zoom + drift (~24s cycle)
    [ ] Supplemental parallax stars visible above photo
    [ ] Hero stars show 4-point diffraction spikes
    [ ] Quote fades in at 3.5s, readable, halo glow visible
    [ ] Attribution at 9s, gold colour, hairline rule between halves
    [ ] Overlay dismisses cleanly at 14s
    [ ] V7 home content interactive after dismiss
    [ ] Reduced-motion mode preserves message beats
    [ ] No console errors
    [ ] Lighthouse score ≥95 Best Practices
    [ ] LCP not impacted (overlay is decorative, post-load)

  Traceability: UI-021 Void Galactic Intro Overlay
  ============================================================================
-->
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>PMPWS — The Void</title>
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;1,300;1,400&family=Cinzel:wght@400;500&display=swap" rel="stylesheet">
  <style>
    * { box-sizing: border-box; }

    .void-intro {
      position: fixed; inset: 0;
      z-index: 9999;
      overflow: hidden;
      background: #02030a;
      pointer-events: auto;
      animation: voidDismiss 0s linear 14s forwards;
    }

    /* ----- Backdrop image with Ken Burns motion ----- */
    .void-intro .backdrop {
      position: absolute;
      inset: -5%;
      width: 110%;
      height: 110%;
      background-image: url('/assets/img/void-backdrop.jpg');
      background-size: cover;
      background-position: center center;
      background-repeat: no-repeat;
      opacity: 0;
      transform: scale(1.05);
      animation:
        backdropFadeIn 3.5s ease-out 0s both,
        kenBurns 24s ease-in-out infinite alternate,
        backdropFadeOut 3s ease-in 11s forwards;
    }

    /* Subtle vignette to deepen the void edges */
    .void-intro .vignette {
      position: absolute;
      inset: 0;
      background: radial-gradient(ellipse at center,
        rgba(0,0,0,0) 50%,
        rgba(0,0,0,0.35) 80%,
        rgba(0,0,0,0.65) 100%);
      pointer-events: none;
    }

    /* ----- Supplemental parallax star layers ----- */
    .void-intro .star-layer {
      position: absolute; top: 0; left: 0;
      width: 1px; height: 1px;
      background: transparent; opacity: 0;
      mix-blend-mode: screen;
    }
    .void-intro .stars-small {
      box-shadow: 1540px 208px rgba(255,255,255,0.33), 1437px 1242px rgba(255,240,220,0.37), 447px 1492px rgba(255,255,255,0.59), 954px 1257px rgba(255,255,255,0.34), 1573px 674px rgba(220,235,255,0.85), 571px 214px rgba(255,255,255,0.66), 99px 640px rgba(220,235,255,0.71), 1440px 327px rgba(255,255,255,0.84), 1795px 409px rgba(255,255,255,0.54), 1261px 1333px rgba(255,255,255,0.83), 300px 135px rgba(255,255,255,0.41), 606px 503px rgba(255,255,255,0.55), 2279px 334px rgba(255,255,255,0.55), 1767px 612px rgba(255,255,255,0.85), 1939px 520px rgba(255,255,255,0.80), 1745px 1125px rgba(220,235,255,0.68), 1925px 1489px rgba(255,255,255,0.80), 2370px 1366px rgba(255,255,255,0.78), 306px 1448px rgba(220,235,255,0.39), 353px 1375px rgba(255,240,220,0.58), 2138px 1069px rgba(255,240,220,0.83), 1174px 346px rgba(220,235,255,0.56), 853px 1426px rgba(220,235,255,0.74), 385px 234px rgba(255,255,255,0.78), 41px 891px rgba(255,255,255,0.53), 296px 1340px rgba(220,235,255,0.41), 988px 1446px rgba(220,235,255,0.39), 647px 312px rgba(220,235,255,0.61), 423px 1490px rgba(255,255,255,0.30), 2342px 1485px rgba(255,255,255,0.77), 1232px 1248px rgba(255,255,255,0.40), 1153px 1199px rgba(255,255,255,0.82), 1516px 1461px rgba(255,255,255,0.50), 1445px 845px rgba(255,255,255,0.70), 2071px 822px rgba(255,255,255,0.74), 423px 482px rgba(255,255,255,0.45), 561px 704px rgba(220,235,255,0.52), 1112px 666px rgba(255,255,255,0.66), 2322px 1159px rgba(255,255,255,0.35), 1072px 698px rgba(220,235,255,0.75), 1162px 1351px rgba(255,255,255,0.46), 64px 1136px rgba(255,255,255,0.70), 1377px 89px rgba(255,255,255,0.37), 1902px 707px rgba(255,255,255,0.53), 2211px 460px rgba(220,235,255,0.68), 2300px 1043px rgba(255,255,255,0.42), 1469px 1307px rgba(255,255,255,0.59), 2167px 1429px rgba(255,240,220,0.60), 679px 613px rgba(220,235,255,0.56), 2266px 1024px rgba(255,255,255,0.79), 239px 840px rgba(255,255,255,0.68), 199px 624px rgba(220,235,255,0.36), 1304px 938px rgba(220,235,255,0.55), 1614px 1052px rgba(255,255,255,0.62), 502px 851px rgba(255,255,255,0.38), 1812px 561px rgba(220,235,255,0.72), 861px 869px rgba(255,255,255,0.33), 757px 504px rgba(220,235,255,0.79), 1501px 168px rgba(255,255,255,0.58), 1379px 14px rgba(220,235,255,0.65), 1256px 649px rgba(255,255,255,0.67), 445px 859px rgba(255,255,255,0.62), 905px 959px rgba(255,240,220,0.68), 456px 1481px rgba(255,255,255,0.38), 44px 1413px rgba(255,255,255,0.54), 1700px 659px rgba(255,240,220,0.36), 2200px 1296px rgba(255,255,255,0.77), 1771px 27px rgba(255,255,255,0.39), 1865px 1313px rgba(255,255,255,0.61), 425px 1493px rgba(255,255,255,0.48), 1523px 719px rgba(220,235,255,0.34), 2387px 496px rgba(220,235,255,0.64), 1731px 1234px rgba(220,235,255,0.53), 1191px 1455px rgba(255,240,220,0.57), 556px 411px rgba(255,255,255,0.32), 913px 1178px rgba(255,255,255,0.51), 2145px 338px rgba(220,235,255,0.82), 669px 873px rgba(255,240,220,0.51), 788px 855px rgba(255,255,255,0.71), 2011px 815px rgba(255,255,255,0.47), 2101px 450px rgba(255,240,220,0.51), 354px 690px rgba(220,235,255,0.75), 875px 910px rgba(255,255,255,0.45), 1434px 236px rgba(220,235,255,0.32), 367px 61px rgba(255,240,220,0.53), 1304px 408px rgba(255,255,255,0.58), 1924px 557px rgba(255,255,255,0.51), 55px 1257px rgba(255,255,255,0.85), 461px 1162px rgba(220,235,255,0.46), 612px 703px rgba(255,255,255,0.34), 2033px 1083px rgba(255,255,255,0.38), 615px 1126px rgba(255,255,255,0.37), 489px 63px rgba(255,255,255,0.39), 2166px 125px rgba(255,255,255,0.34), 2062px 194px rgba(255,240,220,0.61), 1676px 957px rgba(255,255,255,0.43), 859px 1346px rgba(255,255,255,0.57), 1081px 803px rgba(255,255,255,0.32), 1590px 348px rgba(255,255,255,0.50), 1675px 1052px rgba(255,255,255,0.41), 1374px 885px rgba(255,240,220,0.63), 393px 996px rgba(255,255,255,0.62), 454px 405px rgba(255,255,255,0.79), 835px 3px rgba(255,240,220,0.76), 1136px 901px rgba(255,240,220,0.73), 191px 378px rgba(255,255,255,0.77), 847px 564px rgba(255,255,255,0.60), 1630px 90px rgba(255,255,255,0.43), 1272px 126px rgba(255,255,255,0.45), 545px 861px rgba(255,255,255,0.84), 86px 1449px rgba(255,255,255,0.45), 1550px 454px rgba(255,255,255,0.47), 2275px 1075px rgba(255,255,255,0.49), 499px 933px rgba(255,255,255,0.73), 1772px 1321px rgba(255,255,255,0.33), 1581px 551px rgba(255,255,255,0.74), 2178px 917px rgba(255,255,255,0.75), 771px 641px rgba(255,240,220,0.84), 2173px 850px rgba(255,255,255,0.67), 1607px 356px rgba(255,255,255,0.59), 1401px 855px rgba(255,255,255,0.46), 1788px 1350px rgba(220,235,255,0.40), 1968px 1163px rgba(255,255,255,0.49), 2006px 345px rgba(220,235,255,0.37), 783px 208px rgba(255,255,255,0.79), 337px 844px rgba(255,240,220,0.75), 1240px 320px rgba(220,235,255,0.52), 1091px 28px rgba(220,235,255,0.52), 2078px 1263px rgba(220,235,255,0.50), 1853px 138px rgba(220,235,255,0.66), 838px 53px rgba(255,255,255,0.53), 804px 291px rgba(220,235,255,0.76), 1507px 833px rgba(220,235,255,0.58), 717px 800px rgba(220,235,255,0.53), 1629px 1005px rgba(255,255,255,0.42), 1357px 950px rgba(255,255,255,0.44), 2264px 197px rgba(255,240,220,0.53), 286px 408px rgba(255,255,255,0.48), 872px 764px rgba(220,235,255,0.56), 2196px 678px rgba(220,235,255,0.80), 915px 135px rgba(255,255,255,0.72), 323px 1474px rgba(255,255,255,0.45), 470px 970px rgba(255,255,255,0.71), 2317px 912px rgba(255,255,255,0.60), 2368px 699px rgba(255,255,255,0.40), 1062px 57px rgba(255,255,255,0.82), 2116px 1079px rgba(255,255,255,0.53), 265px 330px rgba(220,235,255,0.48), 1157px 1456px rgba(255,240,220,0.55), 1113px 202px rgba(255,255,255,0.78), 1535px 244px rgba(255,255,255,0.70), 346px 1275px rgba(255,255,255,0.48), 793px 159px rgba(255,255,255,0.81), 2083px 189px rgba(255,255,255,0.58), 1576px 414px rgba(255,255,255,0.31), 2127px 1469px rgba(220,235,255,0.59), 1586px 798px rgba(255,255,255,0.43), 111px 766px rgba(255,255,255,0.48), 1665px 692px rgba(255,255,255,0.85), 1154px 432px rgba(255,255,255,0.53), 1211px 1465px rgba(255,255,255,0.52), 209px 1495px rgba(220,235,255,0.72), 532px 999px rgba(255,255,255,0.59), 511px 5px rgba(220,235,255,0.76), 1345px 910px rgba(255,255,255,0.58), 708px 359px rgba(255,255,255,0.69), 2036px 1069px rgba(220,235,255,0.57), 1483px 1495px rgba(255,255,255,0.32), 1080px 66px rgba(255,240,220,0.75), 697px 5px rgba(255,255,255,0.42), 1319px 1168px rgba(255,255,255,0.34), 784px 190px rgba(255,255,255,0.44), 715px 84px rgba(255,255,255,0.57), 577px 1218px rgba(255,255,255,0.84), 391px 135px rgba(255,255,255,0.34), 2016px 1146px rgba(255,255,255,0.38), 1165px 1219px rgba(255,240,220,0.77), 395px 1259px rgba(255,255,255,0.80), 1038px 904px rgba(255,255,255,0.83), 2016px 1362px rgba(255,255,255,0.48), 2070px 62px rgba(255,255,255,0.44), 2225px 265px rgba(220,235,255,0.77), 2261px 1128px rgba(255,255,255,0.77), 1672px 1005px rgba(255,255,255,0.60), 2182px 1246px rgba(255,255,255,0.83), 2151px 312px rgba(220,235,255,0.57), 1901px 579px rgba(255,255,255,0.65), 2043px 256px rgba(255,255,255,0.42), 1449px 871px rgba(255,255,255,0.70), 71px 172px rgba(255,255,255,0.30), 1435px 378px rgba(255,255,255,0.57), 1955px 1183px rgba(255,255,255,0.33), 2081px 1411px rgba(255,255,255,0.69), 1020px 1288px rgba(220,235,255,0.42), 388px 476px rgba(255,255,255,0.50), 66px 1298px rgba(255,255,255,0.77), 937px 805px rgba(255,255,255,0.68), 2351px 1182px rgba(255,255,255,0.35), 1994px 931px rgba(255,255,255,0.80), 1421px 694px rgba(220,235,255,0.34), 1079px 994px rgba(255,255,255,0.45), 635px 1236px rgba(255,240,220,0.69), 588px 813px rgba(255,255,255,0.84), 2263px 119px rgba(220,235,255,0.81), 987px 1368px rgba(255,240,220,0.83), 2349px 288px rgba(255,255,255,0.41), 874px 1450px rgba(220,235,255,0.45), 1348px 1385px rgba(255,240,220,0.56), 1340px 346px rgba(255,255,255,0.70), 592px 543px rgba(255,240,220,0.63), 458px 1121px rgba(255,255,255,0.77), 972px 603px rgba(220,235,255,0.77), 1624px 127px rgba(255,255,255,0.32), 527px 1388px rgba(255,255,255,0.54), 2240px 1440px rgba(255,255,255,0.50), 2274px 539px rgba(255,255,255,0.32), 76px 1233px rgba(255,255,255,0.75), 463px 1419px rgba(255,255,255,0.54), 359px 1296px rgba(255,255,255,0.46), 1624px 165px rgba(255,255,255,0.71), 253px 1254px rgba(255,255,255,0.73), 2030px 115px rgba(255,255,255,0.67), 2062px 1014px rgba(255,255,255,0.66), 1146px 920px rgba(255,255,255,0.33), 440px 1348px rgba(255,255,255,0.81), 2243px 1342px rgba(255,255,255,0.62), 2164px 423px rgba(255,255,255,0.45), 109px 348px rgba(255,255,255,0.75), 2095px 518px rgba(255,255,255,0.53), 892px 402px rgba(255,255,255,0.47), 208px 969px rgba(255,240,220,0.32), 1198px 622px rgba(255,240,220,0.49), 1465px 177px rgba(255,255,255,0.70), 1708px 427px rgba(255,255,255,0.67), 2055px 266px rgba(255,255,255,0.76), 1690px 471px rgba(255,240,220,0.70), 1348px 747px rgba(255,255,255,0.43), 1804px 178px rgba(255,255,255,0.38), 341px 715px rgba(255,240,220,0.52), 1518px 407px rgba(220,235,255,0.77), 945px 523px rgba(255,255,255,0.75), 664px 1194px rgba(220,235,255,0.53), 1520px 498px rgba(255,255,255,0.46), 577px 113px rgba(255,255,255,0.78), 559px 1382px rgba(255,255,255,0.53), 1491px 1043px rgba(255,255,255,0.51), 652px 454px rgba(220,235,255,0.85), 1748px 197px rgba(255,255,255,0.40), 2343px 1097px rgba(255,255,255,0.42), 1930px 380px rgba(255,255,255,0.34), 2100px 908px rgba(255,255,255,0.62), 731px 1373px rgba(255,240,220,0.75), 1585px 1105px rgba(255,255,255,0.49), 2393px 1432px rgba(255,255,255,0.47), 43px 701px rgba(255,255,255,0.72), 2109px 592px rgba(255,255,255,0.35), 1210px 1141px rgba(220,235,255,0.43), 1469px 1483px rgba(255,240,220,0.83), 660px 1479px rgba(220,235,255,0.37), 2116px 390px rgba(255,255,255,0.72), 1696px 320px rgba(255,255,255,0.45), 2210px 555px rgba(255,240,220,0.32), 590px 926px rgba(255,255,255,0.43), 1079px 675px rgba(255,255,255,0.54), 896px 880px rgba(255,255,255,0.72), 2119px 56px rgba(255,240,220,0.60), 640px 1392px rgba(220,235,255,0.62), 1642px 1039px rgba(255,255,255,0.74), 830px 1383px rgba(255,240,220,0.34), 1881px 1483px rgba(220,235,255,0.72), 104px 1338px rgba(255,255,255,0.62), 88px 1358px rgba(255,255,255,0.63), 696px 77px rgba(255,255,255,0.31), 1525px 192px rgba(255,255,255,0.61), 1109px 532px rgba(255,255,255,0.74), 1989px 788px rgba(255,255,255,0.57), 1449px 706px rgba(220,235,255,0.66), 1561px 102px rgba(255,255,255,0.35), 64px 1411px rgba(255,255,255,0.74), 1141px 727px rgba(255,255,255,0.33), 869px 1347px rgba(255,255,255,0.72), 437px 300px rgba(255,255,255,0.70), 2151px 1421px rgba(255,255,255,0.37), 107px 1456px rgba(255,255,255,0.39), 138px 463px rgba(255,255,255,0.84), 1363px 450px rgba(255,255,255,0.61), 1142px 243px rgba(255,255,255,0.53), 1951px 135px rgba(255,255,255,0.37), 2366px 472px rgba(255,255,255,0.52), 1865px 1376px rgba(220,235,255,0.39), 1650px 48px rgba(255,255,255,0.42), 256px 1205px rgba(220,235,255,0.39), 1190px 1249px rgba(255,240,220,0.81), 1132px 1350px rgba(255,240,220,0.41), 251px 1268px rgba(255,255,255,0.71), 1173px 1398px rgba(220,235,255,0.57), 1223px 686px rgba(255,255,255,0.56), 387px 1387px rgba(220,235,255,0.62), 1243px 78px rgba(255,255,255,0.83), 1953px 1340px rgba(255,255,255,0.40);
      animation:
        starsAppear 3s ease-out 1s both,
        driftSlow 280s linear infinite,
        starsFade 3s ease-in 11s forwards;
    }
    .void-intro .stars-med {
      width: 2px; height: 2px;
      box-shadow: 2379px 31px rgba(255,255,255,0.49), 659px 508px rgba(255,255,255,0.40), 1592px 334px rgba(255,255,255,0.39), 1859px 327px rgba(255,255,255,0.56), 2181px 295px rgba(255,255,255,0.56), 642px 208px rgba(255,255,255,0.48), 155px 183px rgba(255,255,255,0.55), 572px 500px rgba(255,255,255,0.67), 1025px 1101px rgba(255,255,255,0.37), 23px 1473px rgba(255,255,255,0.79), 946px 347px rgba(255,255,255,0.51), 1405px 893px rgba(255,255,255,0.83), 616px 448px rgba(255,255,255,0.70), 836px 113px rgba(220,235,255,0.70), 1277px 1297px rgba(255,255,255,0.58), 1480px 532px rgba(255,255,255,0.34), 338px 412px rgba(220,235,255,0.72), 494px 769px rgba(255,255,255,0.78), 1622px 1351px rgba(220,235,255,0.55), 738px 367px rgba(220,235,255,0.32), 2032px 1043px rgba(255,255,255,0.69), 1051px 225px rgba(220,235,255,0.76), 854px 1356px rgba(255,240,220,0.68), 2299px 1305px rgba(220,235,255,0.47), 2178px 537px rgba(220,235,255,0.80), 2194px 475px rgba(220,235,255,0.40), 635px 1113px rgba(255,255,255,0.74), 1275px 894px rgba(255,255,255,0.61), 1797px 1209px rgba(255,255,255,0.40), 537px 467px rgba(255,255,255,0.64), 274px 773px rgba(255,240,220,0.63), 2119px 592px rgba(255,255,255,0.35), 84px 940px rgba(220,235,255,0.54), 1133px 74px rgba(255,255,255,0.68), 961px 1160px rgba(255,255,255,0.58), 1383px 549px rgba(255,255,255,0.49), 1662px 1400px rgba(255,255,255,0.75), 1679px 587px rgba(255,240,220,0.56), 1026px 32px rgba(255,255,255,0.32), 688px 1111px rgba(220,235,255,0.34), 1094px 1039px rgba(255,255,255,0.69), 1252px 102px rgba(255,255,255,0.65), 2047px 1126px rgba(255,240,220,0.34), 2182px 40px rgba(255,255,255,0.63), 681px 291px rgba(220,235,255,0.40), 1716px 670px rgba(220,235,255,0.56), 1672px 893px rgba(255,255,255,0.36), 615px 1418px rgba(255,240,220,0.60), 613px 64px rgba(220,235,255,0.76), 2128px 1359px rgba(220,235,255,0.73), 1044px 56px rgba(255,240,220,0.48), 435px 1314px rgba(255,255,255,0.37), 1568px 1040px rgba(255,255,255,0.56), 887px 1315px rgba(255,255,255,0.77), 1865px 366px rgba(255,240,220,0.36), 893px 1335px rgba(255,255,255,0.59), 1432px 433px rgba(220,235,255,0.48), 1693px 116px rgba(255,255,255,0.49), 1214px 815px rgba(255,255,255,0.36), 886px 318px rgba(255,255,255,0.81);
      animation:
        starsAppear 3s ease-out 1.4s both,
        driftMedium 200s linear infinite,
        starsFade 3s ease-in 11s forwards;
    }
    .void-intro .stars-big {
      width: 2px; height: 2px;
      box-shadow: 2062px 837px rgba(220,235,255,0.79), 210px 1021px rgba(255,255,255,0.65), 1987px 1018px rgba(255,255,255,0.78), 2308px 839px rgba(255,255,255,0.73), 1069px 499px rgba(255,240,220,0.65), 2212px 208px rgba(255,255,255,0.41), 104px 346px rgba(255,255,255,0.44), 1351px 129px rgba(220,235,255,0.68), 2270px 198px rgba(255,255,255,0.45), 1875px 644px rgba(255,255,255,0.43), 2063px 478px rgba(220,235,255,0.40), 2328px 1454px rgba(255,255,255,0.63), 1677px 1176px rgba(255,255,255,0.61), 456px 784px rgba(255,255,255,0.80), 2161px 1139px rgba(255,255,255,0.50);
      animation:
        starsAppear 3s ease-out 1.7s both,
        driftFast 150s linear infinite,
        twinkle 4s ease-in-out infinite,
        starsFade 3s ease-in 11s forwards;
    }

    /* ----- Hero stars with diffraction spikes ----- */
    .void-intro .hero-star {
      position: absolute;
      width: 4px; height: 4px;
      background: white;
      border-radius: 50%;
      box-shadow: 0 0 14px rgba(255,255,255,0.95),
                  0 0 28px rgba(220,235,255,0.65);
      opacity: 0;
      animation:
        heroAppear 3s ease-out 2s both,
        heroPulse 5s ease-in-out infinite,
        starsFade 3s ease-in 11s forwards;
    }
    .void-intro .hero-star::before,
    .void-intro .hero-star::after {
      content: "";
      position: absolute;
      top: 50%; left: 50%;
      transform-origin: center;
      background: linear-gradient(to right,
        transparent 0%,
        rgba(255,255,255,0) 8%,
        rgba(255,255,255,0.85) 50%,
        rgba(255,255,255,0) 92%,
        transparent 100%);
    }
    .void-intro .hero-star::before {
      width: 80px; height: 1px;
      transform: translate(-50%, -50%);
    }
    .void-intro .hero-star::after {
      width: 80px; height: 1px;
      transform: translate(-50%, -50%) rotate(90deg);
    }
    .void-intro .hero-1 { top: 22%; left: 8%;  }
    .void-intro .hero-2 { top: 72%; left: 16%; animation-delay: 2.3s, 0s, 11s; }
    .void-intro .hero-3 { top: 18%; left: 86%; }
    .void-intro .hero-4 { top: 64%; left: 90%; animation-delay: 2.5s, 0s, 11s; }

    /* ----- Text stage ----- */
    .void-intro .text-stage {
      position: absolute; inset: 0;
      display: flex; align-items: center; justify-content: center;
      padding: 0 8vw; text-align: center;
    }
    .void-intro .quote {
      font-family: 'Cormorant Garamond', Georgia, serif;
      font-style: italic; font-weight: 300;
      font-size: clamp(1.5rem, 3.6vw, 3rem);
      line-height: 1.45;
      color: #f4f1e8;
      max-width: 38ch;
      opacity: 0;
      text-shadow:
        0 0 30px rgba(255,250,240,0.40),
        0 0 60px rgba(0,0,0,0.6),
        0 2px 8px rgba(0,0,0,0.5);
      animation: quoteCycle 6s ease-in-out 3.5s forwards;
    }
    .void-intro .attribution {
      position: absolute;
      font-family: 'Cinzel', Georgia, serif;
      font-weight: 400;
      font-size: clamp(0.85rem, 1.5vw, 1.15rem);
      letter-spacing: 0.4em;
      text-transform: uppercase;
      color: #c9a961;
      opacity: 0;
      text-shadow:
        0 0 22px rgba(201,169,97,0.55),
        0 0 40px rgba(0,0,0,0.7),
        0 2px 6px rgba(0,0,0,0.6);
      animation: attributionCycle 4s ease-in-out 9s forwards;
    }
    .void-intro .attribution .dash {
      display: inline-block;
      width: 3em; height: 1px;
      background: #c9a961;
      vertical-align: middle;
      margin: 0 1.4em;
      opacity: 0.6;
    }

    /* ============================================================
       Keyframes
       ============================================================ */
    @keyframes starsAppear { from {opacity:0;} to {opacity:1;} }
    @keyframes starsFade   { from {opacity:1;} to {opacity:0;} }
    @keyframes heroAppear  { from {opacity:0;} to {opacity:1;} }

    @keyframes backdropFadeIn  { from {opacity:0;} to {opacity:1;} }
    @keyframes backdropFadeOut { from {opacity:1;} to {opacity:0;} }

    /* Ken Burns: slow zoom + drift, alternates direction infinitely */
    @keyframes kenBurns {
      0%   { transform: scale(1.05) translate(-1%, -0.5%); }
      100% { transform: scale(1.12) translate( 1.5%, 0.5%); }
    }

    @keyframes driftSlow   { from {transform:translate3d(0,0,0);} to {transform:translate3d(-200px,-100px,0);} }
    @keyframes driftMedium { from {transform:translate3d(0,0,0);} to {transform:translate3d(-130px,-65px,0);} }
    @keyframes driftFast   { from {transform:translate3d(0,0,0);} to {transform:translate3d(-90px,-45px,0);} }

    @keyframes twinkle    { 0%,100% {filter:brightness(1);} 50% {filter:brightness(0.45);} }
    @keyframes heroPulse  { 0%,100% {opacity:1; transform:scale(1);} 50% {opacity:0.65; transform:scale(0.92);} }

    @keyframes quoteCycle {
      0%   { opacity:0; transform:translateY(10px); filter:blur(2px); }
      18%  { opacity:1; transform:translateY(0); filter:blur(0); }
      75%  { opacity:1; transform:translateY(0); filter:blur(0); }
      100% { opacity:0; transform:translateY(-6px); filter:blur(2px); }
    }
    @keyframes attributionCycle {
      0%   { opacity:0; transform:translateY(8px); }
      30%  { opacity:1; transform:translateY(0); }
      75%  { opacity:1; transform:translateY(0); }
      100% { opacity:0; }
    }
    @keyframes voidDismiss { to { opacity:0; pointer-events:none; visibility:hidden; } }

    @media (prefers-reduced-motion: reduce) {
      .void-intro .backdrop {
        animation: backdropFadeIn 2s ease-out both,
                   backdropFadeOut 3s ease-in 11s forwards;
      }
      .void-intro .star-layer,
      .void-intro .stars-big,
      .void-intro .hero-star {
        animation: starsAppear 1.2s ease-out both;
      }
      .void-intro .quote       { animation: quoteCycle 6s ease-in-out 1.8s forwards; }
      .void-intro .attribution { animation: attributionCycle 4s ease-in-out 7.5s forwards; }
    }
