﻿/* RESET & BASE */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  background:#fff;
  line-height:1.6;
  color:#000;
}

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

/* 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;
}

/* TIPOGRAFIA */
h1,h2,h3{
  line-height:1.2;
  margin:1.2rem 0 .5rem;
  font-weight:400;
}
h1{
  font-size:1.6rem;
  color:#1e4f91;
  text-align:center;
  border-bottom:1px solid #234e70;
  padding-bottom:.5rem;
  font-weight:300;
}
h2{font-size:1.375rem;color:#1e4f91}
h3{font-size:1.2rem;color:#1e4f91}
h3.home{text-align:center}
.highlight{color:#1e4f91}
p.centra{text-align:center}
p.nota{font-size:.95rem;color:#555}

/* HEADER VIASETTI  versione snella */
header.header-viasetti{padding-top:0rem}
.header-wrap{
  max-width:800px;
  margin:0 auto;
  padding:.2rem 1rem;
  display:flex;
  gap:.75rem;
  align-items:center;
  background:#fff;
  border:1px solid #ddd;
  border-radius:12px;
}
.header-text{flex:1}
.titolo-header{
  font-size:1.8rem;
  font-weight:700;
  color:#1e4f91;
  margin:0;
}
.sottotitolo-header{
  font-size:.9rem;
  color:#555;
  line-height:1.4;
}
.header-wrap img {
  width: 70px;
  height: 70px;
  object-fit: contain;
  background: #fff;   /* evita bordi strani */
  padding: 2px;       /* opzionale: evita che tocchi il bordo */
}

/* 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;
  color:#FFFFCC;
}
.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;
}

/* 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: "▼" }
details[open] summary::after { content: "▲" }


/* 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:.2em;
  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 #008000;
  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;
}
.didascalia p{
  font-size:.7rem;
  margin-top: 0;
  padding-top: 0;
}

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

/* BADGE PAGESPEED RINNOVATI */
.psi-badges-new {
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 1.4rem;
}
.psi-badge {
  background: #fff;
  border: 2px solid #1e4f91;
  border-radius: 10px;
  padding: 1rem .8rem .8rem;
  min-width: 130px;
  flex: 1 1 110px;
  max-width: 155px;
  text-align: center;
  box-shadow: 0 2px 8px rgba(30,79,145,.12);
  transition: transform .2s, box-shadow .2s;
}
.psi-badge:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 18px rgba(30,79,145,.18);
}
.psi-badge__numero {
  display: block;
  font-size: 2.8rem;
  font-weight: 700;
  color: #006600;
  line-height: 1;
  margin-bottom: .4rem;
}
.psi-badge__barra {
  height: 5px;
  background: #e0e0e0;
  border-radius: 3px;
  overflow: hidden;
  margin: .4rem 0 .55rem;
}
.psi-badge__barra span {
  display: block;
  height: 100%;
  background: #006600;
  border-radius: 3px;
  width: 0;
  animation: cresci .9s ease forwards;
}
.psi-badge:nth-child(1) .psi-badge__barra span { animation-delay: .1s; }
.psi-badge:nth-child(2) .psi-badge__barra span { animation-delay: .25s; }
.psi-badge:nth-child(3) .psi-badge__barra span { animation-delay: .4s; }
.psi-badge:nth-child(4) .psi-badge__barra span { animation-delay: .55s; }
@keyframes cresci { to { width: 100%; } }
.psi-badge__etichetta {
  font-size: .78rem;
  color: #234e70;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
}
@media (max-width: 500px) {
  .psi-badge { min-width: 90px; padding: .8rem .5rem .6rem; }
  .psi-badge__numero { font-size: 2.2rem; }
}

/* ICON BAR */
.icon-bar{
  position:fixed;
  bottom:5px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:.8rem;
  padding:.625rem 1.25rem;
  width:91%;
  max-width:760px;
  background-color:#FFFFFF;
  z-index:999999;
}
.icon-bar img{
  width:52px;height:52px;
  transition:opacity .9s;
}
.icon-bar a:hover img{opacity:.6  
}


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