/* ═══════════════════════════════════════════════════════════════ */
/*  DESIGN TOKENS                                                  */
/* ═══════════════════════════════════════════════════════════════ */
:root {
  /* Palette */
  --cream:        #FFFFFF;
  --cream-2:      #F7F4ED;
  --cream-3:      #ECE7DA;
  --paper:        #FFFFFF;
  --forest:       #0E1A12;
  --forest-2:     #16261D;
  --forest-soft:  rgba(14, 26, 18, .72);
  --coral:        #E64C36;
  --coral-deep:   #C53C28;
  --coral-soft:   #F37A66;
  --gold:         #E0B23C;
  --gold-deep:    #B88D24;
  --ink:          #1B1A18;
  --muted:        #5E5D55;
  --muted-soft:   #8B8A82;
  --hair:         rgba(14, 26, 18, .14);
  --hair-2:       rgba(14, 26, 18, .26);

  /* Type */
  --serif: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --sans: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --mono:         ui-monospace, "SF Mono", "Roboto Mono", monospace;

  /* Geometry */
  --radius-s: 12px;
  --radius:   20px;
  --radius-l: 28px;

  /* Shadows */
  --shadow-soft: 0 14px 36px -22px rgba(14, 26, 18, .32);
  --shadow-lift: 0 30px 60px -28px rgba(14, 26, 18, .48);
}

/* ═══════════════════════════════════════════════════════════════ */
/*  RESET + GLOBALS                                                */
/* ═══════════════════════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--cream);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; height: auto; }
a  { color: inherit; }
button { font-family: inherit; cursor: pointer; }

/* Subtle paper grain over everything */
body::before {
  content: "";
  position: fixed; inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='280' height='280'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.07 0 0 0 0 0.10 0 0 0 0 0.07 0 0 0 0.18 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  opacity: .18;
  mix-blend-mode: multiply;
  pointer-events: none;
  z-index: 999;
}

/* Hide grain on inputs/buttons */
input, button { position: relative; z-index: 1000; }

/* Reusable */
.wrap { max-width: 1280px; margin: 0 auto; padding: 0 clamp(20px, 5vw, 64px); }
.wrap--narrow { max-width: 1080px; }
.wrap--prose  { max-width: 820px; }

.rule { height: 1px; background: var(--hair); border: 0; margin: 0; }
.rule--coral { background: linear-gradient(90deg, var(--coral), transparent 75%); }

.kicker {
  font-family: var(--sans);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .34em;
  text-transform: uppercase;
  color: var(--coral);
}

/* ═══════════════════════════════════════════════════════════════ */
/*  TYPE SHORTHANDS                                                */
/* ═══════════════════════════════════════════════════════════════ */
.ff-serif { font-family: var(--serif); }
.it { font-style: italic; }

/* Display title: massive, romantic Fraunces */
.display {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-weight: 500;
  line-height: 1.02;
  letter-spacing: -.035em;
  color: var(--forest);
  text-wrap: balance;
}
.display em {
  font-style: italic;
  font-variation-settings: normal;
  font-weight: 500;
  color: var(--coral);
}

/* ═══════════════════════════════════════════════════════════════ */
/*  HEADER (sticky)                                                */
/* ═══════════════════════════════════════════════════════════════ */
.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255, 255, 255, .82);
  backdrop-filter: saturate(140%) blur(18px);
  -webkit-backdrop-filter: saturate(140%) blur(18px);
  border-bottom: 1px solid var(--hair);
}
.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px clamp(20px, 5vw, 64px);
  gap: 24px;
}
.brand {
  display: flex;
  align-items: baseline;
  gap: 10px;
  text-decoration: none;
}
.brand__mark {
  width: 30px; height: 30px;
  border-radius: 50%;
  background: var(--forest);
  position: relative;
  flex: 0 0 30px;
}
.brand__mark::before, .brand__mark::after {
  content: "";
  position: absolute;
  background: var(--coral);
}
.brand__mark::before {
  width: 10px; height: 10px;
  border-radius: 50%;
  top: 5px; left: 5px;
}
.brand__mark::after {
  width: 12px; height: 2px;
  bottom: 7px; right: 5px;
  transform: rotate(-45deg);
}
.brand__name {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 700;
  font-size: 22px;
  color: var(--forest);
  letter-spacing: -.02em;
}
.brand__name b { font-style: normal; font-weight: 700; color: var(--coral); }
.nav {
  display: flex;
  align-items: center;
  gap: 28px;
  font-size: 13.5px;
  font-weight: 500;
  letter-spacing: .02em;
}
.nav a {
  text-decoration: none;
  color: var(--forest);
  padding: 4px 0;
  position: relative;
}
.nav a.is-active::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -2px;
  height: 2px;
  background: var(--coral);
}
.nav-issue {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--muted);
  letter-spacing: .12em;
  padding-left: 24px;
  border-left: 1px solid var(--hair);
}
.nav-issue b { color: var(--forest); font-weight: 700; }
@media (max-width: 820px) {
  .nav { display: none; }
  .nav-issue { display: none; }
}


/* ═══════════════════════════════════════════════════════════════ */
/*  HERO (archive) — with photo background                         */
/* ═══════════════════════════════════════════════════════════════ */
.hero {
  padding: clamp(72px, 9vw, 128px) 0 clamp(48px, 6vw, 80px);
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.hero__bg {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
}
.hero__bg-img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  filter: saturate(.78) brightness(1.02);
  animation: hero-pan 22s ease-in-out infinite alternate;
}
@keyframes hero-pan {
  from { transform: scale(1.04) translate(0, 0); }
  to   { transform: scale(1.08) translate(-1.5%, -1%); }
}
/* Scrim: heavy white at left/bottom (where title lives), photo more visible top-right */
.hero__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(105deg,
      rgba(255, 255, 255, .94) 0%,
      rgba(255, 255, 255, .82) 40%,
      rgba(255, 255, 255, .55) 100%),
    linear-gradient(180deg,
      rgba(255, 255, 255, .35) 0%,
      rgba(255, 255, 255, .65) 60%,
      rgba(255, 255, 255, .98) 100%);
  background-blend-mode: multiply;
}
.hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 32px;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 clamp(20px, 5vw, 64px);
  position: relative;
}

.hero__kicker {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 10px 18px 10px 12px;
  border: 1.5px solid var(--hair-2);
  border-radius: 100px;
  background: rgba(255,255,255,.4);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: var(--forest);
  width: max-content;
}
.hero__kicker::before {
  content: "";
  width: 7px; height: 7px;
  background: var(--coral);
  border-radius: 50%;
  box-shadow: 0 0 0 4px rgba(230, 76, 54, .18);
}
.hero__kicker em {
  font-family: var(--serif);
  font-style: italic;
  font-variation-settings: normal;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--coral);
}

.hero__title {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-weight: 500;
  font-size: clamp(48px, 8.4vw, 116px);
  line-height: .95;
  letter-spacing: -.04em;
  color: var(--forest);
  text-wrap: balance;
  max-width: 14ch;
  margin-top: 26px;
  position: relative;
  z-index: 1;
}
.hero__title em {
  font-style: italic;
  font-variation-settings: normal;
  font-weight: 500;
  color: var(--coral);
  letter-spacing: -.045em;
  display: inline-block;
  transform: translateY(.012em);
}
/* underline decoration on "energetica" */
.hero__title em::after {
  content: "";
  display: block;
  height: 6px;
  background: var(--coral);
  opacity: .14;
  margin-top: -.18em;
  border-radius: 2px;
}

.hero__sub {
  position: relative;
  z-index: 1;
  margin-top: clamp(20px, 2.4vw, 32px);
  max-width: 540px;
  font-size: clamp(16px, 1.3vw, 18px);
  line-height: 1.55;
  color: var(--muted);
}
.hero__sub b { color: var(--forest); font-weight: 600; }

/* meta strip: today + sources marquee */
.hero__meta {
  position: relative;
  z-index: 1;
  margin-top: 38px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding-top: 18px;
  border-top: 1px solid var(--hair);
  flex-wrap: wrap;
}
.hero__date {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .14em;
  color: var(--muted);
}
.hero__date b { color: var(--forest); font-weight: 700; }
.hero__date span { color: var(--coral); margin: 0 4px; }
.hero__sources {
  font-size: 11px;
  letter-spacing: .14em;
  color: var(--muted);
  display: flex;
  align-items: center;
  gap: 12px;
  overflow: hidden;
  white-space: nowrap;
  flex: 1;
  min-width: 240px;
}
.hero__sources::before {
  content: "FONTI →";
  font-weight: 700;
  color: var(--forest);
  flex-shrink: 0;
}
.hero__sources b {
  color: var(--forest);
  font-weight: 600;
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-size: 14px;
  letter-spacing: 0;
  text-transform: none;
}
.hero__sources span { opacity: .4; }

/* ═══════════════════════════════════════════════════════════════ */
/*  HERO BANNER (editorial photo strip)                            */
/* ═══════════════════════════════════════════════════════════════ */
.hero-banner {
  max-width: 1280px;
  margin: 56px auto 0;
  padding: 0 clamp(20px, 5vw, 64px);
}
.hero-banner__inner {
  position: relative;
  aspect-ratio: 21/9;
  border-radius: var(--radius-l);
  overflow: hidden;
  border: 1.5px solid var(--hair);
  box-shadow: var(--shadow-soft);
}
.hero-banner__img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  filter: saturate(.92);
  transition: transform 2s cubic-bezier(.22, .8, .2, 1);
}
.hero-banner__inner:hover .hero-banner__img { transform: scale(1.03); }
.hero-banner__overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(14, 26, 18, .15) 0%, transparent 35%, transparent 55%, rgba(14, 26, 18, .68) 100%);
}
.hero-banner__caption {
  position: absolute;
  left: clamp(28px, 4vw, 56px);
  bottom: clamp(28px, 4vw, 48px);
  right: clamp(28px, 4vw, 56px);
  z-index: 2;
  color: var(--paper);
}
.hero-banner__caption-meta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: rgba(250, 246, 235, .9);
  margin-bottom: 16px;
}
.hero-banner__caption-meta::before {
  content: "";
  width: 22px;
  height: 1.5px;
  background: var(--coral);
}
.hero-banner__caption-meta b { color: var(--gold); font-weight: 700; }
.hero-banner__caption-text {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(22px, 3.2vw, 40px);
  line-height: 1.1;
  letter-spacing: -.018em;
  color: var(--paper);
  max-width: 24ch;
  text-wrap: balance;
}
.hero-banner__caption-text em {
  font-style: italic;
  font-variation-settings: normal;
  color: var(--gold);
  font-weight: 500;
}
/* Issue tag top-right */
.hero-banner__tag {
  position: absolute;
  top: clamp(20px, 3vw, 32px);
  right: clamp(20px, 3vw, 32px);
  z-index: 2;
  background: rgba(255, 255, 255, .92);
  backdrop-filter: blur(8px);
  padding: 8px 14px;
  border-radius: 100px;
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: .14em;
  color: var(--forest);
}
.hero-banner__tag b { color: var(--coral); font-weight: 700; }

/* ═══════════════════════════════════════════════════════════════ */
/*  CATEGORY CHIPS                                                 */
/* ═══════════════════════════════════════════════════════════════ */
.chips {
  max-width: 1280px;
  margin: 56px auto 0;
  padding: 0 clamp(20px, 5vw, 64px);
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.chips__label {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 600;
  font-size: 18px;
  color: var(--forest);
  padding-right: 10px;
}
.chips__label b { color: var(--coral); font-weight: 600; }
.chip {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .02em;
  color: var(--forest);
  padding: 10px 18px;
  border-radius: 100px;
  border: 1.5px solid var(--hair-2);
  background: var(--paper);
  text-decoration: none;
  transition: all .25s ease;
}
.chip:hover {
  border-color: var(--forest);
  transform: translateY(-2px);
}
.chip.is-active {
  background: var(--forest);
  color: var(--cream);
  border-color: var(--forest);
}
.chip em {
  font-family: var(--serif);
  font-style: italic;
  font-variation-settings: normal;
  color: var(--gold);
  margin-right: 4px;
  font-weight: 600;
}

/* ═══════════════════════════════════════════════════════════════ */
/*  EDITORIAL GRID                                                 */
/* ═══════════════════════════════════════════════════════════════ */
.grid {
  max-width: 1280px;
  margin: 56px auto 0;
  padding: 0 clamp(20px, 5vw, 64px);
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: clamp(24px, 3vw, 40px) clamp(20px, 2.5vw, 32px);
}

/* ─── Card base ─── */
.card {
  grid-column: span 6;
  display: flex;
  flex-direction: column;
  gap: 18px;
  text-decoration: none;
  color: var(--ink);
  position: relative;
}
.card__media {
  position: relative;
  aspect-ratio: 4/3;
  overflow: hidden;
  border-radius: var(--radius);
  background: var(--cream-2);
  border: 1.5px solid var(--hair);
}
.card__img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 1.1s cubic-bezier(.22, .8, .2, 1), filter 1.1s ease;
  filter: saturate(.92);
}
.card:hover .card__img { transform: scale(1.055); filter: saturate(1.05); }
.card__num {
  position: absolute;
  top: 14px; left: 16px;
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 600;
  font-size: 32px;
  line-height: 1;
  color: var(--cream);
  text-shadow: 0 2px 12px rgba(0,0,0,.4);
  z-index: 2;
}
.card__pill {
  position: absolute;
  bottom: 14px; left: 16px;
  background: rgba(14, 26, 18, .82);
  backdrop-filter: blur(6px);
  color: var(--cream);
  padding: 6px 12px;
  border-radius: 100px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  z-index: 2;
}
.card__pill em {
  color: var(--gold);
  font-family: var(--serif);
  font-style: italic;
  font-variation-settings: normal;
  letter-spacing: 0;
  text-transform: none;
  font-size: 12px;
  margin-right: 2px;
}
.card__meta {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--muted);
  display: flex;
  gap: 14px;
  align-items: center;
}
.card__meta b { color: var(--forest); font-weight: 700; }
.card__meta .slash { color: var(--coral); }
.card__title {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-weight: 500;
  font-size: clamp(26px, 2.4vw, 36px);
  line-height: 1.12;
  letter-spacing: -.018em;
  color: var(--forest);
  text-wrap: balance;
  transition: color .25s ease;
}
.card:hover .card__title { color: var(--coral-deep); }
.card__title em {
  font-style: italic;
  font-variation-settings: normal;
  color: var(--coral);
}
.card__excerpt {
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--muted);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.card__more {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 600;
  font-size: 14px;
  color: var(--forest);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: -4px;
}
.card__more::after {
  content: "→";
  color: var(--coral);
  transition: transform .3s ease;
}
.card:hover .card__more::after { transform: translateX(6px); }

/* ─── Cover story (broken grid hero) ─── */
.cover-story {
  grid-column: span 12;
  display: grid;
  grid-template-columns: 7fr 5fr;
  gap: clamp(28px, 3vw, 56px);
  align-items: stretch;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--hair);
}
.cover-story__media {
  position: relative;
  aspect-ratio: 5/4;
  overflow: hidden;
  border-radius: var(--radius-l);
  border: 1.5px solid var(--hair);
  background: var(--cream-2);
}
.cover-story__img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 1.3s cubic-bezier(.22, .8, .2, 1);
  filter: saturate(.95);
}
.cover-story:hover .cover-story__img { transform: scale(1.04); }
.cover-story__overlay {
  position: absolute;
  top: 20px; left: 22px;
  display: flex;
  align-items: center;
  gap: 10px;
  z-index: 2;
}
.cover-story__overlay .badge {
  background: var(--coral);
  color: var(--paper);
  padding: 8px 14px;
  border-radius: 100px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .26em;
  text-transform: uppercase;
}
.cover-story__overlay .issue {
  background: rgba(14, 26, 18, .85);
  backdrop-filter: blur(6px);
  color: var(--cream);
  padding: 8px 12px;
  border-radius: 100px;
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: .14em;
}
.cover-story__body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 22px;
  padding: 8px 0;
}
.cover-story__meta {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--coral);
  display: flex;
  gap: 14px;
  align-items: center;
}
.cover-story__meta b { color: var(--forest); font-weight: 700; }
.cover-story__meta .slash { opacity: .5; }
.cover-story__title {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-weight: 500;
  font-size: clamp(36px, 4.6vw, 64px);
  line-height: 1.02;
  letter-spacing: -.025em;
  color: var(--forest);
  text-wrap: balance;
  transition: color .3s ease;
}
.cover-story:hover .cover-story__title { color: var(--coral-deep); }
.cover-story__title em {
  font-style: italic;
  font-variation-settings: normal;
  color: var(--coral);
}
.cover-story__excerpt {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(17px, 1.3vw, 19px);
  line-height: 1.48;
  color: var(--forest-soft);
  max-width: 38ch;
}
.cover-story__cta {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 600;
  font-size: 16px;
  color: var(--forest);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 4px;
}
.cover-story__cta::after {
  content: "↗";
  color: var(--coral);
  font-style: normal;
  transition: transform .3s ease;
}
.cover-story:hover .cover-story__cta::after { transform: translate(4px, -4px); }

/* ─── Featured large card (single column 8) ─── */
.card--feature {
  grid-column: span 7;
}
.card--feature .card__media { aspect-ratio: 5/3; }
.card--feature .card__title { font-size: clamp(26px, 2.2vw, 34px); }

.card--side {
  grid-column: span 5;
}
.card--side .card__media { aspect-ratio: 4/5; }

.card--mid {
  grid-column: span 6;
}

.card--narrow {
  grid-column: span 4;
}
.card--narrow .card__title { font-size: 19px; }

@media (max-width: 980px) {
  .cover-story { grid-template-columns: 1fr; }
  .cover-story__media { aspect-ratio: 16/9; }
  .card, .card--feature, .card--side, .card--mid, .card--narrow {
    grid-column: span 12;
  }
}

/* ═══════════════════════════════════════════════════════════════ */
/*  LOAD MORE                                                      */
/* ═══════════════════════════════════════════════════════════════ */
.load-more {
  max-width: 1280px;
  margin: 72px auto 0;
  padding: 0 clamp(20px, 5vw, 64px);
  text-align: center;
}
.load-more__count {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .2em;
  color: var(--muted);
  margin-bottom: 20px;
}
.load-more__count b { color: var(--forest); }
.load-more__btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: var(--forest);
  color: var(--cream);
  padding: 18px 32px;
  border-radius: 100px;
  text-decoration: none;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: .04em;
  transition: all .3s ease;
  border: 2px solid var(--forest);
}
.load-more__btn:hover {
  background: var(--coral);
  border-color: var(--coral);
  transform: translateY(-2px);
}
.load-more__btn em {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  color: var(--gold);
  font-weight: 600;
  letter-spacing: 0;
}

/* ═══════════════════════════════════════════════════════════════ */
/*  NEWSLETTER                                                     */
/* ═══════════════════════════════════════════════════════════════ */
.newsletter {
  max-width: 1280px;
  margin: 110px auto 0;
  padding: clamp(48px, 6vw, 84px) clamp(28px, 5vw, 80px);
  background: var(--forest);
  border-radius: var(--radius-l);
  position: relative;
  overflow: hidden;
  color: var(--cream);
}
.newsletter::before {
  content: "";
  position: absolute;
  top: -20%; right: -10%;
  width: 60%; height: 140%;
  background: radial-gradient(ellipse at center, rgba(224, 178, 60, .18), transparent 60%);
  pointer-events: none;
}
.newsletter__num {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 700;
  font-size: clamp(80px, 16vw, 220px);
  line-height: 0.8;
  color: transparent;
  -webkit-text-stroke: 1.5px rgba(250, 246, 235, .14);
  letter-spacing: -.04em;
  position: absolute;
  top: -40px; right: 40px;
  pointer-events: none;
}
.newsletter__inner {
  position: relative;
  z-index: 1;
  max-width: 720px;
}
.newsletter__kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 16px;
  border: 1.5px solid rgba(250, 246, 235, .26);
  border-radius: 100px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .32em;
  text-transform: uppercase;
  margin-bottom: 28px;
}
.newsletter__kicker::before {
  content: "";
  width: 7px; height: 7px;
  background: var(--gold);
  border-radius: 50%;
  box-shadow: 0 0 0 4px rgba(224, 178, 60, .22);
}
.newsletter__title {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-weight: 500;
  font-size: clamp(40px, 6vw, 68px);
  line-height: 1.04;
  letter-spacing: -.028em;
  color: var(--cream);
  text-wrap: balance;
  max-width: 16ch;
}
.newsletter__title em {
  font-style: italic;
  font-variation-settings: normal;
  color: var(--gold);
}
.newsletter__sub {
  margin-top: 18px;
  font-size: 16px;
  line-height: 1.6;
  color: rgba(250, 246, 235, .78);
  max-width: 500px;
}
.newsletter__form {
  margin-top: 32px;
  display: flex;
  gap: 10px;
  max-width: 500px;
}
.newsletter__input {
  flex: 1;
  padding: 16px 22px;
  border: 1.5px solid rgba(250, 246, 235, .26);
  border-radius: 100px;
  background: rgba(250, 246, 235, .05);
  font-family: var(--sans);
  font-size: 14.5px;
  color: var(--cream);
  outline: none;
  transition: border-color .25s ease, background .25s ease;
}
.newsletter__input::placeholder { color: rgba(250, 246, 235, .42); }
.newsletter__input:focus {
  border-color: var(--gold);
  background: rgba(250, 246, 235, .1);
}
.newsletter__btn {
  padding: 16px 28px;
  border: none;
  border-radius: 100px;
  background: var(--coral);
  color: var(--cream);
  font-family: var(--sans);
  font-weight: 700;
  font-size: 14px;
  letter-spacing: .02em;
  transition: background .25s ease, transform .25s ease;
}
.newsletter__btn:hover { background: var(--gold); color: var(--forest); transform: translateY(-2px); }
.newsletter__small {
  margin-top: 16px;
  font-size: 12px;
  color: rgba(250, 246, 235, .58);
  letter-spacing: .04em;
}
.newsletter__small b { color: var(--cream); font-weight: 700; }
@media (max-width: 580px) {
  .newsletter__form { flex-direction: column; }
}


/* ═══════════════════════════════════════════════════════════════ */
/*  SINGLE POST                                                    */
/* ═══════════════════════════════════════════════════════════════ */
.single {
  padding-top: 64px;
}
.single__bread {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 clamp(20px, 5vw, 64px);
  font-family: var(--mono);
  font-size: 11.5px;
  letter-spacing: .14em;
  color: var(--muted);
  display: flex;
  align-items: center;
  gap: 12px;
}
.single__bread a {
  text-decoration: none;
  color: var(--forest);
  border-bottom: 1px solid transparent;
  transition: border-color .25s ease;
}
.single__bread a:hover { border-bottom-color: var(--coral); }
.single__bread .slash { color: var(--coral); }
.single__bread .current { color: var(--coral); font-weight: 700; text-transform: uppercase; }

.single__header {
  max-width: 880px;
  margin: 40px auto 0;
  padding: 0 clamp(20px, 5vw, 64px);
  text-align: center;
}
.single__meta {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .2em;
  color: var(--muted);
  padding: 8px 20px;
  border: 1px solid var(--hair-2);
  border-radius: 100px;
  background: var(--cream-2);
  margin-bottom: 32px;
}
.single__meta b { color: var(--forest); font-weight: 700; }
.single__meta .slash { color: var(--coral); opacity: .6; }
.single__title {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-weight: 500;
  font-size: clamp(46px, 7vw, 100px);
  line-height: .98;
  letter-spacing: -.035em;
  color: var(--forest);
  text-wrap: balance;
}
.single__title em {
  font-style: italic;
  font-variation-settings: normal;
  color: var(--coral);
  font-weight: 500;
}
.single__standfirst {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(19px, 1.8vw, 24px);
  line-height: 1.42;
  color: var(--forest-soft);
  max-width: 640px;
  margin: 28px auto 0;
  text-wrap: balance;
}
.single__byline {
  margin-top: 32px;
  display: inline-flex;
  align-items: center;
  gap: 14px;
  font-size: 13px;
  color: var(--muted);
}
.single__byline-avatar {
  width: 40px; height: 40px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--coral), var(--gold));
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 700;
  font-size: 18px;
  color: var(--cream);
}
.single__byline-text {
  text-align: left;
  line-height: 1.3;
}
.single__byline-text b {
  display: block;
  color: var(--forest);
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 600;
  font-size: 15px;
}

/* Cover image */
.single__cover {
  max-width: 1180px;
  margin: 56px auto 0;
  padding: 0 clamp(20px, 5vw, 64px);
  position: relative;
}
.single__cover-img {
  width: 100%;
  aspect-ratio: 21/9;
  object-fit: cover;
  border-radius: var(--radius-l);
  border: 1.5px solid var(--hair);
  filter: saturate(.95);
}
.single__cover-caption {
  font-family: var(--serif);
  font-style: italic;
  font-variation-settings: normal;
  font-size: 13px;
  color: var(--muted);
  margin-top: 14px;
  text-align: center;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}
.single__cover-caption b { color: var(--forest); font-weight: 600; }

/* Body 2-col */
.single__body {
  max-width: 1180px;
  margin: 88px auto 0;
  padding: 0 clamp(20px, 5vw, 64px);
  display: grid;
  grid-template-columns: 1fr 260px;
  gap: 80px;
  align-items: start;
}
@media (max-width: 1020px) {
  .single__body { grid-template-columns: 1fr; gap: 36px; }
}

/* TOC sidebar */
.toc {
  position: sticky;
  top: 100px;
}
.toc__label {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 600;
  font-size: 14px;
  color: var(--coral);
  letter-spacing: .02em;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--hair);
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.toc__label::before {
  content: "→";
  color: var(--coral);
  font-style: normal;
}
.toc__list { list-style: none; }
.toc__list li {
  padding: 9px 0;
  border-bottom: 1px solid var(--hair);
  display: flex;
  gap: 12px;
  align-items: baseline;
}
.toc__list li:last-child { border-bottom: 0; }
.toc__list .toc__num {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 600;
  font-size: 16px;
  color: var(--coral);
  flex-shrink: 0;
  width: 22px;
}
.toc__list a {
  text-decoration: none;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.36;
  transition: color .25s ease;
  flex: 1;
}
.toc__list a:hover { color: var(--forest); }
.toc__list a.is-active { color: var(--forest); font-weight: 600; }
.toc__list a.is-active + .toc__num { color: var(--coral); }
.toc__progress {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid var(--hair);
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: .12em;
  color: var(--muted);
}
.toc__progress b { color: var(--forest); }
.toc__progress-bar {
  margin-top: 8px;
  height: 3px;
  background: var(--cream-3);
  border-radius: 2px;
  overflow: hidden;
}
.toc__progress-bar span {
  display: block;
  width: 38%;
  height: 100%;
  background: var(--coral);
}
@media (max-width: 1020px) {
  .toc {
    position: static;
    background: var(--cream-2);
    border: 1.5px solid var(--hair);
    border-radius: var(--radius);
    padding: 22px 24px;
  }
}

/* Prose */
.prose {
  max-width: 720px;
  font-size: 18px;
  line-height: 1.72;
  color: var(--ink);
}
.prose > p { margin: 0 0 1.25em; }
.prose > p:first-of-type::first-letter {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 700;
  float: left;
  font-size: 88px;
  line-height: .82;
  margin: .1em 14px -.05em -6px;
  color: var(--coral);
}
.prose h2 {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-weight: 500;
  font-size: clamp(28px, 2.4vw, 34px);
  line-height: 1.12;
  color: var(--forest);
  letter-spacing: -.022em;
  margin: 2em 0 .5em;
  position: relative;
}
.prose h2 em {
  font-style: italic;
  font-variation-settings: normal;
  color: var(--coral);
}
.prose h2::before {
  content: counter(h2counter, decimal-leading-zero);
  counter-increment: h2counter;
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 600;
  font-size: 14px;
  color: var(--coral);
  display: block;
  margin-bottom: 8px;
  letter-spacing: .02em;
}
.prose { counter-reset: h2counter; }
.prose h3 {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-weight: 600;
  font-size: 22px;
  line-height: 1.22;
  color: var(--forest);
  margin: 1.5em 0 .45em;
}
.prose strong { color: var(--forest); font-weight: 700; }
.prose a {
  color: var(--forest);
  text-decoration: underline;
  text-decoration-color: var(--coral);
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
  transition: color .25s ease;
}
.prose a:hover { color: var(--coral); }
.prose ul, .prose ol {
  margin: 1em 0 1.4em 1.5em;
}
.prose li { margin-bottom: .6em; }
.prose ul li::marker { color: var(--coral); }
.prose ol li::marker {
  color: var(--coral);
  font-family: var(--serif);
  font-style: italic;
  font-variation-settings: normal;
  font-weight: 700;
}

.prose blockquote {
  margin: 2em 0;
  padding: 6px 0 6px 32px;
  border-left: 3px solid var(--coral);
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(22px, 2vw, 28px);
  line-height: 1.36;
  color: var(--forest);
  letter-spacing: -.012em;
  position: relative;
}
.prose blockquote::before {
  content: "\201C";
  position: absolute;
  top: -.4em; left: -12px;
  font-size: 96px;
  color: var(--coral);
  opacity: .14;
  line-height: 1;
}
.prose blockquote cite {
  display: block;
  margin-top: 18px;
  font-style: normal;
  font-family: var(--sans);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--muted);
}
.prose blockquote cite b { color: var(--forest); }

/* Inline CTA card */
.inline-cta {
  margin: 2.4em 0;
  padding: 32px;
  background: linear-gradient(140deg, var(--cream-2), var(--cream-3));
  border-radius: var(--radius);
  border-left: 4px solid var(--coral);
  position: relative;
  overflow: hidden;
}
.inline-cta__label {
  font-family: var(--sans);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: var(--coral);
  margin-bottom: 14px;
}
.inline-cta__title {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-weight: 500;
  font-size: clamp(22px, 2.2vw, 28px);
  line-height: 1.14;
  letter-spacing: -.015em;
  color: var(--forest);
  margin-bottom: 12px;
  text-wrap: balance;
}
.inline-cta__title em {
  font-style: italic;
  font-variation-settings: normal;
  color: var(--coral);
}
.inline-cta__sub {
  font-size: 15px;
  line-height: 1.55;
  color: var(--muted);
  margin-bottom: 18px;
  max-width: 520px;
}
.inline-cta__btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--forest);
  color: var(--cream);
  padding: 14px 24px;
  border-radius: 100px;
  text-decoration: none;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: .04em;
  transition: all .3s ease;
}
.inline-cta__btn:hover {
  background: var(--coral);
  transform: translateY(-2px);
}
.inline-cta__btn em {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  color: var(--gold);
  font-weight: 600;
  letter-spacing: 0;
}

/* Pull stat block */
.stat-pull {
  margin: 2em 0;
  padding: 28px 32px;
  background: var(--forest);
  color: var(--cream);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  gap: 28px;
}
.stat-pull__num {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 600;
  font-size: 76px;
  line-height: .92;
  color: var(--gold);
  letter-spacing: -.03em;
}
.stat-pull__num small {
  font-size: 28px;
  color: var(--coral);
  vertical-align: super;
}
.stat-pull__text {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.4;
  color: var(--cream);
  flex: 1;
}
.stat-pull__text b { color: var(--gold); font-weight: 600; }
@media (max-width: 580px) {
  .stat-pull { flex-direction: column; align-items: flex-start; gap: 12px; }
  .stat-pull__num { font-size: 56px; }
}

/* Sources bibliography */
.sources {
  margin-top: 3em;
  padding: 32px 0 0;
  border-top: 2px solid var(--coral);
}
.sources__label {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 600;
  font-size: 18px;
  color: var(--forest);
  margin-bottom: 18px;
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.sources__label::before {
  content: "§";
  color: var(--coral);
  font-size: 22px;
  font-style: normal;
}
.sources__list {
  list-style: none;
  counter-reset: src;
}
.sources__list li {
  padding: 12px 0 12px 36px;
  position: relative;
  font-size: 14.5px;
  line-height: 1.5;
  color: var(--muted);
  border-bottom: 1px solid var(--hair);
}
.sources__list li::before {
  counter-increment: src;
  content: counter(src, decimal-leading-zero);
  position: absolute;
  left: 0; top: 13px;
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 600;
  font-size: 16px;
  color: var(--coral);
}
.sources__list li:last-child { border-bottom: 0; }
.sources__list b {
  color: var(--forest);
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 600;
  font-size: 15px;
  letter-spacing: -.01em;
}
.sources__list a {
  color: var(--coral);
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 3px;
}

/* Author bio */
.author-bio {
  margin-top: 4em;
  padding: 28px;
  background: var(--cream-2);
  border-radius: var(--radius);
  display: flex;
  gap: 22px;
  align-items: center;
}
.author-bio__avatar {
  width: 64px; height: 64px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--coral), var(--gold));
  flex: 0 0 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 700;
  font-size: 26px;
  color: var(--cream);
}
.author-bio__name {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 600;
  font-size: 18px;
  color: var(--forest);
  margin-bottom: 4px;
}
.author-bio__desc {
  font-size: 14px;
  color: var(--muted);
  line-height: 1.5;
}

/* ═══════════════════════════════════════════════════════════════ */
/*  RELATED                                                        */
/* ═══════════════════════════════════════════════════════════════ */
.related {
  max-width: 1280px;
  margin: 110px auto 0;
  padding: 0 clamp(20px, 5vw, 64px);
}
.related__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 36px;
  gap: 24px;
  flex-wrap: wrap;
}
.related__title {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-weight: 500;
  font-size: clamp(34px, 4.4vw, 54px);
  line-height: 1.06;
  color: var(--forest);
  letter-spacing: -.025em;
  text-wrap: balance;
}
.related__title em {
  font-style: italic;
  font-variation-settings: normal;
  color: var(--coral);
}
.related__more {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 600;
  font-size: 16px;
  color: var(--forest);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-bottom: 1.5px solid var(--coral);
  padding-bottom: 4px;
}
.related__more::after { content: "→"; color: var(--coral); font-style: normal; }
.related__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(20px, 2.5vw, 32px);
}
@media (max-width: 820px) {
  .related__grid { grid-template-columns: 1fr; }
}
.related__grid .card__media { aspect-ratio: 4/3; }

/* ═══════════════════════════════════════════════════════════════ */
/*  BOTTOM CTA                                                     */
/* ═══════════════════════════════════════════════════════════════ */
.bottom-cta {
  max-width: 1280px;
  margin: 100px auto 0;
  padding: 0 clamp(20px, 5vw, 64px);
}
.bottom-cta__inner {
  background: var(--forest);
  border-radius: var(--radius-l);
  padding: clamp(48px, 6vw, 88px) clamp(28px, 5vw, 72px);
  color: var(--cream);
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 56px;
  align-items: center;
}
@media (max-width: 820px) {
  .bottom-cta__inner { grid-template-columns: 1fr; gap: 24px; }
}
.bottom-cta__inner::before {
  content: "";
  position: absolute;
  bottom: -30%; left: -10%;
  width: 70%; height: 140%;
  background: radial-gradient(ellipse at center, rgba(230, 76, 54, .18), transparent 60%);
  pointer-events: none;
}
.bottom-cta__body { position: relative; z-index: 1; }
.bottom-cta__kicker {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
}
.bottom-cta__title {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-weight: 500;
  font-size: clamp(34px, 4.8vw, 58px);
  line-height: 1.06;
  letter-spacing: -.025em;
  color: var(--cream);
  text-wrap: balance;
}
.bottom-cta__title em {
  font-style: italic;
  font-variation-settings: normal;
  color: var(--gold);
}
.bottom-cta__sub {
  margin-top: 18px;
  font-size: 16px;
  color: rgba(250, 246, 235, .78);
  line-height: 1.6;
  max-width: 460px;
}
.bottom-cta__action {
  position: relative;
  z-index: 1;
  text-align: right;
}
@media (max-width: 820px) { .bottom-cta__action { text-align: left; } }
.bottom-cta__btn {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  background: var(--coral);
  color: var(--cream);
  padding: 18px 32px;
  border-radius: 100px;
  text-decoration: none;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: .02em;
  box-shadow: 0 20px 40px -16px rgba(230, 76, 54, .5);
  transition: all .3s ease;
}
.bottom-cta__btn:hover {
  background: var(--gold);
  color: var(--forest);
  transform: translateY(-3px);
}
.bottom-cta__btn em {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 600;
  letter-spacing: 0;
}
.bottom-cta__small {
  display: block;
  margin-top: 14px;
  font-size: 11px;
  letter-spacing: .2em;
  color: rgba(250, 246, 235, .5);
  font-family: var(--mono);
}

/* ═══════════════════════════════════════════════════════════════ */
/*  FOOTER                                                         */
/* ═══════════════════════════════════════════════════════════════ */
.site-footer {
  margin-top: 110px;
  background: var(--forest);
  color: rgba(250, 246, 235, .7);
  padding: clamp(40px, 5vw, 64px) clamp(20px, 5vw, 64px);
  text-align: center;
}
.site-footer__line {
  font-family: var(--serif);
  font-variation-settings: normal;
  font-style: italic;
  font-weight: 500;
  font-size: 16px;
  color: var(--cream);
  margin-bottom: 14px;
}
.site-footer__line b { color: var(--coral); font-weight: 600; }
.site-footer__meta {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .14em;
  color: rgba(250, 246, 235, .42);
}
.site-footer__meta span { color: var(--gold); margin: 0 8px; }

/* ═══════════════════════════════════════════════════════════════ */
/*  ANIMATIONS                                                     */
/* ═══════════════════════════════════════════════════════════════ */
@keyframes fade-up {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}
.hero__kicker  { animation: fade-up .8s ease both .1s; }
.hero__title   { animation: fade-up 1s ease both .2s; }
.hero__sub     { animation: fade-up 1s ease both .35s; }
.hero__meta    { animation: fade-in 1.2s ease both .55s; }
.hero__edition { animation: fade-in 1.6s ease both .8s; }
.chips         { animation: fade-up .8s ease both .65s; }
.cover-story   { animation: fade-up 1s ease both .8s; }
.card          { animation: fade-up .8s ease both 1s; }
.card:nth-of-type(2) { animation-delay: 1.05s; }
.card:nth-of-type(3) { animation-delay: 1.1s; }
.card:nth-of-type(4) { animation-delay: 1.15s; }
.card:nth-of-type(5) { animation-delay: 1.2s; }
.card:nth-of-type(6) { animation-delay: 1.25s; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}



/* === Energine titles override v4 (2026-06-01) — fix collisione righe === */
/* Hero archivio (/blog/) */
.hero__title {
    font-size: clamp(44px, 6.4vw, 88px) !important;
    line-height: 1.04 !important;
    letter-spacing: -.025em !important;
    text-wrap: balance;
}
/* Cover story card grande */
.cover-story__title {
    font-size: clamp(30px, 3.8vw, 52px) !important;
    line-height: 1.08 !important;
    letter-spacing: -.02em !important;
    text-wrap: balance;
}
/* Post card griglia */
.card__title {
    font-size: clamp(22px, 2vw, 30px) !important;
    line-height: 1.18 !important;
    letter-spacing: -.01em !important;
    text-wrap: balance;
}
/* Sezioni footer */
.related__title {
    font-size: clamp(28px, 3.4vw, 44px) !important;
    line-height: 1.1 !important;
}
.newsletter__title {
    font-size: clamp(32px, 4.6vw, 54px) !important;
    line-height: 1.06 !important;
}
.bottom-cta__title {
    font-size: clamp(30px, 4vw, 48px) !important;
    line-height: 1.08 !important;
}
/* Mobile tweaks */
@media (max-width: 600px) {
    .hero__title        { font-size: clamp(36px, 9vw, 52px) !important; line-height: 1.06 !important; }
    .cover-story__title { font-size: 28px !important; line-height: 1.12 !important; }
    .card__title        { font-size: 22px !important; line-height: 1.2 !important; }
    .related__title     { font-size: 28px !important; }
    .newsletter__title  { font-size: 30px !important; }
    .bottom-cta__title  { font-size: 28px !important; }
}

/* === Hero blog: immagine più evidente v1 (2026-06-01) === */
.hero__bg-img {
    filter: saturate(1.15) contrast(1.08) brightness(.96) !important;
}
.hero__bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        100deg,
        var(--cream) 0%,
        rgba(250, 246, 235, .82) 28%,
        rgba(250, 246, 235, .35) 58%,
        rgba(250, 246, 235, 0) 78%
    );
    pointer-events: none;
}
.hero {
    padding-bottom: clamp(80px, 9vw, 140px) !important;
    min-height: clamp(560px, 70vh, 760px);
}
@media (max-width: 820px) {
    .hero__bg::after {
        background: linear-gradient(
            180deg,
            rgba(250, 246, 235, .88) 0%,
            rgba(250, 246, 235, .55) 45%,
            rgba(250, 246, 235, .1) 85%
        );
    }
    .hero { min-height: auto; }
}

/* =============================================================== */
/* === MOBILE OPTIMIZATION v1 (2026-06-01) — overrides finali === */
/* =============================================================== */

/* === Tablet (≤980px) === */
@media (max-width: 980px) {
    .single__body { grid-template-columns: 1fr !important; gap: 28px; }
    .toc { position: static !important; max-height: none !important; }
    .toc__list { display: none; }
    .toc.is-open .toc__list { display: block; }
    .toc__title::after { content: " ▾"; font-size: 0.7em; }
    .related__grid, .grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 24px !important;
    }
}

/* === Mobile (≤640px) === */
@media (max-width: 640px) {
    /* --- Layout container --- */
    .hero, .single, .related, .newsletter, .bottom-cta, .single__bread {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }
    .single__bread { padding: 0 18px; }
    .hero__inner, .single__header, .single__body, .single__cover,
    .related, .newsletter__inner, .bottom-cta__inner {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* --- Hero blog --- */
    .hero {
        padding-top: 56px !important;
        padding-bottom: 64px !important;
        min-height: auto !important;
    }
    .hero__bg-img {
        filter: saturate(1.1) contrast(1.05) brightness(.92) !important;
    }
    .hero__bg::after {
        background: linear-gradient(180deg,
            rgba(250,246,235,.92) 0%,
            rgba(250,246,235,.55) 55%,
            rgba(250,246,235,.15) 100%) !important;
    }
    .hero__kicker { font-size: 10px; padding: 7px 14px 7px 10px; letter-spacing: .26em; }
    .hero__title  { font-size: clamp(34px, 9vw, 50px) !important; line-height: 1.06 !important; max-width: 100% !important; }
    .hero__sub    { font-size: 15px; max-width: 100%; }

    /* --- Chips filtro --- */
    .chips {
        margin: 30px auto 24px;
        padding: 0 18px;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        gap: 8px;
    }
    .chips::-webkit-scrollbar { display: none; }
    .chip {
        flex-shrink: 0;
        padding: 8px 14px;
        font-size: 12px;
    }
    .chips__label { flex-shrink: 0; }

    /* --- Grid card --- */
    .grid {
        grid-template-columns: 1fr !important;
        gap: 36px !important;
        padding: 0 18px;
        margin-top: 24px;
    }
    .card { gap: 18px !important; }
    .card__img-wrap { aspect-ratio: 16/10 !important; }
    .card__title  { font-size: 22px !important; line-height: 1.22 !important; }
    .card__excerpt { font-size: 14.5px; line-height: 1.55; }
    .card__meta { font-size: 10.5px; }

    /* --- Cover story --- */
    .cover-story { grid-template-columns: 1fr !important; gap: 24px !important; }
    .cover-story__img-wrap { aspect-ratio: 16/10 !important; }
    .cover-story__title { font-size: clamp(26px, 7vw, 36px) !important; line-height: 1.12 !important; }
    .cover-story__excerpt { font-size: 15.5px; line-height: 1.6; }
    .cover-story__badge-wrap { gap: 10px; }

    /* --- Load more --- */
    .load-more { padding: 0 18px; margin: 40px 0; }
    .load-more__btn { width: 100%; justify-content: center; padding: 16px 22px; font-size: 14px; }

    /* --- Single article header --- */
    .single__header { margin-top: 24px !important; }
    .single__kicker { font-size: 10.5px; letter-spacing: .2em; padding: 6px 14px; }
    .single__title {
        font-size: clamp(28px, 8vw, 40px) !important;
        line-height: 1.1 !important;
        letter-spacing: -.015em !important;
        max-width: 100% !important;
    }
    .single__standfirst { font-size: 16px !important; line-height: 1.5 !important; padding: 0 4px; }
    .single__meta-row {
        flex-direction: column !important;
        gap: 12px !important;
        padding: 14px 18px !important;
        margin-top: 26px !important;
        width: 100%;
        border-radius: 14px;
    }
    .single__byline { width: 100%; justify-content: center; }
    .single__cover { margin-top: 28px !important; }
    .single__cover-img { border-radius: 12px; }

    /* --- Single body / prose --- */
    .single__body { margin-top: 36px; }
    .prose { font-size: 16.5px; line-height: 1.7; }
    .prose h2 { font-size: 24px !important; line-height: 1.2; margin: 36px 0 16px !important; }
    .prose h3 { font-size: 19px !important; margin: 28px 0 12px !important; }
    .prose p { margin: 14px 0; }
    .prose blockquote {
        margin: 28px 0 !important;
        padding: 18px 18px 18px 20px !important;
        font-size: 17px;
    }
    .prose ul, .prose ol { padding-left: 22px; }
    .prose img { border-radius: 10px; margin: 24px 0; }

    /* --- Sources --- */
    .sources { margin-top: 40px; padding: 22px 18px; }
    .sources__title { font-size: 12px; }
    .sources__list li { font-size: 14px; padding: 10px 0; }

    /* --- Author bio --- */
    .author-bio {
        margin-top: 36px;
        flex-direction: column;
        text-align: center;
        gap: 14px;
        padding: 22px 18px;
    }
    .author-bio__avatar { margin: 0 auto; }
    .author-bio__name { font-size: 15px; }
    .author-bio__desc { font-size: 14px; }

    /* --- Related posts --- */
    .related { margin-top: 64px; padding: 36px 18px !important; }
    .related__title { font-size: 28px !important; line-height: 1.12 !important; margin-bottom: 28px; }
    .related__grid {
        grid-template-columns: 1fr !important;
        gap: 28px !important;
    }

    /* --- Newsletter --- */
    .newsletter { margin-top: 48px; padding: 40px 18px !important; }
    .newsletter__inner { padding: 0 !important; }
    .newsletter__num { font-size: 80px !important; top: 18px !important; right: 18px !important; }
    .newsletter__kicker { font-size: 10.5px; }
    .newsletter__title { font-size: 28px !important; line-height: 1.1 !important; max-width: 100%; }
    .newsletter__sub { font-size: 14.5px; }
    .newsletter__form,
    .mailpoet_form {
        flex-direction: column !important;
        gap: 12px !important;
    }
    .newsletter__input,
    .mailpoet_text {
        width: 100% !important;
        font-size: 16px !important; /* evita auto-zoom iOS */
        padding: 14px 16px;
    }
    .newsletter__btn,
    .mailpoet_submit {
        width: 100%;
        padding: 14px 24px !important;
        font-size: 14px;
    }

    /* --- Bottom CTA --- */
    .bottom-cta { margin-top: 48px; padding: 36px 18px !important; }
    .bottom-cta__inner {
        flex-direction: column !important;
        gap: 22px !important;
        text-align: center;
    }
    .bottom-cta__title { font-size: 26px !important; line-height: 1.12 !important; }
    .bottom-cta__text  { font-size: 14.5px; }
    .bottom-cta__action { text-align: center !important; width: 100%; }
    .bottom-cta__btn   { width: 100%; justify-content: center; padding: 16px 24px; }

    /* --- Footer --- */
    .site-footer { padding: 32px 18px !important; margin-top: 64px !important; }
    .site-footer__line { font-size: 14.5px; }
}

/* === Small mobile (≤380px) === */
@media (max-width: 380px) {
    .hero__title  { font-size: 30px !important; }
    .single__title { font-size: 26px !important; }
    .cover-story__title { font-size: 24px !important; }
    .card__title  { font-size: 20px !important; }
}

/* === iOS Safari fix — evita auto-zoom su input === */
@media (max-width: 640px) {
    input[type="email"],
    input[type="text"],
    textarea {
        font-size: 16px !important;
    }
}