/* ============ 08 SUPPORTING CAST (scroll-guided cards) ============ */
.cast{position:relative;--dfont:'Bebas Neue','Noto Sans JP',Impact,sans-serif;--dmono:'DM Mono','IBM Plex Mono',ui-monospace,monospace}
.cast-head{max-width:1180px;margin:0 auto;padding:6vh 6vw 10vh}
.cast-tag{font:400 .6rem var(--dmono);letter-spacing:.25em;text-transform:uppercase;color:var(--ac);margin-bottom:1.1rem;display:flex;align-items:center;gap:14px}
.cast-tag::before{content:'';width:3.1rem;height:1px;background:var(--ac)}
.cast-head h2{font:400 clamp(2.6rem,11.5vw,10.5rem)/.86 var(--dfont);letter-spacing:.02em;color:var(--ink)}
.cast-head h2 .out{color:transparent;-webkit-text-stroke:2px var(--vi)}
.cast-body{position:relative;padding-bottom:20vh}
.cast-world{position:sticky;top:0;height:100vh;z-index:0;pointer-events:none;overflow:hidden;perspective:1000px}
.cast-tablet{position:absolute;left:5vw;top:5vw;width:90vw;max-width:1200px;height:150vh;padding:40px 40px 40px 140px;border-radius:30px;transform-origin:0 50%;transform:rotateY(20deg);
  background:linear-gradient(110deg,rgba(255,255,255,.10),rgba(255,255,255,.02) 85%);opacity:.5;transform-style:preserve-3d;will-change:transform}
.cast-tablet::before{content:'';position:absolute;left:120px;top:20px;right:20px;bottom:20px;border-radius:20px;background:rgba(8,4,9,.9);border:thin solid rgba(255,255,255,.16)}
.cast-svg{position:absolute;left:0;top:0;z-index:1;pointer-events:none;overflow:visible;filter:blur(.8px)}
.cast-svg .guide{fill:none;stroke:rgba(255,255,255,.06);stroke-width:2}
.cast-svg .dash{fill:none;stroke:url(#castGrad);stroke-linecap:round}
.cast-cards{position:relative;z-index:3;margin-top:-100vh;padding:14vh 0 0;display:flex;flex-direction:column;gap:clamp(90px,16vh,170px);max-width:1180px;margin-left:auto;margin-right:auto}
.cc-wrap{display:flex;padding:0 6vw}
.cc-wrap.l{justify-content:flex-start}.cc-wrap.r{justify-content:flex-end}
.cc{position:relative;width:min(350px,100%);border-radius:20px;isolation:isolate;--ring:linear-gradient(-45deg,#912acd 15%,#16a242 55%,#03b0ea 90%)}
.cc::before{content:'';position:absolute;inset:0;border-radius:inherit;padding:1.5px;background:var(--ring);z-index:2;pointer-events:none;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.cc::after{content:'';position:absolute;inset:-4px;border-radius:24px;background:var(--ring);filter:blur(20px);opacity:.3;z-index:-1}
.cc-in{position:relative;border-radius:20px;padding:26px 24px 30px;overflow:hidden;min-height:440px;
  background:radial-gradient(closest-corner,rgba(40,36,58,.07) 10%,rgba(24,18,40,.78) 90%),linear-gradient(50deg,rgba(70,207,113,.10) 0%,transparent 25%,transparent 75%,rgba(177,105,219,.14) 100%),rgba(10,7,18,.74);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;translate:0 40px;transition:opacity .9s cubic-bezier(.2,.8,.2,1),translate .9s cubic-bezier(.2,.8,.2,1)}
.cc.in .cc-in{opacity:1;translate:0 0}
.cc-kj{position:absolute;right:-8px;bottom:-30px;font:900 11rem/1 'Noto Sans JP',sans-serif;color:color-mix(in srgb,var(--a) 9%,transparent);pointer-events:none;user-select:none}
.cc-top{position:relative;display:flex;justify-content:space-between;gap:12px;font:400 .58rem var(--dmono);letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}
.cc-top span:first-child{white-space:nowrap}
.cc-role{color:var(--a);text-align:right}
.cc-name{position:relative;font:400 clamp(3rem,7vw,4.1rem)/.9 var(--dfont);letter-spacing:.03em;margin:1.3rem 0 1rem;background-image:linear-gradient(-45deg,#b169db 5%,#46cf71 55%,#0fbffa);-webkit-background-clip:text;background-clip:text;color:transparent;filter:brightness(1.5)}
.cc-lead{position:relative;font-size:.9rem;line-height:1.7;color:#f0ecff;margin-bottom:1.1rem}
.cc-f{position:relative;display:grid;gap:.15rem}
.cc-f dt{font:400 .58rem var(--dmono);letter-spacing:.22em;text-transform:uppercase;color:var(--a);margin-top:.85rem}
.cc-f dd{font-size:.8rem;line-height:1.65;color:#c2bcda}
.cc .tw{display:inline-block;white-space:nowrap}
.cc .tc{opacity:0}
@media (max-width:760px){
  .cc-wrap,.cc-wrap.l,.cc-wrap.r{justify-content:center;padding:0 5vw}
  .cc-kj{font-size:8rem}
}
@media (prefers-reduced-motion:reduce){.cc-in{opacity:1;translate:0 0;transition:none}.cc .tc{opacity:1}}