@font-face{font-family:Studio Display;src:url('/assets/type/kufam-900-latin.woff2') format('woff2');font-weight:900;font-display:swap}
@font-face{font-family:Systems Display;src:url('/assets/type/doto-800-latin.woff2') format('woff2');font-weight:800;font-display:swap}
.archive-main{width:min(calc(100% - 2 * clamp(18px,5vw,76px)),1220px);margin-inline:auto;color:#f0ede9;line-height:1.55}
.archive-main h1,.archive-main h2,.archive-main h3,.archive-main p,.archive-main figure{margin:0}
.archive-main h1,.archive-main h2,.archive-main h3{line-height:1.06;font-weight:500;text-wrap:balance;letter-spacing:-.046em}
.archive-main p{color:#c0c8d5}
.archive-main a{color:inherit;text-underline-offset:.24em}
.archive-skip{position:absolute;left:.5rem;top:.5rem;transform:translateY(-200%);z-index:200}
.archive-skip:focus{transform:none;background:#fff;color:#141a25;padding:1em}
.archive-intro,.case-intro{padding:clamp(45px,8vw,110px) 0 clamp(36px,5vw,72px)}
.archive-intro{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(170px,.8fr);align-items:center;gap:clamp(30px,6vw,100px)}
.archive-main .archive-kicker{color:#b5c3d2;letter-spacing:.16em;font-size:.72rem;text-transform:uppercase;font-weight:600}
.archive-intro h1,.case-title h1{margin:.24em 0;font-size:clamp(3rem,8vw,7.6rem);overflow-wrap:break-word}
.intro-studio h1{font:900 clamp(2.8rem,6.3vw,6.1rem)/1 'Studio Display',sans-serif;text-transform:uppercase;letter-spacing:-.075em}
.intro-systems h1{font:800 clamp(3.8rem,9vw,9rem)/.94 'Systems Display',monospace;text-transform:uppercase;letter-spacing:-.06em}
.archive-intro p:not(.archive-kicker),.case-title>p{max-width:47ch;font-size:clamp(1.05rem,1.6vw,1.4rem)}
.archive-intro .glass-link{display:inline-flex;margin-top:1.3rem}
.studio-emblem{display:grid;place-items:center;aspect-ratio:1.65;position:relative;isolation:isolate;background:radial-gradient(ellipse at center,#b0bfda29,transparent 66%)}
.studio-emblem img{width:75%;height:auto;opacity:.94}
.archive-body,.system-collection,.case-reading{border-top:1px solid #b5c7e139}
.archive-heading{display:flex;justify-content:space-between;align-items:baseline;gap:1.5rem;flex-wrap:wrap;margin:2.6rem 0 1.8rem}
.archive-heading h2,.archive-end h2,.case-reading h2{font-size:clamp(2rem,4vw,3.5rem)}
.archive-heading p{max-width:34ch}
.work-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,5vw,68px) clamp(20px,3vw,40px)}
.work-plate,.case-plate{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;isolation:isolate;border-radius:clamp(16px,2.2vw,30px);box-shadow:inset 0 1px 1px #ffffff58,inset 1px 0 #ffffff22,inset -1px -1px #0a102d60}
.work-plate{aspect-ratio:1.85}
.work-plate img,.case-plate img{display:block;max-width:72%;max-height:77%;object-fit:contain}
.plate-hyam{background:radial-gradient(ellipse at 75% 28%,#494556,#232c42 49%,#151b29)}
.plate-odette{background:linear-gradient(132deg,#e2e7f5,#bdc9ee)}
.plate-odette img:first-child{width:86%;max-width:86%;border-radius:3px;box-shadow:0 12px 34px #3b4f8d25}
.plate-aaqoura{background:radial-gradient(circle at 62% 29%,#fcf7ef,#e7e0d6)}
.plate-fixabl{background:linear-gradient(132deg,#232829,#343a35)}
.plate-cyclamen{background:linear-gradient(132deg,#262332,#463745)}
.plate-alex{background:radial-gradient(ellipse at 60% 0%,#52353b,#1e1a1e 70%)}
.plate-kelme{background:linear-gradient(142deg,#eae0cf,#f8f4e9)}
.plate-timeless{background:linear-gradient(128deg,#182a22,#354b3c)}
.alex-type,.cedars-type{font-family:Georgia,serif;color:#fff6e6;line-height:.84;font-size:clamp(2.5rem,6vw,6rem);letter-spacing:-.065em}
.cedars-type{text-align:center;font-size:clamp(2.4rem,5vw,5rem);line-height:.86}
.cedars-type small{display:block;font:500 .15em/1.7 system-ui,sans-serif;margin-top:1.3em;letter-spacing:.28em;text-transform:uppercase}
.work-caption{padding:.98rem .22rem 0}
.work-caption h3{margin:.24em 0;font-size:clamp(1.55rem,2.8vw,2.4rem)}
.work-caption>p:not(.archive-kicker){max-width:42ch}
.archive-link,.archive-back{display:inline-block;padding-block:.55rem;font-weight:550}
.archive-stage{display:inline-flex;align-items:center;gap:.48em;margin-top:.7em;color:#b8c5d6;font-size:.82rem}
.archive-stage::before{content:"";border-radius:50%;width:.45em;height:.45em;background:#bdcbd8}
.archive-end{margin:clamp(46px,8vw,110px) 0;padding:clamp(24px,4vw,58px);border-radius:24px;background:radial-gradient(ellipse at 85% 0%,#b4a2a329,transparent 62%),linear-gradient(125deg,#ffffff0c,#c8dfff04);border:1px solid #cfdbeb26;box-shadow:inset 0 1px #f4f8ff14}
.archive-end h2{max-width:22ch}.archive-end p{max-width:52ch;margin-block:.6em}
.systems-index{display:grid;align-self:end}
.systems-index a{padding:.55em 0;display:flex;justify-content:space-between;gap:1em;text-decoration:none;border-bottom:1px solid #cfdef336}
.systems-index a:hover,.archive-link:hover{text-decoration:underline}
.systems-index span{color:#b1c8da}
.system-row{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr);gap:clamp(25px,7vw,100px);align-items:center;padding-block:clamp(32px,6vw,84px);border-bottom:1px solid #c1d1e22b;scroll-margin-top:8rem}
.system-emblem{min-height:125px;aspect-ratio:1.7;display:grid;place-items:center;color:#e6e8ee;isolation:isolate;background:radial-gradient(ellipse,var(--glow,#a5badc28),transparent 66%)}
.sys-commission{--glow:#c589a536}.sys-murray{--glow:#949fe044}.sys-xplor{--glow:#a2bca833}.sys-murexical{--glow:#a795dc36}
.system-emblem>svg,.system-bubbles{width:clamp(95px,55%,220px);max-height:190px}
.system-bubbles{position:relative;aspect-ratio:1}
.system-bubbles i{position:absolute;left:var(--bx);top:var(--by);width:var(--bs);aspect-ratio:1;box-shadow:inset 2px 1px 5px #ffffff66,inset -2px -2px 7px #ffffff45;border:1px solid #f5fbffcf;border-radius:50%;background:radial-gradient(at 25% 20%,#ffffff38,transparent 40%);transform:translate(-50%,-50%)}
.system-copy h2{margin:.18em 0 .3em;font-size:clamp(1.9rem,4.5vw,3.5rem)}
.system-copy>p:not(.archive-kicker){max-width:45ch}
.system-copy .service-note{padding:.8em 0 0;font-size:.9em}
.sys-wordmark{width:auto;height:.96em;filter:brightness(0) invert(.95);vertical-align:middle}
.network-suffix{font-size:.48em;letter-spacing:0;vertical-align:middle;margin-left:.35em}
.case-title{display:grid;grid-template-columns:1.1fr .7fr;align-items:end;gap:clamp(20px,6vw,85px);margin-top:clamp(30px,5vw,68px)}
.case-title h1{font-size:clamp(2.8rem,6vw,6rem);margin:.15em 0 0}
.case-plate{aspect-ratio:2.55;margin-block:.5rem 2rem!important}
.case-plate.plate-hyam img:first-child{width:53%;z-index:1}.case-plate .justice-detail{width:26%;height:86%;max-height:86%}
.case-plate.plate-odette img:first-child{width:62%;max-height:82%}.case-plate .odette-detail{width:12%;margin-left:8%}
.case-reading{padding-block:clamp(30px,5vw,65px);display:grid;grid-template-columns:.9fr 1fr;gap:clamp(18px,6vw,82px)}
.case-reading p{max-width:48ch}.case-reading p+p{margin-top:.8em}
@media(prefers-reduced-motion:no-preference){
 .locus-loop circle{animation:archive-locus-ring 4.6s cubic-bezier(.2,.65,.25,1) infinite;transform-origin:44px 44px}
 .locus-loop circle:nth-child(2){animation-delay:.15s}.locus-loop circle:nth-child(3){animation-delay:.26s}
 .locus-arcs{transform-origin:44px 44px;animation:archive-locus-arc 4.6s cubic-bezier(.45,0,.18,1) infinite}
 .locus-arcs path{stroke-dasharray:1;animation:archive-locus-trace 4.6s ease infinite}
 .system-bubbles i{animation:archive-bubble 6s ease-in-out var(--bd) infinite alternate}
 @keyframes archive-locus-ring{0%,100%{transform:scale(.16);opacity:0}25%,76%{transform:scale(1);opacity:1}}
 @keyframes archive-locus-arc{0%,100%{transform:rotate(0)}37%,76%{transform:rotate(360deg)}}
 @keyframes archive-locus-trace{0%,100%{stroke-dashoffset:1}10%,76%{stroke-dashoffset:0}}
 @keyframes archive-bubble{0%{transform:translate(-100%,35%) scale(.85)}55%{transform:translate(10%,-90%) scale(1.08)}100%{transform:translate(60%,65%) scale(.97)}}
}
@media(max-width:680px){
 .archive-intro,.case-title,.case-reading{grid-template-columns:1fr}
 .archive-intro{gap:1.2rem}
 .studio-emblem{display:none}
 .systems-index{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 1rem;font-size:.9rem}
 .work-grid{grid-template-columns:1fr}
 .system-row{grid-template-columns:minmax(58px,.33fr) minmax(0,1fr);gap:1rem}
 .system-emblem{min-height:0}.system-emblem>svg,.system-bubbles{width:100%}
 .case-plate{aspect-ratio:1.7}
 .archive-main .archive-kicker{font-size:.65rem}
}