/*
 * ODH Spacing Hotfix v1.3.7
 * Objetivo: quitar el hueco excesivo antes del H1 del hero y reducir espacios desproporcionados entre H2/secciones.
 * Se carga al final para corregir el sistema global sin modificar artículos importados.
 */

/* 1) Hero: menos aire muerto por arriba antes del H1 */
body.single-post .odh-article .odh-hero,
body.page .odh-article .odh-hero {
  margin-top: 0 !important;
  padding-top: clamp(18px, 2.2vw, 32px) !important;
  padding-bottom: clamp(26px, 3vw, 44px) !important;
}

body.single-post .odh-article .odh-hero .odh-wrap,
body.page .odh-article .odh-hero .odh-wrap {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body.single-post .odh-article .odh-hero .odh-kicker,
body.page .odh-article .odh-hero .odh-kicker {
  margin-bottom: clamp(8px, 1vw, 12px) !important;
}

body.single-post .odh-article .odh-hero h1,
body.page .odh-article .odh-hero h1 {
  margin-top: 0 !important;
  margin-bottom: clamp(12px, 1.6vw, 20px) !important;
}

body.single-post .odh-article .odh-hero .odh-hero__intro,
body.page .odh-article .odh-hero .odh-hero__intro {
  margin-top: 0 !important;
  margin-bottom: clamp(12px, 1.5vw, 18px) !important;
}

body.single-post .odh-article .odh-hero .odh-hero__meta,
body.page .odh-article .odh-hero .odh-hero__meta {
  margin-top: clamp(10px, 1.2vw, 16px) !important;
}

/* 2) Secciones principales: ritmo editorial más compacto, sin mazacote */
body.single-post .odh-article > .odh-section,
body.page .odh-article > .odh-section {
  padding-top: clamp(34px, 4vw, 56px) !important;
  padding-bottom: clamp(34px, 4vw, 56px) !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* La sección inmediatamente posterior al hero debe acercarse más */
body.single-post .odh-article > .odh-hero + .odh-section,
body.page .odh-article > .odh-hero + .odh-section {
  padding-top: clamp(24px, 3vw, 40px) !important;
}

/* Si dos secciones claras/suaves van seguidas, evitar dobles colchones visuales */
body.single-post .odh-article > .odh-section--soft + .odh-section,
body.single-post .odh-article > .odh-section--light + .odh-section,
body.page .odh-article > .odh-section--soft + .odh-section,
body.page .odh-article > .odh-section--light + .odh-section {
  padding-top: clamp(28px, 3.5vw, 46px) !important;
}

/* 3) H2/H3: quitar margen superior duplicado cuando ya hay padding de sección */
body.single-post .odh-article .odh-wrap > h2:first-child,
body.single-post .odh-article .odh-card > h2:first-child,
body.single-post .odh-article .odh-quick > h2:first-child,
body.single-post .odh-article .odh-method > h2:first-child,
body.single-post .odh-article .odh-related > h2:first-child,
body.page .odh-article .odh-wrap > h2:first-child,
body.page .odh-article .odh-card > h2:first-child,
body.page .odh-article .odh-quick > h2:first-child,
body.page .odh-article .odh-method > h2:first-child,
body.page .odh-article .odh-related > h2:first-child {
  margin-top: 0 !important;
}

body.single-post .odh-article h2,
body.page .odh-article h2 {
  margin-top: clamp(22px, 3vw, 34px) !important;
  margin-bottom: clamp(12px, 1.8vw, 20px) !important;
}

body.single-post .odh-article h3,
body.page .odh-article h3 {
  margin-top: clamp(18px, 2.5vw, 28px) !important;
  margin-bottom: clamp(8px, 1.4vw, 14px) !important;
}

/* 4) Cards/tablas/figuras: evitar huecos enormes antes y después */
body.single-post .odh-article .odh-card,
body.single-post .odh-article .odh-quick,
body.single-post .odh-article .odh-method,
body.single-post .odh-article .odh-decision,
body.single-post .odh-article .odh-table-wrap,
body.page .odh-article .odh-card,
body.page .odh-article .odh-quick,
body.page .odh-article .odh-method,
body.page .odh-article .odh-decision,
body.page .odh-article .odh-table-wrap {
  margin-top: clamp(16px, 2.2vw, 26px) !important;
  margin-bottom: clamp(16px, 2.2vw, 26px) !important;
}

body.single-post .odh-article .odh-figure,
body.page .odh-article .odh-figure {
  margin-top: clamp(22px, 3vw, 38px) !important;
  margin-bottom: clamp(24px, 3vw, 42px) !important;
}

/* 5) Producto ancho: mantener separación premium, pero sin saltos exagerados */
body.single-post .odh-article .odh-product-wide,
body.page .odh-article .odh-product-wide {
  margin-top: clamp(22px, 3vw, 36px) !important;
  margin-bottom: clamp(22px, 3vw, 36px) !important;
}

body.single-post .odh-article .odh-product-wide + .odh-product-wide,
body.page .odh-article .odh-product-wide + .odh-product-wide {
  margin-top: clamp(24px, 3vw, 40px) !important;
}

/* 6) Listas: defensa adicional contra márgenes verticales raros del tema/plugins */
body.single-post .odh-article ul,
body.single-post .odh-article ol,
body.page .odh-article ul,
body.page .odh-article ol {
  margin-top: clamp(8px, 1vw, 12px) !important;
  margin-bottom: clamp(10px, 1.4vw, 18px) !important;
}

/* 7) Ajuste móvil: más compacto aún, porque el scroll se alarga mucho */
@media (max-width: 768px) {
  body.single-post .odh-article .odh-hero,
  body.page .odh-article .odh-hero {
    padding-top: 18px !important;
    padding-bottom: 30px !important;
  }

  body.single-post .odh-article > .odh-section,
  body.page .odh-article > .odh-section {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }

  body.single-post .odh-article > .odh-hero + .odh-section,
  body.page .odh-article > .odh-hero + .odh-section {
    padding-top: 22px !important;
  }

  body.single-post .odh-article h2,
  body.page .odh-article h2 {
    margin-top: 20px !important;
    margin-bottom: 12px !important;
  }

  body.single-post .odh-article .odh-product-wide,
  body.page .odh-article .odh-product-wide {
    margin-top: 22px !important;
    margin-bottom: 22px !important;
  }
}