:root{
  --ink:#062502;
  --pale:#ebf2e7;
  --mint:#cce8ba;
  --deep:#102303;
  --white:#ffffff;

  --shell:1164px;
  --gutter:20px;

  --d1:80px;      /* hero */
  --h2:50px;      /* section headings */
  --h3:26px;      /* card + studio titles */
  --h4:25px;      /* column titles */
  --body:18px;
  --small:16px;
  --micro:16px;
  --label:12px;

  --ease:cubic-bezier(.22,1,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  background:var(--pale);
  color:var(--ink);
  font-family:"IBM Plex Sans",Arial,sans-serif;
  font-size:var(--body);
  line-height:1.5;
  letter-spacing:-.01em;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,p,figure,dl,dd{margin:0}
ul,ol{margin:0;padding:0;list-style:none}

.shell{width:100%;max-width:var(--shell);margin:0 auto;padding:0 var(--gutter)}
.shell--narrow{max-width:900px}
.display{font-family:"Onest",Arial,sans-serif;font-weight:400}
.prose a{color:inherit;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;
  transition:opacity .3s var(--ease)}
.prose a:hover{opacity:.62}
.prose a:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:3px;text-decoration:none}

/* ---------- header ---------- */
.masthead{position:fixed;top:24px;left:0;right:0;z-index:60}
.masthead__pill{
  display:flex;align-items:center;
  height:76px;padding:0 clamp(18px,5vw,64px);
  border:1px solid var(--ink);border-radius:1000px;
  background:rgba(235,242,231,.88);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
}
.brand{display:inline-flex;align-items:center;gap:11px}
.brand__mark{width:30px;height:30px;flex:none}
.brand__word{font-family:"Onest",Arial,sans-serif;font-size:20px;font-weight:500;letter-spacing:-.03em;white-space:nowrap}
.brand:focus-visible{outline:2px solid var(--ink);outline-offset:6px;border-radius:6px}

.mainnav{display:flex;align-items:center;gap:26px;margin-left:auto}
.mainnav a{position:relative;font-size:14px;letter-spacing:-.01em;padding:4px 2px}
.mainnav a::after{
  content:"";position:absolute;left:2px;right:2px;bottom:0;height:1px;background:currentColor;
  transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease);
}
.mainnav a:hover::after{transform:scaleX(1)}
.mainnav a:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:3px}

.burger{display:none;margin-left:auto;width:42px;height:42px;align-items:center;justify-content:center;
  border:1px solid var(--ink);border-radius:1000px;background:transparent;cursor:pointer}
.burger span{display:block;width:16px;height:1.5px;background:var(--ink);position:relative;transition:transform .4s var(--ease)}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:16px;height:1.5px;background:var(--ink);
  transition:transform .4s var(--ease),opacity .3s var(--ease)}
.burger span::before{top:-5px}
.burger span::after{top:5px}
.burger[aria-expanded="true"] span{transform:rotate(45deg)}
.burger[aria-expanded="true"] span::before{transform:translateY(5px) rotate(-90deg)}
.burger[aria-expanded="true"] span::after{opacity:0}
.burger:focus-visible{outline:2px solid var(--ink);outline-offset:3px}

.drawer{margin-top:10px;border:1px solid var(--ink);border-radius:24px;background:var(--pale);
  padding:22px 26px 26px;display:none}
.drawer.is-open{display:block}
.drawer a{display:block;width:fit-content;font-family:"Onest",Arial,sans-serif;font-size:22px;letter-spacing:-.02em;padding:9px 0}
.drawer a:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:4px}

/* ---------- hero ---------- */
.hero{padding-top:185px}
.hero__title{font-size:var(--d1);line-height:1.12;letter-spacing:-.012em;text-align:center;max-width:1060px;margin:0 auto}
.hero__sub{margin:28px auto 0;max-width:660px;text-align:center;font-size:20px;line-height:1.4;letter-spacing:-.01em}


.intro{margin:59px auto 0;max-width:640px;text-align:center;font-size:var(--body);line-height:1.55}
.intro p + p{margin-top:22px}

/* ---------- generic section ---------- */
.sec{padding:112px 0}
.sec__eyebrow{font-size:var(--label);letter-spacing:.14em;text-transform:uppercase;font-weight:600;text-align:center;opacity:.62}
.sec__title{font-size:var(--h2);line-height:1.12;letter-spacing:-.025em;text-align:center;margin-top:14px}
.sec__lead{margin:22px auto 0;max-width:640px;text-align:center;font-size:var(--body);line-height:1.55}

/* ---------- best-for tabs ---------- */
.tabs{margin-top:52px}
.tablist{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.tab{
  font-family:"IBM Plex Sans",Arial,sans-serif;font-size:14px;font-weight:500;letter-spacing:-.01em;
  padding:11px 20px;border-radius:1000px;border:1px solid var(--ink);background:transparent;color:var(--ink);
  cursor:pointer;transition:background-color .35s var(--ease),color .35s var(--ease),transform .35s var(--ease);
}
.tab:hover{background:rgba(6,37,2,.07)}
.tab:active{transform:translateY(1px)}
.tab:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.tab[aria-selected="true"]{background:var(--ink);color:var(--pale)}
.tabpanel[hidden]{display:none}
.tabpanel{margin-top:40px}
.tabpanel__note{text-align:center;font-size:var(--body);max-width:620px;margin:0 auto 32px}
.picks{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.pick{background:var(--mint);border-radius:20px;padding:24px 24px 26px;display:flex;flex-direction:column;gap:14px}
.pick__top{display:flex;align-items:center;gap:14px}
.pick__name{font-family:"Onest",Arial,sans-serif;font-size:20px;letter-spacing:-.02em}
.pick__name a:hover{opacity:.68}
.pick__name a:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:4px}
.pick p{font-size:var(--small);line-height:1.45}

.chip{width:52px;height:52px;border-radius:13px;overflow:hidden;flex:none;background:var(--white);
  box-shadow:0 0 0 1px rgba(6,37,2,.12) inset}
.chip img{width:100%;height:100%;object-fit:cover}

/* ---------- studio profiles ---------- */
.studios{margin-top:56px;border-top:1px solid rgba(6,37,2,.18)}
.studio{display:grid;grid-template-columns:88px 1fr 300px;gap:32px;padding:44px 0;
  border-bottom:1px solid rgba(6,37,2,.18)}
.studio__id{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.studio__rank{font-size:var(--label);letter-spacing:.12em;font-weight:600;opacity:.55}
.studio__name{font-family:"Onest",Arial,sans-serif;font-size:var(--h3);letter-spacing:-.02em;line-height:1.15}
.studio__name a{border-bottom:1px solid transparent;transition:border-color .3s var(--ease)}
.studio__name a:hover{border-bottom-color:var(--ink)}
.studio__name a:focus-visible{outline:2px solid var(--ink);outline-offset:4px;border-radius:4px}
.studio__best{margin-top:10px;font-size:var(--small);font-weight:500}
.studio__best span{opacity:.55;font-weight:400}
.studio__lede{margin-top:14px;font-size:var(--small);line-height:1.5;max-width:52ch;font-weight:500}
.studio__body{margin-top:14px;font-size:var(--small);line-height:1.55;max-width:56ch}
.studio__lede + .studio__body{margin-top:12px}
.studio__body + .studio__body{margin-top:10px}
.studio__body strong{font-weight:600}
.studio__link{display:inline-block;margin-top:12px;font-size:var(--small);text-decoration:underline;
  text-underline-offset:3px;text-decoration-thickness:1px}
.studio__link:hover{opacity:.62}
.studio__link:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:3px;text-decoration:none}
.facts{display:grid;grid-template-columns:1fr;gap:12px;align-content:start}
.facts div{border-top:1px solid rgba(6,37,2,.18);padding-top:9px}
.facts dt{font-size:var(--label);letter-spacing:.1em;text-transform:uppercase;font-weight:600;opacity:.55}
.facts dd{font-size:var(--small);line-height:1.35;margin-top:3px}

/* ---------- comparison ---------- */
.tablewrap{margin-top:48px;overflow-x:auto;-webkit-overflow-scrolling:touch}
table.ctable{width:100%;min-width:820px;border-collapse:collapse;text-align:left}
.ctable th,.ctable td{padding:16px 18px 16px 0;border-bottom:1px solid rgba(6,37,2,.18);vertical-align:top;
  font-size:var(--small);line-height:1.35}
.ctable thead th{font-size:var(--label);letter-spacing:.1em;text-transform:uppercase;font-weight:600;opacity:.55;
  border-bottom:1px solid var(--ink);padding-bottom:12px}
.ctable tbody th{font-weight:400}
.ctable__studio{display:flex;align-items:center;gap:12px;white-space:nowrap}
.ctable__studio .chip{width:34px;height:34px;border-radius:9px}
.ctable__studio a:hover{opacity:.62}
.ctable__studio a:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:4px}

/* engagement-model infographic */
.models{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:64px}
.model{border-top:1.5px solid var(--ink);padding-top:20px}
.model h3{font-family:"Onest",Arial,sans-serif;font-size:22px;letter-spacing:-.02em;line-height:1.2}
.model p{font-size:var(--small);line-height:1.45;margin-top:8px;max-width:38ch}
.model ul{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.model li a{display:inline-flex;align-items:center;gap:8px;padding:6px 14px 6px 6px;border-radius:1000px;
  border:1px solid rgba(6,37,2,.28);font-size:14px;transition:background-color .3s var(--ease)}
.model li a:hover{background:rgba(6,37,2,.07)}
.model li a:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.model .chip{width:26px;height:26px;border-radius:7px}

/* ---------- work-type cards ---------- */
.cards{margin-top:56px;display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.card{background:var(--mint);border-radius:24px;padding:34px 26px 30px;min-height:452px;
  display:flex;flex-direction:column;align-items:center;justify-content:space-between;text-align:center;
  box-shadow:0 26px 44px -34px rgba(6,37,2,.28),0 1px 2px rgba(6,37,2,.05)}
.card__title{font-family:"Onest",Arial,sans-serif;font-weight:400;font-size:22px;letter-spacing:-.02em;line-height:1.2}
.card__art{width:100%;max-width:186px;margin:auto 0}
.card__art svg{width:100%;height:auto}
.card__body{font-size:15px;line-height:1.5}

/* ---------- dark section ---------- */
.dark{background:var(--deep);color:var(--mint);padding:104px 0}
.dark .sec__title,.dark .sec__eyebrow,.dark .sec__lead{color:var(--mint)}
.routes{display:grid;grid-template-columns:repeat(3,1fr);gap:56px 48px;margin-top:74px}
.routes h3{font-family:"Onest",Arial,sans-serif;font-weight:400;font-size:var(--h4);line-height:1.3;letter-spacing:-.02em}
.routes hr{border:0;border-top:1px solid rgba(204,232,186,.9);margin:21px 0 0}
.routes p{font-size:var(--micro);line-height:1.45;margin-top:25px}
.routes p a{text-decoration:underline;text-underline-offset:3px}
.routes p a:hover{opacity:.7}
.routes p a:focus-visible{outline:2px solid var(--mint);outline-offset:3px;border-radius:3px}

/* ---------- ruled Q list ---------- */
.qlist{margin-top:56px;border-top:1px solid rgba(6,37,2,.18)}
.qlist > div{display:grid;grid-template-columns:1fr 1.35fr;gap:40px;padding:34px 0;
  border-bottom:1px solid rgba(6,37,2,.18)}
.qlist h3{font-family:"Onest",Arial,sans-serif;font-weight:400;font-size:24px;letter-spacing:-.02em;line-height:1.25}
.qlist p{font-size:var(--small);line-height:1.55}

/* ---------- mint section (failure modes) ---------- */
.mintsec{background:var(--mint);padding:104px 0}
.fails{display:grid;grid-template-columns:repeat(2,1fr);gap:44px 56px;margin-top:64px}
.fails h3{font-family:"Onest",Arial,sans-serif;font-weight:400;font-size:23px;letter-spacing:-.02em;line-height:1.25}
.fails hr{border:0;border-top:1px solid rgba(6,37,2,.35);margin:16px 0 0}
.fails p{font-size:var(--small);line-height:1.55;margin-top:18px}

/* ---------- faq ---------- */
.faq{margin-top:56px;border-top:1px solid rgba(204,232,186,.4)}
.faq details{border-bottom:1px solid rgba(204,232,186,.4)}
.faq summary{
  display:flex;align-items:flex-start;justify-content:space-between;gap:24px;cursor:pointer;list-style:none;
  padding:28px 0;font-family:"Onest",Arial,sans-serif;font-size:24px;letter-spacing:-.02em;line-height:1.3;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary:focus-visible{outline:2px solid var(--mint);outline-offset:-2px;border-radius:4px}
.faq summary::after{
  content:"";flex:none;width:16px;height:16px;margin-top:8px;
  background:linear-gradient(var(--mint),var(--mint)) center/16px 1.5px no-repeat,
             linear-gradient(var(--mint),var(--mint)) center/1.5px 16px no-repeat;
  transition:transform .4s var(--ease);
}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{font-size:var(--small);line-height:1.6;max-width:76ch;padding-bottom:30px}

/* ---------- footer ---------- */
.foot{background:var(--deep);color:var(--mint)}
.foot__rule{border:0;border-top:1px solid rgba(204,232,186,.4);margin:0}
.foot__grid{display:grid;grid-template-columns:326px 200px 210px 1fr;padding:67px 0 70px;align-items:start}
.foot__brand{display:flex;gap:34px;align-items:flex-start}
.foot__mark{width:80px;height:80px;flex:none}
.foot__brandText{font-family:"Onest",Arial,sans-serif;font-size:20px;line-height:1.55;letter-spacing:-.02em}
.foot__links a,.foot__meta a,.foot__meta span{
  font-family:"Onest",Arial,sans-serif;font-size:20px;line-height:1.95;letter-spacing:-.02em;display:inline-block}
.foot a{transition:opacity .3s var(--ease)}
.foot a:hover{opacity:.7}
.foot a:focus-visible{outline:2px solid var(--mint);outline-offset:3px;border-radius:4px}

.dots{height:60px;background-color:var(--deep);
  background-image:radial-gradient(circle,var(--pale) 1.5px,transparent 1.7px);
  background-size:10px 10px;background-position:5px 5px}

/* ---------- cross-page nav + page variants ---------- */
.mainnav a[aria-current="page"]::after,.drawer a[aria-current="page"]::after{transform:scaleX(1)}
.drawer a[aria-current="page"]{position:relative}
.drawer a[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:1px;background:currentColor}
.models--two{grid-template-columns:repeat(2,1fr)}
.models--four{grid-template-columns:repeat(4,1fr)}
.longform{max-width:720px;margin:48px auto 0;font-size:var(--body);line-height:1.6}
.longform p + p{margin-top:22px}
.longform strong{font-weight:600}
.cardlink{color:inherit;transition:transform .4s var(--ease)}
.cardlink:hover{transform:translateY(-4px)}
.cardlink:focus-visible{outline:2px solid var(--ink);outline-offset:4px;border-radius:24px}
.cardlink .card__title{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.cardlink .card__more{font-size:var(--label);letter-spacing:.1em;text-transform:uppercase;font-weight:600;opacity:.55;margin-top:14px}

/* ---------- disciplines dropdown ---------- */
.navdrop{position:relative}
.navdrop__btn{
  display:inline-flex;align-items:center;gap:7px;position:relative;
  font-family:"IBM Plex Sans",Arial,sans-serif;font-size:14px;letter-spacing:-.01em;
  padding:4px 2px;border:0;background:transparent;color:inherit;cursor:pointer;
}
.navdrop__btn::after{
  content:"";position:absolute;left:2px;right:2px;bottom:0;height:1px;background:currentColor;
  transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease);
}
.navdrop__btn:hover::after,.navdrop__btn.is-current::after{transform:scaleX(1)}
.navdrop__btn:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:3px}
.navdrop__chev{width:10px;height:6px;flex:none;transition:transform .35s var(--ease)}
.navdrop__btn[aria-expanded="true"] .navdrop__chev{transform:rotate(180deg)}
.navdrop__menu{
  position:absolute;top:calc(100% + 16px);left:50%;transform:translateX(-50%) translateY(-6px);
  min-width:208px;padding:10px;border:1px solid var(--ink);border-radius:20px;background:var(--pale);
  box-shadow:0 22px 40px -26px rgba(6,37,2,.5);
  display:flex;flex-direction:column;gap:2px;
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .28s var(--ease),transform .28s var(--ease),visibility .28s;
  z-index:70;
}
.navdrop__menu::before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px}
.navdrop__menu a{
  display:block;padding:9px 14px;border-radius:12px;font-size:14px;letter-spacing:-.01em;white-space:nowrap;
  transition:background-color .25s var(--ease);
}
.navdrop__menu a::after{display:none}
.navdrop__menu a:hover{background:rgba(6,37,2,.08)}
.navdrop__menu a[aria-current="page"]{background:var(--ink);color:var(--pale)}
.navdrop__menu a:focus-visible{outline:2px solid var(--ink);outline-offset:-2px}
.navdrop:hover .navdrop__menu,
.navdrop:focus-within .navdrop__menu,
.navdrop__btn[aria-expanded="true"] + .navdrop__menu{
  opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0);
}

/* mobile drawer groups */
.drawer__label{
  font-size:var(--label);letter-spacing:.12em;text-transform:uppercase;font-weight:600;opacity:.5;
  margin:16px 0 4px;
}
.drawer .drawer__sub{padding-left:16px}

/* ---------- guides index ---------- */
.gsec + .gsec{margin-top:88px}
.gsec__title{font-family:"Onest",Arial,sans-serif;font-weight:400;font-size:34px;letter-spacing:-.025em;line-height:1.15}
.gsec__list{margin-top:26px;border-top:1.5px solid var(--ink)}
.gsec__list > div{display:grid;grid-template-columns:1fr 1.4fr;gap:40px;padding:26px 0;
  border-bottom:1px solid rgba(6,37,2,.18)}
.gsec__list h3{font-family:"Onest",Arial,sans-serif;font-weight:400;font-size:22px;letter-spacing:-.02em;line-height:1.25}
.gsec__list p{font-size:var(--small);line-height:1.55}
.closing{text-align:center;font-size:var(--body);line-height:1.6;max-width:640px;margin:0 auto}
.closing a{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.closing a:hover{opacity:.65}
.closing a:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:3px;text-decoration:none}

/* ---------- contact ---------- */
.contactcards{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:52px}
.contactcard{background:var(--mint);border-radius:24px;padding:36px 34px 32px;display:flex;flex-direction:column;gap:16px}
.contactcard h2{font-family:"Onest",Arial,sans-serif;font-weight:400;font-size:26px;letter-spacing:-.02em;line-height:1.2}
.contactcard p{font-size:var(--small);line-height:1.55}
.maillink{display:inline-block;margin-top:auto;padding-top:8px;font-family:"Onest",Arial,sans-serif;
  font-size:22px;letter-spacing:-.02em;border-bottom:1.5px solid var(--ink);
  transition:opacity .3s var(--ease)}
.contactcard .maillink{align-self:flex-start}
.maillink:hover{opacity:.62}
.maillink:focus-visible{outline:2px solid var(--ink);outline-offset:4px;border-radius:3px}
.submit__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:44px 40px;margin-top:52px}
.submit__grid h3{font-family:"Onest",Arial,sans-serif;font-weight:400;font-size:22px;letter-spacing:-.02em;line-height:1.25}
.submit__grid hr{border:0;border-top:1px solid rgba(6,37,2,.35);margin:16px 0 0}
.submit__grid p{font-size:var(--small);line-height:1.55;margin-top:18px}
.submit__foot{margin-top:52px;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px;
  border-top:1.5px solid var(--ink);padding-top:28px}
.submit__foot p{font-size:var(--small);line-height:1.55;max-width:62ch}

/* ---------- reveal ---------- */
.rise{opacity:0;transform:translateY(22px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rise.in{opacity:1;transform:none}

/* ---------- responsive ---------- */
@media (max-width:1099px){
  .studio{grid-template-columns:74px 1fr 250px;gap:24px}
}
@media (max-width:991px){
  :root{--d1:64px;--h2:40px;--h3:24px;--h4:20px;--body:17px;--small:15px;--micro:15px}
  .hero{padding-top:150px}
  .sec{padding:84px 0}
  .dark,.mintsec{padding:84px 0}
  .picks{grid-template-columns:repeat(2,1fr)}
  .cards{grid-template-columns:repeat(2,1fr)}
  .card{min-height:400px}
  .studio{grid-template-columns:64px 1fr;gap:20px 22px}
  .studio__facts{grid-column:2}
  .facts{grid-template-columns:repeat(2,1fr);gap:12px 28px;margin-top:22px}
  .models,.models--two,.models--four{grid-template-columns:repeat(2,1fr);gap:36px 32px}
  .routes{grid-template-columns:repeat(2,1fr);gap:44px 40px;margin-top:56px}
  .fails{grid-template-columns:1fr;gap:34px}
  .submit__grid{grid-template-columns:1fr;gap:34px}
  .gsec__list > div{grid-template-columns:1fr;gap:10px}
  .gsec + .gsec{margin-top:64px}
  .qlist > div{grid-template-columns:1fr;gap:14px}
  .foot__grid{grid-template-columns:1fr 1fr;gap:44px 32px;padding:52px 0 56px}
}
@media (max-width:899px){
  .mainnav{display:none}
  .burger{display:flex}
}
@media (max-width:767px){
  :root{--d1:36px;--h2:28px;--h3:21px;--h4:18px;--body:16px;--small:15px;--micro:15px;--gutter:18px}
  .masthead{top:14px}
  .masthead__pill{height:64px}
  .brand__word{font-size:18px}
  .hero{padding-top:112px}
  .hero__sub{font-size:17px;margin-top:18px}
  .intro{margin-top:44px}
  .sec{padding:60px 0}
  .dark,.mintsec{padding:60px 0}
  .tabs{margin-top:34px}
  .tab{font-size:13px;padding:10px 16px}
  .tabpanel{margin-top:28px}
  .picks{grid-template-columns:1fr;gap:14px}
  .studios{margin-top:36px}
  .studio{grid-template-columns:1fr;gap:0;padding:32px 0}
  .studio__id{flex-direction:row;align-items:center;gap:12px}
  .studio__main{margin-top:16px}
  .studio__facts{grid-column:auto}
  .facts{grid-template-columns:1fr;margin-top:20px}
  .cards{grid-template-columns:1fr;margin-top:40px;gap:16px}
  .card{min-height:0;padding:30px 24px;border-radius:20px}
  .card__art{max-width:170px;margin:24px 0}
  .routes{grid-template-columns:1fr;gap:34px;margin-top:40px}
  .models,.models--two,.models--four{grid-template-columns:1fr;gap:32px}
  .longform{margin-top:32px}
  .routes hr{margin-top:16px}
  .routes p{margin-top:18px}
  .qlist{margin-top:34px}
  .qlist > div{padding:26px 0}
  .qlist h3{font-size:20px}
  .fails h3{font-size:20px}
  .faq summary{font-size:19px;padding:22px 0}
  .contactcards{grid-template-columns:1fr;gap:16px}
  .contactcard{padding:28px 24px;border-radius:20px}
  .gsec__title{font-size:26px}
  .gsec__list h3{font-size:19px}
  .maillink{font-size:19px}
  .foot__grid{grid-template-columns:1fr;gap:30px;padding:40px 0 44px}
  .foot__brand{gap:22px}
  .foot__mark{width:60px;height:60px}
  .foot__links a,.foot__meta a,.foot__meta span,.foot__brandText{font-size:18px;line-height:1.7}
  .dots{height:44px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{animation-duration:.001ms !important;transition-duration:.001ms !important}
  .rise{opacity:1;transform:none}
}