/* Vivipedia 28.6 RC24 — articoli ricongiunti al sistema Atlante Vivo
   Migliora la lettura senza creare un secondo tema grafico. */

body.v286-article-page {
  --v286-reading-width: 46rem;
  --v286-aside-width: 18rem;
}

body.v286-article-page::after {
  content: "";
  position: fixed;
  inset: 0 0 auto;
  z-index: 9999;
  height: 3px;
  pointer-events: none;
  transform: scaleX(var(--v286-progress, 0));
  transform-origin: left center;
  background: linear-gradient(90deg, var(--v242-sage, #405e4a), var(--v242-oro, #d8a63f), var(--v242-clay, #b96f4a));
}

/* Il guscio globale resta quello di Atlante Vivo: header, logo, nav, sfondo e footer
   non vengono più ridisegnati dal template articolo. */
.v286-article-page main {
  overflow: clip;
}

/* Articoli con il template editoriale recente */
.v286-article-page .v282-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(17rem, .65fr);
  gap: clamp(1.5rem, 4vw, 3.5rem);
  align-items: end;
  max-width: 1180px;
  margin: 22px auto 16px;
  padding: clamp(2.2rem, 6vw, 5rem) clamp(1.25rem, 4vw, 3rem);
  overflow: hidden;
  border: 1px solid var(--v242-line, rgba(20,36,31,.16));
  border-radius: var(--radius-xl, 38px);
  background:
    radial-gradient(circle at 82% 15%, rgba(216,166,63,.22), transparent 22rem),
    linear-gradient(135deg, rgba(255,253,247,.96), rgba(243,234,216,.92) 54%, rgba(223,234,222,.80));
  box-shadow: var(--shadow, 0 24px 70px rgba(34,42,34,.10));
}

.v286-article-page .v282-hero::before {
  content: "";
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(20,36,31,.08);
  border-radius: calc(var(--radius-xl, 38px) - 10px);
  pointer-events: none;
}

.v286-article-page .v282-hero::after {
  content: "";
  position: absolute;
  right: -7rem;
  bottom: -9rem;
  width: 25rem;
  height: 25rem;
  border: 1px solid rgba(64,94,74,.15);
  border-radius: 50%;
  box-shadow: 0 0 0 3.2rem rgba(64,94,74,.045), 0 0 0 6.4rem rgba(185,111,74,.03);
  pointer-events: none;
}

.v286-article-page .v282-hero > * {
  position: relative;
  z-index: 1;
}

.v286-article-page .v282-overline {
  color: var(--v242-sage, #405e4a);
  letter-spacing: .13em;
}

.v286-article-page .v282-overline::before {
  background: var(--v242-clay, #b96f4a);
}

.v286-article-page .v282-hero h1 {
  max-width: 16ch;
  margin: 1rem 0;
  color: var(--v242-ink, #14241f);
  font-family: var(--v242-serif, Georgia, "Times New Roman", serif);
  font-size: clamp(2.65rem, 6.2vw, 5.5rem);
  font-weight: 700;
  line-height: .94;
  letter-spacing: -.067em;
  text-wrap: balance;
}

.v286-article-page .v282-hero .lead {
  max-width: 62ch;
  margin: 0;
  color: #4c5b52;
  font-size: clamp(1.08rem, 2vw, 1.32rem);
  line-height: 1.62;
}

.v286-article-page .v282-hero-note {
  padding: 1.5rem;
  border: 1px solid var(--v242-line, rgba(20,36,31,.16));
  border-radius: var(--radius-lg, 28px);
  background: rgba(255,253,247,.84);
  box-shadow: 0 18px 48px rgba(20,36,31,.08);
  transform: none;
}

.v286-article-page .v282-hero-note strong {
  color: var(--v242-ink, #14241f);
  font-family: var(--v242-serif, Georgia, "Times New Roman", serif);
  font-size: 1.3rem;
}

.v286-article-page .v282-hero-note span {
  color: var(--muted, #5f6b63);
}

.v286-article-page .v282-actions .btn {
  min-height: 44px;
}

.v286-article-page .v282-route-line {
  max-width: 1080px;
  margin: 0 auto 1rem;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.v286-article-page .v282-route-line ol {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: .55rem;
  margin: 0;
  padding: .65rem;
  border: 1px solid var(--v242-line, rgba(20,36,31,.16));
  border-radius: var(--radius-md, 20px);
  background: rgba(255,253,247,.72);
  list-style: none;
}

.v286-article-page .v282-route-line li {
  min-width: 0;
  padding: .65rem .7rem;
  border-radius: .85rem;
  color: var(--muted, #5f6b63);
  font-size: .88rem;
  text-align: center;
}

.v286-article-page .v282-route-line li::before {
  display: none;
}

.v286-article-page .v282-route-line li.is-current {
  color: var(--v242-sage, #405e4a);
  background: var(--v242-sage-2, #dfeade);
  font-weight: 900;
}

.v286-article-page .v282-reading-layout {
  display: grid;
  grid-template-columns: minmax(0, var(--v286-reading-width)) minmax(14rem, var(--v286-aside-width));
  gap: clamp(2rem, 6vw, 5rem);
  align-items: start;
  max-width: 1080px;
  margin: 0 auto;
  padding: 2.5rem clamp(1rem, 4vw, 2rem) 5rem;
}

.v286-article-page .v282-copy {
  color: var(--v242-ink-2, #273a33);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: 1.08rem;
  line-height: 1.82;
}

.v286-article-page .v282-copy > p:first-of-type {
  color: #34463d;
  font-size: 1.17rem;
  line-height: 1.72;
}

.v286-article-page .v282-copy > p:first-of-type::first-letter {
  float: left;
  margin: .08em .12em 0 0;
  color: var(--v242-clay, #b96f4a);
  font-family: var(--v242-serif, Georgia, "Times New Roman", serif);
  font-size: 4.35rem;
  font-weight: 700;
  line-height: .8;
}

.v286-article-page .v282-copy h2 {
  margin: 3.7rem 0 1rem;
  color: var(--v242-ink, #14241f);
  font-family: var(--v242-serif, Georgia, "Times New Roman", serif);
  font-size: clamp(1.85rem, 4vw, 2.7rem);
  line-height: 1.05;
  letter-spacing: -.05em;
  text-wrap: balance;
}

.v286-article-page .v282-copy h2::before {
  content: "";
  display: block;
  width: 3rem;
  height: 4px;
  margin-bottom: .9rem;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--v242-sage, #405e4a), var(--v242-oro, #d8a63f));
}

.v286-article-page .v282-copy h3 {
  color: var(--v242-ink, #14241f);
  font-family: inherit;
}

.v286-article-page .v282-copy a {
  color: var(--v242-sage, #405e4a);
  text-decoration-color: rgba(185,111,74,.65);
  text-decoration-thickness: .08em;
  text-underline-offset: .2em;
}

.v286-article-page .v282-copy blockquote {
  border-left-color: var(--v242-clay, #b96f4a);
  background: rgba(242,211,194,.34);
}

.v286-article-page .v282-scene,
.v286-article-page .v282-fast,
.v286-article-page .v282-notebook,
.v286-article-page .v282-limit,
.v286-article-page .v282-sources,
.v286-article-page .v282-turn {
  margin: 2.25rem 0;
  padding: clamp(1.25rem, 4vw, 1.9rem);
  border-radius: var(--radius-lg, 28px);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

.v286-article-page .v282-scene {
  border: 1px solid rgba(185,111,74,.22);
  background: linear-gradient(135deg, rgba(242,211,194,.48), rgba(255,253,247,.88));
}

.v286-article-page .v282-fast {
  border: 1px solid rgba(64,94,74,.22);
  background: linear-gradient(135deg, rgba(223,234,222,.72), rgba(255,253,247,.9));
}

.v286-article-page .v282-notebook {
  border: 1px solid rgba(216,166,63,.30);
  background:
    repeating-linear-gradient(180deg, transparent 0, transparent 2.1rem, rgba(64,94,74,.08) 2.15rem),
    var(--v242-pagina, #fffdf7);
  box-shadow: 0 16px 44px rgba(20,36,31,.055);
}

.v286-article-page .v282-limit {
  border: 1px solid var(--v242-line, rgba(20,36,31,.16));
  background: var(--v242-carta-2, #f3ead8);
}

.v286-article-page .v282-sources {
  border: 1px solid var(--v242-line, rgba(20,36,31,.16));
  background: rgba(255,253,247,.84);
  font-size: .94rem;
}

.v286-article-page .v282-turn {
  color: #fffaf1;
  background: linear-gradient(135deg, var(--v242-ink, #14241f), var(--v242-sage, #405e4a));
  box-shadow: 0 20px 55px rgba(20,36,31,.16);
}

.v286-article-page .v282-aside {
  position: sticky;
  top: 6.5rem;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

.v286-article-page .v282-aside nav,
.v286-article-page .v282-aside .v282-aside-card {
  padding: 1.2rem;
  border: 1px solid var(--v242-line, rgba(20,36,31,.16));
  border-radius: var(--radius-md, 20px);
  background: rgba(255,253,247,.82);
  box-shadow: 0 14px 38px rgba(20,36,31,.055);
}

.v286-article-page .v282-aside nav {
  border-top: 4px solid var(--v242-sage, #405e4a);
}

.v286-article-page .v282-aside nav a {
  border-bottom: 1px solid rgba(20,36,31,.07);
  color: var(--muted, #5f6b63);
}

.v286-article-page .v282-aside nav a:hover,
.v286-article-page .v282-aside-card > a {
  color: var(--v242-sage, #405e4a);
}

/* Articoli storici: stessa identità, migliore leggibilità, nessun tema parallelo. */
.v286-article-page .article-hero {
  max-width: 1180px;
  margin-inline: auto;
  padding: clamp(2.2rem, 6vw, 4.6rem) clamp(1.25rem, 4vw, 3rem);
}

.v286-article-page .article-hero h1 {
  max-width: 17ch;
  color: var(--v242-ink, #14241f);
  font-family: var(--v242-serif, Georgia, "Times New Roman", serif);
  font-size: clamp(2.65rem, 6vw, 5.3rem);
  font-weight: 700;
  line-height: .95;
  letter-spacing: -.065em;
  text-wrap: balance;
}

.v286-article-page .article-hero .lead,
.v286-article-page .article-hero > p {
  max-width: 64ch;
  color: #4c5b52;
  font-size: clamp(1.08rem, 2vw, 1.3rem);
  line-height: 1.62;
}

.v286-article-page .article-visual {
  border: 1px solid var(--v242-line, rgba(20,36,31,.16));
  border-radius: var(--radius-lg, 28px);
  background: linear-gradient(145deg, var(--v242-sage-2, #dfeade), var(--v242-carta-2, #f3ead8));
  box-shadow: 0 18px 50px rgba(20,36,31,.09);
}

.v286-article-page main > .section,
.v286-article-page .section {
  max-width: 1100px;
  margin-inline: auto;
}

.v286-article-page .article-body {
  max-width: 760px;
  margin-inline: auto;
  color: var(--v242-ink-2, #273a33);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: 1.08rem;
  line-height: 1.82;
}

.v286-article-page .article-body h2 {
  margin-top: 3.5rem;
  color: var(--v242-ink, #14241f);
  font-family: var(--v242-serif, Georgia, "Times New Roman", serif);
  font-size: clamp(1.85rem, 4vw, 2.65rem);
  line-height: 1.06;
  letter-spacing: -.05em;
  text-wrap: balance;
}

.v286-article-page .article-body h2::before {
  content: "";
  display: block;
  width: 3rem;
  height: 4px;
  margin-bottom: .9rem;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--v242-sage, #405e4a), var(--v242-oro, #d8a63f));
}

.v286-article-page .article-body h3 {
  color: var(--v242-ink, #14241f);
  font-family: inherit;
}

.v286-article-page .article-body a {
  color: var(--v242-sage, #405e4a);
  text-decoration-color: rgba(185,111,74,.65);
}

.v286-article-page .in-breve,
.v286-article-page .magazine-panel,
.v286-article-page .note,
.v286-article-page .v203-article-kit,
.v286-article-page .v210-article-trust,
.v286-article-page .v160-article-tools {
  border-color: var(--v242-line, rgba(20,36,31,.16));
  border-radius: var(--radius-lg, 28px);
  background: rgba(255,253,247,.84);
  box-shadow: 0 14px 38px rgba(20,36,31,.055);
}

.v286-article-page .in-breve {
  border-left: 5px solid var(--v242-clay, #b96f4a);
}

.v286-article-page .card {
  border-color: var(--v242-line, rgba(20,36,31,.16));
  border-radius: var(--radius-lg, 28px);
}

@media (max-width: 900px) {
  .v286-article-page .v282-hero {
    grid-template-columns: 1fr;
    margin: 12px 10px 14px;
    border-radius: 30px;
  }

  .v286-article-page .v282-route-line ol {
    grid-template-columns: repeat(2, 1fr);
  }

  .v286-article-page .v282-reading-layout {
    grid-template-columns: 1fr;
    padding-top: 1.8rem;
  }

  .v286-article-page .v282-aside {
    position: static;
  }

  .v286-article-page .v282-aside nav {
    display: none;
  }

  .v286-article-page .article-hero {
    margin: 12px 10px;
    border-radius: 30px;
  }

  .v286-article-page .article-hero-copy {
    order: 1;
  }

  .v286-article-page .article-visual {
    order: 2;
    max-height: 240px;
    margin-top: .4rem;
  }

  .v286-article-page .article-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .v286-article-page main > .section,
  .v286-article-page .section {
    margin-left: 10px;
    margin-right: 10px;
  }
}

@media (max-width: 620px) {
  .v286-article-page .v282-hero h1,
  .v286-article-page .article-hero h1 {
    font-size: clamp(2.45rem, 13vw, 4rem);
  }

  .v286-article-page .v282-route-line ol {
    grid-template-columns: 1fr;
  }

  .v286-article-page .v282-copy,
  .v286-article-page .article-body {
    font-size: 1.02rem;
    line-height: 1.76;
  }

  .v286-article-page .v282-copy > p:first-of-type::first-letter {
    font-size: 3.8rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.v286-article-page::after {
    display: none;
  }
}

/* Vivipedia 29.1: unico spazio pubblicitario del pilota AdSense. */
.viv-adsense-slot {
  width: min(100%, 760px);
  min-height: 120px;
  margin: 2.4rem auto;
  padding: .75rem;
  border: 1px solid rgba(31, 54, 47, .14);
  border-radius: 18px;
  background: rgba(255, 255, 255, .72);
  text-align: center;
  overflow: hidden;
}

.viv-adsense-label {
  display: block;
  margin-bottom: .5rem;
  color: #68756f;
  font-size: .72rem;
  line-height: 1.2;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.viv-adsense-slot .adsbygoogle {
  display: block;
  min-height: 90px;
}