/* ==========================================================================
   COG restyle - foglio di stile principale
   v1 - 26 agosto 2026 - home, header; footer rifatto il 29 agosto (sez. 12)
   Tutto il CSS del restyle vive qui. Niente inline style, niente CSS nei blocchi.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Token
   -------------------------------------------------------------------------- */
:root{
  --cog-brand:#D9006F;
  --cog-brand-scuro:#B8005E;
  --cog-brand-tinta:#FBEEF7;
  --cog-brand-tinta-2:#F6DFEF;

  --cog-bordo:#ECD6E6;
  --cog-bordo-forte:#DBB7D0;

  --cog-ink:#1A1016;
  --cog-ink-2:#3D2E36;
  --cog-muted:#6B5560;

  --cog-superficie:#FFFFFF;
  --cog-fondo:#FFFFFF;
  --cog-fondo-alt:#FBF7F9;

  --cog-attiva-t:#0E7A52;  --cog-attiva-b:#E8F5EE;
  --cog-scad-t:#8A4B00;    --cog-scad-b:#FBF0E2;
  --cog-nuova-t:#B8005E;   --cog-nuova-b:#FBEEF7;
  --cog-chiusa-t:#6B5560;  --cog-chiusa-b:#F1EDEF;

  --cog-r-s:8px;
  --cog-r-m:14px;
  --cog-r-l:20px;
  --cog-r-pill:999px;

  --cog-ombra:0 1px 2px rgba(26,16,22,.05), 0 10px 26px -18px rgba(26,16,22,.35);
  --cog-ombra-hover:0 2px 4px rgba(26,16,22,.06), 0 16px 34px -18px rgba(26,16,22,.42);

  --cog-gap:20px;
  --cog-sezione:56px;
  --cog-testata-h:64px;
}

/* --------------------------------------------------------------------------
   2. Reset mirato e tipografia di base
   -------------------------------------------------------------------------- */
body{ color:var(--cog-ink); background:var(--cog-fondo); }
.cog-home a{ text-decoration:none; }
.cog-home img{ display:block; max-width:100%; height:auto; }

.cog-home h1,.cog-home h2,.cog-home h3{
  color:var(--cog-ink);
  text-transform:none;
  letter-spacing:-.015em;
  text-wrap:balance;
  margin:0;
}

/* --------------------------------------------------------------------------
   3. Header: logo a sinistra, menu a destra, hamburger a destra su mobile
   -------------------------------------------------------------------------- */
.site-header{
  background:var(--cog-superficie);
  border-bottom:1px solid var(--cog-bordo);
  position:sticky;
  top:0;
  z-index:120;
}
.admin-bar .site-header{ top:32px; }
@media (max-width:782px){ .admin-bar .site-header{ top:46px; } }
@media (max-width:600px){ .admin-bar .site-header{ top:0; } }

.site-header .inside-header{
  display:flex;
  align-items:center;
  /* Sotto i 1220 px GeneratePress inserisce un secondo
     <nav id="mobile-menu-control-wrapper"> fra il logo e #site-navigation.
     Con space-between e tre elementi l'hamburger finirebbe in mezzo: lo
     spostiamo per ultimo con order, cosi si incolla al bordo destro. */
  justify-content:space-between;
  gap:16px;
  /* La testata e a tutta larghezza ma il sito e contenuto a 1280: senza questo
     vincolo il logo starebbe a 40 px e il contenuto a 120. */
  max-width:1280px;
  margin-left:auto;
  margin-right:auto;
  padding-top:12px;
  padding-bottom:12px;
}

/* Logo testuale al posto del PNG */
.cog-logo{ flex:0 0 auto; min-width:0; }
.cog-logo a{
  display:inline-block;
  font-weight:800;
  font-size:20px;
  line-height:1;
  letter-spacing:-.02em;
  color:var(--cog-ink);
  white-space:nowrap;
}
.cog-logo em{ font-style:normal; color:var(--cog-brand); }
.cog-logo b{ font-weight:800; color:var(--cog-muted); }
.cog-logo a:hover em{ color:var(--cog-brand-scuro); }

/* La barra di navigazione sta su una riga sola */
.site-header nav#site-navigation{ order:1; flex:0 0 auto; min-width:0; }
.site-header nav#mobile-menu-control-wrapper{ order:2; flex:0 0 auto; }
.site-header nav#mobile-menu-control-wrapper .inside-navigation{ padding:0; }
.site-header .main-navigation .inside-navigation{
  display:flex;
  align-items:center;
  flex-wrap:nowrap;
  padding:0;
  width:auto;
  max-width:none;
}
.site-header .main-navigation .main-nav > ul{ flex-wrap:nowrap; }
/* Icona ricerca: dimensioni esplicite, altrimenti l'SVG collassa a zero
   quando .inside-navigation diventa un contenitore flex. */
.site-header .main-navigation .menu-bar-items{ display:flex; align-items:center; flex:0 0 auto; }
.site-header .main-navigation .menu-bar-item{ display:flex; align-items:center; }
.site-header .main-navigation .menu-bar-item > a{
  display:flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  padding:0;
  color:var(--cog-ink-2);
}
/* Il .gp-icon di GP contiene DUE svg (lente e croce) e ne nasconde uno:
   qui diamo la misura solo al wrapper e all'svg visibile, senza forzare
   display:block su entrambi, altrimenti si impilano. */
.site-header .main-navigation .menu-bar-items .gp-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:19px;
  height:19px;
}
.site-header .main-navigation .menu-bar-items .gp-icon svg{
  width:19px;
  height:19px;
}

/* Voci di menu */
.main-navigation .main-nav ul li a{
  font-weight:600;
  font-size:14px;
  color:var(--cog-ink-2);
  padding-left:10px;
  padding-right:10px;
  white-space:nowrap;
}
@media (min-width:1400px){
  .main-navigation .main-nav ul li a{ font-size:15px; padding-left:14px; padding-right:14px; }
}
.main-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li.current-menu-item > a,
.main-navigation .main-nav ul li.current-menu-ancestor > a{
  color:var(--cog-brand);
}
.main-navigation .menu-bar-items{ color:var(--cog-ink-2); }
.main-navigation .menu-bar-item > a:hover{ color:var(--cog-brand); }

/* Hamburger */
.main-navigation .menu-toggle{
  flex:0 0 auto;
  width:auto;
  font-weight:600;
  color:var(--cog-ink);
  padding:10px 4px;
  white-space:nowrap;
}
.main-navigation .menu-toggle:hover{ color:var(--cog-brand); }
.main-navigation .menu-toggle .gp-icon svg{ width:1.4em; height:1.4em; }

/* Fino a 1024 px: logo a sinistra, hamburger a destra, sulla stessa riga */
@media (max-width:1219px){
  .site-header .inside-header{ padding-top:8px; padding-bottom:8px; }
  .cog-logo a{ font-size:18px; }
  .site-header nav#site-navigation{ flex:0 0 auto; }
  .main-navigation .inside-navigation{ padding:0; }
  .main-navigation .menu-toggle{ display:flex; align-items:center; gap:8px; }
  /* Il pannello si ancora alla TESTATA (che e sticky, quindi e il blocco
     contenitore), non al flex item stretto del menu: cosi e largo quanto la
     testata e non esce mai dallo schermo. */
  /* .inside-navigation ha position:relative da GeneratePress e diventerebbe il
     blocco contenitore del pannello, largo quanto il pulsante. Azzerandolo, il
     riferimento torna a essere .site-header, che e sticky e largo tutto. */
  .site-header .inside-header{ position:static; }
  .site-header .main-navigation,
  .site-header .main-navigation .inside-navigation{
    position:static;
    width:auto;
    max-width:none;
    flex:0 0 auto;
  }
  /* La lista e posizionata in assoluto: il suo contenitore non deve occupare
     spazio, altrimenti spinge l'hamburger via dal bordo destro. */
  .site-header .main-navigation .main-nav{
    position:static;
    flex:0 0 0;
    width:0;
    max-width:none;
  }
  .site-header .main-navigation .main-nav > ul{
    position:absolute;
    left:0;
    right:0;
    top:100%;
    width:auto;
    max-width:none;
    margin:0;
    max-height:calc(100vh - var(--cog-testata-h) - 20px);
    overflow-y:auto;
    background:var(--cog-superficie);
    border-top:1px solid var(--cog-bordo);
    border-bottom:1px solid var(--cog-bordo);
    box-shadow:var(--cog-ombra);
  }
  .main-navigation .main-nav > ul > li:last-child > a{ border-bottom:0; }
  .main-navigation .main-nav ul li a{
    padding:14px 20px;
    font-size:16px;
    border-bottom:1px solid var(--cog-bordo);
  }
  /* Secondo livello: stessa area tattile del primo, ma rientrato. */
  .main-navigation .main-nav ul ul li a{
    padding:14px 20px 14px 38px;
    font-size:15px;
  }
  .main-navigation .main-nav .dropdown-menu-toggle{
    display:flex;
    align-items:center;
    padding:14px 20px;
  }
  .site-header .main-navigation .menu-bar-items{ display:none; }
}



/* Sotto i 480 px il logo per intero, la parola "Menu" e la lente non stanno
   sulla stessa riga. Restiamo pero sui 30 px di griglia del tema, perche la
   testata e la barra categorie compaiono anche su categorie e articoli, dove
   il contenuto usa il contenitore di GeneratePress. */
@media (max-width:479px){
  .site-header .inside-header{ gap:10px; }
  .cog-logo a{ font-size:15.5px; letter-spacing:-.03em; }
  .site-header .main-navigation .menu-bar-items{ display:none; }
  .main-navigation .menu-toggle .mobile-menu{ display:none; }
  /* 22 px di icona piu 11 di padding per lato: area tattile da 44 px. */
  .main-navigation .menu-toggle{ padding:11px; }
}

/* --------------------------------------------------------------------------
   4. Impalcatura della home
   -------------------------------------------------------------------------- */
/* La home non passa dal contenitore di GeneratePress, quindi si da la sua
   spaziatura. Le altre viste quella ce l'hanno gia: raddoppiarla lasciava
   56 px di vuoto contro i 26 della home. */
.home .site-main{ padding-top:26px; padding-bottom:56px; }
body:not(.home) .site-main{ padding-top:0; padding-bottom:56px; }
/* La home e la barra categorie devono stare sulla stessa griglia della
   testata: il template non stampa .inside-article, quindi la spaziatura del
   contenitore di GeneratePress non arriva e va replicata qui.
   40 px da 769 in su, 30 px sotto, 16 px sotto i 480 come la testata. */
/* Solo la home ha bisogno di questa spaziatura: front-page.php non passa dal
   contenitore che GeneratePress usa per articoli, archivi e pagine, quindi qui
   la griglia va replicata a mano. Le altre viste ereditano gia il padding del
   tema: aggiungerlo di nuovo le sposterebbe fuori asse. */
.cog-home{
  max-width:100%;
  padding-left:40px;
  padding-right:40px;
}

@media (max-width:768px){
  .cog-home{ padding-left:30px; padding-right:30px; }
}


.cog-intestazione-sito{ margin:0 0 24px; }
.cog-intestazione-sito h1{
  font-size:clamp(24px,3.4vw,34px);
  font-weight:800;
  line-height:1.15;
}
.cog-intestazione-sito p{
  margin:8px 0 0;
  color:var(--cog-muted);
  font-size:17px;
  max-width:70ch;
}

.cog-sezione{ margin-top:var(--cog-sezione); }
.cog-hero + .cog-sezione{ margin-top:40px; }

.cog-sezione__testa{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
  padding-bottom:12px;
  border-bottom:1px solid var(--cog-bordo);
}
.cog-sezione__testa h2{
  font-size:clamp(20px,2.4vw,26px);
  font-weight:800;
}
.cog-tutte{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:0 2px;
  font-size:15px;
  font-weight:700;
  color:var(--cog-brand);
  white-space:nowrap;
}
.cog-tutte span[aria-hidden]{ margin-left:6px; }
.cog-tutte:hover{ color:var(--cog-brand-scuro); text-decoration:underline; }

/* --------------------------------------------------------------------------
   5. Pastiglie di stato e categoria
   -------------------------------------------------------------------------- */
.cog-pill{
  display:inline-flex;
  align-items:center;
  padding:3px 10px;
  border-radius:var(--cog-r-pill);
  font-size:12px;
  font-weight:700;
  line-height:1.5;
  letter-spacing:.01em;
}
.cog-pill--cat{ background:var(--cog-brand-tinta); color:var(--cog-brand-scuro); }
.cog-stato--attiva{ background:var(--cog-attiva-b); color:var(--cog-attiva-t); }
.cog-stato--scadenza{ background:var(--cog-scad-b); color:var(--cog-scad-t); }
.cog-stato--nuova{ background:var(--cog-nuova-b); color:var(--cog-nuova-t); }
.cog-stato--chiusa{ background:var(--cog-chiusa-b); color:var(--cog-chiusa-t); }

.cog-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  font-size:13.5px;
  color:var(--cog-muted);
}
.cog-meta time{ font-variant-numeric:tabular-nums; }

/* --------------------------------------------------------------------------
   6. Immagini
   -------------------------------------------------------------------------- */
.cog-img{
  display:block;
  position:relative;
  overflow:hidden;
  background:var(--cog-brand-tinta);
  transition:background .25s ease;
}
.cog-img img{
  width:100%;
  height:100%;
  object-fit:contain;
}
.cog-card:hover .cog-img{ background:var(--cog-brand-tinta-2); }
.cog-img--1x1{ aspect-ratio:1/1; }

.cog-img__vuota{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
  background:var(--cog-brand-tinta);
  color:#9C4E77;
  font-weight:800;
  font-size:clamp(18px,4vw,30px);
  letter-spacing:.04em;
}

/* --------------------------------------------------------------------------
   7. Hero
   -------------------------------------------------------------------------- */
.cog-hero{
  display:grid;
  grid-template-columns:1fr;
  gap:var(--cog-gap);
  margin-bottom:8px;
}
@media (min-width:900px){
  .cog-hero{
    grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);
    grid-template-rows:repeat(4,minmax(0,1fr));
    align-items:stretch;
  }
  .cog-hero > .cog-evi:first-child{ grid-column:1; grid-row:1 / 5; }
  .cog-hero > .cog-evi:not(:first-child){ grid-column:2; }
}

/* Card del primo blocco: stesso markup per tutte, aspetto dal posto che
   occupano. La prima e grande, le altre compatte: lo script le mescola. */
.cog-evi{
  position:relative;
  display:grid;
  grid-template-columns:96px minmax(0,1fr);
  gap:14px;
  align-items:center;
  background:#fff;
  border:1px solid var(--cog-bordo);
  border-radius:var(--cog-r-l);
  padding:12px;
  transition:box-shadow .25s ease, border-color .25s ease;
}
.cog-evi:hover{ box-shadow:var(--cog-ombra-hover); border-color:var(--cog-bordo-forte); }
.cog-evi__media{ display:block; min-width:0; }
.cog-evi__media .cog-img{ width:96px; height:96px; border-radius:10px; }
.cog-evi__corpo{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:6px;
}
.cog-evi .cog-card__titolo{ font-size:15.5px; }
.cog-evi .cog-card__titolo a{ color:var(--cog-ink); }
.cog-evi:hover .cog-card__titolo a{ color:var(--cog-brand-scuro); }
.cog-evi__estratto{
  display:none;
  margin:0;
  color:var(--cog-ink-2);
  font-size:16px;
  line-height:1.5;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.cog-evi .cog-meta{ display:none; }
.cog-evi .cog-evi__cta{ display:none; }
.cog-evi__cta-mini{ display:inline-flex; }

/* La prima card diventa la principale: orizzontale, tinta, estratto e bottone. */
.cog-hero > .cog-evi:first-child{
  grid-template-columns:minmax(0,1fr);
  gap:0;
  padding:0;
  background:var(--cog-brand-tinta);
  overflow:hidden;
}
@media (min-width:640px){
  .cog-hero > .cog-evi:first-child{ grid-template-columns:minmax(0,1.08fr) minmax(0,1fr); align-items:stretch; }
}
.cog-hero > .cog-evi:first-child .cog-evi__media{ order:2; display:flex; align-items:center; background:var(--cog-brand-tinta); }
.cog-hero > .cog-evi:first-child .cog-evi__media .cog-img{ width:100%; height:auto; border-radius:0; background:var(--cog-brand-tinta); }
.cog-hero > .cog-evi:first-child .cog-evi__media .cog-img img{ padding:16px; }
.cog-hero > .cog-evi:first-child:hover .cog-img{ background:var(--cog-brand-tinta-2); }
.cog-hero > .cog-evi:first-child .cog-evi__corpo{
  padding:26px 26px 28px;
  gap:12px;
  justify-content:center;
}
.cog-hero > .cog-evi:first-child .cog-card__titolo{
  font-size:clamp(21px,2.2vw,29px);
  font-weight:800;
  line-height:1.16;
}
.cog-hero > .cog-evi:first-child .cog-evi__estratto{ display:-webkit-box; }
.cog-hero > .cog-evi:first-child .cog-meta{ display:block; }
.cog-hero > .cog-evi:first-child .cog-evi__cta{ display:inline-flex; align-self:center; }
.cog-hero > .cog-evi:first-child .cog-evi__cta-mini{ display:none; }

/* --------------------------------------------------------------------------
   8. Bottone
   -------------------------------------------------------------------------- */
.cog-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:44px;
  padding:11px 20px;
  border-radius:var(--cog-r-pill);
  background:var(--cog-brand);
  color:#fff;
  font-weight:700;
  font-size:15px;
  line-height:1.2;
  border:1px solid var(--cog-brand);
  transition:background .2s ease, border-color .2s ease;
}
.cog-btn:hover{ background:var(--cog-brand-scuro); border-color:var(--cog-brand-scuro); color:#fff; }

/* --------------------------------------------------------------------------
   9. Card grande
   -------------------------------------------------------------------------- */
.cog-griglia{
  display:grid;
  gap:var(--cog-gap);
  grid-template-columns:repeat(2,minmax(0,1fr));
}
/* Mai 4 colonne: le sezioni hanno 6 card e devono riempire le righe
   (3+3 da desktop, 2+2+2 da tablet), senza celle vuote. */
@media (min-width:980px){ .cog-griglia{ grid-template-columns:repeat(3,minmax(0,1fr)); } }

.cog-card{
  position:relative;
  display:flex;
  flex-direction:column;
  background:var(--cog-superficie);
  border:1px solid var(--cog-bordo);
  border-radius:var(--cog-r-m);
  overflow:hidden;
  transition:box-shadow .25s ease, border-color .25s ease, transform .25s ease;
}
.cog-card:hover{
  box-shadow:var(--cog-ombra-hover);
  border-color:var(--cog-bordo-forte);
  transform:translateY(-2px);
}
.cog-card__corpo{
  display:flex;
  flex-direction:column;
  gap:7px;
  padding:14px 16px 16px;
  flex:1 1 auto;
}
/* Il tema applica text-transform:capitalize ai titoli di alcuni contesti:
   in italiano rompe le parole ("In Omaggio Con Oggi"). */
.cog-card__titolo,
.cog-card__titolo a,
.cog-sezione__testa h2,
.cog-archivio__testa h1,
.cog-articolo__titolo,
.cog-passi__titolo,
.cog-faq__domanda{ text-transform:none; }

.cog-card__titolo{
  font-size:16.5px;
  font-weight:700;
  line-height:1.3;
}
.cog-card__titolo a{ color:var(--cog-ink); }
.cog-card:hover .cog-card__titolo a{ color:var(--cog-brand-scuro); }

/* L'intera card e cliccabile, ma il link e uno solo */
.cog-card__titolo a::after{
  content:"";
  position:absolute;
  inset:0;
}
.cog-card__cima:empty{ display:none; }
.cog-card__cima{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-items:center;
}
/* La pastiglia ha una fascia tutta sua sopra la foto, centrata: cosi non si
   sovrappone mai al prodotto. La fascia riserva l'altezza anche quando la
   pastiglia non c'e, e le card affiancate restano allineate. */
.cog-card__cima--fascia{
  justify-content:center;
  min-height:38px;
  padding:10px 12px 2px;
}
.cog-griglia .cog-card .cog-card__titolo,
.cog-griglia--archivio .cog-card .cog-card__titolo{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  min-height:2.6em;
}
.cog-griglia .cog-card .cog-card__cta,
.cog-griglia--archivio .cog-card .cog-card__cta{
  margin-top:auto;
}
.cog-griglia .cog-card .cog-meta,
.cog-griglia--archivio .cog-card .cog-meta{
  font-size:12.5px;
  line-height:1.4;
  margin:0 0 8px;
}

@media (max-width:520px){
  .cog-griglia{ gap:14px; }
  .cog-card__corpo{ padding:11px 12px 13px; }
  .cog-card__titolo{ font-size:15px; }
}

/* --------------------------------------------------------------------------
   10. Card compatta a riga
   -------------------------------------------------------------------------- */
.cog-lista{
  display:grid;
  gap:12px;
  grid-template-columns:1fr;
}
@media (min-width:760px){ .cog-lista{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

.cog-card--riga{
  position:relative;
  display:grid;
  grid-template-columns:112px minmax(0,1fr);
  gap:12px;
  align-items:center;
  padding:12px;
  background:var(--cog-superficie);
  border:1px solid var(--cog-bordo);
  border-radius:var(--cog-r-m);
  transition:box-shadow .25s ease, border-color .25s ease, background .25s ease;
}
.cog-card--riga:hover{
  border-color:var(--cog-bordo-forte);
  box-shadow:var(--cog-ombra);
  background:var(--cog-fondo-alt);
}
.cog-card--riga .cog-img{
  width:112px;
  height:112px;
  border-radius:10px;
}
.cog-card--riga .cog-card__corpo{ padding:0; gap:6px; }
.cog-card--riga .cog-card__titolo{ font-size:15.5px; }

/* CTA a tre livelli: il fucsia pieno esiste una volta sola per vista (la
   principale del primo blocco). Le card usano il chip in tinta, che si
   accende al passaggio; i contesti compatti usano solo testo e freccia. */
.cog-card__cta{
  display:inline-flex;
  align-self:stretch;
  align-items:center;
  justify-content:center;
  gap:7px;
  margin-top:2px;
  min-height:34px;
  padding:7px 14px;
  border-radius:var(--cog-r-pill);
  background:var(--cog-brand-tinta);
  color:var(--cog-brand-scuro);
  border:1px solid var(--cog-bordo);
  font-size:13.5px;
  font-weight:700;
  line-height:1.2;
  transition:background .18s ease, color .18s ease, border-color .18s ease;
}
.cog-card:hover .cog-card__cta,
.cog-evi:hover .cog-card__cta{
  background:var(--cog-brand);
  color:#fff;
  border-color:var(--cog-brand);
}

/* LIVELLO 3: testo e freccia nei contesti compatti a fondo articolo. */
.cog-nav-articoli__voce .cog-card__cta,
.cog-texlink__voce .cog-card__cta{
  background:transparent;
  border:0;
  min-height:0;
  padding:0;
  margin-top:4px;
  align-self:center;
  font-size:14px;
  color:var(--cog-brand-scuro);
}
.cog-nav-articoli__voce:hover .cog-card__cta,
.cog-texlink__voce:hover .cog-card__cta{ color:var(--cog-brand); }

/* La card intera e cliccabile: che lo dica anche il puntatore. */
.cog-card,
.cog-evi,
.cog-nav-articoli__voce,
.cog-texlink__voce{ cursor:pointer; }

/* --------------------------------------------------------------------------
   11. Fascia iscrizione
   -------------------------------------------------------------------------- */
.cog-iscriviti{
  margin-top:var(--cog-sezione);
  padding:26px;
  border-radius:var(--cog-r-l);
  background:var(--cog-brand-tinta);
  border:1px solid var(--cog-bordo);
  display:grid;
  gap:18px;
  align-items:center;
}
@media (min-width:860px){ .cog-iscriviti{ grid-template-columns:1.3fr 1fr; } }
.cog-iscriviti h2{ font-size:22px; font-weight:800; }
.cog-iscriviti p{ margin:8px 0 0; color:var(--cog-ink-2); font-size:16px; }
.cog-iscriviti__form{ display:flex; flex-wrap:wrap; gap:10px; }
.cog-iscriviti__form input[type="email"]{
  flex:1 1 200px;
  min-width:0;
  padding:11px 14px;
  border-radius:var(--cog-r-pill);
  border:1px solid var(--cog-bordo-forte);
  background:var(--cog-superficie);
  color:var(--cog-ink);
  font-size:15px;
}
.cog-iscriviti__form input[type="email"]:focus{
  outline:3px solid var(--cog-brand);
  outline-offset:1px;
  border-color:var(--cog-brand);
}
.cog-iscriviti__form .cog-btn{ border:1px solid var(--cog-brand); cursor:pointer; }
.cog-iscriviti .cog-iscriviti__nota{ margin-top:10px; font-size:13.5px; color:var(--cog-muted); }

/* --------------------------------------------------------------------------
   12. Footer
   v3 - 29 agosto 2026. Markup in inc/cog-footer.php, stampato nel
   contenitore .site-footer di GeneratePress. L'Element 93010 e spento.
   Stessa griglia della testata: 1280 px, 40/30/16 px di margine.
   -------------------------------------------------------------------------- */
.site-footer{
  margin-top:0;
  padding:0;
  background:var(--cog-fondo-alt);
  border-top:1px solid var(--cog-bordo);
  color:var(--cog-ink-2);
}
.cog-footer{
  position:relative;
  overflow:hidden;
  font-size:15px;
  line-height:1.55;
}
/* Un alone di tinta in alto a destra: lega il footer al fucsia del marchio
   senza un blocco pieno di colore. */
.cog-footer::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(70% 60% at 100% 0%, var(--cog-brand-tinta) 0%, rgba(251,238,247,0) 70%),
    linear-gradient(180deg, rgba(255,255,255,.6) 0%, rgba(255,255,255,0) 100%);
}
.cog-footer > *{ position:relative; }
.cog-footer__interno{
  max-width:1280px;
  margin:0 auto;
  padding:56px 40px 28px;
}
.cog-footer a{ text-decoration:none; color:inherit; }
.cog-footer p{ margin:0; }
.cog-footer ul{ list-style:none; margin:0; padding:0; }

/* Marchio a sinistra, colonne a destra */
.cog-footer__alto{
  display:grid;
  grid-template-columns:minmax(340px,1.3fr) minmax(0,2.7fr);
  gap:48px 48px;
  align-items:start;
}

.cog-footer__logo{
  display:inline-block;
  font-weight:800;
  font-size:clamp(20px,5.5vw,24px);
  line-height:1;
  letter-spacing:-.02em;
  color:var(--cog-ink);
  white-space:nowrap;
}
.cog-footer__logo em{ font-style:normal; color:var(--cog-brand); }
.cog-footer__logo b{ font-weight:800; color:var(--cog-muted); }
.cog-footer__logo:hover em{ color:var(--cog-brand-scuro); }

.cog-footer__claim{
  margin-top:14px;
  max-width:44ch;
  color:var(--cog-ink-2);
  font-size:15px;
}

.cog-footer__fatti{
  display:flex;
  margin-top:20px;
  padding:14px 0;
  border-top:1px solid var(--cog-bordo);
  border-bottom:1px solid var(--cog-bordo);
  max-width:44ch;
}
.cog-footer__fatti li{
  flex:1 1 0;
  min-width:0;
  padding:0 14px;
  border-left:1px solid var(--cog-bordo);
  font-size:12.5px;
  line-height:1.3;
  color:var(--cog-muted);
}
.cog-footer__fatti li:first-child{ padding-left:0; border-left:0; }
.cog-footer__fatti strong{
  display:block;
  margin-bottom:2px;
  font-size:18px;
  font-weight:800;
  letter-spacing:-.01em;
  line-height:1.1;
  color:var(--cog-ink);
  white-space:nowrap;
}

.cog-footer__azioni{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px 18px;
  margin-top:22px;
}
.cog-footer__fb{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:44px;
  padding:10px 18px 10px 14px;
  border-radius:var(--cog-r-pill);
  background:var(--cog-brand-tinta);
  border:1px solid var(--cog-bordo);
  color:var(--cog-brand-scuro);
  font-weight:700;
  font-size:14.5px;
  line-height:1.2;
  transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.cog-footer__fb svg{ flex:0 0 auto; }
.cog-footer__fb:hover{ background:var(--cog-brand); border-color:var(--cog-brand); color:#fff; }
.cog-footer__mail{
  font-weight:700;
  color:var(--cog-ink-2);
  overflow-wrap:anywhere;
  text-decoration:underline;
  text-decoration-color:var(--cog-bordo-forte);
  text-underline-offset:4px;
}
.cog-footer__mail:hover{ color:var(--cog-brand-scuro); text-decoration-color:currentColor; }

/* Colonne della mappa del sito */
.cog-footer__colonne{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:32px 28px;
}
.cog-footer__titolo{
  margin:0 0 14px;
  font-size:13px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--cog-ink);
}
.cog-footer__titolo a{ color:inherit; }
.cog-footer__titolo a:hover{ color:var(--cog-brand-scuro); }
.cog-footer__colonna li + li{ margin-top:2px; }
.cog-footer__colonna li a{
  display:inline-block;
  padding:5px 0;
  color:var(--cog-ink-2);
  font-size:15px;
  line-height:1.35;
  border-radius:4px;
  transition:color .15s ease;
}
.cog-footer__colonna li a:hover{
  color:var(--cog-brand-scuro);
  text-decoration:underline;
  text-decoration-color:var(--cog-bordo-forte);
  text-underline-offset:4px;
}

/* Nota di trasparenza */
.cog-footer__nota{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px 40px;
  margin-top:48px;
  padding:22px 26px;
  border-radius:var(--cog-r-m);
  background:var(--cog-superficie);
  border:1px solid var(--cog-bordo);
  font-size:14px;
  line-height:1.6;
  color:var(--cog-muted);
}
.cog-footer__nota strong{ color:var(--cog-ink); font-weight:800; }
.cog-footer__nota a{
  color:var(--cog-brand-scuro);
  font-weight:700;
  text-decoration:underline;
  text-underline-offset:3px;
}
.cog-footer__nota a:hover{ color:var(--cog-brand); }

/* Riga legale */
.cog-footer__legale{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:10px 16px;
  margin-top:28px;
  padding-top:20px;
  border-top:1px solid var(--cog-bordo);
  font-size:13px;
  color:var(--cog-muted);
}
.cog-footer__legale p{ flex:1 1 auto; min-width:0; overflow-wrap:anywhere; }
.cog-footer__legale nav{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:2px 4px;
}
.cog-footer__legale nav a{
  display:inline-flex;
  align-items:center;
  min-height:36px;
  padding:0 6px;
  border-radius:var(--cog-r-s);
  color:var(--cog-ink-2);
  font-weight:600;
  white-space:nowrap;
}
.cog-footer__legale nav a:hover{ color:var(--cog-brand-scuro); background:var(--cog-brand-tinta); }
.cog-footer__su{ margin-left:4px; }
.cog-footer__cmp{ cursor:pointer; }

@media (max-width:1100px){
  .cog-footer__alto{ grid-template-columns:1fr; gap:40px; }
  .cog-footer__colonne{ grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media (max-width:860px){
  .cog-footer__colonne{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 24px; }
  .cog-footer__nota{ grid-template-columns:1fr; }
}
@media (max-width:768px){
  .cog-footer__interno{ padding:44px 30px 24px; }
}
@media (max-width:600px){
  .cog-footer__legale{ flex-direction:column; align-items:flex-start; }
  .cog-footer__legale nav{ margin-left:-6px; }
}
@media (max-width:480px){
  .cog-footer__interno{ padding:36px 30px 20px; }
  .cog-footer__nota{ padding:18px 16px; }
  .cog-footer__colonne{ gap:24px 16px; }
  .cog-footer__titolo{ font-size:12.5px; letter-spacing:.06em; }
}

/* --------------------------------------------------------------------------
   13. Accessibilita e stampa
   -------------------------------------------------------------------------- */
.cog-home a:focus-visible,
.cog-footer a:focus-visible,
.site-header a:focus-visible,
.main-navigation .menu-toggle:focus-visible{
  outline:3px solid var(--cog-brand);
  outline-offset:2px;
  border-radius:4px;
}
.cog-sr{
  position:absolute !important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}
@media (prefers-reduced-motion:reduce){
  .cog-card,.cog-img,.cog-evi{ transition:none; }
  .cog-card:hover{ transform:none; }
}


/* ==========================================================================
   ARTICOLO, ARCHIVIO E PAGINA
   v2 - 26 agosto 2026
   ========================================================================== */

/* --------------------------------------------------------------------------
   14. Briciole di pane
   -------------------------------------------------------------------------- */
.cog-briciole{ margin:0 0 16px; }
.cog-briciole ol{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  list-style:none;
  margin:0;
  padding:0;
  font-size:13.5px;
  color:var(--cog-muted);
}
.cog-briciole li{ display:flex; align-items:center; gap:6px; min-height:32px; }
.cog-briciole li + li::before{
  content:"/";
  color:var(--cog-bordo-forte);
}
.cog-briciole a{ color:var(--cog-muted); }
.cog-briciole a:hover{ color:var(--cog-brand); text-decoration:underline; }
.cog-briciole [aria-current]{ color:var(--cog-ink-2); }

/* --------------------------------------------------------------------------
   15. Impalcatura dell'articolo
   -------------------------------------------------------------------------- */.cog-articolo__testa{ margin:0 0 20px; }
.cog-articolo__titolo{
  font-size:clamp(27px,3.6vw,40px);
  font-weight:800;
  line-height:1.14;
  letter-spacing:-.02em;
  text-transform:none;
  margin:0 0 12px;
  text-wrap:balance;
}
.cog-meta--articolo{
  margin:0;
  padding-bottom:16px;
  border-bottom:1px solid var(--cog-bordo);
  font-size:14px;
}
.cog-aggiornato{ color:var(--cog-brand-scuro); font-weight:600; }

/* --------------------------------------------------------------------------
   16. Tipografia del corpo
   -------------------------------------------------------------------------- */
.cog-articolo__corpo{ font-size:17.5px; line-height:1.65; color:var(--cog-ink-2); }
.cog-articolo__corpo > *:first-child{ margin-top:0; }
.cog-articolo__corpo p{ margin:0 0 18px; }
.cog-articolo__corpo strong{ color:var(--cog-ink); font-weight:700; }
.cog-articolo__corpo a{ color:var(--cog-brand-scuro); text-decoration:underline; text-underline-offset:2px; }
.cog-articolo__corpo a:hover{ color:var(--cog-brand); }

.cog-articolo__corpo h2,
.cog-articolo__corpo h3,
.cog-articolo__corpo h4{
  color:var(--cog-ink);
  text-transform:none;
  letter-spacing:-.01em;
  text-wrap:balance;
}
.cog-articolo__corpo h2{ font-size:clamp(21px,2.4vw,26px); font-weight:800; line-height:1.2; margin:36px 0 14px; }
.cog-articolo__corpo h3{ font-size:19px; font-weight:700; line-height:1.25; margin:28px 0 10px; }
.cog-articolo__corpo h4{ font-size:17px; font-weight:700; margin:22px 0 8px; }

.cog-articolo__corpo ul,
.cog-articolo__corpo ol{ margin:0 0 18px; padding-left:22px; }
.cog-articolo__corpo li{ margin:0 0 8px; }
.cog-articolo__corpo li::marker{ color:var(--cog-brand); }

.cog-articolo__corpo img{ border-radius:var(--cog-r-m); }
.cog-articolo__corpo figure{ margin:24px 0; }

.cog-articolo__corpo table{ width:100%; border-collapse:collapse; margin:0 0 22px; }
.cog-articolo__corpo th,
.cog-articolo__corpo td{ padding:10px 12px; border-bottom:1px solid var(--cog-bordo); text-align:left; }
.cog-articolo__corpo th{ background:var(--cog-brand-tinta); font-weight:700; color:var(--cog-ink); }

/* --------------------------------------------------------------------------
   17. Riquadro dei passi
   -------------------------------------------------------------------------- */
.cog-passi{
  margin:28px 0;
  padding:24px 26px;
  border-radius:var(--cog-r-l);
  background:var(--cog-brand-tinta);
  border:1px solid var(--cog-bordo);
}
.cog-passi__lista{
  list-style:none;
  margin:0 !important;
  padding:0 !important;
  display:grid;
  gap:18px;
  counter-reset:none;
}
.cog-passi__voce{
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  gap:14px;
  align-items:start;
  margin:0 !important;
}
.cog-passi__numero{
  display:flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  border-radius:var(--cog-r-pill);
  background:var(--cog-brand);
  color:#fff;
  font-size:14px;
  font-weight:700;
  font-variant-numeric:tabular-nums;
}
.cog-passi__testo > *:last-child{ margin-bottom:0; }
.cog-passi__titolo{
  margin:2px 0 6px !important;
  font-size:17.5px !important;
  font-weight:700;
  line-height:1.3;
  color:var(--cog-ink);
}
.cog-passi__testo p{ margin-bottom:10px; font-size:16.5px; }

@media (max-width:520px){
  .cog-passi{ padding:18px 16px; }
  .cog-passi__voce{ grid-template-columns:26px minmax(0,1fr); gap:11px; }
  .cog-passi__numero{ width:26px; height:26px; font-size:13px; }
}

/* --------------------------------------------------------------------------
   18. Card delle domande frequenti
   -------------------------------------------------------------------------- */
.cog-faq{
  display:grid;
  gap:14px;
  margin:20px 0 28px;
  grid-template-columns:1fr;
}
@media (min-width:700px){ .cog-faq{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

.cog-faq__card{
  padding:18px 20px;
  border-radius:var(--cog-r-m);
  background:var(--cog-superficie);
  border:1px solid var(--cog-bordo);
  box-shadow:var(--cog-ombra);
}
.cog-faq__domanda{
  margin:0 0 8px !important;
  font-size:16.5px !important;
  font-weight:700;
  line-height:1.3;
  color:var(--cog-ink);
}
.cog-faq__risposta{ font-size:16px; color:var(--cog-ink-2); }
.cog-faq__risposta > *:last-child{ margin-bottom:0; }
.cog-faq__risposta p{ margin-bottom:10px; }

/* --------------------------------------------------------------------------
   19. Barra di disponibilita
   -------------------------------------------------------------------------- */
.cog-disponibilita{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin:0 0 24px;
  padding:14px 18px;
  border-radius:var(--cog-r-m);
  border:1px solid var(--cog-bordo);
  background:var(--cog-superficie);
}
.cog-disponibilita__etichetta{
  display:block;
  font-size:11px;
  font-weight:700;
  letter-spacing:.11em;
  text-transform:uppercase;
  color:var(--cog-muted);
}
.cog-disponibilita__valore{ font-size:16.5px; color:var(--cog-ink); }
.cog-disponibilita--scadenza{ border-color:#E9CF9E; background:var(--cog-scad-b); }
.cog-disponibilita--scadenza .cog-disponibilita__valore{ color:var(--cog-scad-t); }
.cog-disponibilita--chiusa{ background:var(--cog-chiusa-b); }
.cog-disponibilita--chiusa .cog-disponibilita__valore{ color:var(--cog-chiusa-t); }
.cog-disponibilita--attiva{ border-color:#B6DCC6; background:var(--cog-attiva-b); }
.cog-disponibilita--attiva .cog-disponibilita__valore{ color:var(--cog-attiva-t); }

/* --------------------------------------------------------------------------
   20. Offerte simili
   -------------------------------------------------------------------------- */@media (min-width:700px){ }

/* --------------------------------------------------------------------------
   21. Archivio di categoria
   -------------------------------------------------------------------------- */
.cog-archivio__testa{
  margin:0 0 26px;
  padding:24px 26px;
  border-radius:var(--cog-r-l);
  background:var(--cog-brand-tinta);
  border:1px solid var(--cog-bordo);
}
.cog-archivio__occhiello{
  margin:0 0 6px;
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--cog-brand-scuro);
}
.cog-archivio__testa h1{
  margin:0;
  font-size:clamp(26px,3.4vw,38px);
  font-weight:800;
  line-height:1.12;
  letter-spacing:-.02em;
  text-transform:none;
}
.cog-archivio__intro{
  margin:10px 0 0;
  max-width:70ch;
  font-size:16.5px;
  color:var(--cog-ink-2);
}
.cog-archivio__conteggio{
  margin:12px 0 0;
  font-size:14px;
  color:var(--cog-muted);
  font-variant-numeric:tabular-nums;
}
@media (max-width:520px){
  .cog-archivio__testa{ padding:18px 16px; }
}

/* GeneratePress avvolge l'archivio in .generate-columns-container, che ha un
   margine negativo per le gronde delle colonne: l'archivio non usa quelle
   colonne, quindi il margine va azzerato o la lista resta 20 px fuori asse. */
.category .generate-columns-container,
.archive .generate-columns-container,
.search .generate-columns-container,
.blog .generate-columns-container{
  margin-left:0;
  margin-right:0;
}

.cog-griglia--archivio{ margin-bottom:36px; }

.cog-archivio__testo{
  margin-top:44px;
  padding-top:28px;
  border-top:1px solid var(--cog-bordo);
  font-size:17px;
  line-height:1.65;
  color:var(--cog-ink-2);
  max-width:75ch;
}
.cog-archivio__testo h2{ font-size:22px; font-weight:800; margin:28px 0 12px; color:var(--cog-ink); text-transform:none; }
.cog-archivio__testo h3{ font-size:18.5px; font-weight:700; margin:22px 0 8px; color:var(--cog-ink); text-transform:none; }
.cog-archivio__testo a{ color:var(--cog-brand-scuro); text-decoration:underline; }


/* Paginazione */
.cog-archivio .nav-links,
.paging-navigation .nav-links,
.pagination .nav-links{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  justify-content:center;
}
.cog-archivio .nav-links .page-numbers,
.paging-navigation .page-numbers,
.pagination .page-numbers{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:44px;
  min-height:44px;
  padding:0 12px;
  border-radius:var(--cog-r-s);
  border:1px solid var(--cog-bordo-forte);
  background:var(--cog-superficie);
  color:var(--cog-ink-2);
  font-weight:600;
  font-variant-numeric:tabular-nums;
  text-decoration:none;
}
.cog-archivio .nav-links a.page-numbers:hover,
.paging-navigation .page-numbers:hover,
.pagination .page-numbers:hover{
  border-color:var(--cog-brand);
  color:var(--cog-brand);
}
.cog-archivio .nav-links .page-numbers.current,
.paging-navigation .page-numbers.current,
.pagination .page-numbers.current{
  background:var(--cog-brand);
  border-color:var(--cog-brand);
  color:#fff;
}
.cog-archivio .nav-links .page-numbers.dots,
.paging-navigation .page-numbers.dots,
.pagination .page-numbers.dots{ border-color:transparent; background:transparent; min-width:24px; }

/* --------------------------------------------------------------------------
   22. Pagina statica
   -------------------------------------------------------------------------- */
.cog-pagina__corpo{ font-size:17.5px; }
.cog-pagina__corpo h2{ margin-top:34px; }

.cog-paginazione-articolo{
  margin:24px 0 0;
  font-size:15px;
  color:var(--cog-muted);
}


/* --------------------------------------------------------------------------
   23. Ricerca, 404 e vicoli ciechi
   -------------------------------------------------------------------------- */
.cog-ricerca{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
  max-width:560px;
}
.cog-ricerca input[type="search"]{
  flex:1 1 200px;
  min-width:0;
  min-height:44px;
  padding:11px 16px;
  border-radius:var(--cog-r-pill);
  /* Bordo scuro: quello chiaro su fondo rosa della testata dava 1,5:1,
     sotto il minimo di 3:1 per il contorno di un campo. */
  border:1px solid #A88095;
  background:var(--cog-superficie);
  color:var(--cog-ink);
  font-size:16px;
  font-family:inherit;
  -webkit-appearance:none;
  appearance:none;
}
.cog-ricerca input[type="search"]::placeholder{ color:var(--cog-muted); }
.cog-ricerca input[type="search"]:focus-visible{
  outline:3px solid var(--cog-brand);
  outline-offset:1px;
  border-color:var(--cog-brand);
}
.cog-ricerca .cog-btn{ cursor:pointer; flex:0 0 auto; }
/* GeneratePress ha button:focus con specificita 0,1,1 e cambierebbe colore
   al bottone: qui lo teniamo nella palette. */
.cog-ricerca button.cog-btn:focus,
.cog-ricerca button.cog-btn:hover{
  background:var(--cog-brand-scuro);
  border-color:var(--cog-brand-scuro);
  color:#fff;
}

.cog-scorciatoie{ margin-top:36px; }
.cog-scorciatoie h2{
  margin:0 0 14px;
  font-size:17px;
  font-weight:700;
  color:var(--cog-ink);
  text-transform:none;
}
.cog-scorciatoie__lista{ display:flex; flex-wrap:wrap; gap:10px; }
.cog-scorciatoie a{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:0 16px;
  border-radius:var(--cog-r-pill);
  border:1px solid var(--cog-bordo-forte);
  background:var(--cog-superficie);
  color:var(--cog-ink-2);
  font-size:15px;
  font-weight:600;
}
.cog-scorciatoie a:hover{
  border-color:var(--cog-brand);
  background:var(--cog-brand-tinta);
  color:var(--cog-brand-scuro);
}

.cog-vuoto{
  padding:26px;
  margin-top:4px;
  border-radius:var(--cog-r-l);
  border:1px solid var(--cog-bordo);
  background:var(--cog-superficie);
  color:var(--cog-ink-2);
}
.cog-vuoto h2{
  margin:0 0 8px;
  font-size:20px;
  font-weight:800;
  color:var(--cog-ink);
  text-transform:none;
}
.cog-vuoto p{ margin:0; font-size:16.5px; max-width:70ch; }
.cog-vuoto em{ color:var(--cog-ink); font-style:normal; font-weight:600; }

.cog-404 .cog-sezione{ margin-top:44px; }

/* Anello di focus su tutto il contenuto, non solo su testata e home. *//* Le briciole restano compatte ma raggiungibili col dito. */

/* ============================================================
   24. Fondo articolo: blocco offerte texlink e precedente/successivo
   ============================================================ */

.cog-texlink{
  margin:40px 0 0;
  padding:22px 22px 24px;
  background:var(--cog-brand-tinta);
  border:1px solid var(--cog-bordo-forte);
  border-radius:12px;
}
.cog-texlink__titolo{
  margin:0;
  font-size:22px;
  line-height:1.25;
  color:var(--cog-ink);
}
.cog-texlink__sotto{
  margin:6px 0 0;
  font-size:15px;
  color:var(--cog-muted);
}
.cog-texlink__lista{
  display:grid;
  gap:12px;
  margin-top:16px;
}
.cog-texlink__voce{
  display:flex;
  align-items:center;
  gap:16px;
  padding:14px;
  background:#fff;
  border:1px solid var(--cog-bordo);
  border-radius:10px;
  text-decoration:none;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.cog-texlink__voce:hover,
.cog-texlink__voce:focus-visible{
  border-color:var(--cog-brand);
  box-shadow:0 6px 18px -12px rgba(217,0,111,.45);
}
.cog-texlink__media{
  flex:0 0 76px;
  width:76px;
}
.cog-texlink__media .cog-img{ border-radius:8px; }
.cog-texlink__testi{
  display:flex;
  flex-direction:column;
  gap:3px;
  min-width:0;
}
.cog-texlink__nome{
  font-size:16.5px;
  line-height:1.3;
  color:var(--cog-ink);
}
.cog-texlink__voce:hover .cog-texlink__nome{ color:var(--cog-brand-scuro); }
.cog-texlink__descrizione{
  font-size:14px;
  line-height:1.45;
  color:var(--cog-ink-2);
}
.cog-texlink__cta{ margin-top:5px; }

.cog-nav-articoli{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin:28px 0 0;
}
.cog-nav-articoli__voce{
  display:flex;
  align-items:center;
  gap:14px;
  padding:12px;
  background:#fff;
  border:1px solid var(--cog-bordo);
  border-radius:10px;
  text-decoration:none;
  min-width:0;
  transition:border-color .15s ease;
}
.cog-nav-articoli__voce:hover,
.cog-nav-articoli__voce:focus-visible{ border-color:var(--cog-bordo-forte); }
.cog-nav-articoli__voce--succ{ flex-direction:row-reverse; text-align:right; }
.cog-nav-articoli__media{
  flex:0 0 64px;
  width:64px;
}
.cog-nav-articoli__media .cog-img{ border-radius:8px; }
.cog-nav-articoli__testi{
  display:flex;
  flex-direction:column;
  gap:3px;
  min-width:0;
}
.cog-nav-articoli__voce--succ .cog-nav-articoli__testi{ align-items:flex-end; }
.cog-nav-articoli__etichetta{
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--cog-brand);
}
.cog-nav-articoli__titolo{
  font-size:14.5px;
  line-height:1.35;
  color:var(--cog-ink-2);
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.cog-nav-articoli__voce:hover .cog-nav-articoli__titolo{ color:var(--cog-ink); }
.cog-nav-articoli__vuoto{ display:block; }

@media (max-width:600px){
  .cog-nav-articoli{ grid-template-columns:1fr; }
  .cog-nav-articoli__vuoto{ display:none; }
  .cog-texlink{ padding:18px 16px 20px; }
  .cog-texlink__voce{ gap:12px; padding:12px; }
  .cog-texlink__media{ flex-basis:64px; width:64px; }
}
