/*
 * Flavor — Skin GOLD
 * Foglio autoconsistente: quando lo skin è "gold", style.css NON viene caricato.
 * Nessuna sovrascrittura, nessun residuo. Stesso markup, stesse classi.
 *
 * Grammatica: bande alternate bianco / grigio caldo / nero, filetti da 1px
 * al posto delle card, tipografia display stretta, oro come unico accento.
 * Zero raggi (tranne le pillole), zero ombre.
 */

/* ═══════════════════════════════════════
   1. TOKEN
   ═══════════════════════════════════════ */
:root {
  /* superfici */
  --canvas:    #ffffff;
  --park:      #f5f4f1;
  --dark:      #131211;
  --void:      #000000;

  /* inchiostri su chiaro */
  --ink:       #14140f;
  --ink-mut:   #6a675f;
  --ink-faint: #8e8b82;
  --hair:      #ddd9d0;

  /* inchiostri su scuro */
  --on-dark:       #f7f5f0;
  --on-dark-mut:   #a3a096;
  --on-dark-faint: #6e6b63;
  --hair-dark:     #2c2a26;

  /* oro — tre livelli, uno per ogni fondo */
  --gold:      #b8952e; /* riempimenti, filetti, testo display */
  --gold-ink:  #8a6f1c; /* testo piccolo su chiaro — contrasto 4.6:1 */
  --gold-lift: #d9bb63; /* testo piccolo su scuro — contrasto 11:1 */

  /* alias di compatibilità: alcuni inline style nei template usano
     var(--blu-light). Rimappati sull'oro, così nulla resta blu. */
  --blu:       var(--ink);
  --blu-light: var(--gold-ink);
  --blu-dark:  var(--void);
  --accent:    var(--gold);
  --white:     #ffffff;
  --text:      var(--ink);
  --cream:     var(--park);
  --gray-100:  var(--hair);
  --gray-200:  #c9c5bb;
  --gray-500:  var(--ink-mut);
  --gray-800:  var(--ink);

  /* tipografia — solo Plus Jakarta Sans, già presente nel tema.
     Playfair non viene mai richiamato, quindi non viene mai scaricato. */
  --font-body:    'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;
  --font-display: var(--font-body);
  --font-ui:      var(--font-body);

  /* ritmo */
  --max-w:    1240px;
  --gutter:   clamp(22px, 5vw, 64px);
  --band-pad: clamp(76px, 9vw, 148px);
  --header-h: 72px;
}

/* ═══════════════════════════════════════
   2. RESET & BASE
   ═══════════════════════════════════════ */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

html {
  font-size: 16px;
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

body {
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--canvas);
  line-height: 1.6;
  overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }
img, video { max-width: 100%; height: auto; display: block; }
strong, b { font-weight: 700; }

nav ul, nav ol,
.site-footer ul, .site-footer ol,
.main-nav ul, .main-nav ol,
.footer-col ul, .footer-col ol,
.services-grid ul, .services-grid ol { list-style: none; }

::selection { background: var(--gold); color: #12100a; }

:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 3px;
}

.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  clip-path: inset(50%);
  overflow: hidden;
  white-space: nowrap;
}
.screen-reader-text:focus {
  position: fixed !important;
  top: 12px; left: 12px;
  width: auto; height: auto;
  clip-path: none;
  z-index: 999;
  background: var(--gold);
  color: #12100a;
  padding: 12px 20px;
  font-weight: 600;
  font-size: 14px;
}

.container {
  width: 100%;
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

/* le ancore della home non devono finire sotto l'header */
[id] { scroll-margin-top: calc(var(--header-h) + 16px); }

/* ═══════════════════════════════════════
   3. BANDE
   L'alternanza è l'ossatura di tutta la pagina.
   ═══════════════════════════════════════ */
.hero,
.about-strip,
.services,
.results,
.cta-banner,
.blog-section,
.contact,
.page-content { padding: var(--band-pad) 0; }

.hero          { background: var(--void);   color: var(--on-dark); }
.about-strip   { background: var(--canvas); color: var(--ink); }
.services      { background: var(--park);   color: var(--ink); }
.results       { background: var(--void);   color: var(--on-dark); padding-bottom: clamp(48px, 6vw, 90px); }
.cta-banner    { background: var(--void);   color: var(--on-dark); padding-top: clamp(48px, 6vw, 90px); }
.blog-section  { background: var(--canvas); color: var(--ink); }
.contact       { background: var(--park);   color: var(--ink); }
.page-content  { background: var(--canvas); color: var(--ink); }

/* risultati e CTA formano un unico capitolo nero, diviso da un filetto */
.cta-banner .container { border-top: 1px solid var(--hair-dark); padding-top: clamp(48px, 6vw, 88px); }

/* ═══════════════════════════════════════
   4. TIPOGRAFIA
   ═══════════════════════════════════════ */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: 700;
  letter-spacing: -0.03em;
  word-spacing: 0.05em;
  line-height: 1.05;
  text-wrap: balance;
}

h2 { font-size: clamp(30px, 4.2vw, 62px); }
h3 { font-size: clamp(18px, 1.7vw, 25px); letter-spacing: -0.022em; font-weight: 600; }
h4 { font-size: clamp(15px, 1.2vw, 17px); letter-spacing: -0.015em; font-weight: 600; }

/* occhiello — non maiuscolo, come nel riferimento */
.label,
.hero-label,
.blog-card-cat,
.post-cat {
  font-family: var(--font-ui);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: -0.008em;
  color: var(--gold-ink);
}
.hero .label, .hero-label,
.results .label,
.cta-banner .label { color: var(--gold-lift); }

.section-header { max-width: 60ch; margin-bottom: clamp(38px, 4.6vw, 64px); }
.section-header .label { display: block; margin-bottom: clamp(16px, 2vw, 26px); }
.section-header p {
  font-size: clamp(16px, 1.5vw, 21px);
  line-height: 1.5;
  color: var(--ink-mut);
  margin-top: clamp(16px, 1.8vw, 24px);
  max-width: 46ch;
}
.results .section-header p,
.cta-banner p { color: var(--on-dark-mut); }

.text-accent { color: var(--gold-lift); font-style: normal; font-weight: 700; }
.about-strip .text-accent,
.blog-section .text-accent,
.services .text-accent,
.contact .text-accent { color: var(--gold-ink); }

/* ═══════════════════════════════════════
   5. BOTTONI — la pillola è l'unico raggio del sito
   ═══════════════════════════════════════ */
.btn, .btn-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-ui);
  font-size: clamp(14px, 1.1vw, 17px);
  font-weight: 600;
  letter-spacing: -0.012em;
  line-height: 1;
  padding: 16px 30px;
  border: 1px solid transparent;
  border-radius: 9999px;
  cursor: pointer;
  transition: background .25s ease, color .25s ease, border-color .25s ease, transform .25s ease;
  text-align: center;
}

.btn-primary, .btn-cta {
  background: var(--gold);
  color: #12100a;
}
.btn-primary:hover, .btn-cta:hover { background: var(--gold-lift); transform: translateY(-1px); }

.btn-outline {
  background: transparent;
  border-color: currentColor;
  color: inherit;
  opacity: .85;
}
.btn-outline:hover { opacity: 1; background: rgba(255,255,255,.08); }
.about-strip .btn-outline:hover,
.services .btn-outline:hover,
.contact .btn-outline:hover,
.page-content .btn-outline:hover { background: rgba(0,0,0,.05); }

.btn-arrow::after {
  content: '→';
  display: inline-block;
  transition: transform .25s ease;
}
.btn-arrow:hover::after { transform: translateX(4px); }

button.btn { font-family: var(--font-ui); }

/* ═══════════════════════════════════════
   6. HEADER
   ═══════════════════════════════════════ */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--canvas);
  border-bottom: 1px solid var(--hair);
  transition: background .35s ease, border-color .35s ease, color .35s ease;
}
.header-inner {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 var(--gutter);
  height: var(--header-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.logo {
  font-family: var(--font-display);
  font-size: 19px;
  font-weight: 800;
  letter-spacing: -0.05em;
  color: inherit;
  flex-shrink: 0;
}
.logo span { color: var(--gold); }
.logo img { max-height: 34px; width: auto; }

.main-nav {
  display: flex;
  align-items: center;
  gap: clamp(14px, 1.8vw, 28px);
}
.main-nav a {
  font-size: 14.5px;
  font-weight: 500;
  letter-spacing: -0.012em;
  color: inherit;
  opacity: .72;
  transition: opacity .2s ease, color .2s ease;
  white-space: nowrap;
}
.main-nav a:hover { opacity: 1; color: var(--gold-ink); }
.main-nav .nav-cta {
  opacity: 1;
  padding: 11px 22px;
  font-size: 14px;
  color: #12100a;
}
.main-nav .nav-cta:hover { color: #12100a; }

/* header trasparente sopra l'hero nero, solo in home e solo in cima */
body.has-dark-hero .site-header {
  position: fixed;
  left: 0; right: 0;
  background: transparent;
  border-bottom-color: transparent;
  color: var(--on-dark);
}
body.has-dark-hero .site-header .main-nav a:hover { color: var(--gold-lift); }
body.has-dark-hero .site-header.scrolled {
  background: rgba(0,0,0,.93);
  border-bottom-color: var(--hair-dark);
}
body.has-dark-hero .hero { padding-top: calc(var(--band-pad) + var(--header-h)); }

/* hamburger */
.hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 40px; height: 40px;
  background: none;
  border: 0;
  cursor: pointer;
  padding: 0;
}
.hamburger span {
  display: block;
  width: 22px; height: 1.5px;
  background: currentColor;
  transition: transform .3s ease, opacity .3s ease;
}
.hamburger.active span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.hamburger.active span:nth-child(2) { opacity: 0; }
.hamburger.active span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* con il menu aperto l'header è sempre solido: niente voci invisibili */
body:has(.main-nav.open) .site-header,
body.has-dark-hero:has(.main-nav.open) .site-header {
  background: var(--canvas);
  color: var(--ink);
  border-bottom-color: var(--hair);
}

/* ═══════════════════════════════════════
   7. HERO
   ═══════════════════════════════════════ */
.hero-content { max-width: min(56%, 740px); }
.hero h1 {
  font-size: clamp(40px, 6.6vw, 92px);
  font-weight: 800;
  letter-spacing: -0.045em;
  line-height: 0.98;
  max-width: 13ch;
  text-wrap: pretty;
}
.hero-label {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-bottom: clamp(20px, 2.4vw, 34px);
}
.dot-pulse {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--gold-lift);
  animation: goldPulse 2.4s ease-in-out infinite;
}
@keyframes goldPulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%      { opacity: .35; transform: scale(.8); }
}
.hero-subtitle {
  font-size: clamp(17px, 1.75vw, 25px);
  font-weight: 400;
  line-height: 1.45;
  letter-spacing: -0.012em;
  color: var(--on-dark-mut);
  max-width: 31ch;
  margin-top: clamp(18px, 2.2vw, 32px);
}
.hero-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: clamp(28px, 3.4vw, 46px);
}

/* ═══════════════════════════════════════
   8. CHI SIAMO
   ═══════════════════════════════════════ */
.about-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: clamp(40px, 6vw, 96px);
  align-items: start;
}
.about-text .label { display: block; margin-bottom: clamp(16px, 2vw, 26px); }
.about-text h2 { max-width: 18ch; }
.about-text p {
  font-size: clamp(16px, 1.45vw, 20px);
  line-height: 1.55;
  color: var(--ink-mut);
  margin-top: clamp(18px, 2vw, 28px);
  max-width: 52ch;
}

.about-stats {
  display: grid;
  gap: 0;
}
.stat-block {
  container-type: inline-size;
  border-top: 1px solid var(--hair);
  padding: clamp(18px, 2.2vw, 28px) 0 clamp(20px, 2.4vw, 30px);
}
.stat-number {
  font-family: var(--font-display);
  font-weight: 700;
  letter-spacing: -0.045em;
  line-height: 0.92;
  font-size: clamp(30px, 3.6vw, 56px);
  font-size: clamp(28px, 18cqi, 58px);
}
.stat-desc {
  font-size: 14px;
  line-height: 1.45;
  color: var(--ink-mut);
  margin-top: 10px;
  max-width: 24ch;
}

/* ═══════════════════════════════════════
   9. SERVIZI — colonne a filetto, numerate
   ═══════════════════════════════════════ */
.services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 0;
  counter-reset: svc;
}
.service-card {
  counter-increment: svc;
  background: none;
  border: 0;
  border-top: 1px solid var(--hair);
  border-radius: 0;
  box-shadow: none;
  padding: clamp(22px, 2.4vw, 34px) clamp(26px, 3vw, 52px) clamp(10px, 1.4vw, 18px) 0;
}
.service-card::before {
  content: counter(svc, decimal-leading-zero);
  display: block;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--gold-ink);
}
/* le emoji del template classico non appartengono a questa grammatica */
.service-icon { display: none; }
.service-card h3 { margin: 13px 0 11px; }
.service-card p {
  font-size: clamp(14px, 1.15vw, 16px);
  line-height: 1.55;
  color: var(--ink-mut);
}

/* ═══════════════════════════════════════
   10. RISULTATI — i numeri sono lo spettacolo
   ═══════════════════════════════════════ */
.results-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 0;
}
.result-item {
  container-type: inline-size;
  border-top: 1px solid var(--hair-dark);
  padding: clamp(24px, 2.8vw, 38px) clamp(22px, 2.6vw, 44px) clamp(14px, 1.8vw, 24px) 0;
}
.result-number {
  font-family: var(--font-display);
  font-weight: 700;
  letter-spacing: -0.05em;
  line-height: 0.9;
  color: var(--gold-lift);
  /* fallback per browser senza container query */
  font-size: clamp(34px, 4.6vw, 68px);
  /* la misura segue la COLONNA: "+340%" è largo 3,43em e con i vw sfondava */
  font-size: clamp(30px, 26cqi, 88px);
}
.result-text {
  font-size: 14px;
  line-height: 1.45;
  color: var(--on-dark-mut);
  margin-top: 14px;
  max-width: 22ch;
}
.count-up { font-variant-numeric: tabular-nums; }
.perf-bar-fill { background: var(--gold); height: 2px; width: 0; transition: width 1.2s cubic-bezier(.16,.84,.36,1); }

/* ═══════════════════════════════════════
   11. BANNER CTA
   ═══════════════════════════════════════ */
.cta-inner { max-width: 58ch; }
.cta-inner .label { display: block; margin-bottom: clamp(14px, 1.8vw, 22px); }
.cta-inner h2 { max-width: 20ch; }
.cta-inner p {
  font-size: clamp(16px, 1.5vw, 21px);
  line-height: 1.5;
  color: var(--on-dark-mut);
  margin-top: clamp(16px, 1.8vw, 24px);
  max-width: 46ch;
}
.cta-inner .btn { margin-top: clamp(26px, 3vw, 40px); }

/* ═══════════════════════════════════════
   12. BLOG — card senza card
   ═══════════════════════════════════════ */
.blog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  gap: clamp(30px, 3.4vw, 52px) clamp(26px, 3vw, 48px);
}
.blog-card {
  display: flex;
  flex-direction: column;
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  overflow: hidden;
}
.blog-card-thumb,
.blog-card-placeholder {
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background: var(--park);
  margin-bottom: clamp(16px, 1.8vw, 24px);
}
.blog-card-thumb img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .7s cubic-bezier(.16,.84,.36,1);
}
.blog-card:hover .blog-card-thumb img { transform: scale(1.04); }
.blog-card-placeholder,
.related-thumb-placeholder,
.post-featured-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--dark);
}
.placeholder-logo {
  font-family: var(--font-display);
  font-weight: 800;
  letter-spacing: -0.05em;
  font-size: 22px;
  color: var(--on-dark);
}
.placeholder-logo span { color: var(--gold); }

.blog-card-body { border-top: 1px solid var(--hair); padding-top: clamp(14px, 1.6vw, 20px); }
.blog-card-cat { display: block; margin-bottom: 10px; }
.blog-card h2 {
  font-size: clamp(19px, 1.6vw, 24px);
  letter-spacing: -0.025em;
  line-height: 1.22;
  transition: color .25s ease;
}
.blog-card:hover h2 { color: var(--gold-ink); }
.blog-card-excerpt {
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--ink-mut);
  margin-top: 10px;
}
.blog-card-meta {
  display: block;
  font-size: 12.5px;
  color: var(--ink-faint);
  margin-top: 14px;
}

/* ═══════════════════════════════════════
   13. CONTATTI E FORM
   ═══════════════════════════════════════ */
.contact-grid {
  display: grid;
  grid-template-columns: 0.85fr 1.15fr;
  gap: clamp(40px, 6vw, 90px);
  align-items: start;
}
.contact-info .label { display: block; margin-bottom: clamp(16px, 2vw, 26px); }
.contact-info h2 { max-width: 14ch; }
.contact-info > p {
  font-size: clamp(16px, 1.45vw, 20px);
  line-height: 1.55;
  color: var(--ink-mut);
  margin-top: clamp(16px, 1.8vw, 26px);
  max-width: 40ch;
}
.contact-detail {
  display: block;
  border-top: 1px solid var(--hair);
  padding: 16px 0 4px;
  margin-top: 20px;
}
.contact-detail:first-of-type { margin-top: clamp(28px, 3.4vw, 44px); }
.contact-icon { display: none; }
.contact-detail strong {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: var(--gold-ink);
  letter-spacing: -0.008em;
}
.contact-detail p {
  font-size: clamp(15px, 1.3vw, 18px);
  line-height: 1.4;
  margin-top: 6px;
}

.contact-form-wrap {
  background: var(--canvas);
  border: 1px solid var(--hair);
  padding: clamp(24px, 3vw, 44px);
}

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.form-group { margin-bottom: 16px; }
.form-group label {
  display: block;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: -0.006em;
  color: var(--ink-mut);
  margin-bottom: 7px;
}
.form-group input,
.form-group select,
.form-group textarea,
.search-field,
.wpforms-field input,
.wpforms-field select,
.wpforms-field textarea,
.wpcf7 input,
.wpcf7 select,
.wpcf7 textarea {
  width: 100%;
  font-family: var(--font-body);
  font-size: 15.5px;
  color: var(--ink);
  background: var(--canvas);
  border: 1px solid var(--hair);
  border-radius: 0;
  padding: 13px 15px;
  transition: border-color .2s ease;
  outline: none;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus,
.search-field:focus,
.wpforms-field input:focus,
.wpforms-field textarea:focus,
.wpcf7 input:focus,
.wpcf7 textarea:focus { border-color: var(--gold); }
.form-group textarea { resize: vertical; min-height: 130px; }
.form-group input::placeholder,
.form-group textarea::placeholder { color: var(--ink-faint); }
.contact-form-wrap form > button,
.contact-form-wrap .btn { margin-top: 8px; }

.form-message {
  border: 1px solid var(--hair);
  border-left: 3px solid var(--gold);
  padding: 14px 18px;
  margin-bottom: 22px;
  font-size: 14.5px;
  line-height: 1.5;
}
.form-success { border-left-color: var(--gold); }
.form-error   { border-left-color: #a02b1e; }

.search-form {
  display: flex;
  gap: 12px;
  align-items: flex-end;
  max-width: 560px;
  margin-top: 26px;
}
.search-form .form-group { flex: 1; margin-bottom: 0; }

/* ═══════════════════════════════════════
   14. PAGINE, ARTICOLO, ARCHIVI
   ═══════════════════════════════════════ */
.page-content > .container { max-width: 1180px; }

.page-content > .container > h1 {
  font-size: clamp(34px, 4.6vw, 68px);
  letter-spacing: -0.04em;
  max-width: 20ch;
  margin-bottom: clamp(28px, 3.4vw, 48px);
}

.blog-header {
  border-bottom: 1px solid var(--hair);
  padding-bottom: clamp(28px, 3.4vw, 48px);
  margin-bottom: clamp(38px, 4.4vw, 64px);
  max-width: 40ch;
}
.blog-header h1 {
  font-size: clamp(34px, 5vw, 74px);
  letter-spacing: -0.042em;
}
.blog-header p {
  font-size: clamp(16px, 1.45vw, 20px);
  line-height: 1.5;
  color: var(--ink-mut);
  margin-top: 18px;
}

/* — articolo — */
.single-post { max-width: 760px; margin: 0 auto; }

.post-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--ink-faint);
  margin-bottom: clamp(26px, 3vw, 42px);
}
.post-breadcrumb a { transition: color .2s ease; }
.post-breadcrumb a:hover { color: var(--gold-ink); }
.post-breadcrumb .sep { color: var(--hair); }
.post-breadcrumb .current { color: var(--ink-mut); }

.post-categories { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 18px; }
.post-cat { transition: color .2s ease; }
.post-cat:hover { color: var(--gold); }

.post-header h1 {
  font-size: clamp(33px, 4.4vw, 58px);
  letter-spacing: -0.04em;
  line-height: 1.06;
}
.post-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 9px;
  font-size: 13.5px;
  color: var(--ink-faint);
  margin-top: clamp(18px, 2.2vw, 28px);
  padding-bottom: clamp(22px, 2.6vw, 34px);
  border-bottom: 1px solid var(--hair);
}
.meta-sep { color: var(--hair); }

.post-featured-image,
.post-featured-placeholder {
  margin: clamp(30px, 3.6vw, 52px) 0;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--park);
}
.post-featured-image img { width: 100%; height: 100%; object-fit: cover; }

/* — corpo dell'articolo: la superficie più letta del sito — */
.post-body {
  font-size: clamp(17px, 1.35vw, 19.5px);
  line-height: 1.72;
  color: #23231d;
  letter-spacing: -0.003em;
}
.post-body > * + * { margin-top: 1.35em; }
.post-body p { max-width: 72ch; }

.post-body h2 {
  font-size: clamp(24px, 2.5vw, 36px);
  letter-spacing: -0.032em;
  line-height: 1.18;
  color: var(--ink);
  margin-top: 2.1em;
  padding-top: 1.05em;
  border-top: 1px solid var(--hair);
}
.post-body h3 {
  font-size: clamp(19px, 1.75vw, 24px);
  letter-spacing: -0.025em;
  line-height: 1.28;
  color: var(--ink);
  margin-top: 1.9em;
}
.post-body h4 { margin-top: 1.7em; color: var(--ink); }

.post-body a {
  color: var(--gold-ink);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: rgba(138,111,28,.4);
  transition: text-decoration-color .2s ease;
}
.post-body a:hover { text-decoration-color: var(--gold-ink); }

.post-body ul, .post-body ol { padding-left: 1.35em; max-width: 70ch; }
.post-body li { margin-top: .55em; }
.post-body li::marker { color: var(--gold); }

.post-body blockquote {
  border-left: 2px solid var(--gold);
  padding: 2px 0 2px 26px;
  margin-left: 0;
  font-size: 1.06em;
  line-height: 1.55;
  color: var(--ink-mut);
}
.post-body blockquote p { max-width: 60ch; }

.post-body table {
  width: 100%;
  border-collapse: collapse;
  font-size: .9em;
  line-height: 1.5;
  display: block;
  overflow-x: auto;
}
.post-body th, .post-body td {
  border-bottom: 1px solid var(--hair);
  padding: 12px 16px 12px 0;
  text-align: left;
  vertical-align: top;
}
.post-body th {
  font-weight: 600;
  font-size: 13px;
  letter-spacing: -0.008em;
  color: var(--gold-ink);
  border-bottom-color: var(--ink);
}

.post-body figure { margin-left: 0; margin-right: 0; }
.post-body figcaption {
  font-size: 13px;
  color: var(--ink-faint);
  margin-top: 10px;
  line-height: 1.45;
}
.post-body code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .88em;
  background: var(--park);
  padding: 2px 6px;
}
.post-body pre {
  background: var(--dark);
  color: var(--on-dark);
  padding: 20px 22px;
  overflow-x: auto;
  font-size: 14px;
  line-height: 1.6;
}
.post-body pre code { background: none; padding: 0; }
.post-body hr { border: 0; border-top: 1px solid var(--hair); margin: 2.4em 0; }

/* — piede articolo — */
.post-footer { margin-top: clamp(44px, 5vw, 72px); }
.post-tags { display: flex; flex-wrap: wrap; gap: 10px; }
.post-tag {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-mut);
  border: 1px solid var(--hair);
  border-radius: 9999px;
  padding: 7px 15px;
  transition: border-color .2s ease, color .2s ease;
}
.post-tag:hover { border-color: var(--gold); color: var(--gold-ink); }

.post-cta {
  background: var(--void);
  color: var(--on-dark);
  padding: clamp(32px, 4vw, 56px);
  margin-top: clamp(38px, 4.4vw, 60px);
}
.post-cta h3 {
  font-size: clamp(22px, 2.3vw, 33px);
  letter-spacing: -0.03em;
  line-height: 1.14;
  max-width: 22ch;
}
.post-cta p {
  font-size: clamp(15px, 1.3vw, 18px);
  line-height: 1.5;
  color: var(--on-dark-mut);
  margin-top: 14px;
  max-width: 48ch;
}
.post-cta .btn-cta { margin-top: clamp(22px, 2.6vw, 32px); }

/* — correlati — */
.related-posts {
  max-width: 1180px;
  margin: clamp(56px, 6.4vw, 96px) auto 0;
  border-top: 1px solid var(--hair);
  padding-top: clamp(34px, 4vw, 56px);
}
.related-posts h2 {
  font-size: clamp(22px, 2.2vw, 32px);
  letter-spacing: -0.03em;
  margin-bottom: clamp(26px, 3vw, 40px);
}
.related-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: clamp(24px, 3vw, 44px);
}
.related-card { display: block; }
.related-thumb,
.related-thumb-placeholder {
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--park);
  margin-bottom: 16px;
}
.related-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.16,.84,.36,1); }
.related-card:hover .related-thumb img { transform: scale(1.04); }
.related-card h3 {
  font-size: clamp(17px, 1.4vw, 21px);
  line-height: 1.25;
  transition: color .25s ease;
}
.related-card:hover h3 { color: var(--gold-ink); }
.related-date { display: block; font-size: 12.5px; color: var(--ink-faint); margin-top: 10px; }

/* — paginazione — */
.pagination, .navigation.pagination {
  margin-top: clamp(44px, 5vw, 72px);
  padding-top: clamp(24px, 3vw, 36px);
  border-top: 1px solid var(--hair);
}
.pagination .nav-links, .navigation .nav-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 42px;
  padding: 0 12px;
  font-size: 14.5px;
  font-weight: 500;
  color: var(--ink-mut);
  border: 1px solid transparent;
  transition: border-color .2s ease, color .2s ease;
}
.page-numbers:hover { color: var(--ink); border-color: var(--hair); }
.page-numbers.current { color: #12100a; background: var(--gold); font-weight: 600; }
.screen-reader-text + .nav-links { margin-top: 0; }

/* — 404 — */
.error-404 { max-width: 660px; }
.error-code {
  font-family: var(--font-display);
  font-size: clamp(74px, 12vw, 168px);
  font-weight: 800;
  letter-spacing: -0.06em;
  line-height: 0.85;
  color: var(--gold);
}
.error-404 h1 {
  font-size: clamp(28px, 3.4vw, 46px);
  letter-spacing: -0.035em;
  margin-top: clamp(18px, 2.2vw, 28px);
}
.error-404 > p {
  font-size: clamp(16px, 1.4vw, 19px);
  line-height: 1.55;
  color: var(--ink-mut);
  margin-top: 16px;
  max-width: 52ch;
}
.error-search { margin-top: clamp(26px, 3vw, 40px); }
.page-404 { text-align: left; max-width: 660px; }
.page-404 h1 { font-size: clamp(74px, 12vw, 168px); color: var(--gold); letter-spacing: -0.06em; }

.error-404 { max-width: 1180px; }
.error-links,
.error-recent { margin-top: clamp(44px, 5vw, 72px); }
.error-links h2,
.error-recent h2 {
  font-size: clamp(19px, 1.7vw, 24px);
  letter-spacing: -0.028em;
  margin-bottom: clamp(20px, 2.4vw, 30px);
}
.error-links-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 0;
}
.error-link-card {
  display: block;
  border-top: 1px solid var(--hair);
  padding: clamp(18px, 2vw, 26px) clamp(22px, 2.6vw, 42px) clamp(16px, 1.8vw, 22px) 0;
  transition: border-color .25s ease;
}
.error-link-card:hover { border-top-color: var(--gold); }
.error-link-icon { display: none; }
.error-link-title {
  display: block;
  font-family: var(--font-display);
  font-size: clamp(17px, 1.4vw, 21px);
  font-weight: 600;
  letter-spacing: -0.025em;
  transition: color .25s ease;
}
.error-link-card:hover .error-link-title { color: var(--gold-ink); }
.error-link-desc {
  display: block;
  font-size: 13.5px;
  line-height: 1.45;
  color: var(--ink-mut);
  margin-top: 7px;
}

/* residui di markup che ereditano, ma meglio dichiararli */
.hero-content { width: 100%; }
.placeholder-inner { display: flex; align-items: center; justify-content: center; }
.post-author, .read-time { color: inherit; }

/* ═══════════════════════════════════════
   15. FOOTER
   ═══════════════════════════════════════ */
.site-footer {
  background: var(--void);
  color: var(--on-dark);
  padding: clamp(56px, 6.4vw, 96px) 0 clamp(28px, 3vw, 42px);
}
.footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: clamp(34px, 5vw, 76px);
  padding-bottom: clamp(34px, 4vw, 56px);
  border-bottom: 1px solid var(--hair-dark);
}
.footer-brand .logo { font-size: 21px; }
.footer-brand p {
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--on-dark-mut);
  margin-top: 16px;
  max-width: 36ch;
}
.footer-col h4 {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: -0.008em;
  color: var(--gold-lift);
  margin-bottom: 18px;
}
.footer-col a {
  display: block;
  font-size: 14.5px;
  line-height: 1.45;
  color: var(--on-dark-mut);
  padding: 5px 0;
  transition: color .2s ease;
}
.footer-col a:hover { color: var(--on-dark); }

.footer-bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding-top: clamp(22px, 2.6vw, 32px);
  font-size: 12.5px;
  color: var(--on-dark-faint);
}
.footer-bottom a { transition: color .2s ease; }
.footer-bottom a:hover { color: var(--gold-lift); }
.footer-legal { display: flex; flex-wrap: wrap; gap: 18px; }

/* ═══════════════════════════════════════
   16. MOTION
   ═══════════════════════════════════════ */
/* la classe .flavor-js la mette l'header: se il JS non parte,
   il contenuto resta visibile invece di sparire */
html.flavor-js .reveal {
  opacity: 0;
  transform: translateY(20px);
  /* Rete di sicurezza: se il JS non parte — script bloccato, WP Rocket
     che ritarda l'esecuzione, estensione del browser — dopo 4 secondi
     il contenuto compare lo stesso. Senza questa riga la pagina resta
     bianca, perché tutto sta a opacity 0 in attesa di una classe. */
  animation: goldRise 1s cubic-bezier(.16,.84,.36,1) 4s forwards;
}
html.flavor-js .reveal.visible {
  animation: goldRise 1s cubic-bezier(.16,.84,.36,1) forwards;
}
@keyframes goldRise { to { opacity: 1; transform: none; } }
/* specificità alta di proposito: la shorthand qui sopra azzererebbe il delay */
html.flavor-js .reveal.visible.reveal-delay-1 { animation-delay: .09s; }
html.flavor-js .reveal.visible.reveal-delay-2 { animation-delay: .18s; }
html.flavor-js .reveal.visible.reveal-delay-3 { animation-delay: .27s; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  html.flavor-js .reveal { opacity: 1; transform: none; animation: none; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* ═══════════════════════════════════════
   17. RESPONSIVE
   ═══════════════════════════════════════ */
@media (max-width: 980px) {
  .about-grid,
  .contact-grid { grid-template-columns: 1fr; }
  .footer-grid  { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
}

@media (max-width: 860px) {
  .hamburger { display: flex; }

  .main-nav {
    position: fixed;
    inset: var(--header-h) 0 0 0;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    gap: 0;
    background: var(--canvas);
    color: var(--ink);
    padding: 18px var(--gutter) 40px;
    overflow-y: auto;
    transform: translateX(100%);
    transition: transform .38s cubic-bezier(.4,0,.2,1);
  }
  .main-nav.open { transform: translateX(0); }
  .main-nav a {
    opacity: 1;
    font-size: 19px;
    font-weight: 500;
    letter-spacing: -0.025em;
    padding: 16px 0;
    border-bottom: 1px solid var(--hair);
    color: var(--ink);
  }
  .main-nav .nav-cta {
    justify-content: center;
    margin-top: 24px;
    border-bottom: 0;
    font-size: 16px;
    color: #12100a;
  }
  body.has-dark-hero .site-header .main-nav a { color: var(--ink); }
}

@media (max-width: 700px) {
  .form-row { grid-template-columns: 1fr; }
  .services-grid,
  .results-grid { grid-template-columns: 1fr; }
  .service-card,
  .result-item { padding-right: 0; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; align-items: flex-start; }
  .search-form { flex-direction: column; align-items: stretch; }
  .post-body table { font-size: 14px; }
}

/* ═══════════════════════════════════════
   18. LIVELLO FOTOGRAFICO
   Le sezioni non hanno markup extra: la foto arriva
   da una custom property scritta dal Customizer e i
   due pseudo-elementi fanno foto + velo + grana.
   ═══════════════════════════════════════ */
.hero,
.chapter-dark {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
/* Il nero lo porta il contenitore: le due sezioni dentro sono
   trasparenti, quindi senza questa riga il capitolo resta bianco
   e il testo chiaro diventa illeggibile. */
.chapter-dark { background: var(--void); color: var(--on-dark); }
/* dentro il capitolo unico le due sezioni non devono creare
   un proprio contenitore, altrimenti spezzano la foto */
.chapter-dark > .results,
.chapter-dark > .cta-banner { position: static; background: transparent; }
/* con un ritratto la testa sta in alto: la finestra visibile si alza */
.hero { --flavor-photo-pos: center 26%; --flavor-photo-x: 11%; }
.hero > .container,
.results > .container,
.cta-banner > .container { position: relative; z-index: 3; }

body.has-photo-hero    .hero::before,
body.has-photo-chapter .chapter-dark::before {
  content: '';
  position: absolute;
  inset: -60px 0;                 /* margine di manovra per il parallasse */
  z-index: 0;
  background-image: var(--flavor-photo);
  background-size: cover;
  background-position: center;
  transform: translate3d(var(--flavor-photo-x, 0), 0, 0);
  opacity: 0;
  animation: photoIn 1.6s cubic-bezier(.16,.84,.36,1) .1s forwards;
}
@keyframes photoIn { to { opacity: 1; } }

body.has-photo-hero    .hero::after,
body.has-photo-chapter .chapter-dark::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background-repeat: repeat, no-repeat, no-repeat;
  background-size: 64px 64px, auto, auto;
  opacity: .92;
  /* grana pellicola + velo di leggibilità + stacco sotto l'header */
  background-image:
    url("data:image/png;base64,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"),
    linear-gradient(90deg, rgba(0,0,0,.8) 0%, rgba(0,0,0,.55) 26%, rgba(0,0,0,.18) 48%, rgba(0,0,0,0) 64%, rgba(0,0,0,0) 100%),
    linear-gradient(180deg, rgba(0,0,0,.72) 0%, rgba(0,0,0,0) 20%, rgba(0,0,0,0) 78%, rgba(0,0,0,.3) 100%);
}
/* su risultati e CTA il testo attraversa tutta la riga: serve un velo pieno */
body.has-photo-chapter .chapter-dark .result-number,
body.has-photo-chapter .chapter-dark .label,
body.has-photo-chapter .chapter-dark h2 { text-shadow: 0 2px 22px rgba(0,0,0,.92), 0 1px 3px rgba(0,0,0,.7); }
body.has-photo-chapter .chapter-dark .result-text,
body.has-photo-chapter .chapter-dark .cta-inner p,
body.has-photo-chapter .chapter-dark .section-header p { color: #c9c6bd; }
body.has-photo-chapter .chapter-dark::after {
  background-image:
    url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAQAAAAAYLlVAAAUaUlEQVR42gXBB0AWBMIA0IefLP0UBFEcKCoqgiLiHrlnmrvUhnXVpZV17XXta5/dVbb+bFh5ZebIvc2FKxfuvQcqiAgIAsr/XsjU+PqylYtS0zcqjHZdsnKfuehuRxxQ4Bl1TPQf21XXznWR3vaih73jQxVKNVfNvZ70D8ckaG6qkZaYaIZ23jbDJA/IME0jTX2gpSiXDLLRalUEHg9OlmCuctdsdtYkk5y3zRGPuCxKc1n6iHDMAKuU+tp1R2Sq7aJdmrkm33UjFMpxnyjzREk3W45Ig2TJUUmajT7TWC8r7BUjV7rm2upuk8D+YKx8g5zzhykq2+o2G10V7orBmlrqiOHWqq2uSlb4p0ipDkhwxUuWai3GSxbbo1QHRfa6z18yDPGZKL8Ic9RGD6NUqYsGGqiuI2J9bb6qAoOCg3XUXAtDvaCmXNlOCZOulQKLZKnkiICqIsXZbKVYs4xwyQSn9DDPo/7hlPtVleUb2XpI8q6mtqohSa5CYZK1UWqmMjWcMdMbTlhrrHUCLwRredbtqlotWS/fe9N6AZc9ZIpYvdXVRA/lrinSQ6Yh0k3WWAPva2axHGX+oZGWQlQ4oYbtCo13m9V6O6izZ50VYqfWWhlstQgZTimQra9AtWC6UKsscEp3Ox21Wnu3lKkp3SXHJSnTTJnKMizyhNMOuOCAYk94wy/2+pvd9kpV4Vs/+lG61qaZJtlB+XYa4HNJNnhMqOrSFZriH9aq0Fqgc3Cd9e7T1UIXXZckTVep0iX5Xis5MqU5YbYk5+zSyUs6GmWArk6IUahIOwsd1M+7msrS1jxV3K6qEpn6GeYdV7UVI9opq0T4RorvDLFUjsCrwTLv+EQT592jmUGuCBFrshN6qi9diQ5SbNZRuPZmSjPaRk18rsBu3dU2111S/KSnLpbrabFn7DTHwzKNdNZQ/f2gtykuOqiPVmKlOqyOvgJDg0vkaStMR9vMs109KZ7UzlmrbHDOJSd84f/MkeuSfGMdMVOSrub4mzrmuKqpHAu1kKaKWON8rJ8cfWRIsEAzs9yvjtus01h3O+wQZriztgu5P77UBVXUc1aRlhpZZIxyib4Qq53OotyppnrGSzBbiLUe1sgiLbT2ltMeNc1lAe+Idl51l8xUVYUraitRLtHDJnnVP8WabLPvhOqqhljX1RIYFWzhmicVWu9LX7spUl1VHZOooa0yvCfE42aI8IVHXTRMtCm6i7NIhQQrBQ13yU01HFRsue4uuiVHO0HdLTPNUC31N8txuV53WbjDRjimvsp73e24rZK8qpKWsg2Q6hnx3vS6Rn41QJFbIp30iRV+UlsL0TLV0N4tJZqoJ2i+YXYY4EkvC+rrAWNs1AUx/i7ohnKVZKhhrXLpouXLdl3gneA6d+jkD63M9ZhscyzRxURP+8Qy7fRxyFR9JXnfeGGOidJGIwcd9KsefpJsmkQpvva7T+xT4L8SrdNLCzNcF+WW79yhukiJ1hovRBubkSJQGKxptcO6+NpQK7RzrypKHfS8aE3V87FxrrrmhEZq62G/l71mvB8c1cMxPXzhI1NtkWCiBZbbY4plnrZFT2W6qe6cYhcUq+Mrp6xXR5R5kl0V6BdMcE4rK7wr1EknxVupraFWqe49DVX4xnjzDNFFpJPG2ixosqr6yfGEaBsUGiVcwAoBHTzlNw3N1FSxFDGaWS9DkhOihAnTVbw5jqjjhsCNYAuTnDRMpoWGyndFL7Okq2WqqjL1VNm3UrXxjm7+p5nNlvtZtAWelmulu/0maI145zS3xgwvSLbOMQ/KstI63UXZpYk8Faor1tNsD4mSINAkOMEj2ki1xwrxluiiisEe1VXAatGaiJEr2mbv2+pxH4kX6bpQg6xyVKZUEbZp716bXXPF417WU0Nr3LBKmFKhNhluiUEqtBH0k76WuqZCoGPwkmdFyBchVKoGLursvB1a2W6Qv5TL0kNHLS2wwu32WOE+11S3TnN97FHXNun2O2a4Lf4tRoF4kTKVeMZfdguXb50LAo5qrcRSHTSx2FiBD4M1rfK1bHGOGOtjnf3mN/90XgcRzkgU77py33sQ5UZYId5ik8yy1zBl+gta4V03fWioEvNU1cKnHrDIJU84KMFEDHdYdZfVMcY7yoTaJdA6OEuiJsJ1Ei9asWjVnbbFGbf7SIjnNbHIWTWEm6uDcOudlORzsW6pqsIHYmUoMdNn5tspQ1M7tZFugcHquSpfF7UVmSpOiD9dEu9+obYKPBOs6rBe8h2yTHd/KNBZuXHOyPWQxnJ95jG7jbLKc/5lpDvsdkJNdQzRUK7ablkiWqhKthphqTyDVHfdQF/qbI/LLmvkC1Xt0tCzDsvWyBF5AuXBEZqZrKff3GW218xVYryNhqmvimedU024FP8WrpX6vpMmzBWtdfWTi7INdMYBT/nCJGvU01VX72rmgOseckOFCmly1NPSBfd53SAFYtVUW2Bi8F2RjqjqOTli1FTklnq+cMEiNQTcIegXHR02wRLdlOrsuEKb3e+GrsLFWCpBJzWF2WCnLC3ttsdQdR3xutqK5Pmf+v5yWaJWqioxV7g2AnWDlyU6bLDN8pSrYqUeZqsh1mHXxLumjnWueEOZ7Vro4Gun7Pe1Z8U46yIOSlao3Fdi1NPUIrHq2+yoZI/JEqK2F0XY4C0h/pRrn7cscUIgPvixDH9q4w89NfNfk0x22huSXDfEXg01tE2k0zJVs9VJg/2mmZWyPadCR6etdqevXJPnab2dEecRoRZ60Gbhuunmlnz/85wpMj2lzBWd3NJGoF9wq51GiHFRT9W08Kcz0mR4wUTn7BNmodf85Hl11ZChukynFQtRT6pEeRq4prcdzurllrclGOqM9Z52zXz3OG6KCNtFWuUu9yiWb4kCkW4KjAhetsMxyXqYbJPGUqx3Wr4+Is1wRWuDLDXcGd/b5DHV/CVVjKsmmqNMmU/VkK+6ZLdb4JJyAQ118ZQa7lHuR7e74azm6vvOMZVdFJStpxkCDwSPGqBADydU0kO5Su5zn2XaWGC8GBG+dExlAVFeNF47O4XrraY6epjrilwZ5ruhgV9FK3NafXny7JPqsG3ukOZ9qarp7JI+vlQhzzg1rBE4EaytkuZyRGruR10EzXJIO23l+0O+Evdqoaq10lRW21YX1FeiWLIv5Tig0FOS9DBZF3830DJhejvsWd9oJkcv38rT1WIR0nzmaUHRjolSIjAweE1Lf0kxT4Un/KKRhZKEm6qj/o4ZZIP/SXNEgmkyFDmuvYZSLNRRmBh5ZtsiqKloQXPFedIUD8hS220uO2mpdyxx0d+95lM3FeiuxLfqCUQG7xaquiLr5RsoaJ1GUl3QyWSHTPC9MHEKvG6BeO1M9a48/1VgoHLd1ZHpM12ddlW4X2RpZam2Un0hxzrZYj3trA5KXdRepkIDnROmyMMCg4OV5Nijm8PyzJcl0XbN1NdaY8sd8IxiKeYqU6K5oCRbDJcnUWerzFeC5j5zlxB9rPWx7XIdsk1bYwxwSo7OvjfdCCl+FqVIgU1662a1wJjgUD8765RSBZIkiTLUNLVt9YO3Nfa9ONP1lGCo9fapZYjNdhlpvRG26ueiZYb63S6tXVRNdXuEa+Z3heIlWe2UR8Q54Bz2GWaNJNX9qpvA1eAWOQp09bzlTogUI+iAK5rq6z0tRGkrTjv/dcwdukpWbpWaNgixQQc1/SDOEjEeMcVr3hAqxUYPCrNRW7kWqeEXjc1zrzNiNVZdrnr6eU3gw2AtrQSN9TdFPrPBTSVaiNVAiitC9ROU57B6KpthuN8lmqWm+i4odMEMcR4W6hn/p7Ic5xU743ZnHDbMxzZ4WFuZMpwV0EOWWYrFma6zDQKPB/epobFZHpDsDwl2e9UR12S6qoNP7dVdQyfc4f8011ozq3UywDXpuliuqtGuGuIvtdTSRK50Y1TXyEwDbPC2FGdkOGqCrwz1q9tdcIcUO1QReDR4UJYk7Z30i4DB9jngpEcsd9wWz8mVZapi0wxRqpYt6luvoQ+lWuAuNwyw0A8OGKxEqNM2SPGRbjId098KC0T5Rbq1ks1xp12etcs33tJMoFuwrpWy3GmOie6wVrlxhtiotkwDnTXOfq9p7aw8hTbJ00+sj9TDKUVqaqCtgFgbzLNbNZ2d1sUyleV6zDHdVZjoimItHdLVZsvVM9puywTGBGv7S5oZEs0ySnORloqQJ8swXWwQZoDHRWgsVLi/idbMIk0859++1dQGX4p301+eVKirRGcFrfC0lZ4X42cZtpmjgfma2GSU4YrNNkG8pQJ3BCfr65ARGgtTrr7aWnpXhV3S5LlguPN22m2fPgbarJtPDJDmSw/Z4lcjNTbPYeec8LR6VnjEDfvU1NYvvjNcoVWqSdBVUwMU+ZfjeghVYYPAxeCbNrpivLcME2qJLBdUUdnzLgta5LgO6rrsKV+Ls9giY/3PRg+rsFxPLdSzwXA7JFlimQzTlRklyWuGu6CXEx40wsdaKLTLTA3U09tXRopQqY8cJd5zXjVRbtqqjv6qC1XJIWuNcNwB4TrabrIbMozznXNSFfvQTQ2td1U7N3X0jGv6mCFZDYW+9bqGHvCOWMcUiPK9VqKkam6Mfdr4WLrAm8F3tbZQou1a2W+fE46oMNocLYxyXEuzhbhNJ0/aLd12cdIsUcV1XDPMH9bqY55ID/jSGxaJ18VXxkrwo5fE+ECaRhrqqL7pCi3Q0QjzhAh0DT4h305NVDFDtv6eVt9imdq5oJWgnyU4JM5Go+11RJlYqZLNMkYtJ/RSWSfXNNPAZbt1tsedFoswFacNtFZbKSrrbZFrhuuokWzRtugs0DO41WIP2eAeF6WIUsWr0pwSLt4Ku/QzxCIjrVZdL43Ukmy6EtUNN9X7flLXr1ZrqomfTJKvkgh/6q+RQseddEShbVoKccgyWbL0tsAtMa4L3AzGetwSx5xSz++KpLjuMVcE5BjuT+WCtiu0Q7STmlooRra7bXCbFVKs0s4I3aWaoY5pkpXpIskq6aI86oJarnpSjiV6q6TUcZ2sdZf2PhEYHVxkuwdtFhCvgQQLHDNUuq+Vm+NO3Xznc1X1NVNv1Y3xq8s6CNdIM7PlquMbiX5yxGDrjVbXq3Zr4Lgyi5U66F6fqmOWEQK6uluRfkLNUSpQOfiyQ2aJcF0UFrjTNttt8opmhmrlRWdF+MElPWWJsFMNATdU9S/lgo67WyV1lBqhpRA0dVxXWW46LVxAT+WyBVRywAih8v2uhctaOC0wNfiKOtoJc05D7UXb5z9+kKSBT/xpuAZuaeK6vTJ0M0OikS5Z6qBxduvsKVNVsVGC/eI0MVkDvzngIXPdLlNfy+xxRohiQ0x3yikHZMpy3VqB8mAjuZ632btKnBFmn5MqnHRKey8a75BEBS552TRXjRTrmoYS9bPTOXsMtNkqxeL8zWnTRQp4SWef6aKp0QpUda9kDS2XK99t+vvevQYrMEogMpik0DSRymyxwl7NpOlotN4+VUem+uqYK8YVe6XZq6syO8RYa7zrShQ47E29pNqoRDe3YZEc/R0wUrkGflNLhFg35Ul2UF2DnTNTlIMC84I/e9s4UzTV1nC73am6ptZI9aMnJYt23r26y9BNwHxr3ZKsuSre9pxVNslQ3xnvOSzMdJfdpsxstxRo65T3DJEt0ZsuuF+cv1x1yjC1xSkQKAq+6XMVYo31H2MddkG2hQ6IVcN6s213v+aWK5coyhihBnnDCF8KcVot3ZTaZ783XHKPEeYa4T0PiRbvNSNc0UxH5xS6zWXT5Kqkj18cd7uGAnWCG92pQIFSpRbZ6Q3bvGihqirboFQ/jZVrYZ1b3lVitWxBcZrZ4KQ8Q0wzSoY5Iv0pWcAytzsrwmxDfSPDCVEaq6vIPgOFGeBrJXo6q0BgYbBCinDtFTjuft3sNUuajcrkyDfFAge19IchtokzzkznjTRFC0dNcNEZ2Qb50EGJuopXYKumEiXKlWCSVR4TsNkURz1mumgLvKWRQt9IEtgZbKZIfa/IVlmMWLu84kNdVbVZa/F6iHDZUcf9Kd95gxWJ9Kyz8iRIcEO47maboFh3L2mjtTQ3nTPMISmCdkrxkVRNbPeEVkaLclolN90jMCZ4Si+veEZHuZrLMlNtNdV2TqEX7LZanAsKdbDXJO18pJZ7rTLD87KU6S7OQg2NEyPLEL9ZbKfudgr1uVxpjgrTRrEjnnRKA3stEdTTQgsEPgz+pIk2wnFLDf/WH3GmyZHrpva2inNGK8eViVRfZ008404xLhnsnN9UGKelb2x3wkzhAj7wmMouOWWs9z3kZRNtU9dK/Sx1XoQDwoXYI9ApOEqmbq7aa6/m8o2T5C/FPlRZQ/lOuuTv2phvhKua2GyLtrZJc8XHKgzVzwQrva+uzpYJ082n/qtYa2PdVNsXokT43dM2aC7LGq9Y4j57nRLyQ/xuecZ4wV3OSjBdD1VVct1aIca5pp5WvhAv21XV5HlAe/vN1lA3NUXaIspqqUrd0NQ67ZSqJajIPFFW6a+S2qb7zt99br99uvldmnSNbBLoFEy0VozBEu01yH1W2y9XtAmiZCBeiGvWSDdCqMP6eNtCQS209E/RGsjWS1WJvjDUGmu0t0Zf5xzR1uNiXdLBaKXmme+miaaZ4EtXHFIgEBPsIcN0Y3wlSqYdilzVxypHFOvjTWc10EuZQtsEPeUDb5nnW2/rrFhAukVKpPnUEBVGmu2Wu/3itCJ3m2SNajbaq0i8d8zWQw+V9VXghlSBiuAmDXUThu0ecNIB0ba7071KVFdFU0tkSJdsiyJxFko30Q2dRdukiZ/1NdVKj/qP47bpL9l8rfVV4mfdHdDWdhUCTmlnlvnOaudPGxyxVqBjsLsuXjfQNAkuuiTWHU5oa44tRqliiUsOaGyHRg6q5gGl/iXUB1ooMNOb/qmFtqaYYLgQF6TINtRrLuqMc54wR0uV1bRfnGIv+7exKqkryv8DFkHT4TI0vjgAAAAASUVORK5CYII="),
    radial-gradient(ellipse 95% 92% at 42% 55%, rgba(0,0,0,.72), rgba(0,0,0,.9)),
    linear-gradient(180deg, rgba(0,0,0,.6) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,.6) 100%);
}
/* con la foto il titolo guadagna un filo di stacco */
body.has-photo-hero .hero h1,
body.has-photo-hero .hero .hero-subtitle,
body.has-photo-chapter .chapter-dark h2 { text-shadow: 0 2px 40px rgba(0,0,0,.55); }

/* ═══════════════════════════════════════
   19. MICRO-MOVIMENTI
   ═══════════════════════════════════════ */
/* i filetti si disegnano da sinistra quando la sezione entra */
html.flavor-js .result-item.reveal,
html.flavor-js .service-card.reveal,
html.flavor-js .stat-block.reveal { border-top-color: transparent; position: relative; }
html.flavor-js .result-item.reveal::after,
html.flavor-js .service-card.reveal::after,
html.flavor-js .stat-block.reveal::after {
  content: '';
  position: absolute;
  top: -1px; left: 0; right: 0;
  height: 1px;
  background: var(--hair);
  transform: scaleX(0);
  transform-origin: left center;
}
html.flavor-js .result-item.reveal::after { background: var(--hair-dark); }
html.flavor-js .result-item.reveal.visible::after,
html.flavor-js .service-card.reveal.visible::after,
html.flavor-js .stat-block.reveal.visible::after {
  transform: scaleX(1);
  transition: transform 1s cubic-bezier(.16,.84,.36,1) .12s;
}

/* ═══════════════════════════════════════
   SOTTOMENU
   Il walker del tema non li genera, ma un plugin o
   una modifica futura possono farlo: senza queste
   regole ereditano un fondo chiaro e il testo chiaro
   ci sparisce sopra.
   ═══════════════════════════════════════ */
.main-nav .sub-menu,
.main-nav ul ul {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 210px;
  background: var(--void);
  border: 1px solid var(--hair-dark);
  padding: 6px 0;
  list-style: none;
  z-index: 20;
}
.main-nav .sub-menu a,
.main-nav ul ul a {
  display: block;
  padding: 10px 18px;
  color: var(--on-dark);
  opacity: 1;
  white-space: nowrap;
}
.main-nav .sub-menu a:hover,
.main-nav ul ul a:hover {
  color: var(--gold-lift);
  background: rgba(255,255,255,.06);
}
.main-nav .sub-menu a::after,
.main-nav ul ul a::after { display: none; }
@media (max-width: 860px) {
  .main-nav .sub-menu,
  .main-nav ul ul {
    position: static;
    min-width: 0;
    background: transparent;
    border: 0;
    padding: 0 0 0 16px;
  }
  .main-nav .sub-menu a,
  .main-nav ul ul a { color: var(--ink); font-size: 16px; padding: 12px 0; }
}

/* sottolineatura oro che si apre sotto le voci di menu */
.main-nav a:not(.nav-cta) { position: relative; }
.main-nav a:not(.nav-cta)::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: -7px;
  height: 1px;
  background: var(--gold);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .38s cubic-bezier(.16,.84,.36,1);
}
.main-nav a:not(.nav-cta):hover::after { transform: scaleX(1); }

/* le miniature partono desaturate e riprendono colore al passaggio */
.blog-card-thumb img,
.related-thumb img,
.post-featured-image img {
  filter: grayscale(.45) contrast(1.04);
  transition: transform .7s cubic-bezier(.16,.84,.36,1), filter .5s ease;
}
.blog-card:hover .blog-card-thumb img,
.related-card:hover .related-thumb img { filter: grayscale(0) contrast(1); }
.post-featured-image img { filter: grayscale(.2) contrast(1.02); }

/* la pillola oro respira appena all'ingresso del puntatore */
.btn-primary, .btn-cta { position: relative; overflow: hidden; }

@media (prefers-reduced-motion: reduce) {
  body.has-photo-hero    .hero::before,
  body.has-photo-chapter .chapter-dark::before { animation: none; opacity: 1; transform: none; }
  html.flavor-js .result-item.reveal,
  html.flavor-js .service-card.reveal,
  html.flavor-js .stat-block.reveal { border-top-color: var(--hair); }
  html.flavor-js .result-item.reveal { border-top-color: var(--hair-dark); }
  html.flavor-js .result-item.reveal::after,
  html.flavor-js .service-card.reveal::after,
  html.flavor-js .stat-block.reveal::after { display: none; }
}

@media (max-width: 1100px) {
  .hero-content { max-width: 100%; }
  .hero h1 { max-width: 16ch; }
  .hero-subtitle { max-width: 42ch; }
  .hero { --flavor-photo-x: 0%; }
}

@media (max-width: 860px) {
  .main-nav a:not(.nav-cta)::after { display: none; }
  body.has-photo-hero    .hero::before,
  body.has-photo-chapter .chapter-dark::before { transform: none; inset: 0; }
}


/* ═══════════════════════════════════════
   20. VIDEO DI SFONDO (opzionale, solo hero)
   Il primo disegno resta la foto: il video lo
   inserisce il JS dopo, solo su desktop, e sfuma
   sopra il poster quando è davvero pronto.
   ═══════════════════════════════════════ */
.hero-video {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 1.2s ease;
  pointer-events: none;
  /* nessun filter qui: filtrare un video costa a ogni fotogramma.
     La desaturazione va cotta nel file, non nel CSS. */
}
.hero-video.is-ready { opacity: 1; }

/* col video attivo il parallasse si spegne: due movimenti insieme
   sono uno di troppo, e raddoppiano la composizione */
body.has-hero-video .hero::before { transform: none; }

@media (max-width: 860px) {
  .hero-video { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-video { display: none; }
}


/* ═══════════════════════════════════════
   21. MODALITÀ SOBRIA
   Un interruttore solo: restano foto, veli e
   comparse. Spariscono parallasse, grana e video,
   cioè le tre cose che costano a ogni fotogramma.
   ═══════════════════════════════════════ */
body.motion-sobrio .hero::before,
body.motion-sobrio .chapter-dark::before { transform: none; animation: none; opacity: 1; }
body.motion-sobrio .hero::after,
body.motion-sobrio .chapter-dark::after { background-image: none; background-color: rgba(0,0,0,.62); }
body.motion-sobrio .hero-video { display: none; }


/* ═══════════════════════════════════════
   22. DUE PROTEZIONI
   ═══════════════════════════════════════ */
/* a) L'elenco che si apre da un <select> lo disegna il sistema
   operativo e non eredita i colori del tema: se le opzioni
   restano trasparenti si legge bianco su bianco. */
select option,
.form-group select option {
  background: #ffffff;
  color: #14140f;
}
.form-group select { color-scheme: light; }

/* b) Un plugin del sito (Aidentity) aggiunge classi sl-reveal ai
   testi e li tiene a opacita' zero finche' non entrano in campo.
   Nell'header e nel menu non deve succedere mai: quelle voci
   devono essere leggibili dal primo istante. */
.site-header .sl-reveal,
.site-header .sl-reveal-img,
.main-nav .sl-reveal,
.main-nav a,
.site-header a {
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}


/* ═══════════════════════════════════════
   23. TENDINA DEL MENU
   La costruisce uno script esterno, quindi non ne
   conosco la classe: la aggancio per struttura, cioe'
   qualsiasi contenitore dentro il menu che raccolga
   dei link. La rendo nera come il resto dello skin,
   invece di lasciare testo chiaro su pannello chiaro.
   ═══════════════════════════════════════ */
.main-nav :is(div, ul, nav, section, aside):has(> a + a),
.main-nav :is(div, ul, nav, section, aside):has(> li + li) {
  background: var(--canvas) !important;
  border: 1px solid var(--hair) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 6px 0 !important;
  list-style: none;
}
.main-nav :is(div, ul, nav, section, aside):has(> a + a) a,
.main-nav :is(div, ul, nav, section, aside):has(> li + li) a {
  display: block;
  padding: 10px 20px;
  color: var(--ink) !important;
  opacity: 1 !important;
  font-size: 14.5px;
  white-space: nowrap;
}
.main-nav :is(div, ul, nav, section, aside):has(> a + a) a:hover,
.main-nav :is(div, ul, nav, section, aside):has(> li + li) a:hover {
  color: var(--gold-ink) !important;
  background: var(--park);
}
.main-nav :is(div, ul, nav, section, aside) a::after { display: none !important; }

/* il contenitore che avvolge la voce principale resta invisibile:
   ha un solo link diretto, quindi non e' la tendina */
.main-nav :is(div, span, li, nav):has(> a):not(:has(> a + a)) {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}
