/* Índice de impactos climáticos sobre Common. */
.danos-main { padding: clamp(1.5rem, 4vw, 3rem) 0; }
.danos-secciones { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.25rem; }
.danos-secciones a { display: inline-flex; align-items: center; min-height: 44px; padding: .4rem .7rem; border: 1px solid var(--jm-border); border-radius: 999px; background: var(--jm-surface); }
.danos-hero { padding: clamp(1.5rem, 4vw, 2.5rem); margin-bottom: 2rem; border: 1px solid var(--jm-border); border-radius: 12px; background: linear-gradient(145deg, var(--jm-surface), var(--jm-bg-soft)); }
.danos-hero h1 { margin-bottom: .75rem; }
.danos-hero p { margin-bottom: 0; font-size: 1.08rem; }
.page2 main section { margin-bottom: 2.25rem; }
.page2 main section h2 { margin-bottom: 1rem; }
.page2 .grid { display: grid; gap: 1.25rem; }
.page2 .cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.page2 .cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.page2 .grid > * { min-width: 0; }
.page2 .card { padding: 1.25rem; border: 1px solid var(--jm-border); border-radius: 12px; background: var(--jm-surface); }
.page2 .card h3 { margin: 0 0 .7rem; font-size: 1.2rem; }
.page2 .card p { margin: 0; }
.page2 .card .small, .page2 .card .meta { color: var(--jm-text-muted); font-size: .94rem; }
.page2 .card.kpi .kpi { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; margin-bottom: .7rem; }
.page2 .card.kpi .value { font-size: 1.65rem; font-weight: 700; }
.page2 .card.kpi .pill { display: inline-flex; align-items: center; min-height: 32px; padding: .25rem .65rem; border: 1px solid var(--jm-border); border-radius: 999px; background: #fff3d8; color: #664800; font-size: .88rem; }
.page2 a.card { display: block; color: var(--jm-text); text-decoration: none; }
.page2 a.card:hover { color: var(--jm-primary); }
.page2 a.card:focus-visible { outline: 3px solid var(--jm-primary); outline-offset: 4px; }
.page2 #embed-destacado .card p:first-child { margin-bottom: 1rem; }
.page2 #embed-destacado .card p:last-child { margin-top: 1rem; }
.page2 #embed-destacado iframe { display: block; width: 100%; height: 600px; border: 0; }
@media (max-width: 1000px) { .page2 .cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .page2 .cols-3, .page2 .cols-2 { grid-template-columns: 1fr; } .page2 #embed-destacado iframe { height: 500px; } }