/* ═══════════════════════════════════════════
   HERO
═══════════════════════════════════════════ */
.hero {
  position:relative; height:100dvh;
  min-height:560px; overflow:hidden;
}

.hero__photo {
  position:absolute; inset:0; z-index:0; overflow:hidden;
}
.hero__photo img {
  display:block; width:100%; height:100%;
  object-fit:cover; object-position:86% 35%;
}

.hero__panel {
  position:absolute; inset:0; z-index:2;
  background:linear-gradient(175deg,
    rgba(13,79,143,1)   0%,
    rgba(13,79,143,.99) 30%,
    rgba(13,79,143,.85) 54%,
    rgba(13,79,143,.75) 62%,
    rgba(0,158,226,.60) 70%,
    rgba(0,158,226,.45) 80%,
    rgba(0,158,226,.25) 100%);
  clip-path:polygon(0 0,66% 0,54% 100%,0 100%);
}


.hero__floor {
  position:absolute; bottom:0; left:0; right:0;
  height:200px; z-index:2;
  background:linear-gradient(to top,rgba(4,9,15,.7) 0%,transparent 100%);
}

.hero__body {
  position: relative;
  z-index: 10;
  height: 100%;
  padding-left:0;  
}
.hero__text { max-width:820px; }


.eyebrow {
  display:inline-flex; align-items:center; gap:10px;
  font-size:14px; font-weight:700; letter-spacing:.22em;
  text-transform:uppercase; color:var(--brand-grey);
  margin-bottom:22px; font-family:var(--font-normal);
}
.eyebrow__line {
  display:block; width:24px; height:1px;
  background:var(--brand-grey); flex-shrink:0;
}

@media (max-width:900px) {.eyebrow {font-size:12px;}}
@media (max-width:737px) {.hero__text .eyebrow {font-size:10px !important; margin-bottom:10px;}.eyebrow__line {display:none;}}

.hero__title {
  font-family:var(--font-special);
  font-size: clamp(45px, 6vw, 80px);
  font-weight:400; line-height:1.09;
  color:#fff; letter-spacing:-.025em; margin-bottom:22px;
}
.hero__title em { font-style:italic; color:var(--brand); }

.hero__sub {  
  color:rgba(255,255,255,.9);
  max-width:550px; margin-bottom:36px; font-weight:300;
  font-family:var(--font-normal);
}
@media (max-width:1090px) {.hero__sub { max-width:440px; }}

/* Entrata hero. Il titolo (H1) resta STATICO e opaco dal primo frame, SENZA
   animazione: è così l'elemento LCP più pulito possibile. (L'immagine riempie
   il viewport e Chrome la scarta come "background", quindi l'LCP deve essere
   il testo.) Gli altri elementi mantengono la dissolvenza in entrata. */
.eyebrow       { animation: heroFadeDown .7s cubic-bezier(.22,1,.36,1) .2s both; }
.hero__sub     { animation: heroFadeUp   .7s cubic-bezier(.22,1,.36,1) .4s both; }
.hero__actions { animation: heroZoomIn   .6s cubic-bezier(.22,1,.36,1) .6s both; }

@keyframes heroTitleUp  { from { transform:translateY(24px); } to { transform:translateY(0); } }
@keyframes heroFadeUp   { from { opacity:0; transform:translateY(24px);  } to { opacity:1; transform:translateY(0); } }
@keyframes heroFadeDown { from { opacity:0; transform:translateY(-20px); } to { opacity:1; transform:translateY(0); } }
@keyframes heroZoomIn   { from { opacity:0; transform:scale(.92);        } to { opacity:1; transform:scale(1); } }

@media (prefers-reduced-motion: reduce) {
  .hero__title, .eyebrow, .hero__sub, .hero__actions { animation:none; opacity:1; transform:none; }
}

/* hero__actions: wrap-flex align-center gap12 flexwrap */




@media(max-width:900px) {
  .hero {
    height:auto; min-height:100dvh;
    display:flex; flex-direction:column;
  }
  .hero__photo {
    position:relative; height:42svh; min-height:220px;
    width:100%; flex-shrink:0; z-index:0;
    background-position:60% 30%; order:2; margin-top:-52px;
  }
  .hero__photo::after {
    content:''; position:absolute; bottom:0; left:0; right:0; height:80px;
    background:linear-gradient(to top,var(--dark) 0%,transparent 100%); z-index:1;
  }
  .hero__panel {
    position:relative; flex:1; z-index:2;
    clip-path:polygon(0 0,100% 0,100% calc(100% - 52px),0 100%);
    background:
      radial-gradient(circle at 68% 58%,rgba(118,193,255,.30) 0%,rgba(118,193,255,.12) 18%,rgba(118,193,255,.00) 42%),
      radial-gradient(circle at 18% 88%,rgba(188,231,255,.10) 0%,rgba(188,231,255,.00) 34%),
      linear-gradient(180deg,#0a2a4d 0%,rgb(13,79,143) 56%,rgba(94,169,227,1) 100%);
    padding:28px 0 80px; order:1; margin-top:70px;
    display:flex; align-items:center;
  }
  .hero__panel::before { display:none; }

  .hero__body { height: auto; position: static; display: block; } 
  .hero__text  { max-width:none; }
  .hero__floor { display:none; }
  .hero__title { font-size:clamp(32px,8.5vw,46px); margin-bottom:16px; }
  .hero__sub   { font-size:15px; max-width:none; margin-bottom:28px; }
}

@media(max-width:480px) {
  .hero__actions { flex-direction:column; align-items:stretch; }
  .btn-p,.btn-s  { justify-content:center; }
}


/* ═══════════════════════════════════════════
   CHI SIAMO  (ora prima sezione nel main)
═══════════════════════════════════════════ */
.chi {
  
  position:relative; overflow:hidden;
}
.chi::before {
  content:''; position:absolute;
  top:-100px; left:-100px; width:400px; height:400px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(26,135,225,.06),transparent 70%);
}
.chi__inner {position:relative; z-index:1;}
.chi__top {
  display:grid; grid-template-columns:1fr 1fr;
  gap:72px; align-items:center; margin-bottom:72px;
}
.chi__img {
  width:100%; aspect-ratio:1616/940; border-radius:20px;
  position:relative; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  
}
.chi__img img { width:100%; height:100%;object-fit:cover; transform:none; display:block;}

.chi__text-block p {  
  color:var(--g700); margin-bottom:16px;
  font-family:var(--font-normal);
}
.chi__text-block p:last-child { margin-bottom:0; }

.chi__values {
  display:grid; grid-template-columns:repeat(3,1fr); gap:24px;
}
.chi__val {
  display:flex; flex-direction:column;
  align-items:center; text-align:center; gap:20px;
  padding:28px 24px; border-radius:20px;
  background:var(--white); position:relative;
  transition:all .35s cubic-bezier(.22,1,.36,1);
}
.chi__val::before {
  content:""; position:absolute; inset:0; padding:2px;
  border-radius:20px;
  background:linear-gradient(135deg,var(--brand) 0%,var(--brand-dark) 35%,var(--brand-deep) 70%,var(--brand-400) 100%);
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite:exclude; pointer-events:none;
}
.chi__val:hover { transform:translateY(-4px); box-shadow:0 16px 48px rgba(0,0,0,.06); }

.chi__val-icon {
  width:80px; height:80px; 
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;   
}
.chi__val-icon img {object-fit: contain; width:100%; aspect-ratio:4/4;}
.chi__val-title {
  font-family:var(--font-special);
  font-size:25px; color:var(--cl-txt); margin-bottom:20px; font-weight:600;
}
.chi__val-text {
  color:var(--g500); 
  font-family:var(--font-normal);
}

@media(max-width:1500px) {
  .chi__top {align-items:flex-start;}
  .chi__img {  border-radius:20px; }
  .chi__img img { transform: translateY(0); object-fit: contain; border-radius:20px;}
}

@media(max-width:1140px) {
  .chi__img { aspect-ratio: 1616/940; border-radius:20px;}
  .chi_order1 {order:1;}
  .chi_order2 {order:2;}
  
  .chi__top { display:flex;flex-direction:column; gap:40px; }
  .chi__values { grid-template-columns:1fr; gap:16px; }
}

/* ═══════════════════════════════════════════
   SERVICES
═══════════════════════════════════════════ */
.services {background:var(--brand-50);}

.services__grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:24px;
}
.service-card {
  position:relative; padding:36px 30px 32px;
  border-radius:20px; overflow:hidden; cursor:pointer;
  text-decoration:none; display:flex; flex-direction:column;
  transition:all .4s cubic-bezier(.22,1,.36,1);
  background:var(--white);
  box-shadow:0 16px 48px rgba(0,0,0,.06);
  border:1px solid rgba(26,135,225,.1);
}
.service-card::before {
  content:''; position:absolute; top:0; left:0; right:0;
  height:4px; transition:height .4s cubic-bezier(.22,1,.36,1);
}
.service-card-color1::before { background:#f5774a; }
.service-card-color2::before { background:#5ebeae; }
.service-card-color3::before { background:var(--brand); }
.service-card:hover { transform:translateY(-6px) scale(1.02); box-shadow:0 24px 64px rgba(26,135,225,.12); }
.service-card:hover::before { height:6px; }

.service-card__icon {
  width:60px; height:60px; border-radius:14px;
  display:flex; align-items:center; justify-content:center;
  margin-bottom:22px; transition:all .3s;
  background:var(--brand-200); color:#fff;
}
.service-card:hover .service-card__icon { transform:scale(1.08); background:var(--brand); }
.service-card__icon-orange { background:rgba(245,119,74,.6); }
.service-card:hover .service-card__icon-orange { background:rgba(245,119,74,1); }
.service-card__icon-green  { background:rgba(94,190,174,.6); }
.service-card:hover .service-card__icon-green  { background:rgba(94,190,174,1); }

.service-card__tag {
  font-size:14px; font-weight:700; letter-spacing:.1em;
  text-transform:uppercase; margin-bottom:10px; color:var(--brand);
  font-family:var(--font-normal);
}
.service-card__title {
  font-family:var(--font-special);
  font-size:25px; color:var(--cl-txt); margin-bottom:30px; line-height:1.2;
}
.service-card__text {
  color:var(--g500); 
  font-family:var(--font-normal);
}
.service-card__items { margin-top:18px; display:flex; flex-direction:column; gap:8px;flex:1; }
.service-card__item  {
  display:flex; align-items:center; gap:9px;
  color:var(--g500); 
  font-family:var(--font-normal);
}
.service-card__item-icon { flex-shrink:0; color:var(--brand); }
.service-card__arrow {
  display:flex; align-items:center; gap:8px;
  margin-top:30px; font-weight:600; color:var(--brand);
  transition:all .3s; transform:translateX(0);
  font-family:var(--font-normal);
}
.service-card:hover .service-card__arrow { transform:translateX(6px); }

.orange { color:#f5774a; }
.green  { color:#5ebeae; }

@media(max-width:1140px) {  
  .services__grid { grid-template-columns:1fr; gap:16px; }
}

/* ═══════════════════════════════════════════
   ANALYSIS  (in evidenza)
═══════════════════════════════════════════ */
.analysis { position:relative; overflow:hidden; }

.analysis__inner {  
  display:grid; grid-template-columns:1fr 1fr;
  gap:72px; align-items:center; position:relative; z-index:1;
}
.analysis__img,
video.analysis__img {
  width:100%; aspect-ratio:4/3; border-radius:24px;
  object-fit:cover; display:block;
  box-shadow:0 20px 60px rgba(10,74,127,.15);
}
@media (max-width:1400px) {.analysis__img {aspect-ratio:3/4;}}
.analysis__floating-card {
  position:absolute; bottom:-20px; right:-20px;
  padding:20px 28px; background:var(--white);
  border-radius:16px; box-shadow:0 16px 48px rgba(10,74,127,.12); z-index:2;
}
.analysis__floating-label {
  font-size:14px; font-weight:700; letter-spacing:.1em;
  text-transform:uppercase; color:var(--brand); margin-bottom:4px;
  font-family:var(--font-normal);
}
.analysis__floating-value {
  font-family:var(--font-special); font-size:25px; color:var(--cl-txt);
}
.analysis__list { margin-top:32px; display:flex; flex-direction:column; gap:20px; }
.analysis__list-item { display:flex; gap:16px; align-items:flex-start; }
.analysis__list-num {
  width:36px; height:36px; border-radius:10px;
  background:var(--brand); color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-size:14px; font-weight:700; flex-shrink:0;
  font-family:var(--font-normal);
}

.analysis__list-text strong {
  display:block; color:var(--cl-txt); margin-bottom:2px;
}
.analysis__list-text span {
  color:var(--g500); 
  font-family:var(--font-normal);
}

@media (max-width:1300px) and (min-width:1101px){
  .analysis__inner{ align-items:flex-start;}
  .analysis__img {margin-top:50px;}
}

@media(max-width:1100px) {
  .analysis__inner { grid-template-columns:1fr; gap:48px; .analysis__img {aspect-ratio:4/3;}}
}

/* ═══════════════════════════════════════════
   EXPERIENCE / STORIA  (full-width)
═══════════════════════════════════════════ */
.experience {
  position:relative; overflow:hidden;
  background:var(--dark); color:#fff;
  width:100%;
}
.experience::before {
  content:''; position:absolute; inset:0;
  background:
    radial-gradient(ellipse 60% 50% at 80% 50%,rgba(26,135,225,.15),transparent),
    radial-gradient(ellipse 40% 40% at 10% 80%,rgba(77,176,240,.06),transparent);
}
.experience__inner {  
  position:relative; z-index:1;
  display:grid; grid-template-columns:1fr 1fr;
  gap:80px; align-items:center;
}
.experience__stats {
  display:grid; grid-template-columns:1fr 1fr; gap:32px;
}
.stat__number {
  font-family:var(--font-special);
  font-size:clamp(40px,5vw,56px); line-height:1; color:#fff; margin-bottom:8px;
}
.stat__label {
  font-size:16px; color:rgba(255,255,255,.5); line-height:1.4;
  font-family:var(--font-normal);
}
.experience__text {
  
  color:rgba(255,255,255,.65); margin-top:20px;
  font-family:var(--font-normal);
}


@media(max-width:900px) {
  .experience__inner { grid-template-columns:1fr; gap:48px; }
}

/* ═══════════════════════════════════════════
   TESTIMONIALS — scroll grab & drop + dots
═══════════════════════════════════════════ */
.testimonials {
  padding:100px 0;  
  overflow:hidden;
  position: relative;
}

.testimonials__header { margin-bottom: 50px; }

/* Track scorrevole */
.testimonials__track-wrap {
  position:relative;  
}

.testimonials__track {
  display:flex; gap:24px;
  padding:8px 32px 8px calc((100vw - 1280px)/2 + 32px);
  overflow-x:auto; scroll-snap-type:x mandatory;
  cursor:grab;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.testimonials__track-wrap::before,
.testimonials__track-wrap::after {
  content: '';
  position: absolute;
  top: 0; bottom: 40px; /* lascia spazio dots */
  width: 80px;
  z-index: 2;
  pointer-events: none;
}
.testimonials__track-wrap::before {
  left: 0;
  background: linear-gradient(to right, var(--white) 0%, transparent 100%);
}
.testimonials__track-wrap::after {
  right: 0;
  background: linear-gradient(to left, var(--white) 0%, transparent 100%);
}

/* Track */
.testimonials__track {
  display: flex;
  gap: 24px;
  padding: 8px 80px 8px 80px;
  overflow-x: auto;
  scroll-snap-type: x proximity; /* proximity = meno scatti, più fluido */
  scroll-behavior: smooth;
  cursor: grab;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.testimonials__track::-webkit-scrollbar { display: none; }
.testimonials__track.is-grabbing {
  cursor: grabbing;
  scroll-snap-type: none; /* disabilita snap durante drag */
  scroll-behavior: auto;
}

/* Card singola */

.testimonial {
  flex: 0 0 360px;
  scroll-snap-align: start;
  padding: 36px 32px;
  border-radius: 20px;
  background: var(--g50);
  border: 1px solid var(--g200);
  position: relative;
  transition: box-shadow .3s, transform .3s;
  user-select: none; /* evita selezione testo durante drag */
}
.testimonial:hover { box-shadow: 0 8px 32px rgba(0,158,226,.1); transform: translateY(-2px); }

.testimonial__stars { display: flex; gap: 3px; margin-bottom: 16px; padding-top: 16px; }
.testimonial__star  { color: #F59E0B; font-size: 18px; }

.testimonial__text {
   color: var(--g700);
  font-style: italic; margin-bottom: 20px; padding-top: 20px;
  font-family: var(--font-normal);
}
.testimonial__author {
  font-size: 14px; font-weight: 600; color: var(--cl-txt);
  font-family: var(--font-normal);
}


/* Frecce */
.testimonials__arrows {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-top: 28px;
}
.testimonials__arrow {
  width: 42px; height: 42px;
  border-radius: 50%;
  border: 1px solid var(--g200);
  background: var(--white);
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  color: var(--cl-txt);
  transition: all .25s;
  flex-shrink: 0;
}
.testimonials__arrow:hover {
  background: var(--brand);
  border-color: var(--brand);
  color: #fff;
  transform: scale(1.08);
}
.testimonials__arrow:disabled {
  opacity: .3;
  cursor: default;
  transform: none;
}
.testimonials__arrow svg { width: 16px; height: 16px; }

/* Dots */
.testimonials__dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 16px;
}
.testimonials__dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--brand-grey);
  border: none; cursor: pointer; padding: 0;
  transition: all .3s;
}
.testimonials__dot.active {
  background: var(--brand);
  width: 24px; border-radius: 4px;
}

@media(max-width: 900px) {
  .testimonials { padding: 72px 0; }
  .testimonials__track { padding: 8px 24px; }
  .testimonial { flex: 0 0 85vw; }
  .testimonials__track-wrap::before,
  .testimonials__track-wrap::after { width: 32px; }
}

/* ═══════════════════════════════════════════
   CTA  (full-width come experience)
═══════════════════════════════════════════ */
.cta-section {
  width:100%; position:relative; overflow:hidden;
  background:linear-gradient(135deg, var(--brand-dark), var(--brand));
}

.cta-section__inner {  
  display:grid; grid-template-columns:1.2fr 1fr;
  gap:40px; align-items:flex-start; position:relative; z-index:1;  
}
.cta-section__title {
  font-family:var(--font-special);
  font-size: clamp(30px,3.8vw,46px);
  color:#fff; line-height:1.2; margin-bottom:14px;
}
.cta-section__text {
   color:rgba(255,255,255,.65);
  font-family:var(--font-normal);
}
.cta-section__right { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width:1400px) {.cta-section__right {grid-template-columns:1fr;}}

.cta-section__right > p {
  grid-column: 1 / -1;
}
.cta-section__footer {
  padding-bottom: 60px;
  padding-top: 0;
}

.cta-contact--full {
  grid-column: 1 / -1;
}

.cta-contact {
  display:flex; align-items:center; gap:16px;
  padding:18px 22px;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.12);
  border-radius:16px; backdrop-filter:blur(8px);
  text-decoration:none; transition:all .3s;
}
.cta-contact:hover { background:rgba(255,255,255,.18); transform:translateX(4px); }
.cta-contact__icon {
  width:42px; height:42px; border-radius:12px;
  background:rgba(255,255,255,.15);
  display:flex; align-items:center; justify-content:center;
  color:#fff; flex-shrink:0;
}
.cta-contact__label {
  font-size:16px; color:rgba(255,255,255,1); font-weight:600;
  letter-spacing:.04em; text-transform:uppercase;
  font-family:var(--font-normal);
  margin-bottom:5px;
}
.cta-contact__value {
  font-size:15px; color:rgba(255,255,255,.7);  margin-top:1px;
  font-family:var(--font-normal);  
  line-height:1.6;
}

.cta-link-tag {
  display:inline-flex; align-items:center; gap:8px;
  padding:9px 16px;
  background:rgba(255,255,255,.08);
  border:none; border-radius:10px;
  color:rgba(255,255,255,.75); font-family:var(--font-normal);
  font-weight:500;
  text-decoration:none;
  transition:all .25s;
}
.cta-link-tag:hover { background:rgba(255,255,255,.15); color:#fff; }
.cta-link-tag__icon {
  width:22px; height:22px; border-radius:6px;
  background:rgba(255,255,255,.12);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.cta-link-tag__icon svg { width:11px; height:11px; }
.cta-link-tag__arr { width:10px; height:10px; opacity:.5; margin-left:2px; flex-shrink:0; }

@media(max-width:900px) {
  .cta-section__inner { grid-template-columns:1fr;}
  .btn-blue, .btn-s {font-size:16px;}
}

