/* ============================================================
   PROPADYN MUSEART — Tema Premium Made in Italy
   Palette: Cream · Direzione C
   ============================================================ */

:root {
  --pd-bg:          #f5f1ea;
  --pd-bg2:         #ebe5da;
  --pd-ink:         #1a1a1a;
  --pd-ink2:        #2a2520;
  --pd-muted:       #6b6157;
  --pd-line:        rgba(26,26,26,0.12);
  --pd-line2:       rgba(26,26,26,0.22);
  --pd-accent:      #b8954a;
  --pd-gold-deep:   #8b6f30;
  --pd-on-accent:   #1a1a1a;
  --pd-paper:       #ffffff;
  --pd-reverse:     #1a1a1a;
  --pd-reverse-ink: #f5f1ea;

  /* Override variabili Canvas */
  --cnvs-themecolor:     #b8954a;
  --cnvs-themecolor-rgb: 184, 149, 74;
  --themecolor:          #b8954a;
}

/* ── Reset base ── */
body {
  background: var(--pd-bg);
  color: var(--pd-ink);
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 18px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--pd-ink); }
a:hover { color: var(--pd-accent); }

h1, h2, h3, h4, h5, h6,
.heading-block h1, .heading-block h2, .heading-block h3 {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-weight: 500;
  letter-spacing: -0.04em;
}

p, pre, ul, ol, dl, dd, blockquote, address, table, fieldset, form {
	margin-bottom: 10px;
}
.heading-block {
	margin-bottom: 10px;
}
/* ── Topbar standalone (home.php e pagine statiche) ── */
.pd-topbar {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  grid-template-areas: "nav-l crest nav-r";
  align-items: center;
  padding: 0 56px;
  min-height: 88px;
  border-bottom: 1px solid var(--pd-line);
  background: var(--pd-bg);
  position: sticky;
  top: 0;
  z-index: 100;
}
.pd-nav-l  { grid-area: nav-l; }
.pd-crest  { grid-area: crest; }
.pd-nav-r  { grid-area: nav-r; }
.pd-nav-l, .pd-nav-r {
  display: flex;
  gap: 32px;
  font: 500 11px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.pd-nav-l a, .pd-nav-r a {
  color: var(--pd-ink);
  text-decoration: none;
  transition: color 0.15s;
}
.pd-nav-l a:hover, .pd-nav-r a:hover { color: var(--pd-accent); }
.pd-nav-l a.active, .pd-nav-r a.active {
  border-bottom: 1px solid var(--pd-accent);
  padding-bottom: 2px;
}
.pd-nav-r { justify-content: flex-end; }
.pd-lang { color: var(--pd-muted) !important; }

.pd-crest {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 16px 40px;
  text-decoration: none;
}
.pd-crest a { text-decoration: none; }
.pd-logo { height: 60px; width: auto; display: block; }
.pd-crest-pay {
  font: 500 9px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--pd-muted);
}
.pd-crest-rule {
  width: 80px;
  height: 1px;
  background: var(--pd-accent);
}

/* ── Language switcher dropdown ── */
.pd-lang-switcher {
  position: relative;
}
.pd-lang-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font: 500 11px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--pd-muted);
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  transition: color 0.15s;
}
.pd-lang-btn:hover { color: var(--pd-ink); }
.pd-lang-btn svg { transition: transform 0.2s; flex-shrink: 0; }
.pd-lang-switcher.open .pd-lang-btn svg { transform: rotate(180deg); }

.pd-lang-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
  background: var(--pd-bg);
  border: 1px solid var(--pd-line2);
  list-style: none;
  margin: 0;
  padding: 6px 0;
  min-width: 64px;
  z-index: 200;
}
.pd-lang-switcher.open .pd-lang-dropdown { display: block; }
.pd-lang-dropdown li a {
  display: block;
  padding: 8px 18px;
  font: 500 10px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--pd-muted);
  text-decoration: none;
  transition: background 0.12s, color 0.12s;
}
.pd-lang-dropdown li a:hover { background: var(--pd-bg2); color: var(--pd-ink); }
.pd-lang-dropdown li a.active { color: var(--pd-ink); font-weight: 600; }

/* ── Header Canvas — override se presente ── */
#header {
  background: var(--pd-bg);
  border-bottom: 1px solid var(--pd-line);
  position: sticky;
  top: 0;
  z-index: 100;
  box-shadow: none;
}
#header-wrap { padding: 0; }
#header .container { max-width: 100%; padding: 0 56px; }
#header .header-row {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0;
  min-height: 88px;
}

/* Logo centrato con crest */
#logo { margin: 0 !important; order: 2; }
#logo a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  text-decoration: none;
  padding: 16px 0;
}
#logo .pd-crest-pay {
  font: 500 9px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--pd-muted);
}
#logo .pd-crest-rule {
  width: 80px; height: 1px;
  background: var(--pd-accent);
}

/* Nav sinistra */
.primary-menu { order: 1; margin: 0 !important; }
.primary-menu .menu-container {
  display: flex;
  gap: 0;
  align-items: stretch;
  height: 88px;
}
.primary-menu .menu-item > .menu-link {
  font: 500 11px/1 'JetBrains Mono', monospace !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: var(--pd-ink) !important;
  padding: 0 24px !important;
  display: inline-flex !important;
  align-items: center !important;
  border-bottom: none !important;
  transition: color 0.15s !important;
}
.primary-menu .menu-item > .menu-link:hover,
.primary-menu .menu-item.current > .menu-link {
  color: var(--pd-accent) !important;
}
.primary-menu .menu-item.current > .menu-link {
  border-bottom: 1px solid var(--pd-accent) !important;
}
.primary-menu .sub-menu-container {
  background: var(--pd-bg);
  border: 1px solid var(--pd-line);
  border-top: none;
  border-radius: 0 !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.08);
}
.primary-menu .sub-menu-container .menu-item > .menu-link {
  font: 500 10px/1 'JetBrains Mono', monospace !important;
  letter-spacing: 0.14em !important;
  padding: 12px 20px !important;
  color: var(--pd-muted) !important;
}
.primary-menu .sub-menu-container .menu-item > .menu-link:hover {
  color: var(--pd-ink) !important;
  background: var(--pd-bg2) !important;
}

/* Misc destra (lingua / CTA) */
.header-misc { order: 3; justify-content: flex-end; }
.primary-menu-trigger { order: 0; }

/* Mobile hamburger */
.cnvs-hamburger-inner,
.cnvs-hamburger-inner::before,
.cnvs-hamburger-inner::after { background-color: var(--pd-ink) !important; }

/* ── Bottoni globali Propadyn ── */
.btn-pd {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 16px 28px;
  font: 500 11px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  border-radius: 999px;
  border: 1px solid var(--pd-ink);
  cursor: pointer;
  text-decoration: none;
  transition: background 0.2s, border-color 0.2s, color 0.2s;
}
.btn-pd.primary {
  background: var(--pd-ink);
  color: var(--pd-bg);
}
.btn-pd.primary:hover {
  background: var(--pd-accent);
  border-color: var(--pd-accent);
  color: var(--pd-on-accent);
}
.btn-pd.ghost {
  background: transparent;
  color: var(--pd-ink);
  border-color: var(--pd-line2);
}
.btn-pd.ghost:hover {
  border-color: var(--pd-ink);
}
.btn-pd.accent-fill {
  background: var(--pd-accent);
  color: var(--pd-on-accent);
  border-color: var(--pd-accent);
}
.btn-pd.accent-fill:hover {
  background: var(--pd-gold-deep);
  border-color: var(--pd-gold-deep);
}

/* ── HERO ── */
.pd-hero {
  padding: 120px 56px 80px;
  border-bottom: 1px solid var(--pd-line);
  text-align: center;
  background: radial-gradient(ellipse at center, var(--pd-bg) 0%, var(--pd-bg) 40%, var(--pd-bg2) 100%);
}
.pd-hero .pd-preamble {
  display: flex;
  gap: 18px;
  align-items: center;
  justify-content: center;
  font: 500 10px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--pd-muted);
  margin-bottom: 32px;
}
.pd-hero .pd-preamble::before,
.pd-hero .pd-preamble::after {
  content: '';
  flex: 0 0 80px;
  height: 1px;
  background: var(--pd-line2);
}
.pd-hero h1 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  font-size: clamp(72px, 9.5vw, 160px);
  line-height: 0.92;
  letter-spacing: -0.025em;
  margin-bottom: 32px;
}
.pd-hero h1 em {
  font-style: italic;
  font-weight: 400;
  color: var(--pd-accent);
}
.pd-hero .pd-lede {
  max-width: 36ch;
  margin: 0 auto 40px;
  font-style: italic;
  font-size: 22px;
  color: var(--pd-muted);
  font-family: 'Cormorant Garamond', serif;
}
.pd-hero .pd-ctas {
  display: flex;
  gap: 14px;
  justify-content: center;
  margin-bottom: 80px;
}

/* ── HERO CAROUSEL — 3 pannelli: sx (attiva) · centro (foto) · dx (prossima, cliccabile) ── */
.pd-hero-carousel {
  display: grid;
  grid-template-columns: 0.85fr 1.3fr 0.85fr;
  gap: 0;
  align-items: stretch;
  margin-top: 0;
  border-top: 1px solid var(--pd-line2);
}

/* Pannello laterale comune */
.pd-hc-side {
  padding-top: 24px;
  text-align: left;
  position: relative;
}
.pd-hc-side .pd-hc-inner {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.pd-hc-side h5 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  font-size: 22px;
  font-style: italic;
  letter-spacing: -0.005em;
  line-height: 1.1;
  margin: 0;
}
.pd-hc-side p {
  font-size: 14px;
  color: var(--pd-muted);
  line-height: 1.5;
  font-family: 'Cormorant Garamond', serif;
  margin: 0;
}
.pd-hc-meta {
  font: 500 9px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--pd-muted);
  margin-top: 6px;
}

/* Pannello SX: dati case attiva */
.pd-hc-left {
  padding-right: 40px;
  border-right: 1px solid var(--pd-line2);
}

/* Pannello DX: prossima case — interattiva */
.pd-hc-right {
  padding-left: 40px;
  border-left: 1px solid var(--pd-line2);
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition: background 0.3s;
}
.pd-hc-right:hover { background: var(--pd-bg2); }
.pd-hc-right .pd-hc-inner { position: relative; z-index: 2; }
.pd-hc-right h5, .pd-hc-right p { transition: color 0.2s; }
.pd-hc-right:hover h5 { color: var(--pd-accent); }

/* CTA "leggi →" nel pannello dx */
/* Link "Leggi la case story" — pannello SX */
.pd-hc-cta {
  font: 500 10px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--pd-accent);
  border-bottom: 1px solid var(--pd-accent);
  padding-bottom: 4px;
  margin-top: 20px;
  display: inline-block;
  text-decoration: none;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity 0.3s, transform 0.3s;
}
.pd-hc-left:hover .pd-hc-cta {
  opacity: 1;
  transform: translateY(0);
}

/* Hint "→ prossima" — pannello DX */
.pd-hc-next-hint {
  font: 500 10px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--pd-muted);
  margin-top: 20px;
  display: inline-block;
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity 0.3s, transform 0.3s;
}
.pd-hc-right:hover .pd-hc-next-hint {
  opacity: 1;
  transform: translateX(0);
}

/* Foto anteprima sottile in fondo al pannello dx */
.pd-hc-preview-img {
  position: absolute;
  bottom: 0; right: 0;
  width: 100%; height: 50%;
  background-size: cover;
  background-position: center;
  opacity: 0.08;
  pointer-events: none;
  transition: opacity 0.3s;
}
.pd-hc-right:hover .pd-hc-preview-img { opacity: 0.14; }

/* Pannello CENTRO: foto */
.pd-hc-center {
  position: relative;
}
.pd-hc-img-wrap {
  aspect-ratio: 4/5;
  position: relative;
  overflow: hidden;
  background: var(--pd-bg2);
}
.pd-hc-img-wrap img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: opacity 0.6s ease;
}
.pd-hc-img-wrap img.pd-img-out {
  opacity: 0;
}

/* Overlay e caption (riusano classi esistenti) */
.pd-fig-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.55) 0%, transparent 50%);
  pointer-events: none;
}
.pd-figure-cap {
  position: absolute;
  left: 20px; bottom: 48px; right: 20px;
  display: flex;
  justify-content: space-between;
  align-items: end;
  font: 500 10px/1.4 'JetBrains Mono', monospace;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #fff;
  transition: opacity 0.4s;
}
.pd-figure-cap.fading { opacity: 0; }

/* Dots indicatori nella foto */
.pd-hc-dots {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
  align-items: center;
  z-index: 3;
}
.pd-dot {
  width: 24px;
  height: 1px;
  background: rgba(255,255,255,0.4);
  cursor: pointer;
  transition: width 0.35s, background 0.35s;
  display: block;
}
.pd-dot.active {
  width: 40px;
  background: #fff;
}

/* Animazione testo al cambio */
.pd-hc-side.pd-anim-out .pd-hc-inner {
  opacity: 0;
  transform: translateY(8px);
}
.pd-hc-side .pd-hc-inner {
  transition: opacity 0.4s ease, transform 0.4s ease;
}

/* Figura frame (usata nelle altre sezioni, invariata) */
.pd-figure-frame {
  aspect-ratio: 4/5;
  background: var(--pd-bg2);
  border: 1px solid var(--pd-line2);
  position: relative;
  overflow: hidden;
}
.pd-figure-frame img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.pd-figure-frame .pd-fig-overlay {
  position: absolute;
  inset: 0;
}

/* Label mono */
.pd-label {
  font: 500 10px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--pd-muted);
}

/* ── MANIFESTO ── */
.pd-manifesto {
  padding: 50px 30px;
  text-align: center;
  border-bottom: 1px solid var(--pd-line);
  background: var(--pd-bg2);
}
.pd-manifesto .pd-quote {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: clamp(32px, 4vw, 56px);
  font-weight: 400;
  line-height: 1.15;
  max-width: 26ch;
  margin: 24px auto;
  letter-spacing: -0.01em;
  color: var(--pd-ink);
}
.pd-manifesto .pd-quote em { color: var(--pd-accent); font-style: italic; }
.pd-manifesto .pd-signature {
  margin-top: 32px;
  display: inline-flex;
  flex-direction: column;
  gap: 4px;
  align-items: center;
}
.pd-manifesto .pd-sig-name {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 22px;
  font-weight: 500;
}
.pd-manifesto .pd-sig-role {
  font: 500 9px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--pd-muted);
}

/* ── PRODOTTO TEASER ── */
.pd-product-teaser {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid var(--pd-line);
  min-height: 600px;
}
.pd-pt-img {
  background: var(--pd-paper);
  border-right: 1px solid var(--pd-line);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 56px 48px;
}
.pd-pt-img img {
  max-height: 480px;
  width: auto;
  max-width: 100%;
  object-fit: contain;
}
.pd-pt-img video {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 30px;
}
.pd-pt-copy {
  padding: 80px 56px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 28px;
}
.pd-pt-copy h2 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  font-size: clamp(40px, 4vw, 64px);
  letter-spacing: -0.02em;
  line-height: 1;
}
.pd-pt-copy h2 em { font-style: italic; color: var(--pd-accent); }
.pd-pt-copy > p {
  font-family: 'Cormorant Garamond', serif;
  font-size: 18px;
  line-height: 1.55;
  color: var(--pd-ink2);
  max-width: 42ch;
}
.pd-pt-specs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  border-top: 1px solid var(--pd-line);
}
.pd-pt-spec {
  padding: 16px 16px 16px 0;
  border-right: 1px solid var(--pd-line);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.pd-pt-spec:nth-child(2n) {
  border-right: none;
  padding-left: 16px;
  padding-right: 0;
}
.pd-pt-spec:nth-child(n+3) { border-top: 1px solid var(--pd-line); }
.pd-pt-spec .v {
  font-family: 'Cormorant Garamond', serif;
  font-size: 24px;
  font-weight: 500;
  line-height: 1;
}
.pd-pt-spec .l {
  font: 500 9px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--pd-muted);
}
.pd-pt-cta { display: flex; gap: 14px; flex-wrap: wrap; }

/* ── PILLARS ── */
.pd-pillars {
  padding: 96px 56px;
  border-bottom: 1px solid var(--pd-line);
}
.pd-pillars-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-left: 1px solid var(--pd-line);
}
.pd-pillar {
  padding: 56px 40px;
  border-right: 1px solid var(--pd-line);
}
.pd-pillar .pd-roman {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 20px;
  color: var(--pd-accent);
  margin-bottom: 32px;
  display: block;
}
.pd-pillar h3 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  font-size: clamp(28px, 2.5vw, 36px);
  line-height: 1.05;
  letter-spacing: -0.01em;
  margin-bottom: 24px;
}
.pd-pillar h3 em { font-style: italic; color: var(--pd-accent); }
.pd-pillar p {
  font-family: 'Cormorant Garamond', serif;
  font-size: 17px;
  line-height: 1.55;
  color: var(--pd-ink2);
  margin-bottom: 32px;
}
.pd-pillar .pd-footnote {
  padding-top: 18px;
  border-top: 1px solid var(--pd-line);
  font: 500 10px/1.4 'JetBrains Mono', monospace;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--pd-muted);
}
.pd-pillar .pd-footnote b { color: var(--pd-accent); }

/* ── HERITAGE ── */
.pd-heritage {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid var(--pd-line);
  min-height: 540px;
}
.pd-heritage-text {
  padding: 80px 56px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 24px;
  border-right: 1px solid var(--pd-line);
}
.pd-heritage-text h2 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  font-size: clamp(48px, 5vw, 72px);
  letter-spacing: -0.02em;
  line-height: 1;
}
.pd-heritage-text h2 em { font-style: italic; color: var(--pd-accent); }
.pd-heritage-text > p {
  font-family: 'Cormorant Garamond', serif;
  font-size: 18px;
  line-height: 1.55;
  color: var(--pd-ink2);
  max-width: 50ch;
}
.pd-timeline {
  margin-top: 8px;
  padding-top: 24px;
  border-top: 1px solid var(--pd-line);
  display: flex;
  gap: 28px;
  flex-wrap: wrap;
}
.pd-timeline-item { display: flex; flex-direction: column; gap: 4px; }
.pd-timeline-item .y {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  font-size: 22px;
  color: var(--pd-accent);
  font-style: italic;
}
.pd-timeline-item .e {
  font: 500 9px/1.3 'JetBrains Mono', monospace;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--pd-muted);
}
.pd-heritage-figure {
  position: relative;
  overflow: hidden;
  background: var(--pd-bg2);
}
.pd-heritage-figure img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.pd-heritage-figure .pd-fig-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.45) 0%, transparent 60%);
  pointer-events: none;
}
.pd-oddy-stamp {
  position: absolute;
  top: 32px;
  right: 32px;
  width: 110px;
  height: 110px;
  border-radius: 50%;
  border: 1px solid var(--pd-accent);
  background: var(--pd-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 4px;
  z-index: 2;
}
.pd-oddy-stamp b {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 28px;
  color: var(--pd-accent);
  font-weight: 500;
}
.pd-oddy-stamp small {
  font: 500 8px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--pd-muted);
}

/* ── CASE STORIES ── */
.pd-cases {
  padding: 96px 56px;
  border-bottom: 1px solid var(--pd-line);
}
.pd-cases-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 48px;
}
.pd-cases-head h2 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  font-size: clamp(40px, 5vw, 64px);
  letter-spacing: -0.02em;
  line-height: 1;
  max-width: 14ch;
}
.pd-cases-head h2 em { font-style: italic; color: var(--pd-accent); }
.pd-cases-head .pd-all-link {
  font: 500 10px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--pd-ink);
  border-bottom: 1px solid var(--pd-ink);
  padding-bottom: 6px;
  text-decoration: none;
  transition: color 0.15s, border-color 0.15s;
}
.pd-cases-head .pd-all-link:hover {
  color: var(--pd-accent);
  border-color: var(--pd-accent);
}
.pd-cases-grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr;
  gap: 32px;
}
.pd-case {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.pd-case-img {
  aspect-ratio: 4/5;
  overflow: hidden;
  position: relative;
  background: var(--pd-bg2);
}
.pd-case:first-child .pd-case-img { aspect-ratio: 3/4; }
.pd-case-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}
.pd-case:hover .pd-case-img img { transform: scale(1.03); }
.pd-case .pd-meta {
  display: flex;
  gap: 16px;
  font: 500 10px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--pd-muted);
}
.pd-case h4 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  font-size: 28px;
  line-height: 1.15;
  letter-spacing: -0.005em;
}
.pd-case:first-child h4 { font-size: 36px; }
.pd-case h4 em { font-style: italic; color: var(--pd-accent); }
.pd-case > p {
  font-family: 'Cormorant Garamond', serif;
  font-size: 16px;
  color: var(--pd-muted);
  line-height: 1.5;
}
.pd-case a.pd-read {
  font: 500 10px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--pd-ink);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  align-self: flex-start;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--pd-accent);
  text-decoration: none;
}

/* ── BLOG ── */
.pd-blog {
  padding: 80px 56px;
  border-bottom: 1px solid var(--pd-line);
}
.pd-blog-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 40px;
}
.pd-blog-head h2 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  font-size: clamp(36px, 4vw, 48px);
  letter-spacing: -0.02em;
  line-height: 1;
}
.pd-blog-head h2 em { font-style: italic; color: var(--pd-accent); }
.pd-blog-head .pd-all-link {
  font: 500 10px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--pd-ink);
  border-bottom: 1px solid var(--pd-ink);
  padding-bottom: 6px;
  text-decoration: none;
}
.pd-blog-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0;
  border-top: 1px solid var(--pd-line);
}
.pd-blog-row {
  display: grid;
  grid-template-columns: 72px 1fr auto;
  gap: 20px;
  padding: 24px 32px 24px 0;
  border-bottom: 1px solid var(--pd-line);
  border-right: 1px solid var(--pd-line);
  align-items: center;
  text-decoration: none;
  color: var(--pd-ink);
  transition: background 0.15s;
}
.pd-blog-row:hover { background: var(--pd-bg2); }
.pd-blog-row:nth-child(2n) {
  border-right: none;
  padding-right: 0;
  padding-left: 32px;
}
.pd-blog-row .pd-date {
  font: 500 10px/1.4 'JetBrains Mono', monospace;
  letter-spacing: 0.12em;
  color: var(--pd-muted);
}
.pd-blog-row h5 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  font-size: 20px;
  line-height: 1.2;
  margin: 0;
}
.pd-blog-row .pd-cat {
  font: 500 9px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--pd-accent);
  text-align: right;
  white-space: nowrap;
}

/* ── CTA FORM ── */
.pd-cta {
  padding: 120px 56px;
  text-align: center;
  background: var(--pd-reverse);
  color: var(--pd-reverse-ink);
  border-bottom: 1px solid var(--pd-ink);
}
.pd-cta .pd-preamble {
  display: flex;
  gap: 18px;
  align-items: center;
  justify-content: center;
  font: 500 10px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(245,241,234,0.5);
  margin-bottom: 32px;
}
.pd-cta .pd-preamble::before,
.pd-cta .pd-preamble::after {
  content: '';
  flex: 0 0 80px;
  height: 1px;
  background: rgba(245,241,234,0.2);
}
.pd-cta h2 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  font-size: clamp(40px, 6vw, 88px);
  letter-spacing: -0.02em;
  margin: 0 auto 24px;
  max-width: 22ch;
  line-height: 1;
  color: var(--pd-reverse-ink);
}
.pd-cta h2 em { font-style: italic; color: var(--pd-accent); }
.pd-cta > p {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 20px;
  color: rgba(245,241,234,0.65);
  max-width: 50ch;
  margin: 0 auto 40px;
  line-height: 1.5;
}
.pd-cta-form {
  max-width: 680px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 20px;
}
.pd-cta-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  text-align: left;
}
.pd-cta-field.full { grid-column: span 2; }
.pd-cta-field label {
  font: 500 9px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(245,241,234,0.55);
}
.pd-cta-field input {
  background: transparent;
  border: none;
  border-bottom: 1px solid rgba(245,241,234,0.25);
  padding: 12px 0;
  font: italic 500 18px/1 'Cormorant Garamond', serif;
  color: var(--pd-reverse-ink);
  outline: none;
  width: 100%;
}
.pd-cta-field input::placeholder { color: rgba(245,241,234,0.3); }
.pd-cta-field input:focus { border-bottom-color: var(--pd-accent); }
.pd-cta-submit {
  grid-column: span 2;
  display: flex;
  justify-content: center;
  margin-top: 16px;
}

/* ── FOOTER Propadyn ── */
.pd-footer {
  padding: 56px;
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 56px;
  border-top: 1px solid var(--pd-line);
  background: var(--pd-bg);
}
.pd-footer h6 {
  font: 500 10px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--pd-muted);
  margin-bottom: 18px;
}
.pd-footer ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.pd-footer ul a {
  font-family: 'Cormorant Garamond', serif;
  font-size: 18px;
  color: var(--pd-ink);
  font-style: italic;
  text-decoration: none;
}
.pd-footer ul a:hover { color: var(--pd-accent); }
.pd-logo-foot { height: 40px; width: auto; display: block; }
.pd-footer .pd-foot-brand p {
  font-family: 'Cormorant Garamond', serif;
  font-size: 16px;
  color: var(--pd-muted);
  line-height: 1.5;
  max-width: 36ch;
  margin-top: 16px;
}
.pd-footer .pd-foot-bottom {
  grid-column: span 4;
  padding-top: 24px;
  border-top: 1px solid var(--pd-line);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.pd-footer .pd-foot-bottom span,
.pd-footer .pd-foot-bottom a {
  font: 500 9px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--pd-muted);
  text-decoration: none;
}

/* ── Floating buttons nascosti su Propadyn ── */
.floating-btns { display: none; }

/* ── Override footer Canvas (nasconde quello vecchio) ── */
#footer { display: none; }

/* ── gotoTop ── */
#gotoTop {
  background: var(--pd-ink);
  color: var(--pd-bg) !important;
}

/* ── Responsive base ── */
/* ── Hamburger button ── */
.pd-hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 36px;
  height: 36px;
  padding: 4px;
  background: none;
  border: none;
  cursor: pointer;
  z-index: 1001;
}
.pd-hamburger span {
  display: block;
  width: 22px;
  height: 1.5px;
  background: var(--pd-ink);
  transition: transform 0.25s, opacity 0.25s;
  transform-origin: center;
}
.pd-hamburger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.pd-hamburger.open span:nth-child(2) { opacity: 0; }
.pd-hamburger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* ── Drawer mobile ── */
.pd-drawer {
  position: fixed;
  top: 0; right: 0;
  width: min(320px, 85vw);
  height: 100%;
  background: var(--pd-bg);
  border-left: 1px solid var(--pd-line);
  z-index: 1000;
  transform: translateX(100%);
  transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1);
  display: flex;
  flex-direction: column;
}
.pd-drawer.open { transform: translateX(0); }
.pd-drawer-inner {
  padding: 100px 40px 48px;
  display: flex;
  flex-direction: column;
  gap: 0;
  flex: 1;
  overflow-y: auto;
}
.pd-drawer-inner a {
  font: 400 22px/1.2 'Cormorant Garamond', serif;
  color: var(--pd-ink);
  text-decoration: none;
  padding: 14px 0;
  border-bottom: 1px solid var(--pd-line);
  display: block;
  transition: color 0.2s;
}
.pd-drawer-inner a:hover { color: var(--pd-accent); }
.pd-drawer-lang {
  margin-top: 40px;
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}
.pd-drawer-lang a {
  font: 500 11px/1 'JetBrains Mono', monospace;
  letter-spacing: 0.15em;
  border-bottom: none !important;
  padding: 4px 0 !important;
  color: var(--pd-muted) !important;
}
.pd-drawer-lang a.active { color: var(--pd-accent) !important; }

.pd-drawer-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.35);
  z-index: 999;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.32s;
}
.pd-drawer-overlay.open { opacity: 1; pointer-events: auto; }

/* ════════════════════════════════════════════════
   RESPONSIVE
   ════════════════════════════════════════════════ */

@media (max-width: 1024px) {
  .pd-hero { padding: 80px 32px 56px; }
  .pd-hero-figure { grid-template-columns: 1fr; gap: 24px; }
  .pd-fig-side { display: none; }
  .pd-product-teaser { grid-template-columns: 1fr; }
  .pd-pt-img { border-right: none; border-bottom: 1px solid var(--pd-line); min-height: 320px; }
  .pd-pillars-grid { grid-template-columns: repeat(2, 1fr); }
  .pd-heritage { grid-template-columns: 1fr; }
  .pd-heritage-figure { min-height: 360px; }
  .pd-cases-grid { grid-template-columns: 1fr; }
  .pd-blog-grid { grid-template-columns: 1fr; }
  .pd-blog-row:nth-child(2n) { padding-left: 0; border-right: 1px solid var(--pd-line); }
  .pd-footer { grid-template-columns: 1fr 1fr; gap: 32px; }
  .pd-footer .pd-foot-bottom { grid-column: span 2; }

  /* Hero carousel: pannello dx rimpicciolisce */
  .pd-hero-carousel { grid-template-columns: 0.7fr 1.3fr 0.7fr; }
}

@media (max-width: 768px) {
  /* ── Topbar mobile ── */
  .pd-topbar {
    grid-template-columns: 1fr auto;
    grid-template-areas: "crest burger";
    padding: 0 20px;
    min-height: 72px;
  }
  .pd-nav-l, .pd-nav-r { display: none; }
  .pd-crest {
    grid-area: crest;
    justify-content: flex-start;
    padding: 12px 0;
  }
  .pd-hamburger {
    display: flex;
    grid-area: burger;
  }
  .pd-logo { height: 50px; }

  /* ── Preamble: linee laterali collassate su mobile ── */
  .pd-hero .pd-preamble::before,
  .pd-hero .pd-preamble::after {
    flex: 0 0 24px;
  }

  /* ── Hero carousel: impilato ── */
  .pd-hero-carousel {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
    border-top: none;
  }
  /* Sul mobile: prima la foto (centro), poi i dati (sx), pannello dx nascosto */
  .pd-hc-center { order: 1; }
  .pd-hc-left   { order: 2; border-top: 1px solid var(--pd-line); }
  .pd-hc-right  { display: none; }

  /* Pannello sx su mobile: layout orizzontale compatto */
  .pd-hc-side {
    padding: 28px 24px;
    min-height: unset;
  }
  .pd-hc-side h5 { font-size: 20px; }
  .pd-hc-side p  { font-size: 13px; -webkit-line-clamp: 3; }

  /* Dots sempre visibili su mobile */
  .pd-hc-dots { bottom: 16px; }

  /* Link "Leggi" sempre visibile su mobile (non solo on hover) */
  .pd-hc-left .pd-hc-cta { opacity: 1; transform: none; }

  /* ── Sezioni generali ── */
  .pd-hero { padding: 64px 24px 48px; }
  .pd-manifesto { padding: 64px 24px; }
  .pd-pillars { padding: 64px 24px; }
  .pd-pillars-grid { grid-template-columns: 1fr; }
  .pd-cases { padding: 64px 24px; }
  .pd-blog { padding: 56px 24px; }
  .pd-cta { padding: 80px 24px; }
  .pd-cta-form { grid-template-columns: 1fr; }
  .pd-cta-field.full { grid-column: span 1; }
  .pd-cta-submit { grid-column: span 1; }
  .pd-footer { grid-template-columns: 1fr; padding: 40px 24px; }
  .pd-footer .pd-foot-bottom { grid-column: span 1; flex-direction: column; gap: 12px; text-align: center; }
  .pd-heritage-text { padding: 48px 24px; }
  .pd-pt-copy { padding: 48px 24px; }
}

/* ============================================================
   HOME LIVE — slider Swiper + menu dropdown + griglie dinamiche
   (aggiunto in Fase 2: router + chrome)
   ============================================================ */

/* ── Dropdown nel menu topbar ── */
.pd-nav-l .pd-has-sub, .pd-nav-r .pd-has-sub { position: relative; display: inline-block; }
.pd-nav-l .pd-toplink, .pd-nav-r .pd-toplink { white-space: nowrap; }
.pd-caret { font-size: 0.85em; opacity: 0.5; }
.pd-nav-l, .pd-nav-r { align-items: center; }
.pd-sub {
  position: absolute; top: 100%; left: 0; transform: translateY(10px);
  background: var(--pd-paper); border: 1px solid var(--pd-line);
  min-width: 250px; padding: 8px 0; margin: 0; list-style: none;
  box-shadow: 0 18px 50px rgba(26,26,26,0.14);
  opacity: 0; visibility: hidden; transition: all .22s ease; z-index: 300;
}
.pd-nav-r .pd-sub { left: auto; right: 0; }
/* ponte invisibile per non perdere l'hover salendo al submenu */
.pd-has-sub::after { content: ''; position: absolute; left: 0; right: 0; top: 100%; height: 14px; }
.pd-has-sub:hover .pd-sub { opacity: 1; visibility: visible; transform: translateY(0); }
.pd-sub li { margin: 0; }
.pd-sub a {
  display: block; padding: 9px 20px; font-family: 'Cormorant Garamond', serif;
  font-size: 17px; color: var(--pd-ink); white-space: nowrap;
}
.pd-sub a:hover { background: var(--pd-bg2); color: var(--pd-accent); }
.pd-drawer-sub { font-size: 0.9em; opacity: 0.75; padding-left: 12px !important; }

/* ── HERO SLIDER (Canvas7 nativo .pd-slider) ── */
.pd-slider, .pd-slider .swiper-container, .pd-slider .swiper-slide {
  height: 80vh; min-height: 540px; max-height: 880px;
}
.pd-slider { position: relative; width: 100%; overflow: hidden; }
.pd-slider .swiper-slide { position: relative; overflow: hidden; display: flex; align-items: center; }
/* sfondo immagine */
.pd-slide-bg {
  position: absolute; inset: 0; background-size: cover; background-position: center; z-index: 0;
}
.pd-slide-bg::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(20,18,15,0.80) 0%, rgba(20,18,15,0.50) 45%, rgba(20,18,15,0.18) 100%);
}
/* sfondo video */
.pd-slide-video {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0;
}
.pd-slide-shade {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(90deg, rgba(20,18,15,0.78) 0%, rgba(20,18,15,0.46) 50%, rgba(20,18,15,0.22) 100%);
}
.pd-slider .container { position: relative; z-index: 2; }
/* caption */
.pd-slide-cap { max-width: 60%; color: #fff; }
.pd-slide-cap .pd-kicker {
  display: block; font-family: 'JetBrains Mono', monospace; font-size: 12px;
  letter-spacing: 0.2em; text-transform: uppercase; color: var(--pd-accent); margin-bottom: 18px;
}
.pd-slide-cap h2 {
  font-family: 'Cormorant Garamond', serif; font-weight: 500; color: #fff;
  font-size: clamp(40px, 5.4vw, 80px); line-height: 1.02; margin: 0 0 20px; letter-spacing: -0.02em;
}
.pd-slide-cap p {
  font-size: clamp(17px, 1.4vw, 21px); line-height: 1.55; color: rgba(255,255,255,0.9);
  max-width: 520px; margin: 0 0 30px;
}
.pd-slide-cap .pd-ctas { display: flex; gap: 14px; flex-wrap: wrap; }
.btn-pd.ghost.light { color: #fff; border-color: rgba(255,255,255,0.55); }
.btn-pd.ghost.light:hover { background: #fff; color: var(--pd-ink); border-color: #fff; }
/* frecce + bullet */
.pd-slider .slider-arrow-left, .pd-slider .slider-arrow-right {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 5;
  width: 52px; height: 52px; display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 26px; cursor: pointer; background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.25); transition: background .2s;
}
.pd-slider .slider-arrow-left:hover, .pd-slider .slider-arrow-right:hover { background: var(--pd-accent); border-color: var(--pd-accent); }
.pd-slider .slider-arrow-left { left: 24px; }
.pd-slider .slider-arrow-right { right: 24px; }
.pd-slider .swiper-pagination { position: absolute; bottom: 26px; left: 0; right: 0; text-align: center; z-index: 5; }
.pd-slider .swiper-pagination-bullet {
  width: 30px; height: 3px; border-radius: 0; background: rgba(255,255,255,0.45); opacity: 1; margin: 0 4px; display: inline-block;
}
.pd-slider .swiper-pagination-bullet-active { background: var(--pd-accent); }
@media (max-width: 640px) {
  .pd-slider, .pd-slider .swiper-container, .pd-slider .swiper-slide { height: 78vh; min-height: 460px; }
  .pd-slider .slider-arrow-left, .pd-slider .slider-arrow-right { display: none; }
}

/* ── Intro home (testo da record id=1) ── */
.pd-home-intro { max-width: 90%; margin: 18px auto 0; font-size: 21px; line-height: 1.25; color: var(--pd-ink2); }
.pd-home-intro p { margin: 0 0 1em; }

/* ── Link "vedi tutti" + pillar link ── */
.pd-seeall, .pd-pillar-link {
  font-family: 'JetBrains Mono', monospace; font-size: 12px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--pd-accent);
}
.pd-pillar-link { display: inline-block; margin-top: 14px; }

/* ── Griglia Case story / News (home) ── */
.pd-case, .pd-blog { padding: 88px 6vw; }
.pd-case-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 14px 24px; margin-bottom: 40px; border-bottom: 1px solid var(--pd-line); padding-bottom: 22px; }
.pd-case-head h2 { font-size: clamp(28px, 3.4vw, 44px); margin: 0; flex: 1 1 auto; }
.pd-case-head .pd-label { width: 100%; }
.pd-case-head .pd-seeall { margin-left: auto; }
.pd-case-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.pd-case-card {
  display: flex; flex-direction: column; background: var(--pd-paper);
  border: 1px solid var(--pd-line); overflow: hidden; transition: transform .3s ease, box-shadow .3s ease; color: var(--pd-ink);
}
.pd-case-card:hover { transform: translateY(-4px); box-shadow: 0 24px 60px rgba(26,26,26,0.12); }
.pd-case-card .pd-case-img { height: 220px; background-size: cover; background-position: center; }
.pd-case-body { padding: 24px 26px 30px; }
.pd-case-meta { font-family: 'JetBrains Mono', monospace; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--pd-muted); }
.pd-case-body h3 { font-size: 23px; line-height: 1.15; margin: 8px 0 10px; }
.pd-case-body p { font-size: 16px; line-height: 1.5; color: var(--pd-muted); margin: 0; }

@media (max-width: 980px) {
  .pd-case-grid { grid-template-columns: 1fr 1fr; }
  .pd-hs-caption { max-width: 100%; }
}
@media (max-width: 640px) {
  .pd-case-grid { grid-template-columns: 1fr; }
  .pd-case, .pd-blog { padding: 56px 24px; }
  .pd-hero-slider .swiper-container { height: 70vh; min-height: 440px; }
}

/* ── Sidebar news (inc_news.php) ── */
.pd-sidebar-title {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--pd-muted);
  margin: 0 0 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--pd-line);
}
.pd-sidebar-news { display: flex; flex-direction: column; gap: 16px; }
.pd-snews-item {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  color: var(--pd-ink);
  text-decoration: none;
  transition: color 0.15s;
}
.pd-snews-item:hover { color: var(--pd-accent); }
.pd-snews-item img {
  width: 64px;
  height: 64px;
  object-fit: cover;
  flex-shrink: 0;
}
.pd-snews-text { display: flex; flex-direction: column; gap: 4px; }
.pd-snews-text strong { font-family: 'Cormorant Garamond', serif; font-size: 16px; line-height: 1.3; font-weight: 500; }
.pd-snews-text small { font-family: 'JetBrains Mono', monospace; font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--pd-muted); }

/* ── Calcolatore Propadyn Museart ── */
.pd-calc-section {
  background: var(--pd-bg2);
  padding: 80px 40px;
}
.pd-calc-intro {
  text-align: center;
  max-width: 640px;
  margin: 0 auto 48px;
}
.pd-calc-heading {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(32px, 3vw, 48px);
  font-weight: 500;
  margin: 12px 0 16px;
}
.pd-calc-lead { font-size: 17px; color: var(--pd-muted); }

.pd-calc-wizard {
  max-width: 820px;
  margin: 0 auto;
  background: var(--pd-paper);
  border: 1px solid var(--pd-line);
}
.pd-calc-header {
  background: var(--pd-reverse);
  padding: 28px 40px;
}
.pd-calc-steps {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}
.pd-calc-line-bg {
  position: absolute; top: 20px; left: 0; width: 100%;
  height: 2px; background: rgba(255,255,255,0.2);
}
.pd-calc-line-fill {
  height: 2px; background: var(--pd-accent);
  transition: width 0.4s ease; width: 0%;
}
.pd-calc-dot {
  width: 40px; height: 40px; border-radius: 50%;
  background: rgba(255,255,255,0.15);
  display: flex; align-items: center; justify-content: center;
  font-family: 'JetBrains Mono', monospace; font-size: 13px; font-weight: 600;
  position: relative; z-index: 2; color: rgba(255,255,255,0.5);
  transition: all 0.25s ease; flex-shrink: 0;
}
.pd-calc-dot.active { background: var(--pd-accent); color: var(--pd-on-accent); transform: scale(1.1); }
.pd-calc-dot.done   { background: rgba(255,255,255,0.25); color: #fff; }

.pd-calc-body { padding: 48px 48px 40px; }

.pd-calc-step { display: none; animation: pdcFadeUp 0.35s ease; }
.pd-calc-step.active { display: block; }
@keyframes pdcFadeUp {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}
.pd-calc-step-inner { max-width: 640px; margin: 0 auto; }
.pd-calc-step-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 22px; font-weight: 500;
  color: var(--pd-ink); margin: 0 0 6px;
}
.pd-calc-step-desc { font-size: 14px; color: var(--pd-muted); margin: 0 0 28px; }

.pd-calc-group { margin-bottom: 20px; }
.pd-calc-group label {
  display: block; font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--pd-muted); margin-bottom: 8px;
}
.pd-calc-input, .pd-calc-select {
  width: 100%; padding: 13px 16px;
  border: 1px solid var(--pd-line2); background: var(--pd-bg);
  color: var(--pd-ink); font-size: 16px;
  font-family: 'Cormorant Garamond', serif;
  transition: border-color 0.2s, box-shadow 0.2s;
  appearance: none; -webkit-appearance: none;
}
.pd-calc-input:focus, .pd-calc-select:focus {
  outline: none; border-color: var(--pd-accent);
  box-shadow: 0 0 0 2px rgba(184,149,74,0.15);
}
.pd-calc-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%236b6157' d='M5 6L0 0h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center; padding-right: 36px;
}
.pd-calc-hint { font-family: 'JetBrains Mono', monospace; font-size: 10px; color: var(--pd-muted); margin-top: 6px; display: block; }

.pd-calc-dim-grid { display: grid; grid-template-columns: 1fr 1fr 1fr 80px; gap: 12px; align-items: end; }
.pd-calc-params-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }

.pd-calc-vol-box {
  border: 1px solid var(--pd-accent); background: rgba(184,149,74,0.06);
  padding: 16px; text-align: center; margin-top: 16px; display: none;
}
.pd-calc-vol-val {
  font-family: 'JetBrains Mono', monospace; font-size: 18px;
  color: var(--pd-accent); font-weight: 600; display: block;
}
.pd-calc-vol-box small { font-family: 'JetBrains Mono', monospace; font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--pd-muted); }

.pd-calc-badge {
  font-family: 'JetBrains Mono', monospace; font-size: 10px;
  background: var(--pd-accent); color: var(--pd-on-accent);
  padding: 2px 10px; margin-left: 8px;
}
.pd-calc-formula {
  background: var(--pd-bg2); border: 1px solid var(--pd-line);
  padding: 12px 16px; margin-top: 16px; text-align: center;
}
.pd-calc-formula code {
  font-family: 'JetBrains Mono', monospace; font-size: 12px;
  color: var(--pd-ink); letter-spacing: 0.04em;
}
.pd-calc-info {
  background: rgba(184,149,74,0.06); border: 1px solid rgba(184,149,74,0.3);
  padding: 14px 18px; margin-top: 16px; font-size: 14px; color: var(--pd-muted);
}
.pd-calc-info strong { color: var(--pd-ink); }

.pd-calc-nav {
  display: flex; align-items: center; gap: 12px;
  margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--pd-line);
}

/* Risultato */
.pd-calc-result-box {
  background: var(--pd-bg2); border: 1px solid var(--pd-line);
  padding: 36px; text-align: center;
}
.pdcalc-res-num {
  font-family: 'Cormorant Garamond', serif;
  font-size: 72px; font-weight: 300; line-height: 1;
  color: var(--pd-accent); margin-bottom: 8px;
}
.pdcalc-res-label {
  font-family: 'JetBrains Mono', monospace; font-size: 11px;
  letter-spacing: 0.2em; text-transform: uppercase; color: var(--pd-muted);
}
.pdcalc-res-tipo { font-size: 18px; color: var(--pd-ink); margin: 6px 0 4px; }
.pdcalc-res-marg { font-size: 14px; color: var(--pd-muted); }
.pdcalc-res-marg strong { color: var(--pd-ink); }
.pdcalc-summary {
  display: grid; grid-template-columns: 1fr 1fr 1fr;
  gap: 1px; background: var(--pd-line); border: 1px solid var(--pd-line);
  margin: 24px 0 16px;
}
.pdcalc-sum-item {
  background: var(--pd-paper); padding: 14px 16px; text-align: left;
  display: flex; flex-direction: column; gap: 4px;
}
.pdcalc-sum-item span {
  font-family: 'JetBrains Mono', monospace; font-size: 9px;
  letter-spacing: 0.15em; text-transform: uppercase; color: var(--pd-muted);
}
.pdcalc-sum-item strong { font-family: 'Cormorant Garamond', serif; font-size: 16px; font-weight: 500; }
.pdcalc-formula {
  background: var(--pd-bg); border: 1px solid var(--pd-line);
  padding: 10px 16px; text-align: center; margin-top: 12px;
}
.pdcalc-formula code {
  font-family: 'JetBrains Mono', monospace; font-size: 11px; color: var(--pd-muted);
}

@media (max-width: 768px) {
  .pd-calc-section { padding: 56px 20px; }
  .pd-calc-body { padding: 32px 24px 28px; }
  .pd-calc-dim-grid { grid-template-columns: 1fr 1fr; }
  .pd-calc-params-grid { grid-template-columns: 1fr; }
  .pdcalc-summary { grid-template-columns: 1fr 1fr; }
  .pd-calc-header { padding: 20px 24px; }
}

/* ── Override button-green Canvas → colori Propadyn ── */
.button-green,
.button-green.button-3d:hover,
.button-green.button-reveal:hover,
.button-green.button-action,
.button-border.button-green,
.button-border.button-light.button-green {
  background-color: var(--pd-ink) !important;
  border-color: var(--pd-ink) !important;
  color: var(--pd-bg) !important;
}
.button-green:hover {
  background-color: var(--pd-accent) !important;
  border-color: var(--pd-accent) !important;
  color: var(--pd-on-accent) !important;
}

/* ============================================================
   CONTATTI — tema Propadyn (it_contatti.php)
   ============================================================ */
.pd-contact { background: var(--pd-bg); }
.pd-contact-inner { max-width: 1180px; margin: 0 auto; padding: 90px 32px 70px; }

.pd-contact-head { max-width: 760px; margin-bottom: 54px; }
.pd-contact-head h1 {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-weight: 500; font-size: clamp(40px, 6vw, 66px); line-height: 1.02;
  letter-spacing: -0.01em; margin: 14px 0 0; color: var(--pd-ink);
}
.pd-contact-intro {
  margin-top: 20px; font-size: 18px; line-height: 1.6; color: var(--pd-muted);
}
.pd-contact-intro p { margin: 0 0 10px; }

.pd-contact-grid {
  display: grid; grid-template-columns: 1.35fr 0.85fr; gap: 56px; align-items: start;
}

/* ── Form ── */
.pd-contact-form-wrap {
  background: var(--pd-paper); border: 1px solid var(--pd-line);
  padding: 40px 40px 34px; box-shadow: 0 30px 60px -44px rgba(60,48,20,0.5);
}
.pd-cf-row { margin-bottom: 24px; }
.pd-cf-row.two { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.pd-cf-field { display: flex; flex-direction: column; }
.pd-cf-field label {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--pd-muted); margin-bottom: 9px;
}
.pd-cf-field .req { color: var(--pd-accent); }
.pd-cf-field input,
.pd-cf-field select,
.pd-cf-field textarea {
  width: 100%; border: 0; border-bottom: 1px solid var(--pd-line2);
  background: transparent; padding: 8px 2px; font-size: 16px;
  font-family: 'Cormorant Garamond', Georgia, serif; color: var(--pd-ink);
  border-radius: 0; -webkit-appearance: none; appearance: none; transition: border-color .2s;
}
.pd-cf-field textarea { resize: vertical; min-height: 108px; line-height: 1.5; }
.pd-cf-field select.pd-cf-select {
  cursor: pointer;
  background-image: linear-gradient(45deg, transparent 50%, var(--pd-accent) 50%),
                    linear-gradient(135deg, var(--pd-accent) 50%, transparent 50%);
  background-position: right 6px top 18px, right 1px top 18px;
  background-size: 6px 6px, 6px 6px; background-repeat: no-repeat; padding-right: 22px;
}
.pd-cf-field input:focus,
.pd-cf-field select:focus,
.pd-cf-field textarea:focus { outline: none; border-bottom-color: var(--pd-accent); }

.pd-cf-privacy {
  display: flex; align-items: flex-start; gap: 10px; margin: 6px 0 26px;
  font-size: 14px; color: var(--pd-muted); line-height: 1.45; cursor: pointer;
}
.pd-cf-privacy input { margin-top: 3px; accent-color: var(--pd-accent); flex: 0 0 auto; }
.pd-cf-privacy a { color: var(--pd-accent); text-decoration: underline; }

.pd-btn-gold {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase;
  background: var(--pd-accent); color: var(--pd-on-accent);
  border: 1px solid var(--pd-accent); padding: 15px 34px; cursor: pointer;
  transition: background .2s, color .2s;
}
.pd-btn-gold:hover { background: var(--pd-ink); border-color: var(--pd-ink); color: var(--pd-bg); }
.pd-btn-gold:disabled { opacity: .55; cursor: default; }

.pd-cf-msg { margin-top: 20px; font-size: 15px; }
.pd-cf-msg.is-err { color: #9a3b2e; font-family: 'JetBrains Mono', monospace; font-size: 13px; line-height: 1.6; }
.pd-cf-msg .alert { padding: 14px 16px; border: 1px solid var(--pd-line2); }
.pd-cf-msg .alert-success { border-color: var(--pd-accent); color: var(--pd-ink); background: var(--pd-bg2); }
.pd-cf-msg .alert-danger { border-color: #9a3b2e; color: #9a3b2e; }

/* ── Pannello contatti ── */
.pd-contact-info { padding-top: 6px; }
.pd-ci-item { padding: 22px 0; border-bottom: 1px solid var(--pd-line); display: flex; flex-direction: column; gap: 7px; }
.pd-ci-item:first-child { padding-top: 0; }
.pd-ci-k {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--pd-accent);
}
.pd-ci-v { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 21px; line-height: 1.35; color: var(--pd-ink); }
.pd-ci-v a { color: var(--pd-ink); border-bottom: 1px solid var(--pd-line2); }
.pd-ci-v a:hover { color: var(--pd-accent); border-color: var(--pd-accent); }
.pd-ci-note { margin-top: 24px; font-size: 14px; font-style: italic; color: var(--pd-muted); }

/* ── Mappa ── */
.pd-contact-map { border-top: 1px solid var(--pd-line); }
.pd-contact-map iframe { display: block; width: 100%; height: 460px; filter: grayscale(0.35) contrast(0.95); }
/* difesa anti-fitVids: se Canvas incapsula comunque l'iframe, ne annulla il padding-ratio */
.pd-contact-map .fluid-width-video-wrapper { padding: 0 !important; height: 460px !important; }
.pd-contact-map .fluid-width-video-wrapper iframe { position: static !important; height: 460px !important; }
@media (max-width: 860px) { .pd-contact-map iframe, .pd-contact-map .fluid-width-video-wrapper, .pd-contact-map .fluid-width-video-wrapper iframe { height: 320px !important; } }

@media (max-width: 860px) {
  .pd-contact-inner { padding: 60px 22px 50px; }
  .pd-contact-grid { grid-template-columns: 1fr; gap: 36px; }
  .pd-contact-form-wrap { padding: 28px 22px; }
  .pd-cf-row.two { grid-template-columns: 1fr; gap: 24px; }
}

/* ══════════════════════════════════════════════════════════════════════════
   CAMPAGNA MUSEART — la pennellata come materia            (08-09-2026)
   Asset: canvas/images/ → pd-brush.jpg · pd-mark.png · pd-pack.png
                           pd-badge-oddy.png
   Il blu non è un colore nuovo: è la metà sinistra del logo («propadyn»
   cyan #00a0c8), come l'oro è la metà destra («museart»).
   ══════════════════════════════════════════════════════════════════════════ */
:root {
  --pd-blue:      #5999bf;   /* ceruleo della pennellata */
  --pd-blue-deep: #33709d;
  --pd-navy:      #20344f;   /* navy della confezione */
  --pd-cyan:      #00a0c8;   /* cyan del logo — colore del dato */
  --pd-brush:     url('../images/pd-brush.jpg');
}

/* ── USO 1 · manifesto sulla pennellata piena ───────────────────────────────
   Era una velatura al 30% con testi neri; ora la pennellata è a piena forza,
   come nella banda key visual qui sotto, e i testi vanno in negativo.

   ⚠️ La pennellata NON copre in modo uniforme. Misurata colonna per colonna,
   la luminosità media è 240 (quasi bianco) fino al 15% e oltre l'85% della
   larghezza, e scende a 104-143 solo nella fascia centrale. Un testo bianco
   a piena larghezza uscirebbe dal blu ai due lati e sparirebbe: da qui il
   contenitore con max-width, e il gradiente che approfondisce il centro.   */
/* ⚠️ Sfondo: la BANDA, non pd-brush.jpg — ed è la ragione per cui il testo può
   stare centrato. La pennellata intera è quasi bianca ai lati (luminosità 240
   fino al 15% e oltre l'85%): per reggere il bianco su un blocco centrato
   servirebbe un velo uniforme al 55%, cioè l'effetto spento che si voleva
   togliere. La banda — ricavata dalla stessa pennellata ritagliandone la parte
   coprente e ruotandola — è invece uniforme su tutta la larghezza, con un
   contrasto minimo del bianco di 5,13:1: texture piena, e testo centrato. */
.pd-manifesto {
  position: relative; overflow: hidden;
  background: url('../images/pd-brush-band.jpg') center center / cover no-repeat;
  border-bottom: none;
  padding: clamp(56px, 6vw, 96px) 24px;
}
.pd-manifesto > * { position: relative; z-index: 1; }

/* Centrato, come dev'essere: la banda copre in modo uniforme, quindi non serve
   più ancorare il testo alla parte scura della pennellata. Il max-width resta
   perché una riga lunga il doppio dello schermo non si legge comunque. */
.pd-manifesto-in {
  max-width: 780px;
  margin: 0 auto;
}
.pd-manifesto .pd-label { color: rgba(255,255,255,.86); }
.pd-manifesto .pd-manifesto-h,
.pd-manifesto .pd-home-intro,
.pd-manifesto .pd-home-intro p {
  color: #fff;
  text-shadow: 0 2px 20px rgba(20,50,78,.55);
}
.pd-manifesto .pd-home-intro { color: rgba(255,255,255,.94); }
.pd-manifesto .pd-manifesto-h em,
.pd-manifesto .pd-home-intro a { color: #f0d9a4; }

@media (max-width: 767px) {
  .pd-manifesto { padding: 48px 20px; }
  /* Niente correzioni particolari: la banda è uniforme, quindi anche quando
     su schermo stretto viene ritagliata il fondo resta coprente ovunque. */
  .pd-manifesto-in { max-width: 100%; }
}

/* ── USO 2 · banda key visual ───────────────────────────────────────────── */
.pd-kvband {
  display: grid; grid-template-columns: 1.24fr .76fr; align-items: stretch;
  position: relative; overflow: hidden;
  background: var(--pd-bg); border-bottom: 1px solid var(--pd-line);
}
.pd-kv-paint {
  position: relative; min-height: 400px;
  background: var(--pd-brush) center / cover no-repeat;
  display: flex; flex-direction: column; justify-content: center;
  padding: clamp(30px, 3.4vw, 52px) clamp(24px, 2.8vw, 44px);
}
/* approfondisce il blu dove sta il testo e sfuma prima del bordo dipinto */
.pd-kv-paint::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(ellipse 66% 80% at 50% 48%,
    rgba(26,68,104,.52) 0%, rgba(26,68,104,.27) 58%, rgba(26,68,104,0) 82%);
}
/* il claim resta dentro il nucleo coprente della pennellata (25–84%) */
.pd-kv-in { position: relative; z-index: 1; margin-left: 20%; max-width: 66%; }
.pd-kv-mark { width: clamp(40px, 3.8vw, 56px); margin-bottom: 16px; opacity: .97; }
.pd-kvband h2 {
  margin: 0; color: #fff; text-transform: uppercase;
  font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 500;
  font-size: clamp(24px, 2.8vw, 42px); line-height: 1; letter-spacing: -.005em;
  text-shadow: 0 2px 20px rgba(23,55,80,.42);
}
.pd-kv-sub {
  margin: 10px 0 0; max-width: 26ch; color: #fff; text-transform: uppercase;
  font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 400;
  font-size: clamp(13px, 1.42vw, 21px); line-height: 1.12; letter-spacing: .01em;
  text-shadow: 0 2px 20px rgba(23,55,80,.42);
}
.pd-kv-badge {
  position: absolute; z-index: 1; top: 13%; right: 13%;
  width: clamp(64px, 7vw, 96px);
}
.pd-kv-copy {
  position: relative; z-index: 2;
  display: flex; flex-direction: column; justify-content: center;
  padding: clamp(34px, 3.6vw, 54px) clamp(24px, 2.8vw, 44px) 0;
  gap: 16px;
}
.pd-kv-text { font-size: 17.5px; line-height: 1.55; color: var(--pd-ink2); max-width: 46ch; }
.pd-kv-text p { margin-bottom: 10px; }
.pd-kv-text p:last-child { margin-bottom: 0; }
.pd-kv-cta { display: flex; gap: 12px; flex-wrap: wrap; }
.pd-kv-pack {
  display: block; width: 104%; max-width: 440px; margin: 14px 0 0 -14%;
  filter: drop-shadow(0 18px 32px rgba(26,26,26,.24));
}

@media (max-width: 960px) {
  .pd-kvband { grid-template-columns: 1fr; }
  .pd-kv-paint { min-height: 300px; }
  .pd-kv-in { margin-left: 8%; max-width: 84%; }
  .pd-kv-copy { padding: 32px 22px 34px; gap: 14px; }
  .pd-kv-pack { width: 100%; max-width: 360px; margin: 14px auto 0; }
}

/* ── USO 3 · intestazione delle pagine interne ──────────────────────────────
   Stessa apertura su tutte le pagine: non serve più una foto per ognuna.   */
.tazzetti-page-header { height: 150px; }
/* Pennellata vera, non più tinta di blu pieno né velata da un overlay.
   ⚠️ Non è la stessa immagine dello sfondo: `pd-brush-band.jpg` è una banda
   ricavata da pd-brush.jpg ritagliandone la sola parte coprente (x 48-86%,
   y 10-72%) e ruotandola di 90°, così la direzione uniforme della pennellata
   cade sulla larghezza. Serviva perché pd-brush.jpg è un acquerello chiaro:
   misurata colonna per colonna, il bianco ci sta sopra con un contrasto di
   2,3:1 nella fascia sinistra — cioè illeggibile — e il vecchio fondo blu in
   multiply era proprio il cerotto che il cliente voleva togliere.
   Sulla banda il bianco ha un contrasto minimo di 5,13:1 su tutta la larghezza,
   quindi il titolo regge senza bisogno di velature.
   Se un domani cambia la pennellata, la banda si rigenera: vedi CLAUDE.md. */
.tazzetti-page-header-bg {
  background-image: url('../images/pd-brush-band.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
/* L'overlay resta nel markup ma non colora più nulla: toglierlo dal DOM
   significherebbe toccare inc_sub_header.php e le pagine che lo includono. */
.tazzetti-page-header-overlay { background: none; }
.tazzetti-page-header-content { padding-top: 0; }
.tazzetti-page-header-content h2 {
  font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 500;
  font-size: clamp(28px, 3.4vw, 48px); line-height: 1; letter-spacing: -.03em;
  color: #fff;   /* esplicito: non deve dipendere da custom.css */
  text-shadow: 0 2px 18px rgba(20,50,78,.55), 0 1px 3px rgba(20,50,78,.4);
}
@media (max-width: 860px) {
  .tazzetti-page-header { height: 120px; }
}

/* ============================================================
   PAGINA 404  (canvas/it_404.php)
   ============================================================ */
.pd-404 { padding: 120px 0 130px; }
.pd-404-head { max-width: 720px; }
.pd-404 .pd-kicker {
  display: block; font-family: 'JetBrains Mono', monospace; font-size: 12px;
  letter-spacing: 0.2em; text-transform: uppercase; color: var(--pd-accent);
  margin-bottom: 18px;
}
.pd-404 h1 {
  font-family: 'Cormorant Garamond', serif; font-weight: 500;
  font-size: clamp(38px, 4.6vw, 62px); line-height: 1.06;
  letter-spacing: -0.02em; margin: 0 0 22px; color: var(--pd-ink);
}
.pd-404 p {
  font-size: 18px; line-height: 1.65; margin: 0 0 34px;
  color: rgba(26,26,26,0.72);
}
.pd-404-links { margin-top: 72px; padding-top: 34px; border-top: 1px solid rgba(26,26,26,0.12); }
.pd-404-links ul {
  list-style: none; margin: 18px 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 2px 30px;
}
.pd-404-links li { padding: 9px 0; border-bottom: 1px solid rgba(26,26,26,0.08); }
.pd-404-links a {
  font-family: 'Cormorant Garamond', serif; font-size: 21px; color: var(--pd-ink);
  text-decoration: none; transition: color .2s;
}
.pd-404-links a:hover { color: var(--pd-accent); }
@media (max-width: 767px) { .pd-404 { padding: 70px 0 80px; } }