/* Editorial revision 2 — individual scenes and readable process stories. */
:root { --muted: #a8b1ad; }
.skip { opacity:0; }
.skip:focus { opacity:1; }
.case-card { isolation:isolate; }
.scene-art { background:#101512; isolation:isolate; }
.scene-art .case-illustration { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transform:scale(1.015); transition:transform .55s cubic-bezier(.2,.65,.2,1),filter .55s; }
.scene-shade { position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg,#060a0b95,transparent 25%,transparent 75%,#060a0bd9); }
.scene-art:before { content:''; position:absolute; inset:12px; z-index:2; border:1px solid #ffffff18; clip-path:polygon(0 0,38px 0,38px 2px,2px 2px,2px 38px,0 38px,0 0,100% 100%,calc(100% - 38px) 100%,calc(100% - 38px) calc(100% - 2px),calc(100% - 2px) calc(100% - 2px),calc(100% - 2px) calc(100% - 38px),100% calc(100% - 38px)); pointer-events:none; }
.scene-art .art-code { top:24px; left:25px; max-width:none; color:#e0e8da; font-size:10px; letter-spacing:.09em; opacity:.9; }
.scene-art .art-caption { bottom:19px; left:25px; font-size:10px; color:#bec9bd; letter-spacing:.08em; }
.scene-art .art-cross { right:22px; bottom:12px; opacity:.85; font-size:28px; }
.case-card:hover .case-illustration { transform:scale(1.045); filter:brightness(1.08); }
.catalog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; }
.catalog-grid .case-info { padding:32px; }
.catalog-grid .case-info h3 { font-size:30px; line-height:1.25; }
.catalog-grid .case-info p { font-size:16px; line-height:1.8; min-height:0; color:#bac3bf; margin-top:19px; }
body .catalog-grid .project-art.scene-art { height:auto; aspect-ratio:16/9; }
.case-meta { font-size:11px; margin-bottom:19px; }
.tags span { font-size:11px; padding:6px 10px; }
.catalog-grid .case-card:nth-child(5n+1) { grid-column:1/-1; display:grid; grid-template-columns:1.25fr 1fr; }
body .catalog-grid .case-card:nth-child(5n+1) .project-art.scene-art { height:100%; min-height:410px; aspect-ratio:auto; }
.catalog-grid .case-card:nth-child(5n+1) .case-info { align-self:center; padding:38px; }
.catalog-grid .case-card:nth-child(5n+1) h3 { font-size:36px; }
.catalog-grid .case-card:nth-child(5n+1) .case-info p { font-size:17px; }
body .selected-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
body .selected-grid .case-card:first-child { display:grid; grid-column:1/-1; grid-row:auto; grid-template-columns:1.2fr 1fr; }
body .selected-grid .case-card:not(:first-child) { display:block; }
body .selected-grid .case-card .project-art.scene-art { height:auto; min-height:0; aspect-ratio:16/9; }
body .selected-grid .case-card:first-child .project-art.scene-art { height:100%; min-height:430px; aspect-ratio:auto; }
body .selected-grid .case-card .case-info { padding:32px; align-self:center; }
body .selected-grid .case-card .case-info h3 { font-size:29px; }
body .selected-grid .case-card:first-child .case-info h3 { font-size:36px; }
body .selected-grid .case-card .case-info p { font-size:16px; line-height:1.8; }
body .selected-grid .case-card .case-meta { font-size:11px; }
body .selected-grid .case-card .tags span { font-size:11px; padding:6px 10px; }
body .selected-grid .case-card .art-code { font-size:10px; max-width:none; }
body .selected-grid .case-card .art-caption { font-size:10px; }
.intro-line p,.section-heading p { font-size:16px; line-height:1.8; }
.filters button { font-size:13px; }
.search { max-width:310px; }
.search input { font-size:13px; }
.catalog-status { font-size:10px; }
.case-hero-grid { grid-template-columns:1fr 1.1fr; gap:48px; align-items:center; }
.case-heading h1 { font-size:clamp(48px,4.7vw,76px); }
.case-heading>p { font-size:18px; line-height:1.85; color:#c3ccc6; max-width:660px; }
.case-heading .eyebrow { font-size:10px; }
.case-heading .text-button { font-size:15px; }
.case-hero-art { overflow:hidden; }
.case-hero-art .project-art.scene-art { height:490px; }
.art-bottom { font-size:10px; line-height:1.6; }
.back-link { font-size:11px; }
.workflow-section { background:radial-gradient(ellipse at 80% 0%,#232d1428,transparent 60%),#0b100e; }
.workflow-section .section-heading { align-items:center; margin-bottom:30px; }
.workflow-section .section-heading h2 { font-size:64px; }
.workflow-section .workflow-intro { max-width:540px; font-size:18px; color:#bdc7bf; margin-top:24px; }
.flow-launch { display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
.launch-hint { color:var(--yellow); font:12px/1.6 var(--mono); letter-spacing:.06em; }
.flow-launch .run-flow { margin:0; min-width:300px; min-height:66px; padding:21px 26px; }
.run-flow .run-label { font:700 17px/1.4 var(--body); }
.run-flow .run-icon { font-size:21px; }
.flow-timing { font-size:12px; color:#b3bdb4; }
.run-flow.awaiting-start { animation:invitePulse 2.4s ease-in-out infinite; }
.run-flow.awaiting-start:after { content:''; position:absolute; inset:0; background:linear-gradient(110deg,transparent 25%,#ffffff80 45%,transparent 65%); transform:translateX(-130%); animation:inviteSweep 3.2s ease-in-out infinite; pointer-events:none; }
@keyframes invitePulse { 0%,100% { filter:drop-shadow(0 0 1px #efff3820) brightness(.92); } 50% { filter:drop-shadow(0 0 19px #efff3880) brightness(1.1); } }
@keyframes inviteSweep { 0%,35% { transform:translateX(-130%); } 75%,100% { transform:translateX(130%); } }
.flow-rail { --flow-progress:0%; margin-top:48px; gap:22px; align-items:stretch; }
.flow-node { display:flex; flex-direction:column; align-items:flex-start; padding:0 0 8px; }
.node-number { font:13px/1.5 var(--mono); letter-spacing:.06em; }
.node-dot { width:44px; height:44px; margin:24px 0 25px; flex-shrink:0; }
.flow-line { top:66px; left:22px; right:22px; }
.flow-line:after,.flow-rail.running .flow-line:after { width:var(--flow-progress); transition:width .7s ease; }
.flow-node strong { font-size:22px; line-height:1.25; margin-bottom:13px; }
.node-detail { font-size:16px; line-height:1.65; color:#b0bcb4; }
.flow-node.completed .node-dot { border-color:#96a943; color:var(--yellow); }
.flow-node:hover strong { color:var(--yellow); }
.flow-readout { position:relative; display:grid; grid-template-columns:100px minmax(0,1fr); gap:34px; margin-top:40px; padding:38px; background:linear-gradient(120deg,#20291690,transparent 50%),#111a14; border:1px solid #4c5b36; font:18px/1.8 var(--body); align-items:start; }
.stage-index { font:500 92px/.95 var(--display); color:transparent; -webkit-text-stroke:1px #98ac55; padding-top:8px; }
.stage-heading { display:flex; align-items:center; justify-content:space-between; gap:25px; margin-bottom:27px; }
.readout-status { font:12px/1.7 var(--mono); color:var(--yellow); letter-spacing:.07em; }
.stage-heading h3 { font:500 36px/1.2 var(--display); margin-top:7px; letter-spacing:-.01em; }
.stage-navigation { display:flex; gap:9px; flex-shrink:0; }
.stage-navigation button { min-width:48px; min-height:48px; background:#1a251a; color:var(--yellow); border:1px solid #68784b; font-size:24px; transition:background .2s; }
.stage-navigation button:hover:not(:disabled) { background:var(--yellow); color:var(--bg); }
.stage-navigation button:disabled { opacity:.3; cursor:default; }
.detail-label { display:block; color:#9faf91; font:12px var(--mono); letter-spacing:.07em; margin-bottom:10px; }
.flow-readout #flow-description { color:#e1e8dd; font:18px/1.85 var(--body); max-width:900px; }
.stage-io { display:grid; grid-template-columns:1fr 1fr; gap:30px; margin:26px 0 0; padding-top:24px; border-top:1px solid #4c5b365e; }
.stage-io dt { font:600 16px/1.5 var(--body); color:var(--yellow); margin-bottom:9px; }
.stage-io dt span { margin-right:7px; }
.stage-io dd { margin:0; font:17px/1.7 var(--body); color:#c0ccbd; }
.flow-footnote { display:flex; justify-content:space-between; gap:30px; margin-top:18px; color:#a7b49f; font-size:13px; line-height:1.7; }
.flow-footnote span:last-child { max-width:330px; text-align:right; color:#7f8d80; }
.case-story .eyebrow { margin-bottom:10px; }
.story-row { grid-template-columns:55px 1fr 1.75fr; gap:35px; padding:43px 0; }
.story-number { font-size:15px; }
.story-row h2 { font-size:38px; line-height:1.15; }
.story-row p { font-size:18px; line-height:1.9; color:#bdc6c1; }
.case-authorship { font-size:14px; line-height:1.8; }
.case-authorship span { font-size:12px; }
.eyebrow { font-size:11px; }
.portrait-duo { gap:40px; }
.portrait-duo article { padding-bottom:0; background:#101613; }
.portrait-duo .profile-top { position:absolute; left:0; right:0; top:0; z-index:3; border:0; font-size:10px; padding:26px; background:linear-gradient(#050a08aa,transparent); }
.profile-visual { aspect-ratio:4/5; position:relative; overflow:hidden; }
.profile-visual img { height:100%; width:100%; object-fit:cover; object-position:50% 20%; transition:transform 1s ease; }
.profile-visual:hover img { transform:scale(1.025); }
.profile-visual-shade { position:absolute; inset:0; background:linear-gradient(0deg,#101613 0%,#10161390 13%,transparent 40%); pointer-events:none; }
.portrait-duo .portrait-caption { top:28%; right:18px; font-size:8px; }
.visual-name { position:absolute; left:32px; bottom:23px; font:600 66px/1 var(--display); letter-spacing:-.02em; }
.visual-name>span { display:block; font:10px/1.8 var(--mono); letter-spacing:.12em; color:var(--yellow); margin-top:12px; }
.portrait-duo .profile-copy { padding:25px 32px 35px; }
.portrait-duo .profile-copy h2 { margin:0; font-size:28px; letter-spacing:0; }
.portrait-duo .profile-copy .profile-role { margin:10px 0 0; font-size:15px; }
.portrait-duo .profile-copy p:not(.profile-role) { margin:20px 0 0; font-size:16px; line-height:1.85; color:#bac5be; }
.portrait-duo .profile-skills { margin:25px 0 0; font-size:11px; gap:20px; }
.portrait-duo .duo-x { top:36%; font-size:100px; }
.collective-note p { font-size:15px; line-height:1.8; }
.approach-line p { font-size:15px; line-height:1.8; }
@media(min-width:1500px) { .case-hero-art .project-art.scene-art { height:550px; } }
@media(max-width:1150px) {
 .case-hero-grid { gap:35px; }
 .case-heading h1 { font-size:56px; }
 .case-heading>p { font-size:17px; }
 .case-hero-art .project-art.scene-art { height:460px; }
 .flow-node strong { font-size:20px; }
 .node-detail { font-size:16px; }
 .flow-rail { gap:18px; }
 .flow-readout { grid-template-columns:75px minmax(0,1fr); gap:26px; padding:32px; }
 .stage-index { font-size:76px; }
 .catalog-grid .case-card:nth-child(5n+1) .case-info { padding:30px; }
 .catalog-grid .case-card:nth-child(5n+1) h3 { font-size:30px; }
 .story-row { grid-template-columns:40px .85fr 1.65fr; gap:25px; }
 .story-row h2 { font-size:34px; }
 .flow-launch .run-flow { min-width:260px; }
 .flow-timing { font-size:11px; }
}
@media(max-width:850px) {
 .catalog-grid .case-card:nth-child(5n+1) { display:block; grid-column:auto; }
 body .catalog-grid .case-card:nth-child(5n+1) .project-art.scene-art { aspect-ratio:16/9; height:auto; min-height:0; }
 .catalog-grid .case-card:nth-child(5n+1) .case-info,.catalog-grid .case-info { padding:26px; }
 .catalog-grid .case-card:nth-child(5n+1) h3,.catalog-grid .case-info h3 { font-size:27px; }
 .catalog-grid .case-card:nth-child(5n+1) .case-info p { font-size:16px; }
 body .selected-grid .case-card:first-child { display:block; grid-column:auto; }
 body .selected-grid .case-card:first-child .project-art.scene-art { height:auto; min-height:0; aspect-ratio:16/9; }
 body .selected-grid .case-card .case-info { padding:26px; }
 body .selected-grid .case-card:first-child .case-info h3 { font-size:29px; }
 body .selected-grid .case-card:last-child { grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; }
 body .selected-grid .case-card:last-child .project-art.scene-art { height:100%; aspect-ratio:auto; }
 .case-hero-grid { grid-template-columns:1fr; }
 .case-heading h1 { font-size:64px; }
 .case-hero-art .project-art.scene-art { height:auto; aspect-ratio:16/9; }
 .case-heading>p { max-width:none; font-size:18px; }
 .workflow-section .section-heading { gap:25px; align-items:flex-start; }
 .workflow-section .section-heading h2 { font-size:54px; }
 .workflow-section .workflow-intro { font-size:16px; }
 .flow-rail { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
 .flow-line { display:none; }
 .flow-node { border:1px solid #384333; padding:20px; background:#121a13; }
 .flow-node.active { border-color:#92a53e; background:#242e16; }
 .node-dot { display:none; }
 .node-number { margin-bottom:15px; }
 .flow-node strong { font-size:22px; }
 .node-detail { font-size:16px; }
 .flow-readout { grid-template-columns:1fr; }
 .stage-index { display:none; }
 .flow-footnote { flex-direction:column; gap:10px; }
 .flow-footnote span:last-child { text-align:left; max-width:none; }
 .story-row { grid-template-columns:35px 1fr; gap:15px 25px; }
 .story-row p { grid-column:2; font-size:18px; }
 .story-row h2 br { display:none; }
 .story-row h2 { font-size:36px; }
 .portrait-duo { gap:25px; }
 .portrait-duo .profile-top { font-size:8px; padding:20px; }
 .visual-name { font-size:46px; left:24px; }
 .visual-name>span { font-size:8px; }
 .portrait-duo .profile-copy { padding:22px 24px 28px; }
 .portrait-duo .profile-copy h2 { font-size:26px; }
 .portrait-duo .profile-copy .profile-role { font-size:13px; }
 .portrait-duo .profile-copy p:not(.profile-role) { font-size:15px; }
}
@media(max-width:600px) {
 .catalog-grid { grid-template-columns:1fr; gap:26px; }
 .catalog-grid .case-card:nth-child(5n+1) .case-info,.catalog-grid .case-info { padding:24px; }
 .catalog-grid .case-card:nth-child(5n+1) h3,.catalog-grid .case-info h3 { font-size:27px; }
 .catalog-grid .case-info p,.catalog-grid .case-card:nth-child(5n+1) .case-info p { font-size:16px; line-height:1.8; }
 .case-meta { font-size:10px; }
 .tags span { font-size:10px; }
 body .selected-grid { grid-template-columns:1fr; gap:25px; }
 body .selected-grid .case-card:last-child { grid-column:auto; display:block; }
 body .selected-grid .case-card .project-art.scene-art,body .selected-grid .case-card:last-child .project-art.scene-art { height:auto; min-height:0; aspect-ratio:16/9; }
 body .selected-grid .case-card .case-info { padding:24px; }
 body .selected-grid .case-card .case-info h3,body .selected-grid .case-card:first-child .case-info h3 { font-size:27px; }
 body .selected-grid .case-card .case-info p { font-size:16px; }
 body .selected-grid .case-card .case-meta { font-size:10px; }
 body .selected-grid .case-card .tags span { font-size:10px; }
 body .selected-grid .case-card .art-code,.scene-art .art-code { font-size:8px; left:18px; top:18px; letter-spacing:.03em; max-width:85%; }
 body .selected-grid .case-card .art-caption,.scene-art .art-caption { font-size:8px; left:18px; bottom:14px; letter-spacing:.04em; }
 .scene-art .art-cross { right:16px; bottom:8px; }
 .intro-line p,.section-heading p { font-size:15px; }
 .filters button { font-size:12px; min-height:44px; padding:10px; }
 .filters { gap:5px; }
 .catalog-status { font-size:8px; }
 .case-heading h1 { font-size:48px; }
 .case-heading>p { font-size:17px; line-height:1.8; }
 .case-heading .eyebrow { font-size:9px; }
 .case-heading .text-button { font-size:14px; }
 .art-bottom { font-size:9px; gap:15px; align-items:center; }
 .art-bottom span:last-child { max-width:145px; text-align:right; }
 .back-link { font-size:10px; }
 .workflow-section .section-heading { display:block; margin-bottom:0; }
 .workflow-section .section-heading h2 { font-size:46px; }
 .workflow-section .workflow-intro { font-size:17px; line-height:1.8; margin-top:22px; }
 .flow-launch { margin-top:27px; width:100%; }
 .flow-launch .run-flow { width:100%; min-width:0; min-height:66px; }
 .run-flow .run-label { font-size:17px; }
 .launch-hint { font-size:10px; }
 .flow-timing { font-size:12px; }
 .flow-rail { display:flex; flex-direction:column; gap:12px; margin-top:32px; }
 .flow-node { display:grid; grid-template-columns:38px minmax(0,1fr); column-gap:15px; padding:18px 15px; text-align:left; }
 .node-number { position:static; width:auto; text-align:left; margin:4px 0 0; grid-row:1/3; grid-column:1; font-size:14px; line-height:1.4; }
 .flow-node.active .node-number { color:var(--yellow); }
 .flow-node strong { grid-column:2; grid-row:1; font-size:22px; margin:0 0 8px; }
 .node-detail { grid-column:2; grid-row:2; font-size:16px; line-height:1.6; }
 .flow-readout { padding:24px 20px; margin-top:25px; gap:0; }
 .stage-heading { gap:15px; align-items:flex-start; margin-bottom:24px; }
 .stage-heading h3 { font-size:31px; overflow-wrap:anywhere; }
 .readout-status { font-size:10px; }
 .stage-navigation { gap:6px; margin-top:4px; }
 .stage-navigation button { min-width:40px; min-height:44px; font-size:22px; }
 .detail-label { font-size:11px; }
 .flow-readout #flow-description { font-size:18px; line-height:1.8; margin-top:0; }
 .stage-io { grid-template-columns:1fr; gap:22px; margin-top:24px; padding-top:22px; }
 .stage-io dt { font-size:16px; }
 .stage-io dd { font-size:17px; }
 .flow-footnote { font-size:12px; }
 .case-story .eyebrow { font-size:9px; }
 .story-row { grid-template-columns:23px 1fr; gap:14px; padding:32px 0; }
 .story-number { font-size:13px; }
 .story-row h2 { font-size:32px; }
 .story-row p { font-size:18px; line-height:1.85; }
 .case-authorship { font-size:13px; }
 .case-authorship span { font-size:11px; }
 .portrait-duo { grid-template-columns:1fr; gap:28px; }
 .portrait-duo .agent-profile { min-height:0; }
 .profile-visual { aspect-ratio:3/4; }
 .portrait-duo .profile-top { font-size:9px; }
 .visual-name { font-size:54px; }
 .portrait-duo .portrait-caption { font-size:7px; right:13px; }
 .portrait-duo .profile-copy h2 { font-size:28px; }
 .portrait-duo .profile-copy .profile-role { font-size:14px; }
 .portrait-duo .profile-copy p:not(.profile-role) { font-size:16px; }
 .portrait-duo .profile-skills { font-size:10px; gap:12px; }
 .collective-note p { font-size:14px; }
 .approach-line p { font-size:14px; }
 .eyebrow { font-size:9px; }
}
@media(prefers-reduced-motion:reduce) { .run-flow.awaiting-start,.run-flow.awaiting-start:after { animation:none!important; } .scene-art .case-illustration,.profile-visual img { transform:none!important; } }
.motion-off .scene-art .case-illustration,.motion-off .profile-visual img { transform:none!important; }
