/* A physical workspace: a sculpted brand mark, an idea, then an application. */
main { overflow:clip; }
.hero { max-width:var(--page-width); grid-template-columns:1fr 1.12fr; gap:24px; padding:62px var(--page-gutter) 84px; isolation:isolate; }
.hero h1 { font-size:clamp(48px,5.15vw,74px); line-height:1.08; letter-spacing:-.047em; }
.hero-copy { position:relative; z-index:3; }
.hero .lede { max-width:465px; }
.hero-visual { --scene-duration:900ms; position:relative; min-width:0; padding:0; background:none; border-radius:0; }
.scene-topline { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-inline:12px; }
.scene-eyebrow { display:flex; align-items:center; gap:9px; font-size:10px; text-transform:uppercase; letter-spacing:.11em; color:#797180; }
.scene-eyebrow>span { width:5px; height:5px; border-radius:50%; background:var(--purple); box-shadow:0 0 0 5px #6841c60a; }
.motion-toggle { display:inline-flex; align-items:center; gap:6px; border:0; border-radius:8px; padding:8px; color:#746c7a; background:transparent; font:11px var(--sans); cursor:pointer; }
.motion-toggle:hover { background:#ede7f2; color:var(--ink); }
.motion-toggle:focus-visible,.scene-view button:focus-visible { outline:3px solid var(--purple); outline-offset:4px; }
.motion-toggle:disabled { cursor:default; opacity:.7; }
.scene-stage { position:relative; height:570px; perspective:1300px; }
.scene-grid { position:absolute; inset:10% -4% 0; background-image:linear-gradient(#97889417 1px,transparent 1px),linear-gradient(90deg,#97889417 1px,transparent 1px); background-size:44px 44px; transform:perspective(600px) rotateX(64deg) rotateZ(-23deg) scale(1.15); mask-image:radial-gradient(ellipse,#0008,transparent 66%); pointer-events:none; }
.scene-orbit { position:absolute; left:7%; top:4%; width:84%; aspect-ratio:1; border:1px solid #b49eca25; border-radius:50%; transform:rotateX(34deg) rotateZ(-30deg); pointer-events:none; }
.scene-orbit::before { content:""; position:absolute; inset:24px; border:1px solid #b49eca14; border-radius:50%; }
.hero-sculpture { position:absolute; top:-85px; left:-80px; width:calc(100% + 130px); height:570px; pointer-events:none; transition:transform var(--scene-duration) cubic-bezier(.22,1,.36,1),opacity var(--scene-duration); }
.hero-sculpture canvas { position:absolute; inset:0; display:block; width:100%; height:100%; opacity:0; transition:opacity 900ms; }
.sculpture-fallback { position:absolute; width:70%; height:80%; object-fit:contain; left:15%; top:10%; filter:drop-shadow(16px 28px 15px #513a7030); transform:perspective(900px) rotateY(-25deg) rotateX(12deg); transition:opacity 600ms; }
.hero-sculpture.is-ready canvas { opacity:1; }
.hero-sculpture.is-ready .sculpture-fallback { opacity:0; }
.scene-note { position:absolute; top:138px; left:-5px; width:209px; padding:21px; border:1px solid #e2d4c5; background:#fff2d9; border-radius:3px 16px 16px 16px; box-shadow:1px 2px 0 #e5d2b8,3px 5px 0 #efe0c9,8px 20px 30px #60462b13; transform:rotate(-11deg) translateZ(20px); transition:transform var(--scene-duration) cubic-bezier(.22,1,.36,1),opacity var(--scene-duration); z-index:2; }
.scene-note-top { display:flex; justify-content:space-between; font-size:8px; letter-spacing:.035em; text-transform:uppercase; color:#907753; }
.scene-note strong { display:block; font:400 23px/1.23 var(--serif); letter-spacing:-.045em; margin-top:16px; color:#6a4938; }
.scene-note-line { display:block; width:76%; height:7px; margin-top:8px; border-top:2px solid #cca767; border-radius:50%; transform:rotate(-3deg); }
.scene-note p { font-size:10px; line-height:1.7; margin-top:12px; color:#8b745e; }
.scene-note-tag { display:block; width:fit-content; padding:4px 7px; background:#f1dfbc; border-radius:4px; color:#856748; font-size:8px; margin-top:14px; }
.hero-visual .project-window { position:absolute; top:230px; right:-3px; width:420px; margin:0; border:1px solid #ded5e8; box-shadow:0 3px 0 #e8e0ee,0 6px 0 #d6c9e1,0 35px 70px #5b42622b; transform:perspective(1000px) rotateX(8deg) rotateY(-15deg) rotateZ(4deg); transform-origin:center center; transition:transform var(--scene-duration) cubic-bezier(.22,1,.36,1),opacity var(--scene-duration),filter var(--scene-duration); z-index:4; }
.hero-visual .project-content { padding:17px 20px 10px; }
.hero-visual .project-heading { margin-top:18px; }
.hero-visual .project-heading h2 { font-size:24px; line-height:1.3; }
.hero-visual .project-tabs { margin-top:14px; }
.hero-visual .table-row { padding-block:10px; }
.hero-visual .window-bar { height:31px; }
.hero-visual .project-window figcaption { font-size:9px; padding:3px 20px 10px; }
.hero-visual .project-note { padding:9px; }
.hero-visual .table-row:last-child,.hero-visual .project-note,.hero-visual .project-window figcaption { display:none; }
.scene-published { display:flex; align-items:center; gap:10px; position:absolute; right:-7px; top:203px; padding:10px 17px 10px 10px; border:1px solid #ede5f3; border-radius:12px; background:#fffdfa; box-shadow:0 12px 26px #4b325b14; z-index:5; transform:rotate(5deg); transition:transform var(--scene-duration),opacity var(--scene-duration); animation:scene-float 6s ease-in-out 1s infinite; }
.scene-published>span { display:grid; place-items:center; height:33px; width:33px; background:#6841c6; color:white; font-size:23px; border-radius:8px; }
.scene-published b { display:block; font-size:11px; font-weight:500; }
.scene-published small { display:block; font-size:9px; color:var(--muted); }
.hero-visual .coach-note { position:absolute; left:-6px; bottom:17px; width:244px; margin:0; padding:11px 13px; z-index:6; transform:rotate(-3deg); background:#fffdf9f5; backdrop-filter:blur(12px); }
.hero-visual .coach-note b { font-size:10px; }
.hero-visual .coach-note span { font-size:9px; }
.hero-visual .coach-avatar { height:36px; width:36px; }
.scene-bottom { position:relative; z-index:7; padding-top:22px; }
.scene-view { display:flex; justify-content:center; gap:3px; width:fit-content; max-width:100%; margin:auto; padding:5px; background:#f1edf4; border:1px solid #e7e0ec; border-radius:11px; }
.scene-view button { display:flex; align-items:center; gap:7px; font:12px var(--sans); padding:11px 13px; border:0; border-radius:7px; background:transparent; color:#897e90; white-space:nowrap; cursor:pointer; transition:background 200ms,color 200ms,box-shadow 200ms; }
.scene-view button span { font-size:9px; opacity:.6; }
.scene-view button[aria-pressed="true"] { background:#fffdfb; color:var(--purple); box-shadow:0 2px 5px #4b325b12; }
.scene-view button:hover { color:var(--purple); }
.scene-provenance { text-align:center; color:#877d8b; font-size:10px; margin-top:13px; }
.scene-modules { position:absolute; inset:70px 30px 0; opacity:0; transform:translateY(45px) scale(.8); transition:transform var(--scene-duration) cubic-bezier(.22,1,.36,1),opacity var(--scene-duration); pointer-events:none; z-index:5; }
.scene-module { position:absolute; width:170px; height:195px; padding:19px; border:1px solid #dfd3ec; border-radius:14px; background:#fefbfff5; box-shadow:3px 5px 0 #e1d8e9,7px 10px 0 #d5c7e1,20px 40px 45px #4a2f631f; transform:perspective(900px) rotateY(-23deg) rotateX(15deg); }
.scene-module:nth-child(1) { left:0; top:36px; }
.scene-module:nth-child(2) { left:30%; top:106px; }
.scene-module:nth-child(3) { left:60%; top:176px; }
.module-symbol { display:grid; place-items:center; width:39px; height:39px; border:1px solid #e0d5ee; color:var(--purple); border-radius:10px; background:#eee6f7; font-size:25px; margin-bottom:13px; }
.scene-module strong { font:400 20px var(--serif); }
.scene-module i { display:block; width:90%; height:6px; border-radius:3px; background:#e9e3ef; margin-top:13px; }
.scene-module i+i { width:60%; margin-top:8px; }
.module-count { position:absolute; top:18px; right:17px; font-size:9px; color:#b2a1be; }
.hero-visual[data-scene="vision"] .hero-sculpture { transform:translate(110px,-28px) scale(.83); opacity:.7; }
.hero-visual[data-scene="vision"] .scene-note { transform:translate(145px,62px) rotate(-7deg) scale(1.38); z-index:6; }
.hero-visual[data-scene="vision"] .project-window { transform:translate(80px,38px) rotateY(-23deg) rotateZ(8deg) scale(.72); opacity:.16; filter:blur(1px); }
.hero-visual[data-scene="vision"] .scene-published { opacity:0; transform:translateY(20px); animation:none; }
.hero-visual[data-scene="structure"] .hero-sculpture { transform:translate(25px,-100px) scale(.8); opacity:.35; }
.hero-visual[data-scene="structure"] .scene-note { transform:translate(-55px,-38px) rotate(-18deg) scale(.7); opacity:.18; }
.hero-visual[data-scene="structure"] .project-window { transform:translate(90px,70px) rotateY(-23deg) rotateZ(8deg) scale(.62); opacity:.12; filter:blur(1px); }
.hero-visual[data-scene="structure"] .scene-modules { transform:translateY(0) scale(1); opacity:1; }
.hero-visual[data-scene="structure"] .scene-published { opacity:0; animation:none; }

/* Deeper, tactile programme illustrations. */
.path-section { position:relative; background:#eee9f1; padding-block:90px 66px; }
.path-card { background:#fffdf9; border-color:#ded4e5; box-shadow:0 8px 25px #49295806; transform:perspective(1100px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)); transition:transform 450ms cubic-bezier(.2,.8,.2,1),box-shadow 450ms,border-color 450ms; }
.path-card:hover { border-color:#bb9ed8; box-shadow:0 24px 50px #49295812; }
.path-art { position:relative; height:175px; margin:-30px -26px 26px; border-radius:15px 15px 0 0; overflow:hidden; isolation:isolate; background:#ede7f3; }
.path-art::after { content:""; position:absolute; inset:0; background:radial-gradient(circle at var(--pointer-x,50%) var(--pointer-y,50%),#ffffff70,transparent 55%); z-index:4; pointer-events:none; mix-blend-mode:soft-light; }
.path-number { top:187px; z-index:2; font-size:23px; }
.art-ground { position:absolute; width:170px; height:70px; background:#563a7130; filter:blur(20px); border-radius:50%; left:calc(50% - 85px); bottom:10px; }
.art-mastery { background:#f0e8db; }
.art-builder { background:#e8e0f1; }
.art-agent { background:#e9e5ed; }
.art-paper { position:absolute; left:calc(50% - 62px); top:22px; width:130px; height:145px; border:1px solid #e0d0b6; border-radius:7px; background:#fffaf0; transform:perspective(650px) rotateX(22deg) rotateY(-22deg) rotateZ(15deg); box-shadow:2px 3px 0 #e2d2b7,5px 6px 0 #ecdec5,14px 20px 18px #7c644423; }
.paper-back { transform:perspective(650px) translate(-18px,-7px) rotateX(22deg) rotateY(-22deg) rotateZ(-8deg); background:#eadabc; }
.paper-front { padding:17px 13px; animation:paper-float 7s ease-in-out infinite; }
.paper-front>span { display:block; font-size:8px; font-weight:500; color:#8e7658; }
.paper-front i { display:block; margin-top:10px; width:94%; height:4px; background:#ddd1ba; border-radius:2px; }
.paper-front i+i { width:73%; margin-top:7px; }
.paper-front i+i+i { width:87%; }
.paper-front b { display:block; margin-top:7px; color:#7043bd; font:400 32px var(--serif); }
.art-check { position:absolute; left:calc(50% + 35px); top:84px; width:49px; height:49px; display:grid; place-items:center; font-size:25px; background:#6841c6; color:#fff; border-radius:12px; transform:rotate(-11deg); box-shadow:2px 3px 0 #462584,7px 12px 15px #613e5620; }
.art-browser { position:absolute; top:38px; left:calc(50% - 85px); width:174px; height:118px; border:1px solid #cab9dc; border-radius:9px; background:#fffcff; transform:perspective(650px) rotateX(23deg) rotateY(-22deg) rotateZ(-8deg); box-shadow:2px 4px 0 #d3c2e5,5px 8px 0 #cab5df,15px 22px 25px #63478028; }
.browser-back { background:#9973c6; transform:perspective(650px) translate(18px,-14px) rotateX(23deg) rotateY(-22deg) rotateZ(-8deg); }
.browser-front { animation:browser-float 7s ease-in-out 1s infinite; }
.art-browser-bar { display:block; height:19px; padding:3px 9px; border-bottom:1px solid #e6ddef; font-size:7px; letter-spacing:2px; color:#bcabcb; }
.art-browser-content { padding:13px 12px; display:grid; gap:7px; grid-template-columns:40px 1fr; }
.art-browser-content b { grid-row:span 3; display:block; border-radius:4px; background:#7147b9; }
.art-browser-content i { display:block; height:13px; background:#eee7f5; border-radius:3px; }
.art-block { position:absolute; left:calc(50% + 49px); top:94px; width:46px; height:46px; display:grid; place-items:center; background:#6b3cbd; color:#fff; border-radius:10px; font-size:29px; transform:perspective(500px) rotateY(-25deg) rotateZ(-7deg); box-shadow:3px 3px 0 #4e238e,10px 17px 15px #59347925; }
.agent-illustration { position:absolute; width:306px; height:160px; left:50%; top:50%; transform:translate(-50%,-50%); }
.agent-console { position:absolute; width:209px; left:57px; top:19px; padding:13px 12px 11px; border:1px solid #d4c9df; border-radius:11px; background:linear-gradient(135deg,#fffefc,#f6f2f9); box-shadow:1px 2px 0 #eee7f4,2px 4px 0 #d9cce5,4px 7px 0 #c4b4d5,12px 20px 24px #59466a24; transform:perspective(650px) rotateX(12deg) rotateY(-15deg) rotateZ(-6deg); }
.agent-console-head { display:flex; align-items:center; gap:7px; margin-bottom:9px; padding-bottom:9px; border-bottom:1px solid #e6deed; }
.agent-console-symbol { display:grid; place-items:center; width:27px; height:27px; flex-shrink:0; border-radius:8px; background:#72508c; color:#fff7e9; box-shadow:inset 0 1px 1px #ffffff45,0 2px 4px #66448020; }
.agent-console-head strong { font:400 14px/1.1 var(--serif); letter-spacing:-.02em; color:#42334f; white-space:nowrap; }
.agent-live { margin-left:auto; font:500 6px/1 var(--sans); padding:4px 5px; border:1px solid #e2d5ed; border-radius:4px; background:#eee5f5; color:#8e6aaa; white-space:nowrap; }
.agent-task { display:flex; align-items:center; gap:7px; min-height:23px; padding:4px 3px; color:#74687e; font:400 8px/1.2 var(--sans); }
.agent-task small { margin-left:auto; color:#beb1c7; font-size:6px; }
.agent-task-check { display:grid; place-items:center; width:13px; height:13px; flex-shrink:0; border-radius:50%; color:#6d8061; background:#e9eee4; font-size:8px; }
.agent-task-active { color:#593d73; background:#eee6f5; border-radius:5px; }
.agent-task-active .agent-task-check { color:#8964a6; background:#e3d5ee; }
.agent-task-review { color:#b2a6bd; }
.agent-task-ring { width:11px; height:11px; margin-inline:1px; border:1px solid #d2c6dc; border-radius:50%; }
.agent-working { display:flex; gap:2px; margin-left:auto; padding-right:3px; }
.agent-working i { height:3px; width:3px; background:#956db3; border-radius:50%; animation:agent-thinking 1.8s ease-in-out infinite; }
.agent-working i:nth-child(2) { animation-delay:150ms; }
.agent-working i:nth-child(3) { animation-delay:300ms; }
.agent-envelope { position:absolute; top:24px; left:17px; z-index:3; width:52px; height:46px; display:grid; place-items:center; border:1px solid #9476ab; border-radius:11px; color:#fbf4ff; background:linear-gradient(135deg,#9675b2,#694783); transform:perspective(500px) rotateY(-12deg) rotateZ(-15deg); box-shadow:2px 3px 0 #573869,5px 7px 0 #e3d6ed,10px 15px 17px #59436a22; animation:agent-request 6s ease-in-out infinite; }
.agent-envelope-dot { position:absolute; width:9px; height:9px; right:-3px; top:-3px; border-radius:50%; background:#f1d6a6; border:2px solid #faf5fc; }
.agent-response { position:absolute; bottom:4px; right:0; z-index:4; display:flex; gap:7px; align-items:center; padding:9px 12px 9px 8px; border:1px solid #ded4e6; border-radius:9px; color:#594366; background:#fffcf7; font:500 9px/1.2 var(--sans); box-shadow:1px 2px 0 #e0d5e8,5px 9px 15px #5d426d1a; transform:rotate(5deg); animation:agent-response-lift 6s ease-in-out infinite; }
.agent-response-icon { width:24px; height:24px; display:grid; place-items:center; border:1px solid #dce2d3; background:#edf0e6; border-radius:7px; color:#829267; }
.agent-response small { display:block; font-size:6px; font-weight:400; color:#a295ad; margin-top:3px; }
@keyframes agent-thinking { 0%,65%,100% { opacity:.35; } 30% { opacity:1; } }
@keyframes agent-request { 0%,100% { translate:0 0; } 40% { translate:3px -4px; } }
@keyframes agent-response-lift { 0%,20%,100% { translate:0 0; } 55%,75% { translate:0 -4px; } }
@media(max-width:360px) { .agent-illustration { transform:translate(-50%,-50%) scale(.88); } }

/* Depth continues into the real work and the portrait. */
.work-image { position:relative; transform:perspective(1300px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)); transition:transform 500ms,box-shadow 500ms; box-shadow:0 15px 40px #3426380a; }
.work-image img { transition:transform 700ms cubic-bezier(.22,1,.36,1),box-shadow 600ms; }
.work:hover .work-image img { transform:translateY(-6px) scale(1.02); box-shadow:0 18px 32px #28232a20; }
.mentor-visual { box-shadow:0 22px 55px #25232a20; transform:rotate(-2deg); }
.mentor-visual>img { transition:transform 900ms cubic-bezier(.22,1,.36,1); }
.mentor-visual:hover>img { transform:scale(1.025); }
.closing { position:relative; isolation:isolate; overflow:hidden; background:#e8def2; }
.closing::before { content:"õ"; position:absolute; font:400 480px/1 var(--serif); color:#8057aa0e; right:-65px; top:-130px; transform:rotate(-20deg); z-index:-1; pointer-events:none; }
.closing .button { box-shadow:0 8px 22px #6841c620; }
.button { transition:transform 250ms,background 250ms,box-shadow 250ms; }
.button:hover { transform:translateY(-3px); box-shadow:0 8px 22px #6841c624; }
.button:active { transform:translateY(0); }

/* Content is visible by default; the enhancement only takes over after JS starts. */
.exp-ready [data-reveal] { transition:opacity 850ms cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0ms),transform 850ms cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0ms),box-shadow 450ms,border-color 450ms; }
.exp-ready [data-reveal]:not(.is-revealed) { opacity:0; transform:translate3d(0,38px,0); }
.exp-ready [data-reveal]:focus-within { opacity:1; transition:none; }
/* Keep the main title and actions readable from the first paint. Motion stays
   on the illustration and the sections revealed further down the page. */
.exp-ready .hero-copy>* { opacity:1; transform:none; animation:none; }
.exp-ready .scene-stage { animation:scene-arrive 1300ms cubic-bezier(.2,.75,.2,1) both; }
@keyframes scene-arrive { from { opacity:0; transform:translateY(24px) scale(.95); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes scene-float { 0%,100% { translate:0 0; } 50% { translate:0 -8px; } }
@keyframes paper-float { 0%,100% { translate:0 0; } 50% { translate:0 -7px; } }
@keyframes browser-float { 0%,100% { translate:0 0; } 50% { translate:0 -6px; } }
[data-motion="paused"] main *,[data-motion="paused"] main *::before,[data-motion="paused"] main *::after { animation-play-state:paused!important; }
[data-motion="paused"] .hero-copy>*,[data-motion="paused"] .scene-stage { animation:none!important; opacity:1; }
[data-motion="paused"] [data-reveal] { opacity:1!important; transition:none!important; }
[data-motion="paused"] .path-card,[data-motion="paused"] .work-image { transform:none; }
[data-motion="paused"] .scene-stage * { transition:none!important; }

@media(min-width:1400px) { .hero-secondary { display:inline-flex; margin-left:17px; margin-top:0; } }
@media(max-width:1160px) {
  .hero { padding-inline:var(--page-gutter); gap:12px; grid-template-columns:1fr 1fr; }
  .hero h1 { font-size:clamp(45px,5.2vw,62px); }
  .scene-stage { height:535px; }
  .hero-sculpture { width:calc(100% + 160px); left:-94px; top:-40px; height:500px; }
  .scene-note { width:174px; padding:17px; top:133px; left:-12px; }
  .scene-note strong { font-size:20px; }
  .hero-visual .project-window { width:345px; right:-20px; top:235px; }
  .hero-visual .project-heading h2 { font-size:21px; }
  .hero-visual .project-content { padding-inline:16px; }
  .hero-visual .coach-note { bottom:0; left:0; width:215px; }
  .scene-published { right:-18px; top:206px; }
  .scene-topline { padding:0; }
  .scene-eyebrow { font-size:9px; letter-spacing:.07em; }
  .motion-toggle { font-size:10px; }
  .scene-view button { gap:5px; padding:10px; font-size:11px; }
  .scene-modules { inset:80px 0 0; }
  .scene-module { width:140px; height:180px; padding:15px; }
  .scene-module strong { font-size:18px; }
  .hero-visual[data-scene="vision"] .scene-note { transform:translate(90px,85px) rotate(-7deg) scale(1.35); }
}
@media(max-width:1000px) {
  .path-art { margin:-28px -28px 26px; height:190px; }
  .path-number { top:206px; }
  .art-paper { top:30px; }
  .art-browser { top:46px; }
}
@media(max-width:900px) {
  .hero { grid-template-columns:1fr; max-width:var(--page-width); padding:48px var(--page-gutter) 62px; gap:45px; }
  .hero h1 { font-size:clamp(48px,8.1vw,66px); max-width:630px; }
  .hero .lede { max-width:540px; }
  .hero-secondary { display:inline-flex; margin:0 0 0 18px; }
  .hero-copy .reassurance { justify-content:flex-start; font-size:12px; }
  .hero-visual { width:100%; max-width:620px; margin:0 auto; }
  .scene-stage { height:565px; }
  .hero-sculpture { left:-50px; top:-70px; width:calc(100% + 90px); height:570px; }
  .hero-visual .project-window { width:420px; right:0; top:233px; }
  .scene-note { width:200px; left:8px; top:145px; }
  .scene-note strong { font-size:24px; }
  .scene-published { top:206px; right:0; }
  .hero-visual .coach-note { width:240px; bottom:5px; }
  .scene-topline { padding:0 8px; }
  .scene-modules { inset:70px 25px 0; }
  .scene-module { width:170px; height:195px; padding:19px; }
  .scene-module strong { font-size:20px; }
  .hero-visual[data-scene="vision"] .scene-note { transform:translate(110px,80px) rotate(-7deg) scale(1.3); }
}
@media(max-width:650px) {
  .hero { padding:36px var(--page-gutter) 50px; gap:36px; }
  .hero h1 { font-size:clamp(40px,10.8vw,62px); }
  .hero-secondary { display:flex; width:fit-content; margin:14px auto 0; }
  .hero-copy .reassurance { justify-content:center; font-size:10px; }
  .hero-visual { min-width:0; }
  .scene-topline { gap:6px; padding:0; }
  .scene-eyebrow { font-size:8px; letter-spacing:.05em; gap:7px; }
  .motion-toggle { font-size:9px; gap:4px; padding:7px 0; }
  .scene-stage { height:440px; }
  .hero-sculpture { top:-32px; left:-52px; width:calc(100% + 90px); height:400px; }
  .scene-note { width:150px; padding:13px; top:126px; left:-9px; border-radius:3px 10px 10px 10px; }
  .scene-note-top { font-size:6px; }
  .scene-note strong { font-size:18px; margin-top:11px; }
  .scene-note p { font-size:8px; margin-top:6px; }
  .scene-note-tag { font-size:7px; margin-top:8px; }
  .hero-visual .project-window { width:290px; top:194px; right:-8px; transform:perspective(1000px) rotateX(8deg) rotateY(-15deg) rotateZ(4deg) scale(.95); transform-origin:top right; }
  .hero-visual .project-content { padding:11px 12px 7px; }
  .hero-visual .project-top { font-size:8px; }
  .hero-visual .project-mark { height:18px; width:18px; font-size:13px; }
  .hero-visual .project-avatar { width:19px; height:19px; font-size:7px; }
  .hero-visual .project-heading { margin-top:12px; }
  .hero-visual .project-heading h2 { font-size:17px; }
  .hero-visual .project-heading p { font-size:7px; }
  .hero-visual .project-plus { width:21px; height:21px; font-size:16px; }
  .hero-visual .project-tabs { font-size:7px; gap:14px; margin-top:10px; }
  .hero-visual .table-head { font-size:7px; padding:5px 0; }
  .hero-visual .table-row { font-size:8px; padding-block:7px; }
  .hero-visual .client-symbol { width:18px; height:20px; font-size:7px; }
  .hero-visual .status { font-size:6px; padding:2px 5px; }
  .hero-visual .project-note { font-size:7px; padding:6px; gap:5px; }
  .hero-visual .project-window figcaption { display:none; }
  .hero-visual .window-bar { height:25px; font-size:7px; }
  .hero-visual .demo-label { font-size:7px; }
  .scene-published { top:170px; padding:7px 10px 7px 7px; gap:6px; right:0; border-radius:8px; }
  .scene-published>span { width:24px; height:24px; font-size:18px; border-radius:6px; }
  .scene-published b { font-size:9px; }
  .scene-published small { font-size:7px; }
  .hero-visual .coach-note { width:197px; bottom:-1px; left:-2px; padding:9px; gap:8px; border-radius:9px; }
  .hero-visual .coach-note b { font-size:9px; }
  .hero-visual .coach-note span { font-size:8px; }
  .hero-visual .coach-avatar { width:30px; height:30px; }
  .scene-bottom { padding-top:28px; }
  .scene-view { padding:4px; gap:1px; width:100%; }
  .scene-view button { flex:1; justify-content:center; padding:10px 7px; gap:5px; font-size:10px; }
  .scene-view button span { font-size:8px; }
  .scene-provenance { font-size:9px; line-height:1.5; }
  .scene-modules { inset:90px 0 0; }
  .scene-module { width:117px; height:155px; padding:12px; border-radius:10px; }
  .scene-module:nth-child(1) { left:0; top:16px; }
  .scene-module:nth-child(2) { left:30%; top:68px; }
  .scene-module:nth-child(3) { left:60%; top:120px; }
  .scene-module strong { font-size:15px; }
  .module-symbol { height:30px; width:30px; font-size:21px; margin-bottom:10px; }
  .module-count { font-size:7px; right:10px; top:12px; }
  .scene-module i { margin-top:10px; height:5px; }
  .hero-visual[data-scene="vision"] .scene-note { transform:translate(67px,30px) rotate(-7deg) scale(1.35); }
  .hero-visual[data-scene="vision"] .hero-sculpture { transform:translate(65px,-40px) scale(.85); }
  .hero-visual[data-scene="structure"] .hero-sculpture { transform:translate(20px,-50px) scale(.85); }
  .path-section { padding-block:58px 45px; }
  .path-art { margin:-26px -24px 24px; height:170px; }
  .path-number { top:185px; }
  .art-paper { top:18px; }
  .art-browser { top:33px; }
  .mentor-visual { transform:rotate(-1deg); }
}
@media(prefers-reduced-motion:reduce) {
  main *,main *::before,main *::after { animation:none!important; transition:none!important; }
  .exp-ready [data-reveal],.exp-ready .hero-copy>* { opacity:1!important; transform:none!important; }
  .path-card,.work-image { transform:none!important; }
  .work:hover .work-image img,.mentor-visual:hover>img,.button:hover { transform:none!important; }
}