/* =========================================================
   PAGINA DIVING — CHIAVE DEL MARE
   Desktop / Tablet / Mobile
   ========================================================= */
.cdm-diving-page { background:#fff; color:#36545c; }
.cdm-diving-shell { width:min(1180px, calc(100% - 64px)); margin:0 auto; }

.cdm-diving-hero { position:relative; min-height:92svh; display:flex; align-items:center; justify-content:center; overflow:hidden; background:#042f3f; }
.cdm-diving-hero-video, .cdm-diving-hero-bg { position:absolute; inset:0; width:100%; height:100%; max-width:none; object-fit:cover; object-position:center 48%; transform:scale(1.02); }
.cdm-diving-hero-video { display:block; }
.cdm-diving-hero-mobile { display:none; }
.cdm-diving-hero-overlay { position:absolute; inset:0; background:linear-gradient(180deg,rgba(3,31,45,.26) 0%,rgba(3,31,45,.16) 42%,rgba(3,31,45,.64) 100%); }
.cdm-diving-hero-content { position:relative; z-index:2; width:min(1020px, calc(100% - 48px)); padding:150px 0 100px; text-align:center; color:#fff; }
.cdm-diving-hero-content .cdm-eyebrow { color:#68e3f7; text-shadow:0 2px 14px rgba(0,0,0,.24); }
.cdm-diving-hero h1 { margin:0 auto 24px; max-width:980px; color:#fff; font-size:clamp(52px,6.4vw,92px); line-height:.98; text-shadow:0 8px 35px rgba(0,0,0,.32); }
.cdm-diving-hero-content > p:not(.cdm-eyebrow) { max-width:760px; margin:0 auto 38px; font-size:clamp(18px,1.45vw,22px); line-height:1.7; color:#fff; text-shadow:0 3px 16px rgba(0,0,0,.35); }
.cdm-diving-scroll { position:absolute; z-index:3; left:50%; bottom:28px; width:34px; height:54px; border:1px solid rgba(255,255,255,.7); border-radius:999px; transform:translateX(-50%); }
.cdm-diving-scroll span { position:absolute; left:50%; top:11px; width:5px; height:5px; border-radius:50%; background:#fff; transform:translateX(-50%); animation:cdmDiveScroll 1.8s ease-in-out infinite; }
@keyframes cdmDiveScroll { 0%{transform:translate(-50%,0);opacity:0} 25%{opacity:1} 75%{opacity:1} 100%{transform:translate(-50%,21px);opacity:0} }

.cdm-diving-intro { padding:130px 0; background:linear-gradient(180deg,#fff 0%,#f5fcfd 100%); }
.cdm-diving-intro-grid { display:grid; grid-template-columns:minmax(0,.92fr) minmax(420px,1.08fr); gap:86px; align-items:center; }
.cdm-diving-intro-copy h2,.cdm-diving-section-head h2,.cdm-diving-cta h2 { margin:0 0 28px; color:#102033; font-size:clamp(42px,4.4vw,66px); line-height:1.04; }
.cdm-diving-intro-copy > p:last-child { margin:0; max-width:620px; font-size:18px; line-height:1.85; color:#49666d; }
.cdm-diving-feature-image { position:relative; margin:0; height:620px; border-radius:38px 38px 170px 38px; overflow:visible; }
.cdm-diving-feature-image img { width:100%; height:100%; object-fit:cover; object-position:center; border-radius:inherit; box-shadow:0 32px 75px rgba(5,65,83,.18); }
.cdm-diving-feature-image::after { content:""; position:absolute; right:-26px; bottom:-26px; width:170px; height:170px; border:2px solid rgba(24,199,232,.28); border-radius:50%; z-index:-1; }
.cdm-diving-bubble { position:absolute; border:1px solid rgba(42,190,219,.28); border-radius:50%; background:rgba(255,255,255,.28); backdrop-filter:blur(4px); }
.cdm-diving-bubble-a { width:70px; height:70px; left:-34px; top:18%; }
.cdm-diving-bubble-b { width:28px; height:28px; left:-52px; top:11%; }

.cdm-diving-experiences { padding:135px 0 145px; background:#eef9fa; }
.cdm-diving-section-head { max-width:850px; margin:0 auto 64px; text-align:center; }
.cdm-diving-section-head .cdm-eyebrow { color:#11bcd9; }
.cdm-diving-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.cdm-diving-card { overflow:hidden; border-radius:28px; background:#fff; box-shadow:0 18px 45px rgba(6,67,84,.09); transition:transform .32s ease,box-shadow .32s ease; }
.cdm-diving-card:hover { transform:translateY(-8px); box-shadow:0 26px 58px rgba(6,67,84,.15); }
.cdm-diving-card-image { height:320px; background-image:linear-gradient(180deg,transparent 58%,rgba(3,40,53,.25)),url('../images/diving-desktop.webp'); background-size:cover; }
.cdm-diving-card-1 .cdm-diving-card-image { background-position:18% center; }
.cdm-diving-card-2 .cdm-diving-card-image { background-position:50% center; }
.cdm-diving-card-3 .cdm-diving-card-image { background-position:82% center; }
.cdm-diving-card-body { position:relative; min-height:245px; padding:34px 32px 36px; }
.cdm-diving-card-number { position:absolute; right:25px; top:20px; color:rgba(17,188,217,.16); font:800 54px/1 Poppins,sans-serif; }
.cdm-diving-card h3 { position:relative; margin:0 0 16px; padding-right:46px; color:#102033; font-size:25px; line-height:1.15; }
.cdm-diving-card p { position:relative; margin:0; font-size:16px; line-height:1.75; color:#577078; }

.cdm-diving-sea { position:relative; min-height:720px; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.cdm-diving-sea-bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; }
.cdm-diving-sea-overlay { position:absolute; inset:0; background:linear-gradient(90deg,rgba(1,34,49,.76) 0%,rgba(1,34,49,.52) 42%,rgba(1,34,49,.18) 100%); }
.cdm-diving-sea-copy { position:relative; z-index:2; width:min(1180px,calc(100% - 64px)); margin:0 auto; color:#fff; }
.cdm-diving-sea-copy > * { max-width:660px; }
.cdm-diving-sea-copy h2 { margin:0 0 24px; color:#fff; font-size:clamp(46px,5vw,74px); }
.cdm-diving-sea-copy > p:last-child { margin:0; font-size:19px; line-height:1.8; color:#fff; text-shadow:0 2px 12px rgba(0,0,0,.28); }

.cdm-diving-why { padding:140px 0; background:#fff; }
.cdm-diving-section-head-left { margin-left:0; text-align:left; }
.cdm-diving-why-grid { display:grid; grid-template-columns:1fr 1fr; gap:0 56px; border-top:1px solid #d9e9ec; }
.cdm-diving-reason { display:grid; grid-template-columns:64px 1fr; gap:22px; padding:38px 0; border-bottom:1px solid #d9e9ec; }
.cdm-diving-reason > span { color:#1cbcd8; font:700 15px/1.4 Poppins,sans-serif; letter-spacing:1.5px; }
.cdm-diving-reason h3 { margin:0 0 10px; font-size:23px; color:#102033; }
.cdm-diving-reason p { margin:0; color:#587079; line-height:1.75; }

.cdm-diving-gallery { padding:130px 0 145px; background:#f7fbfb; }
.cdm-diving-gallery-grid { display:grid; grid-template-columns:1.35fr .65fr; grid-template-rows:280px 280px; gap:24px; }
.cdm-diving-gallery-grid figure { margin:0; overflow:hidden; border-radius:28px; }
.cdm-diving-gallery-grid img { width:100%; height:100%; object-fit:cover; transition:transform .7s ease; }
.cdm-diving-gallery-grid figure:hover img { transform:scale(1.045); }
.cdm-diving-gallery-main { grid-row:1 / 3; }
.cdm-diving-gallery-main img { object-position:center; }

.cdm-diving-cta { position:relative; overflow:hidden; padding:135px 0; background:linear-gradient(135deg,#05384a 0%,#075267 52%,#073442 100%); }
.cdm-diving-cta::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 20% 20%,rgba(24,199,232,.18),transparent 34%),radial-gradient(circle at 85% 80%,rgba(163,62,144,.18),transparent 32%); }
.cdm-diving-cta-inner { position:relative; z-index:2; max-width:900px; text-align:center; color:#fff; }
.cdm-diving-cta h2 { color:#fff; }
.cdm-diving-cta-inner > p:not(.cdm-eyebrow) { max-width:720px; margin:0 auto 34px; color:#dceff2; font-size:18px; line-height:1.8; }
.cdm-diving-cta-orb { position:absolute; border:1px solid rgba(255,255,255,.11); border-radius:50%; }
.cdm-diving-cta-orb-1 { width:360px; height:360px; left:-150px; top:-120px; }
.cdm-diving-cta-orb-2 { width:250px; height:250px; right:-70px; bottom:-110px; }

@media (max-width:1024px) {
  .cdm-diving-shell,.cdm-diving-sea-copy { width:min(92%,900px); }
  .cdm-diving-hero { min-height:82svh; }
  .cdm-diving-intro { padding:105px 0; }
  .cdm-diving-intro-grid { grid-template-columns:1fr 1fr; gap:48px; }
  .cdm-diving-feature-image { height:520px; border-radius:30px 30px 115px 30px; }
  .cdm-diving-experiences,.cdm-diving-why,.cdm-diving-gallery { padding:105px 0; }
  .cdm-diving-cards { gap:20px; }
  .cdm-diving-card-image { height:250px; }
  .cdm-diving-card-body { padding:28px 24px 30px; min-height:260px; }
  .cdm-diving-sea { min-height:600px; }
  .cdm-diving-gallery-grid { grid-template-rows:230px 230px; }
}

@media (max-width:782px) {
  .cdm-diving-shell,.cdm-diving-sea-copy { width:calc(100% - 40px); }
  .cdm-diving-hero { min-height:78svh; }
  .cdm-diving-hero-bg { object-position:54% center; }
  .cdm-diving-hero-content { width:calc(100% - 40px); padding:125px 0 80px; }
  .cdm-diving-hero h1 { font-size:clamp(45px,9vw,66px); }
  .cdm-diving-scroll { bottom:20px; }
  .cdm-diving-intro-grid { grid-template-columns:1fr; gap:54px; }
  .cdm-diving-intro-copy { max-width:680px; }
  .cdm-diving-feature-image { width:88%; height:520px; margin-left:auto; }
  .cdm-diving-cards { grid-template-columns:1fr; gap:26px; }
  .cdm-diving-card { display:grid; grid-template-columns:.9fr 1.1fr; }
  .cdm-diving-card-image { height:100%; min-height:280px; }
  .cdm-diving-card-body { min-height:0; display:flex; flex-direction:column; justify-content:center; }
  .cdm-diving-sea { min-height:580px; }
  .cdm-diving-sea-overlay { background:linear-gradient(90deg,rgba(1,34,49,.78),rgba(1,34,49,.42)); }
  .cdm-diving-why-grid { grid-template-columns:1fr; }
  .cdm-diving-gallery-grid { grid-template-columns:1fr 1fr; grid-template-rows:400px 240px; }
  .cdm-diving-gallery-main { grid-column:1 / 3; grid-row:auto; }
  .cdm-diving-cta { padding:110px 0; }
}

@media (max-width:520px) {
  .cdm-diving-shell,.cdm-diving-sea-copy { width:calc(100% - 32px); }
  .cdm-diving-hero { min-height:760px; }
  .cdm-diving-hero-bg { object-position:58% center; }
  .cdm-diving-hero-overlay { background:linear-gradient(180deg,rgba(3,31,45,.32),rgba(3,31,45,.22) 38%,rgba(3,31,45,.72)); }
  .cdm-diving-hero-content { width:calc(100% - 32px); padding:135px 0 95px; }
  .cdm-diving-hero-content .cdm-eyebrow { font-size:11px; letter-spacing:2.3px; }
  .cdm-diving-hero h1 { font-size:clamp(42px,13vw,59px); margin-bottom:20px; }
  .cdm-diving-hero-content > p:not(.cdm-eyebrow) { font-size:17px; line-height:1.62; margin-bottom:30px; }
  .cdm-diving-intro,.cdm-diving-experiences,.cdm-diving-why,.cdm-diving-gallery { padding:82px 0; }
  .cdm-diving-intro-copy h2,.cdm-diving-section-head h2,.cdm-diving-cta h2 { font-size:clamp(36px,10vw,48px); margin-bottom:22px; }
  .cdm-diving-intro-copy > p:last-child { font-size:16px; line-height:1.78; }
  .cdm-diving-feature-image { width:100%; height:420px; border-radius:24px 24px 90px 24px; }
  .cdm-diving-bubble-a { left:-14px; width:48px; height:48px; }
  .cdm-diving-bubble-b { left:5px; top:8%; }
  .cdm-diving-section-head { margin-bottom:42px; }
  .cdm-diving-card { display:block; border-radius:24px; }
  .cdm-diving-card-image { height:280px; min-height:0; }
  .cdm-diving-card-body { min-height:0; padding:30px 25px 32px; }
  .cdm-diving-card h3 { font-size:23px; }
  .cdm-diving-sea { min-height:620px; }
  .cdm-diving-sea-bg { object-position:58% center; }
  .cdm-diving-sea-overlay { background:rgba(1,34,49,.61); }
  .cdm-diving-sea-copy { text-align:center; }
  .cdm-diving-sea-copy > * { margin-left:auto; margin-right:auto; }
  .cdm-diving-sea-copy h2 { font-size:clamp(42px,12vw,56px); }
  .cdm-diving-sea-copy > p:last-child { font-size:17px; line-height:1.7; }
  .cdm-diving-why-grid { gap:0; }
  .cdm-diving-reason { grid-template-columns:42px 1fr; gap:14px; padding:30px 0; }
  .cdm-diving-reason h3 { font-size:21px; }
  .cdm-diving-gallery-grid { display:flex; flex-direction:column; gap:16px; }
  .cdm-diving-gallery-grid figure,.cdm-diving-gallery-main { height:270px; }
  .cdm-diving-gallery-main { height:390px; }
  .cdm-diving-cta { padding:90px 0; }
  .cdm-diving-cta-inner > p:not(.cdm-eyebrow) { font-size:16px; line-height:1.72; }
  .cdm-diving-cta .cdm-btn { width:100%; max-width:320px; }
}

@media (prefers-reduced-motion:reduce) {
  .cdm-diving-scroll span { animation:none; }
  .cdm-diving-card,.cdm-diving-gallery-grid img { transition:none; }
}


/* Le tre card Diving usano esattamente lo stesso elemento e la stessa geometria. */
.cdm-diving-cards > .cdm-diving-card {
  display: block;
  width: 100%;
  height: 100%;
  color: inherit !important;
  text-decoration: none !important;
  border: 0;
}
.cdm-diving-cards > .cdm-diving-card:link,
.cdm-diving-cards > .cdm-diving-card:visited,
.cdm-diving-cards > .cdm-diving-card:hover,
.cdm-diving-cards > .cdm-diving-card:focus,
.cdm-diving-cards > .cdm-diving-card:active {
  color: inherit !important;
  text-decoration: none !important;
}
.cdm-diving-cards > .cdm-diving-card h3,
.cdm-diving-cards > .cdm-diving-card p,
.cdm-diving-cards > .cdm-diving-card span {
  text-decoration: none !important;
}
.cdm-diving-card-clickable { cursor: pointer; }
.cdm-diving-card-clickable:focus-visible {
  outline: 3px solid rgba(17,188,217,.55);
  outline-offset: 5px;
}
@media (max-width:782px) {
  .cdm-diving-cards > .cdm-diving-card {
    display:grid;
    grid-template-columns:.9fr 1.1fr;
  }
}
@media (max-width:520px) {
  .cdm-diving-cards > .cdm-diving-card {
    display:block;
  }
}

/* Immagini dedicate alle tre card della pagina Immersioni */
.cdm-diving-card-1 .cdm-diving-card-image {
  background-image: linear-gradient(180deg, transparent 58%, rgba(3,40,53,.25)), url('../images/card-reef-coralli.jpg');
  background-position: center center;
}
.cdm-diving-card-2 .cdm-diving-card-image {
  background-image: linear-gradient(180deg, transparent 58%, rgba(3,40,53,.25)), url('../images/card-vita-marina.jpg');
  background-position: center center;
}
.cdm-diving-card-3 .cdm-diving-card-image {
  background-image: linear-gradient(180deg, transparent 58%, rgba(3,40,53,.25)), url('../images/IMG_2810.jpg');
  background-position: center center;
}


/* Hero Diving: video su desktop/tablet, immagine statica su smartphone */
@media (max-width: 600px) {
  .cdm-diving-hero-video { display:none; }
  .cdm-diving-hero-mobile { display:block; }
}

/* Hero Diving: stesso video su desktop, tablet e smartphone.
   Il rapporto del video resta invariato; il ritaglio responsive avviene con object-fit: cover. */
@media (max-width: 782px) {
  .cdm-diving-hero-video {
    display:block;
    object-fit:cover;
    object-position:center 48%;
    transform:scale(1.02);
  }
  .cdm-diving-hero-mobile { display:none; }
}

@media (max-width: 520px) {
  .cdm-diving-hero-video {
    display:block;
    object-fit:cover;
    object-position:center center;
    transform:scale(1.02);
  }
  .cdm-diving-hero-mobile { display:none; }
}
