/* ============================================================
   LuxNautic — trip & boat page styles
   ============================================================ */

/* Reset / base ----------------------------------------------- */
.ln-page * { box-sizing: border-box; }
.ln-page { color: var(--ln-text); font-family: var(--ln-font-sans); font-size: var(--ln-fs-body); font-weight: var(--ln-fw-light); line-height: var(--ln-lh-body); }
.ln-page img { max-width: 100%; height: auto; display: block; }
.ln-page a:not(.ln-btn) { color: inherit; text-decoration: none; transition: color var(--ln-trans-fast); }
.ln-page a:not(.ln-btn):hover { color: var(--ln-accent); }
.ln-page h1, .ln-page h2, .ln-page h3, .ln-page h4 { font-family: var(--ln-font-sans); font-weight: var(--ln-fw-light); margin: 0; line-height: var(--ln-lh-tight); }
.ln-page h2 { font-size: var(--ln-fs-h2); text-transform: capitalize; line-height: var(--ln-lh-normal); }
.ln-page h3 { font-size: var(--ln-fs-h3); line-height: var(--ln-lh-normal); }
.ln-page p { margin: 0 0 var(--ln-space-4); }

.ln-container { max-width: var(--ln-container); margin: 0 auto; padding-left: var(--ln-container-pad); padding-right: var(--ln-container-pad); }

.ln-eyebrow { font-size: var(--ln-fs-eyebrow); font-weight: var(--ln-fw-regular); color: var(--ln-accent); text-transform: uppercase; letter-spacing: var(--ln-tracking-eyebrow); line-height: var(--ln-lh-body); margin: 0 0 var(--ln-space-2); display: block; }

.ln-divider { height: 1px; background: var(--ln-divider); margin: var(--ln-space-4) 0; border: 0; }
.ln-divider--accent { background: var(--ln-accent-soft); }

/* Buttons — scoped under .ln-page so Elementor's `.elementor-kit-N a` doesn't override. */
.ln-page .ln-btn,
a.ln-btn,
button.ln-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: var(--ln-btn-padding); font-family: var(--ln-font-sans); font-size: var(--ln-fs-button); font-weight: var(--ln-fw-semibold); letter-spacing: var(--ln-tracking-button); text-transform: uppercase; line-height: 1; background: var(--ln-btn-bg); color: var(--ln-btn-color); border: var(--ln-btn-border); cursor: pointer; transition: background-color var(--ln-trans-base), color var(--ln-trans-base), border-color var(--ln-trans-base); text-decoration: none; }
.ln-page .ln-btn:hover, .ln-page .ln-btn:focus, .ln-page .ln-btn:focus-visible,
a.ln-btn:hover, a.ln-btn:focus, a.ln-btn:focus-visible,
button.ln-btn:hover, button.ln-btn:focus { background: var(--ln-btn-bg-hover); color: var(--ln-white); border: var(--ln-btn-border-hover); }

.ln-page .ln-btn.ln-btn--ghost,
a.ln-btn.ln-btn--ghost { background: transparent; color: var(--ln-secondary); border-color: var(--ln-secondary); }
.ln-page .ln-btn.ln-btn--ghost:hover, .ln-page .ln-btn.ln-btn--ghost:focus,
a.ln-btn.ln-btn--ghost:hover, a.ln-btn.ln-btn--ghost:focus { background: var(--ln-secondary); color: var(--ln-white); border-color: var(--ln-secondary); }

.ln-page .ln-btn.ln-btn--accent,
a.ln-btn.ln-btn--accent { background: var(--ln-accent); color: var(--ln-secondary); border-color: var(--ln-accent); }
.ln-page .ln-btn.ln-btn--accent:hover, .ln-page .ln-btn.ln-btn--accent:focus,
a.ln-btn.ln-btn--accent:hover, a.ln-btn.ln-btn--accent:focus { background: var(--ln-btn-bg-hover); color: var(--ln-white); border-color: var(--ln-btn-bg-hover); }

.ln-btn--block { width: 100%; }
.ln-btn--lg { padding: 18px 36px; font-size: 16px; }

/* Hero ------------------------------------------------------- */
.ln-hero { position: relative; min-height: 50vh; display: flex; align-items: flex-end; padding: 120px 0 60px; color: var(--ln-white); overflow: hidden; }
.ln-hero__media { position: absolute; inset: 0; z-index: 0; }
.ln-hero__media > img, .ln-hero__media > video { width: 100%; height: 100%; object-fit: cover; }

/* Carousel (multi-image hero) — crossfade slideshow */
.ln-hero__slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1.6s ease-in-out; }
.ln-hero__slide.is-active { opacity: 1; }
.ln-hero__slide img { width: 100%; height: 100%; object-fit: cover; }
.ln-hero--carousel .ln-hero__media { display: block; }
@media (prefers-reduced-motion: reduce) {
	.ln-hero__slide { transition: none; }
}
.ln-hero__overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(15,33,43,0.35) 0%, rgba(15,33,43,0.7) 100%); z-index: 1; }
.ln-hero__inner { position: relative; z-index: 2; width: 100%; }
.ln-hero h1 { font-size: var(--ln-fs-h1); color: var(--ln-white); text-transform: capitalize; line-height: 1.1; max-width: 920px; margin-bottom: var(--ln-space-3); }
.ln-hero__breadcrumb { display: flex; gap: var(--ln-space-3); color: rgba(255,255,255,0.75); font-size: var(--ln-fs-eyebrow); text-transform: uppercase; letter-spacing: 1px; }
.ln-hero__breadcrumb a:hover { color: var(--ln-accent); }
.ln-hero__breadcrumb span { color: var(--ln-accent); }

@media (max-width: 768px) {
	.ln-hero { min-height: 45vh; padding: 100px 0 40px; }
}

/* Trip page layout ------------------------------------------- */
.ln-trip { padding: 80px 0; }
.ln-trip__grid { display: grid; grid-template-columns: 1fr 380px; gap: 60px; align-items: start; }
.ln-trip__main { min-width: 0; }
.ln-trip__aside { position: sticky; top: 100px; }

@media (max-width: 1024px) {
	.ln-trip__grid { grid-template-columns: 1fr; gap: 40px; }
	.ln-trip__aside { position: static; }
}
@media (max-width: 768px) {
	.ln-trip { padding: 50px 0; }
}

/* Trip facts row (the icon list near top) -------------------- */
.ln-facts { display: flex; flex-wrap: wrap; gap: var(--ln-space-6); margin: var(--ln-space-4) 0 var(--ln-space-6); padding: var(--ln-space-4) 0; border-top: 1px solid var(--ln-divider); border-bottom: 1px solid var(--ln-divider); }
.ln-fact { display: flex; align-items: center; gap: var(--ln-space-2); font-size: var(--ln-fs-small); color: var(--ln-text); }
.ln-fact svg { width: 16px; height: 16px; color: var(--ln-secondary); flex: 0 0 auto; }

/* Itinerary option blocks ------------------------------------ */
.ln-itinerary__option { margin-bottom: var(--ln-space-12); }
.ln-itinerary__option h3 { color: var(--ln-secondary); margin-bottom: var(--ln-space-3); }
.ln-itinerary__list { list-style: none; padding: 0; margin: var(--ln-space-3) 0; }
.ln-itinerary__list li { position: relative; padding-left: 24px; margin-bottom: var(--ln-space-2); font-size: var(--ln-fs-small); color: var(--ln-text); }
.ln-itinerary__list li::before { content: ""; position: absolute; left: 0; top: 8px; width: 12px; height: 12px; border: 1.5px solid var(--ln-accent); border-radius: 50%; }
.ln-itinerary__video { aspect-ratio: 16 / 9; margin: var(--ln-space-4) 0; background: var(--ln-secondary); }
.ln-itinerary__video video { width: 100%; height: 100%; object-fit: cover; }

/* Boat selector tabs ----------------------------------------- */
.ln-boat-selector { background: var(--ln-booking-bg); border: var(--ln-booking-border); padding: var(--ln-space-3); }
.ln-boat-selector__label { display: block; color: var(--ln-accent); font-size: var(--ln-fs-eyebrow); text-transform: uppercase; letter-spacing: var(--ln-tracking-eyebrow); margin-bottom: var(--ln-space-3); padding: 0 var(--ln-space-2); }
.ln-boat-selector__tabs { display: flex; gap: var(--ln-space-1); }
.ln-boat-selector__tab { flex: 1; min-width: 0; background: transparent; color: var(--ln-white); border: 1px solid rgba(126,193,243,0.17); padding: var(--ln-space-3); cursor: pointer; transition: all var(--ln-trans-fast); font-family: var(--ln-font-sans); text-align: center; }
.ln-boat-selector__tab strong { display: block; font-size: 13px; font-weight: var(--ln-fw-regular); text-transform: uppercase; letter-spacing: 0.5px; line-height: 1.2; }
.ln-boat-selector__tab small { display: block; font-size: 11px; color: var(--ln-accent); margin-top: 4px; opacity: 0.85; }
.ln-boat-selector__tab[aria-selected="true"] { background: var(--ln-accent); color: var(--ln-secondary); border-color: var(--ln-accent); }
.ln-boat-selector__tab[aria-selected="true"] small { color: var(--ln-secondary); opacity: 1; font-weight: var(--ln-fw-semibold); }
.ln-boat-selector__tab:hover:not([aria-selected="true"]) { border-color: var(--ln-accent); }

/* Booking column --------------------------------------------- */
.ln-booking { background: var(--ln-booking-bg); color: var(--ln-booking-color); border: var(--ln-booking-border); padding: var(--ln-space-5); }
.ln-booking h3 { color: var(--ln-white); font-size: var(--ln-fs-h3); margin-bottom: var(--ln-space-3); }
.ln-booking__price { color: var(--ln-accent); font-size: 20px; font-weight: var(--ln-fw-light); margin-bottom: var(--ln-space-1); }
.ln-booking__compare { color: rgba(255,255,255,0.7); font-size: 12px; margin-bottom: var(--ln-space-4); text-transform: uppercase; letter-spacing: 0.5px; }
.ln-booking__pane { display: none; }
.ln-booking__pane[data-active="true"] { display: block; }
.ln-booking__contact { margin-top: var(--ln-space-4); padding-top: var(--ln-space-4); border-top: 1px solid var(--ln-accent-soft); display: grid; gap: var(--ln-space-2); font-size: var(--ln-fs-small); }
.ln-booking__contact a { color: var(--ln-white); }
.ln-booking__contact a:hover { color: var(--ln-accent); }

/* WPBS calendar — let plugin styles dominate, only nudge ---- */
.ln-booking .wpbs-container, .ln-booking [class^="wpbs"] { font-family: var(--ln-font-sans); }

/* Boat brochure page ----------------------------------------- */
.ln-boat-spec { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: var(--ln-space-5); margin: var(--ln-space-8) 0; padding: var(--ln-space-6) 0; border-top: 1px solid var(--ln-divider); border-bottom: 1px solid var(--ln-divider); }
.ln-boat-spec__item { text-align: center; }
.ln-boat-spec__label { font-size: var(--ln-fs-eyebrow); color: var(--ln-accent); text-transform: uppercase; letter-spacing: var(--ln-tracking-eyebrow); display: block; margin-bottom: var(--ln-space-2); }
.ln-boat-spec__value { font-size: 22px; color: var(--ln-secondary); font-weight: var(--ln-fw-light); }

.ln-boat-section { padding: var(--ln-space-16) 0; }
.ln-boat-section--alt { background: var(--ln-off-white); }
.ln-boat-section h2 { color: var(--ln-secondary); margin-bottom: var(--ln-space-5); max-width: 700px; }

/* Feature highlight (sun deck etc.) -------------------------- */
.ln-feature { display: grid; grid-template-columns: 1fr 1fr; gap: var(--ln-space-12); align-items: center; }
.ln-feature--reverse { direction: rtl; }
.ln-feature--reverse > * { direction: ltr; }
.ln-feature__media img { width: 100%; height: auto; }
@media (max-width: 768px) { .ln-feature, .ln-feature--reverse { grid-template-columns: 1fr; gap: var(--ln-space-6); direction: ltr; } }

/* Trip cards (used on boat brochure pages) -------------------- */
.ln-trip-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--ln-space-6); }
.ln-trip-card { background: var(--ln-white); box-shadow: var(--ln-shadow-card); display: flex; flex-direction: column; transition: transform var(--ln-trans-base); }
.ln-trip-card:hover { transform: translateY(-4px); }
.ln-trip-card__media { aspect-ratio: 4 / 3; overflow: hidden; }
.ln-trip-card__media img { width: 100%; height: 100%; object-fit: cover; }
.ln-trip-card__body { padding: var(--ln-space-5); display: flex; flex-direction: column; gap: var(--ln-space-2); flex: 1; }
.ln-trip-card__body h3 { font-size: 18px; color: var(--ln-secondary); }
.ln-trip-card__body p { color: var(--ln-text); font-size: var(--ln-fs-small); flex: 1; }

/* Gallery ---------------------------------------------------- */
.ln-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--ln-space-2); }
.ln-gallery img { aspect-ratio: 4 / 3; object-fit: cover; }