/* Presentación pública. Selectores acotados: no estilizar modales ni sus controles. */
body[class] {
  background: linear-gradient(110deg, #e8ece9 0%, #f8faf8 48%, #e9edeb 100%);
}
body[class] > header[class] {
  background: linear-gradient(110deg, #17221d, #303c35 65%, #49534c);
  box-shadow: 0 3px 18px #14251c20;
  border-bottom: 1px solid #ffffff1c;
}
body[class] > footer[class] {
  background: linear-gradient(110deg, #17221d, #303c35 65%, #49534c);
  border-top: 3px solid #238257;
  padding-block: 30px;
}
body > footer > div { max-width: 1280px; }
body > footer p { line-height: 1.8; }

/* Un único formato horizontal: imagen completa, sin deformación ni recorte.
   Alturas independientes de la altura de la ventana. */
body .site-hero {
  height: 400px;
  overflow: hidden;
  background-color: #24352c;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  isolation: isolate;
}
.site-hero > div:first-child {
  background: linear-gradient(180deg, #0d1e1710, #0d1e1728 45%, #0d1e17c9);
}
.site-hero > div:nth-child(2) {
  padding: 28px;
}
.site-hero h1 {
  max-width: 1000px;
  text-align: center;
  text-wrap: balance;
  font-size: 44px;
  font-weight: 700;
  line-height: 1.16;
  letter-spacing: -.025em;
  text-shadow: 0 2px 18px #07150cb3;
}
.site-hero h1::after {
  content: "";
  display: block;
  width: 52px;
  height: 4px;
  margin: 22px auto 0;
  border-radius: 4px;
  background: #6bd59a;
}
body .site-hero-logo { height: 250px; max-width: 90%; object-fit: contain; }
#heroBand > div:nth-child(2) { gap: 20px; }
#heroBand a {
  min-height: 46px;
  padding: 12px 24px;
  border-radius: 12px;
  background: #147443;
  box-shadow: 0 8px 24px #0003;
}
.site-hero + div,
#inicio + [role="separator"] {
  height: 5px;
  background: linear-gradient(90deg, #23352a, #36985f 50%, #23352a);
}

/* Contenido público: no aplicar reglas globales a títulos ni botones. */
body[class] > section:not(:has(.site-hero)), body[class] > main {
  background: transparent;
  padding-top: 48px;
  padding-bottom: 56px;
}
body > section[data-news-sector] { min-height: 260px; }
body > main:has(#historia) { padding-top: 16px; }
#historia { padding-inline: 0; }
#newsList, #homeRight { min-width: 0; }
#homeRight > .grid { gap: 12px; }
#homeRight > .grid > a,
#sectorsGrid > a,
#newsList > article,
[data-news-sector] article,
#clsGrid > article,
#newsArticle {
  border: 1px solid #dbe5dd;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 5px 20px #22382b08;
}
#homeRight > .grid > a, #sectorsGrid > a {
  padding: 18px;
  gap: 12px;
  align-items: flex-start;
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
#homeRight > .grid > a > span, #sectorsGrid > a > span {
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  border-radius: 13px;
}
#homeRight h3 { font-size: 14px; line-height: 1.4; }
#homeRight .grid p { margin-top: 5px; font-size: 12px; line-height: 1.55; }
#homeRight > a { font-size: 14px; font-weight: 600; margin-top: 20px; }
#sectorsGrid > a { padding: 26px; }
#sectorsGrid h3 { line-height: 1.35; }
#sectorsGrid p { line-height: 1.65; }
#newsList > article { padding: 20px; }
#newsList h3 { line-height: 1.4; }
#newsList > article p { line-height: 1.65; }
#newsList { gap: 18px; }
#homeRight > h2,
body > section:has(#newsList) > div > .grid > div:first-child > h2 {
  font-size: 28px;
  letter-spacing: -.025em;
  font-weight: 700;
  margin-bottom: 24px;
  color: #223b2d;
}
[data-news-sector] > p {
  padding: 32px;
  border: 1px dashed #bacfc0;
  border-radius: 18px;
  background: #ffffffa6;
  text-align: center;
}
#clsGrid { gap: 24px; }
body > section:has(#clsGrid) > div:first-child {
  padding-bottom: 26px;
  border-bottom: 1px solid #d7e2db;
}
body > section:has(#clsGrid) > div:first-child h2 { font-size: 36px; }
body > section:has(#clsGrid) > div:first-child p { margin-top: 12px; font-size: 16px; }
#newsArticle { overflow: hidden; }
#newsTitle { font-size: 36px; line-height: 1.2; letter-spacing: -.025em; text-wrap: balance; }
#newsDate { color: #52705c; }
#newsBody { color: #38483e; line-height: 1.85; }

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  #homeRight > .grid > a:hover, #sectorsGrid > a:hover {
    transform: translateY(-3px);
    border-color: #83b798;
    box-shadow: 0 12px 24px #22382b12;
  }
}
#homeRight a:focus-visible, #sectorsGrid a:focus-visible, #heroBand a:focus-visible {
  outline: 3px solid #37a66b;
  outline-offset: 4px;
}
@media (min-width: 768px) and (max-width: 1023px) {
  body .site-hero { height: 320px; }
  body .site-hero-logo { height: 190px; }
  .site-hero h1 { font-size: 36px; }
}
@media (max-width: 767px) {
  body .site-hero { height: 240px; }
  body .site-hero-logo { height: 130px; }
  .site-hero > div:nth-child(2) { padding: 20px; }
  .site-hero:not(#heroBand) { background-position: center top; }
  .site-hero:not(#heroBand) > div:nth-child(2) { align-items: flex-end; }
  .site-hero h1 { font-size: 28px; line-height: 1.2; }
  .site-hero h1::after { margin-top: 16px; width: 40px; height: 3px; }
  #heroBand > div:nth-child(2) { gap: 12px; }
  #heroBand a { min-height: 44px; padding: 10px 18px; font-size: 14px; }
  body[class] > section:not(:has(.site-hero)), body[class] > main { padding-block: 32px; }
  body > section[data-news-sector] { min-height: 200px; }
  #homeRight > .grid > a { padding: 14px; flex-direction: column; gap: 10px; }
  #homeRight > .grid > a > span { flex-basis: 38px; width: 38px; height: 38px; }
  #homeRight > .grid { gap: 10px; }
  #newsList > article { padding: 16px; }
  #sectorsGrid > a { padding: 20px; }
  #newsTitle, body > section:has(#clsGrid) > div:first-child h2 { font-size: 28px; }
  #newsBody { font-size: 16px; }
  body[class] > footer[class] { padding-block: 24px; }
  body > footer p { text-align: center; }
}
