/* ══════════════════════════════════════════════════════════
   VettriThalapathy.com — Mobile & Tablet Responsive Fix
   CSS handles only class-based and safe structural rules.
   Inline grid overrides are handled exclusively by mobile-fix.js
   so there is ZERO impact on desktop (>1024px).
   ════════════════════════════════════════════════════════ */

/* ── Scroll hint label (inserted by JS, hidden by default) ── */
.vt-scroll-hint {
  display: none;
  font-family: 'Inter', sans-serif;
  font-size: .7rem;
  color: #9E9E9E;
  text-align: center;
  padding: .45rem .8rem;
  background: #FAF7F0;
  border-bottom: 1px solid #E8E0D0;
}

/* ── Table: always scrollable (safe on all viewports) ─────── */
.tbl-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* ══ TABLET (641px – 1024px) ═══════════════════════════════ */
@media (max-width: 1024px) {

  /* Biography sidebar: hide sticky nav on tablet/mobile */
  .bio-side {
    display: none !important;
  }

  /* Hero text block: don't constrain width */
  section [style*="max-width:520px"] {
    max-width: 100% !important;
  }
}

/* ══ MOBILE (≤ 640px) ══════════════════════════════════════ */
@media (max-width: 640px) {

  /* Stat pill cards: allow wrap at smaller min-width */
  .stat-c {
    min-width: 80px !important;
  }

  /* Contact info divider: vertical → horizontal on mobile */
  [style*="border-right:1px solid #F5F5F5"] {
    border-right: none !important;
    border-bottom: 1px solid #F5F5F5;
    padding-bottom: .8rem;
    margin-bottom: .8rem;
  }

  /* Manifesto tracker promise rows: force block (safe rule) */
  #manifesto-rows > div {
    display: block !important;
  }

  /* Manifesto tracker header Status/Progress columns: hide on mobile */
  [style*="grid-template-columns:1fr 120px 120px"] > *:not(:first-child) {
    display: none !important;
  }
}