/* Global responsive overrides for all dentist variants.
   Targets inline-styled grids/headers and collapses them gracefully on mobile.
   Loaded after each variant's own <style> block, so !important is used where needed
   to win against inline styles. */

/* ---- Tablet 768px and below ---- */
@media (max-width: 768px) {

  /* Brand anchor in headers must allow shrinking so CTA stays visible */
  header > div > a:first-child ,
  header > a:first-child {
    min-width: 0 !important;
    flex: 0 1 auto !important;
    overflow: hidden !important;
  }


  /* Collapse all multi-column grid layouts to single column */
  [style*="grid-template-columns:repeat(4"] ,
  [style*="grid-template-columns: repeat(4"] ,
  [style*="grid-template-columns:repeat(3"] ,
  [style*="grid-template-columns: repeat(3"] ,
  [style*="grid-template-columns:repeat(auto-fill,minmax(280px"] ,
  [style*="grid-template-columns:1fr 1fr 1fr"] {
    grid-template-columns: 1fr 1fr !important;
  }

  [style*="grid-template-columns:1fr 1fr"] ,
  [style*="grid-template-columns: 1fr 1fr"] ,
  [style*="grid-template-columns:1.4fr 1fr"] ,
  [style*="grid-template-columns:440px 1fr"] {
    grid-template-columns: 1fr !important;
  }

  /* Reduce section padding */
  section[style*="padding:100px"] ,
  section[style*="padding:120px"] {
    padding-top: 56px !important;
    padding-bottom: 56px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  section[style*="padding:80px"] ,
  section[style*="padding:72px"] ,
  section[style*="padding:64px"] {
    padding-top: 44px !important;
    padding-bottom: 44px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  /* Hide secondary nav links on mobile, keep CTA visible */
  .dt-link { display: none !important; }

  /* Generic nav container shrink */
  nav[style*="gap:32px"] ,
  nav[style*="gap:36px"] ,
  nav[style*="gap:28px"] ,
  nav[style*="gap:22px"] {
    gap: 12px !important;
  }
  [style*="display:flex"][style*="gap:36px"] ,
  [style*="display:flex"][style*="gap:32px"] ,
  [style*="display:flex"][style*="gap:28px"] ,
  [style*="display:flex"][style*="gap:22px"] {
    gap: 12px !important;
  }

  /* Tighten header padding so the CTA fits */
  header > div ,
  nav[style*="padding:0 56px"] ,
  nav[style*="padding:0 44px"] ,
  nav[style*="padding:0 28px"] ,
  nav[style*="padding:0 24px"] {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* Hero blocks: ensure they clear sticky/fixed headers and have breathing room */
  .sa-hero ,
  .dp-hero ,
  section[style*="min-height:100vh"] {
    padding-top: 96px !important;
    padding-bottom: 56px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  /* Forms: stack two-column rows */
  form [style*="grid-template-columns:1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
}

/* ---- Mobile 480px and below ---- */
@media (max-width: 480px) {
  [style*="grid-template-columns:repeat(4"] ,
  [style*="grid-template-columns: repeat(4"] ,
  [style*="grid-template-columns:repeat(3"] ,
  [style*="grid-template-columns: repeat(3"] ,
  [style*="grid-template-columns:repeat(auto-fill"] ,
  [style*="grid-template-columns:1fr 1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }

  /* Smaller body padding */
  section[style*="padding"] ,
  footer[style*="padding"] {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* Footer columns stack */
  footer [style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }
}