:root {
  --pd-teal: #2a9d8f;
  --pd-teal-hover: #23867a;
  --pd-teal-deep-text: #1f7b70;
  --pd-teal-surface: #f0f8f6;
  --pd-teal-border: #cfe6e1;
  --pd-teal-dark-bg: #123832;
  --pd-on-dark: #eef6f4;
  --pd-on-dark-soft: #c3ddd8;
  --pd-on-dark-eyebrow: #a8d6ce;
  --pd-terracotta: #c1502e;
  --pd-terracotta-text: #a8401f;
  --pd-terracotta-light: #e2825c;
  --pd-terracotta-surface-1: #fdf6f3;
  --pd-terracotta-surface-2: #faf4f1;
  --pd-terracotta-surface-3: #fbeee8;
  --pd-terracotta-border-1: #d8ccc5;
  --pd-terracotta-border-2: #edd9d0;
  --pd-ink: #1f2421;
  --pd-ink-soft: #4b544e;
  --pd-paper: #ffffff;
  --pd-paper-warm: #f5f4f2;
  --pd-line: #e3e0da;
  --pd-line-warm: #ded7d1;
  --pd-line-warm-2: #cfcbc3;
}

* { box-sizing: border-box; }

html, body { margin: 0; padding: 0; background: #ffffff; }

body {
  font-family: 'Instrument Sans', system-ui, sans-serif;
  color: var(--pd-ink);
}

a { color: var(--pd-teal); text-decoration: none; }
a:hover { color: var(--pd-teal-hover); }

.pd-scroller {
  height: 100svh;
  overflow-y: auto;
  overflow-x: hidden;
  scroll-behavior: smooth;
  scrollbar-width: none;
  /* "mandatory" forza sempre l'ultima posizione di snap raggiunta durante
     lo scroll: se una sezione è più alta dello schermo (es. pd-idea su
     mobile, col form di contatto sotto al testo), uno swipe dall'interno
     della sezione salta dritto all'inizio di quella successiva, saltando
     il resto del contenuto (bottone "Invia la richiesta" compreso, mai
     raggiungibile). "proximity" mantiene l'effetto snap quando la sezione
     ci sta nello schermo, ma non combatte lo scroll quando il contenuto
     è più alto della viewport. */
  scroll-snap-type: y proximity;
  scroll-padding-top: 56px;
}
.pd-scroller::-webkit-scrollbar { width: 0; height: 0; }

.pd-section {
  min-height: calc(100svh - 56px);
  scroll-snap-align: start;
  scroll-snap-stop: always;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: center;
  overflow: hidden;
}

.pd-wrap { width: 100%; max-width: 1180px; margin: 0 auto; }

.pd-eyebrow {
  margin: 0;
  font-weight: 600;
  font-size: 0.7rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--pd-teal);
}

/* ---------- Nav ---------- */
.pd-nav {
  position: sticky;
  top: 0;
  z-index: 50;
  height: 56px;
  display: flex;
  align-items: center;
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--pd-line);
}
.pd-nav-inner {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.pd-nav-logo img { height: 26px; width: auto; display: block; }
.pd-nav-links { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; justify-content: flex-end; }
.pd-nav-links a { font-size: 0.9rem; font-weight: 500; color: var(--pd-ink-soft); }
.pd-nav-links a:hover { color: var(--pd-teal); }

/* ---------- Bottoni ---------- */
.pd-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 0.92rem;
  padding: 12px 24px;
  border-radius: 999px;
  border: 1px solid transparent;
  cursor: pointer;
}
.pd-btn--sm { font-size: 0.88rem; padding: 9px 18px; }
.pd-btn.pd-btn--primary { background: var(--pd-teal); color: #ffffff; }
.pd-btn.pd-btn--primary:hover { background: var(--pd-teal-hover); color: #ffffff; }
.pd-btn--ghost { background: transparent; color: var(--pd-ink); border-color: var(--pd-line); }
.pd-btn--ghost:hover { border-color: var(--pd-teal); color: var(--pd-teal); }
.pd-btn--terracotta { background: var(--pd-terracotta); color: #ffffff; border-color: var(--pd-terracotta); }
.pd-btn--terracotta:hover { background: var(--pd-terracotta-text); border-color: var(--pd-terracotta-text); color: #ffffff; }
.pd-btn--outline-terracotta { background: transparent; color: var(--pd-ink); border-color: var(--pd-line-warm-2); }
.pd-btn--outline-terracotta:hover { border-color: var(--pd-teal); color: var(--pd-teal); }
.pd-btn--block { width: 100%; }

/* ---------- Footer (dentro l'ultima sezione, non è uno snap point a sé) ---------- */
.pd-footer-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: clamp(14px, 2.4vw, 32px);
}
.pd-footer-brand img { height: 22px; width: auto; display: block; }
.pd-footer-brand p { margin: 8px 0 0; max-width: 28ch; font-size: 0.82rem; line-height: 1.5; color: var(--pd-ink-soft); }
.pd-footer-col h4 {
  margin: 0 0 9px;
  font-size: 0.74rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--pd-ink-soft);
  font-weight: 600;
}
.pd-footer-col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.pd-footer-col a { font-size: 0.9rem; color: var(--pd-ink); }
.pd-footer-col a:hover { color: var(--pd-teal); }
.pd-footer-bottom {
  margin-top: clamp(12px, 2.2vh, 26px);
  padding-top: clamp(10px, 1.8vh, 20px);
  border-top: 1px solid var(--pd-line-warm);
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 0.8rem;
  color: var(--pd-ink-soft);
}

/* ---------- Scroll cue (hero) ---------- */
@keyframes pd-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(5px); } }
.pd-scroll-cue {
  position: absolute;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--pd-ink-soft);
}
.pd-scroll-cue:hover { color: var(--pd-teal); }
.pd-scroll-cue svg { width: 16px; height: 16px; animation: pd-bob 1.8s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) {
  .pd-scroll-cue svg { animation: none; }
}

/* ---------- Hero ---------- */
.pd-hero {
  position: relative;
  padding: clamp(10px, 3vh, 44px) 24px clamp(34px, 6vh, 72px);
  background: radial-gradient(1100px 480px at 82% -10%, rgba(42, 157, 143, 0.16), rgba(42, 157, 143, 0) 60%), #ffffff;
}
.pd-hero-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: clamp(24px, 4vw, 56px);
  align-items: center;
}
.pd-hero-title {
  margin: clamp(8px, 2.6vh, 32px) 0 0;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.08;
  font-size: clamp(1.55rem, 2vw + 1.1vh + 0.4rem, 3.8rem);
}
.pd-hero-title em { font-style: normal; color: var(--pd-teal); }
.pd-hero-lede {
  margin: clamp(8px, 2.6vh, 32px) 0 0;
  max-width: 48ch;
  line-height: 1.55;
  color: var(--pd-ink-soft);
  font-size: clamp(0.84rem, 0.42vh + 0.72rem, 1.06rem);
}
.pd-hero-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: clamp(9px, 2.8vh, 34px); }
.pd-hero-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.74rem;
  font-weight: 500;
  padding: 5px 11px;
  border-radius: 999px;
  border: 1px solid var(--pd-line);
  background: #ffffff;
}
.pd-hero-chip svg { width: 14px; height: 14px; flex: none; color: var(--pd-teal); }
.pd-hero-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: clamp(10px, 2.8vh, 36px); }

.pd-hero-visual { display: grid; gap: clamp(10px, 1.6vh, 16px); }
.pd-hero-card {
  background: #ffffff;
  border: 1px solid var(--pd-line);
  border-radius: 18px;
  box-shadow: 0 26px 50px -34px rgba(31, 36, 33, 0.35);
  padding: clamp(12px, 1.8vh, 18px);
}
.pd-hero-card--plan {
  box-shadow: 0 30px 60px -34px rgba(31, 36, 33, 0.38);
  padding: clamp(14px, 2vh, 20px);
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(14px, 2vw, 22px);
  align-items: center;
}
.pd-kcal-ring {
  width: clamp(84px, 11vh, 108px);
  height: clamp(84px, 11vh, 108px);
  border-radius: 50%;
  background: conic-gradient(var(--pd-teal) 78%, var(--pd-paper-warm) 0);
  display: grid;
  place-items: center;
  flex: none;
}
.pd-kcal-ring-inner {
  width: 80%;
  height: 80%;
  border-radius: 50%;
  background: #ffffff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  line-height: 1.1;
}
.pd-kcal-ring-inner strong { font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(0.95rem, 1.8vh, 1.15rem); }
.pd-kcal-ring-inner span { font-size: 0.55rem; color: var(--pd-ink-soft); letter-spacing: 0.06em; text-transform: uppercase; }
.pd-hero-plan-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.pd-hero-plan-head strong { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.95rem; }
.pd-badge {
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--pd-teal);
  background: rgba(42, 157, 143, 0.12);
  padding: 4px 9px;
  border-radius: 999px;
}
.pd-plan-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 6px 0;
  font-size: 0.82rem;
  border-top: 1px solid var(--pd-line);
}
.pd-plan-row:first-of-type { border-top: none; }
.pd-plan-row span:first-child { font-weight: 500; }
.pd-plan-row span:last-child { color: var(--pd-ink-soft); font-size: 0.74rem; }

.pd-hero-secondary { display: grid; grid-template-columns: 1.35fr 1fr; gap: clamp(10px, 1.6vh, 16px); }
.pd-trend-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.pd-trend-head strong { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.85rem; }
.pd-trend-head span { font-size: 0.64rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--pd-teal); }
.pd-trend-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 4px; font-size: 0.72rem; color: var(--pd-ink-soft); }
.pd-trend-foot b { font-weight: 700; color: var(--pd-teal); }

.pd-stat-card { display: flex; flex-direction: column; justify-content: space-between; gap: 6px; }
.pd-stat-card strong { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.85rem; }
.pd-stat-number {
  flex: 1;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 1px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 800;
  font-size: clamp(2.3rem, 6.5vh, 3.6rem);
  line-height: 0.9;
  letter-spacing: -0.03em;
  color: var(--pd-teal);
}
.pd-stat-number span { font-size: 0.5em; line-height: 1; }
.pd-stat-note { font-size: 0.72rem; color: var(--pd-ink-soft); line-height: 1.4; }

/* ---------- Hero, variante verde ---------- */
/* Riprende lo stile del pannello sinistro di login/registrazione (layouts/auth/split.blade.php). */
.pd-hero--verde {
  background:
    radial-gradient(1100px 520px at 86% -12%, rgba(76, 192, 176, 0.22), rgba(76, 192, 176, 0) 62%),
    radial-gradient(800px 500px at -8% 106%, rgba(226, 130, 92, 0.14), rgba(226, 130, 92, 0) 60%),
    var(--pd-teal-dark-bg);
  color: var(--pd-on-dark);
}
.pd-hero--verde::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(238, 246, 244, 0.07) 1px, transparent 1px);
  background-size: 22px 22px;
  opacity: 0.5;
  pointer-events: none;
}
.pd-hero--verde .pd-hero-grid { position: relative; z-index: 1; }
.pd-hero--verde .pd-eyebrow { color: var(--pd-on-dark-eyebrow); }
.pd-hero--verde .pd-hero-title { color: var(--pd-on-dark); }
.pd-hero--verde .pd-hero-title em { color: #4cc0b0; }
.pd-hero--verde .pd-hero-lede { color: var(--pd-on-dark-soft); }
.pd-hero--verde .pd-hero-chip { border-color: rgba(238, 246, 244, 0.18); background: rgba(238, 246, 244, 0.06); color: #dcebe7; }
.pd-hero--verde .pd-hero-chip svg { color: #4cc0b0; }
.pd-hero--verde .pd-btn.pd-btn--primary { background: #4cc0b0; color: #0b1815; }
.pd-hero--verde .pd-btn.pd-btn--primary:hover { background: #3fae9f; color: #0b1815; }
.pd-hero--verde .pd-btn--ghost { border-color: rgba(238, 246, 244, 0.3); color: var(--pd-on-dark); }
.pd-hero--verde .pd-btn--ghost:hover { border-color: #4cc0b0; color: #4cc0b0; }
.pd-hero--verde .pd-hero-card { border-color: rgba(238, 246, 244, 0.1); box-shadow: 0 30px 54px -34px rgba(0, 0, 0, 0.55); color: var(--pd-ink); }
.pd-hero--verde .pd-hero-card--plan { box-shadow: 0 34px 60px -34px rgba(0, 0, 0, 0.6); }
.pd-hero--verde .pd-scroll-cue { color: var(--pd-on-dark-eyebrow); }
.pd-hero--verde .pd-scroll-cue:hover { color: #4cc0b0; }

/* ---------- Moduli ---------- */
.pd-moduli { padding: clamp(10px, 3vh, 44px) 0; background: #ffffff; }
.pd-moduli-head {
  width: 100%;
  padding: 0 max(24px, calc((100% - 1180px) / 2));
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
}
.pd-moduli-head h2 {
  margin: clamp(8px, 2.6vh, 32px) 0 0;
  max-width: 24ch;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.15;
  font-size: clamp(1.3rem, 1.2vw + 1.2vh + 0.4rem, 2.1rem);
}
.pd-moduli-head p:not(.pd-eyebrow) {
  margin: clamp(8px, 2.6vh, 32px) 0 0;
  max-width: 88ch;
  line-height: 1.5;
  color: var(--pd-ink-soft);
  font-size: clamp(0.82rem, 0.35vh + 0.72rem, 0.98rem);
}
.pd-carousel-nav { flex: none; display: flex; align-items: center; gap: 8px; }
.pd-carousel-nav button {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid var(--pd-line);
  background: #ffffff;
  color: var(--pd-ink);
  display: grid;
  place-items: center;
  cursor: pointer;
}
.pd-carousel-nav button:hover { border-color: var(--pd-teal); color: var(--pd-teal); }
.pd-carousel-nav svg { width: 16px; height: 16px; }

.pd-track {
  display: flex;
  gap: 16px;
  overflow-x: auto;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  padding: clamp(14px, 3.4vh, 40px) max(24px, calc((100% - 1180px) / 2)) clamp(10px, 2vh, 22px);
}
.pd-track::-webkit-scrollbar { display: none; }

.pd-card {
  flex: 0 0 auto;
  width: min(380px, 80vw);
  scroll-snap-align: center;
  border: 1px solid var(--pd-line);
  border-radius: 18px;
  padding: clamp(12px, 1.8vh, 16px);
  background: var(--pd-paper-warm);
  display: flex;
  flex-direction: column;
  gap: 5px;
  color: var(--pd-ink);
  filter: grayscale(1);
  opacity: 0.5;
  transform: scale(0.95);
  transition: filter .35s ease, opacity .35s ease, transform .35s ease, border-color .35s ease, box-shadow .35s ease, background .35s ease;
}
.pd-card.is-active {
  filter: grayscale(0);
  opacity: 1;
  transform: scale(1.03);
  border-color: var(--pd-teal);
  background: var(--pd-teal-surface);
  box-shadow: 0 26px 46px -28px rgba(31, 36, 33, 0.4);
  z-index: 2;
}
.pd-card--cta { border-style: dashed; border-color: var(--pd-terracotta-border-1); background: var(--pd-terracotta-surface-2); }
.pd-card--cta.is-active { border-style: solid; border-color: var(--pd-terracotta); background: var(--pd-terracotta-surface-3); }
.pd-card--cta .pd-eyebrow { color: var(--pd-terracotta); }

.pd-card-eyebrow { margin: 0; font-weight: 600; font-size: 0.66rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--pd-teal); }
.pd-card--cta .pd-card-eyebrow { color: var(--pd-terracotta); }
.pd-card-title { margin: 0; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 700; font-size: clamp(0.92rem, 0.5vh + 0.78rem, 1.05rem); line-height: 1.25; }
.pd-card-desc {
  margin: 0;
  font-size: 0.8rem;
  line-height: 1.45;
  color: var(--pd-ink-soft);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.pd-card-preview-wrap { margin-top: auto; padding-top: 8px; }
.pd-card-preview {
  background: #ffffff;
  border: 1px solid var(--pd-line);
  border-radius: 12px;
  overflow: hidden;
  height: clamp(122px, 17vh, 152px);
  display: flex;
  flex-direction: column;
}
.pd-card--cta .pd-card-preview { height: clamp(108px, 17vh, 152px); border-color: #e8ddd7; }
.pd-card-preview-bar {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 11px;
  background: var(--pd-paper-warm);
  border-bottom: 1px solid var(--pd-line);
  font-size: 0.66rem;
  font-weight: 600;
  color: var(--pd-ink-soft);
}
.pd-card-preview-tag { font-weight: 700; color: var(--pd-teal); background: rgba(42, 157, 143, 0.12); padding: 2px 7px; border-radius: 999px; }
.pd-card-preview-body { flex: 1; min-height: 0; overflow: hidden; display: flex; flex-direction: column; justify-content: center; }

.pd-preview-table { width: 100%; border-collapse: collapse; font-size: 0.68rem; }
.pd-preview-table td { padding: 2px 11px; border-top: 1px solid var(--pd-line); }
.pd-preview-table tbody tr:first-child td { border-top: none; }
.pd-preview-table td.pd-meal-group { padding: 2px 11px 1px; font-weight: 700; color: var(--pd-teal); border-top: none; }
.pd-preview-table td.pd-num { text-align: right; font-variant-numeric: tabular-nums; }
.pd-preview-table tfoot td { background: var(--pd-paper-warm); font-weight: 700; border-top: 1px solid var(--pd-line); }

.pd-preview-rows { padding: 8px 11px; display: flex; flex-direction: column; justify-content: center; gap: 3px; }
.pd-preview-row { display: flex; justify-content: space-between; font-size: 0.74rem; color: var(--pd-ink-soft); }
.pd-preview-row b { color: var(--pd-ink); font-variant-numeric: tabular-nums; }
.pd-preview-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
.pd-preview-tag { font-size: 0.65rem; padding: 3px 9px; border-radius: 999px; background: rgba(193, 80, 46, 0.12); color: var(--pd-terracotta-text); font-weight: 600; }

.pd-preview-cal { display: flex; gap: 6px; padding: 8px 11px; width: 100%; }
.pd-preview-cal-day { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 5px; }
.pd-preview-cal-day span { font-size: 0.6rem; color: var(--pd-ink-soft); text-transform: uppercase; font-weight: 600; }
.pd-preview-cal-slot { width: 100%; text-align: center; font-size: 0.62rem; padding: 5px 2px; border-radius: 6px; color: var(--pd-ink-soft); }
.pd-preview-cal-slot--busy { font-weight: 600; background: rgba(42, 157, 143, 0.12); color: var(--pd-teal-deep-text); }

.pd-preview-list { display: flex; flex-direction: column; justify-content: center; }
.pd-preview-list-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 5px 11px; border-top: 1px solid var(--pd-line); font-size: 0.74rem; }
.pd-preview-list-row:first-child { border-top: none; }
.pd-preview-list-row b { color: var(--pd-ink-soft); font-variant-numeric: tabular-nums; }
.pd-preview-list-row em { font-style: normal; font-size: 0.64rem; font-weight: 700; color: var(--pd-teal-deep-text); background: rgba(42, 157, 143, 0.12); padding: 2px 8px; border-radius: 999px; }

.pd-preview-search { margin: 0 11px 4px; padding: 6px 10px; border: 1px solid var(--pd-line); border-radius: 8px; font-size: 0.7rem; color: var(--pd-ink-soft); }

.pd-cta-note {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--pd-terracotta-text);
  background: rgba(193, 80, 46, 0.1);
  padding: 5px 11px;
  border-radius: 999px;
}
.pd-cta-note svg { width: 13px; height: 13px; }
.pd-cta-link { display: inline-flex; align-items: center; gap: 6px; font-size: 0.78rem; font-weight: 600; color: var(--pd-terracotta); }
.pd-cta-link svg { width: 14px; height: 14px; }

/* ---------- Come funziona ---------- */
.pd-flusso { padding: clamp(24px, 5vh, 64px) 24px; background: var(--pd-teal-dark-bg); color: var(--pd-on-dark); }
.pd-flusso .pd-eyebrow { color: var(--pd-on-dark-eyebrow); }
.pd-flusso-title {
  margin: clamp(6px, 1.2vh, 12px) 0 0;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.15;
  font-size: clamp(1.4rem, 1.4vw + 1.4vh + 0.4rem, 2.3rem);
}
.pd-flusso-lede { margin: clamp(7px, 1.2vh, 14px) 0 0; max-width: 62ch; line-height: 1.5; color: var(--pd-on-dark-soft); font-size: clamp(0.88rem, 0.4vh + 0.78rem, 1.02rem); }
.pd-steps { margin-top: clamp(14px, 3vh, 40px); display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: clamp(12px, 1.6vw, 20px); }
.pd-step {
  border: 1px solid rgba(238, 246, 244, 0.16);
  border-radius: 16px;
  padding: clamp(13px, 2.4vh, 26px);
  background: rgba(238, 246, 244, 0.05);
  display: flex;
  flex-direction: column;
  gap: clamp(7px, 1.2vh, 13px);
}
.pd-step-num { display: flex; align-items: center; gap: 9px; }
.pd-step-num span:first-child { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.82rem; font-weight: 700; color: var(--pd-terracotta-light); }
.pd-step-num span:last-child { flex: 1; height: 1px; background: rgba(238, 246, 244, 0.16); }
.pd-step h3 { margin: 0; font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(0.95rem, 0.5vh + 0.8rem, 1.08rem); font-weight: 700; line-height: 1.25; }
.pd-step p {
  margin: 0;
  color: var(--pd-on-dark-soft);
  font-size: 0.88rem;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 6;
  overflow: hidden;
}
.pd-step-extra { list-style: none; margin: auto 0 0; padding: clamp(7px, 1.2vh, 13px) 0 0; border-top: 1px solid rgba(238, 246, 244, 0.14); display: flex; flex-direction: column; gap: 6px; }
.pd-step-extra li { display: flex; gap: 8px; font-size: 0.78rem; color: var(--pd-on-dark-eyebrow); line-height: 1.4; }
.pd-step-extra li::before { content: ''; flex: none; width: 5px; height: 5px; margin-top: 6px; border-radius: 50%; background: var(--pd-terracotta-light); }

/* ---------- Prezzi ---------- */
.pd-prezzi { padding: clamp(20px, 4.5vh, 64px) 24px; background: var(--pd-paper-warm); border-top: 1px solid var(--pd-line); }
.pd-section-title {
  margin: clamp(8px, 2.2vh, 26px) 0 0;
  max-width: 24ch;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.15;
  font-size: clamp(1.4rem, 1.4vw + 1.4vh + 0.4rem, 2.2rem);
}
.pd-section-lede { margin: clamp(8px, 2.2vh, 24px) 0 0; max-width: 72ch; line-height: 1.5; color: var(--pd-ink-soft); font-size: clamp(0.86rem, 0.4vh + 0.76rem, 1rem); }
.pd-plans { display: flex; flex-wrap: wrap; gap: clamp(10px, 1.6vw, 20px); margin-top: clamp(11px, 2.6vh, 36px); align-items: stretch; }
.pd-plan {
  flex: 1 1 190px;
  display: flex;
  flex-direction: column;
  gap: clamp(5px, 1vh, 11px);
  border: 1px solid var(--pd-line);
  border-radius: 18px;
  padding: clamp(11px, 2vh, 24px);
  background: #ffffff;
}
.pd-plan--free { border: 1px dashed var(--pd-terracotta); background: var(--pd-terracotta-surface-1); }
.pd-plan--highlight { border-color: var(--pd-teal); background: var(--pd-teal-surface); box-shadow: 0 26px 46px -30px rgba(31, 36, 33, 0.35); }
.pd-plan-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 22px; }
.pd-plan-label { font-weight: 600; font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--pd-teal); }
.pd-plan--free .pd-plan-label { color: var(--pd-terracotta); }
.pd-plan-flag { font-size: 0.64rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--pd-terracotta-text); background: rgba(193, 80, 46, 0.12); padding: 3px 9px; border-radius: 999px; }
.pd-plan-price { display: flex; align-items: baseline; gap: 5px; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; letter-spacing: -0.02em; color: var(--pd-ink); line-height: 1; }
.pd-plan-price .pd-amount { font-size: clamp(1.5rem, 3.4vh, 2.1rem); }
.pd-plan-price .pd-unit { font-size: 0.8rem; font-weight: 600; color: var(--pd-ink-soft); }
.pd-plan-detail { font-size: 0.76rem; color: var(--pd-ink-soft); line-height: 1.4; }
.pd-plan-features { list-style: none; margin: auto 0 0; padding: clamp(8px, 1.4vh, 14px) 0 0; border-top: 1px solid var(--pd-line); display: flex; flex-direction: column; gap: 6px; }
.pd-plan--free .pd-plan-features { border-top-color: var(--pd-terracotta-border-2); }
.pd-plan--highlight .pd-plan-features { border-top-color: var(--pd-teal-border); }
.pd-plan-features li { display: flex; gap: 8px; font-size: 0.78rem; line-height: 1.4; color: var(--pd-ink-soft); }
.pd-plan-features svg { width: 13px; height: 13px; flex: none; margin-top: 3px; }
.pd-plan .pd-btn { margin-top: clamp(5px, 1.1vh, 12px); justify-content: center; }
.pd-prezzi-note { margin: clamp(8px, 1.5vh, 18px) 0 0; font-size: 0.74rem; color: var(--pd-ink-soft); }
.pd-prezzi-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin: clamp(8px, 1.5vh, 18px) 0 0; }
.pd-prezzi-foot .pd-prezzi-note { margin: 0; }

.pd-student-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin: clamp(12px, 2vh, 20px) 0 0;
  padding: 14px 20px;
  border-radius: 14px;
  border: 1px dashed var(--pd-terracotta-border-1);
  background: var(--pd-terracotta-surface-2);
  text-decoration: none;
  transition: background-color 0.15s ease;
}
.pd-student-banner:hover { background: var(--pd-terracotta-surface-3); }
.pd-student-banner-icon { font-size: 1.3rem; flex: none; line-height: 1; }
.pd-student-banner-text { color: var(--pd-ink); font-size: 0.88rem; flex: 1 1 240px; }
.pd-student-banner-text strong { color: var(--pd-terracotta-text); }
.pd-student-banner-cta { font-size: 0.82rem; font-weight: 700; color: var(--pd-terracotta); flex: none; white-space: nowrap; }

/* Testo a sinistra + badge Stripe a destra, allineati al fondo (stesso
   pattern di .pd-moduli-head: testo e controlli sulla stessa riga di
   base). */
.pd-prezzi-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px 24px;
}
.pd-stripe-badge {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 7px 16px;
  border: 1px solid var(--pd-line);
  border-radius: 999px;
  background: #ffffff;
  color: var(--pd-ink-soft);
  font-size: 0.82rem;
}
.pd-stripe-badge svg:first-child { width: 16px; height: 16px; }
.pd-stripe-badge svg:last-child { height: 16px; }

/* ---------- Richiedi informazioni ---------- */
.pd-idea { padding: clamp(20px, 4.5vh, 64px) 24px; background: #ffffff; }
.pd-idea-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: clamp(22px, 4vw, 56px); align-items: center; }
.pd-idea .pd-eyebrow { color: var(--pd-terracotta); }
.pd-idea-list { list-style: none; margin: clamp(10px, 2.4vh, 26px) 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.pd-idea-list li { display: flex; gap: 11px; font-size: 0.9rem; line-height: 1.45; }
.pd-idea-list li::before { content: ''; flex: none; width: 7px; height: 7px; margin-top: 7px; border-radius: 50%; background: var(--pd-terracotta); }

.pd-form { border: 1px solid var(--pd-line); border-radius: 20px; background: var(--pd-paper-warm); padding: clamp(14px, 2.4vh, 26px); display: flex; flex-direction: column; gap: clamp(8px, 1.3vh, 12px); }
.pd-form-head { margin-bottom: clamp(4px, 1.2vh, 12px); }
.pd-form-title { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 700; font-size: 1rem; }
.pd-form-sub { font-size: 0.8rem; color: var(--pd-ink-soft); margin-top: 3px; }
.pd-form-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: clamp(8px, 1.3vh, 12px); }
.pd-field { display: flex; flex-direction: column; gap: 4px; font-size: 0.72rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--pd-ink-soft); }
.pd-field input, .pd-field select, .pd-field textarea {
  font-family: 'Instrument Sans', system-ui, sans-serif;
  font-size: 0.86rem;
  color: var(--pd-ink);
  border: 1px solid var(--pd-line);
  border-radius: 10px;
  padding: 9px 11px;
  background: #ffffff;
}
.pd-field input:focus, .pd-field select:focus, .pd-field textarea:focus { outline: none; border-color: var(--pd-teal); }
.pd-field textarea { resize: none; min-height: clamp(56px, 9vh, 92px); }
.pd-field--honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.pd-form-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.pd-form-note { font-size: 0.72rem; color: var(--pd-ink-soft); max-width: 26ch; line-height: 1.4; }
.pd-form-note--success { color: var(--pd-teal); font-weight: 600; }
.pd-form-note--error { color: var(--pd-terracotta-text); font-weight: 600; }

/* ---------- CTA finale + Footer ---------- */
.pd-contatti {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: clamp(18px, 3vh, 40px);
  padding: clamp(20px, 4vh, 56px) 24px clamp(14px, 2.4vh, 28px);
  background: linear-gradient(135deg, #f6e7e1, var(--pd-paper-warm));
  border-top: 1px solid var(--pd-line);
}
.pd-cta-top { width: 100%; max-width: 1180px; margin: 0 auto; flex: 1; display: flex; align-items: center; justify-content: space-between; gap: 28px; flex-wrap: wrap; }
.pd-cta-top h2 { margin: 0; max-width: 26ch; font-family: 'Plus Jakarta Sans', system-ui, sans-serif; font-weight: 700; letter-spacing: -0.01em; line-height: 1.15; font-size: clamp(1.4rem, 1.4vw + 1.4vh + 0.4rem, 2.1rem); }
.pd-cta-top p { margin: 12px 0 0; max-width: 52ch; color: var(--pd-ink-soft); line-height: 1.55; font-size: clamp(0.88rem, 0.4vh + 0.78rem, 1rem); }
.pd-cta-actions { display: flex; gap: 14px; flex-wrap: wrap; }
.pd-footer { width: 100%; max-width: 1180px; margin: 0 auto; flex: none; padding-top: clamp(14px, 2.4vh, 28px); border-top: 1px solid var(--pd-line-warm); }

/* ---------- Mobile ----------
   .pd-hero-grid e .pd-idea-grid usano repeat(auto-fit, minmax(320px, 1fr)):
   sotto i ~680px il browser non riesce a collassare a una colonna in modo
   affidabile (percentuali indefinite durante il calcolo auto-fit), e la
   pagina si allarga oltre la viewport. Forziamo qui la singola colonna.
   Il menu (.pd-nav-links) va invece a capo già sotto i ~740px: usiamo la
   stessa soglia più ampia (760px) per tenere un solo breakpoint. */
@media (max-width: 760px) {
  .pd-hero-grid,
  .pd-idea-grid {
    grid-template-columns: 1fr;
  }

  /* Gli item di una grid hanno di default min-width: auto, quindi il loro
     contenuto (testo, chip) può impedire il collasso a una colonna anche
     con grid-template-columns: 1fr. Azzerarlo forza il rispetto della
     larghezza della colonna, lasciando che testo/chip vadano a capo. */
  .pd-hero-grid > *,
  .pd-idea-grid > * {
    min-width: 0;
  }

  /* Stesso motivo: le mini-card dentro pd-hero-visual (kcal ring, trend,
     statistiche) hanno grid/flex annidate che non collassano da sole. */
  .pd-hero-visual,
  .pd-hero-visual * {
    min-width: 0;
  }

  /* .pd-nav ha altezza fissa (56px): con tutti i link il contenuto va a
     capo su schermi stretti, e le righe in eccesso restano visibili sopra
     l'hero (nessun overflow: hidden sulla nav). Sotto i 760px lasciamo solo
     il bottone Accedi: le altre sezioni restano comunque raggiungibili
     scorrendo la pagina, essendo un sito a una pagina sola. */
  .pd-nav-links a:not(.pd-btn) {
    display: none;
  }

  /* .pd-stat-number usa un font-size in vh: su un telefono in verticale
     l'altezza è alta e il font diventa enorme, più largo della card
     stretta che lo contiene (il "+" finisce fuori dai bordi). Qui la
     dimensione segue la larghezza disponibile invece dell'altezza. */
  .pd-stat-number {
    font-size: clamp(1.7rem, 9vw, 2.6rem);
  }
}