/* =====================================================================
   Digital Vessel — restyle identità, PROPOSTA B (caricato dopo site.css e v3.css)
   Palette:  #003249 blu petrolio · #FFFEFF bianco · #07B1A9 verde acqua (logo)
   Sfondi e box scuri: gradiente dall'azzurro al blu petrolio.
   Struttura come la proposta A: angoli vivi, porte con icona grande,
   pulsante del menu a contorno, titoletti con quadrato e filetto.
   ===================================================================== */

:root{
  --dv-petrol:#003249;
  --dv-white:#FFFEFF;
  --dv-teal:#07B1A9;          /* icone e dettagli; su #003249 ≈ 5:1 */
  --dv-teal-ink:#056E69;      /* verde acqua profondo per parole su fondo chiaro (≈ 5.8:1 su #FFFEFF) */
  --dv-teal-rgb:7,177,169;
  --dv-petrol-rgb:0,50,73;
  --dv-cool:#F0F4F6;          /* fondo alternato: #003249 al 6% su bianco */
  --dv-deep:linear-gradient(158deg,#0A6A96 0%,#06557D 16%,#043F5E 36%,#003249 60%,#001C2A 100%);
  --dv-teal-light:#86E4DE;    /* verde acqua chiaro per parole grandi su fondo scuro/azzurro */
  --dv-glow:radial-gradient(60% 50% at 100% 100%,rgba(var(--dv-teal-rgb),.14) 0%,rgba(var(--dv-teal-rgb),0) 65%);
  --dv-btn-petrol:linear-gradient(135deg,#0B5F86 0%,#003249 55%,#00202F 100%);
  /* variabili del foglio condiviso site.css */
  --teal:var(--dv-teal-ink);
  --teal-bright:var(--dv-teal);
  --focus:var(--dv-teal-ink);
}

/* ---------- 1. colori di base e accenti ---------- */
/* le variabili azzurre di v3.css: parole in corsivo, link e menu attivo in verde acqua profondo su chiaro */
.v3{--navy:var(--dv-petrol);--blue:var(--dv-teal-ink);--cyan:var(--dv-teal-light);--cyan-soft:var(--dv-teal-light)}
/* testi secondari più chiari sui fondi scuri, perché restino leggibili anche sulla parte azzurra del gradiente */
.v3 .x-navy,.v3 .section.dark,.v3 .x-page-hero.is-plain,.v3 .x-cmp.is-vision,.v3 .site-foot{
  --on-navy-soft:#D3DEE6;--on-dark-soft:#D3DEE6;--on-dark-faint:#C3D1DB;
}
.v3 .site-foot{color:#D3DEE6}
.v3 .x-cmp.is-vision .x-cmp-label{color:var(--dv-white)}
.v3 .x-cmp.is-vision .x-flow span,.v3 .x-cmp.is-vision .x-flow strong{color:var(--dv-white)}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){--teal:var(--dv-teal);--cta-bg:var(--dv-teal);--cta-bg-hover:#3CC7C0;--accent-line:var(--dv-teal);--focus:var(--dv-teal)}
  :root:not([data-theme="light"]) .v3{--blue:var(--dv-teal)}
}
:root[data-theme="dark"]{--teal:var(--dv-teal);--cta-bg:var(--dv-teal);--cta-bg-hover:#3CC7C0;--accent-line:var(--dv-teal);--focus:var(--dv-teal)}
:root[data-theme="dark"] .v3{--blue:var(--dv-teal)}

/* sfondi chiari: bianco #FFFEFF e un leggero velo petrolio per le sezioni alternate (solo tema chiaro) */
@media (prefers-color-scheme:light){
  :root:not([data-theme="dark"]){--paper:var(--dv-white);--paper-2:var(--dv-white);--paper-3:#E3EBEF;--rule:#C7D3DA}
  :root:not([data-theme="dark"]) .v3{--paper:var(--dv-white);--white:var(--dv-white);--cool:var(--dv-cool)}
  :root:not([data-theme="dark"]) .v3 .site-head{background:rgba(255,254,255,.95)}
}
:root[data-theme="light"]{--paper:var(--dv-white);--paper-2:var(--dv-white);--paper-3:#E3EBEF;--rule:#C7D3DA}
:root[data-theme="light"] .v3{--paper:var(--dv-white);--white:var(--dv-white);--cool:var(--dv-cool)}
:root[data-theme="light"] .v3 .site-head{background:rgba(255,254,255,.95)}

/* pulsanti su fondo chiaro: bordino verde acqua e leggera patina dello stesso colore;
   al passaggio si riempiono di verde acqua con testo petrolio, come quelli sui fondi scuri */
.v3 .btn-primary,.v3 .btn-ink,.v3 .band .btn,.v3 .btn-outline{
  background:rgba(var(--dv-teal-rgb),.05);
  color:var(--dv-petrol);border:1px solid var(--dv-teal);
  box-shadow:none;
}
.v3 .btn-primary:hover,.v3 .btn-ink:hover,.v3 .band .btn:hover,.v3 .btn-outline:hover{
  background:var(--dv-teal);color:var(--dv-petrol);border-color:var(--dv-teal);
  box-shadow:0 14px 34px rgba(var(--dv-teal-rgb),.3);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .v3 .btn-primary,:root:not([data-theme="light"]) .v3 .btn-ink,
  :root:not([data-theme="light"]) .v3 .band .btn,:root:not([data-theme="light"]) .v3 .btn-outline{color:var(--dv-white)}
}
:root[data-theme="dark"] .v3 .btn-primary,:root[data-theme="dark"] .v3 .btn-ink,
:root[data-theme="dark"] .v3 .band .btn,:root[data-theme="dark"] .v3 .btn-outline{color:var(--dv-white)}
.v3 .btn-primary:hover,.v3 .btn-ink:hover,.v3 .btn-outline:hover{color:var(--dv-petrol) !important}
/* pulsanti sui fondi scuri e sulle foto: bianco, testo petrolio; al passaggio verde acqua */
.v3 .x-hero .btn-primary,.v3 .x-page-hero .btn-primary,.v3 .x-navy .btn-primary,
.v3 .section.dark .btn-primary,.v3 .x-close .btn-primary,.v3 .x-photo-band .btn-primary{
  background:var(--dv-white);color:var(--dv-petrol);border-color:var(--dv-white);
  box-shadow:0 10px 28px rgba(0,0,0,.22);
}
.v3 .x-hero .btn-primary:hover,.v3 .x-page-hero .btn-primary:hover,.v3 .x-navy .btn-primary:hover,
.v3 .section.dark .btn-primary:hover,.v3 .x-close .btn-primary:hover,.v3 .x-photo-band .btn-primary:hover{
  background:var(--dv-teal);color:var(--dv-petrol);border-color:var(--dv-teal);
  box-shadow:0 14px 34px rgba(var(--dv-teal-rgb),.3);
}
.v3 .btn-ghost{border-color:rgba(255,254,255,.6)}
.v3 .btn-ghost:hover{border-color:var(--dv-teal);background:rgba(var(--dv-teal-rgb),.12)}

/* "Richiedi una demo" nel menu: a contorno, come "Parla con il team" */
.v3 .nav a.head-cta,.v3 .nav .head-cta{
  background:rgba(var(--dv-teal-rgb),.05);color:var(--dv-petrol);border:1px solid var(--dv-teal);box-shadow:none;
}
.v3 .nav a.head-cta:hover,.v3 .nav .head-cta:hover{background:var(--dv-teal);color:var(--dv-petrol);border-color:var(--dv-teal);box-shadow:none}
.js .v3 .site-head:not(.is-scrolled):not(.open) .nav a.head-cta{color:#fff;border-color:rgba(255,254,255,.6)}
.js .v3 .site-head:not(.is-scrolled):not(.open) .nav a.head-cta:hover{background:rgba(var(--dv-teal-rgb),.16);border-color:var(--dv-teal)}

/* icone */
.v3 .step-n.step-ico{color:var(--dv-teal-ink);background:rgba(var(--dv-teal-rgb),.12)}
.v3 .x-role-ico{color:var(--dv-teal);background:rgba(var(--dv-teal-rgb),.16)}
.v3 .x-notice-icon{color:var(--dv-teal-ink)}
.v3 main .x-team .tm-role{color:var(--dv-teal)}

/* "Da dove salite a bordo?": icona grande su riquadro petrolio, testi accanto */
.v3 .x-door-ico{color:var(--dv-teal);background:var(--dv-deep);box-shadow:0 6px 16px rgba(var(--dv-petrol-rgb),.22)}
.v3 .x-door-list .door:hover .x-door-ico,.v3 .x-door-list .door:focus-visible .x-door-ico{background:var(--dv-teal);color:var(--dv-petrol)}
.v3 .x-door-list .door > div:first-child{display:grid;grid-template-columns:76px minmax(0,1fr);column-gap:1.6rem;align-items:start}
.v3 .x-door-list .door > div:first-child > *:not(.x-door-ico){grid-column:2}
.v3 .x-door-list .x-door-ico{grid-column:1;grid-row:1 / span 3;width:76px;height:76px;margin:0}
.v3 .x-door-list .x-door-ico svg{width:34px;height:34px}
@media (max-width:600px){
  .v3 .x-door-list .door > div:first-child{grid-template-columns:56px minmax(0,1fr);column-gap:1rem}
  .v3 .x-door-list .x-door-ico{width:56px;height:56px}
  .v3 .x-door-list .x-door-ico svg{width:26px;height:26px}
}

/* schema "oggi / con Digital Vessel" ed etichette di stato */
.v3 .x-chain .node.ai{background:rgba(var(--dv-teal-rgb),.12);border-color:var(--dv-teal-ink);color:var(--dv-teal-ink)}
.v3 .x-status .mark.now{background:rgba(var(--dv-teal-rgb),.16);color:var(--dv-white);border-color:rgba(var(--dv-teal-rgb),.7)}
.v3 .x-cmp.is-vision{border-color:rgba(var(--dv-teal-rgb),.35)}
.v3 .x-cmp.is-vision .x-flow .is-key strong{background:var(--dv-teal);border-color:var(--dv-teal);color:var(--dv-petrol);
  box-shadow:0 0 0 4px rgba(var(--dv-teal-rgb),.18),0 0 22px rgba(var(--dv-teal-rgb),.4)}

/* ---------- 2. titoletti sopra i titoli ---------- */
.v3 main .kicker,
.v3 .x-page-hero .kicker,
.v3 .idx,
.v3 main .door-k{
  display:inline-flex;align-items:center;gap:.75rem;
  font-size:.7rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;
  color:var(--dv-petrol);
}
.v3 main .kicker::before,
.v3 .x-page-hero .kicker::before,
.v3 .idx::before{
  content:"";flex:none;width:7px;height:7px;background:var(--dv-teal);
}
.v3 main .kicker::after,
.v3 .x-page-hero .kicker::after{
  content:"";flex:none;width:44px;height:1px;
  background:linear-gradient(90deg,var(--dv-teal),rgba(var(--dv-teal-rgb),0));
}
.v3 main .x-door-list .door-k::before{content:none}
.v3 main .door-k{color:var(--dv-teal-ink)}
/* .idx e .door-k restano su una riga propria, come nel layout originale */
.v3 .idx,.v3 main .door-k{display:flex}
/* su fondo scuro e sulle foto: testo bianco */
.v3 .x-page-hero .kicker,
.v3 .x-navy .idx,
.v3 .section.dark .kicker,
.v3 main .x-photo-band .kicker{color:var(--dv-white)}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .v3 main .kicker,
  :root:not([data-theme="light"]) .v3 .idx,
  :root:not([data-theme="light"]) .v3 main .door-k{color:var(--dv-white)}
}
:root[data-theme="dark"] .v3 main .kicker,
:root[data-theme="dark"] .v3 .idx,
:root[data-theme="dark"] .v3 main .door-k{color:var(--dv-white)}

/* ---------- 3. sfondi e box scuri: gradiente dall'azzurro al blu petrolio ---------- */
.v3 .x-navy,
.v3 .section.dark,
.v3 .site-foot,
.v3 .x-page-hero.is-plain,
.v3 .tm-card{
  background:var(--dv-glow),var(--dv-deep);
}
.v3 .x-cmp.is-vision{
  background:radial-gradient(70% 60% at 100% 100%,rgba(var(--dv-teal-rgb),.16) 0%,rgba(var(--dv-teal-rgb),0) 60%),var(--dv-deep);
}
/* "A chi cambia la giornata": gradiente più marcato */
.v3 .x-navy.x-people{
  background:radial-gradient(70% 55% at 100% 100%,rgba(var(--dv-teal-rgb),.22) 0%,rgba(var(--dv-teal-rgb),0) 62%),
             linear-gradient(150deg,#1596CC 0%,#0A6E9C 22%,#054E73 42%,#003249 66%,#00151F 100%);
}
.v3 .site-foot{border-top:1px solid rgba(var(--dv-teal-rgb),.3)}

/* ---------- 4. angoli leggermente smussati ---------- */
/* pulsanti, campi, etichette e voci di menu: 4px */
.v3 .btn,
.v3 .nav .head-cta,
.v3 .menu-btn,
.v3 .subnav a,
.v3 .brand,
.v3 .x-chain .node,
.v3 .x-status .mark,.v3 .mark,
.v3 .field input,.v3 .field select,.v3 .field textarea,
.v3 .x-flow span,.v3 .x-flow strong,
.v3 .lang span,.v3 .lang a,
.v3 .nav a,.v3 .nav-trigger{
  border-radius:4px !important;
}
/* box, riquadri, schede, foto e riquadri delle icone: 8px */
.v3 .subnav,
.v3 .status,
.v3 .figure img,.v3 .figure.photo-wide img,
.v3 .form-off,
.v3 .todo-box,
.v3 .x-page-hero .x-notice,
.v3 .x-cmp,
.v3 .x-door-ico,
.v3 .step-n.step-ico,
.v3 .tm-card,
.v3 .tm-in,
.v3 .x-role-ico,
.v3 .page-hero-photo img{
  border-radius:8px !important;
}
.v3 .figure.device img{border-radius:0 !important} /* mockup scontornati: nessun ritaglio */
.wa-float{border-radius:12px !important}

/* ---------- 5. riquadri e label: testo a tutta larghezza ---------- */
.v3 .status,.v3 .status > p,.v3 main .section .status p,.v3 main .status p,.v3 .status-list li,
.v3 .x-page-hero .x-notice,.v3 .x-page-hero .x-notice p,
.v3 .todo-box,.v3 main .todo-box p{max-width:none !important}
.v3 .status{width:100%;box-sizing:border-box}

/* ---------- 6. "Da dove salite a bordo?": via le frecce verso le pagine ---------- */
.v3 .x-door-list .door-go::after{content:none}

/* ---------- 7. hero delle pagine: sfumatura sulle foto più morbida e leggera ---------- */
/* foto a tutta larghezza (home e pagine con foto piena) */
.v3 .x-hero-media::after{
  background:
    linear-gradient(90deg,rgba(0,40,59,.66) 0%,rgba(0,40,59,.52) 18%,rgba(0,40,59,.34) 36%,rgba(0,40,59,.16) 54%,rgba(0,40,59,.05) 72%,rgba(0,40,59,0) 88%),
    linear-gradient(0deg,rgba(0,40,59,.42) 0%,rgba(0,40,59,.16) 16%,rgba(0,40,59,0) 34%),
    linear-gradient(180deg,rgba(0,28,42,.38) 0%,rgba(0,28,42,.12) 12%,rgba(0,28,42,0) 24%);
}
/* foto a destra: il blu petrolio della sezione si scioglie nella foto senza stacco */
@media (min-width:901px){
  .v3 .x-page-hero.photo-right .x-hero-media::after,
  .v3 .x-page-hero.photo-right.soft-fade .x-hero-media::after{
    background:
      linear-gradient(90deg,rgba(0,50,73,1) 0%,rgba(0,50,73,.97) 6%,rgba(0,50,73,.9) 14%,rgba(0,50,73,.78) 24%,rgba(0,50,73,.6) 35%,rgba(0,50,73,.4) 47%,rgba(0,50,73,.22) 59%,rgba(0,50,73,.09) 72%,rgba(0,50,73,.02) 84%,rgba(0,50,73,0) 94%),
      linear-gradient(180deg,rgba(0,28,42,.32) 0%,rgba(0,28,42,.1) 12%,rgba(0,28,42,0) 24%);
  }
  /* la foto parte più a sinistra: la sfumatura ha più spazio e non si vede lo stacco */
  .v3 .x-page-hero.photo-right .x-hero-media{left:30%}
  .v3 .x-page-hero.photo-right{background:var(--dv-petrol)}
}
/* telefono e tablet: la foto sta in alto e sfuma dolcemente nel petrolio */
@media (max-width:900px){
  .v3 .x-hero-media::after{
    background:
      linear-gradient(0deg,rgba(0,50,73,1) 0%,rgba(0,50,73,.78) 14%,rgba(0,50,73,.45) 30%,rgba(0,50,73,.18) 46%,rgba(0,50,73,0) 62%),
      linear-gradient(180deg,rgba(0,28,42,.4) 0%,rgba(0,28,42,.12) 12%,rgba(0,28,42,0) 24%);
  }
  .v3 .x-page-hero.has-photo{background:var(--dv-petrol)}
}

/* ---------- 8. componenti della struttura "Copy finale" (28/09/2026) ---------- */
/* elenchi di protocolli e voci tecniche */
.v3 .spec-list{list-style:none;margin:1rem 0 0;padding:0;display:grid;gap:.55rem}
.v3 .spec-list li{position:relative;padding-left:1.1rem;color:var(--text-soft);font-size:.96rem;line-height:1.6;max-width:none}
.v3 .spec-list li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;background:var(--dv-teal)}
.v3 .spec-list b{color:var(--text);font-weight:600}
.v3 main .x-small-note{margin-top:1.4rem;font-size:.9rem;color:var(--text-faint);max-width:70ch}
/* link dentro i testi delle intestazioni scure */
.v3 .x-page-hero .x-hero-in a:not(.btn){color:#fff;text-decoration:underline;text-underline-offset:3px}
/* confronto oggi / Digital Vessel: due note nello stesso riquadro */
.v3 .x-cmp-note + .x-cmp-note{margin-top:.7rem}
/* footer: nota sui marchi */
.v3 .site-foot .foot-note{padding-top:0;padding-bottom:1.6rem}
.v3 .site-foot .foot-note p{margin:0;font-size:.78rem;line-height:1.5;color:#B9C8D2;max-width:none}
/* team: foto con fondo bianco; il segnaposto senza foto usa lo stesso fondo chiaro */
.v3 .tm-card{background:#F4F7F9}
.v3 .tm-card.has-photo{background:#fff}
.v3 .tm-card.has-photo .tm-media img{object-position:50% 12%}
.v3 .tm-mono{background:linear-gradient(160deg,#F4F7F9 0%,#E3EBEF 100%);color:rgba(0,50,73,.22)}
.v3 .tm-info{background:linear-gradient(0deg,rgba(0,50,73,.97) 0%,rgba(0,50,73,.9) 55%,rgba(0,50,73,0) 100%)}
.v3 main .x-team .tm-role{color:var(--dv-teal-light)} /* verde acqua chiaro: leggibile (AA) sul petrolio */

/* ---------- 9. revisione del 28/09/2026 ---------- */
/* "Da dove si sale a bordo?": al passaggio torna il fondo grigio chiaro */
.v3 .x-door-list .door::before{background:var(--dv-cool)}

/* team: velo sfumato sulla foto, più presente al passaggio del mouse */
.v3 .tm-card.has-photo .tm-media::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(165deg,rgba(var(--dv-teal-rgb),.16) 0%,rgba(0,50,73,.22) 45%,rgba(0,50,73,.5) 100%);
  opacity:.55;transition:opacity .5s var(--ease)}
.v3 .tm-card.has-photo:hover .tm-media::after,.v3 .tm-card.has-photo:focus-within .tm-media::after{opacity:1}

/* footer su desktop: ragione sociale su una riga, sotto email, telefono e privacy, allineati a sinistra */
.v3 .foot-links{display:flex;flex-wrap:wrap;gap:.6rem 1.4rem}
@media (min-width:1041px){
  .v3 .foot-bot{flex-direction:column;align-items:flex-start;gap:.55rem}
  .v3 .foot-company{white-space:nowrap}
}

/* ingresso delle intestazioni: la foto si assesta, testo e pulsanti salgono con eleganza */
@keyframes dvImgIn{from{opacity:0;transform:scale(1.06)}to{opacity:1;transform:none}}
@keyframes dvUp{from{opacity:0;transform:translate3d(0,26px,0)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:no-preference){
  .v3 .x-hero-media img{animation:dvImgIn 1.9s cubic-bezier(.2,.7,.2,1) both}
  .v3 .x-hero-in > .lede,.v3 .x-hero-in > p,.v3 .x-hero-in > .hero-actions,.v3 .x-hero-in > .x-notice{animation:dvUp 1.1s cubic-bezier(.2,.7,.2,1) both}
  .v3 .x-hero-in > :nth-child(2){animation-delay:.45s}
  .v3 .x-hero-in > :nth-child(3){animation-delay:.65s}
  .v3 .x-hero-in > :nth-child(4){animation-delay:.8s}
}
/* la foto resta dentro il suo riquadro mentre si assesta: nessuna striscia verticale a sinistra */
.v3 .x-hero-media{overflow:hidden}
/* comparsa allo scorrimento: la foto delle fasce si assesta senza spostarsi */
.v3 .x-band-media[data-reveal="img"].rv{opacity:0}
.v3 .x-bleed-media{overflow:hidden}

/* paragrafi con icona accanto */
.v3 .feat.has-ico{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:1rem;align-items:start}
.v3 .feat-ico{width:44px;height:44px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  color:var(--dv-teal-ink);background:rgba(var(--dv-teal-rgb),.12)}
.v3 .feat-ico svg{width:22px;height:22px}
.v3 .feat.has-ico h3{margin-top:.55rem}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .v3 .feat-ico{color:var(--dv-teal)}}
:root[data-theme="dark"] .v3 .feat-ico{color:var(--dv-teal)}

/* sezione chiara con foto a tutta altezza su un lato (Cantieri: consegna in banchina) */
.v3 .x-bleed-sec{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:clamp(560px,86svh,860px);background:var(--paper)}
.v3 .x-bleed-sec .x-bleed-media{min-height:100%}
.v3 .x-bleed-sec .x-bleed-media img{object-position:var(--pos,50% 50%)}
.v3 .x-bleed-sec .x-bleed-text{justify-self:end;width:100%;max-width:680px;box-sizing:border-box}
.v3 .x-bleed-left .x-bleed-media{order:-1}
.v3 .x-bleed-left .x-bleed-text{justify-self:start}
@media (max-width:900px){
  .v3 .x-bleed-sec{grid-template-columns:minmax(0,1fr);min-height:0}
  .v3 .x-bleed-sec .x-bleed-media{min-height:0;aspect-ratio:4/3}
  .v3 .x-bleed-sec .x-bleed-text{max-width:none}
}

/* foto a sinistra con testo a destra anche nelle colonne verticali */
@media (min-width:861px){
  .v3 .split.portrait.photo-left{grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr)}
}

/* Flotte: primo blocco di testo spostato a destra su desktop */
@media (min-width:901px){
  .v3 .x-offset-right{margin-left:auto;max-width:620px}
  .v3 .x-offset-right + .figure{margin-top:clamp(3rem,6vw,4.5rem)}
}

/* fasce fotografiche: sfumatura nel blu petrolio del marchio */
.v3 .x-band-media::after{background:linear-gradient(270deg,rgba(0,32,47,.95) 0%,rgba(0,40,59,.84) 34%,rgba(0,50,73,.3) 62%,rgba(0,50,73,.08) 100%)}
.v3 .section.x-photo-band{background:var(--dv-petrol)}
.v3 .x-photo-fleet .x-band-media::after{background:linear-gradient(90deg,rgba(0,32,47,.95) 0%,rgba(0,40,59,.86) 30%,rgba(0,50,73,.35) 55%,rgba(0,50,73,.05) 75%)}
.v3 .x-photo-brand .x-band-media img{object-position:30% 45%}
@media (min-width:901px){
  .v3 .x-photo-brand .x-band-media::after{background:linear-gradient(270deg,rgba(0,32,47,.97) 0%,rgba(0,36,53,.94) 36%,rgba(0,45,66,.72) 48%,rgba(0,50,73,.3) 62%,rgba(0,50,73,.06) 78%,rgba(0,50,73,0) 90%)}
}
@media (max-width:900px){
  .v3 .x-band-media::after,.v3 .x-photo-fleet .x-band-media::after{background:linear-gradient(0deg,rgba(0,50,73,1) 0%,rgba(0,50,73,0) 35%)}
}
/* ---------- 10. Contatti: modulo a tutta larghezza su fondo scuro con gradiente ---------- */
.v3 .section.x-form-sec{background:var(--dv-glow),var(--dv-deep);color:#D3DEE6}
.v3 main .x-form-sec h2{color:var(--dv-white)}
.v3 main .x-form-sec p{color:#D3DEE6;max-width:none}
.v3 main .x-form-sec a:not(.btn){color:var(--dv-teal-light)}
.v3 .x-form-sec .form{max-width:none;margin-top:clamp(1.8rem,3vw,2.6rem)}
.v3 .x-form-sec .fgrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.4rem 1.6rem}
@media (max-width:980px){.v3 .x-form-sec .fgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.v3 .x-form-sec .fgrid{grid-template-columns:minmax(0,1fr)}}
.v3 .x-form-sec .field label{color:#E6EEF2}
.v3 .x-form-sec .field input,.v3 .x-form-sec .field select,.v3 .x-form-sec .field textarea{
  background:rgba(255,254,255,.07);border:1px solid rgba(255,254,255,.3);color:var(--dv-white);
  transition:border-color .2s,background-color .2s}
.v3 .x-form-sec .field input:hover,.v3 .x-form-sec .field select:hover,.v3 .x-form-sec .field textarea:hover{border-color:rgba(255,254,255,.5)}
.v3 .x-form-sec .field input:focus,.v3 .x-form-sec .field select:focus,.v3 .x-form-sec .field textarea:focus{
  background:rgba(255,254,255,.11);border-color:var(--dv-teal);outline:2px solid var(--dv-teal);outline-offset:1px}
.v3 .x-form-sec .field select option{background:#003249;color:var(--dv-white)}
.v3 .x-form-sec .field textarea{min-height:150px}
.v3 .x-form-sec .field .err{color:#FFB8AD}
.v3 .x-form-sec .field.invalid input,.v3 .x-form-sec .field.invalid select,.v3 .x-form-sec .field.invalid textarea{border-color:#FF8A7A}
.v3 .x-form-sec .form-off{background:rgba(255,254,255,.08);border:1px solid rgba(var(--dv-teal-rgb),.45);color:#E6EEF2}
.v3 .x-form-sec .consent{color:#C3D1DB}
.v3 .x-form-sec .form-msg.ok{color:var(--dv-teal-light)}
.v3 .x-form-sec .form-msg.bad{color:#FFB8AD}
/* invio: bianco con testo petrolio, verde acqua al passaggio (come gli altri pulsanti su fondo scuro) */
.v3 .x-form-sec .btn-ink{background:var(--dv-white);color:var(--dv-petrol);border-color:var(--dv-white);box-shadow:0 10px 28px rgba(0,0,0,.22)}
.v3 .x-form-sec .btn-ink:not(:disabled):hover{background:var(--dv-teal);border-color:var(--dv-teal)}
/* il campo con l'etichetta lunga (modello e anno) occupa due colonne: la riga resta allineata */
@media (min-width:981px){.v3 .x-form-sec .fgrid > .field:nth-child(8){grid-column:span 2}}

/* sezione del modulo: stesso respiro in alto e in basso, il titolo non tocca il bordo della fascia */
.v3 main .section.x-form-sec{padding-top:clamp(4.5rem,9vw,7.5rem) !important;padding-bottom:clamp(4.5rem,9vw,7.5rem) !important}
/* Investitori: quattro campi brevi su una riga, la nota sotto a tutta larghezza */
@media (min-width:981px){.v3 .x-form-4 .fgrid{grid-template-columns:repeat(4,minmax(0,1fr))}}
/* pulsanti su fondo scuro e sulle foto: al passaggio testo bianco su verde acqua più profondo
   (bianco su #07B1A9 non sarebbe leggibile: 2,6:1; su #067F79 il contrasto è 4,9:1, livello AA) */
.v3 .x-hero .btn-primary:hover,.v3 .x-page-hero .btn-primary:hover,.v3 .x-navy .btn-primary:hover,
.v3 .section.dark .btn-primary:hover,.v3 .x-close .btn-primary:hover,.v3 .x-photo-band .btn-primary:hover,
.v3 .x-form-sec .btn-ink:not(:disabled):hover{
  background:#067F79 !important;border-color:#067F79 !important;color:var(--dv-white) !important;
  box-shadow:0 14px 34px rgba(0,0,0,.28);
}
/* pulsanti a contorno su fondo scuro e il pulsante del menu sopra le intestazioni: stesso passaggio dei pieni */
.v3 .btn-ghost:hover,
.js .v3 .site-head:not(.is-scrolled):not(.open) .nav a.head-cta:hover{
  background:#067F79 !important;border-color:#067F79 !important;color:var(--dv-white) !important;
}
/* tutti i pulsanti, anche su fondo chiaro (banda "Cosa cambierebbe a bordo…", "Approfondisci", menu dopo lo scorrimento):
   al passaggio verde acqua profondo con testo bianco, come sui fondi scuri */
.v3 .btn-primary:not(:disabled):hover,.v3 .btn-ink:not(:disabled):hover,.v3 .band .btn:hover,.v3 .btn-outline:hover,
.v3 .nav a.head-cta:hover,.v3 .nav .head-cta:hover{
  background:#067F79 !important;border-color:#067F79 !important;color:var(--dv-white) !important;
  box-shadow:0 14px 34px rgba(6,127,121,.28);
}

/* ---------- 11. revisione di stile del 29/09/2026 ---------- */
/* home: meno spazio sotto la hero; testo e confronto su due colonne uguali
   (a sinistra i box, a destra titolo + testo e la frase finale) */
@media (min-width:901px){
  .v3 .x-problem{padding-top:clamp(3.5rem,5.5vw,5.5rem);padding-bottom:clamp(4rem,7vw,7rem)}
}
.v3 .x-compare.x-problem-grid{margin-top:0;align-items:center;row-gap:clamp(1.6rem,3vw,2.4rem)}
.v3 .x-problem-grid .x-pg-text p{max-width:none;margin-top:1.1rem}
.v3 .x-problem-grid .x-pg-text h2{margin:0 0 .4rem}
.v3 .x-problem-grid .x-cmp{height:100%;box-sizing:border-box}
.v3 .x-problem-grid .x-quote{margin:0;max-width:30ch;align-self:center}
@media (min-width:901px){
  .v3 .x-problem-grid{column-gap:clamp(2.5rem,5vw,5rem)}
  .v3 .x-problem-grid .x-pg-text{grid-column:2;grid-row:1}
  .v3 .x-problem-grid .x-cmp.is-now{grid-column:1;grid-row:1}
  .v3 .x-problem-grid .x-cmp.is-vision{grid-column:1;grid-row:2}
  .v3 .x-problem-grid .x-quote{grid-column:2;grid-row:2}
}

/* "Da dove si sale a bordo?": le schede occupano tutta la larghezza.
   Desktop: icona | titoletto e nome | descrizione. Tablet e telefono: descrizione sotto il nome */
.v3 .x-doors-intro{max-width:none}
.v3 .x-door-list .door{display:block}
.v3 .x-door-list .door-d{max-width:none}
@media (min-width:901px){
  .v3 .x-door-list .door > div:first-child{grid-template-columns:76px minmax(0,5fr) minmax(0,7fr);column-gap:clamp(1.6rem,3vw,3rem);align-items:center}
  .v3 .x-door-list .door > div:first-child > .door-k,
  .v3 .x-door-list .door > div:first-child > .door-t{grid-column:2}
  .v3 .x-door-list .door > div:first-child > .door-k{grid-row:1;align-self:end}
  .v3 .x-door-list .door > div:first-child > .door-t{grid-row:2;align-self:start;margin-bottom:0}
  .v3 .x-door-list .door > div:first-child > .door-d{grid-column:3;grid-row:1 / span 2;margin:0}
  .v3 .x-door-list .x-door-ico{grid-row:1 / span 2;align-self:center}
}

/* titolo a sinistra, testo a destra; blocchi affiancati su due colonne */
.v3 .x-head-split,.v3 .x-cols2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(2.5rem,6vw,6rem);row-gap:1.6rem;align-items:start}
.v3 main .x-head-split .head-block + *{margin-top:0}
.v3 .x-head-split .head-block h2{max-width:18ch}
.v3 .x-head-split-text p,.v3 .x-cols2 p{max-width:none}
.v3 .x-head-split-text{padding-top:.35rem}
.v3 .x-head-split + *{margin-top:clamp(2.5rem,5vw,4rem)}
.v3 .head-block + .x-cols2{margin-top:clamp(1.8rem,3vw,2.8rem)}
.v3 .x-cols2 > div > .head-block + p{margin-top:clamp(1.4rem,2.5vw,2rem)}
@media (max-width:900px){
  .v3 .x-head-split,.v3 .x-cols2{grid-template-columns:minmax(0,1fr)}
  .v3 .x-head-split-text{padding-top:0}
  .v3 .x-cols2-sec .x-cols2{row-gap:clamp(3rem,8vw,4rem)}
}
.v3 .head-block.x-head-center{text-align:center}
.v3 .head-block.x-head-center h2{margin-inline:auto}

/* Sistema: nota sullo stato di sviluppo a destra del testo introduttivo */
.v3 .x-page-hero .x-hero-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:clamp(2rem,5vw,4.5rem);align-items:start;margin-top:1.8rem;max-width:none}
.v3 .x-page-hero .x-hero-cols .lede{margin-top:0;max-width:none}
.v3 .x-page-hero .x-hero-cols .x-notice{margin-top:0;max-width:none}
@media (max-width:900px){
  .v3 .x-page-hero .x-hero-cols{grid-template-columns:minmax(0,1fr);row-gap:1.6rem}
}
@media (prefers-reduced-motion:no-preference){
  .v3 .x-hero-in > .x-hero-cols{animation:dvUp 1.1s cubic-bezier(.2,.7,.2,1) .45s both}
}

/* Sistema: schema della piattaforma accanto al testo */
@media (min-width:861px){
  .v3 .split.x-split-wide{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
}
.v3 .figure.x-infographic{margin:0}
.v3 .figure.x-infographic img{width:100%;height:auto;border-radius:8px !important;box-shadow:0 24px 50px rgba(0,50,73,.22)}

/* immagini a tutta larghezza, da bordo a bordo */
.v3 .x-wide{margin:0;position:relative;overflow:hidden;background:var(--dv-petrol)}
.v3 .x-wide img{display:block;width:100%;height:auto}
/* fotografie: su schermi molto larghi l'altezza resta contenuta */
@media (min-width:1200px){
  .v3 .x-wide.x-wide-photo img{height:min(56.25vw,88svh);object-fit:cover;object-position:50% 50%}
}
.v3 .x-wide.x-wide-dark{background:#021B28}
/* una sezione dopo un'immagine a tutta larghezza riparte con il suo respiro */
.v3 .x-wide + .section{padding-top:clamp(4.5rem,9vw,8.5rem)}

/* Flotte: linea del tempo orizzontale */
.v3 .x-timeline{list-style:none;margin:clamp(2.5rem,5vw,4rem) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(2rem,4vw,3.5rem);position:relative;counter-reset:none}
.v3 .x-timeline::before{content:"";position:absolute;left:28px;right:0;top:28px;height:2px;
  background:linear-gradient(90deg,var(--dv-teal) 0%,rgba(var(--dv-teal-rgb),.55) 70%,rgba(var(--dv-teal-rgb),0) 100%)}
.v3 .x-timeline li{position:relative;max-width:none}
.v3 .x-tl-dot{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;
  color:var(--dv-teal);background:var(--dv-deep);box-shadow:0 0 0 6px var(--paper),0 8px 20px rgba(var(--dv-petrol-rgb),.25)}
.v3 .x-tl-dot svg{width:26px;height:26px}
.v3 .x-tl-n{display:block;margin:1.3rem 0 .35rem;font-size:.72rem;font-weight:600;letter-spacing:.2em;color:var(--dv-teal-ink)}
.v3 .x-timeline h3{margin:0 0 .7rem;font-family:var(--sans);font-weight:500;letter-spacing:-.01em;line-height:1.25;font-size:clamp(1.08rem,1.25vw,1.25rem)}
.v3 .x-timeline p{max-width:none;color:var(--text-soft);font-size:.98rem}
@media (max-width:900px){
  .v3 .x-timeline{grid-template-columns:minmax(0,1fr);gap:2.2rem}
  .v3 .x-timeline::before{left:27px;right:auto;top:28px;bottom:28px;width:2px;height:auto;
    background:linear-gradient(180deg,var(--dv-teal) 0%,rgba(var(--dv-teal-rgb),.45) 100%)}
  .v3 .x-timeline li{display:grid;grid-template-columns:56px minmax(0,1fr);column-gap:1.2rem}
  .v3 .x-timeline li > :not(.x-tl-dot){grid-column:2}
  .v3 .x-tl-dot{grid-row:1 / span 3}
  .v3 .x-tl-n{margin-top:.3rem}
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .v3 .x-tl-n{color:var(--dv-teal)}
}
:root[data-theme="dark"] .v3 .x-tl-n{color:var(--dv-teal)}

/* "A che punto siamo": box con gradiente blu scuro (Cantieri Refit, Armatori, Broker e Assicurazioni) */
.v3 .x-status-deep .status{background:var(--dv-glow),var(--dv-deep);color:#D3DEE6;box-shadow:0 24px 50px rgba(var(--dv-petrol-rgb),.22)}
.v3 main .x-status-deep .status h3{color:var(--dv-white)}
.v3 main .x-status-deep .status-list li,.v3 main .x-status-deep .status p{color:#D3DEE6}
.v3 .x-status-deep .mark.now{background:rgba(var(--dv-teal-rgb),.18);color:var(--dv-white);border-color:rgba(var(--dv-teal-rgb),.7)}
.v3 .x-status-deep .mark.next{background:rgba(227,172,79,.12);color:#F0C274;border-color:rgba(227,172,79,.5)}
.v3 main .x-status-deep .status-foot{color:#C3D1DB}
.v3 .x-status-deep .status .btn-ink{background:var(--dv-white);color:var(--dv-petrol);border-color:var(--dv-white)}

/* Visione: testo d'apertura, foto a tutta larghezza, paragrafi su due colonne, pulsante "Chi siamo" */
.v3 .section.x-mf-open{padding-bottom:clamp(3rem,6vw,5rem)}
.v3 main .x-mf-open p.open{margin-bottom:0}
@media (min-width:901px){
  .v3 .x-mf-open .wrap{column-count:auto}
  .v3 main .x-mf-open p.open{max-width:40ch}
}
.v3 .x-manifesto .x-mf-actions{column-span:all;margin-top:clamp(2rem,4vw,3rem)}
.v3 .x-manifesto .x-mf-actions .hero-actions{margin:0}

/* ---------- 12. seconda revisione del 29/09/2026 ---------- */
/* parole in evidenza nei titoli su fondo chiaro: #056E92 */
.v3 main .head-block h2 em,
.v3 main .x-light .x-display em,.v3 main .x-white .x-display em,.v3 main .x-cool .x-display em,
.v3 main .x-quote em{color:#056E92;font-style:normal}
.v3 main .x-photo-band .head-block h2 em,.v3 main .section.dark .head-block h2 em{color:var(--dv-teal-light)}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .v3 main .head-block h2 em,
  :root:not([data-theme="light"]) .v3 main .x-display em,
  :root:not([data-theme="light"]) .v3 main .x-quote em{color:var(--dv-teal-light)}
}
:root[data-theme="dark"] .v3 main .head-block h2 em,:root[data-theme="dark"] .v3 main .x-display em,:root[data-theme="dark"] .v3 main .x-quote em{color:var(--dv-teal-light)}

/* titoli h1 delle intestazioni senza foto (Sistema, Architettura…): stessa misura delle altre pagine */
.v3 .x-page-hero.is-plain h1{font-size:clamp(2rem,3vw,3rem);max-width:26ch;line-height:1.05} /* come le pagine con foto (Visione, Chi siamo) */

/* home: titolo a sinistra e testo a destra; i due schemi a tutta larghezza, uno sotto l'altro */
.v3 .x-problem-head{align-items:center}
.v3 .x-problem-head .x-display{margin:0}
.v3 .x-compare.x-compare-stack{grid-template-columns:minmax(0,1fr);margin-top:clamp(3rem,6vw,4.5rem);gap:clamp(1.2rem,2.5vw,1.8rem)}
.v3 .x-compare-stack .x-cmp{display:block;padding:clamp(1.6rem,3vw,2.4rem) clamp(1.4rem,3vw,2.6rem)}
.v3 .x-compare-stack .x-cmp-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:.4rem 1.4rem}
.v3 .x-compare-stack .x-cmp-label{margin:0}
.v3 .x-compare-stack .x-cmp-notes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:.8rem clamp(1.6rem,4vw,3rem)}
.v3 .x-compare-stack .x-cmp-note{margin:0;padding:0}
.v3 .x-compare-stack .x-cmp-note + .x-cmp-note{margin-top:0}
/* schema compatto: frecce inglobate nelle voci, tutto su una riga */
.v3 .x-compare-stack .x-flow{display:flex;flex-wrap:nowrap;gap:0;margin:1.5rem 0 1.6rem;padding:0}
.v3 .x-compare-stack .x-flow li{flex:1 1 0;min-width:0;display:flex}
.v3 .x-compare-stack .x-flow li + li{margin-left:-8px}
.v3 .x-compare-stack .x-flow li:not(:last-child)::after{content:none}
.v3 .x-compare-stack .x-flow span,.v3 .x-compare-stack .x-flow strong{
  flex:1;display:flex;align-items:center;justify-content:center;min-height:48px;padding:.6rem 1rem .6rem 1.6rem;
  border:0;border-radius:0 !important;white-space:nowrap;font-size:.72rem;letter-spacing:.1em;
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,0 100%,14px 50%);
  background:#E3EBEF;color:var(--dv-petrol)}
.v3 .x-compare-stack .x-flow li:first-child span,.v3 .x-compare-stack .x-flow li:first-child strong{
  padding-left:1.1rem;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,0 100%)}
.v3 .x-compare-stack .x-flow li:last-child span,.v3 .x-compare-stack .x-flow li:last-child strong{
  padding-right:1.1rem;clip-path:polygon(0 0,100% 0,100% 100%,0 100%,14px 50%)}
.v3 .x-compare-stack .is-now .x-flow .is-key strong{background:var(--dv-petrol);color:#fff;box-shadow:none}
.v3 .x-compare-stack .is-vision .x-flow span{background:rgba(255,254,255,.12);color:var(--dv-white)}
.v3 .x-compare-stack .is-vision .x-flow .is-key strong{background:var(--dv-teal);color:var(--dv-petrol);box-shadow:none}
/* telefono: lo schema scende in verticale, con le frecce verso il basso */
@media (max-width:700px){
  .v3 .x-compare-stack .x-flow{flex-direction:column;align-items:stretch}
  .v3 .x-compare-stack .x-flow li{flex:none;width:100%}
  .v3 .x-compare-stack .x-flow li + li{margin-left:0;margin-top:-6px}
  .v3 .x-compare-stack .x-flow span,.v3 .x-compare-stack .x-flow strong,
  .v3 .x-compare-stack .x-flow li:first-child span,.v3 .x-compare-stack .x-flow li:first-child strong,
  .v3 .x-compare-stack .x-flow li:last-child span,.v3 .x-compare-stack .x-flow li:last-child strong{
    min-height:44px;padding:.7rem 1rem 1rem;
    clip-path:polygon(0 0,50% 10px,100% 0,100% calc(100% - 10px),50% 100%,0 calc(100% - 10px))}
  .v3 .x-compare-stack .x-flow li:first-child span,.v3 .x-compare-stack .x-flow li:first-child strong{padding-top:.6rem;clip-path:polygon(0 0,100% 0,100% calc(100% - 10px),50% 100%,0 calc(100% - 10px))}
  .v3 .x-compare-stack .x-flow li:last-child span,.v3 .x-compare-stack .x-flow li:last-child strong{padding-bottom:.6rem;clip-path:polygon(0 0,50% 10px,100% 0,100% 100%,0 100%)}
}
/* frase finale: centrata e in evidenza */
.v3 .x-quote.x-quote-center{margin:clamp(3.5rem,7vw,5.5rem) auto 0;max-width:34ch;text-align:center;font-size:clamp(1.35rem,2vw,1.9rem);line-height:1.35;position:relative;padding-top:2rem}
.v3 .x-quote.x-quote-center::before{content:"";position:absolute;top:0;left:50%;width:56px;height:2px;margin-left:-28px;background:var(--dv-teal)}

/* titolo e testo centrati */
.v3 .x-center-intro{text-align:center;max-width:760px;margin-inline:auto}
.v3 .x-center-intro .head-block h2{margin-inline:auto}
.v3 .x-center-intro p{max-width:62ch;margin:1.2rem auto 0}
.v3 main .x-center-intro .head-block + p{margin-top:clamp(1.2rem,2.5vw,1.8rem)}
.v3 .x-center-intro + *{margin-top:clamp(2.5rem,5vw,4rem)}
.v3 main .x-center-note{margin:clamp(2rem,4vw,3rem) auto 0;text-align:center;max-width:70ch}
.v3 .head-block.x-head-center + *{margin-top:clamp(2.2rem,4vw,3.2rem)}

/* una colonna di paragrafi (Sistema: "Vedere un problema…") */
.v3 .cols.cols-1{grid-template-columns:minmax(0,1fr)}
.v3 .x-cols2-stack .x-cols2{align-items:start}
.v3 .x-cols2-stack .feat:first-child{padding-top:0;border-top:0}

/* righe alternate immagine / testo (Architettura, Cantieri) */
.v3 .x-rows{display:grid;gap:clamp(4rem,8vw,7rem)}
.v3 .x-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(2.5rem,5vw,5rem);align-items:center}
.v3 .x-row-fig{margin:0}
.v3 .x-row-fig img{display:block;width:100%;height:auto;border-radius:8px;box-shadow:0 24px 50px rgba(var(--dv-petrol-rgb),.2)}
.v3 .x-row-fig.is-tall img{max-height:880px;object-fit:contain;box-shadow:none;filter:drop-shadow(0 24px 40px rgba(var(--dv-petrol-rgb),.22))}
.v3 .x-row-text > h3{font-family:var(--sans);font-weight:500;font-size:clamp(1.3rem,1.8vw,1.6rem);letter-spacing:-.01em;line-height:1.25;margin:1rem 0 .9rem}
.v3 .x-row-text p{max-width:none}
.v3 .x-row-ico{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:8px;color:var(--dv-teal-ink);background:rgba(var(--dv-teal-rgb),.12)}
.v3 .x-row-text .cols{margin-top:0 !important}
.v3 .x-row-text .feat:first-child{padding-top:0;border-top:0}
@media (max-width:900px){
  .v3 .x-row{grid-template-columns:minmax(0,1fr)}
  .v3 .x-row:not(.img-left) .x-row-fig{order:-1}
  .v3 .x-row-fig.is-tall img{max-height:620px;margin-inline:auto;width:auto;max-width:100%}
}

/* card con gradiente e leggero ingrandimento al passaggio del mouse */
.v3 .x-cards{display:grid;gap:clamp(1rem,2vw,1.6rem)}
.v3 .x-cards-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.v3 .x-cards-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.v3 .x-cards-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.v3 .x-card{border-radius:10px;padding:clamp(1.5rem,2.6vw,2.2rem);transition:transform .45s var(--ease),box-shadow .45s var(--ease);will-change:transform}
.v3 .x-card h3{font-family:var(--sans);font-weight:500;font-size:clamp(1.08rem,1.25vw,1.25rem);letter-spacing:-.01em;line-height:1.25;margin:0 0 .7rem}
.v3 .x-card p{margin:0;font-size:.97rem;line-height:1.65;max-width:none}
.v3 .x-card-ico{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:8px;margin-bottom:1.2rem}
.v3 .x-card-ico svg{width:24px;height:24px}
.v3 .x-card:hover{transform:scale(1.03)}
.v3 .x-cards.is-deep .x-card{background:radial-gradient(80% 70% at 100% 100%,rgba(var(--dv-teal-rgb),.18) 0%,rgba(var(--dv-teal-rgb),0) 60%),var(--dv-deep);color:#D3DEE6;box-shadow:0 16px 36px rgba(var(--dv-petrol-rgb),.18)}
.v3 main .x-cards.is-deep .x-card h3{color:var(--dv-white)}
.v3 main .x-cards.is-deep .x-card p{color:#D3DEE6}
.v3 .x-cards.is-deep .x-card-ico{color:var(--dv-teal);background:rgba(var(--dv-teal-rgb),.16)}
.v3 .x-cards.is-deep .x-card:hover{box-shadow:0 26px 50px rgba(var(--dv-petrol-rgb),.3)}
.v3 .x-cards.is-light .x-card{background:linear-gradient(180deg,#FFFEFF 0%,#EEF3F6 100%);border:1px solid #D7E1E7;border-top:3px solid var(--dv-teal)}
.v3 .x-cards.is-light .x-card:hover{box-shadow:0 22px 44px rgba(var(--dv-petrol-rgb),.14)}
.v3 main .x-cards.is-light .x-card h3{color:var(--dv-petrol)}
.v3 main .x-cards.is-light .x-card p{color:var(--text-soft)}
.v3 .x-cards-5 .x-card{padding:1.5rem 1.35rem}
.v3 .x-cards-5 .x-card p{font-size:.93rem;line-height:1.6}
@media (max-width:1100px){.v3 .x-cards-5{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.v3 .x-cards-3{grid-template-columns:minmax(0,1fr)}}
@media (max-width:760px){.v3 .x-cards-2,.v3 .x-cards-5{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.v3 .x-card:hover{transform:none}}

/* Refit: "Come si installa" in due colonne, due righe */
.v3 .steps.x-steps-2{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(2rem,5vw,4.5rem);border-top:0}
.v3 .x-steps-2 .step{border-top:1px solid var(--line)}
@media (max-width:760px){.v3 .steps.x-steps-2{grid-template-columns:minmax(0,1fr)}}

/* figure spostate (Flotte, Assicurazioni) */
.v3 .figure.x-fig-before{margin:0 auto clamp(3.5rem,7vw,5.5rem)}
.v3 .figure.x-fig-center{max-width:900px;margin:0 auto clamp(3rem,6vw,4.5rem)}
@media (min-width:861px){.v3 .split.x-split-wide-left{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}}
.v3 .split .figure.device.x-fig-big{max-width:none}

/* Visione: frase d'apertura accanto alla foto; testo bianco sulla foto con gradiente blu */
.v3 .x-mf-open-text p.open{margin:0}
.v3 .x-photo-text{position:relative;overflow:hidden;background:var(--dv-petrol);min-height:clamp(520px,80svh,820px);display:flex;align-items:center}
.v3 .x-pt-media{position:absolute;inset:0;margin:0}
.v3 .x-pt-media img{width:100%;height:100%;object-fit:cover;object-position:60% 40%}
.v3 .x-pt-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,32,47,.94) 0%,rgba(0,40,59,.82) 38%,rgba(0,50,73,.4) 66%,rgba(0,50,73,.12) 100%)}
.v3 .x-pt-in{position:relative;z-index:1;width:100%;box-sizing:border-box;padding-block:clamp(4.5rem,9vw,8rem)}
.v3 main .x-pt-in p{color:#fff;max-width:52ch;font-weight:300;font-size:clamp(1.12rem,.55vw + .95rem,1.32rem);line-height:1.7}
.v3 main .x-pt-in p + p{margin-top:1.4rem}
@media (max-width:900px){.v3 .x-pt-media::after{background:linear-gradient(0deg,rgba(0,32,47,.95) 0%,rgba(0,40,59,.8) 60%,rgba(0,50,73,.55) 100%)}}

/* Chi siamo: foto di sfondo con gradiente blu e testo bianco, a sinistra */
.v3 .x-photo-squadra .wrap > *,.v3 .x-photo-persone .wrap > *{margin-left:0;margin-right:auto;max-width:min(560px,48%)}
.v3 .x-photo-squadra .x-band-media::after,.v3 .x-photo-persone .x-band-media::after{background:linear-gradient(90deg,rgba(0,32,47,.95) 0%,rgba(0,40,59,.86) 34%,rgba(0,50,73,.45) 58%,rgba(0,50,73,.1) 80%)}
.v3 .x-photo-persone .x-band-media img{object-position:70% 30%}
.v3 .x-photo-squadra .x-band-media img{object-position:50% 40%}
.v3 .x-photo-band .hero-actions{margin-top:2rem}
@media (max-width:900px){
  .v3 .x-photo-squadra .wrap > *,.v3 .x-photo-persone .wrap > *{max-width:none}
  .v3 .x-photo-squadra .x-band-media::after,.v3 .x-photo-persone .x-band-media::after{background:linear-gradient(0deg,rgba(0,50,73,1) 0%,rgba(0,50,73,0) 35%)}
}

/* Contatti: box chiari con icona, in colonne */
.v3 .entries.x-entries{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,2vw,1.5rem);border-top:0}
.v3 .x-entries .entry{border:1px solid #D7E1E7;border-radius:10px;padding:clamp(1.4rem,2.4vw,2rem);background:linear-gradient(180deg,#FFFEFF 0%,#F0F4F6 100%);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.v3 .x-entries .entry:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(var(--dv-petrol-rgb),.12)}
.v3 .x-entries .entry p{max-width:none}
.v3 .x-entry-ico{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:8px;margin-bottom:1rem;color:var(--dv-teal-ink);background:rgba(var(--dv-teal-rgb),.12)}
.v3 .x-entry-ico svg{width:24px;height:24px}
@media (max-width:980px){.v3 .entries.x-entries{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.v3 .entries.x-entries{grid-template-columns:minmax(0,1fr)}}

/* ---------- 13. terza revisione del 29/09/2026 ---------- */
/* titolo che introduce le sezioni a tutta larghezza (Architettura, Cantieri) */
.v3 .section.x-sec-intro{padding-bottom:clamp(3rem,6vw,5rem)}
/* righe a tutta larghezza: la foto riempie la sua colonna, come "Il rapporto con il cliente…" */
.v3 .x-row-bleed .x-bleed-media img{object-position:50% 50%}
.v3 .x-row-bleed.is-tall .x-bleed-media img{object-position:50% 30%}
.v3 .x-row-bleed .x-row-text .cols{margin-top:0 !important}
.v3 .x-row-bleed .x-row-text .feat:first-child{padding-top:0;border-top:0}
.v3 .x-row-bleed + .x-row-bleed{border-top:0}
.v3 .x-bleed-sec.x-row-bleed{min-height:clamp(520px,78svh,820px)}
@media (max-width:900px){.v3 .x-row-bleed.is-tall .x-bleed-media{aspect-ratio:3/4}}
/* Architettura: immagine intera, a tutta larghezza della sua colonna (nessun ritaglio); il testo resta centrato accanto */
.v3 .x-bleed-sec.x-row-bleed.is-whole{min-height:0;align-items:center;background:var(--paper)}
.v3 .x-row-bleed.is-whole .x-bleed-media{min-height:0;height:auto;aspect-ratio:auto;align-self:stretch;display:flex;align-items:center;background:transparent}
.v3 .x-row-bleed.is-whole .x-bleed-media img{position:static;width:100%;height:auto;object-fit:contain}
@media (max-width:900px){.v3 .x-row-bleed.is-whole .x-bleed-media{aspect-ratio:auto}}
/* Architettura (revisione): immagine più piccola, affiancata al testo dentro la colonna del sito, non a tutta altezza */
.v3 .x-bleed-sec.x-row-bleed.is-whole{max-width:1180px;margin-inline:auto;box-sizing:border-box;padding:clamp(2.5rem,5vw,4rem) var(--pad);
  grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:clamp(2.5rem,5vw,5rem);background:transparent}
.v3 .x-bleed-sec.x-bleed-left.x-row-bleed.is-whole{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.v3 .x-row-bleed.is-whole .x-bleed-text{padding:0;max-width:none;justify-self:stretch;align-self:center}
.v3 .x-row-bleed.is-whole .x-bleed-media{align-self:center;justify-content:center;overflow:visible}
.v3 .x-row-bleed.is-whole .x-bleed-media img{width:auto;max-width:100%;max-height:600px;border-radius:8px;box-shadow:0 24px 50px rgba(var(--dv-petrol-rgb),.2)}
.v3 .section.x-sec-intro + .x-row-bleed.is-whole{padding-top:0}
/* l'immagine parte in alto, accanto all'inizio del testo; nel testo lungo (Hub) resta visibile durante lo scorrimento */
@media (min-width:901px){
  .v3 .x-row-bleed.is-whole .x-bleed-media{align-self:start;position:sticky;top:calc(var(--head-h) + 2rem)}
}
.v3 .section.x-sec-intro:has(+ .x-row-bleed.is-whole){padding-bottom:clamp(2rem,4vw,3rem)}
@media (max-width:900px){
  .v3 .x-bleed-sec.x-row-bleed.is-whole,.v3 .x-bleed-sec.x-bleed-left.x-row-bleed.is-whole{grid-template-columns:minmax(0,1fr);row-gap:2rem}
  .v3 .x-row-bleed.is-whole .x-bleed-media{order:-1}
  .v3 .x-row-bleed.is-whole .x-bleed-media img{max-height:460px}
}

/* Visione: frase d'apertura bianca al centro, su blu con gradiente */
.v3 .section.x-mf-intro{background:var(--dv-glow),var(--dv-deep);text-align:center;padding-block:clamp(5rem,10vw,8.5rem)}
.v3 main .x-mf-intro p.open{margin:0 auto;max-width:34ch;color:var(--dv-white);font-family:var(--sans);font-weight:300;font-size:clamp(1.35rem,1.4vw + 1rem,2rem);line-height:1.4;letter-spacing:-.015em}
.v3 .section.x-mf-intro + .section{padding-top:clamp(4.5rem,9vw,7.5rem)}
/* "Non siamo partiti da un laboratorio." in evidenza, al centro */
.v3 main .x-manifesto p.x-mf-highlight{column-span:all;text-align:center;max-width:none;margin:clamp(2.5rem,5vw,4rem) auto 0;color:#056E92;font-weight:300;font-size:clamp(1.5rem,2.2vw,2.3rem);line-height:1.25;letter-spacing:-.02em}
/* firme e pulsante a destra */
.v3 .x-manifesto .x-mf-end{column-span:all;display:flex;flex-direction:column;align-items:flex-end;margin-top:clamp(2.5rem,5vw,3.5rem);padding-top:1.5rem;border-top:1px solid var(--line)}
.v3 .x-manifesto .x-mf-end .sign{margin:0;padding:0;border:0;justify-content:flex-end;text-align:right}
.v3 .x-manifesto .x-mf-end .x-mf-actions{margin-top:1.6rem}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .v3 main .x-manifesto p.x-mf-highlight{color:var(--dv-teal-light)}}
:root[data-theme="dark"] .v3 main .x-manifesto p.x-mf-highlight{color:var(--dv-teal-light)}

/* ---------- 14. quarta revisione del 29/09/2026 ---------- */
/* intestazioni senza foto (Sistema, Architettura, Contatti…): più respiro sopra e sotto */
.v3 .x-page-hero.is-plain{min-height:clamp(520px,74svh,780px)}
.v3.inner .x-page-hero.is-plain .x-hero-in{padding-top:calc(var(--head-h) + clamp(4rem,8vw,7rem));padding-bottom:clamp(4.5rem,9vw,7.5rem)}

/* Cantieri: pacchetti più grandi, con icona; la griglia si allarga oltre la colonna di testo */
.v3 .x-cards-5{width:min(1360px,calc(100vw - 2 * var(--pad)));position:relative;left:50%;transform:translateX(-50%);gap:clamp(1rem,1.6vw,1.4rem)}
.v3 .x-cards-5 .x-card{padding:clamp(1.8rem,2.4vw,2.4rem) clamp(1.4rem,1.8vw,1.8rem);min-height:clamp(260px,24vw,320px)}
.v3 .x-cards-5 .x-card h3{font-size:clamp(1.15rem,1.35vw,1.35rem)}
.v3 .x-cards-5 .x-card p{font-size:.97rem;line-height:1.65}
@media (max-width:1100px){.v3 .x-cards-5 .x-card{min-height:0}}
@media (max-width:760px){.v3 .x-cards-5{width:auto;left:auto;transform:none}}

/* Flotte: immagine della gestione flotta subito dopo "Tutta la flotta in una schermata" */
.v3 .figure.x-fig-fleet{margin:clamp(2rem,4vw,3rem) auto clamp(3rem,6vw,4.5rem)}

/* chiusure scure con invito all'azione: sempre centrate */
.v3 .section.dark .wrap{text-align:center}
.v3 .section.dark .wrap h2,.v3 .section.dark .wrap p{margin-inline:auto}
.v3 .section.dark .hero-actions{justify-content:center}

/* footer, parte finale su due righe:
   1) ragione sociale · email · telefono   2) nota sui marchi a sinistra, Privacy | Cookie | Note legali a destra */
.v3 .site-foot .foot-bot{display:block}
@media (min-width:1041px){.v3 .site-foot .foot-bot{display:block;padding-right:88px}}
.v3 .site-foot .foot-bot p{margin:0;max-width:none}
.v3 .foot-line1{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .7rem;font-size:.84rem;color:var(--on-navy-soft)}
.v3 .site-foot .foot-company{white-space:normal}
.v3 .site-foot .foot-sep{color:rgba(211,222,230,.45)}
.v3 .foot-line2{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem 2rem;margin-top:.8rem}
.v3 .site-foot .foot-line2 .foot-note{padding:0;font-size:.78rem;line-height:1.5;color:#B9C8D2;flex:1 1 380px}
.v3 .foot-legal{display:flex;align-items:center;gap:.6rem;margin-left:auto;font-size:.84rem}
@media (max-width:700px){.v3 .foot-legal{margin-left:0}}
@media (max-width:1040px){
  .v3 .foot-line1{column-gap:1.2rem}
  .v3 .foot-line1 .foot-sep{display:none}
  .v3 .foot-line1 .foot-company{flex-basis:100%}
}

/* moduli: campo trappola per i robot, invisibile alle persone */
.hp-field{position:absolute !important;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}

/* testi legali */
.sr-only{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.v3 .legal-nav{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:2rem}
.v3 .legal-nav a{display:inline-flex;padding:.6rem 1rem;border:1px solid rgba(255,254,255,.5);border-radius:4px;color:#fff;text-decoration:none;font-size:.8rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;transition:background-color .2s,border-color .2s}
.v3 .x-page-hero .x-hero-in .legal-nav a{text-decoration:none}
.v3 .legal-nav a:hover,.v3 .legal-nav a:focus-visible{background:#067F79;border-color:#067F79}
.v3 .legal-page .wrap{max-width:900px}
.v3 .legal-doc{scroll-margin-top:calc(var(--head-h) + 1.5rem)}
.v3 .legal-doc + .legal-doc{margin-top:clamp(4rem,8vw,6rem);padding-top:clamp(3rem,6vw,4.5rem);border-top:1px solid var(--line)}
.v3 main .legal-doc h2{font-weight:300;font-size:clamp(1.75rem,2.6vw,2.4rem);letter-spacing:-.03em;line-height:1.1;margin:0 0 1.2rem;max-width:none}
.v3 main .legal-doc h3{font-family:var(--sans);font-weight:500;font-size:clamp(1.1rem,1.4vw,1.3rem);letter-spacing:-.01em;margin:2.4rem 0 .8rem;color:var(--text)}
.v3 main .legal-doc h4{font-family:var(--sans);font-weight:600;font-size:1rem;margin:1.6rem 0 .6rem;color:var(--text)}
.v3 main .legal-doc p{max-width:none;color:var(--text-soft);font-size:.99rem;line-height:1.7}
.v3 main .legal-doc p + p{margin-top:.8rem}
.v3 main .legal-doc p strong{color:var(--text);font-weight:600}
.v3 main .legal-doc a{color:var(--dv-teal-ink);text-decoration:underline;text-underline-offset:3px}
.v3 main .legal-doc .legal-date{font-size:.9rem;color:var(--text-faint)}
.v3 main .legal-doc .legal-note{margin-top:1.8rem;padding:1rem 1.2rem;border-left:3px solid var(--dv-teal);background:var(--dv-cool);font-style:italic}
.v3 .legal-list{margin:.6rem 0 0;padding:0;list-style:none;display:grid;gap:.5rem}
.v3 .legal-list li{position:relative;padding-left:1.1rem;color:var(--text-soft);font-size:.99rem;line-height:1.65}
.v3 .legal-list li::before{content:"";position:absolute;left:0;top:.68em;width:6px;height:6px;background:var(--dv-teal)}
.v3 .legal-table-wrap{margin-top:1rem;overflow-x:auto;-webkit-overflow-scrolling:touch}
.v3 .legal-table{width:100%;border-collapse:collapse;font-size:.95rem;line-height:1.55}
.v3 .legal-table th,.v3 .legal-table td{text-align:left;vertical-align:top;padding:.85rem 1rem;border-bottom:1px solid var(--line)}
.v3 .legal-table thead th{background:var(--dv-petrol);color:var(--dv-white);font-weight:600;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase}
.v3 .legal-table tbody th{font-weight:500;color:var(--text);width:52%}
.v3 .legal-table td{color:var(--text-soft)}
@media (max-width:620px){
  .v3 .legal-table,.v3 .legal-table tbody,.v3 .legal-table tr,.v3 .legal-table th,.v3 .legal-table td{display:block;width:auto}
  .v3 .legal-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  .v3 .legal-table tr{border-bottom:1px solid var(--line);padding:.8rem 0}
  .v3 .legal-table th,.v3 .legal-table td{border:0;padding:.2rem 0}
  .v3 .legal-table tbody th{width:auto}
}