@media(max-width:1150px){
  .figma-v2 .masthead .header.nav-ready nav{
    top:var(--visible-viewport-top,0px);bottom:auto;
    height:var(--visible-viewport-height,100dvh);
    padding-bottom:calc(24px + env(safe-area-inset-bottom,0px));
    scroll-padding-bottom:calc(24px + env(safe-area-inset-bottom,0px));
  }
  .figma-v2 .masthead .header.nav-ready:has(nav.is-open) .menu-toggle{
    top:calc(var(--visible-viewport-top,0px) + 24px);
  }
  .figma-v2 .footer{padding-bottom:calc(24px + env(safe-area-inset-bottom,0px))}
}

@media(max-width:700px){
  .figma-v2 .masthead .header{min-height:72px;padding-block:12px}
  .figma-v2 .masthead .header.nav-ready:has(nav.is-open) .menu-toggle{
    top:calc(var(--visible-viewport-top,0px) + 20px);
  }
  .figma-v2 .hero-band{
    --hero-fold-height:max(450px,calc(min(100svh,var(--visible-viewport-height,100svh)) - var(--site-header-height,72px) - 16px - env(safe-area-inset-bottom,0px)));
    padding-bottom:calc(28px + env(safe-area-inset-bottom,0px));
  }
  .figma-v2 .hero-logos.hero-dark{
    height:auto;min-height:0;
    padding:36px 20px;
  }
  .hero-dark .hero-layout{height:auto;min-height:0;grid-template-rows:auto auto;gap:48px}
  .figma-v2 .hero-logos.hero-dark .badge{font-size:12px;line-height:18px;letter-spacing:.1px;margin-bottom:48px}
  .figma-v2 .hero-logos.hero-dark h1{
    font-size:clamp(40px,12.8vw,58px);
    line-height:1.04;
  }
  .figma-v2 .hero-logos.hero-dark .hero-line:nth-child(2){position:relative;padding-left:1em}
  .hero-dark .hero-partner-arrow{left:.19em;top:calc(50% + .12em);width:.58em;height:.56em}
  .hero-dark .hero-ending>.hero-word:nth-child(2){display:block}
  .figma-v2 .hero-logos.hero-dark h1 .muted{color:#555}
  .figma-v2 .hero-logos.hero-dark .hero-aside{
    display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);grid-template-rows:auto auto;
    align-self:start;gap:24px 0;width:100%;height:auto;min-height:0;
    margin:0;padding:0;background:none;border-radius:0;corner-shape:round;box-shadow:none;overflow:visible;
  }
  .figma-v2 .hero-logos.hero-dark .hero-graphic{
    grid-column:1;grid-row:1;height:100%;min-height:100px;max-height:none;
    aspect-ratio:auto;border-radius:24px;clip-path:none;
  }
  /* Contents share the parent grid so the CTA spans both thumbnail and copy. */
  .hero-dark .hero-card-copy{display:contents;container-type:normal}
  .figma-v2 .hero-logos.hero-dark .hero-studio-note{
    grid-column:2;grid-row:1;margin:0;padding:20px 18px;min-height:100px;
    border-radius:24px;background:#272727;color:#fff;overflow:hidden;
    font-size:clamp(14px,3.5vw,16px);line-height:1.25;letter-spacing:-.035em;
  }
  .figma-v2 .hero-logos.hero-dark .hero-studio-note>span{color:#a3a3a3}
  @supports(corner-shape:squircle){
    .figma-v2 .hero-logos.hero-dark .hero-graphic,
    .figma-v2 .hero-logos.hero-dark .hero-studio-note{
      corner-shape:squircle;border-radius:36px;
    }
  }
  .figma-v2 .hero-logos.hero-dark .hero-actions{grid-column:1/-1;grid-row:2;margin:0}
  .figma-v2 .hero-logos.hero-dark .hero-actions .pill{
    width:100%;height:48px;min-height:48px;font-size:15px;line-height:1.25;padding:12px 18px;
    color:#242424;background:linear-gradient(165deg,#fff 12%,#f6f6f6 44%,#b7b7b7 100%);
    box-shadow:0 10px 18px #0005;
  }
}

/* Keep section labels legible on both phone and tablet layouts. */
@media(max-width:1150px){
  .figma-v2 .work-section>.eyebrow,
  .figma-v2 .expertise.expertise-centered .expertise-heading>.eyebrow,
  .figma-v2 .process .process-copy>.eyebrow,
  .figma-v2 .hero-logos.hero-dark .badge{font-size:12px;line-height:18px}
  .figma-v2 .hero-mobile-details .experience>.eyebrow,
  .figma-v2 .hero-logos.hero-dark .experience>.eyebrow{font-size:11px;line-height:17px;letter-spacing:1px}
}