/* ================================================================
   RESPONSIVE BREAKPOINTS
   ================================================================ */

/* Tablet landscape */
@media (max-width: 1024px) {
    .features__grid { grid-template-columns: repeat(2, 1fr); }
    .footer__grid { grid-template-columns: repeat(2, 1fr); }
    .service-tab-content.active { grid-template-columns: 1fr; }
    .about__hero { grid-template-columns: 1fr; }
    .about__hero .about__image { order: -1; }
    .doctor-detail { grid-template-columns: 250px 1fr; }
    .service-detail { grid-template-columns: 1fr; }
    .service-detail__sidebar { order: -1; }
}

/* Tablet portrait */
@media (max-width: 768px) {
    h1 { font-size: 2rem; }
    h2 { font-size: 1.6rem; }
    .section { padding: 60px 0; }

    /* Topbar */
    .topbar__info { gap: 12px; font-size: 12px; }
    .topbar__info li:nth-child(n+3) { display: none; }

    /* Header */
    .header__nav { display: none; }
    .header__cta { display: none; }
    .header__hamburger { display: flex; }

    /* Hero */
    .hero__slide { height: 450px; }
    .hero__slide-content { padding: 0 20px; }
    .hero__slide-content h1 { font-size: 2rem; }
    .hero__arrow { display: none; }

    /* Grids */
    .dept-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
    .team-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
    .blog-grid { grid-template-columns: 1fr; }
    .shop-grid { grid-template-columns: repeat(2, 1fr); }
    .welcome__grid { grid-template-columns: 1fr; gap: 30px; }
    .faq__grid { grid-template-columns: 1fr; }
    .contact__grid { grid-template-columns: 1fr; }
    .doctor-detail { grid-template-columns: 1fr; }
    .doctor-detail__photo { text-align: center; }
    .doctor-detail__photo img { max-width: 250px; margin: 0 auto; }
    .footer__grid { grid-template-columns: 1fr; gap: 30px; }
    .footer__bottom-inner { flex-direction: column; gap: 5px; text-align: center; }

    /* Service tabs */
    .service-tabs__nav { gap: 8px; }
    .service-tab-btn { min-width: 90px; padding: 10px 12px; font-size: 11px; }
    .service-tab-btn img { width: 30px; height: 30px; }

    /* Floating buttons */
    .floating-actions { display: none; }

    /* Page banner */
    .page-banner { padding: 40px 0; }
    .page-banner h1 { font-size: 1.8rem; }

    /* Appointment form */
    .appointment-form .form-row { grid-template-columns: 1fr; }
}

/* Mobile */
@media (max-width: 480px) {
    h1 { font-size: 1.6rem; }
    h2 { font-size: 1.4rem; }
    .container { padding: 0 15px; }
    .section { padding: 40px 0; }

    .topbar { display: none; }

    .hero__slide { height: 380px; }
    .hero__slide-content h1 { font-size: 1.6rem; }
    .hero__slide-actions { flex-direction: column; }
    .hero__slide-actions .btn { width: 100%; justify-content: center; }

    .features__grid { grid-template-columns: 1fr; }
    .dept-grid { grid-template-columns: 1fr; }
    .team-grid { grid-template-columns: 1fr; }
    .shop-grid { grid-template-columns: 1fr; }

    .feature-card { padding: 25px 20px; }
    .doctor-card__photo { width: 140px; height: 140px; }

    .service-tabs__nav { flex-direction: column; align-items: center; }
    .service-tab-btn { flex-direction: row; min-width: unset; width: 100%; max-width: 280px; }

    .cta-banner h2 { font-size: 1.4rem; }
    .cta-banner .cta-phone { font-size: 1.3rem; }
}

/* Quick Links bar responsive */
@media (max-width: 768px) {
    .quick-links__grid {
        grid-template-columns: 1fr;
    }
    .quick-link-tile {
        border-right: none;
        border-bottom: 1px solid rgba(255,255,255,0.15);
        padding: 0.85rem 1.5rem;
    }
    .quick-link-tile:last-child { border-bottom: none; }
}

/* Hero split-panel: revert to full-width on mobile */
@media (max-width: 768px) {
    .hero__slide {
        background: #0a2744;
    }
    .hero__slide-bg {
        left: 0;
        right: 0;
        opacity: 0.25;
    }
    .hero__slide-content.container {
        width: 100%;
        max-width: none;
        padding-left: 20px;
        padding-right: 20px;
        text-align: center;
    }
    .hero__slide-actions {
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .quick-links__grid {
        grid-template-columns: 1fr;
    }
    .hero__slide-content.container {
        padding-left: 15px;
        padding-right: 15px;
    }
}
