/* ===========================
   AUSTIN TEXAS TRANSPORT
   Mobile & Responsive CSS
   =========================== */

/* ===== STICKY MOBILE BUTTONS ===== */
.sticky-mobile-btns { display: none; }

@media (max-width: 768px) {
  .sticky-mobile-btns {
    display: flex; position: fixed; bottom: 0; left: 0; right: 0;
    z-index: var(--z-overlay); padding: 0.75rem var(--space-md);
    gap: var(--space-md);
    background: linear-gradient(to top, rgba(7,11,24,1) 60%, transparent 100%);
    padding-bottom: max(0.75rem, env(safe-area-inset-bottom));
    box-shadow: 0 -8px 24px rgba(0,0,0,0.5);
  }
  .sticky-mobile-btns .btn {
    flex: 1; justify-content: center; padding: 0.8rem 1rem; font-size: var(--text-xs);
  }
  .btn-call {
    background: linear-gradient(135deg, #0D3B6E, #1254A0);
    color: white; border-color: transparent;
  }
  .btn-call:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(13,59,110,0.4); }
  .btn-whatsapp {
    background: linear-gradient(135deg, #128C7E, #25D366);
    color: white; border-color: transparent;
  }
  .btn-whatsapp:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(37,211,102,0.3); }
  body { padding-bottom: 76px; }
}

/* ===== 1280px ===== */
@media (max-width: 1280px) {
  .container { padding: 0 var(--space-lg); }
  /* Keep footer 4 columns — just tighten the gap */
  .footer__grid { gap: var(--space-xl); }
  .stats-row { grid-template-columns: repeat(2,1fr); }
}

/* ===== 900px — footer collapses to 2 columns ===== */
@media (max-width: 900px) {
  .footer__grid { grid-template-columns: 1fr 1fr; gap: var(--space-xl); }
}

/* ===== 1024px ===== */
@media (max-width: 1024px) {
  .navbar__nav, .navbar__cta { display: none; }
  .navbar__hamburger { display: flex; }
  .grid-4 { grid-template-columns: repeat(2,1fr); }
  .grid-3 { grid-template-columns: repeat(2,1fr); }
  .topbar__contact a:nth-child(3) { display: none; }
}

/* ===== 768px ===== */
@media (max-width: 768px) {
  :root { --topbar-height: 40px; --header-height: 64px; }
  .section { padding: var(--space-4xl) 0; }
  .container { padding: 0 var(--space-lg); }
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .stats-row { grid-template-columns: repeat(2,1fr); }
  .hero__title { font-size: clamp(2rem,8vw,3rem); }
  .hero__ctas { flex-direction: column; align-items: flex-start; }
  .trust-bar__items { gap: var(--space-xl); }
  .section-title { font-size: clamp(1.75rem,6vw,2.5rem); }
  .footer__grid { grid-template-columns: 1fr; gap: var(--space-2xl); }
  .footer__bottom { flex-direction: column; align-items: flex-start; gap: var(--space-sm); }
  .topbar__contact { gap: var(--space-lg); }
  .topbar__socials { display: none; }
  .gallery-grid { columns: 2 180px; }
  .page-hero { min-height: 280px; }
  .mobile-menu__nav a { font-size: var(--text-2xl); }
}

/* ===== 480px ===== */
@media (max-width: 480px) {
  :root { --space-5xl: 5rem; --space-4xl: 4rem; }
  .topbar__contact a:not(:first-child) { display: none; }
  .stats-row { grid-template-columns: 1fr 1fr; }
  .btn { padding: 0.75rem 1.5rem; font-size: var(--text-xs); }
  .trust-bar__items { flex-direction: column; align-items: flex-start; gap: var(--space-lg); padding-left: var(--space-lg); }
  .gallery-grid { columns: 1; }
  .tabs { overflow-x: auto; flex-wrap: nowrap; padding-bottom: var(--space-sm); scrollbar-width: none; }
  .tabs::-webkit-scrollbar { display: none; }
  .hero__badge { font-size: 0.65rem; }
}