/* ProAI Expert v123 — Mobile Behavior Pass */
@media (max-width: 1100px), ((max-height: 540px) and (orientation: landscape)) {
  html, body {
    overflow-x: clip !important;
    overscroll-behavior-x: none !important;
    -webkit-text-size-adjust: 100%;
  }

  body {
    min-height: 100svh;
  }

  [id] {
    scroll-margin-top: calc(var(--header-h, 78px) + 20px) !important;
  }

  a,
  button,
  input,
  textarea,
  select,
  summary {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
  }

  header {
    height: var(--header-h, 78px) !important;
    transition: transform 0.28s ease, opacity 0.28s ease !important;
    will-change: transform;
  }

  body.mobile-nav-open header,
  body.mobile-nav-open header.header-hidden {
    transform: translateY(0) !important;
  }

  .header-container {
    min-height: var(--header-h, 78px) !important;
    padding-left: max(16px, env(safe-area-inset-left)) !important;
    padding-right: max(16px, env(safe-area-inset-right)) !important;
    gap: 12px !important;
  }

  .logo-block {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    gap: 10px !important;
  }

  .logo-text {
    max-width: 100%;
    font-size: clamp(16px, 5vw, 24px) !important;
    letter-spacing: -0.04em !important;
    line-height: 0.94 !important;
    white-space: nowrap;
  }

  .header-actions {
    flex: 0 0 auto !important;
    gap: 10px !important;
    margin-left: auto !important;
  }

  .lang-link,
  .mobile-menu-toggle,
  .start-btn,
  .f-cta-btn,
  .split-btn,
  .ghost-btn,
  .secondary-btn,
  .card-link,
  .read-more,
  .back-link,
  .hero-actions a,
  .article-cta-actions a,
  .f-socials a,
  .f-link,
  .site-nav.is-open a {
    min-height: 44px !important;
  }

  .lang-link,
  .mobile-menu-toggle,
  .f-socials a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .site-nav.is-open {
    padding-left: max(20px, env(safe-area-inset-left)) !important;
    padding-right: max(20px, env(safe-area-inset-right)) !important;
    padding-bottom: calc(32px + env(safe-area-inset-bottom)) !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    gap: 8px !important;
  }

  .site-nav.is-open a {
    width: min(100%, 440px) !important;
    margin-inline: auto !important;
    display: flex !important;
    align-items: center !important;
    padding: 12px 0 !important;
    line-height: 1.08 !important;
  }

  .hero-left p,
  .side-desc,
  .process-left p,
  .f-link,
  .f-copy,
  .article-body p,
  .article-body li {
    overflow-wrap: anywhere;
  }

  .hero-left > div:last-child,
  .article-cta-actions,
  .hero-actions {
    row-gap: 10px !important;
  }

  .article-cta,
  .f-cta,
  .f-contact-block,
  .manifest-card,
  .step-card,
  .panel,
  .contact-card,
  .contact-shell,
  .article-callout {
    border-radius: min(28px, 5vw) !important;
  }

  body.mobile-optimized .device-phone,
  body.mobile-optimized .phone-screen,
  body.mobile-optimized .phone-image,
  body.mobile-optimized .phone-content,
  body.mobile-optimized .monitor-screen,
  body.mobile-optimized .monitor-inner,
  body.mobile-optimized .screen-content {
    pointer-events: none !important;
  }

  body.mobile-optimized .case-study-area,
  body.mobile-optimized .device-area,
  body.mobile-optimized .case-area {
    touch-action: pan-y pinch-zoom !important;
  }

  footer {
    padding-bottom: calc(28px + env(safe-area-inset-bottom)) !important;
  }

  .footer-container {
    padding-left: max(18px, env(safe-area-inset-left)) !important;
    padding-right: max(18px, env(safe-area-inset-right)) !important;
  }

  .f-top {
    align-items: start !important;
  }

  .f-contact-grid,
  .f-contact-block {
    min-width: 0 !important;
  }

  .f-label {
    margin-bottom: 10px !important;
  }

  .f-link {
    display: inline-block !important;
    max-width: 100% !important;
    line-height: 1.38 !important;
    word-break: break-word;
    overflow-wrap: anywhere;
  }

  .f-link.subtle-link {
    line-height: 1.45 !important;
  }

  .f-bottom {
    align-items: start !important;
  }

  .f-copy {
    max-width: 100% !important;
  }

  body.footer-primary-mobile footer {
    padding-top: 84px !important;
  }

  body.footer-primary-mobile .f-backmark {
    top: 20px !important;
    font-size: clamp(76px, 20vw, 158px) !important;
  }

  body.footer-primary-mobile .f-top {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    margin-bottom: 32px !important;
  }

  body.footer-primary-mobile .f-cta h2 {
    font-size: clamp(36px, 11vw, 60px) !important;
    line-height: 0.95 !important;
    letter-spacing: -0.04em !important;
  }

  body.footer-primary-mobile .f-contact-grid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  body.footer-primary-mobile .f-bottom {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-areas: "logo" "socials" "copy" !important;
    gap: 10px !important;
    justify-items: start !important;
  }

  body.footer-primary-mobile .f-bottom .logo-block {
    grid-area: logo !important;
    transform: none !important;
    opacity: 0.42 !important;
  }

  body.footer-primary-mobile .f-socials {
    grid-area: socials !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
  }

  body.footer-primary-mobile .f-copy {
    grid-area: copy !important;
    text-align: left !important;
    justify-self: start !important;
  }

  body.footer-secondary-mobile footer {
    padding-top: 76px !important;
  }

  body.footer-secondary-mobile .f-backmark {
    top: 18px !important;
    font-size: clamp(66px, 18vw, 132px) !important;
    opacity: 0.9;
  }

  body.footer-secondary-mobile .f-top {
    grid-template-columns: 1fr !important;
    gap: 22px !important;
    margin-bottom: 28px !important;
  }

  body.footer-secondary-mobile .f-cta h2 {
    font-size: clamp(32px, 10vw, 52px) !important;
    line-height: 0.97 !important;
    letter-spacing: -0.04em !important;
  }

  body.footer-secondary-mobile .f-contact-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  body.footer-secondary-mobile .f-bottom {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    justify-items: start !important;
  }

  body.footer-secondary-mobile .f-bottom .logo-block {
    transform: none !important;
    opacity: 0.4 !important;
  }

  body.footer-secondary-mobile .f-socials {
    gap: 12px !important;
    flex-wrap: wrap !important;
  }

  body.footer-secondary-mobile .f-copy {
    text-align: left !important;
    justify-self: start !important;
  }
}

@media (max-width: 1100px) and (orientation: landscape), (max-height: 540px) and (orientation: landscape) {
  .site-nav.is-open {
    justify-content: center !important;
    padding-top: max(18px, 4svh) !important;
    padding-bottom: calc(20px + env(safe-area-inset-bottom)) !important;
  }

  .site-nav.is-open a {
    font-size: clamp(18px, 3vw, 24px) !important;
    padding: 8px 0 !important;
  }

  body.footer-primary-mobile footer,
  body.footer-secondary-mobile footer {
    padding-top: 66px !important;
    padding-bottom: calc(22px + env(safe-area-inset-bottom)) !important;
  }

  body.footer-primary-mobile .f-backmark {
    font-size: clamp(64px, 12vw, 126px) !important;
    top: 12px !important;
  }

  body.footer-secondary-mobile .f-backmark {
    font-size: clamp(58px, 11vw, 110px) !important;
    top: 10px !important;
  }

  body.footer-primary-mobile .f-top,
  body.footer-secondary-mobile .f-top {
    grid-template-columns: minmax(0, 1fr) minmax(230px, 0.84fr) !important;
    gap: 24px !important;
    margin-bottom: 22px !important;
  }

  body.footer-primary-mobile .f-contact-grid,
  body.footer-secondary-mobile .f-contact-grid {
    gap: 14px !important;
  }

  body.footer-primary-mobile .f-bottom,
  body.footer-secondary-mobile .f-bottom {
    display: grid !important;
    grid-template-columns: auto auto 1fr !important;
    gap: 12px 18px !important;
    align-items: end !important;
  }

  body.footer-primary-mobile .f-copy,
  body.footer-secondary-mobile .f-copy {
    text-align: right !important;
    justify-self: end !important;
  }
}

@media (max-width: 640px) {
  .header-container {
    padding-left: max(14px, env(safe-area-inset-left)) !important;
    padding-right: max(14px, env(safe-area-inset-right)) !important;
    gap: 10px !important;
  }

  .logo-cube-container {
    width: 24px !important;
    height: 24px !important;
  }

  .logo-text {
    font-size: clamp(15px, 6.5vw, 20px) !important;
  }

  .mobile-menu-toggle {
    width: 42px !important;
    height: 42px !important;
    flex-basis: 42px !important;
  }

  .lang-link {
    font-size: 12px !important;
  }

  .article-shell,
  .shell,
  .footer-container,
  .hero-content,
  .manifest-container,
  .process-container,
  .insights-shell,
  .case-container {
    padding-left: max(16px, env(safe-area-inset-left)) !important;
    padding-right: max(16px, env(safe-area-inset-right)) !important;
  }

  body.footer-primary-mobile .f-link,
  body.footer-secondary-mobile .f-link {
    font-size: clamp(16px, 5vw, 22px) !important;
  }
}