/* ================================================================
   NAAS CARDIOLOGY & ENDOCRINOLOGY — SHARED MOBILE STYLESHEET
   Supplements per-page inline media queries.
   Linked just before </head> so it loads after page <style> blocks.
================================================================ */

/* ── 1080px: fix sections missing horizontal padding reduction ── */
@media (max-width: 1080px) {
  #services,
  #glp1-article,
  #team {
    padding-left: 36px;
    padding-right: 36px;
  }
}

/* ── 768px: collapse grids and fix padding ───────────────────── */
@media (max-width: 768px) {

  /* index.html — services, GLP-1 article, team sections */
  #services {
    padding: 70px 22px;
  }

  #glp1-article {
    padding: 70px 22px;
  }

  #team {
    padding: 70px 22px;
  }

  /* index.html — about pillars: 2-col → 1-col */
  .about-pillars {
    grid-template-columns: 1fr;
  }

  /* index.html — services section */
  .services-head {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }

  .services-grid {
    grid-template-columns: 1fr;
  }

  .svc-card {
    padding: 32px 28px;
  }

  /* index.html — GLP-1 article body: 2-col → 1-col */
  .article-body {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .article-lead {
    padding: 20px 22px;
    margin-bottom: 36px;
  }

  /* index.html — article CTA: flex row → column */
  .article-cta {
    flex-direction: column;
    align-items: flex-start;
    padding: 28px 24px;
    gap: 20px;
  }

  /* index.html — team grid: 2-col → 1-col */
  .team-grid {
    grid-template-columns: 1fr;
  }

  .team-card {
    padding: 32px;
  }

  /* legal/policy pages — tighten side padding */
  .policy-body {
    padding: 48px 22px 60px;
  }
}

/* ── 480px: small phone tweaks ───────────────────────────────── */
@media (max-width: 480px) {

  /* Cookie banner — stack buttons below text */
  .cookie-banner-inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }

  .cookie-actions {
    width: 100%;
    justify-content: flex-start;
  }

  /* CTA buttons — full width on very small screens */
  .btn-primary,
  .btn-outline-light {
    width: 100%;
    text-align: center;
    display: block;
  }

  /* Article warning box padding */
  .article-warning {
    padding: 24px 20px;
  }

  /* Team card reduced padding */
  .team-card {
    padding: 24px 20px;
  }
}
