/* Mobile polish — complements layout.css + components.css mobile block */

@media (max-width: 900px) {
  :root {
    --header-height: 2rem;
  }

  .site-header {
    border-bottom-color: rgba(255, 255, 255, 0.06);
  }

  .header-inner {
    width: 100%;
    max-width: none;
    padding-inline: 0;
    gap: 0.25rem 0.35rem;
  }

  .brand-link {
    padding-left: 0.35rem;
  }

  .header-actions {
    padding-right: 0.35rem;
  }

  .lang-switcher__trigger {
    padding: 0.15rem 0.35rem;
  }

  /* Match section .container width (90vw) */
  .hero__content {
    width: var(--container);
    max-width: var(--container);
    left: 0;
    right: 0;
    margin-inline: auto;
    padding-inline: 0;
    box-sizing: border-box;
  }

  .hero__headline,
  .hero__intro,
  .hero__videos {
    width: 100%;
    max-width: 100%;
  }

  /* Same tagline scale as desktop */
  .hero__headline {
    font-size: clamp(1.2273rem, 2.554vw, 1.473rem);
  }

  .section-intro,
  .hero__intro,
  .lead {
    font-size: 1.275rem;
    line-height: 1.65;
  }

  .pillar p,
  .project-card__body p,
  .ad-card p {
    font-size: var(--text-prose-size);
  }

  .section-intro,
  .hero__intro {
    max-width: none;
  }

  .contact-grid {
    gap: 2rem;
  }

  #contact .contact-block dt {
    font-size: calc(var(--text-contact-label-size) * 2);
  }

  .form-submit {
    align-self: stretch;
    width: 100%;
    text-align: center;
  }

  .lead,
  .video-embed,
  .section-header {
    max-width: none;
  }
}
