/* RESET & BASE */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}

body {
  background: #fbfbfb;
  font-family: Georgia, serif;
  color: #1a1a1a;
  letter-spacing: 0.15px;
  margin:7px;
  box-shadow: 0 0 20px rgba(0,0,0,0.08);
  border-radius: 10px;
}

/* LAYOUT GENERALE */
#pagina{margin:0 auto;background:#fff}
.sezione{padding:0rem 0}
.contenuto {
  width:90%;
  max-width:760px;
  margin:0 auto;
  font-size:1.1rem;
}
.bg-chiaro{background:#EAFFF4}
.bg-scuro{background:#D5FFEA}
.bg-bianco{background:#fff}

strong {
color:#0858c3;
}

h1 {
  font-size: 1.8rem;
  color: #1e4f91;
  border-bottom: 1px solid #8b0000;
  padding-bottom: .4rem;
  font-weight: 300;
  letter-spacing: 0.5px;
  font-family: Georgia, serif;
  text-align:center;
}

h2 {
  font-size: 1.6rem;
  color: #333;
  margin-top: 1.8rem;
}

h3 {
  font-size: 1.45rem;
  color: #0858c3;
}

/* TIPOGRAFIA */
h1,h2,h3{
  line-height:1.2;
  margin:1.2rem 0 .5rem;
  font-weight:400;
}

h3.home{text-align:center}
.highlight{color:#008000}
p.centra{text-align:center}
p.nota{font-size:.55rem;color:#555}
p.note{font-size: 8pt;color:#000}


/* Contenitore generale dell’header */
.header-viasetti {
  padding-top: 0;          /* Nessuno spazio sopra l’header (aderisce al bordo superiore della sezione) */
}

/* Spazio sotto l’header per separarlo dal contenuto successivo */
header.header-viasetti {
  margin-bottom: .6rem;   /* Distacco visivo tra box header e testo della pagina */
}

/* Box bianco che contiene logo + titolo + sottotitolo */
.header-wrap {
  max-width: 1000px;       /* Larghezza massima del box (così non si allarga troppo su schermi grandi) */
  margin: 0 auto;          /* Centra il box orizzontalmente */
  padding: .3rem 1.25rem;   /* Spazio interno: top/bottom 1rem, left/right 1.25rem */
  display: flex;           /* Dispone logo e testo affiancati */
  gap: .75rem;             /* Spazio orizzontale tra logo e blocco testo */
  align-items: center;     /* Allinea verticalmente logo e testo al centro */
  background: #fff;        /* Sfondo bianco del box */
  border: 1px solid #ddd;  /* Bordo grigio chiaro */
  border-radius: 12px;     /* Angoli arrotondati del box */
}

/* Logo */
.logo-viasetti {
  width: 90px;             /* Larghezza fissa del logo */
  height: 90px;            /* Altezza fissa del logo */
  object-fit: contain;     /* Mantiene le proporzioni del logo senza tagliarlo */
  background: #fff;        /* Sfondo bianco per evitare artefatti */
  padding: 2px;            /* Micro-spazio interno per evitare che tocchi il bordo */
}

/* Contenitore del testo (titolo + sottotitolo) */
.header-text { 
  flex: 1;					 /* Occupa tutto lo spazio disponibile a destra del logo */            
}

/* Titolo dell’header */
.titolo-header {
  font-size: 1.7rem;       /* Dimensione del titolo */
  font-weight: 400;  	   /* Peso del font (medio) */      
  color: #1e4f91;          /* Colore blu del brand */
  margin: 0;               /* Nessun margine esterno */
  line-height: .9;         /* Altezza della linea molto compatta (avvicina il sottotitolo) */
}

/* Sottotitolo dell’header */
.sottotitolo-header {
  font-size: .9rem;        /* Dimensione del sottotitolo */
  color: #555;             /* Grigio scuro */
  line-height: 1.2;        /* Altezza della linea compatta */
  margin-top: -1rem;       /* Avvicina il sottotitolo al titolo (scelta estetica precisa) */
  font-family: Arial;      /* Font del sottotitolo */
}

/* ACCESSIBILITÃ */
.visually-hidden{
  position:absolute;
  width:1px;height:1px;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.visually-hidden:focus,
.visually-hidden:active{
  position:static;
  width:auto;height:auto;
  margin:0;
  clip:auto;
  overflow:visible;
  padding:.5rem 1rem;
  background:#fff;
  border:2px solid #000;
  z-index:1000;
}


/* FOOTER */
.footer-viasetti-min{
  background:#234e70;
  color:#fff;
  padding:1.5rem 0 1rem;
  margin-top:2rem;
  font-size:.9rem;
}
.footer-viasetti-min .contenuto{
  max-width:800px;
  margin:0 auto;
  text-align:center;
}
.footer-viasetti-min a{
  color:#ffdd57;
  text-decoration:underline;
  font-weight:bold;
}
.footer-viasetti-min a:hover{font-weight:normal}
.footer-min-copy{
  margin-top:.8rem;
  font-size:.8rem;
  opacity:.9;
}
/* ARROTONDA LE IMMAGINI */
.foto-tonda {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: 1px solid #1e4f91;
    box-shadow: 0 2px 8px rgba(0,0,0,.15); /* FACOLTATIVO */
    object-fit: cover;
    float: left;
    margin: 0 20px 10px 0;}
        
    /* non arrotonda il logo */
.foto-logo {
    
    max-lengh 700px;
    width: 100px;
    height: 100px;
    object-fit: cover;
    float: left;
    margin: 0 20px 10px 0;}

    
/* ANNULLA IL FLOAT:LEFT */    
.clear {
    clear: both;
}



/* TESTIMONIANZE */
.testimonial{
  display:flex;
  gap:15px;
  background:#f3f7fa;
  border:1px solid #ddd;
  padding:15px;
  margin:15px auto;
  border-radius:6px;
  max-width:800px;
}
.testimonial-photo{
  width:80px;height:80px;
  border-radius:50%;
  object-fit:cover;
}
.testimonial-author{font-size:1.1em;color:#234e70}
.testimonial-excerpt{font-style:italic;color:#555}
details summary{
  color:#234e70;
  cursor:pointer;
  font-weight:bold;
}
details summary::after {
  content: "\25BC";
  float: right;
}

details[open] summary::after {
  content: "\25B2";
}
/* ELENCHI PERSONALIZZATI */
ul[class^="elenco-"]{
  list-style:none;
  margin:1.8rem 0 1rem;
  padding:0;
}
ul[class^="elenco-"] li{
  position:relative;
  padding-left:1.8em;
  margin:.4em 0;
  padding-bottom:.25rem;
}
ul[class^="elenco-"] li::before{
  position:absolute;
  left:0;top:0em;
  font-weight:700;

}
ul.elenco-check li::before{content:"\2705"}
ul.elenco-rombo li::before{content:"\1F539"}
ul.elenco-dito li::before{content:"\1F449"}
ul.elenco-desideri li::before{content:"\2605"}
ul.elenco-no li::before{content:"\274C"}

/* CTA */
.cta-gruppo{
  display:flex;
  gap:.75rem;
  flex-wrap:wrap;
  margin:1.25rem 0;
}
.cta-bottone{
  display:inline-block;
  padding:.625rem 1.125rem;
  background:#1e4f91;
  color:#fff;
  text-decoration:none;
  font-size:.95rem;
  font-weight:600;
  border-radius:.6rem;
  transition:.25s;
}
.cta-bottone:hover{
  background:#163a6b;
  transform:translateY(-2px);
}

/* RIQUADRO BIANCO */
.highlight-box {
  background: #fff;
  color: #234e70;
  padding: 0px 10px;
  border-radius: 14px;
  font-weight: normal;
  border: 1px solid #ccc;
  text-align: left;
}

/* BOX INFO */
.box-info{
  border:1px solid #0858c3;
  border-left-width:6px;
  border-radius:12px;
  padding:.9rem 1.2rem;
  margin:1.5rem 0;
  background:#FFF7C4;
}
.box-info h3{
  margin:0 0 .4rem;
  font-size:1.2rem;
  font-weight:bold;
  color:#1B5E20;
}

.box-info p{margin:0;font-size:1rem;line-height:1.5}


/* ==========================================
   TABELLA 2 colonne
   ========================================== */

.team-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 0.5rem;
}

.team-table td {
  vertical-align: top;
  padding: 3px 4px;
}

/* Lista approfondimenti (spazio extra tra i link) */
.lista-approfondimenti li {
  margin-bottom: 1rem;
}


/* ICON BAR */
.icon-bar{
  position:fixed;
  bottom:5px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:.3rem;
  padding:.625rem 1.25rem;
  width:85%;
  max-width:800px;
  background:rgba(255,255,255,.7);
  border:1px solid #6ba3f6;
  border-radius:20px;
  z-index:999999;
}
.icon-bar img{
  width:52px;height:52px;
  transition:opacity .2s;
}
.icon-bar a:hover img{opacity:.6  
}

.book-nav {
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:0 20px;
    margin:10px 0;
}

/* COOKIE BANNER */
#cookie-banner{
  position:fixed;
  left:16px;
  right:16px;
  bottom:16px;
  width:auto;
  max-width:980px;
  margin:0 auto;
  padding:18px 20px;
  background:#0b1f5c;
  color:#fff;
  font-size:17px;
  line-height:1.5;
  display:none;
  border:1px solid #ffdd57;
  border-radius:18px;
  box-shadow:0 10px 30px rgba(0,0,0,.22);
  z-index:2147483647;
}

#cookie-banner .cookie-link{
  color:#ffdd57;
  text-decoration:underline;
  text-underline-offset:2px;
}

#cookie-banner .cookie-buttons{
  display:block;
  margin-top:16px;
  text-align:left;
}

#cookie-banner .cookie-btn{
  display:inline-block;
  min-width:140px;
  padding:12px 22px;
  border-radius:999px;
  cursor:pointer;
  font-size:17px;
  font-weight:700;
  line-height:1.2;
  transition:all .2s ease;
}

.cookie-btn-accept{
  margin:0 10px 8px 0;
  border:none;
  background:#ffdd57;
  color:#234e70;
}

.cookie-btn-reject{
  margin:0 0 8px 0;
  border:2px solid #ffdd57;
  background:transparent;
  color:#ffdd57;
}

.cookie-btn-accept:hover,
.cookie-btn-accept:focus{
  transform:translateY(-1px);
}

.cookie-btn-reject:hover,
.cookie-btn-reject:focus{
  background:rgba(255,221,87,.10);
}

.cookie-settings-paragrafo{
  text-align:center;
  font-size:16px;
  margin:20px 0 110px;
}

.cookie-settings-link{
  color:#234e70;
  text-decoration:underline;
  cursor:pointer;
}

@media (max-width:640px){
  #cookie-banner{
    left:10px;
    right:10px;
    bottom:10px;
    padding:16px 14px;
    font-size:16px;
    border-radius:14px;
  }

  #cookie-banner .cookie-buttons{
    margin-top:14px;
  }

  #cookie-banner .cookie-btn{
    display:block;
    width:100%;
    min-width:0;
    margin:0 0 10px 0;
    padding:13px 18px;
    font-size:16px;
  }

  .cookie-settings-paragrafo{
    margin:20px 0 135px;
  }
}

/* RESPONSIVE */
@media(max-width:700px){
  .header-wrap img{width:90px;height:90px}
  .cta-gruppo{flex-direction:column;gap:.625rem}
  .cta-bottone{
    text-align:center;
    padding:.75rem;
    font-size:1.3rem;
  }
  .psi-badges .ring{
    width:55px;height:55px;
    font-size:18px;
  }
   .icon-bar img{
  width:37px;height:37px;
}
}


/* Nasconde il relativo pulsante nella sua pagina */
.is-home .nav-buttons .btn-home {
  display: none !important;
}

.is-menu .nav-buttons .btn-menu {
  display: none !important;
}

/* Link stile “oggetto proibito” */
a {
  color: #8b0000;
  text-decoration: none;
  font-weight: 500;
  transition: .2s;
}

a:hover {
  color: #b30000;
  text-decoration: underline;
}

/* Paragrafi più ariosi */
.contenuto p {
  font-size: 1.17rem;
  line-height: 1.78;
}

/* Box stile “oggetto speciale” */
.highlight-box {
  background: #fff;
  border: 1px solid #c9b27c;
  color: #333;
  padding: 1rem;
  border-radius: 10px;
  box-shadow: 0 0 8px rgba(0,0,0,.05);
}
  #pagina {
  background: #ffffff;
  border: 1px solid #d8d0c0;
  box-shadow: 0 0 20px rgba(0,0,0,0.08);
  max-width: 1000px;  /* larghezza della pagina */
  margin: 0 auto;
  padding: 4px 10px; /* spazio sopra e dx-sx la pagina */
  background: url('img/sfondo-chiaro.png') repeat;
  background-size: 20px 20px;
  border-radius: 10px;

}
/* Larghezza massima del contenuto */
.contenuto {
  max-width: 800px;
  margin: 0 auto;
}
.torna-su {
  text-align: right;
  margin-top: 40px;
  margin-right: 10px;
}

.torna-su a {
  font-size: 14px;
  color: #666;
  text-decoration: none;
}

.torna-su a:hover {
  text-decoration: underline;
}

.torna-su svg {
  margin-right: 4px;
}