/* =========================================================
   VITAE EVENTI AGENCY — Stylesheet
   ========================================================= */

:root{
  --accento:#6c6716;        /* colore pieno al posto della gradient */
  --accento-scuro:#4a470f;
  --filetto-avorio:#e9dfb2; /* filetto sottile giallo avorio */
  --grigio-chiarissimo:#faf9f4;
  --ivory:#f5f2e6;
  --grigio-chiaro:#efeee8;
  --grigio-chiaro-bordo:#e4e2d8; /* filetti icone, molto chiaro */
  --grigio-medio:#8a8a82;
  --grigio-scuro:#3a3a35;
  --bianco:#ffffff;
  --testo:#2c2c28;
  --radius-box: 22px;
  --radius-pill: 60px;
  --shadow-soft: 0 10px 30px rgba(50,45,10,0.08);
}

html{scroll-behavior:smooth;}

body{
  font-family:'Lato',sans-serif;
  font-weight:300;
  color:var(--testo);
  background:var(--bianco);
  overflow-x:hidden;
}

main{
  position:relative;
  z-index:1;
  background:#fff;
  display:block;
}

h1,h2,h3,h4,h5,.font-title{
  font-family:'Roboto Slab',serif;
  font-weight:500;
  color:var(--grigio-scuro);
}

h1{font-weight:200;}
h2{font-size:2.6rem;}
h3{font-size:1.7rem;}
h4{font-size:1.5rem;}

strong,b,.fw-bold{font-weight:700;}

a{color:var(--accento); text-decoration:none;}
a:hover{color:var(--accento-scuro);}

p{text-align:justify;}

/* ============ TITOLI / DIVISORI ============ */
.section-title{
  position:relative;
  margin-bottom:2.2rem;
  padding-bottom:1.6rem;
}
.section-title::after{
  content:"";
  position:absolute;
  left:0; bottom:0;
  width:70px; height:2px;
  background:var(--accento);
}
.text-center .section-title::after{
  left:50%; transform:translateX(-50%);
}

.eyebrow{
  text-transform:uppercase;
  letter-spacing:2px;
  font-size:.8rem;
  font-weight:700;
  color:var(--accento);
  text-align:left;
}
.text-center .eyebrow{text-align:center;}

.gold-text{
  color:var(--accento);
}

.section-alt{
  background:var(--ivory);
}

.section-py{
  padding-top:5.5rem;
  padding-bottom:5.5rem;
}

.section-py-lg{
  padding-top:7.5rem;
  padding-bottom:7.5rem;
}

.thin-gold-rule{
  height:2px;
  width:100%;
  background:var(--accento);
  opacity:.9;
  border:none;
}

/* ============ SEZIONE SCURA "IN NEGATIVO" ============ */
.section-dark{
  background:var(--grigio-scuro);
  color:#efeee2;
  position:relative;
  z-index:1;
  margin-top:2.5rem;
  box-shadow:inset 0 12px 24px -20px rgba(0,0,0,.6);
}
.section-dark h2,.section-dark h3,.section-dark h4,.section-dark h5{color:#fff;}
.section-dark .eyebrow{color:var(--filetto-avorio);}
.section-dark .section-title::after{background:var(--filetto-avorio);}
.section-dark p{color:#e4e1d3;}
.section-dark .icon-card{background:#fff;}
.section-dark .icon-card p, .section-dark .icon-card h5{color:var(--testo);}

/* ============ IMMAGINE FULL-BLEED TRA LE SEZIONI ============ */
.full-bleed-image{
  width:100%;
  height:420px;
  background-size:cover;
  background-position:center;
  background-attachment:scroll;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  overflow:hidden;
}
.full-bleed-image.parallax{
  background-attachment:fixed;
}
@media (max-width: 991.98px){
  .full-bleed-image.parallax{background-attachment:scroll;}
}
.full-bleed-image::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(20,18,10,.35) 0%, rgba(20,18,10,.55) 100%);
}
.full-bleed-content{
  position:relative;
  z-index:2;
  color:#fff;
  padding:0 1.5rem;
  max-width:800px;
}
.full-bleed-content .eyebrow{color:var(--filetto-avorio); text-align:center;}
.full-bleed-content h3{
  color:#fff;
  font-size:clamp(1.6rem, 3.6vw, 2.6rem);
  margin-bottom:.6rem;
  text-shadow:0 2px 16px rgba(0,0,0,.4);
}
.full-bleed-content p{
  color:#f2f0e6;
  font-size:clamp(1rem, 1.6vw, 1.15rem);
  font-weight:300;
  margin:0;
  text-align:center;
  text-shadow:0 2px 10px rgba(0,0,0,.4);
}
@media (max-width: 767.98px){
  .full-bleed-image{height:300px;}
}

/* ============ NAVBAR ============ */
.navbar-vitae{
  background:var(--grigio-scuro);
  border-bottom:1px solid var(--filetto-avorio);
  padding-top:.4rem;
  padding-bottom:.4rem;
  transition:all .3s ease;
}
.navbar-vitae .navbar-brand img{
  height:64px;
  transition:height .3s ease;
}
.navbar-vitae .navbar-nav{
  gap:.1rem;
}
.navbar-vitae .nav-link{
  font-family:'Roboto Slab',serif;
  font-weight:500;
  font-size:.82rem;
  letter-spacing:.2px;
  color:#e9e7dc;
  margin:0 .3rem;
  white-space:nowrap;
  position:relative;
}
.navbar-vitae .nav-link:hover,
.navbar-vitae .nav-link.active{
  color:var(--filetto-avorio);
}
.navbar-toggler{
  border:none;
  padding:.25rem .5rem;
  color:#fff;
}
.navbar-toggler i{color:#fff;}
.navbar-toggler:focus{box-shadow:none;}
.btn-nav-contatti{
  background:var(--accento);
  color:#fff !important;
  border-radius:var(--radius-pill);
  padding:.5rem 1.3rem !important;
  font-weight:700 !important;
  font-size:.82rem !important;
  margin-left:.5rem;
  transition:background .25s ease, color .25s ease;
}
.btn-nav-contatti:hover{
  background:#fff;
  color:#000 !important;
}

/* ============ HERO ============ */
.hero{
  position:relative;
  height:100vh;
  min-height:560px;
  width:100%;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:#fff;
}
.hero-slide{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  opacity:0;
  transition:opacity 1.8s ease-in-out;
  z-index:1;
}
.hero-slide.active{opacity:1; z-index:2;}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(20,18,10,.55) 0%, rgba(20,18,10,.35) 45%, rgba(20,18,10,.75) 100%);
  z-index:3;
}
.hero-content{
  position:relative;
  z-index:4;
  padding:0 1rem;
  max-width:900px;
}
.hero-content .eyebrow{color:var(--filetto-avorio); text-align:center;}
.hero-content h1{
  color:#fff;
  font-size:clamp(2.2rem, 5vw, 4rem);
  line-height:1.15;
  margin-bottom:1rem;
  text-shadow:0 2px 18px rgba(0,0,0,.35);
}
.hero-content p{
  font-size:clamp(1rem,2vw,1.25rem);
  font-weight:300;
  margin-bottom:1.8rem;
  text-shadow:0 2px 10px rgba(0,0,0,.35);
  text-align:center;
}
.hero-dots{
  position:absolute;
  bottom:28px;
  left:50%;
  transform:translateX(-50%);
  z-index:4;
  display:flex;
  gap:8px;
}
.hero-dots span{
  width:9px;height:9px;border-radius:50%;
  background:rgba(255,255,255,.5);
  cursor:pointer;
  transition:.3s;
}
.hero-dots span.active{background:var(--accento); width:24px; border-radius:6px;}

/* ============ BUTTONS ============ */
.btn-pill{
  border-radius:var(--radius-pill);
  padding:.75rem 2.1rem;
  font-weight:700;
  font-family:'Lato',sans-serif;
  border:none;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease;
}
.btn-gold{
  background:var(--accento);
  color:#fff;
}
.btn-gold:hover{
  color:#000;
  background:var(--filetto-avorio);
  transform:translateY(-2px);
  box-shadow:0 10px 22px rgba(108,103,22,.3);
}
.btn-outline-gold{
  background:transparent;
  border:2px solid var(--accento);
  color:var(--accento);
}
.btn-outline-gold:hover{
  background:var(--accento);
  color:#fff;
}

/* ============ BOXES / CARDS ============ */
.box-soft{
  background:#fff;
  border-radius:var(--radius-box);
  box-shadow:var(--shadow-soft);
  padding:2rem;
}
.icon-card{
  text-align:center;
  padding:2.4rem 1.4rem;
  border-radius:var(--radius-box);
  background:#fff;
  box-shadow:var(--shadow-soft);
  height:100%;
  transition:transform .25s ease;
}
.icon-card:hover{transform:translateY(-6px);}
.icon-card p{text-align:center;}
.icon-circle{
  width:92px;height:92px;
  border-radius:50%;
  background:transparent;
  border:1.5px solid var(--grigio-chiaro-bordo);
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 1.6rem;
  font-size:2.2rem;
  color:var(--accento);
}

/* ============ COMBINAZIONE ICONA + TITOLO ============ */
/* Regola generale: l'icona sta sopra, il titolo va a capo sotto,
   con spazio sufficiente a non farli sembrare attaccati. */
.icon-title{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}
.icon-title-start{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  text-align:left;
}
.icon-circle-sm{
  width:60px;height:60px;
  flex-shrink:0;
  border-radius:50%;
  background:transparent;
  border:1.5px solid var(--grigio-chiaro-bordo);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:1.1rem;
  font-size:1.5rem;
  color:var(--accento);
}
.icon-title h4, .icon-title h5,
.icon-title-start h4, .icon-title-start h5{
  margin-bottom:.5rem;
}

/* ============ IMAGE / PLACEHOLDER ============ */
.img-rounded{
  border-radius:var(--radius-box);
  width:100%;
  height:100%;
  object-fit:cover;
  box-shadow:var(--shadow-soft);
}
.img-placeholder{
  border-radius:var(--radius-box);
  width:100%;
  min-height:280px;
  background:var(--grigio-chiaro);
  border:2px dashed var(--grigio-medio);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  color:var(--grigio-medio);
  text-align:center;
  padding:1.5rem;
  gap:.6rem;
}
.img-placeholder i{font-size:2.6rem; color:var(--accento);}
.img-placeholder small{font-size:.78rem; text-align:center;}

/* ============ MISSION LOGO SIDE ============ */
.mission-logo{
  max-width:280px;
  width:100%;
  filter:drop-shadow(0 6px 16px rgba(0,0,0,.12));
}

/* ============ CASE STUDY ============ */
.case-study-row{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:2.2rem;
  padding:2.2rem;
  background:#fff;
  border-radius:var(--radius-box);
  box-shadow:var(--shadow-soft);
  margin-bottom:22px;
}
.case-study-row:last-child{margin-bottom:0;}
.case-study-img{
  flex:0 0 320px;
  max-width:320px;
}
.case-study-img img{
  width:100%;
  height:220px;
  object-fit:cover;
  border-radius:var(--radius-box);
  box-shadow:var(--shadow-soft);
}
.case-study-text{flex:1 1 320px;}
.case-study-tag{
  display:inline-block;
  background:var(--grigio-chiarissimo);
  border-radius:var(--radius-pill);
  padding:.25rem .9rem;
  font-size:.78rem;
  font-weight:700;
  color:var(--accento);
  margin-bottom:.6rem;
  text-align:left;
}

/* ============ CONTATTI ============ */
.contatti-card{
  background:#fff;
  border-radius:var(--radius-box);
  box-shadow:var(--shadow-soft);
  padding:2.4rem;
}
.form-control,.form-select{
  border-radius:16px;
  border:1px solid #ddd8c8;
  padding:.7rem 1rem;
  font-family:'Lato',sans-serif;
}
.form-control:focus,.form-select:focus{
  border-color:var(--accento);
  box-shadow:0 0 0 .2rem rgba(108,103,22,.15);
}
.form-check-input:checked{
  background-color:var(--accento);
  border-color:var(--accento);
}

/* Riquadro mappa: altezza fissa in px (mai percentuale) per evitare
   che il box erediti l'altezza della viewport e finisca per sovrapporsi
   ai contenuti successivi (footer). Ora a piena larghezza sotto al form. */
.map-frame{
  border-radius:var(--radius-box);
  overflow:hidden;
  box-shadow:var(--shadow-soft);
  height:380px;
  width:100%;
}
.map-frame iframe{width:100%; height:380px; border:0; display:block;}
.map-placeholder-inner{
  height:380px;
  width:100%;
  background:var(--grigio-chiarissimo);
}

/* ============ FOOTER ============ */
footer.footer-vitae{
  position:relative;
  z-index:2;
  background:var(--grigio-scuro);
  color:#e9e7dc;
  padding:3.5rem 0 1.5rem;
  border-top:1px solid var(--filetto-avorio);
}
footer.footer-vitae p{text-align:left;}
footer.footer-vitae a{color:#e9e7dc;}
footer.footer-vitae a:hover{color:var(--filetto-avorio);}
footer.footer-vitae h6{
  font-family:'Roboto Slab',serif;
  color:var(--filetto-avorio);
  font-weight:500;
  margin-bottom:1rem;
}
.footer-logo{max-width:160px;}
.footer-divider{
  border:none;
  height:1px;
  background:rgba(255,255,255,.50);
  margin:2rem 0 1.2rem;
  width:100%;
}
.footer-social-label{
  font-family:'Roboto Slab',serif;
  font-weight:500;
  font-size:.85rem;
  letter-spacing:.5px;
  color:var(--filetto-avorio);
  margin-bottom:.7rem;
}
.footer-menu-list a{
  display:flex;
  align-items:center;
  gap:.5rem;
}
.footer-menu-list i{
  color:var(--filetto-avorio);
  font-size:.75rem;
}
.footer-contact-line{
  display:flex;
  align-items:center;
  gap:.6rem;
  margin-bottom:.5rem;
}
.footer-contact-line i{
  color:var(--filetto-avorio);
  width:16px;
  text-align:center;
  flex-shrink:0;
}
.footer-social a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:38px;height:38px;
  border-radius:50%;
  background:rgba(255,255,255,.08);
  margin-right:.5rem;
}
.footer-social a:hover{background:var(--accento); color:#fff !important;}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.12);
  margin-top:2rem;
  padding-top:1.2rem;
  font-size:.85rem;
  color:#b9b6a6;
  text-align:center;
}

/* ============ COOKIE BANNER ============ */
#cookie-banner{
  position:fixed;
  left:0; right:0; bottom:0;
  z-index:2000;
  background:var(--grigio-scuro);
  color:#f2f0e6;
  padding:1.2rem 1.5rem;
  box-shadow:0 -6px 24px rgba(0,0,0,.25);
  transform:translateY(120%);
  transition:transform .5s ease;
}
#cookie-banner.show{transform:translateY(0);}
#cookie-banner p{text-align:left;}
#cookie-banner a{color:var(--filetto-avorio); text-decoration:underline;}
#cookie-banner .btn-pill{padding:.55rem 1.5rem; font-size:.9rem;}

/* ============ PRIVACY PAGE ============ */
.privacy-content h2{margin-top:2.2rem;}
.privacy-content h3{margin-top:1.4rem; font-size:1.15rem;}
.privacy-content p, .privacy-content li{color:var(--grigio-scuro); line-height:1.7;}

/* ============ FOOTER: colonne leggermente sbilanciate su desktop ============ */
@media (min-width: 992px){
  footer.footer-vitae .row > div:nth-child(1){flex:0 0 29%; max-width:29%;}
  footer.footer-vitae .row > div:nth-child(2){flex:0 0 24%; max-width:24%;}
  footer.footer-vitae .row > div:nth-child(3){flex:0 0 21%; max-width:21%;}
  footer.footer-vitae .row > div:nth-child(4){flex:0 0 26%; max-width:26%;}
}

/* ============ RESPONSIVE ============ */
@media (max-width: 1199.98px){
  .navbar-collapse{
    background:var(--grigio-scuro);
    margin-top:.75rem;
    border-radius:16px;
    box-shadow:var(--shadow-soft);
    padding:1rem;
  }
  .navbar-vitae .navbar-nav{
    align-items:flex-start !important;
  }
}

@media (max-width: 991.98px){
  h2{font-size:2.1rem;}
  .hero-content h1{font-size:2.1rem;}
  .case-study-row{flex-direction:column;}
  .case-study-img{
    flex:0 0 auto;
    max-width:100%;
    width:100%;
  }
}

@media (max-width: 575.98px){
  .contatti-card{padding:1.4rem;}
  #cookie-banner{padding:1rem;}
  .navbar-vitae .navbar-brand img{height:52px;}

  /* Titoli centrati esclusivamente da smartphone */
  .eyebrow{text-align:center;}
  .section-title{text-align:center;}
  .section-title::after{left:50%; transform:translateX(-50%);}

  /* Icona + titolo (es. "Segreteria Generale e Supporto Organizzativo")
     centrati esclusivamente da smartphone */
  .icon-title-start{
    align-items:center;
    text-align:center;
  }
}