/* Asmaneez mobile UX and rendering improvements — 2026-10-21 */
@media (max-width: 767px) {
  /* Keep decorative effects from consuming animation/paint time on phones. */
  .field b {
    animation: none !important;
    will-change: auto;
  }

  .hero-schematic .ring-outer,
  .hero-schematic .ring-mid {
    animation: none !important;
  }

  /* Preserve the glass treatment with a lighter blur on smaller GPUs. */
  .site-header.is-stuck,
  .mobile-menu {
    backdrop-filter: saturate(150%) blur(12px);
    -webkit-backdrop-filter: saturate(150%) blur(12px);
  }

  video,
  iframe {
    max-inline-size: 100%;
  }

  video {
    block-size: auto;
  }
}


@media (max-width: 360px) {
  /* Longer translated hero phrases need a little less type on compact phones. */
  .hero h1.display {
    font-size: clamp(2.4rem, 12vw, 2.9rem);
    letter-spacing: -0.04em;
  }
}

@media (hover: none) and (pointer: coarse) {
  /* Comfortable tap targets without changing desktop sizing. */
  button:not(.home-project__dot),
  input[type="button"],
  input[type="submit"],
  input[type="reset"],
  select {
    min-block-size: 2.75rem;
    touch-action: manipulation;
  }

  .btn {
    min-block-size: 2.75rem;
  }

  /* Keep carousel controls easy to tap on narrow screens. */
  .home-project__controls {
    grid-template-columns: 2.75rem minmax(0, 1fr) 2.75rem;
  }

  .home-project__arrow,
  .home-project__arrow[data-home-project-prev],
  .home-project__arrow[data-home-project-next] {
    inline-size: 2.75rem !important;
    block-size: 2.75rem !important;
    min-inline-size: 2.75rem !important;
    min-block-size: 2.75rem !important;
  }

  .home-project__dots {
    gap: 0.95rem !important;
  }

  .home-project__dot {
    position: relative;
    touch-action: manipulation;
  }

  .home-project__dot::after {
    content: "";
    position: absolute;
    inset: -0.5rem;
    background: transparent;
  }

  [data-case-prev],
  [data-case-next],
  [data-work-prev],
  [data-work-next] {
    inline-size: 2.75rem;
    block-size: 2.75rem;
    min-inline-size: 2.75rem;
    min-block-size: 2.75rem;
  }

  /* Prevent iOS Safari from zooming the page when a field receives focus. */
  input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]),
  select,
  textarea {
    font-size: 16px;
  }
}
