/* ══════════════════════════════
   MODULO: Typography
   Font, titoli, paragrafi, link inline
══════════════════════════════ */
body {
  font-family: var(--font-sans);
  font-weight: 300;
  color: var(--text);
}
h1, h2, h3, h4 {
  font-family: var(--font-serif);
  font-weight: 400;
  color: var(--text);
  line-height: 1.15;
  letter-spacing: .04em;
}
/* ── Logo ── */
.logo-name {
  font-family: var(--font-serif);
  font-size: var(--fs-logo);
  font-weight: 500;
  color: var(--text);
  letter-spacing: .1em;
  white-space: nowrap;
  transition: color .4s;
}
.logo-sub {
  font-size: var(--fs-ui-sm);
  letter-spacing: .26em;
  color: var(--muted);
  text-transform: uppercase;
}
/* ── Eyebrow ── */
.cta-eyebrow {
  font-size: var(--fs-title-sm);
  letter-spacing: .32em;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 18px;
  opacity: 0;
  transform: translateY(14px);
  animation: riseIn .6s .3s forwards;
}
/* ── Titolo zona C / pannello ── */
.storia-titolo,
.panel-title {
  font-family: var(--font-serif);
  font-size: var(--fs-title-md);
  font-weight: 400;
  color: var(--text);
  letter-spacing: .04em;
}
.storia-titolo {
  margin-bottom: 18px;
  opacity: 0;
  transform: translateY(14px);
  animation: riseIn .6s .4s forwards;
}
.panel-title { margin-bottom: 24px; }
/* ── Testo storia zona C ── */
.storia-testo {
  opacity: 0;
  transform: translateY(14px);
  animation: riseIn .6s .5s forwards;
}
.storia-testo p {
  font-size: var(--fs-body);
  font-weight: 300;
  color: var(--muted);
  line-height: 1.85;
}
.storia-testo p + p { margin-top: 12px; }
/* ── Link inline ── */
.inline-link {
  font-size: var(--fs-ui);
  font-weight: 500;
  letter-spacing: .08em;
  color: var(--accent);
  border-bottom: 1px solid var(--accent2);
  transition: color .2s, border-color .2s;
  white-space: nowrap;
}
.inline-link:hover { color: var(--text); border-color: var(--accent); }
/* ── Recensioni ── */
.review-nome   { font-size: var(--fs-body);  font-weight: 500; color: var(--text); flex: 1; }
.review-stelle { font-size: var(--fs-ui);    color: var(--accent); letter-spacing: .05em; }
.review-testo  { font-size: var(--fs-body);  font-weight: 300; color: var(--muted); line-height: 1.7; }
/* ── Navigazione ── */
.header-nav ul a {
  font-size: var(--fs-ui);
  font-weight: 400;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted);
}
.mobile-menu a {
  font-size: var(--fs-ui);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--muted);
}
/* ── Footer ── */
.footer-text {
  font-size: var(--fs-ui);
  font-weight: 300;
  color: var(--muted);
  letter-spacing: .04em;
}
.footer-mobile-copy {
  font-size: var(--fs-ui);
  letter-spacing: .1em;
  color: var(--muted);
  text-transform: uppercase;
}
/* ── Settings panel ── */
.settings-panel h3 {
  font-family: var(--font-serif);
  font-size: var(--fs-title-md);
  font-weight: 400;
  color: var(--text);
  margin-bottom: 16px;
  letter-spacing: .06em;
}
.theme-btn {
  font-family: var(--font-sans);
  font-size: var(--fs-ui);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--muted);
}
/* ── Pagina storia ── */
.storia-page-titolo {
  font-family: var(--font-serif);
  font-size: var(--fs-title-xl);
  font-weight: 300;
  color: var(--text);
  letter-spacing: .06em;
}
.storia-testo-wrap h2 {
  font-family: var(--font-serif);
  font-size: var(--fs-title-md);
  font-weight: 400;
  color: var(--text);
  letter-spacing: .04em;
  margin-bottom: 20px;
  line-height: 1.2;
}
.storia-testo-wrap p {
  font-size: var(--fs-body);
  font-weight: 300;
  color: var(--muted);
  line-height: 1.9;
}
/* ── Sottotitolo storia ── */
.storia-sottotitolo {
  font-size: var(--fs-title-sm);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 10px;
  font-weight: 400;
}