/* =========================================================================
   Touch targets + minimum legible text (phones / tablets)
   Loaded LAST in includes/header.php. Everything here is scoped to
   max-width: 768px, so desktop layout is untouched.

   Found by a headless-browser audit at 375px: footer links were ~20px tall,
   text CTAs 18-24px, carousel dots 8x8px, and several badges/labels were
   9.5-10px. Targets below are raised toward the 44px guideline (40px where
   44px would break a dense control); text floors are 10.5-11px.
   ========================================================================= */
@media (max-width: 768px) {

    /* Footer link columns: the rows were ~20px tall with a 13px gap. Give each
       link its own 44px row instead (margin moves into the link's height). */
    .kg-footer-links li { margin-bottom: 0; }
    .kg-footer-links a {
        display: inline-flex;
        align-items: center;
        min-height: 44px;
    }

    /* Footer legal links (FAQ / Privacy / Terms): 17px tall on one wrapping row */
    .kg-footer-legal { flex-wrap: wrap; gap: 0 20px; }
    .kg-footer-legal a {
        display: inline-flex;
        align-items: center;
        min-height: 44px;
    }

    /* Text call-to-actions ("Book Your Appointment", "Compare Memberships"…) */
    .kg-link-cta {
        display: inline-flex;
        align-items: center;
        min-height: 44px;
    }
    .sv-modal-permalink {
        display: inline-flex;
        align-items: center;
        min-height: 44px;
    }

    /* Gallery filter chips (26px tall) */
    .mg-filter { min-height: 40px; }

    /* Login page secondary links and the password-eye toggle */
    .lg-forgot {
        display: inline-flex;
        align-items: center;
        min-height: 44px;
    }
    /* full-width flex row keeps the link centred (inline-flex made it hug the left edge) */
    .lg-admin-switch {
        display: flex;
        width: 100%;
        align-items: center;
        justify-content: center;
        min-height: 44px;
    }
    .lg-password-toggle { min-width: 40px; min-height: 40px; }

    /* Membership carousel dots stay 8px visually; an invisible 24px hit area
       makes them tappable. Gap widened so neighbouring hit areas don't overlap. */
    .kg-mem3-dots { gap: 16px; }
    .kg-mem3-dot { position: relative; }
    .kg-mem3-dot::before {
        content: '';
        position: absolute;
        inset: -8px;
    }

    /* Smallest text: lift 9.5-10px micro-labels to 10.5px */
    .kg-so-badge,
    .kg-so-save,
    .sv-card-v2-feature-label,
    .mg-tile-cat { font-size: 10.5px; }
    /* higher specificity: this label's own clamp(10px, …) rule outranks a bare class */
    .kg-so .kg-so-card-label { font-size: 10.5px; }
}

/* The single large offer card on phones: its buttons were 10.5px. */
@media (max-width: 600px) {
    .kg-so-btn,
    .kg-so-page-link { font-size: 11.5px; letter-spacing: 0.08em; }
}

/* ---- Remaining micro-labels (round 2) -------------------------------------
   Every public-site label still below 10.5px on phones. Phone/tablet only, so
   desktop type is unchanged. !important is deliberate: these sit behind
   per-component media queries and clamp() rules in other stylesheets that
   would otherwise win on specificity or load order. */
@media (max-width: 768px) {
    /* "1 Treatment" / "Save ₹…" under each seasonal package card */
    .sr-card-tag span { font-size: 11px !important; }
    /* struck-through "was" prices */
    .sr-card-mrp,
    .sv-card-v2-mrp,
    .sv-price-mrp { font-size: 12px !important; }

    /* 9-10px badges, tags, kickers and notes */
    .ai-tag, .ai-float-badge small, .aih-tag,
    .mg-tile-cat,
    .kg-compare-table th,
    .kg-deck-card-action-note, .kg-deck-card-benefits-label, .kg-deck-card-cta,
    .kg-deck-card-description, .kg-deck-card-index, .kg-deck-card-label,
    .kg-deck-card-popular, .kg-deck-card-price-period,
    .kg-deck-card[data-pos] .kg-deck-card-cta,
    .kg-deck-card[data-pos] .kg-deck-card-label,
    .kg-select-option-discount, .kg-why-statement-tags span,
    .kg-journal-tab,
    .kg-mem3-card-badge, .kg-mem3-card-popular-tag, .kg-mem3-hero-foot span,
    .kg-so-back-kicker, .kg-so-back-price span, .kg-so-back-save span,
    .kg-so-badge, .kg-so-flip-hint, .kg-so-price-duration, .kg-so-save,
    .sv-package-tag, .sv-packages-index, .sv-packages-rail-meta,
    .sr-card-badge, .sr-card-save, .sr-focus-label, .sr-side-focus,
    .sr-side-now, .sr-side-soon,
    .sv-card-v2-feature-label, .sv-sublink-count,
    .navbar-logo-tagline { font-size: 10.5px !important; }
}