/* Policy pages: /politica-de-sostenibilidad/, /politica-integrada-…/, /politica_privacidad/, /politicas/
   Builds on .page-hero--compact and .prose from main.css. */

/* Compact hero: policy titles are long, so the h1 is a step smaller and wider than the default. */
.policy-hero h1 { max-width: 26ch; font-size: clamp(2rem, 1.3rem + 2.6vw, 3.5rem); line-height: 1.1; }

/* Lime check lists inside .prose (main.css already drops the prose indent): same bottom spacing as
   .policy-points and a tighter line-height than the 1.75 body copy, so the check mark sits on line one. */
.prose .check-list { margin-bottom: 1.5em; }
.prose .check-list li { line-height: 1.6; }
/* A list that ends the policy text (/politica-integrada-…/) adds no gap on top of the section padding. */
.prose > :is(.check-list, .policy-points):last-child { margin-bottom: 0; }

/* Commitments with bold lead-ins (e.g. "Integrar la sostenibilidad…: text").
   .prose :is(ul, ol) outranks a single class, so the spacing overrides are scoped to .prose. */
.policy-points { display: grid; gap: .85rem; list-style: none; }
.prose .policy-points { margin-bottom: 1.5em; padding-left: 0; }
.prose .policy-points li {
  margin: 0; padding: 1rem 1.25rem 1.05rem 1.35rem;
  border-left: 4px solid var(--lime); border-radius: 0 var(--radius) var(--radius) 0; background: var(--gray-50);
}
.policy-points strong { display: block; margin-bottom: .2rem; font-family: var(--font-head); line-height: 1.4; color: var(--navy); }

@media (max-width: 767px) {
  .prose .policy-points li { padding: .9rem 1rem .95rem 1.1rem; }
}

/* "Otras políticas": a secondary block, so its heading is one step smaller.
   Cards are <a class="info-card policy-link">: .info-card gives the surface, this adds the link behaviour. */
.policy-related .section-head h2 { font-size: var(--fs-h3); }
.policy-link {
  display: flex; flex-direction: column; gap: .55rem;
  color: var(--ink); text-decoration: none;
  transition: transform .35s var(--ease), box-shadow .35s var(--ease);
}
.policy-link:hover { color: var(--ink); transform: translateY(-4px); box-shadow: var(--shadow); }
.policy-link__title { margin: 0; font-size: var(--fs-h5); color: var(--navy); transition: color .25s var(--ease); }
.policy-link:hover .policy-link__title { color: var(--green-ink); }
.policy-link__text { margin: 0; font-size: .9375rem; color: var(--gray-600); }
.policy-link .link-arrow { margin-top: auto; padding-top: .4rem; }