/* VetsPeruanas — capa responsive.
   Los diseños usan estilos en línea, así que estas reglas los ajustan por
   selector de atributo. No cambia el diseño de escritorio (>1024px). */

@media (max-width: 1024px) {
  [style*="grid-template-columns:repeat(3,minmax(0,1fr))"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  [style*="minmax(0,1.4fr) repeat(3,minmax(0,1fr))"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 28px !important; }
  [style*="minmax(0,240px) minmax(0,1fr)"],
  [style*="minmax(0,1fr) 320px"] { grid-template-columns: minmax(0, 1fr) !important; gap: 24px !important; }
  aside[style*="position:sticky"] { position: static !important; top: auto !important; }
  aside[style*="min-height:600px"] > span,
  [style*="min-height:600px"] > span { writing-mode: horizontal-tb !important; }
  [style*="min-height:600px"] { min-height: 250px !important; }
}

@media (max-width: 880px) {
  [style*="minmax(0,1.25fr) minmax(0,1fr)"],
  [style*="minmax(0,1.1fr) minmax(0,1fr)"],
  [style*="minmax(0,1.2fr) minmax(0,0.8fr)"],
  [style*="minmax(0,1.2fr) minmax(0,1fr)"] { grid-template-columns: minmax(0, 1fr) !important; }
  [style*="minmax(0,1.1fr) minmax(0,1fr)"] svg,
  [style*="minmax(0,1.25fr) minmax(0,1fr)"] svg { height: auto !important; }
  header > div { flex-wrap: wrap !important; gap: 12px !important; row-gap: 10px !important; }
  header nav { order: 3; width: 100%; margin-left: 0 !important; overflow-x: auto; gap: 18px !important; padding-bottom: 2px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  header nav::-webkit-scrollbar { display: none; }
  header nav a { white-space: nowrap; }
  header > div > a:last-child { margin-left: auto; }
}

@media (max-width: 720px) {
  [style*="grid-template-columns:repeat(3,minmax(0,1fr))"],
  [style*="grid-template-columns:repeat(2,minmax(0,1fr))"],
  [style*="minmax(0,1.4fr) repeat(3,minmax(0,1fr))"] { grid-template-columns: minmax(0, 1fr) !important; }

  section, div[style*="padding:0 24px"], footer { padding-left: 16px !important; padding-right: 16px !important; }
  [style*="padding:40px"] { padding: 22px !important; }
  [style*="padding:36px"], [style*="padding:32px"] { padding: 20px !important; }
  [style*="padding:24px 26px"] { padding: 18px 18px !important; }

  h1 { font-size: clamp(28px, 8.2vw, 36px) !important; letter-spacing: -0.025em !important; }
  h2 { font-size: clamp(21px, 6.2vw, 27px) !important; }
  h3 { font-size: 18.5px !important; }
  .lg h2 { font-size: 26px !important; }
  .lg h3 { font-size: 16.5px !important; }
  p[style*="font-size:18px"], p[style*="font-size:17px"] { font-size: 16px !important; }
  article { font-size: 16.5px !important; }
  blockquote { font-size: 18px !important; }

  iframe[style*="height:440px"] { height: 300px !important; }
  iframe[style*="min-height:280px"] { min-height: 220px !important; height: 220px !important; }
  div[style*="min-height:280px"] { min-height: 220px !important; }

  table { font-size: 14px !important; }
  th, td { padding: 11px 12px !important; }

  [style*="justify-content:flex-end"] { justify-content: flex-start !important; }
}

@media (max-width: 480px) {
  header > div > a:last-child { font-size: 13px !important; padding: 10px 14px !important; }
  [style*="border-radius:24px"] { border-radius: 18px !important; }
  [style*="border-radius:22px"] { border-radius: 16px !important; }
  a[style*="padding:14px 22px"], a[style*="padding:12px 18px"] { width: 100%; justify-content: center; }
}
