/* =====================
   Page-specific styles
   ===================== */

.contact-section {
  position: relative;
  z-index: 1
}

.contact-section .dots {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: url(../img/bg-dots.png) 0 0 repeat;
  z-index: -1
}

.contact-info h3 {
  line-height: 28px
}

.contact-info h4 {
  font-size: 15px;
  line-height: 28px
}

.contact-info span {
  text-transform: uppercase;
  margin-right: 5px
}

.form-control {
  background-color: #fff;
  border-radius: 0;
  padding: 15px 10px;
  box-shadow: none
}

.form-control:focus {
  border-color: #2EC4B6;
  box-shadow: none;
  outline: none
}

#form-messages {
  display: none
}

#form-messages.alert-danger,
#form-messages.alert-success {
  display: block
}

#google-map {
  width: 100%;
  height: 400px
}

.timeline-section { padding-top: 40px; padding-bottom: 40px; background: #fff; }
.timeline-title { font-size: clamp(28px, 4vw, 44px); margin: 0; }
.timeline-payoff { font-style: italic; opacity: .85; margin: 6px 0 0; }
.timeline-sub { letter-spacing: .06em; margin: 4px 0 18px; }
.timeline-figure { margin: 0 auto; max-width: 1000px; }
.timeline-img { width: 100%; height: auto; display: block; border-radius: 6px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; }

  /* --- Desktop base (>=992px) --- */
  .about-us .timeline-col img {
    max-width: 80%;
    display: block;
    margin: 0 auto 20px;
  }
.about-us h2{ font-size:2rem; font-weight:600; margin-bottom:1rem; color:#000; }
.about-us p{ font-size:1rem; line-height:1.7; color:#333; text-align:justify; margin-bottom:1rem; }
.about-us strong{ color:#2EC4B6; font-weight:600; }


  /* --- Tablet & Mobile (<992px) --- */


  /* --- Schermi piccoli (<576px) --- */


  .about-us:before {
    content: none !important;
  }
  .about-us {
    background: none !important;
    background-color: #fff !important;
  }

  /* --- Header timeline --- */
.ev-tl-head { text-align:center; margin-bottom: 12px; }
.ev-tl-brand { font-size: 34px; letter-spacing: .02em; margin: 0; }
.ev-tl-payoff { margin: 2px 0 0; font-variant: small-caps; opacity:.85; }
.ev-tl-title { margin: 6px 0 10px; letter-spacing:.06em; }

  /* --- Lista timeline --- */
  .ev-tl {
    position: relative;
    list-style: none;
    margin: 10px 0 0;
    padding: 0 0 0 32px; /* spazio per linea e pallini */
  }

  /* linea verticale */
  .ev-tl::before {
    content: "";
    position: absolute;
    left: 12px;
    top: 0;
    bottom: 0;
    width: 3px;
    background: #2EC4B6;
    border-radius: 2px;
  }

  /* ogni evento */
.ev-tl > li { position: relative; margin: 26px 0 30px; }

  /* pallino (icona monocromatica semplificata) */
  .ev-tl > li::before {
    content: "";
    position: absolute;
    left: -2px;
    top: 6px;
    width: 26px; height: 26px;
    background: #2EC4B6;
    border-radius: 50%;
    box-shadow: 0 0 0 3px #fff inset;
  }

  /* anno, titolo, testo */
.ev-tl-year { font-weight: 600; font-size: 18px; margin-bottom: 2px; }
.ev-tl-item-title { font-size: 20px; margin: 0 0 6px; }
  .ev-tl-text {
    margin: 0;
    font-size: 15px;
    line-height: 1.6;
    text-align: justify;
    hyphens: none;           /* niente sillabazione */
    word-break: normal;
    overflow-wrap: normal;   /* evita spezzature arbitrarie */
  }

  /* Colonna timeline: larghezza e centratura della “figura” */
.timeline-col { padding-right: 18px; }


  /* Evidenziazioni coerenti con brand */
.about-us strong { color:#2EC4B6; font-weight:600; }

  /* (Se avevi overlay grigio su .about-us) neutralizzalo qui */
.about-us::before { content: none !important; }

  /* Header tipografico */
.ev-head{ text-align:center; margin:0 0 6px }
.ev-brand{ font-family: Georgia, "Times New Roman", serif; font-size:36px; letter-spacing:.02em; margin:0 }
.ev-payoff{ font-variant: small-caps; opacity:.85; margin:4px 0 0 }
.ev-title{ letter-spacing:.08em; margin:6px 0 0 }

  /* Struttura timeline */
.ev-tl{ list-style:none; margin:14px 0 0; padding:0; position:relative }
.ev-tl::before{ content:""; position:absolute; left:128px; top:0; bottom:0; width:3px; background:#2EC4B6; border-radius:2px }

  /* Item */
.ev-item{ display:grid; grid-template-columns:110px 1fr; column-gap:24px; position:relative; padding:18px 0 }

  /* Anno */
.ev-year{ font-weight:600; font-size:20px; text-align:right; padding-right:8px }

  /* Corpo item + nodo */
.ev-body{ position:relative }
  .ev-node {
    position: absolute; left:-40px; top:2px;
    width: 32px; height:32px; border-radius:50%;
    background: #2EC4B6; display:grid; place-items:center
  }
.ev-node svg{ width:18px; height:18px }

  /* Titolo + testo */
.ev-item-title{ font-size:20px; margin:0 0 6px; font-weight:700; color:#233; }
.ev-text{ margin:0; font-size:15px; line-height:1.65; text-align:justify; hyphens:none; word-break:normal; overflow-wrap:normal }

  /* Responsive */


  /* Neutralizza eventuale overlay esistente */
.about-us::before{ content:none !important; }

  /* Desktop */
.about-us .timeline-col img{ max-width:80%; display:block; margin:0 auto 20px; }
.about-us h2{ font-size:2rem; font-weight:600; margin-bottom:1rem; color:#000; }
.about-us p{ font-size:1rem; line-height:1.7; color:#333; text-align:justify; margin-bottom:1rem; }
.about-us strong{ color:#2EC4B6; font-weight:600; }

  /* Mobile/Tablet */



  /* neutralizza overlay vecchio tema + sfondo bianco */
.about-us::before{ content:none !important; }
.about-us{ background:none !important; background-color:#fff !important; }

  /* --- Sezione Team --- */
  .team-photo {
    width: 200px; height: 200px; object-fit: cover;
    border-radius: 999px; border: 3px solid #2EC4B6;
  }
.role { font-size:.95rem; }
.bio  { font-size:.98rem; line-height:1.65; }

.network-block { background:#fafafa; border:1px solid #eee; border-radius:10px; padding:16px; }
.partner-logos { display:flex; gap:16px; flex-wrap:wrap; align-items:center; }
.partner-logos img { filter: grayscale(100%); opacity:.9; height:50px; object-fit:contain; }

  /* Responsive fine-tuning */


.partner-logos { display:flex; flex-wrap:wrap; gap:16px; justify-content:center; }
.partner-img { max-height:50px; width:auto; filter: grayscale(100%); opacity:.9; transition: .2s ease; }
.partner-img:hover { filter:none; opacity:1; }

  /* --- NETWORK: 3 colonne --- */
  .partners-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 32px;
    align-items: center;
  }
  .partner-card {
    display: flex; align-items:center; justify-content:center;
    padding: 16px; border:1px solid #eee; border-radius:12px;
    background: #fff;
  }
  .partner-card img {
    max-height: 60px; width:auto; object-fit:contain;
    /* Monocromatico coerente */
    filter: grayscale(100%) contrast(110%) brightness(90%);
    opacity: .9; transition:opacity .2s ease, filter .2s ease;
  }
.partner-card:hover img{ opacity:1; }

  /* responsive */



    /* --- NETWORK (About) --- */

    /* layout: 1 col su mobile, 3 colonne da md in su */
    .partner-logos {
      display: grid;
      grid-template-columns: 1fr;
      gap: 28px;
      align-items: start;
    }


    /* card/logo */
    .partner-img {
      max-height: 64px;        /* uniforma l’altezza dei marchi */
      width: auto;
      object-fit: contain;
      display: inline-block;
      filter: grayscale(100%) contrast(112%) brightness(90%); /* monocromatico pulito */
      opacity: .92;
      transition: filter .2s ease, opacity .2s ease, transform .2s ease;
    }
    .partner-logos a:hover .partner-img {
      opacity: 1;
      transform: translateY(-1px);
      /* se vuoi restare sempre monocromatico, lascia la riga sotto così;
      se vuoi ri-colorare al hover, rimuovi il grayscale(100%) */
      filter: grayscale(100%) contrast(118%) brightness(96%);
    }

    /* testo sotto i loghi allineato e coerente */
    .partner-logos p.small {
      min-height: 4.5rem;      /* uniforma le altezze delle descrizioni */
      margin: 0;
      color: #6b7280;          /* grigio leggibile */
    }

    .partner-img {
      max-height: 64px;
      width: auto;
      object-fit: contain;
      display: inline-block;
      filter: grayscale(100%) contrast(112%) brightness(90%);
      opacity: .92;
      transition: filter .2s ease, opacity .2s ease, transform .2s ease;
    }
    .partner-logos a:hover .partner-img {
      opacity: 1;
      transform: translateY(-1px);
      filter: grayscale(100%) contrast(118%) brightness(96%);
    }

    /* testo sotto i loghi allineato e coerente */
    .partner-logos p.small {
      min-height: 4.5rem;
      margin: 0;
      color: #6b7280;
    }

    
    
    
    
    
    


    /* Chi siamo – fix mobile edges & CTA center */


    /* --- About: colonne e timeline responsive --- */

    /* L'immagine/SVG della timeline deve scalare */
    .timeline-figure img,
    .timeline-figure svg {
      display: block;
      max-width: 100%;
      width: 100%;
      height: auto;
    }

/* Evidenziazione morbida per frasi-chiave */
    .about-highlight {
      background: linear-gradient(transparent 60%, rgba(0,156,166,0.18) 60%);
      font-weight: 600;
    }

    /* Kicker anni/step */
    .year-kicker {
      font-size: 16px;
      letter-spacing: .5px;
      text-transform: uppercase;
      color: var(--evocons-primary);
      margin: 22px 0 6px;
    }

    /* Callout finale */
    .about-callout {
      background: #fff;
      border-radius: 10px;
      padding: 14px 16px;
      margin-top: 16px;
    }

    /* === ABOUT / STORIA AZIENDALE === */
    #storia-evocons {
      position: relative;
      z-index: 1;
    }

    #storia-evocons .about-side-img {
      width: 100%;
      margin-right: 20px; /* più respiro tra immagine e testo */
    }

    #storia-evocons .about-side-img img {
      width: 100%;
      height: auto;
      object-fit: contain;
      border-radius: 14px;
      box-shadow: 0 8px 22px rgba(0,0,0,0.12);
      background: #fff;
      padding: 8px;
    }

    #storia-evocons .about-text {
      max-width: 62ch;
      padding-left: 10px;
    }

    #storia-evocons .about-callout {
      background: #fff;
      padding: 18px 24px;
      border-radius: 12px;
      border-left: 4px solid var(--evocons-primary);
      margin-top: 26px;
    }

    #storia-evocons .about-highlight {
      color: var(--evocons-primary);
      font-weight: 600;
    }

    #storia-evocons .year-kicker {
      margin-top: 28px;
      color: var(--evocons-dark);
      font-weight: 700;
      font-size: 1.1rem;
    }

    /* Mobile: immagine sopra, testo sotto */


    /* === About: bilanciamento immagine/testo (layout 5/7) === */
  #storia-evocons .img-col { padding-right: 22px; }
  #storia-evocons .text-col { padding-left: 22px; }

    #storia-evocons .about-side-img {
      width: 100%;
      margin: 0;                 /* niente margini strani */
    }

    #storia-evocons .about-side-img img {
      display: block;
      width: 100%;
      height: auto;              /* proporzioni corrette */
      object-fit: contain;
      border-radius: 14px;
      background: #fff;
      padding: 8px;
      box-shadow: 0 8px 22px rgba(0,0,0,.12);
    }

    /* limita la dimensione massima dell'immagine su desktop grandi */



    /* allinea l’immagine verso il testo (a destra della colonna sinistra) */


    /* leggibilità testo: righe non troppo lunghe */
  #storia-evocons .about-text { max-width: 68ch; }

    /* mobile: padding più stretto e immagine centrata */

    /* HERO CON TESTO CHIARO */
    .hero-light {
      color: #ffffff;
    }

    .hero-light h1,
    .hero-light h2,
    .hero-light h6,
    .hero-light p,
    .hero-light span {
      color: #ffffff;
    }

    .hero-light .text-accent {
      color: #9ee2ff; /* leggero azzurro per sottotitoli o accenti */
    }

    .hero-light strong {
      color: #ffffff;
    }

    .hero-light p.lead {
      opacity: 0.92;
    }

    /* HERO & APPROCCIO — bilanciamento layout */
    .page-hero.about-hero {
      padding-top: 100px;
      padding-bottom: 80px;
    }

    .page-hero.about-hero .container {
      align-items: center;

    }

    .page-hero.about-hero h1 {
      font-size: 3rem;
      line-height: 1.2;
      margin-bottom: 24px;
    }

    .page-hero.about-hero p {
      font-size: 1.125rem;
      line-height: 1.6;
      max-width: 520px;
    }

    /* Immagine Hero */
    .page-hero.about-hero img {
      max-width: 95%;
      height: auto;
      border-radius: 16px;
      box-shadow: 0 8px 22px rgba(0,0,0,0.25);
    }

    /* Sezione Approccio — margini coerenti */
    #approccio {
      padding-top: 80px;
      padding-bottom: 80px;
    }

    #approccio img {
      max-width: 90%;
      margin-left: auto;
      margin-right: auto;
      border-radius: 16px;
      box-shadow: 0 8px 20px rgba(0,0,0,0.12);
    }

    /* =========================
    HERO & APPROCCIO — RESPONSIVE
    ========================= */

    /* ≤ 1200px (desktop medio) */


    /* ≤ 992px (tablet) */


    /* ≤ 768px (mobile grande) */


    /* ≤ 576px (mobile piccolo) */

    /* Mobile: non scendere troppo! */

    /* Paragrafo “lead” riutilizzabile dove serve */
  .lead { font-size: clamp(1.05rem, 0.98rem + 0.6vw, 1.25rem); line-height: 1.8; }

/*
  ================================================
  6. Slider Start
  ================================================
  */

  /* |------------[ Particle Slider ]-----------| */

  .particle-area {
    text-align: center;
    position: relative;
    background: url(../img/banner1.jpg);
    background-size: cover;
    z-index: 1;
    display: flex;
    align-items: center;
    height: 100vh;
  }
  #particles-js {
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%;
  }
  .banner-text {
    margin: 0 auto;
  }
  .header-menu-wrap .dl-menu li .active {
    color: #2EC4B6;
  }

/* === HERO SLIDER REFINEMENT - EVOCONS === */

    /* Ridimensiona titoli e testo per schermi mediograndi */
    #main-slider .slider-content .dl-caption.big div {
      font-size: clamp(2.2rem, 3vw + 1rem, 4rem);
      line-height: 1.15;
      font-weight: 700;
    }

    #main-slider .slider-content .dl-caption.medium div {
      font-size: clamp(1rem, 1.2vw + 0.6rem, 1.4rem);
      letter-spacing: 1px;
      text-transform: uppercase;
      font-weight: 500;
      opacity: 0.9;
    }

    #main-slider .slider-content .dl-caption.small div {
      font-size: clamp(1rem, 0.9vw + 0.5rem, 1.3rem);
      line-height: 1.5;
      font-weight: 400;
      max-width: 750px;
    }

    /* Maggiore respiro verticale tra blocchi */
    #main-slider .slider-content .dl-caption {
      margin-bottom: 1.2rem;
    }



    /* Overlay più marcato per contrasto */
    #main-slider .overlay {
      background-color: rgba(0, 0, 0, 0.55);
    }

    /* ========== HERO: RESPONSIVE TUNING ========== */

    /* Laptop / desktop medi (≤1200px) */


    /* Tablet orizzontale (≤992px) */


    /* Tablet verticale / phablet (≤768px) */


    /* Smartphone (≤576px) */


    /* Anti-overflow di sicurezza per titoli lunghi in tutte le viewport */
    #main-slider .slider-content .dl-caption.big div,
    #main-slider .slider-content .dl-caption.small div {
      overflow-wrap: break-word;
      word-break: break-word;   /* solo come fallback */
      hyphens: auto;
    }

    

    

    #main-slider .overlay {
      background-color: rgba(0,0,0,0.55);
    }