/* Stili degli archivi, scritti a mano: vanno nel corpo della pagina. */
/* ============================ TOKEN ============================ */
.athena-bl {
  --blue-600: #2B53A0;
  --navy-950: #0B1730;
  --navy-900: #112140;
  --blue-700: #22417f;
  --blue-500: #3f6bc0;
  --blue-100: #dbe6fa;
  --blue-50:  #f4f8ff;

  --gold-600: #a8791a;
  --gold-500: #c9962b;
  --gold-300: #ffd98a;
  --gold-200: #ffe6a3;

  --ink:      #0a2540;
  --slate-700:#3a4b63;
  --slate-600:#526077;
  --slate-400:#8a97ab;
  --line:     #e3e9f3;
  --line-soft:#eef2f9;
  --paper:    #ffffff;
  --canvas:   #f7f9fd;

  --font-display: "Fraunces", "Roboto Slab", Georgia, serif;
  --font-body: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --step--1: clamp(0.82rem, 0.79rem + 0.13vw, 0.89rem);
  --step-0:  clamp(1rem, 0.96rem + 0.19vw, 1.11rem);
  --step-1:  clamp(1.19rem, 1.12rem + 0.34vw, 1.39rem);
  --step-2:  clamp(1.41rem, 1.29rem + 0.58vw, 1.74rem);
  --step-3:  clamp(1.68rem, 1.48rem + 0.95vw, 2.18rem);
  --step-5:  clamp(2.38rem, 1.9rem + 2.32vw, 3.4rem);

  --sp-1: 0.25rem;  --sp-2: 0.5rem;   --sp-3: 0.75rem;  --sp-4: 1rem;
  --sp-5: 1.5rem;   --sp-6: 2rem;     --sp-7: 3rem;     --sp-8: 4rem;
  --sp-9: 6rem;

  --radius-sm: 6px;
  --radius:    12px;
  --radius-lg: 20px;

  --shadow-sm: 0 1px 2px rgba(10, 37, 64, .06), 0 1px 3px rgba(10, 37, 64, .04);
  --shadow:    0 4px 6px -1px rgba(10, 37, 64, .07), 0 2px 4px -2px rgba(10, 37, 64, .05);
  --shadow-lg: 0 20px 25px -5px rgba(10, 37, 64, .08), 0 8px 10px -6px rgba(10, 37, 64, .04);

  --container: 1320px;
}

/* ============================ BASE ============================ */
.athena-bl *, .athena-bl *::before, .athena-bl *::after { box-sizing: border-box; }
.athena-bl {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--step-0);
  line-height: 1.65;
  color: var(--slate-700);
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
}
.athena-bl h1 {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: var(--step-5);
  line-height: 1.15;
  letter-spacing: -0.015em;
  color: #fff;
  margin: 0 0 var(--sp-4);
  font-variation-settings: "SOFT" 0, "WONK" 0;
}
.athena-bl p { margin: 0 0 var(--sp-4); }
.athena-bl p:last-child { margin-bottom: 0; }

.athena-bl .contenitore {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--sp-5);
}

/* ============================ TESTATA ============================ */
.athena-bl .testata {
  position: relative;
  background:
    radial-gradient(1100px 620px at 78% -10%, rgba(63,107,192,.45), transparent 62%),
    linear-gradient(160deg, var(--navy-900) 0%, var(--navy-950) 100%);
  color: rgba(255,255,255,.84);
  overflow: hidden;
  /* aria sopra e sotto:
     --sp-6 = 2rem, --sp-7 = 3rem, --sp-8 = 4rem, --sp-9 = 6rem */
  padding-block: var(--sp-7) var(--sp-8);
}
.athena-bl .testata::after {
  content: "";
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(70% 70% at 50% 30%, #000 30%, transparent 100%);
  pointer-events: none;
}
.athena-bl .testata > .contenitore { position: relative; z-index: 1; }

.athena-bl .occhiello {
  display: inline-flex; align-items: center; gap: var(--sp-3);
  font-size: var(--step--1);
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--gold-300);
  margin-bottom: var(--sp-4);
}
.athena-bl .occhiello::before { content: ""; width: 28px; height: 2px; background: var(--gold-300); flex: none; }

.athena-bl .testata h1 { max-width: 22ch; }
.athena-bl .sottotitolo {
  font-size: var(--step-1);
  color: rgba(255,255,255,.8);
  max-width: 62ch;
  margin-bottom: var(--sp-6);
}

/* i tre indicatori */
.athena-bl .garanzie {
  display: flex; flex-wrap: wrap; gap: var(--sp-3);
  margin-bottom: var(--sp-6);
  padding-bottom: var(--sp-6);
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.athena-bl .garanzia {
  display: inline-flex; align-items: center; gap: var(--sp-2);
  font-size: var(--step--1);
  color: #fff;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px;
  padding: .5em 1.1em;
}
.athena-bl .garanzia strong { font-weight: 600; }

/* ricerca e categorie, una volta sola */
.athena-bl .strumenti { display: grid; gap: var(--sp-4); }
.athena-bl .ricerca {
  display: flex; align-items: center;
  background: var(--paper);
  border: 1px solid transparent;
  border-radius: 999px;
  padding: .35em .35em .35em 1.3em;
  max-width: 460px;
  width: 100%;
}
.athena-bl .ricerca:focus-within { border-color: var(--gold-300); box-shadow: 0 0 0 3px rgba(255,217,138,.25); }
.athena-bl .ricerca input {
  font: inherit;
  font-size: var(--step-0);
  color: var(--ink);
  border: 0; background: transparent; outline: none;
  flex: 1; min-width: 0;
  padding-block: .5em;
}
.athena-bl .ricerca input::placeholder { color: var(--slate-400); }
.athena-bl .ricerca button {
  flex: none;
  width: 40px; height: 40px;
  display: grid; place-items: center;
  border: 0;
  border-radius: 50%;
  background: var(--blue-600);
  color: #fff;
  cursor: pointer;
  transition: background-color .18s ease;
}
.athena-bl .ricerca button:hover { background: var(--blue-700); }
.athena-bl .ricerca svg { width: 18px; height: 18px; }

.athena-bl .categorie { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.athena-bl .categorie a {
  display: inline-flex; align-items: center; gap: var(--sp-2);
  font-size: var(--step--1);
  font-weight: 500;
  color: rgba(255,255,255,.86);
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px;
  padding: .5em 1.1em;
  text-decoration: none;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}
.athena-bl .categorie a:hover {
  background: var(--gold-300);
  border-color: var(--gold-300);
  color: var(--navy-900);
}

/* sul telefono ricerca e categorie stanno dentro "Filtra articoli /
   Cerca"; sul desktop il riepilogo sparisce e restano sempre aperte.
   E' un <details>: nessun JavaScript. */
.athena-bl .filtri > summary {
  display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3);
  cursor: pointer;
  list-style: none;
  font-size: var(--step-0);
  font-weight: 600;
  color: #fff;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: var(--radius-sm);
  padding: .8em 1.2em;
  margin-bottom: var(--sp-4);
}
.athena-bl .filtri > summary::-webkit-details-marker { display: none; }
.athena-bl .filtri > summary::after {
  content: "";
  width: 18px; height: 18px; flex: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") center / 16px no-repeat;
  transition: transform .2s ease;
}
.athena-bl .filtri[open] > summary::after { transform: rotate(180deg); }

@media (min-width: 900px) {
  .athena-bl .filtri > summary { display: none; }
  /* il browser nasconde il contenuto di un <details> chiuso:
     sul desktop lo riapriamo a forza */
  .athena-bl .filtri > .strumenti { display: grid !important; }
}

.athena-bl :focus-visible { outline: 2px solid var(--gold-300); outline-offset: 3px; border-radius: 2px; }

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


/* ==================================================================
   LA GRIGLIA DEGLI ARTICOLI
   Resta il widget "Archivio articoli" di Elementor: qui cambia solo
   l'aspetto. I !important servono perche' Elementor pubblica per
   questo template un foglio suo, con selettori piu' specifici.
   ================================================================== */

.elementor-3964 .elementor-widget-archive-posts { padding-block: 4rem; }

.elementor-3964 .elementor-widget-archive-posts .elementor-posts-container {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)) !important;
  gap: 1.5rem !important;
  margin: 0 auto !important;
  max-width: 1320px;
  padding-inline: 1.5rem;
}

/* una scheda */
.elementor-3964 .elementor-widget-archive-posts .elementor-posts--skin-classic .elementor-post {
  display: flex !important;
  flex-direction: column;
  margin: 0 !important;
  padding: 0 !important;
  background: #ffffff;
  border: 1px solid #e3e9f3;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(10,37,64,.06), 0 1px 3px rgba(10,37,64,.04);
  transition: box-shadow .2s ease, border-color .2s ease, transform .2s ease;
}
.elementor-3964 .elementor-widget-archive-posts .elementor-posts--skin-classic .elementor-post:hover {
  border-color: #2B53A0;
  box-shadow: 0 20px 25px -5px rgba(10,37,64,.10), 0 8px 10px -6px rgba(10,37,64,.05);
  transform: translateY(-3px);
}

/* la copertina: tutte della stessa forma, comunque sia caricata */
.elementor-3964 .elementor-widget-archive-posts .elementor-post__thumbnail__link { margin: 0 !important; display: block; }
.elementor-3964 .elementor-widget-archive-posts .elementor-posts-container .elementor-post__thumbnail {
  padding-bottom: 0 !important;
  aspect-ratio: 16 / 10;
  background: #f4f8ff;
  overflow: hidden;
}
.elementor-3964 .elementor-widget-archive-posts .elementor-post__thumbnail img {
  position: static !important;
  transform: none !important;
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: auto !important;
  object-fit: cover;
  border: 0 !important;
  border-radius: 0 !important;
  transition: transform .3s ease;
}
.elementor-3964 .elementor-widget-archive-posts .elementor-post:hover .elementor-post__thumbnail img { transform: scale(1.04); }

.elementor-3964 .elementor-widget-archive-posts .elementor-post__text {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 1.5rem !important;
  margin: 0 !important;
}
.elementor-3964 .elementor-widget-archive-posts .elementor-post__title {
  font-family: "Fraunces", "Roboto Slab", Georgia, serif !important;
  font-size: 1.22rem !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.015em;
  margin: 0 0 1rem !important;
}
.elementor-3964 .elementor-widget-archive-posts .elementor-post__title a {
  /* il CSS vecchio del widget tagliava il titolo a due righe con i
     puntini: qui si legge tutto, e le schede della stessa riga si
     allungano insieme */
  display: block !important;
  -webkit-line-clamp: none !important;
  overflow: visible !important;
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: 600 !important;
  color: #0a2540 !important;
  text-decoration: none;
}
.elementor-3964 .elementor-widget-archive-posts .elementor-post:hover .elementor-post__title a { color: #2B53A0 !important; }

.elementor-3964 .elementor-widget-archive-posts .elementor-post__read-more {
  /* flex e non inline-flex: cosi' la riga sopra attraversa tutta la
     scheda invece di fermarsi alla larghezza della scritta */
  display: flex !important;
  align-items: center;
  justify-content: flex-start;
  gap: .5rem;
  margin: auto 0 0 !important;
  /* il CSS vecchio ne faceva una pastiglia azzurra alta 40px:
     qui torna a essere un link, con la riga sopra */
  background: transparent !important;
  border-radius: 0 !important;
  height: auto !important;
  padding: 1rem 0 0 !important;
  border-top: 1px solid #eef2f9;
  font-family: "Roboto", sans-serif !important;
  font-size: .89rem !important;
  font-weight: 600 !important;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #2B53A0 !important;
  text-decoration: none;
  box-shadow: none !important;
  transform: none !important;
}
.elementor-3964 .elementor-widget-archive-posts .elementor-post__read-more:hover {
  background: transparent !important;
  color: #22417f !important;
  box-shadow: none !important;
  transform: none !important;
}
.elementor-3964 .elementor-widget-archive-posts .elementor-post__read-more::after {
  content: "";
  width: 15px; height: 15px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B53A0' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'/%3E%3Cpolyline points='12 5 19 12 12 19'/%3E%3C/svg%3E") center / contain no-repeat;
  transition: transform .2s ease;
}
.elementor-3964 .elementor-widget-archive-posts .elementor-post:hover .elementor-post__read-more::after { transform: translateX(3px); }

/* l'impaginazione */
.elementor-3964 .elementor-widget-archive-posts .elementor-pagination {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
  gap: .5rem;
  margin-top: 3rem !important;
}
.elementor-3964 .elementor-widget-archive-posts .elementor-pagination .page-numbers {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 44px; height: 44px;
  padding-inline: .9rem;
  border-radius: 8px;
  border: 1px solid #e3e9f3;
  background: #ffffff;
  color: #3a4b63 !important;
  font-size: .95rem;
  font-weight: 600;
  text-decoration: none;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}
.elementor-3964 .elementor-widget-archive-posts .elementor-pagination a.page-numbers:hover {
  border-color: #2B53A0;
  color: #2B53A0 !important;
}
.elementor-3964 .elementor-widget-archive-posts .elementor-pagination .page-numbers.current {
  background: #112140;
  border-color: #112140;
  color: #ffffff !important;
}
.elementor-3964 .elementor-widget-archive-posts .elementor-pagination .page-numbers.prev,
.elementor-3964 .elementor-widget-archive-posts .elementor-pagination .page-numbers.next { font-weight: 500; }
/* la freccia "Precedente" quando non c'e' pagina precedente: spenta */
.elementor-3964 .elementor-widget-archive-posts .elementor-pagination span.page-numbers.prev,
.elementor-3964 .elementor-widget-archive-posts .elementor-pagination span.page-numbers.next { opacity: .45; }

/* FIX: il menu deve stare sopra al contenuto. */
.elementor-location-header { position: relative; z-index: 100; }
.elementor-location-header .elementor-nav-menu--dropdown { z-index: 101; }

/* L'header chiude con una riga di 1px color #e3e9f3: qui sotto c'e' il
   navy della testata e si legge come una strisciolina chiara. */
.athena-hd__bar { border-bottom: 0 !important; }

/* i widget HTML non devono aggiungere margini o padding loro */
.elementor-3964 .elementor-widget-html:has(.athena-bl) { margin: 0 !important; }
.elementor-3964 .elementor-widget-wrap:has(> .elementor-widget-html > .elementor-widget-container > .athena-bl),
.elementor-3964 .elementor-column:has(> .elementor-widget-wrap > .elementor-widget-html > .elementor-widget-container > .athena-bl) {
  padding: 0 !important;
}



.athena-bl .checkup {
  background: linear-gradient(150deg, var(--navy-900), var(--navy-950));
  color: rgba(255,255,255,.84);
  text-align: center;
  padding-block: var(--sp-9);
}
.athena-bl .checkup h2 {
  font-family: var(--font-display);
  font-size: var(--step-3);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.015em;
  color: #fff;
  margin: 0 0 var(--sp-4);
  font-variation-settings: "SOFT" 0, "WONK" 0;
}
.athena-bl .checkup h2::after {
  content: "";
  display: block;
  width: 72px; height: 3px;
  background: var(--gold-500);
  margin: var(--sp-4) auto 0;
}
.athena-bl .checkup p {
  font-size: var(--step-1);
  max-width: 62ch;
  margin-inline: auto;
  margin-bottom: var(--sp-6);
}
.athena-bl .checkup p strong { color: var(--gold-300); font-weight: 600; }
.athena-bl .checkup a {
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--font-body);
  font-size: var(--step-1);
  font-weight: 600;
  line-height: 1.2;
  padding: 1em 2em;
  border-radius: var(--radius-sm);
  background: var(--gold-300);
  color: var(--navy-900);
  text-decoration: none;
  transition: background-color .18s ease, transform .18s ease;
}
.athena-bl .checkup a:hover { background: var(--gold-200); transform: translateY(-1px); }