/**
 * Hero editorial da família Saúde.
 * Escopo: Saúde Pública, Comportamento e Política e Sociedade.
 */

body.page-template-saudepublica,
body.page-template-saudepublica-php,
body.page-template-comportamento,
body.page-template-comportamento-php,
body.page-template-politicaesociedade,
body.page-template-politicaesociedade-php {
  --jc-health-hero-title-color: #f9fafb;
  --jc-health-hero-title-size: clamp(2.25rem, 5vw, 3.5rem);
  --jc-health-menu-title-color: #cbd5e1;
  --jc-health-item-title-color: #f9fafb;
  --jc-health-item-desc-color: #cbd5e1;
  --jc-health-item-title-weight: 800;
  --jc-health-item-desc-weight: 400;
  --jc-health-icon-size: 3rem;
  --jc-health-chip-size: .75rem;
  --jc-health-chip-padding: .35rem .7rem;
  --jc-health-chip-gap: .45rem;
  --jc-health-hero-top-padding: clamp(28px, 3vw, 42px);
}

body.page-template-saudepublica .hero-saude,
body.page-template-saudepublica-php .hero-saude,
body.page-template-comportamento .hero-saude,
body.page-template-comportamento-php .hero-saude,
body.page-template-politicaesociedade .hero-saude,
body.page-template-politicaesociedade-php .hero-saude {
  padding-top: var(--jc-health-hero-top-padding);
}

body.page-template-saudepublica .hero-left h1,
body.page-template-saudepublica-php .hero-left h1,
body.page-template-comportamento .hero-left h1,
body.page-template-comportamento-php .hero-left h1,
body.page-template-politicaesociedade .hero-left h1,
body.page-template-politicaesociedade-php .hero-left h1 {
  color: var(--jc-health-hero-title-color);
  font-size: var(--jc-health-hero-title-size);
}

body.page-template-saudepublica .hero-menu-title,
body.page-template-saudepublica-php .hero-menu-title,
body.page-template-comportamento .hero-menu-title,
body.page-template-comportamento-php .hero-menu-title,
body.page-template-politicaesociedade .hero-menu-title,
body.page-template-politicaesociedade-php .hero-menu-title {
  color: var(--jc-health-menu-title-color);
}

body.page-template-saudepublica .hero-info a,
body.page-template-saudepublica-php .hero-info a,
body.page-template-comportamento .hero-info a,
body.page-template-comportamento-php .hero-info a,
body.page-template-politicaesociedade .hero-info a,
body.page-template-politicaesociedade-php .hero-info a {
  color: var(--jc-health-item-title-color);
  font-weight: var(--jc-health-item-title-weight);
  text-transform: none;
}

body.page-template-saudepublica .hero-info p,
body.page-template-saudepublica-php .hero-info p,
body.page-template-comportamento .hero-info p,
body.page-template-comportamento-php .hero-info p,
body.page-template-politicaesociedade .hero-info p,
body.page-template-politicaesociedade-php .hero-info p {
  color: var(--jc-health-item-desc-color);
  font-weight: var(--jc-health-item-desc-weight);
  letter-spacing: normal;
  text-transform: none;
}

body.page-template-saudepublica .hero-icon,
body.page-template-saudepublica-php .hero-icon,
body.page-template-comportamento .hero-icon,
body.page-template-comportamento-php .hero-icon,
body.page-template-politicaesociedade .hero-icon,
body.page-template-politicaesociedade-php .hero-icon {
  width: var(--jc-health-icon-size) !important;
  height: var(--jc-health-icon-size) !important;
  min-width: var(--jc-health-icon-size) !important;
  min-height: var(--jc-health-icon-size) !important;
  max-width: var(--jc-health-icon-size) !important;
  max-height: var(--jc-health-icon-size) !important;
  aspect-ratio: 1 / 1;
  flex: 0 0 auto;
  border-radius: 999px !important;
  box-sizing: border-box;
}

body.page-template-saudepublica .hero-anchors,
body.page-template-saudepublica-php .hero-anchors,
body.page-template-comportamento .hero-anchors,
body.page-template-comportamento-php .hero-anchors,
body.page-template-politicaesociedade .hero-anchors,
body.page-template-politicaesociedade-php .hero-anchors {
  gap: var(--jc-health-chip-gap);
}

body.page-template-saudepublica .hero-anchors a,
body.page-template-saudepublica-php .hero-anchors a,
body.page-template-comportamento .hero-anchors a,
body.page-template-comportamento-php .hero-anchors a,
body.page-template-politicaesociedade .hero-anchors a,
body.page-template-politicaesociedade-php .hero-anchors a {
  padding: var(--jc-health-chip-padding);
  font-size: var(--jc-health-chip-size);
  white-space: nowrap;
}

@media (max-width: 700px) {
  body.page-template-saudepublica .hero-anchors a,
  body.page-template-saudepublica-php .hero-anchors a,
  body.page-template-comportamento .hero-anchors a,
  body.page-template-comportamento-php .hero-anchors a,
  body.page-template-politicaesociedade .hero-anchors a,
  body.page-template-politicaesociedade-php .hero-anchors a {
    white-space: normal;
  }
}