/* ============================================================
   Velki100 — Mobile centering & responsive polish
   Loaded LAST on every front-end page so it wins the cascade.
   Home-section rules are scoped with `body.vk-home` to match the
   specificity of velki100-broadcast.css (which uses the same).
   Goal: on phones/tablets, section intros, buttons, stats and
   content read as centered, balanced columns.
   Breakpoints: <=768 (tablets/large phones), <=560 (phones).
   ============================================================ */

@media (max-width: 768px) {

  /* ---------- HOME · HERO ---------- */
  body.vk-home .v100-hero__copy { text-align: center; }
  body.vk-home .v100-hero__kicker { margin-left: auto; margin-right: auto; }
  body.vk-home .v100-hero__title,
  body.vk-home .v100-hero__lead { text-align: center; margin-left: auto; margin-right: auto; }
  body.vk-home .v100-hero__actions { justify-content: center; align-items: center; flex-wrap: wrap; }
  body.vk-home .v100-hero__btn { justify-content: center; }
  body.vk-home .v100-hero__trust { justify-content: center; flex-wrap: wrap; }

  /* ---------- HOME · PROVIDERS ---------- */
  body.vk-home .v100-prov__head { flex-direction: column; align-items: center; text-align: center; gap: 18px; }
  body.vk-home .v100-prov__head-main { text-align: center; max-width: none; }
  body.vk-home .v100-prov__eyebrow { margin-left: auto; margin-right: auto; }
  body.vk-home .v100-prov__stats { justify-content: center; flex-wrap: wrap; }

  /* ---------- HOME · REVIEWS ---------- */
  body.vk-home .v100-rev__head { flex-direction: column; align-items: center; text-align: center; gap: 18px; }
  body.vk-home .v100-rev__head-tx { text-align: center; }
  body.vk-home .v100-rev__eyebrow { margin-left: auto; margin-right: auto; }
  body.vk-home .v100-rev__score { justify-content: center; }

  /* ---------- HOME · FINAL CTA ---------- */
  body.vk-home .v100-final__content { text-align: center; }
  body.vk-home .v100-final__logo,
  body.vk-home .v100-final__eyebrow { margin-left: auto; margin-right: auto; }
  body.vk-home .v100-final__title,
  body.vk-home .v100-final__stats { text-align: center; }
  body.vk-home .v100-final__actions { justify-content: center; align-items: center; flex-wrap: wrap; }

  /* ---------- HOME · SEO (center headings, keep body copy readable) ---------- */
  body.vk-home .v100-seo__eyebrow { margin-left: auto; margin-right: auto; }
  body.vk-home .v100-seo__title,
  body.vk-home .v100-seo__lead { text-align: center; }
  body.vk-home .v100-seo__cta { justify-content: center; flex-wrap: wrap; }

  /* ---------- GENERIC SECTION HEADS ---------- */
  .vk-sec-head { text-align: center; }
  .vk-sec-head__actions { margin-left: auto; margin-right: auto; }
}

/* ---------- PHONES: stack action buttons full-width & centered ---------- */
@media (max-width: 560px) {
  body.vk-home .v100-hero__actions,
  body.vk-home .v100-final__actions { flex-direction: column; }
  body.vk-home .v100-hero__actions > *,
  body.vk-home .v100-final__actions > * {
    width: 100%;
    max-width: 340px;
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
    text-align: center;
  }
  /* Trim the oversized hero / SEO / final CTAs on phones — smaller padding +
     font so the full-width buttons read as comfortable, not bulky. */
  body.vk-home .v100-hero__btn { font-size: 14.5px; }
  body.vk-home .v100-hero__btn--primary { padding: 13px 18px; }
  body.vk-home .v100-hero__btn--link { padding: 8px 4px; }
  body.vk-home .v100-seo__btn { font-size: 14.5px; padding: 13px 18px; }
  body.vk-home .v100-final__cta { font-size: 14.5px; padding: 13px 18px; }
}
@media (max-width: 380px) {
  body.vk-home .v100-hero__btn { font-size: 13.5px; }
  body.vk-home .v100-hero__btn--primary { padding: 12px 16px; }
  body.vk-home .v100-seo__btn { font-size: 13.5px; padding: 12px 16px; }
  body.vk-home .v100-final__cta { font-size: 13.5px; padding: 12px 16px; }
}