/* Mobile homepage only; desktop and project detail styles are unchanged. */
@media (max-width: 700px) {
  .direction-a [data-view="home"] #contact .footer-a-grid { display: none; }
  .direction-a [data-view="home"] > .footer-clients.mobile-brand-section { width: 100%; max-width: none; margin: 0; padding: 28px 18px 32px; border: 0; border-bottom: 1px solid #34382f; background: #070806; color: #fffdf6; }
  html:not(.admin-preview-tools) .direction-a [data-view="home"] :is(.studio-hero, .hero-viewport) { height: 460px; min-height: 0; }
  .direction-a [data-view="home"] .hero-topline strong { display: flex; align-items: baseline; gap: 6px; font-size: 11px; line-height: 1.4; }
  .direction-a [data-view="home"] .hero-location-lockup i { font-size: 9px; font-weight: 500; color: #a6a89f; }
  .direction-a [data-view="home"] .hero-stage { top: 208px; width: min(calc(100% - 64px), 280px); }
  .direction-a [data-view="home"] .hero-lockup { top: 208px; width: calc(100% - 40px); }
  .direction-a [data-view="home"] .hero-lockup h1 img { width: min(calc(100% - 24px), 270px); }
  .direction-a [data-view="home"] .hero-lockup > span { margin-bottom: 12px; font-size: 8px; font-weight: 500; letter-spacing: 0; }
  .direction-a [data-view="home"] .hero-lockup > strong { min-height: 22px; margin-top: 12px; padding-inline: 10px; font-size: 8px; letter-spacing: 0; }
  /* Keep orbit labels outside the wordmark throughout the mobile animation. */
  .direction-a [data-view="home"] .hero-mobile-labels { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
  .direction-a [data-view="home"] .orbit-tag { min-height: 17px; font-size: 7px; letter-spacing: 0; }
  .direction-a [data-view="home"] .tag-ai { left: 58%; top: -8px; }
  .direction-a [data-view="home"] .tag-art { left: auto; right: 12px; top: 84%; }
  .direction-a [data-view="home"] .tag-world { left: 18px; top: 18%; }
  .direction-a [data-view="home"] .dot-chrome { width: 30px; height: 30px; }
  .direction-a [data-view="home"] .dot-outline { width: 24px; height: 24px; border-width: 3px; }
  .direction-a [data-view="home"] .dot-acid { width: 18px; height: 18px; border-width: 4px; }
  .direction-a [data-view="home"] .hero-viewport::before { content: "IMAGE SYSTEMS / AI VISUAL"; right: 18px; bottom: 98px; font-size: 7px; letter-spacing: 0; transform: none; color: #92958c; }
  .direction-a [data-view="home"] .hero-intro { width: calc(100% - 96px); max-width: 36ch; font-size: 11px; line-height: 1.75; font-weight: 500; }
  .direction-a [data-view="home"] #studio { display: none; }
  .direction-a [data-view="home"] .studio-section-head > div:first-child { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px 12px; align-items: end; }
  .direction-a [data-view="home"] .studio-section-head > div > .section-kicker { grid-column: 1 / -1; margin: 0; font-size: 8px; }
  .direction-a [data-view="home"] .studio-section-head h2 { margin: 0; font-size: 30px; line-height: 1.2; }
  .direction-a [data-view="home"] .studio-section-head > div > span:last-child { max-width: 94px; margin: 0 0 3px; font-size: 8px; line-height: 1.6; text-align: right; }
  .direction-a [data-view="home"] .studio-statement { padding: 12px 0; }
  .direction-a [data-view="home"] .statement-layout { gap: 8px; }
  .direction-a [data-view="home"] .statement-copy { padding-bottom: 0; }
  .direction-a [data-view="home"] .statement-layout .section-kicker { margin-bottom: 10px; }
  .direction-a [data-view="home"] .statement-layout h2 > span { font-size: 23px; line-height: 1.12; }
  .direction-a [data-view="home"] .statement-layout h2 strong { margin-top: 7px; font-size: 17px; line-height: 1.4; }
  .direction-a [data-view="home"] .statement-layout p { font-size: 12px; line-height: 1.65; }
  .direction-a [data-view="home"] .statement-layout a { min-height: 44px; margin-top: 4px; font-size: 12px; }
  .direction-a [data-view="home"] .studio-work { padding-top: 24px; }
  .direction-a [data-view="home"] .studio-section-head { margin-bottom: 24px; gap: 14px; }
  .direction-a [data-view="home"] .studio-section-head h2 { font-size: 30px; line-height: 1.2; }
  .direction-a [data-view="home"] .studio-work .project-caption h3 { font-size: 13px; line-height: 1.35; }
  .direction-a [data-view="home"] .showcase-archive .project-caption h3 { font-size: 13px; }
  .direction-a [data-view="home"] .studio-people { padding: 26px 0 32px; }
  .direction-a [data-view="home"] .team-section-intro { min-height: 0; padding: 0 0 20px; grid-template-columns: 1fr; gap: 10px; }
  .direction-a [data-view="home"] .team-section-intro h2 { font-size: 24px; line-height: 1.2; }
  .direction-a [data-view="home"] .team-section-intro p { grid-column: 1; text-align: left; font-size: 8px; }
  .direction-a [data-view="home"] .team-dossier-index > header { padding: 20px 18px; }
  .direction-a [data-view="home"] .team-dossier-index h2 { font-size: 21px; line-height: 1.25; }
  .direction-a [data-view="home"] .team-dossier-index [data-team-intro] { margin-top: 12px; max-width: none; }
  .direction-a [data-view="home"] .team-dossier-tab { min-height: 52px; }
  .direction-a [data-view="home"] .team-dossier-view { padding: 22px 18px; grid-template-rows: auto auto auto; }
  .direction-a [data-view="home"] .team-dossier-view h3 { margin-top: 10px; font-size: 23px; line-height: 1.25; }
  .direction-a [data-view="home"] .team-dossier-avatar { width: 64px; }
  .direction-a [data-view="home"] .team-dossier-bio { margin: 22px 0; font-size: 13px; line-height: 1.75; }
  .direction-a [data-view="home"] .studio-services.workflow-section { padding: 28px 0 30px; }
  .direction-a [data-view="home"] .workflow-heading { grid-template-columns: minmax(0, 1fr) 90px; gap: 12px; padding-bottom: 18px; }
  .direction-a [data-view="home"] .workflow-title h2 { font-size: 21px; line-height: 1.3; }
  .direction-a [data-view="home"] .workflow-title p { font-size: 12px; line-height: 1.65; }
  .direction-a [data-view="home"] .workflow-duration strong { font-size: 17px; }
  .direction-a [data-view="home"] .workflow-orbit-stage { --orbit-size: 240px; --orbit-radius: 96px; }
  .direction-a [data-view="home"] .workflow-orbit-node { width: 48px; min-height: 48px; }
  .direction-a [data-view="home"] .workflow-orbit-center { font-size: 26px; }
  .direction-a [data-view="home"] .workflow-orbit-layout { gap: 18px; padding-top: 20px; }
  .direction-a [data-view="home"] .workflow-orbit-copy { padding-top: 14px; }
  .direction-a [data-view="home"] .workflow-orbit-copy h3 { font-size: 24px; line-height: 1.25; margin-bottom: 18px; }
  .direction-a [data-view="home"] .workflow-orbit-copy dl { grid-template-columns: minmax(0, 1fr) 90px; gap: 14px; }
  .direction-a [data-view="home"] .workflow-orbit-copy dd { font-size: 12px; line-height: 1.65; }
  .direction-a [data-view="home"] .footer-a-grid { padding: 30px 18px 36px; }
  .direction-a [data-view="home"] #contact .footer-cooperation { padding: 24px 0; }
  .direction-a [data-view="home"] .cooperation-checklist { min-height: 0; }
  .direction-a [data-view="home"] .c5-heading { font-size: 20px; }
  .direction-a [data-view="home"] .c5-standards { gap: 16px; margin: 20px 0; }
  .direction-a [data-view="home"] .c5-standards > div { gap: 10px; padding-top: 12px; }
  .direction-a [data-view="home"] .c5-standards svg { width: 26px; height: 26px; }
  .direction-a [data-view="home"] .c5-standards span { font-size: 12px; }
  .direction-a [data-view="home"] .footer-clients { padding-top: 26px; }
  .direction-a [data-view="home"] .footer-clients h3 { font-size: 18px; }
  .direction-a [data-view="home"] .footer-clients > div { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px 16px; margin-top: 26px; align-items: center; }
  .direction-a [data-view="home"] .footer-clients .partner-logo { width: min(100%, 86px); height: 34px; justify-self: center; }
  .direction-a [data-view="home"] .footer-clients .partner-logo[data-logo-shape="stacked"] { width: min(100%, 68px); }
  .direction-a [data-view="home"] .footer-clients .partner-logo:is([data-logo-shape="tmall"], [data-logo-shape="prudence"]) { height: 42px; margin-block: -4px; }
  .direction-a [data-view="home"] .footer-contact-strip { padding: 28px 18px 32px; }
  .direction-a [data-view="home"] .footer-contact-main { margin-top: 24px; gap: 28px; }
  .direction-a [data-view="home"] .footer-contact-main h2 { font-size: 26px; line-height: 1.15; }
  .direction-a [data-view="home"] .footer-contact-main h2 strong { font-size: 18px; }
  .direction-a [data-view="home"] :is(.team-dossier-index [data-team-intro], .c5-intro, .c5-detail) { font-size: 12px; line-height: 1.75; }
}