/* Main site stylesheet extracted from index.html */
:root{
  --bg:#f6fbfa; --ink:#12343d; --ink-dim:#506a70; --accent:#0b8fa8; --accent-2:#f2a766; --line:rgba(18,52,61,0.15);
  --card: rgba(255,255,255,0.86);
  --surface:#ffffff;
  --seafoam:#e4f6f2;
  --radius: 6px;
  --shadow: 0 16px 42px rgba(15,74,88,0.14);
}
*{box-sizing:border-box}
html, body { min-height: 100%; }
body{
  margin:0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  color: var(--ink);
  background:
    radial-gradient(780px 360px at 16% 0%, rgba(12,154,178,0.16), transparent 70%),
    radial-gradient(660px 320px at 92% 10%, rgba(242,167,102,0.16), transparent 70%),
    linear-gradient(180deg, #fbfefd 0%, var(--bg) 42%, #eef8f5 100%);
  padding: calc(28px + env(safe-area-inset-top)) 28px 28px;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
@supports (height: 100dvh) { body { min-height: 100dvh; } }
.shell{width:min(1000px,100%); margin:0 auto}
.card{ border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:linear-gradient(180deg, rgba(255,255,255,0.95), var(--card)); backdrop-filter: blur(8px); margin-bottom:12px; box-shadow: var(--shadow); padding:22px; }
.hero{ position:relative; padding:48px 28px 18px; text-align:center; background-color:#dff7f5; background-image: linear-gradient(90deg, rgba(255,255,255,0.88) 0%, rgba(247,253,251,0.66) 46%, rgba(247,253,251,0.22) 100%), url('/assets/proof/underwater-snorkeling-couple-silhouette.webp'); background-position:center, center; background-size:auto, cover; background-repeat:no-repeat; border-bottom:1px solid rgba(18,52,61,0.08); color: var(--ink); }
@supports (background-image: image-set(url('/assets/proof/underwater-snorkeling-couple-silhouette.webp') type('image/webp') 1dppx)){
  .hero{ background-image: linear-gradient(90deg, rgba(255,255,255,0.88) 0%, rgba(247,253,251,0.66) 46%, rgba(247,253,251,0.22) 100%), image-set(url('/assets/proof/underwater-snorkeling-couple-silhouette.webp') type('image/webp') 1dppx); }
}
.hero::before{ content: ''; position: absolute; inset: 0; background:linear-gradient(180deg, rgba(234,249,246,0.02), rgba(234,249,246,0.34)); pointer-events: none; z-index: 1; }
.hero canvas#hero-bubbles{ position:absolute; inset:0; width:100%; height:100%; z-index:2; pointer-events:none }
.hero > *{ position: relative; z-index: 3 }
/* hero logo */
.hero-logo{ position:relative; display:block; margin:0 auto 44px; max-width:min(540px, 88vw) }
.hero-logo img{ width:100%; height:auto; display:block; filter:drop-shadow(0 10px 20px rgba(255,255,255,0.62)) }
.hero-trademark{ position:absolute; top:22%; right:-1%; font-size:clamp(12px, 1.5vw, 17px); line-height:1; color:#14546a; opacity:0.9; font-weight:600 }
h1{font-family: 'Marcellus', Georgia, 'Times New Roman', serif; font-size: clamp(29px, 4.5vw, 48px); margin: -2px 0 8px; letter-spacing:0; font-weight:400;
  color: #12343d;
  background: linear-gradient(180deg, #12343d 0%, #0b6f83 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.compact-page-title{ font-size:clamp(28px, 3.4vw, 40px); max-width:24ch }
h2{
  letter-spacing:0.1px; font-weight:700; 
  color: #12343d;
  background: linear-gradient(180deg, #12343d 10%, #0b6f83 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.sub{font-size: clamp(15px, 1.6vw, 18px); color:var(--ink-dim); max-width:64ch; margin:0 auto; line-height:1.55}
.tag{letter-spacing:.08em; text-transform:uppercase; font-size:12px; color:var(--ink-dim); margin-bottom:10px}
.btns{display:flex; gap:14px; justify-content:center; margin-top:20px; flex-wrap:wrap}
.btn{ appearance:none; display:inline-flex;
    box-shadow: 0 8px 22px rgba(15,74,88,0.08), 0 0 0 2px rgba(11,143,168,0.06);
  border:1px solid rgba(11,143,168,0.34); color:var(--ink); background:rgba(255,255,255,0.64); padding:12px 20px; border-radius:var(--radius); text-decoration:none; font-weight:700; letter-spacing:0.2px; transition: all .18s ease; min-height:44px; align-items:center; justify-content:center; }
.btn:hover{ transform: translateY(-2px); box-shadow: 0 12px 26px rgba(15,74,88,0.16) }

a:focus-visible,
button:focus-visible,
.btn:focus-visible{
  outline:2px solid var(--accent-2);
  outline-offset:3px;
}
.btn.primary{ background: linear-gradient(90deg,var(--accent),#39b8c8); color:#ffffff; border-color:transparent; box-shadow: 0 12px 28px rgba(11,143,168,0.22) }
section{padding:22px}
section h2{margin:.2rem 0 .6rem; font-size:22px}
p{color:var(--ink); line-height:1.65; margin:0 0 12px}
.feature-image-frame{ padding:18px 0; display:flex; justify-content:center }
.feature-image{ max-width:780px; width:100%; height:auto; border-radius:12px; border:1px solid var(--line) }
.media-band{ display:grid; gap:22px; align-items:center }
@media(min-width:860px){ .media-band{ grid-template-columns:1.02fr .98fr } .media-band.reverse{ grid-template-columns:.98fr 1.02fr } }
.media-copy h2{ margin-top:0 }
.media-frame{ margin:0; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:var(--surface); box-shadow:0 12px 30px rgba(15,74,88,0.12) }
.media-frame img{ display:block; width:100%; height:100%; object-fit:cover; aspect-ratio:4/3 }
.media-frame.wide img{ aspect-ratio:16/9 }
.media-frame.square img{ aspect-ratio:1/1 }
.media-frame.tall img{ aspect-ratio:3/4 }
.media-frame figcaption{ padding:10px 12px; color:var(--ink-dim); font-size:13px; line-height:1.45; background:rgba(255,255,255,0.94) }
.proof-media-grid{ display:grid; gap:16px; margin:20px 0 }
@media(min-width:780px){ .proof-media-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)) } }
.proof-media-grid .media-frame img{ height:auto }
.proof-media-grid.three-up{ grid-template-columns:1fr }
@media(min-width:760px){ .proof-media-grid.three-up{ grid-template-columns:repeat(3, minmax(0, 1fr)) } }
.proof-media-grid.three-up .media-frame img{ aspect-ratio:4/3; height:auto }
.proof-note{ border-left:3px solid var(--accent); padding-left:14px; color:var(--ink-dim) }
.event-actions{ display:flex; gap:16px; margin:24px 0; flex-wrap:wrap }
.section-rule{ margin:40px 0; border:none; border-top:1px solid var(--line) }
.availability-list{ margin-bottom:12px }
.contact-email strong{ white-space:nowrap }
.muted-note{ margin-top:30px; color:var(--ink-dim); font-size:14px }
.grid{display:grid; gap:20px}
@media(min-width:900px){ .grid.two{grid-template-columns:1fr 1fr} }
.unit{border:1px solid var(--line); border-radius:calc(var(--radius) - 2px); padding:20px; background:rgba(255,255,255,0.58)}
ul{margin:0 0 0 18px}
footer{display:flex; gap:12px; justify-content:space-between; align-items:center; color:var(--ink-dim); padding:18px 24px; border-top:1px solid var(--line); flex-wrap:wrap}
.site-footer{margin-top:18px}
.footer-links{display:flex; gap:18px; flex-wrap:wrap; align-items:center}
.footer-aloha{flex:1 0 100%; margin:6px 0 0; text-align:center; color:var(--accent); font-family:'Marcellus', Georgia, 'Times New Roman', serif; font-size:clamp(16px, 2vw, 19px); letter-spacing:.01em}
.testimonials-grid{display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); margin-top:12px}
.testimonial{margin:0; padding:20px; border:1px solid var(--line); border-radius:calc(var(--radius) - 2px); background:rgba(255,255,255,0.58)}
.testimonial blockquote{margin:0 0 12px; font-size:1.05rem; line-height:1.55}
.testimonial figcaption{display:flex; flex-direction:column; gap:2px; color:var(--ink-dim); font-size:0.92rem}
.testimonial-name{font-weight:700; color:var(--ink)}
a{color:var(--ink)}

.site-header{ position:sticky; top:0; z-index:40; backdrop-filter: blur(10px); margin-bottom:18px; background:rgba(246,251,250,0.78); border:1px solid rgba(18,52,61,0.08); border-radius:var(--radius); box-shadow:0 10px 24px rgba(15,74,88,0.08) }
.skip-link{ position:fixed; left:16px; top:calc(8px + env(safe-area-inset-top)); transform:translateY(calc(-100% - 24px)); clip-path:inset(50%); width:1px; height:1px; overflow:hidden; white-space:nowrap; z-index:100; background:#ffffff; color:var(--ink); border:1px solid var(--accent); border-radius:var(--radius); padding:10px 14px; text-decoration:none; font-weight:700 }
.skip-link:focus,
.skip-link:focus-visible{ transform:none; clip-path:none; width:auto; height:auto; overflow:visible; white-space:normal }

/* site-wide water texture: fixed behind all content, kept faint for daylight readability */
body::before{
  content: "";
  position:fixed;
  inset:0;
  background-image: url('/assets/optimized/ripple-1200.webp');
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  opacity: 0.08;
  pointer-events: none;
  z-index: 0;
  filter: saturate(.72) contrast(.9) blur(1px);
  transition: opacity .6s ease, transform .6s ease;
}
@supports (background-image: image-set(url('/assets/optimized/ripple-1200.webp') type('image/webp') 1dppx)){
  body::before{
    background-image: image-set(url('/assets/optimized/ripple-1200.webp') type('image/webp') 1dppx);
  }
}

/* hide the legacy top-media element to avoid showing the image twice */
.site-top-media{ display:none !important }
.site-top-media .site-top-image{ display:block; width:100%; height:100%; object-fit:cover; opacity:0.98; transition:opacity .45s ease, transform .6s ease; filter: saturate(0.98) contrast(1.02); transform: translateZ(0); }
.site-top-media::after{ content:''; position:absolute; left:0; right:0; bottom:0; height:60%; background: linear-gradient(180deg, rgba(246,251,250,0) 0%, rgba(246,251,250,0.92) 100%); pointer-events:none }
.site-top-media .site-top-image.fade-slow{ transform:translateY(0); opacity:1 }
.site-header .header-inner{ display:flex; align-items:center; gap:18px; justify-content:space-between; padding:12px 16px }
.brand{ font-weight:800; text-decoration:none; color:var(--ink); font-size:18px; display:inline-flex; align-items:center; gap:3px }
.brand-logo{ display:block; width:140px; height:auto }
.brand-trademark{ align-self:flex-start; margin-top:2px; color:var(--ink); font-size:9px; line-height:1; letter-spacing:.06em; font-weight:800 }
.visually-hidden{ position:absolute !important; height:1px; width:1px; overflow:hidden; clip:rect(1px, 1px, 1px, 1px); white-space:nowrap; border:0; padding:0; margin:-1px }
.main-nav > ul{ display:flex; gap:8px; list-style:none; margin:0; padding:0; align-items:center }
.main-nav a{ color:var(--ink); text-decoration:none; padding:10px 8px; border-radius:6px; font-size:14px; white-space:nowrap; min-height:44px; display:inline-flex; align-items:center }
.main-nav a:hover{ color:var(--ink); background:rgba(11,143,168,0.08) }
.main-nav a[aria-current="page"]{ color:var(--ink); background:rgba(11,143,168,0.1); box-shadow:inset 0 -2px 0 rgba(11,143,168,0.45) }
.nav-toggle{ display:none; background:rgba(255,255,255,0.62); border:1px solid rgba(18,52,61,0.16); color:var(--ink); padding:8px 10px; border-radius:6px; min-width:44px; min-height:44px; align-items:center; justify-content:center }
@media(max-width:860px){ .main-nav{ display:none } .nav-toggle{ display:inline-flex } }
/* Mobile nav open state */
.main-nav.open{ display:block; position: absolute; top:64px; left:0; right:0; background: rgba(255,255,255,0.96); padding:12px 18px; border:1px solid rgba(18,52,61,0.12); border-radius:0 0 var(--radius) var(--radius); box-shadow:0 16px 30px rgba(15,74,88,0.12) }
.main-nav.open{ z-index:60; }
.nav-toggle{ z-index:80; position:relative; font-size:20px; padding:10px 12px; border-radius:8px }
@media(max-width:860px){ .nav-toggle{ font-size:22px; padding:12px 14px } }
.main-nav.open ul{ flex-direction:column; gap:8px }
.main-nav.open a{ display:block; padding:10px 12px }

/* Experiences dropdown */
.nav-has-submenu{ position:relative }
.nav-submenu-toggle{ font:inherit; font-size:14px; cursor:pointer; color:var(--ink); background:transparent; border:0; padding:10px 8px; border-radius:6px; white-space:nowrap; min-height:44px; display:inline-flex; align-items:center; gap:5px }
.nav-submenu-toggle::after{ content:"\25BE"; font-size:10px; line-height:1; opacity:0.7 }
.nav-submenu-toggle:hover{ background:rgba(11,143,168,0.08) }
.nav-submenu-toggle:focus-visible{ outline:2px solid var(--accent); outline-offset:2px }
.nav-submenu{ list-style:none; margin:0; padding:0; display:none }
.nav-has-submenu.submenu-open > .nav-submenu{ display:block }
/* Hover-to-open only on devices that truly hover; touch/keyboard use the
   .submenu-open class (JS) so the menu can never stick open after a tap. */
@media (hover: hover) and (pointer: fine){
  .nav-has-submenu:hover > .nav-submenu{ display:block }
}
@media(min-width:861px){
  .nav-submenu{ position:absolute; top:100%; left:0; min-width:200px; padding:6px; background:rgba(255,255,255,0.98); border:1px solid rgba(18,52,61,0.12); border-radius:0 0 var(--radius) var(--radius); box-shadow:0 16px 30px rgba(15,74,88,0.12); z-index:70 }
  .nav-submenu a{ display:block; white-space:nowrap }
}
.main-nav.open .nav-has-submenu{ position:static }
.main-nav.open .nav-submenu-toggle{ display:flex; width:100%; justify-content:space-between; padding:10px 12px }
.main-nav.open .nav-submenu{ padding-left:12px }

/* content helpers */
.container{ max-width:1000px; margin:0 auto }

@media(min-width:1200px){
  .site-top-media{ height:clamp(220px, 22vh, 560px); }
}

/* ensure page content stacks above the fixed background image */
.shell{ position:relative; z-index:20 }

/* Swiper Gallery Styles */
.gallery-title{ text-align:center; margin-bottom:20px }
.gallery-swiper{ max-width:900px; max-height:600px; margin:0 auto; border-radius:12px; overflow:hidden; aspect-ratio:16/9 }
.gallery-swiper .swiper-slide{ display:flex; align-items:center; justify-content:center; background:rgba(18,52,61,0.08) }
.gallery-swiper .swiper-slide picture{ width:100%; height:100%; display:block }
.gallery-swiper .swiper-slide img{ width:100%; height:100%; object-fit:cover; display:block }

/* Swiper navigation buttons - custom styling */
.gallery-swiper .swiper-button-prev,
.gallery-swiper .swiper-button-next{ color:#fff; background:rgba(0,0,0,0.5); width:44px; height:44px; border-radius:50%; border:1px solid rgba(255,255,255,0.2); transition:all 0.2s ease; display:flex; align-items:center; justify-content:center; font-size:0; line-height:1 }
.gallery-swiper .swiper-button-prev:hover,
.gallery-swiper .swiper-button-next:hover{ background:rgba(0,0,0,0.8); transform:scale(1.1) }
.gallery-swiper .swiper-button-prev::after,
.gallery-swiper .swiper-button-next::after{ content:none }
.gallery-swiper .gallery-nav-caret{ color:#fff; font-size:34px; line-height:1; font-family:Georgia, 'Times New Roman', serif; font-weight:400; transform:translateY(-1px); pointer-events:none }

/* Swiper pagination dots */
.gallery-swiper .swiper-pagination{ bottom:12px }
.gallery-swiper .swiper-pagination-bullet{ background:rgba(255,255,255,0.5); opacity:1; width:10px; height:10px }
.gallery-swiper .swiper-pagination-bullet-active{ background:var(--accent); transform:scale(1.2) }

/* Commercial phase helpers */
.hero .btns{ margin-bottom:18px }
.kicker{ color:#0b7f96; font-weight:700; text-transform:uppercase; letter-spacing:0.08em; font-size:12px; margin-bottom:8px }
.lede{ font-size:18px; color:var(--ink); max-width:72ch }
.muted{ color:var(--ink-dim) }
.pathway-grid{ display:grid; gap:16px; margin-top:18px }
@media(min-width:760px){ .pathway-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)) } }
.pathway{ border:1px solid var(--line); border-radius:var(--radius); padding:18px; background:rgba(255,255,255,0.72) }
.pathway h3{ margin:0 0 8px; font-size:18px; color:var(--ink) }
.pathway p{ color:var(--ink-dim) }
.pathway .btn{ margin-top:6px; display:inline-flex }
.proof-strip{ border-block:1px solid var(--line); margin:24px 0; padding:22px 0 }
.proof-strip h2{ margin-top:0 }
.proof-list{ display:grid; gap:12px; margin:18px 0; padding:0; list-style:none }
.proof-list li{ border-left:2px solid rgba(102,209,232,0.5); padding:2px 0 2px 14px; color:var(--ink-dim); line-height:1.65 }
.proof-list strong{ color:var(--ink) }
.steps-grid{ display:grid; gap:14px; margin-top:16px }
@media(min-width:820px){ .steps-grid{ grid-template-columns:repeat(4, minmax(0, 1fr)) } }
.step{ border-left:2px solid rgba(102,209,232,0.5); padding:2px 0 2px 14px }
.step strong{ display:block; color:var(--ink); margin-bottom:6px }
.step p{ color:var(--ink-dim); margin:0 }
.route-grid{ display:grid; gap:16px; margin:22px 0 }
@media(min-width:820px){ .route-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)) } }
.route{ border:1px solid var(--line); border-radius:var(--radius); padding:18px; background:rgba(255,255,255,0.7) }
.route h2{ margin-top:0; font-size:20px }
.route .btn{ display:inline-flex; margin-top:8px }
.status-list{ display:grid; gap:12px; margin:18px 0 }
.status-item{ border:1px solid var(--line); border-radius:var(--radius); padding:16px; background:rgba(255,255,255,0.7) }
.status-item h2,
.status-item h3{ margin:0 0 8px; font-size:19px; color:var(--ink) }
.compact-list{ margin-top:10px }
.compact-list li{ margin-bottom:8px; line-height:1.5 }
.partner-print-sheet{ display:none; border:1px solid rgba(11,143,168,0.24); border-radius:var(--radius); padding:20px; margin:26px 0; background:linear-gradient(180deg, rgba(228,246,242,0.78), rgba(255,255,255,0.92)) }
.partner-print-sheet h2,
.partner-print-sheet h3{ margin-top:0 }
.partner-print-grid{ display:grid; gap:14px; margin:18px 0 }
@media(min-width:820px){ .partner-print-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)) } }
.partner-print-item{ border:1px solid var(--line); border-radius:var(--radius); padding:14px; background:rgba(255,255,255,0.72) }
.partner-print-item h3{ font-size:16px; margin-bottom:8px; color:var(--ink) }
.partner-print-contact{ border-top:1px solid var(--line); margin-top:16px; padding-top:14px }
.location-list{ display:grid; gap:14px; margin-top:16px }
.location-card,
.location-empty,
.location-map{ border:1px solid var(--line); border-radius:var(--radius); padding:18px; background:rgba(255,255,255,0.72) }
.location-card.is-selected{ border-color:rgba(11,143,168,0.42); box-shadow:0 14px 34px rgba(15,74,88,0.12) }
.map-section{ padding-left:0; padding-right:0 }
.location-card h2,
.location-empty h2{ margin:0 0 8px; font-size:20px }
.location-card .btn{ display:inline-flex; margin-top:8px }
.location-map{ display:grid; gap:14px; margin-top:14px; min-width:0; overflow:hidden }
.location-map-stage{ position:relative; width:100%; max-width:100%; min-width:0; min-height:320px; aspect-ratio:16/9; overflow:hidden; border:1px solid rgba(102,209,232,0.22); border-radius:var(--radius); background:#d7eef2; isolation:isolate }
.location-google-map{ width:100%; height:100% }
.location-google-embed{ display:block; width:100%; max-width:100%; height:100%; border:0 }
.location-embed-stage{ isolation:isolate }
.gm-style .gm-style-iw-c{ padding:0 !important; overflow:visible !important; max-height:none !important; border-radius:var(--radius) !important; box-shadow:0 14px 32px rgba(15,74,88,0.22) !important }
.gm-style .gm-style-iw-chr{ position:absolute !important; top:0; right:0; z-index:3; height:0 !important; min-height:0 !important }
.gm-style .gm-style-iw-ch{ display:none !important }
.gm-style .gm-style-iw-d{ overflow:visible !important; max-height:none !important; padding:0 !important }
.gm-style .gm-ui-hover-effect{ position:absolute !important; top:7px !important; right:7px !important; width:28px !important; height:28px !important; border-radius:50% !important; background:rgba(228,246,242,0.92) !important; opacity:1 !important }
.gm-style .gm-ui-hover-effect span{ margin:6px !important; width:16px !important; height:16px !important; background-color:#04596b !important }
.location-map-popup{ position:relative; color:var(--ink); background:rgba(255,255,255,0.96); border:1px solid rgba(11,143,168,0.22); border-radius:var(--radius); padding:12px 13px; font-family:Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; min-width:190px; max-width:280px }
.location-map-popup h3{ margin:0 34px 6px 0; color:#12343d; font-size:17px; line-height:1.2 }
.location-map-popup p{ margin:0 0 10px; color:var(--ink); font-size:13px; line-height:1.45 }
.location-map-popup .location-popup-meta{ color:var(--ink-dim); font-weight:700 }
.location-popup-link{ display:inline-flex; min-height:34px; align-items:center; justify-content:center; border:1px solid rgba(11,143,168,0.28); border-radius:var(--radius); padding:7px 10px; color:#04596b; background:#e9fbfb; font-size:13px; font-weight:700; text-decoration:none }
.location-popup-close{ position:absolute; top:6px; right:6px; display:grid; place-items:center; width:28px; height:28px; border:0; border-radius:50%; background:rgba(228,246,242,0.92); color:#04596b; font-size:20px; line-height:1; cursor:pointer }
.location-google-map.is-loading,
.location-map[data-map-state="missing-key"] .location-google-map,
.location-map[data-map-state="error"] .location-google-map{ display:grid; place-items:center; background:linear-gradient(135deg, rgba(191,232,238,0.88), rgba(237,248,242,0.92)) }
.location-google-map.is-loading::before,
.location-map[data-map-state="missing-key"] .location-google-map::before,
.location-map[data-map-state="error"] .location-google-map::before{ content:"Kaua'i"; display:grid; place-items:center; width:116px; height:116px; border:1px solid rgba(11,143,168,0.32); border-radius:50%; color:#0b7f96; background:rgba(255,255,255,0.7); font-family:Marcellus, serif; font-size:24px; box-shadow:0 16px 34px rgba(15,74,88,0.12) }
.map-empty,
.map-note{ margin:0; color:var(--ink-dim); font-size:14px; line-height:1.55 }
@media(max-width:520px){ .location-map{ margin-left:-10px; margin-right:-10px; padding:12px } .location-map-stage{ min-height:260px; aspect-ratio:4/3 } }
.pill{ display:inline-flex; align-items:center; gap:6px; border:1px solid rgba(11,143,168,0.3); color:#0b7f96; background:rgba(228,246,242,0.58); border-radius:999px; padding:5px 10px; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; margin-bottom:10px }
.page-actions{ display:flex; gap:14px; flex-wrap:wrap; margin:22px 0 8px }
.page-actions .btn{ display:inline-flex }
.faq-list{ display:grid; gap:10px; margin:18px 0 }
.faq-list details{ border:1px solid var(--line); border-radius:var(--radius); background:rgba(255,255,255,0.72); padding:0 }
.faq-list summary{ cursor:pointer; min-height:44px; padding:13px 16px; color:var(--ink); font-weight:700 }
.faq-list details p{ padding:0 16px 16px; color:var(--ink-dim) }
.lead-panel{ border:1px solid rgba(11,143,168,0.24); border-radius:var(--radius); background:linear-gradient(180deg, rgba(228,246,242,0.72), rgba(255,255,255,0.84)); margin:24px 0; padding:20px }
.lead-form{ display:grid; gap:16px; margin-top:18px }
.form-grid{ display:grid; gap:14px }
@media(min-width:760px){ .form-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)) } .form-grid .wide{ grid-column:1 / -1 } }
.lead-form label{ display:grid; gap:7px; color:var(--ink); font-weight:700 }
.lead-form input,
.lead-form select,
.lead-form textarea{ width:100%; min-height:44px; border:1px solid rgba(18,52,61,0.18); border-radius:var(--radius); background:rgba(255,255,255,0.9); color:var(--ink); padding:11px 12px; font:inherit }
.lead-form textarea{ min-height:120px; resize:vertical }
.lead-form input:focus,
.lead-form select:focus,
.lead-form textarea:focus{ outline:2px solid var(--accent-2); outline-offset:2px }
.lead-form select option{ color:#001923; background:#e9f6fb }
.consent-check{ grid-template-columns:auto 1fr; align-items:start; font-weight:600; color:var(--ink-dim) }
.consent-check input{ width:20px; min-height:20px; margin-top:3px }
.consent-note,
.field-note,
.form-status{ color:var(--ink-dim); font-size:14px; line-height:1.55 }
.form-actions{ display:flex; gap:14px; align-items:center; flex-wrap:wrap }
.form-status{ min-height:22px; margin:0 }
.honeypot{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden }

.qr-page{ padding:calc(20px + env(safe-area-inset-top)) 18px calc(24px + env(safe-area-inset-bottom)); min-height:100vh; display:grid; place-items:center }
.qr-shell{ width:min(440px, 100%); margin:0 auto }
.qr-card{ border:1px solid var(--line); border-radius:var(--radius); background:linear-gradient(180deg, rgba(255,255,255,0.97), rgba(228,246,242,0.86)); box-shadow:var(--shadow); padding:24px 18px 18px; text-align:center }
.qr-logo-link{ display:block; width:min(320px, 84%); margin:0 auto 18px }
.qr-logo{ display:block; width:100%; height:auto; filter:drop-shadow(0 12px 22px rgba(255,255,255,0.6)) }
.qr-card h1{ margin:0 0 8px; font-size:clamp(34px, 10vw, 48px) }
.qr-lede{ color:var(--ink-dim); max-width:28ch; margin:0 auto 18px; line-height:1.5 }
.qr-links{ display:grid; gap:10px }
.qr-link{ display:flex; align-items:center; justify-content:center; min-height:50px; padding:13px 16px; border:1px solid rgba(11,143,168,0.28); border-radius:var(--radius); color:var(--ink); background:rgba(255,255,255,0.75); text-decoration:none; font-weight:800; box-shadow:0 8px 20px rgba(15,74,88,0.08) }
.qr-link-primary{ color:#fff; background:linear-gradient(90deg, var(--accent), #39b8c8); border-color:transparent; box-shadow:0 12px 28px rgba(11,143,168,0.22) }
.qr-link:active{ transform:translateY(1px) }

/* Simple Lightbox */
.simple-lightbox{ position:fixed; inset:0; background:rgba(18,52,61,0.92); z-index:9999; display:flex; align-items:center; justify-content:center; opacity:0; transition:opacity 0.3s ease }
.simple-lightbox.active{ opacity:1 }
.simple-lightbox-content{ position:relative; max-width:90vw; max-height:90vh; padding:20px }
.simple-lightbox-content img{ max-width:100%; max-height:90vh; display:block; border-radius:8px }
.simple-lightbox-close{ position:absolute; top:0; right:0; background:rgba(0,0,0,0.7); color:var(--ink); font-size:40px; width:50px; height:50px; border-radius:50%; cursor:pointer; display:flex; align-items:center; justify-content:center; line-height:1; transition:all 0.2s ease; border:none }
.simple-lightbox-close:hover{ background:rgba(0,0,0,0.9); transform:scale(1.1) }

@media print{
  body{ background:#fff; color:#001923; padding:0 }
  body::before,
  .site-header,
  .page-actions,
  .lead-panel,
  article.card > *:not(.partner-print-sheet){ display:none !important }
  .shell,
  .container,
  .card{ width:auto; max-width:none; margin:0; padding:0; border:0; box-shadow:none; background:#fff; backdrop-filter:none; color:#001923; overflow:visible }
  .partner-print-sheet{ display:block !important; margin:0; padding:0.35in; border:0; background:#fff; color:#001923; box-shadow:none }
  .partner-print-sheet *,
  .partner-print-sheet h1,
  .partner-print-sheet h2,
  .partner-print-sheet h3{ color:#001923 !important; -webkit-text-fill-color:#001923 !important; background:none !important; box-shadow:none !important }
  .partner-print-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px }
  .partner-print-item{ border:1px solid #9fbecb; padding:10px; background:#fff }
  .partner-print-sheet a{ color:#001923 !important }
  .partner-print-sheet p,
  .partner-print-sheet li{ font-size:12px; line-height:1.35; margin-bottom:7px }
  .partner-print-sheet .lede{ font-size:14px }
}

@media(max-width:720px){ 
  .gallery-swiper{ aspect-ratio:4/3 }
  .gallery-swiper .swiper-button-prev,
  .gallery-swiper .swiper-button-next{ width:44px; height:44px }
  .gallery-swiper .gallery-nav-caret{ font-size:30px }
  .simple-lightbox-close{ font-size:32px; width:44px; height:44px }
}

/* Event Styles */
.event-featured{ display:grid; gap:30px; margin-bottom:30px }
.event-flyer{ display:flex; justify-content:center }
.event-flyer picture{ display:block; max-width:100% }
.event-flyer img{ max-width:100%; height:auto; border-radius:12px; border:1px solid var(--line); box-shadow:0 12px 28px rgba(15,74,88,0.14) }
.event-details h2{ margin-top:0; font-size:28px }
.event-details h3{ color:var(--ink-dim); font-weight:400; font-size:20px; margin-top:-8px }
.event-details h4{ color:var(--accent); margin-top:24px; margin-bottom:12px; font-size:18px }
.event-meta{ background:rgba(255,255,255,0.72); padding:16px; border-radius:8px; border:1px solid var(--line); margin:20px 0 }
.event-meta p{ margin:8px 0 }
.event-register{ display:inline-block; margin:20px 0; font-size:16px }

@media(min-width:900px){ 
  .event-featured{ grid-template-columns:1fr 1.5fr; align-items:start }
  .event-flyer picture{ max-width:400px; position:sticky; top:80px }
  .event-flyer img{ max-width:100% }
}
