/* Single-portrait editorial intro. Scoped to avoid changing the rest of the site. */
.cinematic-hero{display:block;padding:0;min-height:800px;height:100svh;max-height:1100px;background:radial-gradient(ellipse at 50% 38%,#151c36 0%,rgba(7,10,22,.7) 48%,rgba(4,5,10,.6) 78%);border-bottom:1px solid var(--line)}
.intro-atmosphere{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.intro-halo{position:absolute;width:780px;height:780px;left:50%;top:-10px;margin-left:-390px;border-radius:50%;background:radial-gradient(circle,transparent 42%,rgba(145,178,255,.1) 58%,transparent 70%);box-shadow:inset 0 0 80px rgba(126,165,255,.08)}
.intro-orbit{position:absolute;left:50%;top:33%;width:1080px;height:330px;margin-left:-540px;border:1px solid rgba(163,193,248,.18);border-radius:50%;transform:rotate(-24deg);box-shadow:0 -2px 14px rgba(158,203,255,.06)}
.intro-orbit--inner{width:860px;height:520px;margin-left:-430px;top:19%;transform:rotate(27deg);border-color:rgba(163,193,248,.08)}
.intro-orbit--outer::after{content:"";position:absolute;left:20%;top:4%;width:5px;height:5px;border-radius:50%;background:#e6f4ff;box-shadow:0 0 18px 5px rgba(166,201,255,.4)}
.intro-spark{position:absolute;color:#c8ddff;font-size:24px;text-shadow:0 0 20px #a4bdff}
.intro-spark--one{left:17%;top:25%}.intro-spark--two{right:19%;top:56%;font-size:16px}
.intro-edition{position:absolute;left:36px;top:112px;font-size:8px;letter-spacing:.24em;color:#9ba6c2;writing-mode:vertical-rl;display:flex;gap:28px;margin:0}.intro-edition span{color:#65708a}
.portrait-reveal{position:absolute;top:85px;left:50%;width:min(700px,72vw);height:calc(100% - 450px);transform:translateX(-50%);perspective:1200px}
.intro-portrait{width:100%;height:100%;display:flex;align-items:center;justify-content:center;transition:transform 250ms var(--e-micro);transform-style:preserve-3d}
/* Feather the actual photo edges, not its letterbox. Keep the full frame and original pixels. */
.intro-portrait img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;object-position:center;
  --portrait-blend:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.18) 3%,rgba(0,0,0,.65) 8%,#000 16%,#000 84%,rgba(0,0,0,.65) 92%,rgba(0,0,0,.18) 97%,transparent 100%),linear-gradient(180deg,transparent 0%,rgba(0,0,0,.2) 3%,rgba(0,0,0,.7) 8%,#000 15%,#000 70%,rgba(0,0,0,.65) 83%,rgba(0,0,0,.15) 94%,transparent 100%),radial-gradient(ellipse 76% 85% at 50% 45%,#000 45%,rgba(0,0,0,.95) 58%,rgba(0,0,0,.6) 72%,transparent 90%);
  -webkit-mask-image:var(--portrait-blend);
  mask-image:var(--portrait-blend);
  -webkit-mask-composite:source-in;mask-composite:intersect;
}
.intro-side{position:absolute;top:43%;font-size:9px;letter-spacing:.24em;line-height:2.1;color:#e1e7f5;margin:0}.intro-side span{color:#8592ae}.intro-side--left{left:7%}.intro-side--right{right:6%;text-align:right}
.intro-content{position:absolute;bottom:99px;left:0;width:100%;text-align:center;z-index:2;padding:0 24px}
.intro-kicker{display:flex;align-items:center;justify-content:center;gap:15px;margin:0 0 20px;font-size:9px;letter-spacing:.45em;color:#d9e5fa}.intro-kicker>span{width:35px;height:1px;background:linear-gradient(90deg,transparent,#b7c9eb)}.intro-kicker>span:last-child{transform:rotate(180deg)}
.artist-title{display:flex;justify-content:center;gap:.25em;font-family:var(--f-display);font-size:clamp(64px,8.8vw,140px);font-weight:500;letter-spacing:-.035em;line-height:1.1;margin:0;filter:drop-shadow(0 4px 22px rgba(173,196,255,.18))}
.artist-word{display:inline-block;position:relative;white-space:nowrap;color:#e0e9ff}
.artist-letter{display:inline-block;background:linear-gradient(178deg,#fff 12%,#e3efff 35%,#94abc9 48%,#fff 53%,#c2d1e8 69%,#7385a8 100%);background-clip:text;-webkit-background-clip:text;color:transparent}
.artist-word::after{content:"";position:absolute;inset:5% -12%;background:linear-gradient(110deg,transparent 38%,rgba(225,241,255,.32) 49%,transparent 60%);transform:translateX(-100%);opacity:0;pointer-events:none;mix-blend-mode:screen;-webkit-mask-image:linear-gradient(180deg,transparent,#000 40%,#000 60%,transparent);mask-image:linear-gradient(180deg,transparent,#000 40%,#000 60%,transparent)}
.intro-description{font-size:14px;font-weight:300;letter-spacing:.13em;color:#d6deef;margin:17px 0 24px}
.intro-actions{display:flex;gap:14px;justify-content:center}.intro-actions .btn{min-height:49px;min-width:182px;letter-spacing:.16em;transition:transform 180ms var(--e-micro),filter 180ms;animation:none}.intro-actions .btn-primary{box-shadow:0 0 25px rgba(158,185,255,.22)}
.intro-actions .btn-primary::before{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 15px rgba(255,255,255,.85);opacity:.2;pointer-events:none}
.intro-benefit{margin:15px 0 0;font-size:10px;letter-spacing:.06em;color:#8997b2}
.intro-footer{position:absolute;bottom:0;left:36px;right:36px;height:62px;border-top:1px solid rgba(197,214,255,.13);display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:8px;letter-spacing:.2em;color:#93a1bc}
.intro-signal{display:flex;align-items:center;gap:9px}.intro-signal i{width:4px;height:4px;border-radius:50%;background:#c3dcff;box-shadow:0 0 10px #c3dcff}
.intro-scroll{display:flex;align-items:center;gap:12px}.intro-scroll span{font-size:19px;color:#deeaff}
.intro-motion{background:none;border:0;padding:12px 0;color:#a9b7cf;font:inherit;letter-spacing:.12em;cursor:pointer}.intro-motion span{margin-left:8px}.intro-motion:focus-visible,.intro-scroll:focus-visible{outline:2px solid var(--blue);outline-offset:5px}
/* No-JS is fully visible. JS arms the entrance only once it can observe it. */
.intro-armed:not(.intro-ready) :is(.intro-atmosphere,.portrait-reveal,.intro-content,.intro-side){opacity:0}
.intro-ready .intro-atmosphere{animation:introBackdrop 1.4s var(--e-enter) both}
.intro-ready .portrait-reveal{animation:introPortrait 1.2s var(--e-enter) .3s both}
.intro-ready .artist-letter{animation:artistResolve 1s var(--e-settle) both;animation-delay:calc(.95s + var(--letter-index)*.045s)}
.intro-ready .artist-word::after{animation:chromeSweep 8s ease-in-out 2.5s infinite}
.intro-ready .intro-kicker{animation:introRise .9s var(--e-enter) .9s both}
.intro-ready .intro-description{animation:introRise .9s var(--e-enter) 1.6s both}
.intro-ready :is(.intro-actions,.intro-benefit){animation:introRise .9s var(--e-enter) 1.85s both}
.intro-ready .intro-side{animation:introRise 1s var(--e-enter) 1.6s both}
.intro-ready .intro-halo{animation:haloBreathe 8s ease-in-out infinite}
.intro-ready .intro-spark{animation:haloBreathe 6s ease-in-out infinite}.intro-ready .intro-spark--two{animation-delay:-3s}
.intro-ready .intro-actions .btn-primary::before{animation:haloBreathe 2.8s ease-in-out infinite}
.intro-ready .intro-scroll span{animation:introBob 1.8s ease-in-out infinite}
@keyframes introBackdrop{from{opacity:0;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}
@keyframes introPortrait{from{opacity:0;transform:translate(-50%,40px)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes artistResolve{from{opacity:0;filter:blur(10px);transform:translateY(20px)}to{opacity:1;filter:blur(0);transform:translateY(0)}}
@keyframes introRise{from{opacity:0;transform:translateY(14px);filter:blur(6px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes chromeSweep{0%,65%{opacity:0;transform:translateX(-100%)}72%{opacity:.8}85%,100%{opacity:0;transform:translateX(100%)}}
@keyframes haloBreathe{0%,100%{opacity:.4;transform:scale(.98)}50%{opacity:.85;transform:scale(1.03)}}
@keyframes introBob{0%,100%{transform:translateY(-2px)}50%{transform:translateY(4px)}}
.cinematic-hero.effects-paused *,.cinematic-hero.effects-paused *::before,.cinematic-hero.effects-paused *::after{animation-play-state:paused!important}
.cinematic-hero.effects-paused .intro-portrait{transform:none!important}
@media(min-width:1600px){.portrait-reveal{width:800px}.intro-content{bottom:110px}}
@media(max-width:900px){.intro-side{font-size:8px;letter-spacing:.13em}.intro-side--left{left:4%}.intro-side--right{right:4%}.portrait-reveal{width:80vw}.artist-title{font-size:9vw}.intro-edition{left:22px}}
@media(max-width:600px){
  .cinematic-hero{height:100svh;min-height:790px;max-height:none}
  .portrait-reveal{top:95px;width:calc(100% - 32px);height:calc(100% - 470px)}
  .intro-halo{width:600px;height:600px;margin-left:-300px;top:20px}
  .intro-orbit{width:640px;height:240px;margin-left:-320px;top:29%}.intro-orbit--inner{height:390px;top:18%}
  .intro-side,.intro-edition{display:none}
  .intro-content{bottom:86px;padding:0 20px}
  .intro-kicker{font-size:8px;letter-spacing:.3em;margin-bottom:15px}
  .artist-title{flex-direction:column;gap:0;font-size:clamp(47px,15.6vw,86px);line-height:.94;letter-spacing:.015em}
  .intro-description{font-size:11px;letter-spacing:.04em;margin:18px 0 21px}
  .intro-actions{gap:10px}.intro-actions .btn{padding:0 15px;min-width:0;font-size:9px;min-height:47px;letter-spacing:.09em}
  .intro-benefit{font-size:9px;max-width:280px;margin:14px auto 0}
  .intro-footer{left:20px;right:20px;height:61px;font-size:7px;letter-spacing:.12em}.intro-signal{display:none}
  .intro-spark--one{left:9%;top:25%}.intro-spark--two{right:10%;top:45%}
}
@media(prefers-reduced-motion:reduce){
  .cinematic-hero *,.cinematic-hero *::before,.cinematic-hero *::after{animation:none!important;transition:none!important}
  .intro-armed:not(.intro-ready) :is(.intro-atmosphere,.portrait-reveal,.intro-content,.intro-side){opacity:1}
  .artist-letter{opacity:1;filter:none;transform:none}.intro-portrait{transform:none!important}.intro-motion{display:none}
}