/* FINAL 393 PASS — same DOM/content as v20, mobile geometry only. */

/* Location control: the rounded square never rotates; only the chevron does. */
.city-tab { transform:none !important; }
.city-tab .city-tab-chevron { display:none !important; }
.city-tab::before {
  content:"" !important;
  display:block !important;
  position:absolute !important;
  z-index:3 !important;
  right:5px !important;
  top:5px !important;
  width:43px !important;
  height:43px !important;
  border-radius:5px !important;
  background:#fff !important;
  border:0 !important;
  box-shadow:none !important;
  transform:none !important;
}
.city-tab::after {
  content:"" !important;
  display:block !important;
  position:absolute !important;
  z-index:4 !important;
  right:18px !important;
  top:16px !important;
  width:17px !important;
  height:17px !important;
  background:transparent !important;
  border:0 !important;
  border-right:4px solid #929292 !important;
  border-bottom:4px solid #929292 !important;
  border-radius:1px !important;
  transform:rotate(45deg) !important;
  transform-origin:center !important;
  transition:transform .34s cubic-bezier(.2,.7,.2,1), border-color .2s ease !important;
}
.city-tab--active::after { border-color:#0055FF !important; }
.city-tab--active.is-list-open::after { transform:rotate(225deg) !important; }
.city-tab--active.is-location-selected::after,
.city-tab--active:not(.is-list-open)::after { transform:rotate(45deg) !important; }
.city-tab--inactive::after { transform:rotate(45deg) !important; border-color:#929292 !important; }

@media (max-width:599px) {
  /* 1 + 4: audience icons switch with tabs; equal size, 15% smaller, anchored 10/10. */
  .aud2-shape { pointer-events:none !important; }
  .aud2-tabrow, .aud2-tab { z-index:20 !important; pointer-events:auto !important; }
  .aud2-card-imagebox {
    left:10px !important;
    top:10px !important;
    width:112px !important;
    height:112px !important;
    overflow:hidden !important;
  }
  .aud2-card-image,
  .aud2-figure--business .aud2-card-image,
  .aud2-figure--business .aud2-card.is-active .aud2-card-image,
  .aud2-card.is-active .aud2-card-image {
    left:0 !important;
    top:0 !important;
    width:112px !important;
    height:112px !important;
    max-width:112px !important;
    max-height:112px !important;
    transform:none !important;
    object-fit:contain !important;
    object-position:left top !important;
  }

  /* 3: open menu matches Figma 39:2566 using existing nav/footer nodes. */
  .main-nav.mobile-menu-open {
    display:block !important;
    pointer-events:auto !important;
    position:absolute !important;
    z-index:70 !important;
    left:0 !important;
    top:0 !important;
    width:373px !important;
    height:651px !important;
    padding:0 !important;
    margin:0 !important;
    border-radius:20px !important;
    background:#fff !important;
    box-shadow:none !important;
    overflow:hidden !important;
  }
  .main-nav.mobile-menu-open > a:nth-of-type(1),
  .main-nav.mobile-menu-open > a:nth-of-type(2),
  .main-nav.mobile-menu-open > a:nth-of-type(3),
  .main-nav.mobile-menu-open > a:nth-of-type(4),
  .main-nav.mobile-menu-open > a:nth-of-type(5) {
    display:block !important;
    position:absolute !important;
    left:26px !important;
    width:300px !important;
    height:24px !important;
    margin:0 !important;
    padding:0 !important;
    color:#212121 !important;
    font-size:20px !important;
    line-height:24px !important;
    font-weight:400 !important;
    text-align:left !important;
    white-space:nowrap !important;
  }
  .main-nav.mobile-menu-open > a:nth-of-type(1){ top:104px !important; }
  .main-nav.mobile-menu-open > a:nth-of-type(2){ top:148px !important; }
  .main-nav.mobile-menu-open > a:nth-of-type(3){ top:192px !important; }
  .main-nav.mobile-menu-open > a:nth-of-type(4){ top:236px !important; }
  .main-nav.mobile-menu-open > a:nth-of-type(5){ top:280px !important; }

  .main-nav.mobile-menu-open > .footer-contact {
    display:block !important;
    position:absolute !important;
    left:20px !important;
    top:370px !important;
    width:300px !important;
    height:118px !important;
    margin:0 !important;
  }
  .main-nav.mobile-menu-open > .footer-contact > div:not(.footer-socials) {
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    height:35px !important;
  }
  .main-nav.mobile-menu-open > .footer-contact > div > img { width:23px !important; height:23px !important; }
  .main-nav.mobile-menu-open > .footer-contact strong { font-size:16px !important; line-height:1 !important; }
  .main-nav.mobile-menu-open > .footer-contact .footer-socials {
    display:flex !important;
    margin-top:13px !important;
    gap:10px !important;
  }
  .main-nav.mobile-menu-open > .footer-contact .social,
  .main-nav.mobile-menu-open > .footer-contact .social-tile {
    width:35px !important;
    height:35px !important;
    flex:0 0 35px !important;
  }
  .main-nav.mobile-menu-open > .mobile-menu-payment-copy {
    display:block !important;
    position:absolute !important;
    left:21px !important;
    top:513px !important;
    width:225px !important;
    margin:0 !important;
    color:#212121 !important;
    font-size:16px !important;
    line-height:1.1 !important;
    font-weight:400 !important;
  }
  .main-nav.mobile-menu-open > .header-pay {
    display:flex !important;
    position:absolute !important;
    left:20px !important;
    top:584px !important;
    width:333px !important;
    height:47px !important;
    margin:0 !important;
    align-items:center !important;
    justify-content:center !important;
    border-radius:5px !important;
    background:#0055FF !important;
    color:#fff !important;
    font-size:14px !important;
    line-height:1 !important;
    font-weight:700 !important;
  }
  .main-nav.mobile-menu-open ~ .hero-copy,
  .main-nav.mobile-menu-open ~ .discount-card,
  .main-nav.mobile-menu-open ~ .model-wrap { pointer-events:none !important; }

  /* Logo + close icon remain above the white menu panel. */
  .brand { z-index:80 !important; }
  .mobile-burger { z-index:90 !important; outline:none !important; }
  .mobile-burger.is-open { left:319.15px !important; top:21.15px !important; width:29.7px !important; height:29.7px !important; }
  .mobile-burger.is-open span { left:-4.15px !important; width:38px !important; }

  /* 5 + 6 + 7: location selector and route state. */
  .city-tab::before {
    right:3px !important;
    top:3px !important;
    width:28px !important;
    height:28px !important;
    border-radius:5px !important;
  }
  .city-tab::after {
    right:10px !important;
    top:8px !important;
    width:12px !important;
    height:12px !important;
    border-right-width:3px !important;
    border-bottom-width:3px !important;
  }
  .locations-card--left.is-selected .route-button,
  .route-button:not(:disabled) {
    background:#FFB200 !important;
    color:#212121 !important;
    opacity:1 !important;
    cursor:pointer !important;
  }
  .locations-card--left.is-selected .route-hint,
  .route-hint {
    white-space:nowrap !important;
  }

  /* 8: FAQ height is content-driven; no answer can sit under the footer. */
  .faq-wrap, .faq-frame { overflow:visible !important; }
  .faq-entry { position:relative !important; }

  /* 9: footer payment button is exactly 10px after its text; divider 20px after button. */
  .footer-payment {
    left:31px !important;
    top:474px !important;
    width:250px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:10px !important;
  }
  .footer-payment p {
    position:static !important;
    width:225px !important;
    margin:0 !important;
    font-size:16px !important;
    line-height:1.1 !important;
  }
  .footer-payment .footer-pay-button {
    position:static !important;
    inset:auto !important;
    width:250px !important;
    height:37px !important;
    margin:0 !important;
    flex:0 0 37px !important;
  }
  .footer-divider { top:594px !important; }
  .footer-credit { top:614px !important; }
  .footer-contract { top:654px !important; }
  .footer-copy { top:685px !important; }
}