/* ═══════════════════════════════════════
   AQUA-FLY — Global Stylesheet v3
   ═══════════════════════════════════════ */

/* Fonts (Bebas Neue + Barlow) are self-hosted — see fonts.css, linked before this file in _Layout.cshtml. */

:root {
  /* Primary accent — accessible yellow (dark text on yellow fills, never white) */
  --accent:       #ffd60a;
  --accent-hover: #ffe14d;
  --accent-deep:  #7a6000; /* accent-coloured text on light backgrounds (≥4.5:1) */
  --aqua:        var(--accent);
  --aqua-light:  var(--accent);
  --aqua-mid:    rgba(255,214,10,0.35);
  --aqua-dim:    rgba(255,214,10,0.1);
  --aqua-glow:   rgba(255,214,10,0.45);
  --dark:        #071e2b;
  --dark-2:      #0d2d40;
  --dark-3:      #0a2436;
  --light-bg:    #f4fafc;
  --light-bg-2:  #e8f5fa;
  --white:       #ffffff;
  --text-dark:   #0b1f2d;
  --text-mid:    #2a5068;
  --text-muted:  #4a7a94;
  --muted:       rgba(240,250,255,0.72);
  --nav-h:       76px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  background: var(--dark);
  color: var(--white);
  font-family: 'Barlow', sans-serif;
  font-weight: 300;
  overflow-x: hidden;
}

/* ── SCROLLBAR ── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--dark); }
::-webkit-scrollbar-thumb { background: var(--aqua-mid); border-radius: 3px; }

/* ── SELECTION ── */
::selection { background: var(--aqua); color: var(--dark); }

/* ══════════════════════════════
   NAVBAR
══════════════════════════════ */
.af-nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  height: var(--nav-h);
  display: flex;
  align-items: center;
  padding: 0 2rem;
  transition: background 0.4s, backdrop-filter 0.4s, border-color 0.4s;
}

.af-nav.scrolled {
  background: rgba(7,30,43,0.96);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(255,214,10,0.15);
}

/* Brand */
.af-brand {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 2rem;
  letter-spacing: 0.08em;
  color: var(--white) !important;
  text-decoration: none;
  line-height: 1;
}
.af-brand .brand-aqua { color: var(--white); }
.af-brand .brand-fly  { color: var(--aqua-light); }

/* Nav links — always white on dark bg (nav is always dark) */
.af-nav .nav-link {
  font-family: 'Barlow', sans-serif;
  font-weight: 600;
  font-size: 0.72rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.8) !important;
  padding: 0.4rem 1rem !important;
  transition: color 0.2s;
  position: relative;
}
.af-nav .nav-link::after {
  content: '';
  position: absolute;
  bottom: -2px; left: 1rem; right: 1rem;
  height: 1px;
  background: var(--aqua-light);
  transform: scaleX(0);
  transition: transform 0.25s;
}
.af-nav .nav-link:hover,
.af-nav .nav-link.active { color: var(--aqua-light) !important; }
.af-nav .nav-link:hover::after,
.af-nav .nav-link.active::after { transform: scaleX(1); }

/* Book Now button */
.af-nav .btn-book {
  font-family: 'Barlow', sans-serif;
  font-weight: 700;
  font-size: 0.7rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: #071e2b !important;
  background: var(--aqua-light);
  border: none;
  padding: 0.55rem 1.4rem;
  clip-path: polygon(6px 0%, 100% 0%, calc(100% - 6px) 100%, 0% 100%);
  transition: box-shadow 0.25s, background 0.25s;
  text-decoration: none !important;
  -webkit-text-fill-color: #071e2b;
}
.af-nav .btn-book:hover,
.af-nav .btn-book:focus,
.af-nav .btn-book:active,
.af-nav .btn-book:visited {
  background: var(--accent-hover);
  box-shadow: 0 0 24px var(--aqua-glow);
  color: #071e2b !important;
  -webkit-text-fill-color: #071e2b;
}

/* Mobile hamburger */
.navbar-toggler {
  border-color: rgba(255,214,10,0.4) !important;
}
.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,214,10,0.9)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}
/* Mobile collapse always gets dark background */
.navbar-collapse {
  background: rgba(7,30,43,0.98);
  padding: 1rem 1.5rem;
  border: 1px solid rgba(255,214,10,0.15);
  margin-top: 0.5rem;
}
@media (min-width: 992px) {
  .navbar-collapse {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin-top: 0 !important;
  }
}

/* ══════════════════════════════
   HERO (full-screen)
══════════════════════════════ */
.af-hero {
  position: relative;
  min-height: 100vh;
  display: flex; align-items: center; justify-content: center;
  text-align: center;
  overflow: hidden;          /* clip the over-sized bg */
}

/* bg is LARGER than hero so parallax shift stays filled */
.af-hero-bg {
  position: absolute;
  top: -20%; left: 0; right: 0; bottom: -20%;
  background-size: cover;
  background-position: center;
  filter: brightness(0.55) saturate(1.2);
  z-index: 0;
  will-change: transform;
}

.af-hero-overlay {
  position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(to bottom,
      rgba(7,30,43,0.35) 0%,
      transparent 30%,
      transparent 60%,
      rgba(7,30,43,0.7) 100%);
}

.af-hero-content { position: relative; z-index: 2; }

.af-hero-eyebrow {
  font-size: 0.7rem;
  letter-spacing: 0.5em;
  text-transform: uppercase;
  color: var(--aqua-light);
  margin-bottom: 1rem;
}

.af-hero-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(4.5rem, 15vw, 12rem);
  line-height: 0.88;
  letter-spacing: 0.04em;
  color: var(--white);
  text-shadow: 0 4px 40px rgba(0,0,0,0.4);
}
.af-hero-title .accent { color: var(--aqua-light); }

.af-hero-sub {
  font-size: clamp(0.85rem, 2vw, 1.1rem);
  font-weight: 300;
  letter-spacing: 0.15em;
  color: rgba(255,255,255,0.82);
  margin-top: 1.5rem;
}

/* ══════════════════════════════
   PAGE INNER HERO
══════════════════════════════ */
.af-page-hero {
  padding-top: calc(var(--nav-h) + 5rem);
  padding-bottom: 5rem;
  position: relative;
  overflow: hidden;
}

.af-page-hero-bg {
  position: absolute;
  top: -20%; left: 0; right: 0; bottom: -20%;
  background-size: cover;
  background-position: center;
  filter: brightness(0.45) saturate(1.2);
  z-index: 0;
  will-change: transform;
}

.af-page-hero-content { position: relative; z-index: 2; }

/* ══════════════════════════════
   PARALLAX SECTIONS (mid-page)
══════════════════════════════ */
.af-parallax {
  position: relative;
  overflow: hidden;
  min-height: 60vh;
  display: flex; align-items: center;
}

.af-parallax-bg {
  position: absolute;
  top: -25%; left: 0; right: 0; bottom: -25%;
  background-size: cover;
  background-position: center;
  filter: brightness(0.5) saturate(1.3);
  z-index: 0;
  will-change: transform;
}

.af-parallax-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(135deg,
    rgba(7,30,43,0.6) 0%,
    rgba(7,30,43,0.25) 100%);
  z-index: 1;
}

.af-parallax-content { position: relative; z-index: 2; width: 100%; }

/* ══════════════════════════════
   SECTION BASICS
══════════════════════════════ */
.af-section { padding: 7rem 0; }

.af-section-label {
  font-size: 0.68rem;
  letter-spacing: 0.5em;
  text-transform: uppercase;
  color: var(--aqua);
  margin-bottom: 0.75rem;
}

.af-section-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(2.8rem, 6vw, 5rem);
  letter-spacing: 0.04em;
  line-height: 1;
  color: var(--white);
}
.af-section-title .accent { color: var(--aqua-light); }

.af-divider {
  width: 60px; height: 2px;
  background: var(--aqua);
  margin: 1.5rem 0;
}

/* ══════════════════════════════
   LIGHT SECTIONS  ← KEY FIX
══════════════════════════════ */
.af-section-alt  { background: var(--light-bg); }
.af-section-alt2 { background: var(--light-bg-2); }

/* All text in light sections goes dark */
.af-section-alt,
.af-section-alt2 {
  color: var(--text-dark);
}
.af-section-alt  .af-section-label,
.af-section-alt2 .af-section-label {
  color: var(--accent-deep);
}
.af-section-alt  .af-section-title,
.af-section-alt2 .af-section-title {
  color: var(--text-dark);
}
.af-section-alt  .af-section-title .accent,
.af-section-alt2 .af-section-title .accent {
  color: var(--accent-deep);
}
/* Body text in light sections */
.af-section-alt  p,
.af-section-alt2 p {
  color: var(--text-mid);
}
/* Stat numbers */
.af-section-alt  .af-stat-num,
.af-section-alt2 .af-stat-num {
  color: var(--accent-deep);
}
.af-section-alt  .af-stat-label,
.af-section-alt2 .af-stat-label {
  color: var(--text-muted);
}
/* Cards in light sections */
.af-section-alt  .af-card,
.af-section-alt2 .af-card {
  background: rgba(255,255,255,0.8);
  border-color: rgba(255,214,10,0.25);
  color: var(--text-dark);
}
.af-section-alt  .af-card > div,
.af-section-alt2 .af-card > div { color: var(--text-dark); }
/* Price cards in light sections */
.af-section-alt  .af-price-card,
.af-section-alt2 .af-price-card {
  background: var(--white);
  border-color: rgba(255,214,10,0.3);
  color: var(--text-dark);
}
.af-section-alt  .af-price-card .af-price-amount,
.af-section-alt2 .af-price-card .af-price-amount { color: var(--text-dark); }
.af-section-alt  .af-price-card .af-price-duration,
.af-section-alt2 .af-price-card .af-price-duration { color: var(--text-muted); }
.af-section-alt  .af-price-list li,
.af-section-alt2 .af-price-list li {
  color: var(--text-mid);
  border-bottom-color: rgba(255,214,10,0.12);
}
.af-section-alt  .af-price-card .af-price-name,
.af-section-alt2 .af-price-card .af-price-name { color: var(--accent-deep); }
.af-section-alt  .af-price-list li::before,
.af-section-alt2 .af-price-list li::before { color: var(--accent-deep); }
/* Slot tags */
.af-section-alt  .af-slot,
.af-section-alt2 .af-slot {
  background: rgba(255,214,10,0.08);
  border-color: rgba(255,214,10,0.3);
  color: var(--text-dark);
}
.af-section-alt  .af-slot:hover,
.af-section-alt2 .af-slot:hover { color: var(--accent-deep); }
/* Timeline */
.af-section-alt  .af-timeline-text,
.af-section-alt2 .af-timeline-text { color: var(--text-mid); }
/* Section label */
.af-section-alt  .fade-up,
.af-section-alt2 .fade-up { color: var(--text-dark); }
/* Any inline muted style */
.af-section-alt  [style*="color:var(--muted)"],
.af-section-alt2 [style*="color:var(--muted)"] { color: var(--text-mid) !important; }

/* FAQ accordion in light section */
.af-section-alt  .af-card button,
.af-section-alt2 .af-card button { color: var(--text-dark) !important; }
.af-section-alt  .af-card [class*="collapse"],
.af-section-alt2 .af-card [class*="collapse"] { color: var(--text-mid); }

/* ══════════════════════════════
   CARDS (dark section default)
══════════════════════════════ */
.af-card {
  background: rgba(255,214,10,0.05);
  border: 1px solid rgba(255,214,10,0.18);
  padding: 2.5rem 2rem;
  position: relative;
  overflow: hidden;
  transition: border-color 0.3s, transform 0.3s;
}
.af-card::before { display: none; }
.af-card:hover { border-color: rgba(255,214,10,0.5); transform: translateY(-4px); }

/* ══════════════════════════════
   PRICING CARDS (dark default)
══════════════════════════════ */
.af-price-card {
  background: var(--dark-2);
  border: 1px solid rgba(255,214,10,0.2);
  padding: 3rem 2rem;
  text-align: center;
  position: relative;
  overflow: hidden;
  transition: transform 0.3s, box-shadow 0.3s, border-color 0.3s;
  clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 16px 100%, 0 calc(100% - 16px));
}
.af-price-card.featured {
  border-color: var(--aqua-light);
  box-shadow: 0 0 40px rgba(255,214,10,0.2);
}
.af-price-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 24px 60px rgba(0,0,0,0.4), 0 0 30px rgba(255,214,10,0.15);
  border-color: var(--aqua-light);
}
.af-price-badge {
  position: absolute;
  top: 1rem; right: -2rem;
  background: var(--aqua-light);
  color: var(--dark);
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  padding: 0.3rem 2.5rem;
  transform: rotate(45deg);
}
.af-price-name {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.6rem;
  letter-spacing: 0.1em;
  color: var(--aqua-light);
  margin-bottom: 0.5rem;
}
.af-price-amount {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 4rem;
  line-height: 1;
  color: var(--white);
}
.af-price-amount sup { font-size: 1.5rem; vertical-align: top; margin-top: 0.6rem; display: inline-block; }
.af-price-duration {
  font-size: 0.75rem;
  letter-spacing: 0.2em;
  color: var(--muted);
  text-transform: uppercase;
  margin-bottom: 2rem;
}
.af-price-list {
  list-style: none;
  padding: 0; margin: 0 0 2.5rem;
  text-align: left;
}
.af-price-list li {
  padding: 0.6rem 0;
  border-bottom: 1px solid rgba(255,214,10,0.1);
  font-size: 0.9rem;
  color: var(--muted);
  display: flex; align-items: center; gap: 0.6rem;
}
.af-price-list li::before {
  content: '✦';
  color: var(--aqua-light);
  font-size: 0.55rem;
  flex-shrink: 0;
}

/* ══════════════════════════════
   BUTTONS
══════════════════════════════ */
.btn-af {
  display: inline-block;
  font-family: 'Barlow', sans-serif;
  font-weight: 700;
  font-size: 0.72rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  text-decoration: none;
  padding: 1rem 2.5rem;
  clip-path: polygon(8px 0%, 100% 0%, calc(100% - 8px) 100%, 0% 100%);
  transition: all 0.25s;
  cursor: pointer;
  border: none;
}
.btn-af-primary { background: var(--aqua-light); color: var(--dark); }
.btn-af-primary:hover {
  background: var(--accent-hover);
  box-shadow: 0 0 30px var(--aqua-glow);
  color: var(--dark);
}
.btn-af-outline {
  background: transparent;
  color: var(--aqua-light);
  clip-path: none;
  border: 1px solid var(--aqua-light);
  padding: 0.95rem 2.5rem;
}
.btn-af-outline:hover {
  background: var(--aqua-dim);
  box-shadow: 0 0 20px var(--aqua-glow);
  color: var(--aqua-light);
}
/* Outline button on light background */
.af-section-alt  .btn-af-outline,
.af-section-alt2 .btn-af-outline {
  color: var(--accent-deep);
  border-color: var(--accent-deep);
}
.af-section-alt  .btn-af-outline:hover,
.af-section-alt2 .btn-af-outline:hover {
  color: var(--accent-deep);
}

/* ══════════════════════════════
   PHOTO STRIP
══════════════════════════════ */
.af-photo-strip {
  display: flex;
  height: 340px;
  overflow: hidden;
}
.af-photo-strip-item {
  flex: 1;
  background-size: cover;
  background-position: center;
  filter: brightness(0.85) saturate(1.2);
  transition: flex 0.5s ease, filter 0.4s;
  cursor: pointer;
}
.af-photo-strip-item:hover {
  flex: 2.5;
  filter: brightness(1) saturate(1.3);
}
@media (max-width: 576px) { .af-photo-strip { height: 200px; } }

/* ══════════════════════════════
   STAT BLOCKS
══════════════════════════════ */
.af-stat {
  text-align: center;
  padding: 2rem 1rem;
}
.af-stat-num {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(3rem, 7vw, 5.5rem);
  color: var(--aqua-light);
  line-height: 1;
}
.af-stat-label {
  font-size: 0.7rem;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: var(--muted);
  margin-top: 0.4rem;
}

/* ══════════════════════════════
   TIMELINE
══════════════════════════════ */
.af-timeline {
  position: relative;
  padding-left: 2rem;
}
.af-timeline::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 1px;
  background: linear-gradient(to bottom, transparent, var(--accent-deep), transparent);
}
.af-timeline-item {
  position: relative;
  padding-bottom: 3rem;
}
.af-timeline-item::before {
  content: '';
  position: absolute;
  left: -2.35rem; top: 0.4rem;
  width: 8px; height: 8px;
  background: var(--accent-deep);
  border-radius: 50%;
  box-shadow: 0 0 12px var(--aqua-glow);
}
.af-timeline-year {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 0.9rem;
  letter-spacing: 0.2em;
  color: var(--accent-deep);
}
.af-timeline-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.4rem;
  letter-spacing: 0.05em;
  color: var(--text-dark);
}
.af-timeline-text {
  font-size: 0.9rem;
  color: var(--text-mid);
  line-height: 1.7;
}

/* ══════════════════════════════
   CONTACT
══════════════════════════════ */
.af-contact-item {
  display: flex;
  align-items: flex-start;
  gap: 1.2rem;
  padding: 1.5rem;
  background: var(--aqua-dim);
  border: 1px solid rgba(255,214,10,0.15);
  margin-bottom: 1rem;
  transition: border-color 0.3s;
}
.af-contact-item:hover { border-color: rgba(255,214,10,0.4); }
.af-contact-icon {
  width: 44px; height: 44px;
  background: var(--aqua-dim);
  border: 1px solid rgba(255,214,10,0.3);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  color: var(--aqua-light);
}
.af-contact-label {
  font-size: 0.65rem;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: var(--aqua-light);
  margin-bottom: 0.2rem;
}
.af-contact-value {
  font-size: 0.95rem;
  color: var(--white);
}

/* Form */
.af-form-group { margin-bottom: 1.5rem; }
.af-form-group label {
  font-size: 0.65rem;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: var(--aqua-light);
  display: block;
  margin-bottom: 0.5rem;
}
.af-form-group input,
.af-form-group textarea,
.af-form-group select {
  width: 100%;
  background: rgba(255,214,10,0.05);
  border: 1px solid rgba(255,214,10,0.25);
  color: var(--white);
  padding: 0.9rem 1.2rem;
  font-family: 'Barlow', sans-serif;
  font-size: 0.95rem;
  outline: none;
  transition: border-color 0.25s, box-shadow 0.25s;
  border-radius: 0;
}
.af-form-group input:focus,
.af-form-group textarea:focus,
.af-form-group select:focus {
  border-color: var(--aqua-light);
  box-shadow: 0 0 18px rgba(255,214,10,0.15);
}
.af-form-group input::placeholder,
.af-form-group textarea::placeholder { color: rgba(255,255,255,0.35); }
.af-form-group textarea { resize: vertical; min-height: 140px; }
.af-form-group select option { background: var(--dark-2); }

/* ══════════════════════════════
   DISCLAIMER / WARNING CARDS
══════════════════════════════ */
.af-warning-card {
  background: rgba(255,60,60,0.05);
  border: 1px solid rgba(255,60,60,0.2);
  border-left: 3px solid #e84040;
  padding: 1.5rem;
  margin-bottom: 1rem;
  transition: border-color 0.3s;
}
.af-warning-card:hover { border-color: rgba(255,60,60,0.45); }
.af-warning-icon { color: #ff6b6b; font-size: 1.2rem; margin-bottom: 0.5rem; }
.af-warning-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.1rem;
  letter-spacing: 0.08em;
  color: #e84040;
  margin-bottom: 0.3rem;
}
.af-warning-text {
  font-size: 0.88rem;
  color: var(--text-mid);
  line-height: 1.6;
}
.af-disclaimer-hero {
  background: rgba(255,60,60,0.07);
  border: 1px solid rgba(255,60,60,0.2);
  border-top: 3px solid #e84040;
}

/* ══════════════════════════════
   CORNER ACCENTS
══════════════════════════════ */
.corner-accent {
  position: absolute;
  width: 28px; height: 28px;
  z-index: 3;
  pointer-events: none;
}
.corner-accent.tl { top: 1.5rem; left: 1.5rem; border-top: 1px solid var(--aqua-light); border-left: 1px solid var(--aqua-light); }
.corner-accent.tr { top: 1.5rem; right: 1.5rem; border-top: 1px solid var(--aqua-light); border-right: 1px solid var(--aqua-light); }
.corner-accent.bl { bottom: 1.5rem; left: 1.5rem; border-bottom: 1px solid var(--aqua-light); border-left: 1px solid var(--aqua-light); }
.corner-accent.br { bottom: 1.5rem; right: 1.5rem; border-bottom: 1px solid var(--aqua-light); border-right: 1px solid var(--aqua-light); }

/* ══════════════════════════════
   SCANLINES — removed (caused visible horizontal lines)
══════════════════════════════ */
.af-scanlines { display: none; }

/* ══════════════════════════════
   ANIMATIONS
══════════════════════════════ */
.fade-up {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.fade-up.visible { opacity: 1; transform: translateY(0); }
.delay-1 { transition-delay: 0.1s; }
.delay-2 { transition-delay: 0.2s; }
.delay-3 { transition-delay: 0.3s; }
.delay-4 { transition-delay: 0.45s; }
.delay-5 { transition-delay: 0.6s; }

/* Scroll indicator */
.scroll-hint {
  position: absolute;
  bottom: 2.5rem; left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  display: flex; flex-direction: column; align-items: center; gap: 0.5rem;
  font-size: 0.6rem; letter-spacing: 0.4em; text-transform: uppercase;
  color: rgba(255,255,255,0.6);
  animation: bounce 2s ease-in-out infinite;
}
.scroll-hint svg { color: var(--aqua-light); }
@keyframes bounce {
  0%,100% { transform: translateX(-50%) translateY(0); }
  50%      { transform: translateX(-50%) translateY(8px); }
}

/* Water separator — removed (caused horizontal lines between sections) */
.af-water-sep { display: none; }

/* Time slots */
.af-slot {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: var(--aqua-dim);
  border: 1px solid rgba(255,214,10,0.25);
  color: var(--white);
  padding: 0.5rem 1rem;
  font-size: 0.82rem;
  letter-spacing: 0.1em;
  margin: 0.3rem;
  transition: all 0.2s;
}
.af-slot:hover { border-color: var(--aqua-light); color: var(--aqua-light); }
.af-slot.full { opacity: 0.35; cursor: not-allowed; }

/* Team card */
.af-team-card { text-align: center; padding: 2.5rem 1.5rem; }
.af-team-avatar {
  width: 100px; height: 100px;
  border-radius: 50%;
  background: var(--aqua-dim);
  border: 2px solid rgba(255,214,10,0.35);
  margin: 0 auto 1.2rem;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Bebas Neue', sans-serif;
  font-size: 2.5rem;
  color: var(--aqua-light);
}
.af-team-name {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.6rem;
  letter-spacing: 0.08em;
  color: #ffffff;
  margin-bottom: 0.2rem;
}
.af-team-role {
  font-size: 0.68rem;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: var(--aqua-light);
  margin-bottom: 0.8rem;
}
.af-team-bio { font-size: 0.88rem; color: rgba(255,255,255,0.75); line-height: 1.6; }

/* ══════════════════════════════
   FOOTER
══════════════════════════════ */
.af-footer {
  background: var(--dark);
  border-top: 1px solid rgba(255,214,10,0.12);
  padding: 4rem 0 2rem;
}
.af-footer-brand {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 2.4rem;
  letter-spacing: 0.06em;
  color: var(--white);
}
.af-footer-brand .brand-fly { color: var(--aqua-light); }
.af-footer-tagline {
  font-size: 0.72rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.45);
  margin-top: 0.3rem;
}
.af-footer-heading {
  font-size: 0.65rem;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--aqua-light);
  margin-bottom: 1.2rem;
}
.af-footer a {
  color: rgba(255,255,255,0.5);
  text-decoration: none;
  font-size: 0.88rem;
  display: block;
  margin-bottom: 0.5rem;
  transition: color 0.2s;
}
.af-footer a:hover { color: var(--aqua-light); }
.af-footer-bottom {
  border-top: 1px solid rgba(255,214,10,0.08);
  padding-top: 1.5rem;
  margin-top: 3rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem;
}
.af-footer-bottom p { font-size: 0.75rem; color: rgba(255,255,255,0.28); margin: 0; }
/* Bottom-bar links are part of a sentence — the block link style above is for the
   footer's link columns and would push e.g. the Noximo credit onto its own line
   at a different size. */
.af-footer-bottom a {
  display: inline;
  font-size: inherit;
  margin-bottom: 0;
}

/* ══════════════════════════════
   EXTRAS PAGE COMPONENTS
══════════════════════════════ */

/* Icon box */
.af-icon-box {
  width: 50px; height: 50px;
  background: var(--aqua-dim);
  border: 1px solid rgba(255,214,10,0.3);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem;
}

/* Card title/text helpers for dark sections */
.af-card-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.05rem;
  letter-spacing: 0.08em;
  color: var(--white);
  margin-bottom: 0.25rem;
}
.af-card-text {
  font-size: 0.85rem;
  color: var(--muted);
  line-height: 1.6;
}

/* Extra cards (dark) */
.af-extra-card {
  background: var(--dark-2);
  border: 1px solid rgba(255,214,10,0.18);
  padding: 2rem;
  position: relative;
  overflow: hidden;
  transition: transform 0.3s, border-color 0.3s;
}
.af-extra-card:hover { transform: translateY(-5px); border-color: var(--aqua-light); }
.af-extra-card.featured {
  border-color: var(--aqua-light);
  box-shadow: 0 0 30px rgba(255,214,10,0.15);
}
.af-extra-badge {
  position: absolute; top: 1rem; right: -2rem;
  background: var(--aqua-light); color: var(--dark);
  font-size: 0.58rem; font-weight: 700; letter-spacing: 0.2em;
  text-transform: uppercase; padding: 0.3rem 2.5rem;
  transform: rotate(45deg);
}
.af-extra-price {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.6rem; letter-spacing: 0.05em;
  color: var(--aqua-light); margin-bottom: 0.8rem;
}
.af-extra-icon { font-size: 2rem; margin-bottom: 0.75rem; }
.af-extra-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.3rem; letter-spacing: 0.08em;
  color: var(--white); margin-bottom: 0.6rem;
}
.af-extra-text { font-size: 0.87rem; color: var(--muted); line-height: 1.7; }

/* Extra cards (light sections) */
.af-extra-card-light {
  background: var(--white);
  border: 1px solid rgba(255,214,10,0.2);
  padding: 2rem;
  transition: transform 0.3s, box-shadow 0.3s;
}
.af-extra-card-light:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(255,214,10,0.12);
  border-color: rgba(255,214,10,0.4);
}
.af-extra-title-dark {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.3rem; letter-spacing: 0.08em;
  color: var(--text-dark); margin-bottom: 0.4rem;
}
.af-extra-price-dark {
  font-size: 0.95rem; font-weight: 600;
  color: var(--accent-deep); margin-bottom: 0.75rem;
}
.af-extra-text-dark { font-size: 0.87rem; color: var(--text-mid); line-height: 1.7; }

/* Section divider between two adjacent sections */
.af-section-divider {
  height: 6px;
  background: linear-gradient(to right, var(--dark) 0%, var(--aqua) 50%, var(--dark) 100%);
}

/* Badge for light sections */
.af-badge-dark {
  display: inline-flex; align-items: center;
  background: rgba(255,214,10,0.1);
  border: 1px solid rgba(255,214,10,0.3);
  color: var(--text-dark);
  padding: 0.4rem 1rem;
  font-size: 0.78rem;
  letter-spacing: 0.08em;
}

/* Badge for dark/parallax sections */
.af-badge {
  display: inline-flex; align-items: center;
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.25);
  color: rgba(255,255,255,0.85);
  padding: 0.4rem 1rem;
  font-size: 0.78rem;
  letter-spacing: 0.1em;
  backdrop-filter: blur(8px);
}

/* ══════════════════════════════
   FORM VALIDATION (contact form)
══════════════════════════════ */
.af-required { color: var(--accent); }
.af-form-group input.input-validation-error,
.af-form-group textarea.input-validation-error,
.af-form-group select.input-validation-error {
  border-color: rgba(232,64,64,0.7);
}
.field-validation-error {
  display: block;
  margin-top: 0.4rem;
  font-size: 0.78rem;
  letter-spacing: 0.02em;
  color: #ff8080;
}
.field-validation-valid { display: none; }

/* ══════════════════════════════
   BOOKING WIZARD
══════════════════════════════ */
.af-wizard-steps {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.4rem;
  margin-bottom: 2.5rem;
}
.af-wizard-step {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.45rem 1rem;
  border: 1px solid rgba(255,214,10,0.2);
  color: var(--muted);
  font-size: 0.68rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.af-wizard-step .num {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1rem;
  color: var(--aqua-light);
}
.af-wizard-step.current {
  background: var(--aqua-dim);
  border-color: var(--aqua-light);
  color: var(--white);
}
.af-slot-window {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.15rem;
  letter-spacing: 0.1em;
  color: var(--aqua-light);
  margin: 1.4rem 0 0.4rem;
}
button.af-slot { cursor: pointer; }
.af-slot.selected {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--dark);
  font-weight: 600;
}
.af-person-card {
  background: var(--aqua-dim);
  border: 1px solid rgba(255,214,10,0.15);
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}
.af-person-card-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.3rem;
  letter-spacing: 0.08em;
  color: var(--aqua-light);
  margin-bottom: 1rem;
}
.af-photo-preview {
  width: 92px;
  height: 92px;
  object-fit: cover;
  border: 1px solid rgba(255,214,10,0.3);
  display: none;
}
.af-photo-preview.visible { display: block; }
.af-camera-overlay {
  position: fixed;
  inset: 0;
  z-index: 2000;
  background: rgba(2,13,20,0.92);
  display: none;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 1rem;
  padding: 1.5rem;
}
.af-camera-overlay.open { display: flex; }
.af-camera-overlay video {
  max-width: min(90vw, 560px);
  border: 1px solid rgba(255,214,10,0.4);
}
.af-signature-box {
  background: #ffffff;
  border: 1px solid rgba(255,214,10,0.4);
  position: relative;
}
.af-signature-box canvas {
  display: block;
  width: 100%;
  height: 180px;
  touch-action: none;
}

/* ══════════════════════════════
   PRICE OPTIONS (two durations per package — 2026-08-04 repricing)
══════════════════════════════ */
.af-price-options {
  margin-top: auto;
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}
.af-price-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border: 1px solid rgba(255,214,10,0.2);
  padding: 0.7rem 1rem;
  text-align: left;
}
.af-price-option-duration {
  display: block;
  font-size: 0.65rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 0.2rem;
}
.af-price-option-amount {
  display: block;
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.9rem;
  line-height: 1.1;
  color: var(--white);
}
.af-price-option-amount sup {
  /* Bootstrap's reboot raises sup by -0.5em, which pushed the € into the duration label above. */
  top: 0;
  font-size: 0.9rem;
  line-height: 1;
  vertical-align: top;
  margin-top: 0.2rem;
  display: inline-block;
}
.af-price-option .btn-af {
  padding: 0.85rem 1.2rem;
  font-size: 0.66rem;
  letter-spacing: 0.2em;
  flex-shrink: 0;
}
/* Price options in light sections */
.af-section-alt  .af-price-option,
.af-section-alt2 .af-price-option { border-color: rgba(255,214,10,0.35); }
.af-section-alt  .af-price-option-amount,
.af-section-alt2 .af-price-option-amount { color: var(--text-dark); }
.af-section-alt  .af-price-option-duration,
.af-section-alt2 .af-price-option-duration { color: var(--text-muted); }

/* ══════════════════════════════
   PAYMENT PAGE
══════════════════════════════ */
.af-pay-total {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  border-top: 1px solid rgba(255,214,10,0.25);
  margin-top: 1rem;
  padding-top: 1rem;
}
.af-pay-total-label {
  font-size: 0.72rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--muted);
}
.af-pay-total-amount {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 2.6rem;
  line-height: 1;
  color: var(--aqua-light);
}
.af-pay-note {
  font-size: 0.78rem;
  color: var(--muted);
  line-height: 1.7;
}

/* ══════════════════════════════
   SELECT2 (af dark theme)
══════════════════════════════ */
.af-form-group .select2-container { width: 100% !important; }
.af-form-group .select2-container .select2-selection--single {
  height: auto;
  background: rgba(255,214,10,0.05);
  border: 1px solid rgba(255,214,10,0.25);
  border-radius: 0;
  transition: border-color 0.25s, box-shadow 0.25s;
}
.af-form-group .select2-container .select2-selection--single .select2-selection__rendered {
  color: var(--white);
  font-family: 'Barlow', sans-serif;
  font-size: 0.95rem;
  line-height: 1.5;
  padding: 0.9rem 2.6rem 0.9rem 1.2rem;
}
.af-form-group .select2-container .select2-selection--single .select2-selection__placeholder { color: rgba(255,255,255,0.35); }
.af-form-group .select2-container .select2-selection--single .select2-selection__arrow {
  height: 100%;
  top: 0;
  right: 1rem;
  width: 20px;
}
.af-form-group .select2-container .select2-selection--single .select2-selection__arrow b {
  border-color: var(--aqua-light) transparent transparent transparent;
}
.af-form-group .select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent var(--aqua-light) transparent;
}
.af-form-group .select2-container--focus .select2-selection--single,
.af-form-group .select2-container--open .select2-selection--single {
  border-color: var(--aqua-light);
  box-shadow: 0 0 18px rgba(255,214,10,0.15);
}
.af-form-group select.input-validation-error + .select2-container .select2-selection--single { border-color: #e84040; }

.select2-container--default .select2-dropdown {
  background: var(--dark-2);
  border: 1px solid rgba(255,214,10,0.35);
  border-radius: 0;
  box-shadow: 0 18px 50px rgba(0,0,0,0.5);
}
.select2-container--default .select2-results__option {
  color: var(--white);
  font-family: 'Barlow', sans-serif;
  font-size: 0.9rem;
  padding: 0.7rem 1.2rem;
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background: var(--accent);
  color: var(--dark);
}
.select2-container--default .select2-results__option--selected {
  background: rgba(255,214,10,0.12);
  color: var(--aqua-light);
}
.select2-container--default .select2-search--dropdown .select2-search__field {
  background: rgba(255,214,10,0.05);
  border: 1px solid rgba(255,214,10,0.25);
  color: var(--white);
  font-family: 'Barlow', sans-serif;
  outline: none;
}

/* ══════════════════════════════
   FLATPICKR (af dark theme)
══════════════════════════════ */
.flatpickr-calendar {
  background: var(--dark-2);
  border: 1px solid rgba(255,214,10,0.35);
  border-radius: 0;
  box-shadow: 0 18px 50px rgba(0,0,0,0.55);
  font-family: 'Barlow', sans-serif;
}
.flatpickr-calendar.arrowTop:before { border-bottom-color: rgba(255,214,10,0.35); }
.flatpickr-calendar.arrowTop:after { border-bottom-color: var(--dark-2); }
.flatpickr-calendar.arrowBottom:before { border-top-color: rgba(255,214,10,0.35); }
.flatpickr-calendar.arrowBottom:after { border-top-color: var(--dark-2); }
.flatpickr-months .flatpickr-month { color: var(--white); fill: var(--white); }
.flatpickr-current-month .flatpickr-monthDropdown-months {
  background: var(--dark-2);
  color: var(--white);
  font-family: 'Barlow', sans-serif;
}
.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month { background: var(--dark-2); }
.flatpickr-current-month input.cur-year { color: var(--white); }
.numInputWrapper span.arrowUp:after { border-bottom-color: var(--aqua-light); }
.numInputWrapper span.arrowDown:after { border-top-color: var(--aqua-light); }
.numInputWrapper:hover { background: rgba(255,214,10,0.08); }
.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month { fill: var(--aqua-light); }
.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg { fill: var(--accent-hover); }
span.flatpickr-weekday { color: var(--aqua-light); font-weight: 600; }
.flatpickr-day {
  color: var(--white);
  border-radius: 0;
}
.flatpickr-day:hover,
.flatpickr-day:focus,
.flatpickr-day.prevMonthDay:hover,
.flatpickr-day.nextMonthDay:hover {
  background: rgba(255,214,10,0.15);
  border-color: transparent;
  color: var(--white);
}
.flatpickr-day.today { border-color: var(--aqua-light); }
.flatpickr-day.today:hover, .flatpickr-day.today:focus {
  background: rgba(255,214,10,0.15);
  border-color: var(--aqua-light);
  color: var(--white);
}
.flatpickr-day.selected,
.flatpickr-day.selected:hover,
.flatpickr-day.selected:focus {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--dark);
  font-weight: 600;
}
.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover,
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay {
  color: rgba(255,255,255,0.25);
  background: transparent;
}

/* ══════════════════════════════
   FILE UPLOAD (participants step)
══════════════════════════════ */
/* visually hide the native input but keep it focusable/postable */
.af-form-group input.af-file-input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
/* upload + camera as identical-height buttons */
.af-form-group .af-upload-btn,
.af-form-group label.af-upload-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 1.6rem;
  margin: 0;
  font-family: 'Barlow', sans-serif;
  font-weight: 700;
  font-size: 0.72rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--aqua-light);
  cursor: pointer;
}
.af-form-group input.af-file-input:focus-visible + div label.af-upload-btn {
  outline: 2px solid var(--aqua-light);
  outline-offset: 2px;
}
.af-file-name {
  font-size: 0.8rem;
  color: var(--muted);
  margin-top: 0.6rem;
}
.af-file-name.selected { color: var(--aqua-light); }

/* ══════════════════════════════
   SEO / ACCESSIBILITY
══════════════════════════════ */

/* Card, package, team, timeline and FAQ titles are real <h3>s so the page has a heading
   outline search engines and screen readers can follow. Headings carry browser defaults
   (bold, tighter line-height, top margin) that the <div>s they replaced did not — this
   block resets them so the promotion is invisible on screen. */
.af-card-title,
.af-price-name,
.af-team-name,
.af-timeline-title,
.af-faq-question {
  font-weight: 400;
  line-height: inherit;
  margin-top: 0;
}

/* The FAQ heading only exists to carry the toggle button; the button keeps all the styling. */
.af-faq-question {
  margin-bottom: 0;
  font-size: inherit;
  letter-spacing: normal;
}

/* Below the sm breakpoint .container is full-width with 12px side padding, but a .g-5 row's
   -24px side margins poke 12px past it on BOTH sides — the whole page then pans sideways on
   phones (body overflow-x:hidden hides the scrollbar on desktop, mobile browsers pan anyway).
   Capping the horizontal gutter at 1.5rem makes the negative margin match the container
   padding exactly. Stacked columns keep the same net inset (row margin and column padding
   cancel), and the vertical gutter stays 3rem, so nothing else moves. */
@media (max-width: 575.98px) {
  .row.g-5 { --bs-gutter-x: 1.5rem; }
}

/* Keyboard users land here first and can jump past the navbar. */
.af-skip-link {
  position: absolute;
  top: -100%;
  left: 1rem;
  z-index: 2000;
  padding: 0.75rem 1.25rem;
  background: var(--accent);
  color: var(--dark);
  font-family: 'Barlow', sans-serif;
  font-weight: 600;
  font-size: 0.85rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
}
.af-skip-link:focus {
  top: 1rem;
  outline: 2px solid var(--white);
  outline-offset: 2px;
}

/* ══════════════════════════════
   LEGAL PAGES (Terms / Privacy)
══════════════════════════════ */

.af-legal-meta {
  font-size: 0.72rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--aqua-light);
  margin-bottom: 2.5rem;
}
.af-legal h2 {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.6rem;
  letter-spacing: 0.08em;
  color: var(--white);
  margin: 2.5rem 0 0.9rem;
}
.af-legal p,
.af-legal li {
  font-size: 0.92rem;
  color: var(--muted);
  line-height: 1.8;
}
.af-legal ul {
  padding-left: 1.4rem;
  margin-bottom: 1rem;
}
.af-legal li { margin-bottom: 0.4rem; }
.af-legal a { color: var(--aqua-light); text-decoration: none; }
.af-legal a:hover { text-decoration: underline; }
.af-legal code {
  font-size: 0.85em;
  color: var(--aqua-light);
  background: var(--aqua-dim);
  padding: 0.1em 0.4em;
}
.af-legal-related {
  border-top: 1px solid rgba(255,214,10,0.12);
  padding-top: 1.5rem;
  margin-top: 3rem;
}

/* ══════════════════════════════
   COOKIE CONSENT BANNER
══════════════════════════════ */

.af-cookie-banner {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 1100;                      /* above content, below the skip link (2000) */
  background: rgba(7,30,43,0.98);
  border-top: 1px solid rgba(255,214,10,0.3);
  box-shadow: 0 -10px 40px rgba(0,0,0,0.45);
  padding: 1.1rem 0;
}
.af-cookie-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.9rem 2rem;
}
.af-cookie-text {
  font-size: 0.85rem;
  color: var(--muted);
  line-height: 1.6;
  margin: 0;
  flex: 1 1 320px;
}
.af-cookie-text a { color: var(--aqua-light); text-decoration: underline; }
.af-cookie-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}
/* Slimmer than the page CTAs, but still a ≥44px touch target. */
.btn-af.af-cookie-btn {
  padding: 0.85rem 1.5rem;
  letter-spacing: 0.2em;
  white-space: nowrap;
}
@media (max-width: 575.98px) {
  .af-cookie-actions,
  .btn-af.af-cookie-btn { width: 100%; text-align: center; }
}