/* Mobile UX stabilization. Loaded after page styles so responsive fixes stay predictable. */

@media (max-width: 991.98px) {
  html,
  body,
  .fargah-viewer-stage,
  .fargah-viewer__device,
  .fargah-viewer__screen,
  .fargah-viewer__screen > main {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  html,
  body,
  .fargah-viewer-stage,
  .fargah-viewer__screen {
    overflow-x: clip;
  }

  .fargah-viewer__device,
  .fargah-viewer__screen {
    justify-self: stretch;
  }

  .fargah-header__inner,
  .fargah-header__end,
  .fargah-logo,
  .fargah-mobile-nav,
  main,
  main > *,
  main .fargah-container {
    min-width: 0;
  }

  .fargah-mobile-nav-panel {
    max-height: calc(100svh - 112px);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(228, 196, 122, 0.45) transparent;
    background: #080807;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  .fargah-mobile-nav a {
    min-height: 46px;
    touch-action: manipulation;
  }

  .fargah-mobile-nav__group {
    background: rgba(255, 255, 255, 0.018);
  }

  .ai-support {
    left: max(10px, env(safe-area-inset-left));
    bottom: max(10px, env(safe-area-inset-bottom));
    max-width: calc(100vw - 20px);
  }

  .ai-support__toggle {
    width: 50px;
    height: 50px;
  }

  .ai-support__icon {
    width: 40px;
  }

  .ai-support__panel {
    width: min(360px, calc(100vw - 20px));
    height: min(72dvh, 540px);
    max-height: calc(100dvh - 24px);
  }
}

@media (max-width: 767.98px) {
  :root {
    --section-padding-mobile: 54px;
  }

  .fargah-viewer-stage {
    padding: 8px;
  }

  .fargah-viewer__device {
    min-height: calc(100svh - 16px);
  }

  .fargah-viewer__screen {
    min-height: calc(100svh - 18px);
    background:
      radial-gradient(circle at 82% 8%, rgba(200, 164, 93, 0.075), transparent 28rem),
      radial-gradient(circle at 14% 42%, rgba(221, 232, 198, 0.035), transparent 24rem),
      linear-gradient(180deg, #050505 0%, #090806 48%, #050505 100%) !important;
  }

  [data-theme="light"] .fargah-viewer__screen {
    background:
      radial-gradient(circle at 82% 8%, rgba(169, 121, 36, 0.09), transparent 26rem),
      linear-gradient(180deg, #eef4df 0%, #f8f5f0 48%, #eef4df 100%) !important;
  }

  .fargah-liquid-ether {
    opacity: 0.68;
  }

  .motion-grid {
    opacity: 0.28;
  }

  .motion-particles {
    opacity: 0.42;
  }

  .fargah-ambient {
    opacity: 0.42;
  }

  .fargah-viewer__screen .fargah-header,
  .fargah-viewer__screen .fargah-header--overlay {
    width: calc(100% - 16px);
    margin-top: 8px;
  }

  .fargah-header__inner {
    min-height: 66px;
    padding-inline: 10px;
  }

  .fargah-header__end {
    gap: 4px;
    padding: 3px;
  }

  .mobile-menu-toggle,
  .header-icon-btn,
  .theme-toggle,
  .locale-dropdown__trigger {
    min-width: 38px;
    min-height: 38px;
  }

  .header-icon-btn[data-search-toggle],
  .mobile-menu-toggle {
    width: 38px;
    height: 38px;
  }

  .fargah-logo,
  .fargah-logo--image-only {
    width: min(39vw, 150px) !important;
    max-width: min(39vw, 150px);
  }

  .fargah-mobile-nav-panel {
    inset-inline: 0;
    top: calc(100% + 6px);
    border-radius: 18px;
  }

  .fargah-mobile-nav-panel .fargah-container {
    padding: 10px;
  }

  .fargah-mobile-nav a {
    padding: 10px 13px;
    border-radius: 13px;
    font-size: 0.82rem;
  }

  .page-hero {
    padding-top: clamp(52px, 13vw, 72px);
    padding-bottom: clamp(46px, 12vw, 66px);
  }

  .page-hero__title,
  .section-title,
  main h1,
  main h2,
  main h3 {
    max-width: 100%;
    overflow-wrap: break-word;
  }

  .section-padding {
    padding-block: var(--section-padding-mobile);
  }

  .btn-fargah:not(.studio-hero__actions .btn-fargah) {
    min-height: 44px;
  }

  .sanjab-form,
  .consultation-panel,
  .contact-design-cta__panel {
    width: 100%;
    max-width: 100%;
  }

  .sanjab-form input:not([type="checkbox"]):not([type="radio"]),
  .sanjab-form select,
  .sanjab-form textarea {
    width: 100%;
    min-height: 50px;
    font-size: 16px;
  }

  .sanjab-form textarea {
    min-height: 132px;
  }

  .catalog-page__download-card,
  .quick-intro-download-card {
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
    padding: 18px;
  }

  .catalog-page__download-card > div,
  .quick-intro-download-card > div {
    width: 100%;
  }

  .catalog-page__download-card .btn-fargah,
  .quick-intro-download-card .btn-fargah {
    width: 100%;
    justify-content: center;
  }

  .quick-intro-section,
  .quick-intro-feature-section {
    padding-block: 28px;
  }

  .quick-intro-section__head {
    margin-bottom: 16px;
  }

  .quick-intro-section__head h1,
  .quick-intro-section__head h2,
  .quick-intro-feature__copy h2 {
    white-space: normal;
    text-wrap: balance;
  }

  .quick-intro-feature__copy p,
  .quick-intro-section__head p {
    line-height: 1.9;
  }

  .quick-intro-feature__media,
  .quick-intro-video-card,
  .quick-intro-guide__window,
  .quick-intro-catalog-viewer {
    border-radius: 16px;
  }

  .quick-intro-feature__media {
    padding: 6px;
  }

  .quick-intro-catalog-viewer__tabs {
    scroll-snap-type: inline mandatory;
    overscroll-behavior-inline: contain;
  }

  .quick-intro-catalog-viewer__tabs button {
    scroll-snap-align: start;
  }

  .catalog-live-section--home {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
  }

  .ai-support__toggle {
    width: 46px;
    height: 46px;
  }

  .ai-support__icon {
    width: 37px;
  }

  .ai-support__badge {
    min-width: 20px;
    height: 20px;
    top: -5px;
    inset-inline-end: -4px;
  }
}

@media (max-width: 430px) {
  .fargah-header__end {
    max-width: 61vw;
  }

  .locale-dropdown__trigger {
    padding-inline: 6px;
  }

  .fargah-mobile-nav-panel {
    max-height: calc(100svh - 106px);
  }

  .quick-intro-guide,
  .quick-intro-project-gallery,
  .quick-intro-download-grid,
  .quick-intro-engineer-grid {
    gap: 14px;
  }
}

@media (min-width: 768px) and (max-width: 991.98px) and (orientation: landscape) {
  .fargah-viewer-stage {
    padding: 6px;
  }

  .fargah-viewer__device,
  .fargah-viewer__screen {
    min-height: calc(100svh - 12px);
    border-radius: 20px;
  }

  .fargah-viewer__screen .fargah-header,
  .fargah-viewer__screen .fargah-header--overlay {
    width: calc(100% - 12px);
    margin-top: 6px;
  }

  .fargah-header__inner {
    min-height: 60px;
  }

  .fargah-mobile-nav-panel {
    max-height: calc(100svh - 82px);
  }

  .quick-intro-section,
  .quick-intro-feature-section,
  .section-padding {
    padding-block: 42px;
  }

  .quick-intro-project-gallery {
    gap: 14px;
  }

  .ai-support__panel {
    height: calc(100dvh - 20px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .fargah-liquid-ether {
    display: none;
  }
}