/* Shared mobile footer layout; desktop keeps its existing layout. */
@media (max-width: 768px) {
  body[class] footer, body footer {
    padding: 36px 0 calc(80px + env(safe-area-inset-bottom, 0px));
  }
  body footer > .container { width: 100%; max-width: 100%; padding-inline: 20px; }
  body[class] footer .footer-grid, body footer .footer-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 28px;
    margin: 0 0 28px;
  }
  body footer :is(.footer-grid > *, .footer-col, .footer-brand) { min-width: 0; text-align: left; }
  body footer .footer-inner { display: block; margin-bottom: 24px; }
  body[class] footer :is(.footer-logo-wrap, .footer-logo-container, .footer-inner .footer-brand),
  body footer :is(.footer-logo-wrap, .footer-logo-container, .footer-inner .footer-brand) {
    display: flex; align-items: center; justify-content: flex-start;
    flex-direction: row; gap: 14px; margin: 0 0 16px;
  }
  body[class] footer :is(.footer-logo-icon, .logo-icon), body footer :is(.footer-logo-icon, .logo-icon),
  body footer .footer-brand > img[src*="shift-logo-travel-batam"] {
    width: 60px; height: 60px; flex: 0 0 60px; margin: 0; padding: 0;
    border-radius: 10px; background: #fff; overflow: hidden;
  }
  body[class] footer :is(.footer-logo-icon, .logo-icon) img,
  body footer :is(.footer-logo-icon, .logo-icon) img {
    display: block; width: 100%; height: 100%; object-fit: contain; transform: none;
  }
  body[class] footer :is(.footer-logo-name, .footer-h1, .logo-heading, .footer-brand > span > strong),
  body footer :is(.footer-logo-name, .footer-h1, .logo-heading, .footer-brand > span > strong) {
    margin: 0; font-size: 17px; line-height: 1.4; white-space: normal; text-align: left;
  }
  body footer :is(.footer-logo-tagline, .logo-text p, .footer-brand > span > small) {
    margin: 4px 0 0; font-size: 10px !important; line-height: 1.5 !important;
    letter-spacing: .04em; text-align: left !important;
  }
  body footer .footer-desc {
    max-width: 40ch; margin: 0 0 18px; font-size: 14px !important;
    line-height: 1.75 !important; text-align: left !important; text-align-last: auto;
  }
  body[class] footer :is(.footer-socials, .social-links), body footer :is(.footer-socials, .social-links) {
    display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 10px; margin: 0;
  }
  body[class] footer :is(.footer-socials, .social-links) a, body footer :is(.footer-socials, .social-links) a {
    display: grid; place-items: center; width: 44px; height: 44px; flex: 0 0 44px; margin: 0;
  }
  body[class] footer :is(.footer-col h3, .footer-col-title), body footer :is(.footer-col h3, .footer-col-title) {
    margin: 0 0 12px; padding: 0; font-size: 16px; line-height: 1.5; text-align: left;
  }
  body footer :is(.footer-col h3, .footer-col-title)::after { display: none; }
  body footer .footer-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 16px; margin: 0; padding: 0; list-style: none; }
  body[class] footer .footer-links li, body footer .footer-links li { margin: 0; min-width: 0; }
  body[class] footer .footer-links a, body footer .footer-links a {
    display: flex; align-items: center; min-height: 44px; padding: 6px 0;
    gap: 8px; font-size: 13px; line-height: 1.5; text-align: left; overflow-wrap: anywhere;
  }
  body footer .contact-info { padding: 0; margin: 0; list-style: none; }
  body[class] footer :is(.footer-contact-item, .contact-info li), body footer :is(.footer-contact-item, .contact-info li) {
    display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 10px;
    align-items: start; margin: 0 0 14px; font-size: 14px; line-height: 1.7; text-align: left;
  }
  body[class] footer .footer-email, body footer .footer-email {
    font-size: 14px; line-height: 1.7; white-space: normal; overflow-wrap: anywhere;
  }
  body[class] footer .legal-navigation, body footer .legal-navigation {
    display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding-block: 22px;
  }
  body footer .legal-navigation ul { display: flex; flex-direction: row; flex-wrap: wrap; gap: 0 20px; }
  body footer .legal-navigation a { min-height: 44px; font-size: 13px; }
  body footer .footer-copyright { flex-direction: column; align-items: center; gap: 6px; padding: 20px 0 0; }
  body footer .footer-copyright :is(p, .footer-credit) {
    flex: none; width: 100%; max-width: 100%; margin: 0;
    font-size: 12px !important; line-height: 1.7 !important; text-align: center !important; text-align-last: auto;
  }
}
