/* Notch: shared styles for all pages */
@import url(https://db.onlinewebfonts.com/c/88f10bf18a36407ef36bf30bc25a3618?family=SuisseIntl-Regular);

:root{
  --white:#FFFFFF;
  --black:#000000;
  --grey:#7A7A7A;
  --grey-dark:#9A9A9A;      /* grey text on black */
  --soft:#F1F1F1;           /* image wells, input fields */
  --line:rgba(0,0,0,.14);
  --line-dark:rgba(255,255,255,.18);

  --font:"SuisseIntl-Regular","Suisse Intl","Helvetica Neue",Helvetica,Arial,sans-serif;

  /* type scale */
  --t-xs:13px;
  --t-s:15px;
  --t-m:17px;
  --t-l:clamp(20px,1.6vw,24px);
  --t-xl:clamp(28px,3vw,44px);
  --t-xxl:clamp(36px,5vw,80px);
  --t-display:clamp(48px,9vw,168px);

  --pad:clamp(16px,2.2vw,32px);
  --gap:clamp(12px,1.4vw,24px);
  --section:clamp(96px,12vw,200px);
  --ease:cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--white);color:var(--black);
  font-family:var(--font);font-weight:400;font-size:var(--t-m);line-height:1.5;
  font-synthesis:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,h4,p,ul,ol,figure,blockquote{margin:0;padding:0}
h1,h2,h3,h4{font-weight:400}
ul,ol{list-style:none}
a{color:inherit;text-decoration:none}
img,video{display:block;width:100%;height:100%;object-fit:cover}
button,input,textarea,select{font:inherit;color:inherit}
::selection{background:var(--black);color:var(--white)}
:focus-visible{outline:2px solid currentColor;outline-offset:4px;border-radius:2px}

.wrap{padding-left:var(--pad);padding-right:var(--pad)}
.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap)}
.grey{color:var(--grey)}
.on-black{background:var(--black);color:var(--white)}
.on-black .grey{color:var(--grey-dark)}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* text styles */
.display{font-size:var(--t-display);line-height:.92;letter-spacing:-.055em}
.h1{font-size:var(--t-xxl);line-height:1;letter-spacing:-.045em}
.h2{font-size:var(--t-xl);line-height:1.08;letter-spacing:-.03em}
.lead{font-size:var(--t-l);line-height:1.35;letter-spacing:-.015em}
.small{font-size:var(--t-s);line-height:1.45}
.tiny{font-size:var(--t-xs);line-height:1.4}
.measure{max-width:34em}

/* links */
.link{position:relative;display:inline-block;white-space:nowrap}
.link::after{content:"";position:absolute;left:0;right:0;bottom:-.08em;height:1px;background:currentColor;
  transform:scaleX(1);transform-origin:right;transition:transform .6s var(--ease)}
.link:hover::after{transform:scaleX(0)}
.link--quiet::after{transform:scaleX(0);transform-origin:left}
.link--quiet:hover::after{transform:scaleX(1)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;height:52px;padding:0 26px;border-radius:999px;
  background:var(--black);color:var(--white);border:1px solid var(--black);font-size:var(--t-s);cursor:pointer;
  transition:background .3s,color .3s}
.btn:hover{background:transparent;color:var(--black)}
.on-black .btn{background:var(--white);color:var(--black);border-color:var(--white)}
.on-black .btn:hover{background:transparent;color:var(--white)}

/* ---------- header ---------- */
.header{position:fixed;inset:0 0 auto 0;z-index:50;color:var(--white);mix-blend-mode:difference;
  transition:transform .6s var(--ease)}
.header.is-hidden{transform:translateY(-110%)}
.header__inner{display:flex;align-items:center;justify-content:space-between;height:72px;font-size:var(--t-s)}
.logo{display:inline-flex;align-items:center;gap:10px;font-size:22px;letter-spacing:-.04em}
.logo svg{width:20px;height:20px}
.nav{display:flex;gap:clamp(20px,2.6vw,44px);align-items:center}
.nav a[aria-current="page"]::after{transform:scaleX(1)}
.menu-btn{display:none;background:none;border:0;padding:8px 0;cursor:pointer;font-size:var(--t-s)}

.mobile-menu{position:fixed;inset:0;z-index:60;background:var(--black);color:var(--white);display:flex;flex-direction:column;
  justify-content:space-between;padding:20px var(--pad) 32px;transform:translateY(-100%);transition:transform .7s var(--ease);visibility:hidden}
.mobile-menu.is-open{transform:none;visibility:visible}
.mobile-menu__top{display:flex;justify-content:space-between;align-items:center;height:32px}
.mobile-menu__top button{background:none;border:0;color:inherit;cursor:pointer;font-size:var(--t-s)}
.mobile-menu nav{display:grid;gap:6px}
.mobile-menu nav a{font-size:clamp(44px,13vw,72px);line-height:1.05;letter-spacing:-.05em}

@media (max-width:820px){
  .nav{display:none}
  .menu-btn{display:block}
}

/* ---------- page load: one orchestrated entrance ---------- */
.line{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.line > span{display:block;transform:translateY(105%);transition:transform 1.3s var(--ease)}
.is-loaded .line > span{transform:none}
.is-loaded .line:nth-child(2) > span{transition-delay:.08s}
.is-loaded .line:nth-child(3) > span{transition-delay:.16s}
.fade-in{opacity:0;transition:opacity 1.2s var(--ease) .5s}
.is-loaded .fade-in{opacity:1}

/* ---------- media ---------- */
.media{position:relative;overflow:hidden;background:var(--soft);border-radius:4px}
.media img,.media video{transition:transform 1.4s var(--ease),opacity .8s ease}
.media img{opacity:0}
.media img.is-ready{opacity:1}

/* ---------- hero ---------- */
.hero{padding-top:0}
.hero__stage{position:relative;overflow:hidden;padding-top:clamp(140px,19vw,260px);padding-bottom:4px}
.hero__title{grid-column:1 / -1}
.hero__foot{margin-top:clamp(40px,5vw,72px);align-items:end;row-gap:28px}
.hero__intro{grid-column:1 / span 5;display:grid;gap:20px}
.hero__actions{grid-column:9 / -1;display:flex;gap:28px;justify-content:flex-end;font-size:var(--t-s)}
.reel{margin-top:clamp(56px,7vw,112px);height:190vh;position:relative}
.reel__frame{position:sticky;top:0;height:100vh;overflow:hidden;
  clip-path:inset(calc(var(--inset,1) * 9%) calc(var(--inset,1) * 22%) calc(var(--inset,1) * 9%) calc(var(--inset,1) * 22%) round calc(var(--inset,1) * 6px))}
.reel__frame{background:var(--black)}
.reel__frame video{position:absolute;inset:0}
.reel__caption{position:absolute;left:var(--pad);right:var(--pad);bottom:24px;display:flex;justify-content:space-between;
  color:var(--white);font-size:var(--t-s);opacity:calc(1 - var(--inset,1) * 1);transition:opacity .2s}
@media (max-width:820px){
  .hero__intro,.hero__actions{grid-column:1 / -1}
  .hero__actions{justify-content:flex-start}
  .reel{height:auto}
  .reel__frame{position:relative;height:auto;aspect-ratio:4/5;clip-path:none;margin:0 var(--pad);border-radius:4px}
  .reel__caption{opacity:1}
}

/* ---------- sections ---------- */
.section{padding-top:var(--section)}
.section--pb{padding-bottom:var(--section)}
.section-head{align-items:end;margin-bottom:clamp(36px,4vw,64px);row-gap:20px}
.section-head__title{grid-column:1 / span 8}
.section-head__aside{grid-column:10 / -1;justify-self:end;font-size:var(--t-s)}
@media (max-width:820px){.section-head__title,.section-head__aside{grid-column:1 / -1;justify-self:start}}

/* clients */
.clients{align-items:start;row-gap:24px}
.clients__label{grid-column:1 / span 3;font-size:var(--t-s);padding-top:.7em}
.clients__list{grid-column:4 / -1;font-size:var(--t-xl);line-height:1.18;letter-spacing:-.03em}
.clients__list span{color:var(--black);transition:color .3s}
.clients__list .sep{color:var(--grey)}
.clients__list:hover span:not(.sep){color:#C4C4C4}
.clients__list span:not(.sep):hover{color:var(--black)}
@media (max-width:820px){.clients__label,.clients__list{grid-column:1 / -1}}

/* work cards */
.work{row-gap:clamp(48px,6vw,96px);align-items:end}
.card{display:block;cursor:pointer}
.card .media{aspect-ratio:var(--ar,4/5)}
.card:hover .media img,.card:hover .media video{transform:scale(1.035)}
.card__meta{display:flex;justify-content:space-between;gap:24px;margin-top:16px;font-size:var(--t-s);line-height:1.4}
.card__name{color:var(--black)}
.card__desc{color:var(--grey)}
.card__tags{color:var(--grey);text-align:right;flex:none}
.span-12{grid-column:span 12}.span-7{grid-column:span 7}.span-5{grid-column:span 5}
.span-6{grid-column:span 6}.span-4{grid-column:span 4}.span-8{grid-column:span 8}
.push-1{grid-column-start:2}
@media (max-width:820px){
  .work > *{grid-column:1 / -1!important}
  .card__meta{flex-direction:column;gap:2px}
  .card__tags{text-align:left}
}

/* cursor label for work */
.cursor{position:fixed;left:0;top:0;z-index:70;pointer-events:none;width:92px;height:92px;margin:-46px 0 0 -46px;border-radius:50%;
  background:var(--white);color:var(--black);display:grid;place-items:center;font-size:var(--t-s);
  transform:translate3d(var(--x,-200px),var(--y,-200px),0) scale(0);transition:transform .45s var(--ease)}
.cursor.is-on{transform:translate3d(var(--x),var(--y),0) scale(1)}
@media (hover:none){.cursor{display:none}}

/* statement + figures */
.statement__text{grid-column:1 / span 10;font-size:var(--t-xxl);line-height:1.02;letter-spacing:-.045em;text-wrap:balance}
.figures{margin-top:clamp(56px,7vw,112px);row-gap:36px}
.figure{grid-column:span 3;border-top:1px solid var(--line);padding-top:18px}
.figure__n{font-size:var(--t-xl);letter-spacing:-.035em;line-height:1}
.figure__l{margin-top:10px;font-size:var(--t-s);color:var(--grey);max-width:18em}
@media (max-width:1000px){.figure{grid-column:span 6}}
@media (max-width:820px){.statement__text{grid-column:1 / -1}}
@media (max-width:520px){.figure{grid-column:1 / -1}}

/* services list */
.services{border-top:1px solid var(--line)}
.service{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);row-gap:16px;
  padding:clamp(28px,3vw,44px) 0;border-bottom:1px solid var(--line);align-items:baseline;transition:color .4s}
.service__name{grid-column:1 / span 5;font-size:var(--t-xxl);line-height:1;letter-spacing:-.045em}
.service__desc{grid-column:6 / span 3;font-size:var(--t-s);color:var(--grey)}
.service__items{grid-column:10 / -1;font-size:var(--t-s);display:grid;gap:4px}
.services:hover .service{color:#C4C4C4}
.services:hover .service .service__desc{color:#C4C4C4}
.services .service:hover,.services .service:hover .service__desc{color:var(--black)}
.services .service:hover .service__desc{color:var(--grey)}
.float-img{position:fixed;left:0;top:0;z-index:40;width:clamp(200px,18vw,300px);aspect-ratio:4/5;pointer-events:none;
  border-radius:4px;overflow:hidden;background:var(--soft);opacity:0;transform:translate3d(var(--x,0),var(--y,0),0) scale(.9);
  transition:opacity .35s,transform .6s var(--ease)}
.float-img.is-on{opacity:1;transform:translate3d(var(--x),var(--y),0) scale(1)}
.float-img img{position:absolute;inset:0;opacity:0;transition:opacity .35s}
.float-img img.is-active{opacity:1}
@media (max-width:1000px){
  .service__name{grid-column:1 / -1}
  .service__desc{grid-column:1 / span 6}
  .service__items{grid-column:7 / -1}
}
@media (max-width:620px){.service__desc,.service__items{grid-column:1 / -1}}
@media (hover:none){.float-img{display:none}}

/* process steps */
.steps{row-gap:40px}
.step{grid-column:span 3;border-top:1px solid var(--line);padding-top:18px}
.step__n{font-size:var(--t-s);color:var(--grey)}
.step__t{margin-top:clamp(40px,5vw,88px);font-size:var(--t-xl);letter-spacing:-.035em;line-height:1}
.step__d{margin-top:14px;font-size:var(--t-s);color:var(--grey);max-width:22em}
@media (max-width:1000px){.step{grid-column:span 6}}
@media (max-width:520px){.step{grid-column:1 / -1}}

/* testimonial */
.quote{row-gap:32px}
.quote__body{grid-column:1 / span 8;min-height:4.2em}
.quote__text{font-size:var(--t-xxl);line-height:1.02;letter-spacing:-.045em;text-wrap:balance;transition:opacity .5s}
.quote__by{margin-top:28px;font-size:var(--t-s);transition:opacity .5s}
.quote.is-swapping .quote__text,.quote.is-swapping .quote__by,.quote.is-swapping .quote__media img{opacity:0}
.quote__nav{grid-column:1 / -1;display:flex;gap:24px;align-items:center;font-size:var(--t-s);border-top:1px solid var(--line);padding-top:18px}
.quote__nav button{background:none;border:0;padding:0;cursor:pointer}
.quote__count{margin-left:auto;color:var(--grey);font-variant-numeric:tabular-nums}
@media (max-width:820px){.quote__body{grid-column:1 / -1}.quote__media{grid-column:1 / span 7;grid-row:1}}

/* teardown form */
.teardown{padding-top:var(--section);padding-bottom:var(--section);row-gap:48px;align-items:start}
.teardown__title{grid-column:1 / span 6}
.teardown__form{grid-column:8 / -1;display:grid;gap:12px}
.field{display:grid;gap:8px}
.field label{font-size:var(--t-xs);color:var(--grey)}
.field input,.field textarea,.field select{width:100%;height:56px;padding:0 18px;border-radius:4px;border:1px solid transparent;background:var(--soft);
  font-size:var(--t-m);outline:none;transition:border-color .3s,background .3s}
.field textarea{height:auto;min-height:150px;padding:16px 18px;resize:vertical;line-height:1.5}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--black);background:var(--white)}
.on-black .field label{color:var(--grey-dark)}
.on-black .field input{background:#151515;color:var(--white)}
.on-black .field input:focus{border-color:var(--white);background:#000}
.form-row{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:12px;flex-wrap:wrap}
.form-note{font-size:var(--t-xs)}
.form-done{font-size:var(--t-l);letter-spacing:-.015em}
@media (max-width:820px){.teardown__title,.teardown__form{grid-column:1 / -1}}

/* faq */
.faq{row-gap:32px;align-items:start}
.faq__title{grid-column:1 / span 4}
.faq__list{grid-column:6 / -1;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:24px;padding:24px 0;font-size:var(--t-l);letter-spacing:-.015em}
.faq summary::-webkit-details-marker{display:none}
.faq summary .pm{position:relative;width:14px;height:14px;flex:none;margin-top:.45em}
.faq summary .pm::before,.faq summary .pm::after{content:"";position:absolute;left:0;top:50%;width:100%;height:1px;background:currentColor;transition:transform .5s var(--ease)}
.faq summary .pm::after{transform:rotate(90deg)}
.faq details[open] summary .pm::after{transform:rotate(0)}
.faq__a{padding:0 0 28px;max-width:38em;color:var(--grey);font-size:var(--t-m)}
@media (max-width:820px){.faq__title,.faq__list{grid-column:1 / -1}}

/* footer */
.footer{padding-top:var(--section);overflow:hidden}
.footer__cta{row-gap:24px;align-items:end}
.footer__ask{grid-column:1 / span 6;font-size:var(--t-l)}
.footer__mail{grid-column:1 / -1;font-size:var(--t-xxl);letter-spacing:-.045em;line-height:1;margin-top:8px;justify-self:start}
.footer__cols{margin-top:clamp(80px,10vw,160px);row-gap:32px;font-size:var(--t-s)}
.footer__col{grid-column:span 3;display:grid;gap:4px;align-content:start}
.footer__col h4{color:var(--grey-dark);margin-bottom:10px;font-size:var(--t-s)}
.footer__word{margin-top:clamp(48px,6vw,96px);font-size:41vw;line-height:.74;letter-spacing:-.075em;white-space:nowrap;
  padding:0 var(--pad);transform:translateY(.06em)}
.footer__word span{display:inline-block}
@media (max-width:820px){.footer__col{grid-column:span 6}.footer__ask{grid-column:1 / -1}}

/* ---------- inner page heads ---------- */
.page-head{padding-top:clamp(140px,17vw,240px)}
.page-head__title{grid-column:1 / span 11}
.page-head__intro{grid-column:1 / span 5;margin-top:clamp(28px,3vw,48px)}
@media (max-width:820px){.page-head__title,.page-head__intro{grid-column:1 / -1}}

/* filters (work page) */
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-top:clamp(48px,6vw,88px)}
.filter{height:40px;padding:0 18px;border-radius:999px;border:1px solid var(--line);background:none;cursor:pointer;font-size:var(--t-s);
  transition:background .3s,color .3s,border-color .3s}
.filter:hover{border-color:var(--black)}
.filter[aria-pressed="true"]{background:var(--black);color:var(--white);border-color:var(--black)}
.card.is-out{display:none}

/* case study */
.case-meta{margin-top:clamp(48px,6vw,88px);border-top:1px solid var(--line);padding-top:18px;row-gap:24px;font-size:var(--t-s)}
.case-meta > div{grid-column:span 3}
.case-meta dt{color:var(--grey);margin-bottom:6px}
.case-meta dd{margin:0}
@media (max-width:820px){.case-meta > div{grid-column:span 6}}
.case-hero{margin-top:clamp(48px,6vw,88px)}
.case-hero .media{aspect-ratio:16/9;border-radius:0}
.case-text{row-gap:24px}
.case-text__label{grid-column:1 / span 3;font-size:var(--t-s);color:var(--grey);padding-top:.35em}
.case-text__body{grid-column:5 / span 7;font-size:var(--t-l);line-height:1.4;letter-spacing:-.015em;display:grid;gap:1em}
@media (max-width:820px){.case-text__label,.case-text__body{grid-column:1 / -1}}
.gallery{row-gap:var(--gap)}
.results{row-gap:36px}
.next-case{display:block;padding:var(--section) 0;border-top:1px solid var(--line)}
.next-case__label{font-size:var(--t-s);color:var(--grey)}
.next-case__title{font-size:var(--t-display);line-height:.92;letter-spacing:-.055em;margin-top:16px;transition:opacity .4s}
.next-case:hover .next-case__title{opacity:.4}

/* services page */
.pillar{padding-top:clamp(56px,7vw,112px);padding-bottom:clamp(56px,7vw,112px);border-top:1px solid var(--line);row-gap:40px;align-items:start}
.pillar__name{grid-column:1 / span 4;font-size:var(--t-xxl);line-height:1;letter-spacing:-.045em;position:sticky;top:100px}
.pillar__body{grid-column:6 / -1;display:grid;gap:clamp(40px,4vw,64px)}
.pillar__intro{font-size:var(--t-l);line-height:1.4;letter-spacing:-.015em;max-width:30em}
.offer{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));column-gap:var(--gap);row-gap:12px;border-top:1px solid var(--line);padding-top:18px}
.offer__name{grid-column:1 / span 3;font-size:var(--t-l);letter-spacing:-.015em}
.offer__desc{grid-column:4 / -1;font-size:var(--t-s);color:var(--grey)}
.offer__list{grid-column:4 / -1;font-size:var(--t-s);display:flex;flex-wrap:wrap;gap:6px}
.offer__list li{border:1px solid var(--line);border-radius:999px;padding:4px 12px}
@media (max-width:1000px){.pillar__name{grid-column:1 / -1;position:static}.pillar__body{grid-column:1 / -1}}
@media (max-width:620px){.offer__name,.offer__desc,.offer__list{grid-column:1 / -1}}
.models{row-gap:var(--gap)}
.model{grid-column:span 4;background:var(--soft);border-radius:4px;padding:clamp(24px,2.4vw,36px);display:flex;flex-direction:column;min-height:340px}
.model__t{font-size:var(--t-xl);letter-spacing:-.035em;line-height:1}
.model__d{margin-top:16px;font-size:var(--t-s);color:var(--grey);max-width:24em}
.model__f{margin-top:auto;padding-top:32px;font-size:var(--t-s)}
@media (max-width:1000px){.model{grid-column:1 / -1;min-height:0}}
.stack{font-size:var(--t-xl);line-height:1.18;letter-spacing:-.03em}

/* contact page */
.contact{row-gap:56px;align-items:start}
.contact__form{grid-column:1 / span 7;display:grid;gap:12px}
.contact__aside{grid-column:9 / -1;display:grid;gap:40px;font-size:var(--t-s)}
.contact__aside h3{color:var(--grey);margin-bottom:8px;font-size:var(--t-s)}
.contact__aside .big{font-size:var(--t-l);letter-spacing:-.015em}
.choices{display:flex;flex-wrap:wrap;gap:8px}
.choice input{position:absolute;opacity:0;pointer-events:none}
.choice span{display:inline-flex;align-items:center;height:44px;padding:0 18px;border-radius:999px;border:1px solid var(--line);cursor:pointer;
  font-size:var(--t-s);transition:background .3s,color .3s,border-color .3s}
.choice span:hover{border-color:var(--black)}
.choice input:checked + span{background:var(--black);color:var(--white);border-color:var(--black)}
.choice input:focus-visible + span{outline:2px solid var(--black);outline-offset:3px}
.field-group{display:grid;gap:10px;margin-bottom:12px}
.field-group > p{font-size:var(--t-xs);color:var(--grey)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:820px){.contact__form,.contact__aside{grid-column:1 / -1}}
@media (max-width:520px){.two{grid-template-columns:1fr}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:0s!important;animation-duration:0s!important}
  .line > span{transform:none}
  .fade-in{opacity:1}
  .reel__frame{clip-path:none}
}

/* ---------- added: visual bands ---------- */
/* image strip that drifts sideways with scroll */
.strip{overflow:hidden;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.strip__track{display:flex;align-items:flex-start;gap:var(--gap);width:max-content;padding-left:var(--pad);will-change:transform}
.strip__item{width:clamp(220px,22vw,380px);flex:none}
.strip__item .media{aspect-ratio:4/5}
.strip__item:nth-child(even) .media{aspect-ratio:3/4;margin-top:clamp(40px,5vw,96px)}

/* full-bleed image */
.bleed .media{border-radius:0;aspect-ratio:var(--ar,16/8)}
@media (max-width:820px){.bleed .media{aspect-ratio:4/5}}

/* case study gallery helpers */
.gallery .media{aspect-ratio:var(--ar,4/5)}
.caption{margin-top:12px;font-size:var(--t-s);color:var(--grey)}
@media (max-width:820px){.gallery > *{grid-column:1 / -1!important}}

/* split: image + text */
.split{row-gap:32px;align-items:end}
.split__media{grid-column:1 / span 7}
.split__text{grid-column:9 / -1;display:grid;gap:20px}
.split--rev .split__media{grid-column:6 / -1;grid-row:1}
.split--rev .split__text{grid-column:1 / span 4;grid-row:1}
@media (max-width:820px){.split__media,.split__text,.split--rev .split__media,.split--rev .split__text{grid-column:1 / -1;grid-row:auto}}

/* pillar visual */
.pillar__media .media{aspect-ratio:16/10}

/* contact visual */
.contact__media .media{aspect-ratio:4/5}

/* next project with image */
.next-case__inner{row-gap:32px;align-items:end}
.next-case__text{grid-column:1 / span 7}
.next-case__media{grid-column:9 / -1}
.next-case__media .media{aspect-ratio:4/5}
.next-case:hover .media img{transform:scale(1.035)}
@media (max-width:820px){.next-case__text,.next-case__media{grid-column:1 / -1}}
@media (max-width:820px){.work .card .media{aspect-ratio:4/5}}


/* ================= v1.1 additions ================= */

.hero__title,.hero__foot{position:relative;z-index:2}
.hero__status{display:flex;align-items:center;gap:10px;font-size:var(--t-s);color:var(--grey)}
.pulse{position:relative;width:8px;height:8px;border-radius:50%;background:var(--black);flex:none}
.pulse::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--black);animation:pulse 2.4s var(--ease) infinite}
@keyframes pulse{0%{transform:scale(1);opacity:.5}100%{transform:scale(3.2);opacity:0}}

/* marquee */
.strip-row{display:flex;justify-content:space-between;gap:24px;margin-bottom:clamp(20px,2vw,32px)}
.strip-row h2{font-size:var(--t-s)}
.strip__item{transition:opacity .5s}
.strip:hover .strip__item{opacity:.35}
.strip .strip__item:hover{opacity:1}
.strip__item:hover .media img{transform:scale(1.04)}
.strip__cap{display:flex;justify-content:space-between;gap:12px;margin-top:12px;font-size:var(--t-s);opacity:0;transform:translateY(6px);transition:opacity .4s,transform .5s var(--ease)}
.strip__item:hover .strip__cap{opacity:1;transform:none}
@media (hover:none){.strip__cap{opacity:1;transform:none}.strip:hover .strip__item{opacity:1}}
.strip.is-drag{cursor:grabbing}

/* industries accordion */
.inds{display:flex;gap:var(--gap);height:clamp(440px,74vh,780px)}
.ind{position:relative;flex:1 1 0;min-width:0;overflow:hidden;border:0;padding:0;border-radius:4px;background:var(--soft);color:var(--white);
  cursor:pointer;text-align:left;transition:flex-grow .9s var(--ease)}
.ind.is-active{flex-grow:5}
.ind .media{position:absolute;inset:0;border-radius:0}
.ind .media img{filter:grayscale(1) brightness(.85);transition:filter .8s,transform 1.4s var(--ease),opacity .8s}
.ind.is-active .media img{filter:none}
.ind::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.55));pointer-events:none}
.ind__v{position:absolute;left:16px;bottom:20px;z-index:2;writing-mode:vertical-rl;transform:rotate(180deg);font-size:var(--t-s);white-space:nowrap;transition:opacity .4s}
.ind.is-active .ind__v{opacity:0}
.ind__body{position:absolute;left:clamp(20px,2vw,32px);right:clamp(20px,2vw,32px);bottom:clamp(20px,2vw,32px);z-index:2;display:grid;gap:10px;max-width:30em;
  opacity:0;transform:translateY(14px);transition:opacity .3s,transform .6s var(--ease)}
.ind.is-active .ind__body{opacity:1;transform:none;transition-delay:.35s}
.ind__t{font-size:var(--t-xl);letter-spacing:-.035em;line-height:1}
.ind__d{font-size:var(--t-m);color:rgba(255,255,255,.86)}
.ind__b{font-size:var(--t-s);color:rgba(255,255,255,.66)}
@media (max-width:820px){
  .inds{flex-direction:column;height:auto}
  .ind{flex:none;height:76px;transition:height .8s var(--ease)}
  .ind.is-active{height:min(110vw,480px)}
  .ind__v{writing-mode:horizontal-tb;transform:translateY(50%);left:20px;bottom:50%}
}

/* channels */
.channels{row-gap:48px}
.channel{grid-column:span 3}
.channel .media{aspect-ratio:var(--ar,3/4)}
.channel__t{margin-top:16px;font-size:var(--t-l);letter-spacing:-.015em}
.channel__d{margin-top:6px;font-size:var(--t-s);color:var(--grey);max-width:24em}
@media (max-width:1000px){.channel{grid-column:span 6}}
@media (max-width:520px){.channels{row-gap:32px}.channel__d{font-size:var(--t-xs)}}

/* migration spotlight */
.migrate{padding-top:var(--section);padding-bottom:var(--section)}
.migrate__grid{row-gap:48px;align-items:end}
.migrate__text{grid-column:1 / span 6;display:grid;gap:28px;justify-items:start}
.migrate__media{grid-column:8 / -1}
.migrate__media .media{aspect-ratio:var(--ar,4/5);background:#151515}
.tags{display:flex;flex-wrap:wrap;gap:8px;font-size:var(--t-s)}
.tags li{border:1px solid var(--line-dark);border-radius:999px;padding:6px 14px}
.on-black .figure{border-color:var(--line-dark)}
.on-black .figure__l{color:var(--grey-dark)}
@media (max-width:820px){.migrate__text,.migrate__media{grid-column:1 / -1}}

/* testimonial image */
.quote__media{grid-column:10 / -1;aspect-ratio:4/5;align-self:start}
.quote__media img{transition:opacity .5s,transform 1.4s var(--ease)}

/* partners */
.partners{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
.partner{display:flex;flex-direction:column;justify-content:space-between;gap:24px;min-height:clamp(120px,11vw,180px);padding:clamp(14px,1.4vw,22px);
  border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:background .4s,color .4s}
.partner__n{font-size:var(--t-l);letter-spacing:-.015em}
.partner__c{font-size:var(--t-xs);color:var(--grey);transition:color .4s}
.partner:hover{background:var(--black);color:var(--white)}
.partner:hover .partner__c{color:var(--grey-dark)}
@media (max-width:1000px){.partners{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:520px){.partners{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* studio mosaic */
.mosaic{row-gap:clamp(40px,5vw,80px);align-items:start}
.mo .media{aspect-ratio:var(--ar,4/5)}
.mo--a{grid-column:1 / span 4}
.mo--b{grid-column:6 / span 4;margin-top:clamp(80px,12vw,200px)}
.mo--c{grid-column:11 / -1}
.mo--d{grid-column:3 / span 6}
.mo--e{grid-column:10 / span 3;margin-top:clamp(60px,9vw,160px)}
@media (max-width:820px){
  .mo--a,.mo--b,.mo--d{grid-column:1 / -1;margin-top:0}
  .mo--c,.mo--e{grid-column:span 6;margin-top:0}
}

/* journal */
.posts{row-gap:48px}
.post{grid-column:span 4;display:block}
.post .media{aspect-ratio:var(--ar,3/2)}
.post:hover .media img{transform:scale(1.04)}
.post__m{margin-top:16px;font-size:var(--t-s);color:var(--grey)}
.post__t{margin-top:6px;font-size:var(--t-l);letter-spacing:-.015em;line-height:1.3;max-width:20em}
@media (max-width:1000px){.post{grid-column:1 / -1}}

/* footer newsletter */
.footer__news{margin-top:clamp(56px,7vw,112px);padding-top:24px;border-top:1px solid var(--line-dark);row-gap:16px;align-items:center}
.footer__news-t{grid-column:1 / span 5;font-size:var(--t-l);letter-spacing:-.015em}
.footer__news-f{grid-column:7 / -1;display:flex;gap:8px}
.footer__news-f input{flex:1;min-width:0;height:52px;padding:0 22px;border-radius:999px;border:1px solid var(--line-dark);background:transparent;color:var(--white);outline:none;transition:border-color .3s}
.footer__news-f input::placeholder{color:var(--grey-dark)}
.footer__news-f input:focus{border-color:var(--white)}
.footer__news .form-done{grid-column:7 / -1}
@media (max-width:820px){.footer__news-t,.footer__news-f,.footer__news .form-done{grid-column:1 / -1}}

@media (prefers-reduced-motion:reduce){.pulse::after{display:none}.trail{display:none}}
@media (max-width:820px){.quote__media{grid-column:1 / span 7;grid-row:1}}

/* hero: image trail, sits under the headline */
.trail{position:absolute;left:0;top:0;z-index:1;width:clamp(140px,12vw,210px);height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:4px;pointer-events:none;
  opacity:0;transform:translate(-50%,-50%) scale(.6) rotate(var(--rot,0deg));transition:transform .7s var(--ease),opacity .25s}
.trail.is-in{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(var(--rot,0deg))}
.trail.is-out{opacity:0;transform:translate(-50%,-50%) scale(.85) rotate(var(--rot,0deg));transition:transform .8s var(--ease),opacity .6s}

/* brands strip: names always visible */
.strip--brands .strip__cap{opacity:1;transform:none}

/* team strip: text tiles between images */
.tile{aspect-ratio:4/5;border-radius:4px;padding:clamp(20px,2vw,30px);display:flex;flex-direction:column;justify-content:space-between}
.tile--soft{background:var(--soft)}
.tile--black{background:var(--black);color:var(--white)}
.tile__t{font-size:var(--t-xl);letter-spacing:-.035em;line-height:1.04}
.tile__d{font-size:var(--t-s);color:var(--grey);max-width:20em}
.tile--black .tile__d{color:var(--grey-dark)}
.strip--team:hover .strip__item{opacity:1}
.strip--team .strip__cap{opacity:1;transform:none}