/* ── MOBILE FLOOR ──
   Loaded LAST on every public page (after each page's inline <style>), so these
   minimums win over page-specific rules. Phones and small tablets only.
   Three jobs: nothing pushes the page sideways, text never drops below 12px,
   and links/buttons are at least ~40px tall so they're easy to tap.
   Page layout itself still lives in sections/responsive.css and each page. */
@media (max-width:768px){

  /* 1. No sideways scrolling */
  body{overflow-wrap:break-word}
  .post-layout > *{min-width:0}                 /* article grid column could grow to its widest child */
  .share-bar{flex-wrap:wrap}
  a[href^="mailto:"],.ci-item a{overflow-wrap:anywhere}
  img,video,iframe{max-width:100%}

  /* 2. Readable text: 12px minimum */
  .fg label,.hero-card .form-note,.form-note,
  .card-head p,.dest-card .fee,.dest-card h3,
  .consult-header p,.consult-badge,.consult-note,
  .h-stat .l,.t-label,.t-lbl,.hero-badge,.stag,
  .utag,.uni-internship-note,.us-l,.t-google-badge,
  footer h5,.footer-address,.f-copyright-note,.f-bottom a,
  .post-tag,.r-tag,.blog-tag,.g-badge,.country-card p,
  .feature-card p,.g-caption small,.c4-item h4,.ty-ref span,
  .float-badge span{font-size:12px !important}

  /* 3. Comfortable tap targets */
  footer a{display:inline-flex;align-items:center;min-height:40px}
  .f-links a{min-height:40px}
  .breadcrumb a,.crumb a{display:inline-flex;align-items:center;min-height:40px}
  .uni-item a,.cmp-table tbody th a{display:inline-flex;align-items:center;min-height:40px}
  .neet-notice-close{min-width:40px;min-height:40px}
  .reg-call{min-height:40px}
  .ef-links a,.ty-footer a,.breadcrumbs a{display:inline-flex;align-items:center;min-height:40px}
  .share-btn,.fac-cta-btn,.testi-cta-btn,.read-more{min-height:40px}
  .read-more{display:inline-flex;align-items:center}
}

/* narrow phones (≤380px): the thank-you country cards drop to two columns */
@media (max-width:380px){
  .country-grid{grid-template-columns:repeat(2,1fr) !important}
}