/* A room becomes a recording, then a system. All motion follows native scroll. */
.recording-story{--story-approach:0;--story-capture:0;--output-ink:#d49ae7}
.recording-story.is-fan-ready:not(.is-fan-static){height:410svh}
.recording-story .ripple-board{perspective:1200px}
.recording-story .interview-core{width:min(94%,870px);height:min(100%,520px);aspect-ratio:auto;border-radius:32px;border:1px solid #dfc8e752;box-shadow:0 28px 72px #030208a8,inset 0 1px #f8e8ff3b;transform:translate(-50%,-50%) scale(calc(1 - var(--story-transfer)*.86)) rotateY(calc(var(--story-transfer)*-18deg)) rotateZ(calc(var(--story-transfer)*-5deg));transform-style:preserve-3d;background:#17151e}
.studio-depth{position:absolute;inset:0;overflow:hidden;border-radius:inherit}
.studio-environment{position:absolute;width:100%;height:100%;object-fit:cover;object-position:50% 50%;transform:scale(calc(1 + var(--story-approach)*.10));transform-origin:50% 58%;max-width:none}
.studio-presenter{position:absolute;width:auto;height:105%;max-width:none;left:50%;bottom:-15%;object-fit:contain;transform:translateX(-50%) scale(calc(.88 + var(--story-approach)*.21));transform-origin:50% 85%}
.studio-viewfinder{position:absolute;inset:30px;border:1px solid #f1dbf240;border-radius:22px;transform:scale(calc(1 + var(--story-approach)*.10));opacity:calc(.6 - var(--story-transfer)*.6)}
.studio-capture{position:absolute;inset:0;background:#f2e6f6;opacity:calc(var(--story-capture)*.42);border-radius:inherit;pointer-events:none}
.recording-story .recording-frame{inset:0;border:9px solid #dfcee642;border-radius:inherit;opacity:var(--story-play)}
.recording-story .recording-dot{top:48px;left:48px;opacity:calc(1 - var(--story-transfer));width:8px;height:8px}
.recording-story .interview-caption{background:linear-gradient(transparent,#100e18f2);padding:45px 20px 22px!important;font-size:16px!important;letter-spacing:.015em}
.recording-story .recording-play{filter:drop-shadow(0 5px 12px #090511);top:44%;width:62px;height:62px;left:calc(50% - 31px)}
.recording-story .story-conduit{display:none}
.recording-story .system-core{color:#ddb6e8;filter:drop-shadow(0 24px 28px #050307aa)}
.recording-story .system-gear{stroke-width:.85;filter:drop-shadow(0 3px 0 #684678) drop-shadow(0 10px 12px #06030999);transform:rotateX(18deg) rotateZ(calc(var(--story-turn)*1deg))}
.recording-story .system-hub{background:radial-gradient(ellipse at 35% 15%,#685771,#2b2132 53%,#130f1a);border:2px solid #b595c3;box-shadow:inset 0 3px 7px #f7def930,0 12px 20px #060209a8}
.recording-story .ripple-rings{opacity:calc(var(--story-gear)*.15 + var(--story-outputs)*.65)}
.recording-story .system-steps{inset:14% 0;padding-inline:8%;column-gap:35%}
.studio-static{display:none;margin:0 auto 36px;position:relative;max-width:660px;border-radius:26px;overflow:hidden;aspect-ratio:3/2;background:#15121b}
.studio-static>img:first-child{width:100%;height:100%;object-fit:cover}.studio-static-person{position:absolute;height:100%;width:auto;max-width:none;bottom:-15%;left:50%;transform:translateX(-50%)}
.studio-static figcaption{position:absolute;inset:auto 0 0;padding:44px 24px 20px;background:linear-gradient(transparent,#100d17);font-size:16px;color:#f4e8f8;text-align:center}
.recording-story.is-fan-static .studio-static,.recording-story:not(.is-fan-ready) .studio-static{display:block}

/* The framework is an illustrated process, not another wall of text. */
.cinematic-framework{max-width:1440px;padding-top:76px}
.cinematic-framework .system-intro{max-width:850px;margin-bottom:56px}
.cinematic-framework .system-phases{display:block;margin-top:0}
.cinematic-framework .phase-index{position:relative;top:auto;flex-direction:row;gap:32px;padding:0 0 18px;margin-bottom:40px;width:max-content;max-width:100%}
.cinematic-framework .phase-track{inset:auto 0 0;width:100%;height:2px}.cinematic-framework .phase-track>i{transform:scaleX(var(--phase-progress,.05));transform-origin:0 50%}
.cinematic-framework .cinema-phase{--room-p:.5;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:center;column-gap:clamp(32px,5vw,72px);min-height:720px;padding:60px 0 86px;scroll-margin-top:104px;border:0}
.cinematic-framework .cinema-phase+.cinema-phase{border-top:1px solid #bc90ce26;padding-top:72px}
.cinematic-framework .phase-scene{position:relative;margin:0;aspect-ratio:1.12;min-width:0;isolation:isolate;border-radius:32px;overflow:hidden;background:#18151c;box-shadow:0 24px 54px #07050c66;perspective:1100px;transform:translateY(calc((.5 - var(--room-p))*34px))}
.phase-room{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;transform:scale(calc(1.05 + var(--room-p)*.07));transform-origin:50% 55%}
.cinematic-framework .phase-copy{position:relative;z-index:2}.cinematic-framework .phase-copy h4{font-size:clamp(34px,3.5vw,52px);margin-bottom:20px}
.cinematic-framework .phase-name{color:#f4d8fd;font-size:16px;margin-bottom:14px}.cinematic-framework .phase-copy>p:not(.phase-time):not(.phase-name){font-size:16px;line-height:1.6}
.cinematic-framework .phase-copy ul{margin-top:24px}.cinematic-framework .phase-copy li{font-size:15px;padding-block:6px}
.cinematic-framework .phase-output{border-top:1px solid #9a72a43d;padding-top:22px;color:#ecdef2}
.strategy-signals{position:absolute;top:24px;left:22px;right:22px;display:flex;justify-content:center;gap:12px;flex-wrap:wrap;z-index:2}
.signal-channel{display:flex;gap:8px;align-items:center;background:#16101cdd;backdrop-filter:blur(12px);padding:12px 14px;border-radius:18px;border:1px solid #efd4ff40;box-shadow:0 12px 24px #09050e66;color:#f4e8fa;font-size:14px;transform:translateY(calc((1 - clamp(0,var(--room-p)*2,1))*24px))}
.signal-channel:nth-child(2){transform:translateY(calc((1 - clamp(0,var(--room-p)*2,1))*-16px))}
.signal-channel .ripple-symbol{display:block;width:25px;height:25px;background:#ddb2ea;flex-shrink:0}
.scene-insights{position:absolute;inset:auto 20px 22px;display:flex;flex-wrap:wrap;gap:8px;justify-content:center;padding-top:80px;background:linear-gradient(transparent,#15101b)}
.scene-insights span{border-radius:999px;background:#f0ddf1;color:#30203b;padding:10px 14px;font-size:14px;box-shadow:0 7px 15px #08030e55;transform:translateY(calc((1 - clamp(0,(var(--room-p) - .12)*2.7,1))*20px))}
.cinematic-framework #phase-production{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr)}
#phase-production .phase-copy{grid-column:1;grid-row:1}#phase-production .phase-scene{grid-column:2;grid-row:1}
.production-recording{position:absolute;width:46%;aspect-ratio:16/10;left:27%;top:18%;border:3px solid #e4cfeaab;border-radius:16px;overflow:hidden;background:#1d1422;box-shadow:0 18px 28px #0009;transform:translateY(calc((.5 - var(--room-p))*75px)) rotateY(calc(12deg - var(--room-p)*24deg)) rotateZ(-4deg)}
.production-recording>img:first-child{width:100%;height:100%;object-fit:cover}.production-presenter{position:absolute;height:115%;width:auto;max-width:none;left:50%;bottom:-20%;transform:translateX(-50%)}
.production-deliverables{position:absolute;inset:auto 24px 26px;display:flex;flex-direction:column;align-items:flex-end;gap:8px;padding-top:100px;background:linear-gradient(transparent,#15101bcc)}
.production-deliverables span{display:block;background:#1b1520e6;border:1px solid #edcaed66;border-radius:12px;padding:10px 16px;color:#f4e3f8;font-size:14px;box-shadow:0 8px 18px #08050d88;transform:translateX(calc((1 - clamp(0,var(--room-p)*1.8,1))*30px))}
.production-deliverables span:nth-child(2){margin-right:38px}.production-deliverables span:nth-child(3){margin-right:12px}
.scale-scene .phase-room{opacity:.36;object-position:35% 50%}
.learning-path{position:absolute;inset:25% 24px 23%;display:flex;align-items:center;justify-content:center;gap:12px;perspective:900px}
.learning-path>span{position:relative;display:block;flex:1;max-width:145px;padding:23px 16px;color:#f6ecfa;background:#251e2bef;border:1px solid #c4a0d6;border-radius:22px;box-shadow:0 15px 24px #09050f99,inset 0 1px #fff4;font:500 clamp(17px,1.6vw,22px)/1.3 Raleway,sans-serif;transform:translateY(calc((.5 - var(--room-p))*-30px)) rotateY(calc((.5 - var(--room-p))*16deg))}
.learning-path small{display:block;font:400 13px/1.3 'Work Sans',sans-serif;color:#d4b3e0;margin-bottom:16px}.learning-path>i{height:1px;flex:0 0 15px;background:#e9c1f1}
.learning-path>span:nth-of-type(2){transform:translateY(calc((.5 - var(--room-p))*30px))}
.cinematic-framework .learning-return{position:absolute;bottom:13%;left:0;right:0;text-align:center;color:#ead5f2;font-size:16px;margin:0;max-width:none}
.cinematic-framework .framework-note{margin-left:0;max-width:90ch;padding-top:28px}
@media(max-width:900px){
 .cinematic-framework .cinema-phase{column-gap:28px;min-height:650px}.signal-channel{padding:10px;font-size:12px;gap:6px}.signal-channel .ripple-symbol{width:20px;height:20px}.strategy-signals{gap:6px;left:12px;right:12px}.scene-insights span{font-size:12px;padding:9px 11px}.learning-path{inset-inline:12px;gap:7px}.learning-path>span{padding:18px 10px;font-size:17px}.learning-path>i{flex-basis:8px}
}
@media(max-width:700px){
 .recording-story.is-fan-ready:not(.is-fan-static){height:375svh}
 .recording-story .interview-core{width:94%;height:90%;max-height:510px;border-radius:26px}
 .studio-environment{object-position:50% 50%}.studio-presenter{height:90%;bottom:-7%;transform:translateX(-50%) scale(calc(.9 + var(--story-approach)*.20))}
 .studio-viewfinder{inset:18px;border-radius:16px}.recording-story .recording-dot{top:30px;left:30px}
 .recording-story .interview-caption{font-size:14px!important;padding:35px 12px 18px!important}
 .recording-story .system-steps{padding-inline:12px;column-gap:30%;font-size:14px;inset:8% 0}
 .cinematic-framework .system-intro{margin-bottom:28px}.cinematic-framework .phase-index{gap:18px;margin-bottom:18px;padding-bottom:10px}
 .cinematic-framework .cinema-phase,.cinematic-framework #phase-production{display:flex;flex-direction:column;min-height:0;gap:32px;padding:28px 0 46px}.cinematic-framework .cinema-phase+.cinema-phase{padding-top:46px}
 .cinematic-framework .phase-scene{width:100%;aspect-ratio:1.1;border-radius:25px;transform:translateY(calc((.5 - var(--room-p))*14px))}.cinematic-framework .phase-copy{width:100%}.cinematic-framework .phase-copy h4{font-size:39px}
 .strategy-signals{top:15px}.signal-channel{font-size:12px;padding:9px 10px}.scene-insights{inset-inline:12px;bottom:16px;gap:6px}.scene-insights span{font-size:12px;padding:8px 11px}
 .learning-path>span{min-width:0;font-size:15px;padding:18px 8px}.learning-path{gap:5px;inset-inline:14px}.learning-path>i{flex-basis:4px}.production-deliverables{bottom:18px;right:16px}.production-deliverables span{padding:9px 12px;font-size:13px}
 .studio-static{aspect-ratio:1.1}.studio-static-person{height:90%;bottom:-8%}.studio-static figcaption{font-size:14px;padding:38px 18px 16px}
}
@media(prefers-reduced-motion:reduce),(max-height:559px){
 .recording-story.is-fan-ready:not(.is-fan-static){height:auto}
 .phase-room,.cinematic-framework .phase-scene,.signal-channel,.signal-channel:nth-child(2),.scene-insights span,.production-recording,.production-deliverables span,.learning-path>span,.learning-path>span:nth-of-type(2){transform:none}
 .studio-capture{display:none}.recording-story .system-gear{transform:none}.studio-static{display:block}
}