/* Input and viewport refinements. The approved desktop design remains unchanged. */
:root {
  --page-gutter: 56px;
  --safe-left: env(safe-area-inset-left, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
}
html { scroll-padding-top: calc(var(--sticky-header-height, 90px) + 20px); }
.container, .inner-page .container {
  width: calc(100% - max(var(--page-gutter), var(--safe-left)) - max(var(--page-gutter), var(--safe-right)));
}
.site-header { padding-top: env(safe-area-inset-top, 0px); }
body:not(.inner-page) .site-header { margin-bottom: calc(-91px - env(safe-area-inset-top, 0px)); }
.hero-restored { padding-top: calc(91px + env(safe-area-inset-top, 0px)); }
section[id], button[id^="service-"], [data-step], #draft-result { scroll-margin-top: 12px; }
.header-inner > *, .desktop-nav, .mega-menu > *, .mega-tabs [role="tab"] > span,
.brand-band-heading > p, .footer-bottom > * { min-width: 0; }
.menu-toggle, .motion-control { flex-shrink: 0; }
.mobile-nav {
  padding-left: max(24px, var(--safe-left));
  padding-right: max(24px, var(--safe-right));
  padding-bottom: max(32px, env(safe-area-inset-bottom, 0px));
}
.mobile-nav a, .mobile-nav summary, .mega-menu a { overflow-wrap: anywhere; }
.site-header .mega-menu {
  max-height: var(--menu-available-height, calc(100dvh - var(--nav-bottom, 110px) - 12px));
  overscroll-behavior-y: contain;
}
.site-footer { height: auto; min-height: 0; }
.footer-bottom { padding-bottom: max(19px, env(safe-area-inset-bottom, 0px)); }

/* Native vertical scrolling and pinch zoom continue through swipeable artwork. */
.swipe-enabled { touch-action: pan-y pinch-zoom; }
.swipe-enabled img { -webkit-user-drag: none; }
.brand-marquee.is-manual {
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  touch-action: auto;
}
.brand-marquee.is-manual::-webkit-scrollbar { display: none; }
.brand-marquee.is-manual .brand-track { animation: none; transform: none; }

@media (max-width: 1150px) { :root { --page-gutter: 36px; } }
@media (max-width: 900px) {
  body:not(.inner-page) .site-header { margin-bottom: calc(-79px - env(safe-area-inset-top, 0px)); }
  .hero-restored { padding-top: calc(79px + env(safe-area-inset-top, 0px)); }
  .hero-restored .hero-intro .hero-copy {
    width: calc(100% - max(24px, var(--safe-left)) - max(24px, var(--safe-right)));
  }
}
@media (max-width: 600px) {
  :root { --page-gutter: 20px; }
  .inner-page { --page-gutter: 18px; }
  body:not(.inner-page) .site-header { margin-bottom: calc(-75px - env(safe-area-inset-top, 0px)); }
  .hero-restored { padding-top: calc(75px + env(safe-area-inset-top, 0px)); }
  .hero-restored .hero-intro .hero-copy {
    width: calc(100% - max(18px, var(--safe-left)) - max(18px, var(--safe-right)));
  }
  .brand-band-heading { gap: 12px; }
  .brand-band-heading > p { flex: 1; }
  .page-form-row, .form-row, .step-actions, .draft-actions { min-width: 0; }
  .draft-panel textarea { font-size: 16px; }
  .footer-bottom > div { width: 100%; flex-wrap: wrap; }
}
/* Narrow cover screens and split-screen windows. */
@media (max-width: 340px) {
  .header-inner { gap: 12px; }
  .brand > .brand-lockup { max-width: calc(100vw - 112px); }
  .hero-restored .hero-intro h1 { font-size: clamp(27px, 10vw, 32px); }
  .inner-page h1, .inner-page .family-hero-grid h1, .inner-page .detail-hero h1,
  .inner-page .industry-page-grid h1, .inner-page .contact-page h1,
  .inner-page .project-start-intro h1 { font-size: clamp(29px, 11.5vw, 39px); }
  .page-cta h2 { font-size: 34px; }
  .project-form-wrap, .contact-form-wrap { padding-inline: 18px; }
  .about-stats { grid-template-columns: minmax(0, 1fr); }
  .about-stats > div, .about-stats > div:first-child { border-left: 0; padding: 12px 0; }
  .studio-brand > span { font-size: clamp(32px, 12vw, 44px); }
  .studio-visual { padding-inline: 20px; }
  .button { gap: 14px; padding-inline: 18px; }
}
/* Touch targets grow only on devices with a coarse input, including hybrids. */
@media (any-pointer: coarse) {
  .brand-marquee { overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; }
  .brand-marquee::-webkit-scrollbar { display: none; }
  .motion-control, .social-links a, .industry-navigation button { min-width: 44px; min-height: 44px; }
  .footer-bottom a, .footer-motion, .text-link, .breadcrumbs a,
  .filter-buttons button { min-height: 44px; }
  .footer-bottom a, .footer-motion { min-width: 44px; }
  .footer-grid > div > a:not(.footer-brand), .mobile-services a {
    min-height: 44px; display: flex; align-items: center;
  }
  input:not([type="checkbox"]):not([type="radio"]), textarea, select { font-size: max(16px, 1em); }
  .button:active, .menu-toggle:active, .motion-control:active { opacity: .8; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
