/* Focused overrides for reliable touch, media, and modal behavior. */
.media-preparing .hero-mosaic-track { animation-play-state: paused !important; }
html[data-theme] .experience .site-loader.is-preparing {
  display: grid !important;
  place-content: center;
  justify-items: center;
  background: var(--dark) !important;
  color: var(--dark-ink) !important;
  transition: opacity 600ms cubic-bezier(.22, 1, .36, 1), visibility 0s 600ms;
  animation: none !important;
}
html[data-theme] .experience .site-loader::before { content: none; }
html[data-theme] .experience .site-loader img { content: url('./assets/logo/idea-logo-light.svg'); }
html[data-theme] .experience .site-loader > span { background: var(--dark-line) !important; }
.site-loader.is-preparing.is-dismissed {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  html[data-theme] .experience .site-loader.is-preparing { transition: none; }
}

.experience,
.experience main,
.experience footer {
  max-width: 100%;
  overflow-x: clip;
}

.experience .hero-mosaic,
.experience .case-deck {
  touch-action: pan-y;
  overscroll-behavior-x: contain;
}

.experience .hero-mosaic video,
.experience .impact-bar video,
.ads-video-panel video {
  display: block;
  max-width: 100%;
}

.experience .hero-mosaic video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.experience .hero-mosaic figure {
  contain: layout paint;
}

.experience .hero-mosaic-lane,
.experience .hero-mosaic-track {
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.experience .ads-slider-viewport {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  touch-action: pan-x pan-y;
}

.experience .ads-slider-viewport::-webkit-scrollbar {
  display: none;
}

.ads-video-panel video {
  width: 100%;
  max-height: 78svh;
  object-fit: contain;
}

.experience .nav-actions :is(.language-button, .theme-button, .menu-button) {
  box-sizing: border-box;
  flex: 0 0 44px;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  border: 1px solid var(--nav-line) !important;
  background: var(--nav-soft) !important;
  color: var(--nav-ink) !important;
  -webkit-tap-highlight-color: transparent;
}

.experience .nav-actions :is(.language-button, .theme-button, .menu-button):focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 3px;
}

.experience :where(
  .ads-gallery-control,
  .case-nav,
  .ads-video-close,
  .ads-sound-toggle,
  .poster-viewer-close,
  .poster-viewer-nav,
  .photo-lightbox-close,
  .photo-lightbox-nav
) {
  min-width: 44px;
  min-height: 44px;
  -webkit-tap-highlight-color: transparent;
}

html:where(.menu-open, .ads-video-open, .poster-viewer-open, .photo-lightbox-open),
html:where(.menu-open, .ads-video-open, .poster-viewer-open, .photo-lightbox-open) body {
  overscroll-behavior: none;
}

body.menu-open,
html.ads-video-open body,
html.poster-viewer-open body,
html.photo-lightbox-open body {
  overflow: hidden;
}

.experience .mobile-nav,
.experience .ads-video-modal,
.experience .poster-viewer,
.experience .photo-lightbox {
  box-sizing: border-box;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

@media (max-width: 680px) {
  body {
    max-width: 100%;
    overflow-x: hidden;
    overflow-wrap: break-word;
  }

  .experience main > section[id] {
    scroll-margin-top: calc(84px + env(safe-area-inset-top)) !important;
  }

  .experience .floating-header {
    box-sizing: border-box;
    top: max(8px, env(safe-area-inset-top)) !important;
    inset-inline-start: max(8px, env(safe-area-inset-left)) !important;
    inset-inline-end: max(8px, env(safe-area-inset-right)) !important;
  }

  .experience .nav-actions {
    min-width: 0;
    gap: 4px;
  }

  html .experience #mobileNav {
    top: calc(76px + env(safe-area-inset-top)) !important;
    max-height: calc(100dvh - 92px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
    padding-top: 16px !important;
    background: var(--paper) !important;
    color: var(--nav-ink) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    max-width: calc(100vw - 16px);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-bottom: max(20px, env(safe-area-inset-bottom));
    touch-action: pan-y;
  }

  .experience .hero-mosaic {
    min-height: 62svh;
  }

  .experience .case-deck {
    user-select: none;
    -webkit-user-select: none;
  }

  .experience :is(.ads-video-modal, .poster-viewer, .photo-lightbox) {
    max-height: 100dvh;
    min-height: 100svh;
    padding-top: max(72px, calc(16px + env(safe-area-inset-top)));
    padding-bottom: max(16px, env(safe-area-inset-bottom));
    touch-action: pan-y;
  }

  .experience .ads-video-modal {
    overflow-y: auto;
    padding-inline: max(12px, env(safe-area-inset-left)) max(12px, env(safe-area-inset-right));
  }

  .experience .ads-video-panel video {
    max-height: 70svh;
  }

  .experience .poster-viewer,
  .experience .photo-lightbox {
    overflow: hidden;
  }
}

@media (prefers-reduced-motion: reduce) {
  .experience .hero-mosaic-lane,
  .experience .hero-mosaic-track {
    transform: none !important;
    transition: none !important;
  }

  .reveal-local {
    opacity: 1 !important;
    transform: none !important;
  }
}

html,
body {
  min-width: 0;
  overflow-x: clip;
}

.experience,
.experience main,
.experience section,
.experience footer,
.experience .hero-mosaic,
.experience .hero-mosaic-lane,
.experience .hero-mosaic-track {
  min-width: 0;
  max-width: 100%;
}

.experience .hero-mosaic {
  contain: layout paint;
  overflow: clip;
}

@media (max-width: 680px) {
  .experience .nysa-hero .hero-mosaic-tile video {
    transform: none !important;
  }
}

html {
  scroll-padding-top: calc(84px + env(safe-area-inset-top));
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

.experience {
  font-synthesis: none;
}

.experience :where(a, button, input, select, textarea) {
  touch-action: manipulation;
}

.experience :where(a, button, input, select, textarea):focus-visible {
  outline: 3px solid var(--focus-ring, #7d78f9);
  outline-offset: 3px;
}

.experience :where(img, video) {
  max-width: 100%;
}

.experience .photo-gallery,
.experience .clients-section,
.experience .identity-cases {
  content-visibility: auto;
  contain-intrinsic-size: 900px;
}

@media (max-width: 680px) {
  .experience .photo-gallery,
  .experience .clients-section,
  .experience .identity-cases {
    content-visibility: visible;
    contain-intrinsic-size: none;
  }
}

/* Avoid retaining large backing surfaces across the long page in WebKit. */
html.ios-memory-safe .experience *,
html.ios-memory-safe .experience *::before,
html.ios-memory-safe .experience *::after {
  will-change: auto !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html.ios-memory-safe .experience :where(.reveal-local, .reveal) {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
}
html.ios-memory-safe {
  scroll-behavior: auto !important;
}
html.ios-memory-safe .case-card.is-hidden {
  display: none !important;
}
html.ios-memory-safe #mobileNav {
  transition: none !important;
}

@media (forced-colors: active) {
  .experience :where(a, button, input, select, textarea):focus-visible {
    outline: 2px solid CanvasText;
  }
}

.experience .nysa-hero .hero-actions a b {
  display: grid;
  place-items: center;
  overflow: hidden;
  font-size: 0;
  line-height: 0;
}

.experience .nysa-hero .hero-actions a b svg {
  display: block;
  width: 17px;
  height: 17px;
  overflow: visible;
}

.experience .nysa-hero .hero-actions a b path {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
