@font-face{font-family:"Real";src:url("fonts/fonts/1f0d7cbe-1a09-4692-a068-0df751376265.woff2") format("woff2");font-style:normal;font-weight:100 900;font-display:swap}
:root{--bg:#050403;--ink:#f1ece6;--muted:#aaa39d;--line:rgba(255,255,255,.105);--accent:#cb6a2a;--green:#0c2316;--page:1720px}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--bg)}body{margin:0;background:var(--bg);color:var(--ink);font-family:"Real","Helvetica Neue",sans-serif}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}
.case-header{position:relative;z-index:20;height:66px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(22px,3.5vw,58px);border-bottom:1px solid var(--line);background:rgba(5,4,3,.86)}
.case-brand img{width:130px;height:auto;filter:invert(1)}.back-link,.text-link{display:inline-flex;align-items:center;gap:12px;padding-bottom:9px;border-bottom:1px solid rgba(203,106,42,.62);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.back-link span,.text-link span{color:var(--accent)}
.case-header a:focus-visible,.text-link:focus-visible{outline:2px solid var(--accent);outline-offset:7px}
.case-hero{position:relative;isolation:isolate;overflow:hidden;min-height:calc(100vh - 66px);max-width:var(--page);margin:auto;display:grid;grid-template-columns:minmax(300px,.72fr) minmax(560px,1.28fr);align-items:center;gap:clamp(18px,3vw,56px);padding:clamp(70px,8vw,136px) clamp(24px,5.5vw,94px)}
.case-kicker,.section-index,.placeholder-label{margin:0 0 22px;color:var(--accent);font:700 10px/1.3 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.18em;text-transform:uppercase}
.case-hero h1{margin:0;font-size:clamp(72px,9.2vw,150px);font-weight:600;line-height:.82;letter-spacing:.008em}.case-lead{max-width:560px;margin:34px 0 0;color:#c8c1ba;font-size:clamp(17px,1.25vw,21px);line-height:1.58}.case-hero .text-link{margin-top:31px}
.case-hero-copy,.case-device-wrap{position:relative;z-index:1}.case-device-wrap{min-height:560px;display:grid;place-items:center}.case-green-field{position:absolute;z-index:0;inset:0;background:linear-gradient(180deg,rgba(5,5,5,0) 0%,rgba(5,5,5,.08) 68%,#050505 100%),radial-gradient(circle at 74% 34%,rgba(86,145,78,.24),transparent 35%),linear-gradient(90deg,#050505 0%,#050505 29%,#07130c 51%,#0b2115 100%)}.case-device{width:105%;height:auto;aspect-ratio:3/2;max-width:none;filter:drop-shadow(0 38px 46px rgba(0,0,0,.48))}
.fact-rail{border-block:1px solid var(--line);padding:0 clamp(24px,5.5vw,94px)}.fact-rail dl{max-width:var(--page);margin:auto;display:grid;grid-template-columns:.8fr 1.25fr 1fr}.fact-rail dl>div{min-height:150px;padding:34px 30px 34px 0;border-right:1px solid var(--line)}.fact-rail dl>div+div{padding-left:30px}.fact-rail dl>div:last-child{border-right:0}.fact-rail dt{color:var(--accent);font:700 9px/1 monospace;letter-spacing:.15em;text-transform:uppercase}.fact-rail dd{margin:38px 0 0;font-size:clamp(18px,1.6vw,25px)}
.case-text-section,.cms-focus,.testimonial,.case-end{max-width:var(--page);margin:auto;padding:clamp(120px,14vw,220px) clamp(24px,5.5vw,94px)}
.case-text-section{display:grid;grid-template-columns:repeat(12,1fr);gap:24px}.case-text-section .section-index{grid-column:1/4}.case-text-section h2{grid-column:1/9;margin:54px 0 0;font-size:clamp(58px,7vw,112px);font-weight:600;line-height:.91}.case-prose{grid-column:8/-1;margin-top:110px;color:#b9b2ab;font-size:clamp(17px,1.2vw,20px);line-height:1.65}.case-prose p{margin:0 0 24px}
.screen-story{max-width:var(--page);margin:auto;display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(18px,2vw,34px);padding:clamp(80px,10vw,160px) clamp(24px,5.5vw,94px);background:#08140d}.screen-copy{grid-column:1/6;align-self:center}.screen-copy h2,.cms-focus h2,.testimonial h2,.case-end h2{margin:0;font-size:clamp(50px,6vw,96px);font-weight:600;line-height:.93}.screen-copy>p:last-child,.cms-focus>p:not(.section-index){max-width:620px;color:#c5beb7;font-size:clamp(17px,1.2vw,20px);line-height:1.62}.desktop-shot{grid-column:6/-1;margin:0;align-self:start}.mobile-shot{grid-column:9/-1;margin:-12% 3% 0 0;justify-self:end;width:46%;min-width:210px}.screen-story figure img{width:100%;box-shadow:0 30px 70px rgba(0,0,0,.34)}.screen-story figcaption{margin-top:12px;color:rgba(255,255,255,.45);font:700 8px/1 monospace;letter-spacing:.15em;text-transform:uppercase}
.cms-focus{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(50px,8vw,140px);border-bottom:1px solid var(--line)}.cms-focus .section-index{grid-column:1/-1}.cms-focus h2{grid-column:1}.cms-focus>p:not(.section-index){grid-column:2;align-self:start;margin:0}.cms-focus ul{grid-column:2;list-style:none;margin:30px 0 0;padding:0;border-top:1px solid var(--line)}.cms-focus li{padding:15px 0;border-bottom:1px solid var(--line);color:#aaa39d}
.testimonial{position:relative;background:#090705}.testimonial blockquote{max-width:1160px;margin:68px 0 44px;font-size:clamp(42px,5.6vw,90px);line-height:1.03;color:#8d8781}.testimonial cite{color:#9b948d;font-style:normal}.testimonial cite span{color:#9b948d}.testimonial-placeholder{border:1px dashed rgba(203,106,42,.32)}
.case-end{min-height:72vh;display:flex;flex-direction:column;justify-content:center}.case-end h2{font-size:clamp(72px,9vw,144px)}.end-links{display:flex;gap:34px;flex-wrap:wrap;margin-top:48px}
@media(max-width:1020px){.case-hero{grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr)}.case-device-wrap{min-height:440px}.case-text-section h2{grid-column:1/11}.case-prose{grid-column:7/-1}.screen-copy{grid-column:1/7}.desktop-shot{grid-column:6/-1}}
@media(max-width:760px){.case-header{padding-inline:20px}.case-hero{display:block;min-height:auto;padding:70px 22px 80px}.case-hero h1{font-size:clamp(70px,23vw,108px)}.case-device-wrap{min-height:auto;margin-top:58px}.case-device{width:100%;margin-left:0}.case-green-field{background:linear-gradient(180deg,#050505 0%,rgba(5,5,5,.94) 35%,rgba(7,19,12,.92) 58%,rgba(10,31,19,.94) 78%,#050505 100%),radial-gradient(circle at 72% 68%,rgba(86,145,78,.28),transparent 34%)}.fact-rail{padding-inline:22px}.fact-rail dl{display:block}.fact-rail dl>div,.fact-rail dl>div+div{min-height:auto;padding:24px 0;border-right:0;border-bottom:1px solid var(--line)}.fact-rail dl>div:last-child{border-bottom:0}.fact-rail dd{margin-top:14px}.case-text-section,.cms-focus{display:block;padding:110px 22px}.case-text-section h2{margin-top:42px}.case-prose{margin-top:48px}.screen-story{display:block;padding:92px 22px}.screen-copy h2,.cms-focus h2,.testimonial h2{font-size:clamp(38px,10vw,44px)}.desktop-shot{margin-top:62px}.mobile-shot{width:48%;min-width:160px;margin:-8% 2% 0 auto}.cms-focus>p:not(.section-index){margin-top:44px}.cms-focus ul{margin-top:34px}.testimonial,.case-end{padding:110px 22px}.testimonial blockquote{margin-top:48px}.end-links{display:grid;justify-items:start}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
@view-transition{navigation:auto}
.case-green-field{view-transition-name:biotop-case-field}.case-device{view-transition-name:biotop-case-device}#case-title{view-transition-name:biotop-case-title}
::view-transition-group(biotop-case-field){animation-duration:.88s;animation-timing-function:cubic-bezier(.16,1,.3,1)}
::view-transition-group(biotop-case-device){animation-duration:.92s;animation-timing-function:cubic-bezier(.16,1,.3,1)}
::view-transition-group(biotop-case-title){animation-duration:.84s;animation-timing-function:cubic-bezier(.16,1,.3,1)}
::view-transition-old(biotop-case-field),::view-transition-new(biotop-case-field),::view-transition-old(biotop-case-device),::view-transition-new(biotop-case-device),::view-transition-old(biotop-case-title),::view-transition-new(biotop-case-title){mix-blend-mode:normal}
::view-transition-old(biotop-case-title){animation:.28s ease-out both biotop-title-out}::view-transition-new(biotop-case-title){animation:.84s cubic-bezier(.16,1,.3,1) both biotop-title-in}
::view-transition-old(root){animation:.56s cubic-bezier(.4,0,1,1) both biotop-page-out}::view-transition-new(root){animation:.88s cubic-bezier(.16,1,.3,1) both biotop-page-in}
@keyframes biotop-title-out{to{opacity:0}}@keyframes biotop-title-in{0%,42%{opacity:0}to{opacity:1}}@keyframes biotop-page-out{to{opacity:.12;transform:scale(.992)}}@keyframes biotop-page-in{0%,28%{opacity:.08}to{opacity:1}}
@media(prefers-reduced-motion:reduce){::view-transition-group(root),::view-transition-group(biotop-case-field),::view-transition-group(biotop-case-device),::view-transition-group(biotop-case-title){animation:none!important}}