/*
 Theme Name:   Fortop 2026
 Theme URI:    https://www.fortop.it/
 Description:  Restyling 2026 di fortop.it — design system paper-first, serif editoriale, accent verde Fortop. Child theme di Agenxe.
 Author:       Fortop
 Author URI:   https://www.fortop.it/
 Template:     agenxe
 Version:      2026.1.0
 Tags:         editorial, serif, paper, dark-sections, custom-logo, custom-menu, translation-ready
 Text Domain:  fortop-2026
*/

/* =========================================================================
   FORTOP · Design Tokens v2 (consultancy edition)
   Paper-first · serif editoriale · accent verde mirato
   ========================================================================= */

:root {
  /* -------- COLOR · brand (verde Fortop, usato come accent) -------- */
  --color-brand: #3CBC00;
  --color-brand-deep: #3CBC00;       /* uguale al brand: verde Fortop */
  --color-brand-ink: #1A4D00;
  --color-brand-tint: rgba(60,188,0,0.10);

  /* -------- COLOR · paper-first scale -------- */
  --color-white: #FFFFFF;
  --color-paper: #FAFAF7;
  --color-paper-2: #F2F1ED;
  --color-line: #E2E0DA;
  --color-line-2: #CECCC4;

  /* -------- COLOR · ink scale -------- */
  --color-ink: #0A0A0A;
  --color-ink-2: #1F1F1E;
  --color-ink-3: #4A4A48;
  --color-mute: #75736D;
  --color-mute-2: #9B9893;

  /* -------- COLOR · dark (sezioni accent) -------- */
  --color-dark: #0A0A0A;
  --color-dark-2: #1A1A19;
  --color-dark-3: #2A2A28;
  --color-dark-line: #333330;
  --color-dark-mute: #B5B2AC;

  /* -------- TYPE · families · Helvetica Now Display (self-hosted) -------- */
  /* Pesi reali disponibili nel font: 300 / 400 / 700 / 800
     500 e 600 fanno fallback automatico su 400 → tutta la UI usa principalmente
     400 (regular) e 700 (bold). Per "ExtraBold" servono 800.
     Italic (em/i) → oblique sintetico (no varianti italic nel font). */
  --font-display: 'Helvetica Now Display', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --font-sans: 'Helvetica Now Display', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --font-mono: 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;

  /* -------- TYPE · scale fluida -------- */
  --fs-display: clamp(3rem, 7vw + 1rem, 6.5rem);
  --fs-h1:      clamp(2.5rem, 4.5vw + 1rem, 4.75rem);
  --fs-h2:      clamp(1.875rem, 2.5vw + 1rem, 3rem);
  --fs-h3:      clamp(1.375rem, 1.2vw + 1rem, 1.875rem);
  --fs-h4:      clamp(1.125rem, 0.5vw + 1rem, 1.25rem);
  --fs-body-l:  1.1875rem;
  --fs-body:    1rem;
  --fs-body-s:  0.9375rem;
  --fs-caption: 0.8125rem;
  --fs-micro:   0.75rem;

  /* -------- TYPE · weights · adattati a Helvetica Now Display -------- */
  /* Solo 300/400/700/800 hanno glyph reali. medium e semibold mappati su 700
     per evitare fallback brutto del browser; black mappato su 800 (ExtraBold). */
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 700;
  --fw-semibold: 700;
  --fw-bold: 700;
  --fw-black: 800;

  --lh-tight: 1.04;
  --lh-snug: 1.18;
  --lh-base: 1.55;
  --lh-loose: 1.72;

  --ls-display: -0.025em;
  --ls-heading: -0.018em;
  --ls-overline: 0.16em;
  --ls-mono: 0.04em;

  /* -------- SPACING -------- */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 2.5rem;
  --sp-8: 3rem;
  --sp-9: 4rem;
  --sp-10: 5rem;
  --sp-11: 6.5rem;
  --sp-12: 9rem;
  --sp-13: 12rem;

  /* -------- LAYOUT -------- */
  --container-max: 1320px;
  --container-narrow: 880px;
  --container-wide: 1480px;
  --header-h: 84px;

  /* -------- RADIUS · più squadrato -------- */
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 12px;
  --radius-xl: 20px;
  --radius-full: 9999px;

  /* -------- SHADOW · sottili -------- */
  --shadow-sm: 0 1px 2px rgba(10,10,10,.04), 0 1px 1px rgba(10,10,10,.02);
  --shadow-md: 0 8px 24px rgba(10,10,10,.06), 0 2px 6px rgba(10,10,10,.03);
  --shadow-lg: 0 20px 48px rgba(10,10,10,.10), 0 6px 12px rgba(10,10,10,.04);

  /* -------- MOTION -------- */
  --ease-out: cubic-bezier(.2,.8,.2,1);
  --ease-in-out: cubic-bezier(.65,0,.35,1);
  --dur-fast: 180ms;
  --dur-base: 320ms;
  --dur-slow: 580ms;
}


/* =========================================================================
   FORTOP · Base + Components v2 (consultancy edition)
   ========================================================================= */

/* -------- RESET -------- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; tab-size: 4; scroll-behavior: smooth; }
body {
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  line-height: var(--lh-base);
  color: var(--color-ink-3);
  background: var(--color-paper);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  /* font-feature-settings rimossi: erano per Inter (ss01/cv11), non applicabili a Helvetica Now. */
}
img, svg, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
button { font: inherit; cursor: pointer; background: none; border: 0; color: inherit; }
input, textarea, select { font: inherit; color: inherit; }
table { border-collapse: collapse; width: 100%; }

::selection { background: var(--color-brand); color: var(--color-ink); }

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

/* -------- SKIP LINK -------- */
.skip-link {
  position: absolute;
  left: -9999px;
  top: var(--sp-2);
  background: var(--color-ink);
  color: var(--color-brand);
  padding: var(--sp-3) var(--sp-5);
  border-radius: var(--radius-sm);
  z-index: 9999;
  font-weight: var(--fw-medium);
}
.skip-link:focus { left: var(--sp-2); }

/* -------- TYPOGRAPHY · editorial scale -------- */
.display, .h1, .h2, .h3 {
  font-family: var(--font-display);
  font-weight: var(--fw-regular);
  color: var(--color-ink);
}
.display {
  font-size: var(--fs-display);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-display);
  font-weight: var(--fw-regular);
}
.h1 {
  font-size: var(--fs-h1);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-display);
  font-weight: var(--fw-regular);
}
.h2 {
  font-size: var(--fs-h2);
  line-height: var(--lh-snug);
  letter-spacing: var(--ls-heading);
  font-weight: var(--fw-regular);
}
.h3 {
  font-size: var(--fs-h3);
  line-height: var(--lh-snug);
  letter-spacing: var(--ls-heading);
  font-weight: var(--fw-regular);
}
.h4 {
  font-family: var(--font-sans);
  font-size: var(--fs-h4);
  line-height: var(--lh-snug);
  font-weight: var(--fw-semibold);
  letter-spacing: -0.005em;
  color: var(--color-ink);
}

/* Accent verde mirato dentro headline (sostituisce em) */
.h1 em, .h2 em, .h3 em, .display em {
  font-style: italic;
  color: var(--color-ink);
  font-weight: var(--fw-regular);
}
.accent {
  color: var(--color-brand-deep);
  font-style: italic;
}
.section-dark .accent { color: var(--color-brand); }

.lead {
  font-size: var(--fs-body-l);
  line-height: var(--lh-loose);
  color: var(--color-ink-3);
  font-weight: var(--fw-regular);
  max-width: 64ch;
}
.overline {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--ls-overline);
  font-weight: var(--fw-medium);
  color: var(--color-brand-deep);
}
.section-dark .overline { color: var(--color-brand); }
.caption { font-size: var(--fs-caption); color: var(--color-mute); }
.mono { font-family: var(--font-mono); letter-spacing: var(--ls-mono); }

p { line-height: var(--lh-loose); color: var(--color-ink-3); }
strong { font-weight: var(--fw-semibold); color: var(--color-ink); }

/* -------- LAYOUT primitives -------- */
.container { max-width: var(--container-max); margin: 0 auto; padding: 0 var(--sp-6); }
.container-narrow { max-width: var(--container-narrow); margin: 0 auto; padding: 0 var(--sp-6); }
.container-wide { max-width: var(--container-wide); margin: 0 auto; padding: 0 var(--sp-6); }
@media (max-width: 640px) {
  .container, .container-narrow, .container-wide { padding: 0 var(--sp-5); }
}

.section { padding: 6.25rem 0; }      /* 100px per lato = 200px totali */
.section-sm { padding: 4rem 0; }      /* 64px per lato = 128px totali */
.section-lg { padding: 9rem 0; }      /* 144px per lato = 288px totali */
.section-paper { background: var(--color-paper); }
.section-white { background: var(--color-white); }
.section-paper-2 { background: var(--color-paper-2); }
.section-dark {
  background: var(--color-dark);
  color: var(--color-paper);
}
.section-dark p, .section-dark .lead { color: var(--color-dark-mute); }
.section-dark strong { color: var(--color-paper); }
.section-dark .h1, .section-dark .h2, .section-dark .h3, .section-dark .display { color: var(--color-paper); }

.divider { height: 1px; background: var(--color-line); border: 0; margin: var(--sp-8) 0; }
.section-dark .divider { background: var(--color-dark-line); }

/* -------- HEADER · clean, paper-style -------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(250,250,247,0.92);
  backdrop-filter: saturate(180%) blur(12px);
  -webkit-backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid var(--color-line);
}
.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: var(--header-h);
  max-width: var(--container-wide);
  margin: 0 auto;
  padding: 0 var(--sp-6);
}
@media (max-width: 640px) {
  .site-header__inner { padding: 0 var(--sp-5); }
}

/* Logo wordmark Fortop */
.site-logo {
  display: inline-flex;
  align-items: center;
  height: 32px;
  color: var(--color-brand-deep);
  font-weight: var(--fw-bold);
  text-decoration: none;
}
.site-logo svg { height: 32px; width: auto; display: block; }

/* Hamburger only - sempre visibile */
.menu-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: var(--radius-full);
  color: var(--color-ink);
  transition: background var(--dur-fast) var(--ease-out);
  margin-right: -8px;
}
.menu-toggle:hover { background: var(--color-paper-2); }
.menu-toggle:focus-visible { outline: 2px solid var(--color-brand-deep); outline-offset: 2px; }
.menu-toggle__icon {
  position: relative;
  width: 22px;
  height: 14px;
}
.menu-toggle__icon span {
  position: absolute;
  left: 0;
  display: block;
  width: 100%;
  height: 1.5px;
  background: currentColor;
  border-radius: 1px;
  transition: transform var(--dur-base) var(--ease-out), opacity var(--dur-fast) var(--ease-out);
}
.menu-toggle__icon span:nth-child(1) { top: 0; }
.menu-toggle__icon span:nth-child(2) { top: 50%; transform: translateY(-50%); }
.menu-toggle__icon span:nth-child(3) { bottom: 0; }
.menu-toggle[aria-expanded="true"] .menu-toggle__icon span:nth-child(1) { top: 50%; transform: translateY(-50%) rotate(45deg); }
.menu-toggle[aria-expanded="true"] .menu-toggle__icon span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded="true"] .menu-toggle__icon span:nth-child(3) { bottom: 50%; transform: translateY(50%) rotate(-45deg); }

@media (min-width: 980px) {
  .menu-toggle { display: none; }
  .menu-panel { display: none !important; }
}

/* -------- DESKTOP NAVIGATION (visible on >=980px) -------- */
.site-nav { display: none; height: 100%; }
@media (min-width: 980px) {
  .site-nav { display: flex; align-items: stretch; height: 100%; }
}
.site-nav__list {
  display: flex;
  align-items: stretch;
  height: 100%;
  gap: 0;
}
.site-nav__item {
  position: relative;
  display: flex;
  align-items: stretch;
}
.site-nav__link {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  height: 100%;
  padding: 0 var(--sp-4);
  font-family: var(--font-sans);
  font-size: var(--fs-caption);
  font-weight: var(--fw-semibold);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-ink);
  cursor: pointer;
  background: none;
  border: 0;
  text-decoration: none;
  white-space: nowrap;
  transition: color var(--dur-fast) var(--ease-out);
}
.site-nav__link:hover,
.site-nav__link:focus-visible {
  color: var(--color-brand);
  outline: none;
}
.site-nav__link[aria-current="page"] { color: var(--color-brand); }
.site-nav__chevron {
  width: 9px;
  height: 9px;
  margin-left: 2px;
  transition: transform var(--dur-fast) var(--ease-out);
  opacity: 0.7;
}
.site-nav__item--has-children:hover .site-nav__chevron,
.site-nav__item--has-children:focus-within .site-nav__chevron,
.site-nav__item--has-children .site-nav__link[aria-expanded="true"] .site-nav__chevron {
  transform: rotate(180deg);
  opacity: 1;
}

/* Dropdown */
.site-nav__dropdown {
  position: absolute;
  top: 100%;
  left: var(--sp-3);
  min-width: 240px;
  background: var(--color-paper);
  border-top: 2px solid var(--color-brand);
  border-bottom: 1px solid var(--color-line);
  border-left: 1px solid var(--color-line);
  border-right: 1px solid var(--color-line);
  box-shadow: var(--shadow-md);
  padding: var(--sp-3) 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-6px);
  transition: opacity var(--dur-fast) var(--ease-out),
              transform var(--dur-fast) var(--ease-out),
              visibility 0s linear var(--dur-fast);
  z-index: 110;
}
.site-nav__item:last-child .site-nav__dropdown,
.site-nav__item:nth-last-child(2) .site-nav__dropdown {
  left: auto;
  right: var(--sp-3);
}
.site-nav__item--has-children:hover .site-nav__dropdown,
.site-nav__item--has-children:focus-within .site-nav__dropdown,
.site-nav__dropdown.is-open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
  transition: opacity var(--dur-fast) var(--ease-out),
              transform var(--dur-fast) var(--ease-out);
}
.site-nav__dropdown ul {
  display: flex;
  flex-direction: column;
}
.site-nav__dropdown a {
  display: block;
  padding: var(--sp-3) var(--sp-6);
  font-family: var(--font-sans);
  font-size: var(--fs-body-s);
  font-weight: var(--fw-regular);
  color: var(--color-ink);
  text-decoration: none;
  letter-spacing: 0;
  transition: color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);
}
.site-nav__dropdown a:hover {
  color: var(--color-brand);
  background: var(--color-paper-2);
}

/* -------- FULLSCREEN MENU PANEL -------- */
.menu-panel {
  position: fixed;
  inset: 0;
  background: var(--color-paper);
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--dur-base) var(--ease-out), visibility 0s linear var(--dur-base);
  overflow-y: auto;
  padding-top: var(--header-h);
}
.menu-panel[data-open="true"] {
  opacity: 1;
  visibility: visible;
  transition: opacity var(--dur-base) var(--ease-out);
}
.menu-panel__inner {
  max-width: var(--container-wide);
  margin: 0 auto;
  padding: var(--sp-7) var(--sp-6) var(--sp-10);
  display: grid;
  gap: var(--sp-5);
}
@media (min-width: 720px) {
  .menu-panel__inner {
    grid-template-columns: 1fr 1fr;
    gap: var(--sp-8) var(--sp-9);
    padding: var(--sp-9) var(--sp-6);
  }
}
.menu-group {
  display: flex;
  flex-direction: column;
  border-top: 1px solid var(--color-line);
  padding-top: var(--sp-3);
}
.menu-group__heading {
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 2vw + 1rem, 2rem);
  font-weight: var(--fw-regular);
  line-height: 1.15;
  letter-spacing: -0.015em;
  color: var(--color-ink);
  text-decoration: none;
  padding: var(--sp-2) 0;
  display: inline-block;
  align-self: flex-start;
  transition: color var(--dur-fast) var(--ease-out);
}
a.menu-group__heading:hover {
  color: var(--color-brand);
}
.menu-group__items {
  display: flex;
  flex-direction: column;
  margin-top: var(--sp-3);
  padding-top: var(--sp-3);
  border-top: 1px solid var(--color-line);
}
.menu-group__items a {
  font-family: var(--font-sans);
  font-size: var(--fs-body-s);
  font-weight: var(--fw-regular);
  color: var(--color-ink-3);
  padding: var(--sp-2) 0;
  display: block;
  letter-spacing: 0;
  transition: color var(--dur-fast) var(--ease-out);
}
.menu-group__items a:hover { color: var(--color-brand); }

.menu-panel__bottom {
  border-top: 1px solid var(--color-line);
  padding: var(--sp-7) var(--sp-6);
  display: grid;
  gap: var(--sp-6);
  font-size: var(--fs-body-s);
}
@media (min-width: 720px) {
  .menu-panel__bottom {
    grid-template-columns: 1fr 1fr 1fr;
    max-width: var(--container-wide);
    margin: 0 auto;
  }
}
.menu-panel__addr { color: var(--color-ink-3); line-height: var(--lh-loose); }
.menu-panel__addr strong { display: block; color: var(--color-ink); font-family: var(--font-display); font-size: var(--fs-h4); font-weight: var(--fw-regular); margin-bottom: var(--sp-2); }
.menu-panel__addr a { color: var(--color-ink-3); }
.menu-panel__addr a:hover { color: var(--color-brand-deep); }

body.menu-open { overflow: hidden; }

/* -------- BUTTONS -------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2);
  padding: var(--sp-4) var(--sp-6);
  border-radius: var(--radius-sm);
  font-family: var(--font-sans);
  font-size: var(--fs-body-s);
  font-weight: var(--fw-medium);
  letter-spacing: 0;
  line-height: 1;
  transition: all var(--dur-fast) var(--ease-out);
  cursor: pointer;
  border: 1px solid transparent;
  white-space: nowrap;
  position: relative;
}
.btn:focus-visible { outline: 2px solid var(--color-brand-deep); outline-offset: 3px; }

.btn--primary {
  background: var(--color-ink);
  color: var(--color-paper);
  border-color: var(--color-ink);
}
.btn--primary:hover {
  background: var(--color-brand-deep);
  border-color: var(--color-brand-deep);
  color: var(--color-paper);
}
.section-dark .btn--primary,
.section-dark .offer-box .btn--primary {
  background: var(--color-brand) !important;
  color: var(--color-ink) !important;
  border-color: var(--color-brand) !important;
}
.section-dark .btn--primary:hover,
.section-dark .offer-box .btn--primary:hover {
  background: var(--color-paper) !important;
  border-color: var(--color-paper) !important;
  color: var(--color-ink) !important;
}

.btn--secondary {
  background: transparent;
  color: var(--color-ink);
  border-color: var(--color-ink);
}
.btn--secondary:hover {
  background: var(--color-ink);
  color: var(--color-paper);
}
.section-dark .btn--secondary {
  color: var(--color-paper);
  border-color: var(--color-dark-line);
}
.section-dark .btn--secondary:hover {
  background: var(--color-paper);
  color: var(--color-ink);
  border-color: var(--color-paper);
}

.btn--ghost {
  background: transparent;
  color: var(--color-ink-3);
  padding-left: 0;
  padding-right: 0;
  border-bottom: 1px solid var(--color-line-2);
  border-radius: 0;
}
.btn--ghost:hover {
  color: var(--color-brand-deep);
  border-bottom-color: var(--color-brand-deep);
}

.btn--lg { padding: var(--sp-5) var(--sp-7); font-size: var(--fs-body); }
.btn--sm { padding: var(--sp-3) var(--sp-5); font-size: var(--fs-caption); }
.btn .arrow { transition: transform var(--dur-fast) var(--ease-out); }
.btn:hover .arrow { transform: translateX(3px); }

/* Link with editorial arrow */
.link-arrow {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  font-weight: var(--fw-medium);
  color: var(--color-ink);
  padding-bottom: 2px;
  border-bottom: 1px solid var(--color-ink);
  transition: all var(--dur-fast) var(--ease-out);
}
.link-arrow:hover {
  color: var(--color-brand-deep);
  border-bottom-color: var(--color-brand-deep);
}
.section-dark .link-arrow {
  color: var(--color-paper);
  border-bottom-color: var(--color-paper);
}
.section-dark .link-arrow:hover {
  color: var(--color-brand);
  border-bottom-color: var(--color-brand);
}
.link-arrow .arrow { transition: transform var(--dur-fast) var(--ease-out); }
.link-arrow:hover .arrow { transform: translateX(3px); }

/* -------- HERO · editorial, dark di default -------- */
.hero {
  position: relative;
  background: var(--color-dark);
  color: var(--color-paper);
  padding: var(--sp-7) 0 var(--sp-9);
  border-bottom: 1px solid var(--color-dark-line);
}
.hero--light {
  background: var(--color-paper);
  color: var(--color-ink);
  border-bottom-color: var(--color-line);
}
.hero__inner { position: relative; z-index: 1; }
.hero__overline {
  display: block;
  margin-bottom: var(--sp-4);
  color: var(--color-brand);
}
.hero__overline::before {
  content: '';
  display: inline-block;
  width: 36px;
  height: 1px;
  background: var(--color-brand);
  vertical-align: middle;
  margin-right: var(--sp-3);
}
.hero--light .hero__overline { color: var(--color-brand); }
.hero--light .hero__overline::before { background: var(--color-brand); }

.hero__title {
  font-family: var(--font-display);
  font-size: var(--fs-display);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-display);
  font-weight: var(--fw-regular);
  color: var(--color-paper);
  margin-bottom: var(--sp-4);
}
.hero--light .hero__title { color: var(--color-ink); }
.hero__title em { font-style: italic; color: var(--color-brand); font-weight: var(--fw-regular); }

.hero__deck {
  font-family: var(--font-display);
  font-size: clamp(1.375rem, 1.5vw + 1rem, 1.875rem);
  line-height: var(--lh-snug);
  letter-spacing: var(--ls-heading);
  color: var(--color-paper);
  font-weight: var(--fw-regular);
  max-width: 60ch;
  margin-top: var(--sp-5);
}
.hero--light .hero__deck { color: var(--color-ink); }
.hero__deck em { color: var(--color-brand); font-style: italic; }

.hero__sub {
  font-size: var(--fs-body-l);
  line-height: var(--lh-loose);
  color: var(--color-dark-mute);
  max-width: 56ch;
  margin-top: var(--sp-5);
  font-weight: var(--fw-regular);
}
.hero--light .hero__sub { color: var(--color-ink-3); }
.hero__sub strong { color: var(--color-paper); }
.hero--light .hero__sub strong { color: var(--color-ink); }

.hero .breadcrumb { color: var(--color-dark-mute); }
.hero .breadcrumb a { color: var(--color-dark-mute); }
.hero .breadcrumb a:hover { color: var(--color-brand); }
.hero--light .breadcrumb { color: var(--color-mute); }
.hero--light .breadcrumb a { color: var(--color-mute); }
.hero--light .breadcrumb a:hover { color: var(--color-brand); }

.hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-3);
  margin-top: var(--sp-8);
}
.hero__visual { margin-top: var(--sp-10); }

.hero--grid {
  display: grid;
  gap: var(--sp-10);
}
@media (min-width: 980px) {
  .hero--grid {
    grid-template-columns: 1.15fr 1fr;
    align-items: center;
    gap: var(--sp-11);
  }
  .hero--grid .hero__visual { margin-top: 0; }
}

/* Hero in layout 2-colonne: il titolo va ridotto altrimenti rompe su 7+ righe */
.hero--grid .hero__title {
  font-size: clamp(2rem, 2.6vw + 1rem, 3.5rem);
  line-height: 1.1;
}

.hero--centered {
  text-align: center;
}
.hero--centered .hero__overline { display: block; }
.hero--centered .hero__overline::before { display: none; }
.hero--centered .hero__title,
.hero--centered .hero__sub { margin-left: auto; margin-right: auto; }
.hero--centered .hero__actions { justify-content: center; }

/* -------- BLOCK / SECTION patterns -------- */
.block-header {
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
  margin-bottom: var(--sp-10);
  max-width: 780px;
}
.block-header--centered {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  align-items: center;
}
.block-num {
  font-family: var(--font-mono);
  font-size: var(--fs-caption);
  color: var(--color-brand-deep);
  letter-spacing: var(--ls-overline);
  font-weight: var(--fw-medium);
  display: inline-flex;
  align-items: center;
  gap: var(--sp-3);
  text-transform: uppercase;
}
.block-num::before {
  content: '';
  width: 36px;
  height: 1px;
  background: var(--color-brand-deep);
}
.section-dark .block-num,
.section-dark .block-num::before { color: var(--color-brand); background: var(--color-brand); }
.section-dark .block-num { color: var(--color-brand); background: transparent; }
.section-dark .block-num::before { background: var(--color-brand); }

/* -------- BADGE -------- */
.badge {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  padding: var(--sp-2) var(--sp-4);
  background: var(--color-brand-tint);
  color: var(--color-brand-deep);
  border-radius: var(--radius-full);
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  letter-spacing: var(--ls-overline);
  text-transform: uppercase;
  font-weight: var(--fw-medium);
}
.section-dark .badge {
  background: rgba(60,188,0,0.18);
  color: var(--color-brand);
}
.badge::before {
  content: '';
  width: 5px; height: 5px;
  background: currentColor;
  border-radius: 50%;
}

/* -------- GRID PATTERNS -------- */
/* Tutti i paragrafi dentro le griglie editoriali devono avere la stessa misura
 * (.lead e <p> "nudi" sembrano diversi altrimenti perché .lead usa --fs-body-l) */
.grid-2 > div > p,
.grid-2 > div > p.lead,
.grid-2 > div > p.mt-3,
.grid-2 > div > p.mt-4,
.grid-2 > div > p.mt-5,
.grid-2 > div > p.mt-6 {
  font-size: 18px;
  line-height: var(--lh-loose);
}
.grid-2 { display: grid; gap: var(--sp-7); }
.grid-3 { display: grid; gap: var(--sp-5); }
.grid-4 { display: grid; gap: var(--sp-5); }
@media (min-width: 720px) {
  .grid-2 { grid-template-columns: repeat(2, 1fr); gap: var(--sp-9); }
  .grid-3 { grid-template-columns: repeat(2, 1fr); gap: var(--sp-6) var(--sp-7); }
  .grid-4 { grid-template-columns: repeat(2, 1fr); gap: var(--sp-6) var(--sp-7); }
}
@media (min-width: 980px) {
  .grid-3 { grid-template-columns: repeat(3, 1fr); gap: var(--sp-7) var(--sp-7); }
  .grid-4 { grid-template-columns: repeat(4, 1fr); gap: var(--sp-6) var(--sp-6); }
}

/* Grid specifico per i 3 pilastri:
   subgrid sulle righe → tag / title / body / example / link allineati su tutte le colonne */
.grid-pillars {
  display: grid;
  gap: var(--sp-1);
}
@media (min-width: 980px) {
  .grid-pillars {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: auto auto 1fr auto auto;
    gap: 0 var(--sp-7);
  }
  .grid-pillars > .pillar {
    grid-row: span 5;
    grid-template-rows: subgrid;
    display: grid;
    align-content: start;
    gap: var(--sp-4);
    height: auto;
  }
}

/* Editorial grid 12-col */
.eg {
  display: grid;
  gap: var(--sp-6);
  grid-template-columns: repeat(12, 1fr);
}
.eg__half { grid-column: span 12; }
.eg__third { grid-column: span 12; }
.eg__twothird { grid-column: span 12; }
.eg__quarter { grid-column: span 6; }
.eg__threequarter { grid-column: span 12; }
@media (min-width: 720px) {
  .eg__half { grid-column: span 6; }
  .eg__third { grid-column: span 4; }
  .eg__twothird { grid-column: span 8; }
  .eg__quarter { grid-column: span 3; }
  .eg__threequarter { grid-column: span 9; }
}

/* -------- EDITORIAL CARD (insight tile) -------- */
.ecard {
  background: transparent;
  border-top: 1px solid var(--color-line);
  padding: var(--sp-7) 0;
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
  transition: opacity var(--dur-base) var(--ease-out);
}
.section-dark .ecard { border-top-color: var(--color-dark-line); }
.ecard__num {
  font-family: var(--font-mono);
  font-size: var(--fs-caption);
  color: var(--color-brand-deep);
  font-weight: var(--fw-medium);
  letter-spacing: var(--ls-overline);
}
.section-dark .ecard__num { color: var(--color-brand); }
.ecard__title {
  font-family: var(--font-display);
  font-size: var(--fs-h3);
  font-weight: var(--fw-regular);
  line-height: var(--lh-snug);
  letter-spacing: var(--ls-heading);
  color: var(--color-ink);
}
.section-dark .ecard__title { color: var(--color-paper); }
.ecard__body { color: var(--color-ink-3); font-size: var(--fs-body); line-height: var(--lh-loose); }
.section-dark .ecard__body { color: var(--color-dark-mute); }

/* Pillar (manifesto pilastri) — editorial style, allineamento garantito */
.pillar {
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
  padding: var(--sp-8) 0 0;
  border-top: 1px solid var(--color-dark-line);
  position: relative;
  height: 100%;
}
.pillar__tag {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-3);
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  color: var(--color-brand);
  letter-spacing: var(--ls-overline);
  text-transform: uppercase;
  font-weight: var(--fw-medium);
}
.pillar__tag::before {
  content: '';
  width: 20px;
  height: 1px;
  background: var(--color-brand);
}
.pillar__title {
  font-family: var(--font-display);
  font-size: var(--fs-h2);
  font-weight: var(--fw-regular);
  letter-spacing: var(--ls-heading);
  color: var(--color-paper);
  line-height: var(--lh-tight);
}
.pillar__body {
  color: var(--color-dark-mute);
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  flex: 1 1 auto;
  margin-bottom: var(--sp-4);
}
.pillar__example {
  font-size: var(--fs-caption);
  color: var(--color-mute);
  font-style: italic;
  padding-top: var(--sp-4);
  border-top: 1px solid var(--color-dark-line);
  margin-top: 0;
  line-height: var(--lh-loose);
}
.pillar__link {
  color: var(--color-brand);
  font-weight: var(--fw-medium);
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  margin-top: var(--sp-5);
  padding-bottom: 1px;
  border-bottom: 1px solid transparent;
  align-self: flex-start;
  font-size: var(--fs-body-s);
}
.pillar__link:hover { border-bottom-color: var(--color-brand); }
.pillar__link .arrow { transition: transform var(--dur-fast) var(--ease-out); }
.pillar__link:hover .arrow { transform: translateX(3px); }

/* -------- STAT · editorial number showcase -------- */
.stat {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
  padding: var(--sp-7) 0;
  border-top: 1px solid var(--color-dark-line);
}
.section-paper .stat,
.section-white .stat { border-top-color: var(--color-line); }
.stat__value {
  font-family: var(--font-display);
  font-size: clamp(3.5rem, 5vw, 5rem);
  line-height: 0.95;
  font-weight: var(--fw-regular);
  letter-spacing: var(--ls-display);
  color: var(--color-paper);
}
.section-paper .stat__value,
.section-white .stat__value { color: var(--color-ink); }
.stat__value sup { font-size: 0.4em; vertical-align: super; line-height: 1; color: var(--color-brand); margin-left: 4px; font-weight: var(--fw-regular); }
.stat__label {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  color: var(--color-dark-mute);
  text-transform: uppercase;
  letter-spacing: var(--ls-overline);
  font-weight: var(--fw-medium);
}
.section-paper .stat__label,
.section-white .stat__label { color: var(--color-mute); }

/* KV row · numeri e fatti */
.kv-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  margin-top: var(--sp-9);
}
@media (min-width: 720px) { .kv-row { grid-template-columns: repeat(4, 1fr); } }
.kv-row__cell {
  padding: var(--sp-7) var(--sp-5) var(--sp-7) 0;
  border-top: 1px solid var(--color-dark-line);
}
.section-paper .kv-row__cell,
.section-white .kv-row__cell { border-top-color: var(--color-line); }
@media (min-width: 720px) {
  .kv-row__cell + .kv-row__cell { padding-left: var(--sp-5); }
}

/* -------- DIM CARD (capability 6-area grid) -------- */
.dim-card {
  background: transparent;
  border-top: 1px solid var(--color-dark-line);
  padding: var(--sp-7) 0;
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
}
.section-paper .dim-card,
.section-white .dim-card { border-top-color: var(--color-line); }
.dim-card__num {
  font-family: var(--font-mono);
  font-size: var(--fs-caption);
  color: var(--color-brand);
  font-weight: var(--fw-medium);
  letter-spacing: var(--ls-overline);
}
.section-paper .dim-card__num,
.section-white .dim-card__num { color: var(--color-brand-deep); }
.dim-card__title {
  font-family: var(--font-display);
  font-size: var(--fs-h3);
  font-weight: var(--fw-regular);
  letter-spacing: var(--ls-heading);
  color: var(--color-paper);
  line-height: var(--lh-snug);
  margin-top: var(--sp-2);
}
.section-paper .dim-card__title,
.section-white .dim-card__title { color: var(--color-ink); }
.dim-card__body {
  color: var(--color-dark-mute);
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  margin-top: var(--sp-2);
}
.section-paper .dim-card__body,
.section-white .dim-card__body { color: var(--color-ink-3); }

/* -------- COMPARISON LIST -------- */
.comparison {
  display: flex;
  flex-direction: column;
  margin-top: var(--sp-8);
}
.comparison__item {
  padding: var(--sp-8) 0;
  border-top: 1px solid var(--color-dark-line);
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sp-4);
}
.section-paper .comparison__item,
.section-white .comparison__item { border-top-color: var(--color-line); }
@media (min-width: 880px) {
  .comparison__item { grid-template-columns: 1fr 2fr; gap: var(--sp-9); }
}
.comparison__item:last-child { border-bottom: 1px solid var(--color-dark-line); }
.section-paper .comparison__item:last-child,
.section-white .comparison__item:last-child { border-bottom-color: var(--color-line); }
.comparison__title {
  font-family: var(--font-display);
  font-size: var(--fs-h3);
  font-weight: var(--fw-regular);
  color: var(--color-paper);
  letter-spacing: var(--ls-heading);
  line-height: var(--lh-snug);
}
.section-paper .comparison__title,
.section-white .comparison__title { color: var(--color-ink); }
.comparison__body { color: var(--color-dark-mute); font-size: var(--fs-body); line-height: var(--lh-loose); }
.section-paper .comparison__body,
.section-white .comparison__body { color: var(--color-ink-3); }

/* -------- PROCESS · editorial vertical -------- */
.process {
  display: flex;
  flex-direction: column;
  counter-reset: step;
  margin-top: var(--sp-8);
}
.process__item {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: var(--sp-5);
  padding: var(--sp-7) 0;
  border-top: 1px solid var(--color-line);
  counter-increment: step;
}
.section-dark .process__item { border-top-color: var(--color-dark-line); }
.process__item:last-child { border-bottom: 1px solid var(--color-line); }
.section-dark .process__item:last-child { border-bottom-color: var(--color-dark-line); }
.process__num {
  font-family: var(--font-display);
  font-size: var(--fs-h2);
  font-weight: var(--fw-regular);
  color: var(--color-brand-deep);
  line-height: 1;
  font-style: italic;
}
.section-dark .process__num { color: var(--color-brand); }
.process__num::before { content: counter(step, decimal-leading-zero); }
.process__body h3 {
  font-family: var(--font-display);
  font-size: var(--fs-h3);
  font-weight: var(--fw-regular);
  margin-bottom: var(--sp-3);
  letter-spacing: var(--ls-heading);
  color: var(--color-ink);
}
.section-dark .process__body h3 { color: var(--color-paper); }
.process__body p { font-size: var(--fs-body); line-height: var(--lh-loose); }

/* -------- TABLE editorial -------- */
.table {
  width: 100%;
  font-size: var(--fs-body);
  margin-top: var(--sp-6);
  border-top: 1px solid var(--color-line);
}
.section-dark .table { border-top-color: var(--color-dark-line); }
.table th, .table td {
  padding: var(--sp-5) var(--sp-5) var(--sp-5) 0;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--color-line);
}
.section-dark .table th, .section-dark .table td { border-bottom-color: var(--color-dark-line); }
.section-dark .table td { color: var(--color-dark-mute); }
.section-dark .table td:first-child,
.section-dark .table td strong { color: var(--color-paper); }
.table th {
  font-family: var(--font-mono);
  font-weight: var(--fw-medium);
  text-transform: uppercase;
  font-size: var(--fs-micro);
  letter-spacing: var(--ls-overline);
  color: var(--color-mute);
  padding-top: var(--sp-3);
  padding-bottom: var(--sp-3);
}
.section-dark .table th { color: var(--color-dark-mute); }
.table strong { color: var(--color-ink); }
.section-dark .table strong { color: var(--color-paper); }

/* -------- BIKMA LIGHT OFFER BOX -------- */
.offer-box {
  background: var(--color-paper);
  border: 1px solid var(--color-line);
  border-left: 3px solid var(--color-brand-deep);
  padding: var(--sp-9);
  position: relative;
}
.section-dark .offer-box {
  background: var(--color-dark-2);
  border-color: var(--color-dark-line);
  border-left-color: var(--color-brand);
}
.offer-box__head { display: flex; flex-direction: column; gap: var(--sp-4); margin-bottom: var(--sp-6); }
.offer-box__title {
  font-family: var(--font-display);
  font-size: var(--fs-h2);
  font-weight: var(--fw-regular);
  letter-spacing: var(--ls-heading);
  line-height: var(--lh-snug);
  color: var(--color-ink);
}
.section-dark .offer-box__title { color: var(--color-paper); }
.offer-box__list { display: block; margin: var(--sp-6) 0; padding: 0; list-style: none; }
.offer-box__list li {
  position: relative;
  padding: 0 0 0 24px;
  margin: 0 0 var(--sp-3);
  font-size: var(--fs-body);
  color: var(--color-ink-3);
  line-height: var(--lh-loose);
  list-style: none;
}
.offer-box__list li:last-child { margin-bottom: 0; }
.section-dark .offer-box__list li { color: var(--color-dark-mute); }
.offer-box__list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 14px;
  width: 12px;
  height: 1px;
  background: var(--color-brand-deep);
}
.section-dark .offer-box__list li::before { background: var(--color-brand); }
.offer-meta {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border-top: 1px solid var(--color-line);
  border-bottom: 1px solid var(--color-line);
  margin: var(--sp-6) 0;
}
.section-dark .offer-meta {
  border-top-color: var(--color-dark-line);
  border-bottom-color: var(--color-dark-line);
}
.offer-meta__cell {
  padding: var(--sp-5) var(--sp-3) var(--sp-5) 0;
  border-right: 1px solid var(--color-line);
}
.section-dark .offer-meta__cell { border-right-color: var(--color-dark-line); }
.offer-meta__cell:last-child { border-right: 0; padding-right: 0; }
.offer-meta__cell + .offer-meta__cell { padding-left: var(--sp-3); }
.offer-meta__label {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  letter-spacing: var(--ls-overline);
  text-transform: uppercase;
  color: var(--color-mute);
  display: block;
  margin-bottom: var(--sp-2);
  font-weight: var(--fw-medium);
}
.section-dark .offer-meta__label { color: var(--color-dark-mute); }
.offer-meta__value {
  font-family: var(--font-display);
  font-size: var(--fs-h3);
  font-weight: var(--fw-regular);
  color: var(--color-ink);
  font-style: italic;
  line-height: 1;
}
.section-dark .offer-meta__value { color: var(--color-paper); }

/* -------- CASE / PROOF cards -------- */
.case-card {
  background: var(--color-dark-2);
  border-top: 3px solid var(--color-brand);
  padding: var(--sp-7);
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
  transition: background var(--dur-base) var(--ease-out);
}
.case-card:hover { background: var(--color-dark-3); }
.case-card__sector {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  letter-spacing: var(--ls-overline);
  text-transform: uppercase;
  color: var(--color-brand);
  font-weight: var(--fw-medium);
}
.case-card__metric {
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: var(--fw-regular);
  color: var(--color-paper);
  letter-spacing: var(--ls-heading);
  line-height: var(--lh-tight);
}
.case-card__metric em { color: var(--color-brand); font-style: italic; }
.case-card__body { color: var(--color-dark-mute); font-size: var(--fs-body); line-height: var(--lh-loose); margin-top: var(--sp-3); }

/* -------- FEATURE-CARD (CTA secondaria) -------- */
.feature-card {
  background: var(--color-paper);
  border: 1px solid var(--color-line);
  padding: var(--sp-7);
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
  text-decoration: none;
  color: inherit;
  transition: all var(--dur-base) var(--ease-out);
}
.feature-card:hover {
  border-color: var(--color-ink);
  background: var(--color-white);
}
.section-dark .feature-card {
  background: var(--color-dark-2);
  border-color: var(--color-dark-line);
}
.section-dark .feature-card:hover {
  border-color: var(--color-brand);
}
.feature-card__icon { width: 32px; height: 32px; color: var(--color-brand-deep); }
.section-dark .feature-card__icon { color: var(--color-brand); }
.feature-card__title {
  font-family: var(--font-display);
  font-size: var(--fs-h4);
  font-weight: var(--fw-regular);
  letter-spacing: -0.01em;
  color: var(--color-ink);
}
.section-dark .feature-card__title { color: var(--color-paper); }
.feature-card__body {
  color: var(--color-ink-3);
  font-size: var(--fs-body-s);
  line-height: var(--lh-loose);
  flex: 1;
}
.section-dark .feature-card__body { color: var(--color-dark-mute); }
.feature-card__link {
  color: var(--color-brand-deep);
  font-weight: var(--fw-medium);
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  margin-top: auto;
}
.section-dark .feature-card__link { color: var(--color-brand); }

/* -------- FORM · editorial -------- */
.form {
  display: grid;
  gap: var(--sp-5);
  background: transparent;
  padding: 0;
}
.section-dark .form { background: transparent; }
.form__row { display: grid; gap: var(--sp-5); }
@media (min-width: 720px) { .form__row--2 { grid-template-columns: 1fr 1fr; } }
.form__field {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  border-bottom: 1px solid var(--color-line-2);
  padding-bottom: var(--sp-3);
}
.section-dark .form__field { border-bottom-color: var(--color-dark-line); }
.form__label {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--ls-overline);
  color: var(--color-mute);
  font-weight: var(--fw-medium);
}
.section-dark .form__label { color: var(--color-dark-mute); }
.form__input,
.form__textarea,
.form__select {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: var(--sp-2) 0;
  color: var(--color-ink);
  font-size: var(--fs-body);
  transition: none;
  width: 100%;
}
.section-dark .form__input,
.section-dark .form__textarea,
.section-dark .form__select { color: var(--color-paper); }
.form__input:focus,
.form__textarea:focus,
.form__select:focus {
  outline: none;
}
.form__field:focus-within { border-bottom-color: var(--color-brand-deep); }
.section-dark .form__field:focus-within { border-bottom-color: var(--color-brand); }
.form__input::placeholder, .form__textarea::placeholder { color: var(--color-mute-2); }
.form__textarea { resize: vertical; min-height: 100px; }
.form__actions { display: flex; flex-wrap: wrap; gap: var(--sp-4); align-items: center; margin-top: var(--sp-5); }
.form__reassurance {
  font-size: var(--fs-caption);
  color: var(--color-mute);
  line-height: var(--lh-loose);
  margin-top: var(--sp-3);
}
.section-dark .form__reassurance { color: var(--color-dark-mute); }

/* -------- SIDE BOX low-commitment -------- */
.side-box {
  background: var(--color-paper-2);
  border-left: 3px solid var(--color-brand-deep);
  padding: var(--sp-7);
  color: var(--color-ink-3);
}
.section-dark .side-box {
  background: rgba(60,188,0,0.06);
  border-left-color: var(--color-brand);
  color: var(--color-dark-mute);
}
.side-box__title {
  font-family: var(--font-display);
  font-size: var(--fs-h4);
  font-weight: var(--fw-regular);
  letter-spacing: -0.01em;
  margin-bottom: var(--sp-3);
  color: var(--color-ink);
}
.section-dark .side-box__title { color: var(--color-paper); }
.side-box__body { font-size: var(--fs-body-s); line-height: var(--lh-loose); margin-bottom: var(--sp-4); }
.side-box__link {
  font-weight: var(--fw-medium);
  color: var(--color-ink);
  border-bottom: 1px solid var(--color-ink);
  padding-bottom: 1px;
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
}
.section-dark .side-box__link {
  color: var(--color-paper) !important;
  border-bottom-color: var(--color-paper);
}
.side-box__link:hover {
  color: var(--color-brand-deep);
  border-bottom-color: var(--color-brand-deep);
}
.section-dark .side-box__link:hover {
  color: var(--color-brand) !important;
  border-bottom-color: var(--color-brand);
}

.cta-grid {
  display: grid;
  gap: var(--sp-9);
}
@media (min-width: 980px) {
  .cta-grid { grid-template-columns: 1.5fr 1fr; align-items: start; }
}

/* -------- LOGO WALL · editorial -------- */
.logo-wall {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0;
  margin-top: var(--sp-9);
  border-top: 1px solid var(--color-dark-line);
}
.section-paper .logo-wall,
.section-white .logo-wall { border-top-color: var(--color-line); }
@media (min-width: 560px) { .logo-wall { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 880px) { .logo-wall { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1100px) { .logo-wall { grid-template-columns: repeat(6, 1fr); } }
.logo-wall__cell {
  border-right: 1px solid var(--color-dark-line);
  border-bottom: 1px solid var(--color-dark-line);
  padding: var(--sp-7) var(--sp-4);
  display: grid;
  place-items: center;
  text-align: center;
  font-family: var(--font-display);
  font-size: var(--fs-body);
  font-weight: var(--fw-regular);
  color: var(--color-dark-mute);
  letter-spacing: -0.005em;
}
.section-paper .logo-wall__cell,
.section-white .logo-wall__cell {
  border-right-color: var(--color-line);
  border-bottom-color: var(--color-line);
  color: var(--color-ink-3);
}

/* === LOGO IMG: grayscale paper-first + hover restore === */
.logo-wall__cell {
  min-height: 96px;
  position: relative;
}
.logo-wall__img {
  display: block;
  max-width: 70%;
  max-height: 48px;
  width: auto;
  height: auto;
  object-fit: contain;
  filter: grayscale(100%);
  opacity: 0.65;
  transition: filter 0.25s ease, opacity 0.25s ease, transform 0.25s ease;
}
.logo-wall__cell:hover .logo-wall__img {
  filter: grayscale(0%);
  opacity: 1;
  transform: scale(1.05);
}
/* Su sfondo scuro inverti per visibilità */
.section-dark .logo-wall__img {
  filter: grayscale(100%) brightness(0) invert(1);
  opacity: 0.55;
}
.section-dark .logo-wall__cell:hover .logo-wall__img {
  opacity: 1;
}
/* Quando l'img esiste, nascondi il testo nome */
.logo-wall__cell .logo-wall__name {
  display: none;
}
/* Quando JS rileva img mancante mostra il testo come fallback */
.logo-wall__cell--text .logo-wall__name {
  display: block;
  font-family: var(--font-display);
  font-size: var(--fs-body);
  font-weight: var(--fw-regular);
  letter-spacing: -0.005em;
  color: inherit;
}
.logo-wall__cell--text .logo-wall__img {
  display: none;
}

/* -------- BREADCRUMB -------- */
.breadcrumb {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--ls-overline);
  color: var(--color-mute);
  margin-bottom: var(--sp-5);
  display: flex;
  align-items: center;
  gap: var(--sp-3);
}
.breadcrumb a { color: var(--color-mute); }
.breadcrumb a:hover { color: var(--color-brand-deep); }
.breadcrumb__sep { opacity: 0.4; }

/* -------- FOOTER · editorial -------- */
.site-footer {
  background: var(--color-dark);
  color: var(--color-dark-mute);
  padding: var(--sp-11) 0 var(--sp-6);
}
.site-footer__grid {
  display: grid;
  gap: var(--sp-8);
  grid-template-columns: 1fr;
}
@media (min-width: 720px) { .site-footer__grid { grid-template-columns: 1fr 1fr 1fr; } }
@media (min-width: 1080px) { .site-footer__grid { grid-template-columns: 1.6fr repeat(6, 1fr); } }
.site-footer h4 {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--ls-overline);
  color: var(--color-paper);
  margin-bottom: var(--sp-5);
  font-weight: var(--fw-medium);
}
.site-footer ul { display: flex; flex-direction: column; gap: var(--sp-3); list-style: none; padding: 0; margin: 0; }
.site-footer li { padding: 0; margin: 0; }
.site-footer a {
  font-size: var(--fs-body-s);
  color: var(--color-dark-mute);
  transition: color var(--dur-fast) var(--ease-out);
}
.site-footer a:hover { color: var(--color-brand); }
.site-footer__address {
  font-size: var(--fs-body-s);
  line-height: var(--lh-loose);
  color: var(--color-dark-mute);
  margin-bottom: var(--sp-3);
}
.site-footer__address strong {
  color: var(--color-paper);
  display: block;
  margin-bottom: var(--sp-1);
  font-family: var(--font-display);
  font-size: var(--fs-h4);
  font-weight: var(--fw-regular);
}
.site-footer__sedi {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sp-7);
  margin-top: var(--sp-9);
  padding-top: var(--sp-7);
  border-top: 1px solid var(--color-dark-line);
}
@media (min-width: 720px) { .site-footer__sedi { grid-template-columns: repeat(3, 1fr); } }
.site-footer__funding {
  margin-top: var(--sp-7);
  padding-top: var(--sp-6);
  border-top: 1px solid var(--color-dark-line);
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
}
.site-footer__funding-label {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--ls-overline);
  color: var(--color-mute-2);
}
.site-footer__funding-links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2) var(--sp-5);
  font-size: var(--fs-caption);
}
.site-footer__funding-links a {
  color: var(--color-dark-mute);
  border-bottom: 1px dotted var(--color-dark-line);
  padding-bottom: 1px;
}
.site-footer__bottom {
  margin-top: var(--sp-7);
  padding-top: var(--sp-6);
  border-top: 1px solid var(--color-dark-line);
  font-size: var(--fs-caption);
  color: var(--color-mute);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: var(--sp-3);
}
.site-footer__legal {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2) var(--sp-4);
  align-items: center;
}

/* -------- UTILITY -------- */
.text-center { text-align: center; }
.text-brand { color: var(--color-brand-deep); }
.section-dark .text-brand { color: var(--color-brand); }
.text-mute { color: var(--color-mute); }
.section-dark .text-mute { color: var(--color-dark-mute); }
.text-italic { font-style: italic; }
.mt-2 { margin-top: var(--sp-2); }
.mt-3 { margin-top: var(--sp-3); }
.mt-4 { margin-top: var(--sp-4); }
.mt-5 { margin-top: var(--sp-5); }
.mt-6 { margin-top: var(--sp-6); }
.mt-7 { margin-top: var(--sp-7); }
.mt-8 { margin-top: var(--sp-8); }
.mt-9 { margin-top: var(--sp-9); }
.mb-3 { margin-bottom: var(--sp-3); }
.mb-4 { margin-bottom: var(--sp-4); }
.mb-5 { margin-bottom: var(--sp-5); }
.mb-6 { margin-bottom: var(--sp-6); }
.gap-3 { gap: var(--sp-3); }
.gap-5 { gap: var(--sp-5); }
.gap-7 { gap: var(--sp-7); }
.flex { display: flex; }
.flex-wrap { flex-wrap: wrap; }
.items-center { align-items: center; }
.items-start { align-items: flex-start; }
.justify-between { justify-content: space-between; }
.full { grid-column: 1 / -1; }

/* -------- ANIMATIONS -------- */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
.fade-up { animation: fadeUp var(--dur-slow) var(--ease-out) both; }
.fade-up.d1 { animation-delay: 80ms; }
.fade-up.d2 { animation-delay: 160ms; }
.fade-up.d3 { animation-delay: 240ms; }

/* Scroll-triggered reveal */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 700ms cubic-bezier(.2,.8,.2,1), transform 700ms cubic-bezier(.2,.8,.2,1);
}
.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.reveal.d1 { transition-delay: 80ms; }
.reveal.d2 { transition-delay: 160ms; }
.reveal.d3 { transition-delay: 240ms; }
.reveal.d4 { transition-delay: 320ms; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
}

/* -------- DARK + LIGHT FALLBACK helpers ------- */
.section-dark .h4 { color: var(--color-paper); }
.section-dark hr { border-color: var(--color-dark-line); }

/* =========================================================================
   CONSULTANCY ELEVATION · top martech components
   ========================================================================= */

/* -------- CHAPTER · numerazione di capitolo stile rivista -------- */
.chapter {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sp-5);
  padding-bottom: var(--sp-8);
  margin-bottom: var(--sp-9);
  border-bottom: 1px solid var(--color-dark-line);
}
.section-paper .chapter,
.section-white .chapter { border-bottom-color: var(--color-line); }
@media (min-width: 880px) {
  .chapter {
    grid-template-columns: 200px 1fr;
    gap: var(--sp-9);
    align-items: start;
  }
}
.chapter__num {
  font-family: var(--font-display);
  font-size: clamp(4rem, 7vw, 6rem);
  font-weight: var(--fw-regular);
  font-style: italic;
  color: var(--color-brand);
  line-height: 0.85;
  letter-spacing: -0.03em;
}
.chapter__body {
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
  max-width: 720px;
}
.chapter__overline {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--ls-overline);
  font-weight: var(--fw-medium);
  color: var(--color-brand);
}
.chapter__title {
  font-family: var(--font-display);
  font-size: var(--fs-h1);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-display);
  font-weight: var(--fw-regular);
  color: var(--color-paper);
}
.section-paper .chapter__title,
.section-white .chapter__title { color: var(--color-ink); }
.chapter__title em { font-style: italic; color: var(--color-brand); }
.chapter__intro {
  font-size: var(--fs-body-l);
  line-height: var(--lh-loose);
  color: var(--color-dark-mute);
  max-width: 60ch;
  margin-top: var(--sp-3);
}
.section-paper .chapter__intro,
.section-white .chapter__intro { color: var(--color-ink-3); }
.chapter__intro strong { color: var(--color-paper); }
.section-paper .chapter__intro strong,
.section-white .chapter__intro strong { color: var(--color-ink); }

/* -------- STAT STRIP · 4 KPI orizzontali, editorial scale -------- */
.stat-strip {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  border-top: 1px solid var(--color-line);
  border-bottom: 1px solid var(--color-line);
}
.section-dark .stat-strip {
  border-top-color: var(--color-dark-line);
  border-bottom-color: var(--color-dark-line);
}
@media (min-width: 720px) {
  .stat-strip { grid-template-columns: repeat(4, 1fr); }
}
.stat-strip__item {
  padding: var(--sp-7) var(--sp-5) var(--sp-7) 0;
  border-bottom: 1px solid var(--color-line);
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
}
.section-dark .stat-strip__item { border-bottom-color: var(--color-dark-line); }
@media (min-width: 720px) {
  .stat-strip__item {
    border-bottom: 0;
    border-right: 1px solid var(--color-line);
    padding-left: var(--sp-5);
  }
  .section-dark .stat-strip__item { border-right-color: var(--color-dark-line); }
  .stat-strip__item:first-child { padding-left: 0; }
  .stat-strip__item:last-child { border-right: 0; }
}
.stat-strip__item:last-child { border-bottom: 0; }
.stat-strip__value {
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(2.5rem, 4vw, 3.75rem);
  font-weight: var(--fw-regular);
  color: var(--color-ink);
  line-height: 1;
  letter-spacing: -0.025em;
}
.section-dark .stat-strip__value { color: var(--color-paper); }
.stat-strip__value sup {
  font-size: 0.4em;
  vertical-align: super;
  color: var(--color-brand);
  font-style: normal;
  line-height: 1;
  margin-left: 2px;
}
.stat-strip__label {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--ls-overline);
  color: var(--color-mute);
  font-weight: var(--fw-medium);
}
.section-dark .stat-strip__label { color: var(--color-dark-mute); }
.stat-strip__note {
  font-size: var(--fs-caption);
  color: var(--color-mute);
  line-height: var(--lh-loose);
  margin-top: auto;
  padding-top: var(--sp-2);
}
.section-dark .stat-strip__note { color: var(--color-dark-mute); }

/* -------- PULL QUOTE · citazione editoriale -------- */
.pull-quote {
  padding: var(--sp-8) 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sp-4);
  position: relative;
}
@media (min-width: 880px) {
  .pull-quote {
    grid-template-columns: 80px 1fr;
    gap: var(--sp-7);
  }
}
.pull-quote__mark {
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(5rem, 8vw, 7rem);
  color: var(--color-brand);
  line-height: 0.7;
  font-weight: var(--fw-regular);
  user-select: none;
}
.pull-quote__body {
  display: flex;
  flex-direction: column;
  gap: var(--sp-5);
}
.pull-quote__text {
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 2vw + 1rem, 2.25rem);
  font-style: italic;
  font-weight: var(--fw-regular);
  line-height: var(--lh-snug);
  color: var(--color-paper);
  letter-spacing: -0.015em;
  max-width: 28ch;
}
.section-paper .pull-quote__text,
.section-white .pull-quote__text { color: var(--color-ink); }
.pull-quote__cite {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--ls-overline);
  color: var(--color-dark-mute);
  font-weight: var(--fw-medium);
  display: inline-flex;
  align-items: center;
  gap: var(--sp-3);
}
.section-paper .pull-quote__cite,
.section-white .pull-quote__cite { color: var(--color-mute); }
.pull-quote__cite::before {
  content: '';
  width: 28px;
  height: 1px;
  background: var(--color-brand);
}

/* -------- LOGO MARQUEE · scroll infinito, mask edges -------- */
.logo-marquee {
  position: relative;
  overflow: hidden;
  padding: var(--sp-7) 0;
  border-top: 1px solid var(--color-line);
  border-bottom: 1px solid var(--color-line);
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 80px, #000 calc(100% - 80px), transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 80px, #000 calc(100% - 80px), transparent 100%);
}
.section-dark .logo-marquee {
  border-top-color: var(--color-dark-line);
  border-bottom-color: var(--color-dark-line);
}
.logo-marquee__track {
  display: flex;
  gap: var(--sp-9);
  align-items: center;
  animation: marquee 56s linear infinite;
  width: max-content;
}
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.logo-marquee__item {
  font-family: var(--font-display);
  font-size: clamp(1.25rem, 1.6vw + 1rem, 1.75rem);
  font-style: italic;
  font-weight: var(--fw-regular);
  color: var(--color-ink-3);
  white-space: nowrap;
  letter-spacing: -0.01em;
  flex-shrink: 0;
}
.section-dark .logo-marquee__item { color: var(--color-dark-mute); }
.logo-marquee__sep {
  font-family: var(--font-mono);
  color: var(--color-brand);
  font-size: 0.9rem;
  flex-shrink: 0;
  user-select: none;
}
@media (prefers-reduced-motion: reduce) {
  .logo-marquee__track { animation: none; }
}

/* -------- FEATURE-ITEM · case proof editoriale -------- */
.feature-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sp-7);
}
@media (min-width: 720px) {
  .feature-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 980px) {
  .feature-grid { grid-template-columns: repeat(3, 1fr); gap: var(--sp-6); }
}
.feature-item {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
  border-top: 2px solid var(--color-brand);
  padding-top: var(--sp-5);
  background: transparent;
}
.feature-item__sector {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--ls-overline);
  color: var(--color-brand);
  font-weight: var(--fw-medium);
}
.feature-item__metric {
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(2.5rem, 3.5vw + 1rem, 3.5rem);
  font-weight: var(--fw-regular);
  color: var(--color-paper);
  line-height: 1;
  letter-spacing: -0.025em;
  margin: var(--sp-2) 0;
}
.section-paper .feature-item__metric,
.section-white .feature-item__metric { color: var(--color-ink); }
.feature-item__metric sup {
  font-size: 0.45em;
  vertical-align: super;
  color: var(--color-brand);
  font-style: normal;
  margin-left: 2px;
}
.feature-item__title {
  font-family: var(--font-display);
  font-size: var(--fs-h3);
  font-weight: var(--fw-regular);
  line-height: var(--lh-snug);
  letter-spacing: var(--ls-heading);
  color: var(--color-paper);
  margin-top: var(--sp-2);
}
.section-paper .feature-item__title,
.section-white .feature-item__title { color: var(--color-ink); }
.feature-item__body {
  color: var(--color-dark-mute);
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  flex: 1;
}
.section-paper .feature-item__body,
.section-white .feature-item__body { color: var(--color-ink-3); }
.feature-item__link {
  margin-top: var(--sp-3);
  font-family: var(--font-sans);
  font-size: var(--fs-body-s);
  font-weight: var(--fw-medium);
  color: var(--color-brand);
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  border-bottom: 1px solid transparent;
  padding-bottom: 2px;
  align-self: flex-start;
  transition: border-color var(--dur-fast) var(--ease-out);
}
.feature-item__link:hover { border-bottom-color: var(--color-brand); }

/* -------- DROP CAP · capolettera editoriale opzionale -------- */
.dropcap::first-letter {
  font-family: var(--font-display);
  font-size: 4.5em;
  font-weight: var(--fw-regular);
  float: left;
  line-height: 0.85;
  margin: 0.05em 0.12em 0 0;
  color: var(--color-brand);
  font-style: italic;
}


.page[hidden] { display: none !important; }

/* =========================================================================
   FORTOP 2026 · OVERRIDE PARENT THEME AGENXE
   Neutralizza regole estetiche del parent che entrerebbero in conflitto
   col design system paper-first. Specificità minima per non sovra-bloccare.
   ========================================================================= */

/* Reset font del parent: Agenxe forza Helvetica Now Display ovunque */
html body,
html body input[type="text"],
html body p,
html body ul,
html body li,
html body ol,
html body label,
html body a,
html body .h1, html body h1,
html body .h2, html body h2,
html body .h3, html body h3,
html body .h4, html body h4,
html body .h5, html body h5,
html body .h6, html body h6 {
  font-family: var(--font-sans);
}

html body .h1, html body h1,
html body .h2, html body h2,
html body .h3, html body h3 {
  font-family: var(--font-display);
}

/* Reset scroll-snap del vecchio child theme */
html, html.ft-scroll-snap {
  scroll-snap-type: none;
  scroll-behavior: smooth;
}

/* Disabilita .box-hp se ancora presente da Elementor legacy */
.box-hp { height: auto; padding: 0; scroll-snap-align: none; }

/* Neutralizza il vecchio menu mobile Agenxe (offcanvas .th-menu-wrapper) */
.th-menu-wrapper,
.th-menu-toggle,
.th-mobile-menu { display: none !important; }

/* Body lock di Agenxe → preferiamo body.menu-open */
.body-lock { position: static !important; top: auto !important; }

/* Sito eredita paper-first */
body, html { background: var(--color-paper); color: var(--color-ink-3); }

/* Breadcrumb Agenxe → estetica editorial mono */
body .breadcumb-wrapper, body .breadcrumb-wrapper {
  background: var(--color-paper);
  padding: var(--sp-6) 0;
  border-bottom: 1px solid var(--color-line);
}
body .breadcumb-wrapper .breadcumb-title { display: none; }
body .breadcumb-wrapper ul,
body .breadcumb-wrapper ol {
  display: flex;
  gap: var(--sp-3);
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--ls-overline);
  color: var(--color-mute);
  list-style: none;
  padding: 0;
  margin: 0;
}
body .breadcumb-wrapper a { color: var(--color-mute); }
body .breadcumb-wrapper a:hover { color: var(--color-brand-deep); }

/* =========================================================================
   FORTOP 2026 · ARTICLE TEMPLATE
   Pattern HTML semantico → styling automatico (no class redazionali)
   ========================================================================= */

.fortop-article {
  padding: var(--sp-9) 0 var(--sp-11);
  background: var(--color-paper);
}
.fortop-article__container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--sp-6);
}

/* Layout body articolo: usa tutta la larghezza del container (1280px) */
.fortop-article__body > * {
  max-width: 100%;
}

/* Opt-in: classe .narrow per limitare un singolo blocco a 720ch per leggibilità */
.fortop-article__body > .narrow {
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}

/* Author box */
.fortop-author {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
  margin: 0 0 var(--sp-8) 0;
  padding-bottom: var(--sp-6);
  border-bottom: 1px solid var(--color-line);
}
.fortop-author__avatar {
  width: 56px;
  height: 56px;
  border-radius: var(--radius-full);
  object-fit: cover;
  border: 1px solid var(--color-line);
  flex-shrink: 0;
}
.fortop-author__info { display: flex; flex-direction: column; gap: var(--sp-1); }
.fortop-author__label {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--ls-overline);
  color: var(--color-mute);
}
.fortop-author__name {
  font-family: var(--font-display);
  font-size: var(--fs-h4);
  font-weight: var(--fw-regular);
  color: var(--color-ink);
  letter-spacing: -0.005em;
  text-decoration: none;
}
.fortop-author__name:hover { color: var(--color-brand-deep); }
.fortop-author__reading-time {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--ls-overline);
  color: var(--color-mute);
}

/* Article content — tags semantici */
.fortop-article__body {
  font-family: var(--font-sans);
  font-size: var(--fs-body-l);
  line-height: var(--lh-loose);
  color: var(--color-ink-3);
}

/* Etichetta categoria → <small> overline */
.fortop-article__body small {
  display: block;
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  font-weight: var(--fw-medium);
  text-transform: uppercase;
  letter-spacing: var(--ls-overline);
  color: var(--color-brand-deep);
  margin-bottom: var(--sp-5);
}

/* H1 → display serif */
.fortop-article__body h1 {
  font-family: var(--font-display);
  font-size: var(--fs-h1);
  font-weight: var(--fw-regular);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-display);
  color: var(--color-ink);
  margin: 0 0 var(--sp-6) 0;
}
.fortop-article__body h1 em,
.fortop-article__body h1 span {
  font-style: italic;
  color: var(--color-brand-deep);
  font-weight: var(--fw-regular);
}

/* H2 */
.fortop-article__body h2 {
  font-family: var(--font-display);
  font-size: var(--fs-h2);
  font-weight: var(--fw-regular);
  line-height: var(--lh-snug);
  letter-spacing: var(--ls-heading);
  color: var(--color-ink);
  margin: var(--sp-9) 0 var(--sp-5);
}
.fortop-article__body h2 em,
.fortop-article__body h2 span {
  font-style: italic;
  color: var(--color-brand-deep);
}

/* H3 */
.fortop-article__body h3 {
  font-family: var(--font-display);
  font-size: var(--fs-h3);
  font-weight: var(--fw-regular);
  line-height: var(--lh-snug);
  letter-spacing: var(--ls-heading);
  color: var(--color-ink);
  margin: var(--sp-7) 0 var(--sp-4);
}
.fortop-article__body h3 em { font-style: italic; color: var(--color-brand-deep); }

/* H4 → sans semibold, ink */
.fortop-article__body h4 {
  font-family: var(--font-sans);
  font-size: var(--fs-h4);
  font-weight: var(--fw-semibold);
  line-height: var(--lh-snug);
  color: var(--color-ink);
  margin: var(--sp-6) 0 var(--sp-3);
  letter-spacing: -0.005em;
}

/* Paragrafi */
.fortop-article__body p {
  font-size: var(--fs-body-l);
  line-height: var(--lh-loose);
  color: var(--color-ink-3);
  margin: 0 0 var(--sp-5) 0;
}

/* h4 + p come key-point */
.fortop-article__body h4 + p {
  border-left: 2px solid var(--color-brand);
  padding-left: var(--sp-5);
  margin-bottom: var(--sp-7);
}

/* Link */
.fortop-article__body a {
  color: var(--color-brand-deep);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color var(--dur-fast) var(--ease-out);
}
.fortop-article__body a:hover { color: var(--color-ink); }

/* Strong / em */
.fortop-article__body strong { color: var(--color-ink); font-weight: var(--fw-semibold); }
.fortop-article__body em { font-style: italic; }

/* HR → divider sobrio */
.fortop-article__body hr {
  border: none;
  height: 1px;
  background: var(--color-line);
  margin: var(--sp-9) 0;
}

/* Tabelle editorial */
.fortop-article__body table {
  width: 100%;
  border-collapse: collapse;
  margin: var(--sp-7) 0;
  font-size: var(--fs-body-s);
}
.fortop-article__body thead tr { border-bottom: 1px solid var(--color-ink); }
.fortop-article__body th {
  text-align: left;
  padding: var(--sp-4);
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  font-weight: var(--fw-medium);
  text-transform: uppercase;
  letter-spacing: var(--ls-overline);
  color: var(--color-ink);
  background: transparent;
  border: none;
}
.fortop-article__body td {
  padding: var(--sp-4);
  border-bottom: 1px solid var(--color-line);
  vertical-align: top;
  color: var(--color-ink-3);
  background: transparent;
}
.fortop-article__body td:first-child {
  font-weight: var(--fw-medium);
  color: var(--color-ink);
}

/* Blockquote → callout serif italic
 * Override ASSOLUTO sul tema padre (agenxe-child applicava sfondo nero + colore turchese illeggibile).
 * Anche fuori dal contesto articolo (es. su .fortop-page) lo stile è coerente. */
.fortop-article__body blockquote,
.fortop-page blockquote,
.entry-content blockquote,
blockquote {
  display: block !important;
  background: transparent !important;
  border-left: 3px solid var(--color-brand) !important;
  border-radius: 0 !important;
  padding: var(--sp-3) 0 var(--sp-3) var(--sp-6) !important;
  margin: var(--sp-7) 0 !important;
  font-family: var(--font-display) !important;
  font-style: italic !important;
  font-size: var(--fs-h3) !important;
  line-height: var(--lh-snug) !important;
  color: var(--color-ink) !important;
  letter-spacing: -0.005em;
  position: relative;
}
.fortop-article__body blockquote p,
.fortop-page blockquote p,
.entry-content blockquote p,
blockquote p {
  margin: 0 !important;
  font-family: inherit !important;
  font-size: inherit !important;
  color: inherit !important;
  max-width: none !important;
  font-style: italic !important;
}
.fortop-article__body blockquote cite,
.fortop-page blockquote cite,
.entry-content blockquote cite,
blockquote cite {
  display: block !important;
  margin-top: var(--sp-4) !important;
  font-family: var(--font-mono) !important;
  font-style: normal !important;
  font-size: var(--fs-micro) !important;
  text-transform: uppercase !important;
  letter-spacing: var(--ls-overline) !important;
  color: var(--color-mute) !important;
}
/* Sezioni scure: testo chiaro */
.section-dark blockquote,
.section-dark .fortop-article__body blockquote {
  color: var(--color-paper) !important;
}
.section-dark blockquote cite {
  color: var(--color-dark-mute) !important;
}
/* Rimuovi eventuali pseudo-elementi "virgolette" iniettati dal tema padre con colore non leggibile */
.fortop-article__body blockquote::before,
.fortop-page blockquote::before,
.entry-content blockquote::before,
blockquote::before,
.fortop-article__body blockquote::after,
.fortop-page blockquote::after,
.entry-content blockquote::after,
blockquote::after {
  content: none !important;
  display: none !important;
}

/* Liste */
.fortop-article__body ul,
.fortop-article__body ol {
  list-style: none;
  padding: 0;
  margin: var(--sp-5) 0 var(--sp-7);
}
.fortop-article__body ul li,
.fortop-article__body ol li {
  position: relative;
  padding-left: var(--sp-5);
  margin-bottom: var(--sp-4);
  font-size: var(--fs-body-l);
  line-height: var(--lh-loose);
  color: var(--color-ink-3);
}
.fortop-article__body ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.85em;
  width: 8px;
  height: 1px;
  background: var(--color-brand);
}
.fortop-article__body ol { counter-reset: fortop-ol; }
.fortop-article__body ol li {
  counter-increment: fortop-ol;
}
.fortop-article__body ol li::before {
  content: counter(fortop-ol, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: 0;
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  letter-spacing: var(--ls-overline);
  color: var(--color-brand-deep);
}
.fortop-article__body li strong {
  display: inline;
  color: var(--color-ink);
  font-weight: var(--fw-semibold);
}

/* Section dark inline (opt-in nell'articolo) */
.fortop-article__body section {
  margin: var(--sp-2) calc(var(--sp-1) * -1);
  padding: var(--sp-2) var(--sp-1);
}
/*
.fortop-article__body section.dark,
.fortop-article__body section:nth-of-type(even) {
  background: var(--color-dark);
  color: var(--color-paper);
}*/
.fortop-article__body section.dark p,
/*.fortop-article__body section:nth-of-type(even) p { color: var(--color-dark-mute); }*/
.fortop-article__body section.dark h2,
.fortop-article__body section.dark h3,
.fortop-article__body section:nth-of-type(even) h2,
/*.fortop-article__body section:nth-of-type(even) h3 { color: var(--color-paper); }*/
.fortop-article__body section.dark h2 em,
.fortop-article__body section.dark h3 em,
/*.fortop-article__body section:nth-of-type(even) h2 em,
.fortop-article__body section:nth-of-type(even) h3 em { color: var(--color-brand); }*/

/* Immagini articolo */
.fortop-article__body img,
.fortop-article__body figure { display: block; max-width: 100%; height: auto; margin: var(--sp-7) auto; }
.fortop-article__body figure figcaption {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  letter-spacing: var(--ls-overline);
  text-transform: uppercase;
  color: var(--color-mute);
  margin-top: var(--sp-3);
  text-align: center;
}

/* Responsive articolo */
@media (max-width: 720px) {
  .fortop-article__container { padding: 0 var(--sp-5); }
  .fortop-article__body { font-size: var(--fs-body); }
  .fortop-article__body section { margin-left: calc(var(--sp-5) * -1); margin-right: calc(var(--sp-5) * -1); padding: var(--sp-7) var(--sp-5); }
}

/* =========================================================================
   FORTOP 2026 · AUTHOR / EDITORIAL STAFF
   ========================================================================= */
.fortop-author-page { padding: var(--sp-10) 0; background: var(--color-paper); }
.fortop-author-card {
  max-width: var(--container-narrow);
  margin: 0 auto;
  padding: 0 var(--sp-6);
  display: grid;
  gap: var(--sp-6);
}
@media (min-width: 720px) { .fortop-author-card { grid-template-columns: 200px 1fr; } }
.fortop-author-card__avatar {
  width: 200px;
  height: 200px;
  border-radius: var(--radius-full);
  object-fit: cover;
  border: 1px solid var(--color-line);
}
.fortop-author-card__role {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--ls-overline);
  color: var(--color-brand-deep);
  margin-bottom: var(--sp-3);
}
.fortop-author-card__name {
  font-family: var(--font-display);
  font-size: var(--fs-h1);
  font-weight: var(--fw-regular);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-display);
  color: var(--color-ink);
  margin: 0 0 var(--sp-5);
}
.fortop-author-card__bio {
  font-size: var(--fs-body-l);
  line-height: var(--lh-loose);
  color: var(--color-ink-3);
  margin-bottom: var(--sp-5);
}
.fortop-author-card__social {
  display: flex;
  gap: var(--sp-4);
  flex-wrap: wrap;
}
.fortop-author-card__social a {
  font-family: var(--font-mono);
  font-size: var(--fs-caption);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-ink);
  padding: var(--sp-2) var(--sp-4);
  border: 1px solid var(--color-line-2);
  border-radius: var(--radius-sm);
  transition: all var(--dur-fast) var(--ease-out);
}
.fortop-author-card__social a:hover {
  color: var(--color-brand-deep);
  border-color: var(--color-brand-deep);
}

/* Lista articoli autore */
.fortop-author-posts {
  max-width: var(--container-max);
  margin: var(--sp-10) auto 0;
  padding: 0 var(--sp-6);
}
.fortop-author-posts__title {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--ls-overline);
  color: var(--color-brand-deep);
  margin-bottom: var(--sp-6);
}
.fortop-post-grid {
  display: grid;
  gap: var(--sp-6);
  grid-template-columns: 1fr;
}
@media (min-width: 720px) { .fortop-post-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1080px) { .fortop-post-grid { grid-template-columns: repeat(3, 1fr); } }
.fortop-post-card {
  background: var(--color-white);
  border: 1px solid var(--color-line);
  padding: var(--sp-6);
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
  transition: border-color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);
}
.fortop-post-card:hover { border-color: var(--color-brand-deep); transform: translateY(-2px); }
.fortop-post-card__cat {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--ls-overline);
  color: var(--color-brand-deep);
}
.fortop-post-card__title {
  font-family: var(--font-display);
  font-size: var(--fs-h4);
  font-weight: var(--fw-regular);
  line-height: var(--lh-snug);
  color: var(--color-ink);
  letter-spacing: -0.01em;
}
.fortop-post-card__title a { color: inherit; text-decoration: none; }
.fortop-post-card__title a:hover { color: var(--color-brand-deep); }
.fortop-post-card__meta {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  color: var(--color-mute);
  letter-spacing: 0.04em;
  margin-top: auto;
}

/* =========================================================================
   FORTOP 2026 · REGISTRAZIONE / FORM
   ========================================================================= */
.fortop-registration {
  background: var(--color-paper);
  padding: var(--sp-10) 0;
}
.fortop-registration__container {
  max-width: 560px;
  margin: 0 auto;
  padding: 0 var(--sp-6);
}
.fortop-registration__title {
  font-family: var(--font-display);
  font-size: var(--fs-h1);
  font-weight: var(--fw-regular);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-display);
  color: var(--color-ink);
  margin-bottom: var(--sp-3);
}
.fortop-registration__sub {
  font-size: var(--fs-body-l);
  line-height: var(--lh-loose);
  color: var(--color-ink-3);
  margin-bottom: var(--sp-8);
}
.fortop-form { display: flex; flex-direction: column; gap: var(--sp-5); }
.fortop-form label {
  display: block;
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--ls-overline);
  color: var(--color-ink);
  margin-bottom: var(--sp-2);
}
.fortop-form input[type="text"],
.fortop-form input[type="email"],
.fortop-form input[type="tel"],
.fortop-form input[type="password"],
.fortop-form textarea,
.fortop-form select {
  width: 100%;
  padding: var(--sp-4);
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  color: var(--color-ink);
  background: var(--color-white);
  border: 1px solid var(--color-line-2);
  border-radius: var(--radius-sm);
  transition: border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}
.fortop-form input:focus,
.fortop-form textarea:focus,
.fortop-form select:focus {
  outline: none;
  border-color: var(--color-brand-deep);
  box-shadow: 0 0 0 3px var(--color-brand-tint);
}
.fortop-form .form-row { display: grid; gap: var(--sp-5); }
@media (min-width: 720px) { .fortop-form .form-row--2 { grid-template-columns: 1fr 1fr; } }
.fortop-form__legal {
  font-size: var(--fs-caption);
  color: var(--color-mute);
  line-height: var(--lh-base);
}
.fortop-form__legal a { color: var(--color-brand-deep); text-decoration: underline; }



/* =========================================================================
   FORTOP 2026 · GRIGLIA ARTICOLI (shortcode [fortop_articles_grid])
   Card uniformi · immagine featured · clamp titolo 2 righe · excerpt 3 righe
   ========================================================================= */

/* ---- Filtri categoria (pillole) ---- */
.fortop-articles-filters {
	display: flex !important;
	flex-wrap: wrap;
	gap: var(--sp-2);
	margin-bottom: var(--sp-7);
}

.fortop-articles-filters__pill,
.fortop-articles-filters a.fortop-articles-filters__pill {
	display: inline-flex !important;
	align-items: center;
	padding: var(--sp-2) var(--sp-4);
	background: var(--color-white);
	border: 1px solid var(--color-line-2);
	border-radius: var(--radius-full);
	font-family: var(--font-sans);
	font-size: var(--fs-caption);
	font-weight: var(--fw-regular);
	letter-spacing: 0;
	text-transform: none;
	color: var(--color-ink) !important;
	text-decoration: none !important;
	line-height: 1;
	transition: all var(--dur-fast) var(--ease-out);
}

.fortop-articles-filters__pill:hover {
	border-color: var(--color-brand-deep);
	color: var(--color-brand-deep) !important;
}

.fortop-articles-filters__pill.is-active {
	background: var(--color-ink);
	color: var(--color-paper) !important;
	border-color: var(--color-ink);
}

.section-dark .fortop-articles-filters__pill {
	background: transparent;
	border-color: var(--color-dark-line);
	color: var(--color-dark-mute) !important;
}

.section-dark .fortop-articles-filters__pill.is-active {
	background: var(--color-brand);
	color: var(--color-ink) !important;
	border-color: var(--color-brand);
}

/* ---- Grid layout: 3 colonne, altezze uguali (no masonry) ---- */
.fortop-articles-grid {
	display: grid;
	gap: var(--sp-6);
	grid-template-columns: 1fr;
	align-items: stretch;
	margin-top: var(--sp-6);
}

@media (min-width: 720px) {
	.fortop-articles-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 1080px) {
	.fortop-articles-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

/* ---- Card singola: colonna flex per altezza uniforme ---- */
.fortop-acard {
	display: flex;
	flex-direction: column;
	height: 100%;
	min-height: 0;
	background: var(--color-white);
	border: 1px solid var(--color-line);
	border-radius: var(--radius-md);
	overflow: hidden;
	transition: border-color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}

.fortop-acard:hover {
	border-color: var(--color-ink-3);
	transform: translateY(-2px);
	box-shadow: var(--shadow-md);
}

/* ---- Immagine featured: aspect ratio fisso 16/9 ---- */
.fortop-acard__media {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: var(--color-paper-2);
	text-decoration: none !important;
}

.fortop-acard__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--dur-slow) var(--ease-out);
}

.fortop-acard:hover .fortop-acard__media img {
	transform: scale(1.04);
}

.fortop-acard__media-placeholder {
	display: block;
	width: 100%;
	height: 100%;
	background:
		linear-gradient(135deg, var(--color-paper-2) 0%, var(--color-line) 100%);
}

/* ---- Body card: flex column, padding, "Leggi" sempre in basso ---- */
.fortop-acard__body {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
	padding: var(--sp-5);
	gap: var(--sp-3);
}

/* ---- Meta (data · categoria) ---- */
.fortop-acard__meta {
	display: block;
	font-family: var(--font-mono);
	font-size: var(--fs-micro);
	font-weight: var(--fw-medium);
	text-transform: uppercase;
	letter-spacing: var(--ls-overline);
	color: var(--color-brand-deep);
}

/* ---- Titolo H3: nero, max 2 righe con ellipsis ---- */
.fortop-acard__title {
	font-family: var(--font-display);
	font-size: var(--fs-h4);
	font-weight: var(--fw-regular);
	line-height: 1.25;
	letter-spacing: -0.01em;
	color: var(--color-ink) !important;
	margin: 0;

	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	line-clamp: 2;
	overflow: hidden;
	text-overflow: ellipsis;

	/* Fallback per browser senza line-clamp */
	max-height: calc(1.25em * 2);
}

.fortop-acard__title a {
	color: var(--color-ink) !important;
	text-decoration: none !important;
	transition: color var(--dur-fast) var(--ease-out);
}

.fortop-acard:hover .fortop-acard__title a,
.fortop-acard__title a:hover {
	color: var(--color-brand-deep) !important;
}

/* ---- Excerpt: max 3 righe con ellipsis ---- */
.fortop-acard__excerpt {
	font-family: var(--font-sans);
	font-size: var(--fs-body-s);
	line-height: var(--lh-base);
	color: var(--color-ink-3);
	margin: 0;
	flex: 1 1 auto;

	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	line-clamp: 3;
	overflow: hidden;
	text-overflow: ellipsis;

	max-height: calc(var(--lh-base) * 3em);
}

/* ---- Link "Leggi →": sempre in basso ---- */
.fortop-acard__link {
	display: inline-flex;
	align-items: center;
	gap: var(--sp-2);
	margin-top: auto;
	padding-top: var(--sp-3);
	font-family: var(--font-sans);
	font-size: var(--fs-body-s);
	font-weight: var(--fw-medium);
	color: var(--color-ink) !important;
	text-decoration: none !important;
	border-top: 1px solid var(--color-line);
	transition: color var(--dur-fast) var(--ease-out), gap var(--dur-fast) var(--ease-out);
	align-self: flex-start;
	padding-right: var(--sp-2);
}

.fortop-acard__link:hover {
	color: var(--color-brand-deep) !important;
	gap: var(--sp-3);
}

.fortop-acard__link .arrow {
	flex-shrink: 0;
	transition: transform var(--dur-fast) var(--ease-out);
}

.fortop-acard__link:hover .arrow {
	transform: translateX(2px);
}

/* ---- Empty state ---- */
.fortop-articles-empty {
	font-family: var(--font-sans);
	font-size: var(--fs-body);
	color: var(--color-mute);
	padding: var(--sp-8) 0;
	text-align: center;
}

/* ---- Dark section override ---- */
.section-dark .fortop-acard {
	background: var(--color-dark-2);
	border-color: var(--color-dark-line);
}

.section-dark .fortop-acard:hover {
	border-color: var(--color-brand);
}

.section-dark .fortop-acard__title,
.section-dark .fortop-acard__title a {
	color: var(--color-paper) !important;
}

.section-dark .fortop-acard__excerpt {
	color: var(--color-dark-mute);
}

.section-dark .fortop-acard__link {
	color: var(--color-paper) !important;
	border-top-color: var(--color-dark-line);
}

.section-dark .fortop-acard__link:hover {
	color: var(--color-brand) !important;
}

/* =========================================================================
   FORTOP 2026 · PAGINAZIONE GRIGLIA ARTICOLI
   ========================================================================= */

.fortop-articles-pagination {
	margin-top: var(--sp-9);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--sp-3);
}

.fortop-articles-pagination ul {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--sp-2);
	margin: 0;
	padding: 0;
}

.fortop-articles-pagination li {
	display: inline-flex;
}

.fortop-articles-pagination a,
.fortop-articles-pagination span.page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 var(--sp-3);
	font-family: var(--font-sans);
	font-size: var(--fs-body-s);
	font-weight: var(--fw-medium);
	color: var(--color-ink) !important;
	background: var(--color-white);
	border: 1px solid var(--color-line-2);
	border-radius: var(--radius-sm);
	text-decoration: none !important;
	transition: all var(--dur-fast) var(--ease-out);
}

.fortop-articles-pagination a:hover {
	border-color: var(--color-ink);
	color: var(--color-brand-deep) !important;
}

.fortop-articles-pagination span.page-numbers.current {
	background: var(--color-ink);
	color: var(--color-paper) !important;
	border-color: var(--color-ink);
}

.fortop-articles-pagination span.page-numbers.dots {
	background: transparent;
	border: none;
	color: var(--color-mute) !important;
}

.fortop-articles-pagination .prev,
.fortop-articles-pagination .next {
	font-weight: var(--fw-medium);
	padding: 0 var(--sp-4);
}

.fortop-articles-pagination__info {
	font-family: var(--font-mono);
	font-size: var(--fs-micro);
	text-transform: uppercase;
	letter-spacing: var(--ls-overline);
	color: var(--color-mute);
	margin: 0;
}

/* Dark section override */
.section-dark .fortop-articles-pagination a,
.section-dark .fortop-articles-pagination span.page-numbers {
	background: transparent;
	color: var(--color-paper) !important;
	border-color: var(--color-dark-line);
}

.section-dark .fortop-articles-pagination a:hover {
	border-color: var(--color-brand);
	color: var(--color-brand) !important;
}

.section-dark .fortop-articles-pagination span.page-numbers.current {
	background: var(--color-brand);
	color: var(--color-ink) !important;
	border-color: var(--color-brand);
}

/* =========================================================================
   FORTOP 2026 · BLOCCO SHORTCODE FULL-WIDTH
   Wrapper neutro per shortcode esterni (webinar_netflix, fortop_hub_grid)
   che hanno il proprio background scuro e renderizzano a tutta larghezza.
   ========================================================================= */

.fortop-shortcode-block {
	margin: 0;
	padding: 0;
	width: 100%;
}

/* Reset eventuali margini WP automatici da .wp-block-html */
.fortop-shortcode-block > p:empty {
	display: none;
}

/* Forza la pagina contenitore a non clippare lo shortcode */
.fortop-page--webinar {
	overflow: visible;
}

/* =========================================================================
   FORTOP 2026 · EVENTI (shortcode [fortop_events])
   ========================================================================= */

/* ---- Cards prossimi eventi (grid 2 colonne) ---- */
.fortop-events-cards {
	display: grid;
	gap: var(--sp-6);
	grid-template-columns: 1fr;
	margin-top: var(--sp-6);
}

@media (min-width: 720px) {
	.fortop-events-cards {
		grid-template-columns: repeat(2, 1fr);
	}
}

.fortop-event-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: var(--sp-7) var(--sp-6);
	background: var(--color-white);
	border: 1px solid var(--color-line);
	border-radius: var(--radius-md);
	transition: border-color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}

.fortop-event-card:hover {
	border-color: var(--color-ink-3);
	transform: translateY(-2px);
	box-shadow: var(--shadow-md);
}

.fortop-event-card__meta {
	display: block;
	font-family: var(--font-mono);
	font-size: var(--fs-micro);
	font-weight: var(--fw-medium);
	text-transform: uppercase;
	letter-spacing: var(--ls-overline);
	color: var(--color-brand-deep);
	margin-bottom: var(--sp-3);
}

.fortop-event-card__title {
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	font-weight: var(--fw-regular);
	line-height: 1.25;
	letter-spacing: var(--ls-heading);
	color: var(--color-ink);
	margin: 0 0 var(--sp-4);
}

.fortop-event-card__accent em {
	font-style: italic;
	color: var(--color-brand-deep);
}

.fortop-event-card__body {
	font-family: var(--font-sans);
	font-size: var(--fs-body);
	line-height: var(--lh-loose);
	color: var(--color-ink-3);
	margin: 0 0 var(--sp-5);
	flex: 1 1 auto;
}

.fortop-event-card__link {
	display: inline-flex;
	align-items: center;
	gap: var(--sp-2);
	margin-top: auto;
	align-self: flex-start;
	padding-top: var(--sp-3);
	font-family: var(--font-sans);
	font-size: var(--fs-body-s);
	font-weight: var(--fw-medium);
	color: var(--color-ink) !important;
	text-decoration: none !important;
	transition: color var(--dur-fast) var(--ease-out), gap var(--dur-fast) var(--ease-out);
}

.fortop-event-card__link:hover {
	color: var(--color-brand-deep) !important;
	gap: var(--sp-3);
}

.fortop-event-card__link .arrow {
	flex-shrink: 0;
	transition: transform var(--dur-fast) var(--ease-out);
}

.fortop-event-card__link:hover .arrow {
	transform: translateX(2px);
}

/* ---- Tabella eventi passati ---- */
.fortop-events-table-wrap {
	margin-top: var(--sp-6);
	overflow-x: auto;
}

.fortop-events-table {
	width: 100%;
	border-collapse: collapse;
	font-family: var(--font-sans);
}

.fortop-events-table thead tr {
	border-bottom: 1px solid var(--color-dark-line);
}

.fortop-events-table th {
	text-align: left;
	padding: var(--sp-4) var(--sp-4);
	font-family: var(--font-mono);
	font-size: var(--fs-micro);
	font-weight: var(--fw-medium);
	text-transform: uppercase;
	letter-spacing: var(--ls-overline);
	color: var(--color-paper) !important;
	background: transparent;
	border: none;
	white-space: nowrap;
}

.fortop-events-table td {
	padding: var(--sp-4);
	border-bottom: 1px solid var(--color-dark-line);
	vertical-align: top;
	font-size: var(--fs-body-s);
	line-height: var(--lh-base);
	color: var(--color-dark-mute);
	background: transparent;
}

.fortop-events-table td:first-child {
	white-space: nowrap;
	color: var(--color-paper);
}

.fortop-events-table td strong {
	color: var(--color-paper);
	font-weight: var(--fw-medium);
}

.fortop-events-table tbody tr:hover td {
	background: rgba(60, 188, 0, 0.04);
}

.fortop-events-table a {
	color: var(--color-brand) !important;
	text-decoration: none;
}

.fortop-events-table a:hover {
	text-decoration: underline;
}

/* Override per la versione in section-paper (light) */
.section-paper .fortop-events-table th {
	color: var(--color-ink) !important;
	border-color: var(--color-ink);
}

.section-paper .fortop-events-table thead tr {
	border-bottom: 1px solid var(--color-ink);
}

.section-paper .fortop-events-table td {
	color: var(--color-ink-3);
	border-bottom: 1px solid var(--color-line);
}

.section-paper .fortop-events-table td:first-child,
.section-paper .fortop-events-table td strong {
	color: var(--color-ink);
}

.section-paper .fortop-events-table a {
	color: var(--color-brand-deep) !important;
}

/* ---- Empty state ---- */
.fortop-events-empty {
	font-family: var(--font-sans);
	font-size: var(--fs-body);
	color: var(--color-mute);
	padding: var(--sp-6) 0;
	text-align: center;
}

.section-dark .fortop-events-empty {
	color: var(--color-dark-mute);
}

/* ---- Side box (CTA speaker request) ---- */
.side-box {
	padding: var(--sp-7) var(--sp-6);
	background: var(--color-white);
	border: 1px solid var(--color-line);
	border-radius: var(--radius-md);
}

.side-box__title {
	font-family: var(--font-display);
	font-size: var(--fs-h4);
	font-weight: var(--fw-regular);
	color: var(--color-ink);
	margin: 0 0 var(--sp-3);
}

.side-box__body {
	font-family: var(--font-sans);
	font-size: var(--fs-body-s);
	color: var(--color-ink-3);
	line-height: var(--lh-base);
	margin: 0 0 var(--sp-5);
}

.side-box__link {
	display: inline-flex;
	align-items: center;
	gap: var(--sp-2);
	font-family: var(--font-sans);
	font-size: var(--fs-body-s);
	font-weight: var(--fw-medium);
	color: var(--color-ink) !important;
	text-decoration: none !important;
	transition: gap var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}

.side-box__link:hover {
	color: var(--color-brand-deep) !important;
	gap: var(--sp-3);
}

/* =========================================================================
   FORTOP 2026 · FORM FEEDBACK (success/error messages)
   ========================================================================= */

.form-feedback {
	margin-bottom: var(--sp-5);
	padding: var(--sp-4) var(--sp-5);
	border-radius: var(--radius-md);
	font-family: var(--font-sans);
	font-size: var(--fs-body-s);
	line-height: var(--lh-base);
}

.form-feedback--success {
	background: var(--color-brand-tint);
	border: 1px solid var(--color-brand-deep);
	color: var(--color-brand-ink);
}

.form-feedback--error {
	background: rgba(220, 38, 38, 0.08);
	border: 1px solid rgba(220, 38, 38, 0.3);
	color: #b91c1c;
}

.section-dark .form-feedback--success {
	background: rgba(60, 188, 0, 0.1);
	border-color: var(--color-brand);
	color: var(--color-brand);
}

.section-dark .form-feedback--error {
	background: rgba(220, 38, 38, 0.15);
	border-color: rgba(220, 38, 38, 0.5);
	color: #ef4444;
}

/* Sezione anchor #form: scroll-margin per offset header sticky */
#form {
	scroll-margin-top: var(--header-h);
}

/* =========================================================================
   FORTOP 2026 · LOGO FOOTER
   ========================================================================= */

.site-logo--footer {
	max-width: 200px;
}

.site-logo--footer .site-logo__img {
	display: block;
	max-height: 40px;
	width: auto;
	height: auto;
	object-fit: contain;
}

.site-logo--footer svg {
	display: block;
	max-height: 32px;
	width: auto;
}

/* =========================================================================
   FORTOP 2026 · NAV CATEGORIE (pagine "categoria articolo")
   ========================================================================= */

.fortop-cat-nav {
	display: flex !important;
	flex-wrap: wrap;
	gap: var(--sp-3);
	margin: 0;
	padding-top: var(--sp-3);
	padding-bottom: var(--sp-3);
	border-top: 1px solid var(--color-line);
	border-bottom: 1px solid var(--color-line);
}

.fortop-cat-nav__pill {
	display: inline-flex !important;
	align-items: center;
	padding: var(--sp-2) var(--sp-5);
	background: transparent;
	border: 1px solid var(--color-line-2);
	border-radius: var(--radius-full);
	font-family: var(--font-sans);
	font-size: var(--fs-body-s);
	font-weight: var(--fw-regular);
	letter-spacing: 0;
	text-transform: none;
	color: var(--color-ink) !important;
	text-decoration: none !important;
	line-height: 1.2;
	transition: all var(--dur-fast) var(--ease-out);
	white-space: nowrap;
}

.fortop-cat-nav__pill:hover {
	border-color: var(--color-ink);
	color: var(--color-brand-deep) !important;
}

.fortop-cat-nav__pill.is-active {
	background: var(--color-ink);
	color: var(--color-paper) !important;
	border-color: var(--color-ink);
	cursor: default;
	pointer-events: none;
}

.fortop-cat-nav__pill.is-active:hover {
	color: var(--color-paper) !important;
}

@media (max-width: 720px) {
	.fortop-cat-nav {
		overflow-x: auto;
		flex-wrap: nowrap;
		padding-bottom: var(--sp-4);
		scrollbar-width: thin;
	}
	.fortop-cat-nav__pill {
		flex: 0 0 auto;
	}
}

/* Dark section override */
.section-dark .fortop-cat-nav {
	border-top-color: var(--color-dark-line);
	border-bottom-color: var(--color-dark-line);
}

.section-dark .fortop-cat-nav__pill {
	border-color: var(--color-dark-line);
	color: var(--color-paper) !important;
}

.section-dark .fortop-cat-nav__pill:hover {
	border-color: var(--color-brand);
	color: var(--color-brand) !important;
}

.section-dark .fortop-cat-nav__pill.is-active {
	background: var(--color-brand);
	color: var(--color-ink) !important;
	border-color: var(--color-brand);
}

/* =========================================================================
   FORTOP 2026 · TAG ARTICOLO · INTEGRAZIONI OLD → NEW
   Adatta tutte le convenzioni del vecchio fortop-article al nuovo stile.
   ========================================================================= */

/* ---- H1 con <span> green (compat con vecchia convenzione) ---- */
.fortop-article__body h1 span:not([class]),
.fortop-article__body h1 .green {
	color: var(--color-brand-deep);
	font-style: italic;
	display: inline;
}
.fortop-article__body h2 span:not([class]),
.fortop-article__body h2 .green {
	color: var(--color-brand-deep);
	font-style: italic;
	display: inline;
}

/* ---- <hr> alternativa: linea verde 80px (opt-in via .green-bar) ---- */
.fortop-article__body hr.green-bar,
.fortop-article__body .green-bar {
	display: block;
	width: 80px;
	height: 4px;
	background: var(--color-brand-deep);
	border: none;
	margin: var(--sp-9) auto;
}

/* ---- Key-point box opt-in via .key-point ---- */
.fortop-article__body .key-point {
	border-left: 3px solid var(--color-brand-deep);
	padding: var(--sp-3) 0 var(--sp-3) var(--sp-5);
	margin: var(--sp-6) 0;
	background: linear-gradient(90deg, rgba(60,188,0,0.04) 0%, transparent 100%);
	max-width: 720px;
	margin-left: auto;
	margin-right: auto;
}
.fortop-article__body .key-point h4 {
	font-family: var(--font-sans);
	color: var(--color-brand-deep);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: var(--fs-caption);
	font-weight: var(--fw-bold);
	margin: 0 0 var(--sp-2);
}
.fortop-article__body .key-point p {
	margin: 0;
	max-width: none;
}

/* ---- Callout box (.callout o blockquote.callout) ---- */
.fortop-article__body .callout {
	background: var(--color-paper-2);
	border: 1px solid var(--color-line);
	border-left: 3px solid var(--color-brand-deep);
	padding: var(--sp-6) var(--sp-7);
	margin: var(--sp-7) auto;
	max-width: 720px;
	border-radius: var(--radius-sm);
	font-family: var(--font-sans);
	font-size: var(--fs-body);
	line-height: var(--lh-loose);
	color: var(--color-ink);
	font-style: normal;
}
.fortop-article__body .callout p {
	margin: 0 0 var(--sp-3);
	font-family: inherit;
	font-size: inherit;
	color: inherit;
	max-width: none;
}
.fortop-article__body .callout p:last-child {
	margin-bottom: 0;
}

/* ---- Lista key-points con <li><strong>TITOLO</strong> testo descrittivo ---- */
.fortop-article__body ul li strong:first-child,
.fortop-article__body ol li strong:first-child {
	display: block;
	color: var(--color-brand-deep);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-family: var(--font-sans);
	font-size: var(--fs-caption);
	font-weight: var(--fw-bold);
	margin-bottom: var(--sp-1);
}

/* ---- Classi colore opzionali ---- */
.fortop-article__body .green,
.fortop-article__body .text-fortop-green,
.fortop-article__body .text-brand {
	color: var(--color-brand-deep) !important;
}
.fortop-article__body .text-muted {
	color: var(--color-mute);
}

/* ---- Sezione dark inline opt-in via class .dark ---- */
.fortop-article__body section.dark,
.fortop-article__body div.dark {
	background: var(--color-dark);
	color: var(--color-paper);
	padding: var(--sp-7) var(--sp-6);
	margin: var(--sp-9) calc(var(--sp-6) * -1);
	border-radius: var(--radius-sm);
}
.fortop-article__body section.dark p,
.fortop-article__body div.dark p { color: var(--color-dark-mute); }
.fortop-article__body section.dark h2,
.fortop-article__body section.dark h3,
.fortop-article__body section.dark h4,
.fortop-article__body div.dark h2,
.fortop-article__body div.dark h3,
.fortop-article__body div.dark h4 { color: var(--color-paper); }
.fortop-article__body section.dark a,
.fortop-article__body div.dark a { color: var(--color-brand); }

/* =========================================================================
   FORTOP 2026 · ACCORDION / FAQ (native <details><summary>)
   Funziona senza JS, accessibile da tastiera, semantico, SEO-friendly.
   ========================================================================= */

.fortop-article__body details,
.fortop-faq details {
	background: var(--color-white);
	border: 1px solid var(--color-line);
	border-radius: var(--radius-sm);
	margin: var(--sp-3) auto;
	max-width: 720px;
	overflow: hidden;
	transition: border-color var(--dur-fast) var(--ease-out);
}

.fortop-article__body details:hover,
.fortop-faq details:hover {
	border-color: var(--color-ink-3);
}

.fortop-article__body details[open],
.fortop-faq details[open] {
	border-color: var(--color-brand-deep);
	background: var(--color-paper);
}

.fortop-article__body details summary,
.fortop-faq details summary {
	cursor: pointer;
	padding: var(--sp-5) var(--sp-6);
	font-family: var(--font-sans);
	font-size: var(--fs-body);
	font-weight: var(--fw-medium);
	color: var(--color-ink);
	list-style: none;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--sp-4);
	position: relative;
	transition: color var(--dur-fast) var(--ease-out);
}

/* Rimuove freccia browser default */
.fortop-article__body details summary::-webkit-details-marker,
.fortop-faq details summary::-webkit-details-marker { display: none; }

/* Icona + custom che ruota in × quando aperto */
.fortop-article__body details summary::after,
.fortop-faq details summary::after {
	content: '';
	flex-shrink: 0;
	width: 20px;
	height: 20px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230A0A0A' stroke-width='2' stroke-linecap='round'%3E%3Cline x1='12' y1='5' x2='12' y2='19'/%3E%3Cline x1='5' y1='12' x2='19' y2='12'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	transition: transform var(--dur-fast) var(--ease-out);
	margin-top: 2px;
}

.fortop-article__body details[open] summary::after,
.fortop-faq details[open] summary::after {
	transform: rotate(45deg);
}

.fortop-article__body details summary:hover,
.fortop-faq details summary:hover {
	color: var(--color-brand-deep);
}

.fortop-article__body details > *:not(summary),
.fortop-faq details > *:not(summary) {
	padding: 0 var(--sp-6) var(--sp-5);
}

.fortop-article__body details p,
.fortop-faq details p {
	font-size: var(--fs-body);
	line-height: var(--lh-loose);
	color: var(--color-ink-3);
	margin: 0 0 var(--sp-3);
	max-width: none;
}

.fortop-article__body details p:last-child,
.fortop-faq details p:last-child { margin-bottom: 0; }

/* Wrapper opzionale .fortop-faq per gruppo di domande */
.fortop-faq {
	max-width: 720px;
	margin: var(--sp-7) auto;
}

.fortop-faq__title {
	font-family: var(--font-mono);
	font-size: var(--fs-micro);
	text-transform: uppercase;
	letter-spacing: var(--ls-overline);
	color: var(--color-brand-deep);
	margin-bottom: var(--sp-5);
}

/* =========================================================================
   FORTOP 2026 · BARRA CONDIVISIONE ARTICOLO
   ========================================================================= */

.fortop-share {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--sp-4);
	margin: var(--sp-9) 0 var(--sp-7);
	padding: var(--sp-5) 0;
	border-top: 1px solid var(--color-line);
	border-bottom: 1px solid var(--color-line);
}

.fortop-share__label {
	font-family: var(--font-mono);
	font-size: var(--fs-micro);
	text-transform: uppercase;
	letter-spacing: var(--ls-overline);
	color: var(--color-mute);
	font-weight: var(--fw-medium);
}

.fortop-share__list {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: var(--sp-2);
	margin: 0;
	padding: 0;
}

.fortop-share__btn {
	display: inline-flex;
	align-items: center;
	gap: var(--sp-2);
	width: 40px;
	height: 40px;
	padding: 0;
	justify-content: center;
	background: transparent;
	border: 1px solid var(--color-line-2);
	border-radius: var(--radius-full);
	color: var(--color-ink) !important;
	cursor: pointer;
	text-decoration: none !important;
	transition: all var(--dur-fast) var(--ease-out);
}

.fortop-share__btn:hover {
	background: var(--color-ink);
	color: var(--color-paper) !important;
	border-color: var(--color-ink);
	transform: translateY(-1px);
}

/* Tinte brand al hover (mantiene leggibilità) */
.fortop-share__btn--linkedin:hover { background: #0A66C2; border-color: #0A66C2; }
.fortop-share__btn--x:hover         { background: #000000; border-color: #000000; }
.fortop-share__btn--facebook:hover  { background: #1877F2; border-color: #1877F2; }
.fortop-share__btn--whatsapp:hover  { background: #25D366; border-color: #25D366; }
.fortop-share__btn--telegram:hover  { background: #229ED9; border-color: #229ED9; }

.fortop-share__btn svg {
	display: block;
	flex-shrink: 0;
	width: 18px;
	height: 18px;
}

.fortop-share__btn--x svg { width: 15px; height: 15px; }
.fortop-share__copy svg { width: 16px; height: 16px; }

/* Bottone "Copia link" è più largo */
.fortop-share__copy {
	width: auto;
	padding: 0 var(--sp-4);
	font-family: var(--font-sans);
	font-size: var(--fs-caption);
	font-weight: var(--fw-medium);
}

.fortop-share__copy-done {
	color: var(--color-brand-deep);
	font-weight: var(--fw-bold);
}

.fortop-share__btn:hover .fortop-share__copy-done {
	color: var(--color-brand);
}

/* =========================================================================
   FORTOP 2026 · ARTICOLI CORRELATI
   ========================================================================= */

.fortop-related {
	margin: var(--sp-10) 0 var(--sp-9);
	padding-top: var(--sp-9);
	border-top: 1px solid var(--color-line);
}

.fortop-related__header {
	margin-bottom: var(--sp-7);
}

.fortop-related__overline {
	display: block;
	font-family: var(--font-mono);
	font-size: var(--fs-micro);
	text-transform: uppercase;
	letter-spacing: var(--ls-overline);
	color: var(--color-brand-deep);
	margin-bottom: var(--sp-3);
}

.fortop-related__title {
	font-family: var(--font-display);
	font-size: var(--fs-h2);
	font-weight: var(--fw-regular);
	line-height: var(--lh-snug);
	letter-spacing: var(--ls-heading);
	color: var(--color-ink);
	margin: 0;
}

.fortop-related__title em {
	font-style: italic;
	color: var(--color-brand-deep);
}

/* La griglia .fortop-articles-grid è già definita altrove (3 colonne stesso stile del Content Hub) */

/* =========================================================================
   FORTOP 2026 · CARD ALTRE CATEGORIE
   ========================================================================= */

.fortop-other-cats {
	margin: var(--sp-9) 0;
	padding-top: var(--sp-9);
	border-top: 1px solid var(--color-line);
}

.fortop-other-cats__grid {
	display: grid;
	gap: var(--sp-4);
	grid-template-columns: 1fr;
}

@media (min-width: 720px) {
	.fortop-other-cats__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1080px) {
	.fortop-other-cats__grid { grid-template-columns: repeat(3, 1fr); }
}

.fortop-cat-card {
	display: flex;
	flex-direction: column;
	gap: var(--sp-3);
	padding: var(--sp-6);
	background: var(--color-white);
	border: 1px solid var(--color-line);
	border-radius: var(--radius-md);
	text-decoration: none !important;
	color: var(--color-ink) !important;
	transition: all var(--dur-fast) var(--ease-out);
	position: relative;
	overflow: hidden;
	min-height: 180px;
}

.fortop-cat-card:hover {
	border-color: var(--color-ink);
	transform: translateY(-2px);
	box-shadow: var(--shadow-md);
}

.fortop-cat-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: var(--color-brand-deep);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform var(--dur-base) var(--ease-out);
}

.fortop-cat-card:hover::before {
	transform: scaleX(1);
}

.fortop-cat-card__count {
	font-family: var(--font-mono);
	font-size: var(--fs-micro);
	text-transform: uppercase;
	letter-spacing: var(--ls-overline);
	color: var(--color-mute);
}

.fortop-cat-card__name {
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	font-weight: var(--fw-regular);
	line-height: var(--lh-snug);
	letter-spacing: var(--ls-heading);
	color: var(--color-ink);
	margin: 0;
}

.fortop-cat-card:hover .fortop-cat-card__name {
	color: var(--color-brand-deep);
}

.fortop-cat-card__desc {
	font-family: var(--font-sans);
	font-size: var(--fs-body-s);
	line-height: var(--lh-base);
	color: var(--color-ink-3);
	margin: 0;
	flex: 1 1 auto;
}

.fortop-cat-card__arrow {
	display: inline-flex;
	align-self: flex-end;
	margin-top: auto;
	color: var(--color-ink);
	transition: transform var(--dur-fast) var(--ease-out);
}

.fortop-cat-card:hover .fortop-cat-card__arrow {
	color: var(--color-brand-deep);
	transform: translateX(4px);
}

/* =========================================================================
   FORTOP 2026 · OVERRIDE WEBINAR REPLAY (shortcode [webinar_netflix past])
   Forza paper-first anche quando lo shortcode è dentro .fortop-shortcode-block
   (vecchio pattern) o quando il <style> inline del plugin viene sovrascritto.
   ========================================================================= */

/* Container — niente sfondo nero, mai */
.netflix-container,
.fortop-shortcode-block .netflix-container,
.section-paper .netflix-container {
	background: transparent !important;
	padding: 24px 0 0 !important;
	font-family: var(--font-sans) !important;
}

/* Se siamo dentro .fortop-shortcode-block (vecchio pattern), forziamo container boxed */
.fortop-shortcode-block .netflix-container {
	max-width: var(--container-max);
	margin: 0 auto;
	padding-left: var(--sp-6) !important;
	padding-right: var(--sp-6) !important;
}

/* Griglia responsive */
.netflix-row {
	display: grid !important;
	grid-template-columns: 1fr !important;
	gap: var(--sp-6) !important;
	flex-wrap: initial !important;
}
@media (min-width: 720px) {
	.netflix-row { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (min-width: 1080px) {
	.netflix-row { grid-template-columns: repeat(3, 1fr) !important; }
}

/* Card paper, no più scaling aggressivo */
.netflix-card {
	background: var(--color-white) !important;
	border: 1px solid var(--color-line) !important;
	border-radius: var(--radius-md) !important;
	min-width: 0 !important;
	max-width: none !important;
	flex: initial !important;
	display: flex !important;
	flex-direction: column !important;
	transform: none !important;
	box-shadow: none !important;
	transition: border-color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out) !important;
}

.netflix-card:hover {
	background: var(--color-white) !important;
	border-color: var(--color-ink) !important;
	transform: translateY(-2px) !important;
	box-shadow: var(--shadow-md) !important;
}

/* Image placeholder paper-2 */
.netflix-card .card-image {
	background-color: var(--color-paper-2) !important;
}

/* Content paper-first */
.netflix-card .card-content {
	padding: var(--sp-5) var(--sp-6) var(--sp-6) !important;
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	gap: var(--sp-2);
}

.netflix-card .card-content h3 {
	font-family: var(--font-display) !important;
	font-size: var(--fs-h4) !important;
	font-weight: var(--fw-regular) !important;
	line-height: var(--lh-snug) !important;
	letter-spacing: -0.005em !important;
	color: var(--color-ink) !important;
	margin: 0 !important;
}

.netflix-card .card-content p {
	font-family: var(--font-sans) !important;
	font-size: var(--fs-body-s) !important;
	line-height: var(--lh-base) !important;
	color: var(--color-ink-3) !important;
	margin: 0 !important;
}

/* Play overlay leggermente più visibile */
.netflix-card .play-overlay {
	background: rgba(10, 10, 10, 0.4) !important;
}
.netflix-card .play-overlay span {
	font-size: 44px !important;
	color: #FFFFFF !important;
}

/* Empty state */
.netflix-empty,
.fortop-events-empty {
	background: transparent !important;
	color: var(--color-mute) !important;
	padding: var(--sp-7) 0 !important;
	text-align: center !important;
	border-radius: 0 !important;
}

/* =========================================================================
   FORTOP 2026 · LANGUAGE SWITCHER (header)
   ========================================================================= */

.fortop-lang-switch {
	display: flex;
	align-items: center;
	gap: var(--sp-3);
	margin-left: var(--sp-5);
	padding-left: var(--sp-5);
	border-left: 1px solid var(--color-line);
	font-family: var(--font-mono);
	font-size: var(--fs-micro);
	letter-spacing: var(--ls-overline);
	text-transform: uppercase;
	font-weight: var(--fw-medium);
}

.fortop-lang-switch__current {
	color: var(--color-brand-deep);
}

.fortop-lang-switch__sep {
	color: var(--color-line-2);
}

.fortop-lang-switch__link {
	color: var(--color-ink-3) !important;
	text-decoration: none !important;
	transition: color var(--dur-fast) var(--ease-out);
}

.fortop-lang-switch__link:hover {
	color: var(--color-ink) !important;
}

@media (max-width: 980px) {
	.fortop-lang-switch {
		margin-left: auto;
		margin-right: var(--sp-3);
		padding-left: 0;
		border-left: none;
	}
}