@font-face{font-family:Syne;src:url('/fonts/Syne-VariableFont_wght.ttf') format('truetype');font-weight:400 800;font-display:swap}
.futurescape{--ink:#211269;--muted:#554d86;--paper:#f3f0fc;--acid:#f5ed41;color:var(--ink);background:var(--paper);font-family:Inter,Arial,sans-serif;line-height:1.6;overflow-x:clip}
.futurescape ::selection{background:var(--acid);color:var(--ink)}
.futurescape main{overflow-x:clip}
.futurescape .case-container{width:min(1280px,calc(100% - 96px))}
.project-header{background:#fff}
.futurescape .project-header .case-header{width:min(1280px,calc(100% - 96px));min-height:88px;color:#000}
.futurescape .case-logo{font:800 16px/1 Syne,Arial,sans-serif;letter-spacing:.12em}
.futurescape .case-nav{gap:28px}
.futurescape .case-nav a{font:700 14px/1.3 Syne,Arial,sans-serif}
.futurescape .case-nav a[aria-current]{text-decoration:underline;text-decoration-color:var(--acid);text-decoration-thickness:3px;text-underline-offset:7px}
.hero-band{background:radial-gradient(ellipse at 74% 16%,#b6f3ff 0,transparent 40%),radial-gradient(ellipse at 17% 70%,#e7c4f6 0,transparent 49%),radial-gradient(ellipse at 82% 86%,#b7a9f2 0,transparent 50%),#e7e1f8;padding:clamp(54px,6vw,88px) 0 58px}
.project-topline{display:flex;justify-content:space-between;gap:20px;margin-bottom:40px;font:600 .78rem/1.4 Inter,Arial,sans-serif;letter-spacing:.09em;text-transform:uppercase}
.project-topline strong{font-weight:800;color:#211269}
.hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(34px,5vw,76px);align-items:center}
.project-meta span,.tools-label,.asset-slot span,.chapter-index span{font-family:'DM Mono',monospace;font-size:.72rem;letter-spacing:.065em;text-transform:uppercase}
.hero h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(3.1rem,5.4vw,5.6rem);font-weight:400;letter-spacing:-.07em;line-height:1.03;margin:0;max-width:850px;text-wrap:balance}
.hero h1 span{font-style:italic}
.hero-lede{font-size:clamp(1.15rem,1.7vw,1.5rem);line-height:1.45;letter-spacing:-.015em;max-width:610px;margin:28px 0 0}
.project-meta{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.65fr);gap:26px;border-top:1px solid var(--ink);padding-top:23px;margin-top:55px}
.project-meta div{min-width:0}.project-meta span{display:block;color:var(--muted);margin-bottom:7px}.project-meta strong{font-size:.97rem;font-weight:600;line-height:1.4;display:block}
.project-tools{padding-top:32px}.tools-label{margin:0 0 16px;color:var(--muted)}
.tool-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 28px}
.tool-grid>div{border-left:2px solid var(--ink);padding-left:15px;min-width:0}
.tool-grid b{display:block;font-size:.84rem;font-weight:600;line-height:1.35}
.tool-grid span{display:block;font-size:.75rem;line-height:1.4;color:var(--muted);margin-top:4px}
.asset-slot{background:#e5ddfa;border:3px solid var(--acid);border-radius:8px;color:var(--ink);display:flex;flex-direction:column;justify-content:space-between;padding:clamp(18px,2vw,30px);min-width:0;position:relative}
.asset-slot::before{content:"";position:absolute;top:-10px;left:24%;width:15px;height:18px;background:url('/img/projects/futurescape/diamond.png') center/contain no-repeat;pointer-events:none;z-index:2}
.hero-slot::before,.detail-slot:first-child::before,.fast-slot::before{left:70%}
.cover-slot:nth-child(2)::before,.final-slot::before{top:auto;bottom:-10px;left:38%}
.cover-slot:nth-child(3)::before,.detail-slot:nth-child(2)::before{top:34%;left:auto;right:-9px}
.evidence-slot:nth-child(2)::before{top:60%;left:-9px}
.asset-slot span{color:#65549b}.asset-slot p{font-size:clamp(.96rem,1.2vw,1.1rem);line-height:1.4;font-weight:500;max-width:27ch;margin:20px 0 0}
.image-slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:4px}
.image-link{cursor:zoom-in;overflow:visible;text-decoration:none}
.image-link:focus-visible{outline:3px solid var(--ink);outline-offset:5px}
.image-link::after{content:"↗ Full size";position:absolute;right:12px;bottom:12px;z-index:2;background:var(--acid);color:var(--ink);padding:6px 9px;border-radius:3px;font:500 .68rem/1.2 'DM Mono',monospace;letter-spacing:.02em;pointer-events:none;opacity:0;transition:opacity .18s}
.image-link:hover::after,.image-link:focus-visible::after{opacity:1}
.hero-slot{aspect-ratio:4/3;background:linear-gradient(145deg,#e9d9f6,#bcd8f7 58%,#ead7f3)}
.chapter{display:grid;grid-template-columns:220px minmax(0,1fr);gap:clamp(30px,4vw,55px);padding-block:clamp(70px,7vw,96px);border-bottom:1px solid #bcb3d3}
.chapter-index{padding-top:0}.chapter-index b{display:block;font:600 3.6rem/1 Syne,Arial,sans-serif;letter-spacing:-.06em;margin-bottom:5px;position:relative;top:-7px}.chapter-index span{display:block;color:var(--muted)}
.chapter-body{min-width:0;max-width:900px}.chapter h2,.outcome h2{font-family:Georgia,'Times New Roman',serif;font-size:clamp(2.1rem,3.3vw,3.55rem);font-weight:400;line-height:1.12;letter-spacing:-.05em;text-wrap:balance;margin:0 0 27px}
.chapter p,.outcome p{font-size:clamp(1rem,1.05vw,1.1rem);line-height:1.72;max-width:70ch;margin:0 0 19px}.chapter p:last-child{margin-bottom:0}
.chapter-body>p,.outcome p{text-align:left;hyphens:none;word-break:normal}
.chapter em{font-family:Georgia,'Times New Roman',serif}
.cover-grid{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(17px,2vw,28px);margin-top:28px}
.cover-slot{aspect-ratio:2/3;background:linear-gradient(145deg,#eee3fa,#d6d3fc 55%,#daf4fa)}
.cover-slot:nth-child(2){background:linear-gradient(145deg,#e1dcfb,#cdf0ed 70%,#e7e0fb)}
.cover-slot:nth-child(3){background:linear-gradient(145deg,#d7e8fa,#efd3f4 65%,#e3d4fc)}
.premise-chapter,.process-chapter,.motion-chapter{position:relative;isolation:isolate}
.premise-chapter::before,.process-chapter::before,.motion-chapter::before{content:"";position:absolute;pointer-events:none;z-index:-1;aspect-ratio:1;background-position:center;background-repeat:no-repeat;background-size:contain;filter:grayscale(1) brightness(.95);opacity:.29}
.premise-chapter::before{background-image:url('/img/projects/futurescape/shape-eight.png');width:330px;right:-95px;top:75px}
.process-chapter::before{background-image:url('/img/projects/futurescape/shape-rings.png');width:360px;left:calc((100% - 100vw)/2 - 100px);top:255px}
.motion-chapter::before{background-image:url('/img/projects/futurescape/shape-weave.png');width:420px;right:calc((100% - 100vw)/2 - 110px);top:30px}
.interlude{background:var(--ink);color:#fff;padding:46px 0 50px;position:relative;overflow:hidden}
.interlude::before{content:"";position:absolute;right:6%;top:50%;transform:translateY(-50%);width:280px;height:46px;background:url('/img/projects/futurescape/diagonal-bars.png') center/contain no-repeat;opacity:.9;pointer-events:none}
.interlude p{font-family:Georgia,'Times New Roman',serif;font-size:clamp(2.15rem,4vw,3.65rem);line-height:1.13;letter-spacing:-.045em;margin:0;max-width:900px}.interlude em{color:var(--acid);font-weight:400}
.detail-grid,.evidence-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:23px;margin-top:42px}
.detail-slot{background:#e6d9f5}.detail-slot:nth-child(2){background:#dceafa}
.detail-figure{margin:0;min-width:0}
.detail-slot,.evidence-slot{padding:0;display:block;align-self:start}
.detail-slot img{position:static;display:block;width:100%;height:auto;border-radius:4px}
.evidence-slot{aspect-ratio:1149/710;background:#e2dcf6}.evidence-slot:nth-child(2){background:#e0eafa}
.evidence-slot img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;border-radius:4px}
.motion-grid{display:grid;grid-template-columns:minmax(0,256fr) minmax(0,81fr);gap:24px;align-items:start;margin-top:38px}
.motion-slot{background:linear-gradient(120deg,#d5d0ed,#e9d4f4 60%,#d7ecf4)}
.video-slot{padding:0;background:var(--ink)}
.video-slot video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:var(--ink);border-radius:4px}
.fast-slot{aspect-ratio:16/9}.final-slot{aspect-ratio:9/16}
.motion-chapter{border-bottom:0}
.outcome{background:var(--ink);color:#fff;padding:clamp(65px,7vw,95px) 0}
.outcome-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:clamp(40px,5vw,80px)}
.outcome h2{max-width:580px}.outcome p{max-width:600px;margin-bottom:0}
.resource-links{display:grid;grid-template-columns:1fr;align-content:start;gap:17px;width:min(100%,340px)}
.resource-links a{display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:84px;background:rgba(255,255,255,.06);color:#fff;border:1px solid rgba(255,255,255,.72);text-decoration:none;font-size:.91rem;font-weight:600;padding:18px 20px;transition:background .2s,color .2s,border-color .2s}
.resource-links a:hover,.resource-links a:focus-visible{background:var(--acid);color:var(--ink);border-color:var(--acid)}.resource-links a span{font-size:1.3rem;color:var(--acid)}.resource-links a:hover span,.resource-links a:focus-visible span{color:var(--ink)}
.futurescape .case-footer{color:var(--ink);border:0}
@media(max-width:950px){.futurescape .case-container,.futurescape .project-header .case-header{width:calc(100% - 48px)}.futurescape .case-nav{gap:17px}.futurescape .case-nav a{font-size:12px}.hero{gap:32px}.chapter{grid-template-columns:150px minmax(0,1fr);gap:28px}.outcome-grid{gap:30px}.resource-links{grid-template-columns:1fr}}
@media(max-width:650px){.futurescape .case-container,.futurescape .project-header .case-header{width:calc(100% - 36px)}.futurescape .project-header .case-header{min-height:74px;flex-wrap:wrap;gap:18px;padding-block:18px}.futurescape .case-nav{width:100%;justify-content:space-between;gap:8px}.futurescape .case-nav a{font-size:11px}.hero-band{padding:45px 0 52px}.project-topline{font-size:.68rem;gap:15px;margin-bottom:30px}.hero{grid-template-columns:1fr;gap:32px}.hero h1{font-size:clamp(3rem,10vw,4.5rem)}.hero-slot{aspect-ratio:4/3}.project-meta{grid-template-columns:1fr;gap:20px;margin-top:40px}.tool-grid{grid-template-columns:1fr 1fr;gap:18px}.chapter{display:block;padding-block:58px}.chapter-index{display:flex;align-items:center;gap:17px;margin-bottom:27px}.chapter-index b{font-size:2.2rem;margin:0;top:0}.cover-grid{grid-template-columns:1fr;gap:20px;margin-top:35px}.cover-slot{aspect-ratio:2/3}.detail-grid,.evidence-grid{grid-template-columns:1fr;gap:21px}.premise-chapter::before,.process-chapter::before,.motion-chapter::before,.interlude::before{display:none}.motion-grid{grid-template-columns:1fr}.final-slot{width:min(60%,250px);margin-inline:auto}.outcome-grid{grid-template-columns:1fr}.resource-links{grid-template-columns:1fr}}