/* AquaTour approved soft transitions. Last updated: 2026-10-16. Version: 2.0.
   Scrollports retain geometry and native interaction. Their alpha carries the
   broad exterior depth; clipped children paint only inset edge light. */
@supports (filter: drop-shadow(0 1px 1px #000)) {
  @media (max-width: 768px) {
    .home-page #areas.home-areas .ha-cards,
    .home-page #reviews.reviews-section .reviews-grid,
    .home-page .faq-list,
    .home-page #boats.fleet-section .fleet-grid {
      filter: drop-shadow(0 10px 9px rgba(0, 24, 32, .26))
        drop-shadow(0 12px 14px rgba(0, 24, 32, .12));
    }
    .home-page #areas.home-areas .ha-face,
    .home-page #reviews.reviews-section .review-card,
    .home-page .faq-list > .faq-group,
    .home-page #boats.fleet-section .fleet-grid > .fleet-card {
      box-shadow: var(--aqua-depth-keylight);
    }
    /* No exterior contact shadow may leave a hard edge in the clipped source. */
    .home-page #areas.home-areas .ha-card:is(:hover, :active, :focus-visible) .ha-face,
    .home-page #reviews.reviews-section .review-card:is(:hover, :active, :focus-visible),
    .home-page .faq-list > .faq-group:is(:hover, :active, :focus-visible) {
      box-shadow: var(--aqua-depth-keylight);
    }
    /* The existing fleet hover/press rules already use !important. */
    .home-page #boats.fleet-section .fleet-grid > .fleet-card:is(:hover, :active, :focus-visible) {
      box-shadow: var(--aqua-depth-keylight) !important;
    }
    /* The floating Sea index was omitted from the previous correction. Keep
       its borders, glass, dimensions and native scroll; move exterior depth
       from the clipped links to the transparent rail silhouette. */
    .sea-main #sea-area-index .sea-area-index__rail {
      filter: drop-shadow(0 10px 11px rgba(21, 50, 60, .26));
    }
    .sea-main #sea-area-index .sea-area-index__rail a,
    .sea-main #sea-area-index .sea-area-index__rail a:is(:hover, :active, :focus-visible) {
      box-shadow: none;
    }
  }
  @media (max-width: 900px) {
    .atomix-hero .c4a-thumbs {
      filter: drop-shadow(0 10px 9px rgba(0, 24, 32, .26))
        drop-shadow(0 12px 14px rgba(0, 24, 32, .12));
    }
    .atomix-hero .c4a-thumbs > .c4a-thumb,
    .atomix-hero .c4a-thumbs > .c4a-thumb:is(:hover, :active, :focus-visible) {
      box-shadow: var(--aqua-depth-keylight);
    }
  }
  /* The same clipped-shadow mechanism in the Sea Areas mobile/tablet rail. */
  @media (max-width: 1100px) {
    .sea-main .c3d-area0-gallery {
      filter: drop-shadow(0 10px 9px rgba(0, 24, 32, .26))
        drop-shadow(0 12px 14px rgba(0, 24, 32, .12));
    }
    .sea-main .c3d-area0-gallery .gtile[data-gallery-photo],
    .sea-main .c3d-area0-gallery .gtile[data-gallery-photo]:is(:hover, :active, :focus-visible) {
      box-shadow: inset 0 0 0 1px var(--aqua-depth-edge), var(--aqua-depth-keylight);
    }
  }
  /* Included keeps two independently scrolling photo rows at every width. */
  #how .included-life-row {
    filter: drop-shadow(0 10px 9px rgba(0, 24, 32, .26))
      drop-shadow(0 12px 14px rgba(0, 24, 32, .12));
  }
  #how .included-life-grid.included-life-rail .included-life-photo,
  #how .included-life-grid.included-life-rail .included-life-photo:is(:hover, :active, :focus-visible) {
    box-shadow: var(--aqua-depth-keylight);
  }
}
/* A single composited seam above photo AND video. Existing image/video filters,
   sources, crop and playback are unchanged. Only the last 80/112px are tinted. */
.home-page [data-hero="home"]::after {
  content: '';
  position: absolute;
  z-index: 1;
  left: 0;
  right: 0;
  bottom: 0;
  height: 112px;
  pointer-events: none;
  background: linear-gradient(to bottom,
    rgba(0, 101, 130, 0) 0%, rgba(0, 101, 130, .12) 20%,
    rgba(0, 101, 130, .42) 45%, rgba(0, 101, 130, .78) 72%, #006582 100%);
}
.home-page [data-hero="home"] > .c7n-hero-inner { z-index: 2; }
/* The waves emerge from the same blue over 28px, without a duplicate grid. */
.home-page #areas.home-areas::after {
  content: '';
  position: absolute;
  z-index: 0;
  left: 0;
  right: 0;
  top: 0;
  height: 28px;
  pointer-events: none;
  background: linear-gradient(to bottom, #006582, rgba(0, 101, 130, 0));
}
@media (max-width: 768px) {
  .home-page [data-hero="home"]::after { height: 80px; }
}

/* Russian inclusion labels wrap inside the existing two-column boat cards. */
@media (max-width: 540px) {
  html[lang="ru"] .atomix-included-band .ease-item h3 {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
    -webkit-hyphens: auto;
    hyphens: auto;
  }
}
