/* Shared phone scale for the homepage and Social Media Support. */
@media (max-width: 700px) {
  :root {
    --button-text: 17px;
    --muted: rgba(229,228,226,.64);
    --mobile-card-radius: 24px;
  }
  body { font-size: 17px; }
  .social-page main p:not(.eyebrow):not(.brand-by):not(.game-hero-lead) { line-height: 1.6; }
  body .game-hero-title,
  body .game-home h2,
  body.social-page h2 {
    font-size: 32px;
    line-height: 1.15;
    letter-spacing: -.035em;
  }
  .chapter .eyebrow,
  .game-hero-copy .globe-kicker,
  .game-home .folio-kicker,
  .game-home .result-kicker-top {
    color: var(--muted);
    font-size: 15px;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 1.5;
    text-transform: none;
    margin-bottom: 20px;
  }
  .chapter.paper-wash .eyebrow { color: #63666b; }
  body .game-hero-lead,
  .game-home .lead,
  .game-home .game-work-steps,
  .game-home .game-folio-desc,
  .game-home .past-work-tag,
  .game-home .why-card p,
  .game-home .game-pack .pack-blurb,
  .game-home .game-pack .result-unit,
  .game-home .ready-lead,
  .social-page .section-head > p,
  .social-page .intro-copy > p:not(.eyebrow),
  .social-page .strength-list p,
  .social-page .work-card > p:not(.eyebrow),
  .social-page .branding-project-head > p,
  .social-page .case-study-step p,
  .social-page .process-item > p,
  .social-page .contact-copy,
  .social-page .package-description {
    font-size: 17px;
    line-height: 1.6;
  }
  .game-home .game-hero-lead,
  .game-home .lead,
  .game-home .game-folio-desc { color: var(--muted); }
  body .game-home .chapter,
  body.social-page .chapter {
    padding: 48px 20px;
  }
  body .game-home .chapter.cover-chapter.game-cover,
  body.social-page .chapter.cover-chapter.game-cover {
    padding: max(100px, calc(80px + env(safe-area-inset-top))) 20px 48px;
  }
  .social-page .hero-intro { gap: 28px; margin-bottom: 48px; }
  .social-page .service-overview { gap: 8px 20px; }
  .social-page .service-overview li { font-size: 17px; line-height: 1.6; }
  .social-page .work-grid,
  .social-page .work-grid-secondary { gap: 32px; }
  .social-page .work-card,
  .social-page .branding-project,
  .social-page .package,
  .game-home .game-folio-card,
  .game-home .game-pack,
  .game-home .why-card {
    padding: 32px;
    border-radius: var(--mobile-card-radius);
  }
  .social-page .work-card,
  .social-page .branding-project,
  .game-home .game-folio-card { background: #18191a; }
  .social-page .branding-project { border-top: 0; }
  .social-page .portfolio-image,
  .social-page .hero-art img,
  .social-page .team-photo img,
  .social-page .case-study-photo img,
  .game-home .event-shot,
  .game-home .game-folio-media { border-radius: var(--mobile-card-radius); }
  .social-page .work-card h3,
  .social-page .branding-project-head h3,
  .social-page .case-study-step h3,
  .social-page .package h3,
  .game-home .game-folio-title,
  .game-home .why-card h3,
  .game-home .game-pack .result-plan {
    font-size: 20px;
    line-height: 1.3;
    font-weight: 300;
    letter-spacing: -.02em;
    text-transform: none;
  }
  .game-home .globe-try,
  .game-home .globe-ask,
  .game-home .game-hero-actions .globe-try,
  .game-home .game-hero-actions .globe-ask,
  .game-home .pack-btn,
  .game-home .ready-btn,
  .social-page .globe-try,
  .social-page .globe-ask,
  .social-page .game-hero-actions .globe-try,
  .social-page .game-hero-actions .globe-ask,
  .social-page .package .globe-ask,
  body .menu-contact {
    min-height: 48px;
    padding: 0 20px;
    border-radius: 999px;
    font-size: 17px;
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: 0;
    text-transform: none;
  }
  body .menu-btn {
    top: max(12px, env(safe-area-inset-top));
    right: 16px;
    width: 56px;
    height: 56px;
    padding: 14px;
    align-items: center;
    border-radius: 50%;
    background: #202122;
    mix-blend-mode: normal;
  }
  body .menu-btn span { margin-left: 0; }
  body .menu-btn span:first-child,
  body .menu-btn span:last-child { width: 24px; }
  .menu-panel nav { gap: 2px; }
  .menu-panel button { min-height: 48px; }
}