/* ═══ Meteo Irpinia — pagina Storia del territorio ═══ */
#storia-main{max-width:920px}
.st-block{display:grid;grid-template-columns:400px 1fr;gap:26px;align-items:center;margin:0 0 14px}
.st-block.reverse{grid-template-columns:1fr 400px}
.st-block.reverse .st-art{order:2}
.st-art svg{width:100%;height:auto;border-radius:16px;box-shadow:0 6px 20px rgba(0,0,0,.12);display:block}
.st-txt .st-tag{display:inline-block;font-family:var(--mono,monospace);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:#fff;background:var(--tag,#666);padding:3px 10px;border-radius:999px;margin-bottom:10px}
.st-txt h2{margin:.1em 0 .5em;font-size:1.5rem;line-height:1.2}
.st-txt h2 em{font-style:italic;color:var(--ink-600)}
.st-txt p{margin:0 0 .8em;line-height:1.65;color:var(--ink-900);text-align:justify;hyphens:auto}
.st-txt strong{color:var(--ink-900)}

/* box record */
.rec-strip{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:18px 20px;margin:0 0 30px}
.rec-strip-h{margin-bottom:12px}
.rec-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.rec-c{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:12px;background:var(--surface-2,rgba(148,163,184,.06))}
.rec-c .rec-ic{font-size:1.3rem;line-height:1;flex:none;margin-top:2px}
.rec-c.hot .rec-ic{color:#E0803A}
.rec-c.cold .rec-ic{color:#5FA8D3}
.rec-c.gust .rec-ic{color:#7C5CBF}
.rec-c.note .rec-ic{color:#E0A93A}
.rec-c b{display:block;font-size:1.35rem;font-family:var(--mono,monospace);margin-bottom:2px}
.rec-c small{color:var(--ink-600);font-size:.8rem;line-height:1.4;display:block}
.rec-link{display:inline-block;margin-top:14px;font-size:.85rem;color:var(--teal,#0E7490);text-decoration:none;font-weight:600}
.rec-link:hover{text-decoration:underline}

/* timeline */
.tl-block{margin:10px 0 30px}
.tl-block h2{margin:.1em 0 .8em;font-size:1.4rem}
.tl{position:relative;padding-left:24px}
.tl::before{content:'';position:absolute;left:6px;top:4px;bottom:4px;width:2px;background:linear-gradient(180deg,#B45309,#15803D)}
.tl-i{position:relative;padding:0 0 16px 8px}
.tl-i::before{content:'';position:absolute;left:-22px;top:5px;width:10px;height:10px;border-radius:50%;background:var(--teal,#0E7490);box-shadow:0 0 0 3px var(--surface)}
.tl-y{font-family:var(--mono,monospace);font-size:.72rem;letter-spacing:.06em;color:var(--teal,#0E7490);font-weight:700;text-transform:uppercase}
.tl-i p{margin:.2em 0 0;line-height:1.5;color:var(--ink-900)}

/* mobile */
@media(max-width:720px){
  .st-block,.st-block.reverse{grid-template-columns:1fr;gap:14px}
  .st-block.reverse .st-art{order:0}
  .rec-cards{grid-template-columns:1fr}
}

/* leggibilità testi: intro e paragrafi giustificati e ben contrastati */
#storia-main .page-head p{color:var(--ink-600);text-align:justify;hyphens:auto;line-height:1.6}
.tl-i p{text-align:justify;hyphens:auto}