/* ROZEN Clinic mobile rehabilitation — desktop remains untouched */
@media (max-width: 991px) {
  html, body { max-width: 100%; overflow-x: clip; }
  body { -webkit-text-size-adjust: 100%; }
  img, video, iframe, svg { max-width: 100%; }
  .container { width: min(100% - 32px, 720px) !important; }

  /* Compact header */
  .top { height: 34px; overflow: hidden; }
  .top .container { height: 34px !important; min-height: 34px; gap: 10px; padding: 0; justify-content: center; }
  .top .container > span { display: block; min-width: 0; max-width: calc(100% - 130px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
  .top .container > .phone-ltr { font-size: 11px; white-space: nowrap; }
  .top .footer-social, .top .rozen-email { display: none !important; }

  .header { position: sticky; top: 0; z-index: 1000; }
  .header .nav { height: 76px !important; min-height: 76px; flex-wrap: nowrap !important; gap: 10px; padding: 8px 0; }
  .header .logo { flex: 0 1 auto; min-width: 0; }
  .header .logo img { height: 54px !important; width: auto !important; max-width: 174px; object-fit: contain; }
  .header .menu, .header .mobile-menu { display: none !important; }
  .header .actions { margin-inline-start: auto; display: flex; gap: 8px; flex: 0 0 auto; }
  .header .actions > .primary { display: none !important; }
  .header .actions > .lang { display: none !important; }
  .mobile-open { display: grid !important; place-items: center; width: 46px !important; height: 46px !important; flex: 0 0 46px; padding: 0 !important; font-size: 0 !important; border-radius: 50% !important; color: var(--p); }
  .mobile-open::before { content: "☰"; font-size: 22px; line-height: 1; }

  .mobile-lang-trigger { height: 46px; min-width: 70px; padding: 0 11px; border: 1px solid var(--bd); border-radius: 999px; background: #fff; color: var(--p); font: inherit; font-weight: 900; display: inline-flex; align-items: center; justify-content: center; gap: 6px; white-space: nowrap; }
  .mobile-lang-popover { position: fixed; z-index: 1400; inset-inline-end: 16px; top: 118px; width: min(260px, calc(100vw - 32px)); max-height: min(62vh, 440px); overflow: auto; background: #fff; border: 1px solid var(--bd); border-radius: 20px; box-shadow: 0 22px 70px rgba(27,10,22,.24); padding: 8px; display: none; }
  .mobile-lang-popover.open { display: grid; }
  .mobile-lang-popover button { min-height: 48px; border: 0; border-radius: 13px; background: transparent; color: var(--p); font: inherit; font-weight: 800; text-align: start; padding: 10px 14px; display: flex; align-items: center; gap: 12px; }
  .mobile-lang-popover button:hover, .mobile-lang-popover button.active { background: #f7eef2; }

  /* Drawer navigation */
  .mobile-drawer-overlay { position: fixed; inset: 0; z-index: 1490; background: rgba(20,8,17,.55); opacity: 0; pointer-events: none; transition: opacity .25s ease; }
  .mobile-drawer-overlay.open { opacity: 1; pointer-events: auto; }
  .mobile-drawer { position: fixed; z-index: 1500; top: 0; bottom: 0; inset-inline-end: 0; width: min(88vw, 380px); background: #fff; box-shadow: -20px 0 60px rgba(0,0,0,.2); transform: translateX(105%); transition: transform .28s ease; display: flex; flex-direction: column; }
  html[dir="rtl"] .mobile-drawer { inset-inline-end: auto; inset-inline-start: 0; transform: translateX(-105%); box-shadow: 20px 0 60px rgba(0,0,0,.2); }
  .mobile-drawer.open, html[dir="rtl"] .mobile-drawer.open { transform: translateX(0); }
  .mobile-drawer-head { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--bd); }
  .mobile-drawer-head img { height: 52px; width: auto; }
  .mobile-drawer-close { width: 44px; height: 44px; border: 0; border-radius: 50%; background: #f6edf1; color: var(--p); font-size: 28px; line-height: 1; }
  .mobile-drawer-body { overflow-y: auto; overscroll-behavior: contain; padding: 12px 16px 28px; }
  .mobile-drawer-section { border-bottom: 1px solid #eee5e9; }
  .mobile-drawer-toggle, .mobile-drawer-link { width: 100%; min-height: 52px; border: 0; background: transparent; color: var(--p); font: inherit; font-weight: 850; display: flex; align-items: center; justify-content: space-between; text-align: start; padding: 12px 5px; }
  .mobile-drawer-toggle::after { content: "+"; font-size: 24px; font-weight: 500; }
  .mobile-drawer-section.open .mobile-drawer-toggle::after { content: "−"; }
  .mobile-drawer-sub { display: none; padding: 0 4px 10px; }
  .mobile-drawer-section.open .mobile-drawer-sub { display: grid; }
  .mobile-drawer-sub a { min-height: 44px; display: flex; align-items: center; padding: 9px 12px; border-radius: 10px; color: #4c3b47; font-size: 14px; }
  .mobile-drawer-sub a:active { background: #f7eef2; }
  .mobile-drawer-cta { margin-top: 18px; width: 100%; min-height: 52px; white-space: normal !important; text-align: center; }
  body.mobile-nav-open { overflow: hidden !important; touch-action: none; }

  /* Hero */
  .hero { min-height: auto !important; padding: 58px 0 54px !important; align-items: start !important; }
  .hero .hero-grid { width: 100%; padding: 0 !important; display: flex !important; justify-content: center !important; }
  .hero .hero-text { width: 100%; max-width: 680px !important; text-align: center !important; }
  .hero .ey { max-width: 100%; white-space: normal; text-align: center; justify-content: center; padding: 9px 14px; }
  .hero h1 { font-size: clamp(2.35rem, 10.3vw, 4.2rem) !important; line-height: 1.04 !important; letter-spacing: -.035em !important; margin: 20px auto 18px !important; max-width: 100%; overflow-wrap: anywhere; word-break: normal; hyphens: auto; text-wrap: balance; }
  html[lang="de"] .hero h1, html[lang="ru"] .hero h1, html[lang="fr"] .hero h1, html[lang="ro"] .hero h1 { font-size: clamp(2.05rem, 9.1vw, 3.65rem) !important; }
  .hero p { font-size: clamp(16px, 4.2vw, 19px) !important; line-height: 1.65 !important; max-width: 94%; margin: 0 auto 22px; overflow-wrap: anywhere; hyphens: auto; }
  .hero-buttons { width: min(100%, 370px); margin: 0 auto; display: grid !important; grid-template-columns: 1fr; gap: 12px !important; }
  .hero-buttons .btn { width: 100% !important; min-height: 52px; white-space: normal !important; line-height: 1.3; padding: 13px 18px; }
  .reviews { width: 100%; margin-top: 26px !important; display: grid !important; grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 10px !important; }
  .review { min-width: 0; min-height: 112px; padding: 13px 8px !important; border-radius: 18px !important; text-align: center; }
  .review img { width: 28px !important; height: 28px !important; }
  .review span { overflow-wrap: anywhere; font-size: 11px; }

  /* Sections and grids */
  .section { padding: 60px 0 !important; }
  .head { margin-bottom: 30px !important; }
  .head h2, .article-text h2 { font-size: clamp(1.85rem, 7.5vw, 2.8rem) !important; line-height: 1.14 !important; overflow-wrap: anywhere; text-wrap: balance; }
  .head p, .article-text p, .article-text li { font-size: 16px !important; line-height: 1.75 !important; overflow-wrap: anywhere; }
  .cards, .vip-grid, .reason-grid, .process-grid, .blog-grid, .testimonial-grid, .testimonials-20, .logos-row, .related-grid, .ba-grid, .before-after-service-grid { grid-template-columns: 1fr !important; gap: 18px !important; }
  .why-grid, .tourism-grid, .book-grid, .article-block, .contact-grid, .tourism-layout { grid-template-columns: 1fr !important; gap: 26px !important; }
  .card, .vip, .reason, .testimonial, .process, .blog, .official, .contact-info-card, .contact-form-card, .wizard { min-width: 0; width: 100%; }
  .card { min-height: 380px; }
  .card h3 { font-size: 25px !important; }
  .why-img, .tourism-img { min-height: 330px !important; border-radius: 28px !important; }
  .article-img { height: 290px !important; }
  .article-block { margin-bottom: 38px !important; }
  .page-hero { padding: 76px 0 60px !important; }
  .page-hero h1 { font-size: clamp(2.2rem, 9vw, 3.7rem) !important; line-height: 1.08 !important; overflow-wrap: anywhere; hyphens: auto; }
  .page-hero p { font-size: 17px !important; }
  .service-menu { top: 76px !important; }
  .service-menu .container { width: 100% !important; padding-inline: 16px !important; }

  /* Forms */
  .simple-bottom-booking, .call-box, .wizard, .contact-form-card { width: 100% !important; max-width: 100% !important; padding: 22px 16px !important; border-radius: 22px !important; }
  .simple-bottom-booking input, .simple-bottom-booking select, .call-box input, .call-box select, .wizard input, .wizard select, .contact-form-card input, .contact-form-card select, .contact-form-card textarea { width: 100% !important; min-width: 0 !important; min-height: 50px; font-size: 16px !important; }
  .simple-booking-submit, .booking .btn, .contact-form-card .btn { width: 100% !important; min-height: 52px; white-space: normal !important; line-height: 1.3; }

  /* Footer */
  .footer { padding: 52px 0 calc(90px + env(safe-area-inset-bottom)) !important; }
  .footer .foot { grid-template-columns: 1fr !important; gap: 28px !important; }
  .footer .foot > div { min-width: 0; }
  .footer .foot img { height: 58px !important; max-width: 210px; }
  .footer .foot h3 { margin: 0 0 12px; }
  .footer .foot a, .footer .foot p { font-size: 15px; line-height: 1.65; overflow-wrap: anywhere; word-break: break-word; }
  .footer .copy { margin-top: 24px !important; }

  /* Collapsible social panel */
  .fixed-social { position: fixed !important; z-index: 1300 !important; top: auto !important; bottom: calc(18px + env(safe-area-inset-bottom)) !important; inset-inline-start: 16px !important; inset-inline-end: auto !important; transform: none !important; display: flex !important; flex-direction: column-reverse !important; align-items: center; gap: 8px !important; max-height: none !important; overflow: visible !important; padding: 0 !important; background: transparent !important; box-shadow: none !important; }
  html[dir="rtl"] .fixed-social { inset-inline-start: auto !important; inset-inline-end: 16px !important; }
  .fixed-social a { width: 46px !important; height: 46px !important; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.96); box-shadow: 0 10px 30px rgba(0,0,0,.16); opacity: 0; pointer-events: none; transform: translateY(10px) scale(.85); transition: .2s ease; }
  .fixed-social.social-open a { opacity: 1; pointer-events: auto; transform: none; }
  .fixed-social img { width: 30px !important; height: 30px !important; box-shadow: none !important; animation: none !important; }
  .mobile-social-toggle { order: -1; width: 52px; height: 52px; border: 0; border-radius: 50%; background: linear-gradient(135deg,var(--p),var(--pk)); color: #fff; box-shadow: 0 14px 36px rgba(75,30,58,.32); font-size: 25px; font-weight: 900; display: grid; place-items: center; }
  .fixed-social.social-open .mobile-social-toggle { transform: rotate(45deg); }
}

@media (max-width: 480px) {
  .container { width: calc(100% - 28px) !important; }
  .top .container > span { display: none; }
  .top .container { justify-content: center; }
  .header .logo img { height: 48px !important; max-width: 150px; }
  .header .nav { height: 70px !important; min-height: 70px; }
  .mobile-lang-trigger { min-width: 62px; padding-inline: 9px; }
  .mobile-open { width: 44px !important; height: 44px !important; flex-basis: 44px; }
  .hero { padding-top: 46px !important; }
  .hero h1 { font-size: clamp(2.15rem, 10vw, 3.1rem) !important; }
  html[lang="de"] .hero h1, html[lang="ru"] .hero h1, html[lang="fr"] .hero h1, html[lang="ro"] .hero h1 { font-size: clamp(1.95rem, 9vw, 2.8rem) !important; }
  .reviews { gap: 8px !important; }
  .review { min-height: 106px; }
}

@media (prefers-reduced-motion: reduce) and (max-width: 991px) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Mobile language-selector conflict fix — one control only */
@media (max-width: 991px) {
  .header .actions > .lang-custom,
  .header .actions .lang-custom,
  .header .lang-current,
  .header .lang-menu {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
  .header .actions {
    min-width: 0 !important;
    max-width: calc(100% - 155px);
    overflow: visible;
  }
  .mobile-lang-trigger img,
  .mobile-lang-popover img {
    width: 25px;
    height: 17px;
    object-fit: cover;
    border-radius: 3px;
    flex: 0 0 auto;
  }
  .mobile-lang-trigger span { display: inline-block; }
  .mobile-lang-popover button { justify-content: flex-start; }
  .mobile-lang-popover button span { flex: 1; min-width: 0; }
  .mobile-lang-popover button b { font-size: 12px; opacity: .65; }
  .mobile-lang-popover.open { isolation: isolate; }
  .mobile-drawer:not(.open),
  .mobile-drawer-overlay:not(.open) { pointer-events: none !important; }
}

@media (max-width: 480px) {
  .header .actions { max-width: calc(100% - 145px); gap: 6px; }
  .mobile-lang-trigger { min-width: 66px !important; max-width: 76px; }
}

/* ROOT FIX 2026-07: deterministic mobile drawer, RTL/LTR and viewport containment */
@media (max-width: 991px) {
  html {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden !important;
    overscroll-behavior-x: none;
  }
  body {
    position: relative;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: hidden !important;
  }
  body > *:not(.mobile-drawer):not(.mobile-drawer-overlay):not(.mobile-lang-popover):not(.consult-modal):not(.ba-modal) {
    max-width: 100%;
  }

  /* LTR menu: left side. Closed means fully outside the viewport. */
  .mobile-drawer {
    inset: 0 auto 0 0 !important;
    width: min(88dvw, 380px) !important;
    max-width: calc(100dvw - 28px) !important;
    transform: translate3d(-110%, 0, 0) !important;
    visibility: hidden;
    pointer-events: none;
    overflow: hidden;
    will-change: transform;
    contain: layout paint;
    box-shadow: 20px 0 60px rgba(0,0,0,.2) !important;
  }

  /* Arabic menu: right side. */
  html[dir="rtl"] .mobile-drawer,
  body[dir="rtl"] .mobile-drawer,
  body.rtl .mobile-drawer {
    inset: 0 0 0 auto !important;
    transform: translate3d(110%, 0, 0) !important;
    box-shadow: -20px 0 60px rgba(0,0,0,.2) !important;
  }

  .mobile-drawer.open {
    transform: translate3d(0, 0, 0) !important;
    visibility: visible;
    pointer-events: auto;
  }

  .mobile-drawer-overlay {
    visibility: hidden;
  }
  .mobile-drawer-overlay.open {
    visibility: visible;
  }

  /* Never let stale menu state alter page geometry. */
  .mobile-drawer,
  .mobile-drawer-overlay {
    margin: 0 !important;
  }
  body:not(.mobile-nav-open) .mobile-drawer,
  body:not(.mobile-nav-open) .mobile-drawer-overlay {
    pointer-events: none !important;
  }
  body.mobile-nav-open {
    overflow: hidden !important;
    padding-inline-end: 0 !important;
  }
}

@media (min-width: 992px) {
  .mobile-drawer,
  .mobile-drawer-overlay,
  .mobile-lang-popover,
  .mobile-lang-trigger {
    display: none !important;
  }
  body.mobile-nav-open {
    overflow: auto !important;
  }
}

/* Arabic mobile typography: natural Arabic spacing and comfortable leading. */
@media (max-width: 991px) {
  html[lang="ar"] .hero .ey,
  body[dir="rtl"] .hero .ey {
    letter-spacing: 0 !important;
    word-spacing: 0 !important;
    line-height: 1.55 !important;
  }

  html[lang="ar"] .hero h1,
  body[dir="rtl"] .hero h1 {
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    word-spacing: 0 !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    text-wrap: balance;
  }
}

@media (max-width: 480px) {
  html[lang="ar"] .hero h1,
  body[dir="rtl"] .hero h1 {
    line-height: 1.22 !important;
  }
}
