/* Gallery port: photography heading/marquee and style-two two-way rails. */
.oceidon-gallery-page {
  --oceidon-gallery-primary: #10a6ad;
  --oceidon-gallery-ink: #122327;
  --oceidon-gallery-deep: #082d35;
  --oceidon-gallery-soft: #f5f0e3;
  --oceidon-gallery-pale: #edf5f6;
  --oceidon-gallery-muted: #46636a;
  --oceidon-gallery-title: "Platypi", Georgia, serif;
  --oceidon-gallery-display: "Bebas Neue", Arial, sans-serif;
  --oceidon-gallery-body: "Inter", Arial, sans-serif;
  overflow: clip;
  background: var(--oceidon-gallery-soft);
  color: var(--oceidon-gallery-ink);
  font-family: var(--oceidon-gallery-body);
}
.oceidon-gallery-page *,
.oceidon-gallery-page *::before,
.oceidon-gallery-page *::after { box-sizing: border-box; }
.oceidon-gallery-page figure,
.oceidon-gallery-page h1,
.oceidon-gallery-page h2,
.oceidon-gallery-page h3,
.oceidon-gallery-page p,
.oceidon-gallery-page ul,
.oceidon-gallery-page ol { margin: 0; }
.oceidon-gallery-page img { display: block; max-width: 100%; }
.oceidon-gallery-page a { color: inherit; text-decoration: none; }
.oceidon-gallery-page button { font: inherit; }
.oceidon-gallery-container { width: 100%; max-width: 1470px; margin: 0 auto; padding-inline: 30px; }

.oceidon-gallery-hero-shell { position: relative; z-index: 1; }
.oceidon-gallery-hero-shell .oceidon-ship-detail-hero-content > span,
.oceidon-gallery-photography-heading > div > span,
.oceidon-gallery-feature-heading > div > span,
.oceidon-gallery-index-grid > div > span { display: inline-block; margin-bottom: 16px; color: #79e0dc; font-size: 13px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }

/* Ported photography layout. */
.oceidon-gallery-photography { position: relative; z-index: 1; padding: 104px 0 94px; background: var(--oceidon-gallery-soft); }
.oceidon-gallery-photography-heading { display: grid; grid-template-columns: minmax(0, 1fr) minmax(210px, .34fr); gap: 40px; align-items: end; margin-bottom: 50px; }
.oceidon-gallery-photography-heading h2,
.oceidon-gallery-feature-heading h2,
.oceidon-gallery-index-grid h2 { color: var(--oceidon-gallery-ink); font-family: var(--oceidon-gallery-title); font-size: clamp(2.9rem, 5.5vw, 5.6rem); font-weight: 600; line-height: 1.02; letter-spacing: -.04em; text-wrap: balance; }
.oceidon-gallery-photography-heading p { max-width: 720px; margin-top: 20px; color: var(--oceidon-gallery-muted); font-size: 17px; line-height: 1.75; }
.oceidon-gallery-counter { display: flex; align-items: center; justify-content: flex-end; gap: 15px; }
.oceidon-gallery-counter strong { color: var(--oceidon-gallery-primary); font-family: var(--oceidon-gallery-title); font-size: clamp(4.5rem, 8vw, 7rem); font-weight: 500; line-height: .9; }
.oceidon-gallery-counter span { color: var(--oceidon-gallery-muted); font-family: var(--oceidon-gallery-title); font-size: 20px; line-height: 1.2; white-space: pre-line; }
.oceidon-gallery-marquee { width: 100%; overflow: hidden; }
.oceidon-gallery-track { display: flex; width: max-content; gap: 20px; animation: oceidon-gallery-marquee 22s linear infinite; }
.oceidon-gallery-thumb { display: block; width: clamp(220px, 20vw, 390px); flex: 0 0 clamp(220px, 20vw, 390px); overflow: hidden; border-radius: 8px; line-height: 0; }
.oceidon-gallery-thumb img { width: 100%; aspect-ratio: 1.6 / 1; object-fit: cover; transition: transform .5s ease; }
.oceidon-gallery-thumb:hover img { transform: scale(1.05); }
@keyframes oceidon-gallery-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.oceidon-gallery-marquee-controls { width: 100%; max-width: 1470px; margin: 24px auto 0; padding-inline: 30px; text-align: right; }
.oceidon-gallery-marquee-controls button { min-height: 42px; padding: 8px 17px; border: 1px solid rgba(18,35,39,.24); border-radius: 50px; background: transparent; color: var(--oceidon-gallery-ink); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
.oceidon-gallery-marquee-controls button:hover,
.oceidon-gallery-marquee-controls button:focus-visible { border-color: var(--oceidon-gallery-primary); background: var(--oceidon-gallery-primary); color: #fff; }
.oceidon-gallery-marquee.is-paused .oceidon-gallery-track { animation-play-state: paused; }

.oceidon-gallery-feature { padding: 112px 0 104px; background: #fff; }
.oceidon-gallery-feature-heading { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(300px, .8fr); gap: 50px; align-items: end; margin-bottom: 52px; }
.oceidon-gallery-feature-heading > p { color: var(--oceidon-gallery-muted); font-size: 17px; line-height: 1.75; }
.oceidon-gallery-rails { display: grid; gap: 30px; overflow: hidden; }
.oceidon-gallery-card { position: relative; display: flex; width: 100%; min-width: 0; overflow: hidden; user-select: none; gap: 25px; margin-bottom: 0; }
.oceidon-gallery-card--reverse .oceidon-gallery-thumb-track { animation-name: oceidon-gallery-scroll-right; animation-duration: 40s; }
.oceidon-gallery-thumb-track { min-width: 100%; flex-shrink: 0; display: flex; align-items: stretch; justify-content: space-around; gap: 25px; animation: oceidon-gallery-scroll 30s linear infinite; }
.oceidon-gallery-thumb-track .oceidon-gallery-thumb { width: calc((100vw - 100px) / 3); flex-basis: calc((100vw - 100px) / 3); border-radius: 20px; }
.oceidon-gallery-thumb-track .oceidon-gallery-thumb img { aspect-ratio: 1.55 / 1; border-radius: 20px; }
@keyframes oceidon-gallery-scroll { from { transform: translateX(0); } to { transform: translateX(calc(-100% - 25px)); } }
@keyframes oceidon-gallery-scroll-right { from { transform: translateX(calc(-100% - 25px)); } to { transform: translateX(0); } }

.oceidon-gallery-index { padding: 112px 0; background: var(--oceidon-gallery-pale); }
.oceidon-gallery-index-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(310px, .95fr); gap: 70px; align-items: end; }
.oceidon-gallery-index-grid > div > span { color: #0b797d; }
.oceidon-gallery-index-grid h2 { font-size: clamp(2.7rem, 4.6vw, 5rem); }
.oceidon-gallery-index-grid > div:last-child p { color: var(--oceidon-gallery-muted); font-size: 17px; line-height: 1.8; }
.oceidon-gallery-index-link { display: inline-flex; align-items: center; gap: 12px; margin-top: 28px; color: #087f82; font-size: 13px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.oceidon-gallery-index-link:hover { color: var(--oceidon-gallery-ink); }
.oceidon-gallery-faq .oceidon-faq-section { background: #fff; }
.oceidon-gallery-faq .oceidon-faq-centered .oceidon-package-section-main-title { display: block; text-align: center; }
.oceidon-gallery-faq .oceidon-faq-centered .oceidon-package-section-main-title > div { max-width: 760px; margin-inline: auto; }
.oceidon-gallery-faq .oceidon-faq-centered .oceidon-faq-lede { display: none; }
.oceidon-gallery-faq .oceidon-faq-centered .oceidon-faq-list { max-width: 960px; margin-inline: auto; }

/* Native lightbox keeps the original popup-image interaction accessible. */
.oceidon-gallery-lightbox { width: min(94vw, 1120px); max-width: none; padding: 0; border: 0; border-radius: 20px; background: transparent; color: #fff; }
.oceidon-gallery-lightbox::backdrop { background: rgba(3,25,31,.86); backdrop-filter: blur(8px); }
.oceidon-gallery-lightbox-inner { position: relative; padding: 16px; border: 1px solid rgba(255,255,255,.28); border-radius: 20px; background: rgba(8,45,53,.94); box-shadow: 0 30px 90px rgba(0,0,0,.34); }
.oceidon-gallery-lightbox-inner figure { display: grid; gap: 13px; }
.oceidon-gallery-lightbox-inner img { width: 100%; max-height: 78vh; object-fit: contain; border-radius: 12px; background: #061f26; }
.oceidon-gallery-lightbox-inner figcaption { padding: 4px 40px 3px 4px; color: rgba(255,255,255,.82); font-size: 14px; line-height: 1.55; }
.oceidon-gallery-lightbox-close { position: absolute; z-index: 2; top: 25px; right: 25px; width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.62); border-radius: 50%; background: rgba(8,45,53,.86); color: #fff; font-size: 25px; line-height: 1; cursor: pointer; }
.oceidon-gallery-lightbox-close:hover,
.oceidon-gallery-lightbox-close:focus-visible { border-color: var(--oceidon-gallery-primary); background: var(--oceidon-gallery-primary); }

@media (max-width: 1000px) {
  .oceidon-gallery-container { padding-inline: 22px; }
  .oceidon-gallery-photography-heading,
  .oceidon-gallery-feature-heading,
  .oceidon-gallery-index-grid { grid-template-columns: 1fr; gap: 24px; }
  .oceidon-gallery-counter { justify-content: flex-start; }
  .oceidon-gallery-thumb-track .oceidon-gallery-thumb { width: calc((100vw - 80px) / 2); flex-basis: calc((100vw - 80px) / 2); }
}

@media (max-width: 620px) {
  .oceidon-gallery-container { padding-inline: 16px; }
  .oceidon-gallery-hero-shell .oceidon-ship-detail-hero-content h1 { max-width: 100%; font-size: clamp(1.7rem, 8.6vw, 4.1rem); overflow-wrap: anywhere; }
  .oceidon-gallery-photography,
  .oceidon-gallery-feature,
  .oceidon-gallery-index { padding-block: 78px; }
  .oceidon-gallery-photography-heading h2,
  .oceidon-gallery-feature-heading h2,
  .oceidon-gallery-index-grid h2 { font-size: clamp(2.5rem, 12vw, 3.6rem); }
  .oceidon-gallery-photography-heading p,
  .oceidon-gallery-index-grid > div:last-child p { font-size: 15px; }
  .oceidon-gallery-marquee-controls { padding-inline: 16px; }
  .oceidon-gallery-thumb-track .oceidon-gallery-thumb { width: calc(100vw - 46px); flex-basis: calc(100vw - 46px); }
  .oceidon-gallery-thumb-track { gap: 14px; }
  .oceidon-gallery-card { gap: 14px; }
  .oceidon-gallery-thumb-track .oceidon-gallery-thumb { border-radius: 16px; }
  .oceidon-gallery-thumb-track .oceidon-gallery-thumb:nth-child(3) { display: none; }
  .oceidon-gallery-lightbox { width: calc(100vw - 20px); }
  .oceidon-gallery-lightbox-inner { padding: 10px; }
  .oceidon-gallery-lightbox-close { top: 17px; right: 17px; }
}

@media (prefers-reduced-motion: reduce) {
  .oceidon-gallery-track,
  .oceidon-gallery-thumb-track { animation: none; }
  .oceidon-gallery-thumb img { transition: none; }
}
