:root{--bg:#fff;--ink:#222;--mute:rgba(0,0,0,.6);--line:rgba(0,0,0,.14);--hh:84px;
--font:'Helvetica Neue',Helvetica,Arial,sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:300 17px/1.65 var(--font);-webkit-font-smoothing:antialiased}
a{color:inherit}
img,video,iframe{max-width:100%}
/* header */
.top{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.96);border-bottom:1px solid rgba(0,0,0,.08);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 16px;padding:10px 16px;min-height:var(--hh)}
.brand{font-weight:400;text-decoration:none;font-size:18px;letter-spacing:.01em}
.top nav{display:flex;gap:6px 18px;align-items:center;flex-wrap:wrap;font-weight:400;font-size:15px}
.top nav a{text-decoration:none;opacity:.9}
.top nav a:hover{opacity:1;text-decoration:underline}
.btn{display:inline-block;background:#1a1a1a;color:#fff;font:400 16px/1 var(--font);padding:13px 24px;border-radius:999px;text-decoration:none;border:0;cursor:pointer;white-space:nowrap}
.top nav a.btn{opacity:1;padding:10px 18px;font-size:15px;color:#fff}
.top nav a.btn:hover{text-decoration:none;background:#000}
.btn-lg{font-size:18px;padding:16px 32px}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.btn-wrap{text-align:center;margin:28px 0}
@media (max-width:700px){.top{padding:8px 14px;--hh:92px}.top nav{width:100%;justify-content:space-between;gap:8px}.top nav a.btn{order:0}}
/* hero: the DJI drone clip is 9:16 PORTRAIT as shot (2160x3840 displayed). Full frame, never cropped (box has the clip's own ratio, object-fit:contain). */
.hero{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#05080c var(--ww-drone-poster-jpg) center/cover no-repeat;--hh2:var(--hh,64px);--h:max(calc(100vh - var(--hh2)),520px);height:var(--h)}
@supports (height:100svh){.hero{--h:max(calc(100svh - var(--hh2)),520px)}}
/* ambient fill: a tiny live copy of the SAME video, heavily blurred and dimmed, only behind the side areas. The foreground clip is untouched. */
.hero::before{content:"";position:absolute;inset:-60px;background:inherit;filter:blur(46px) brightness(.5) saturate(.9);z-index:0}
.hero canvas.ambient{position:absolute;inset:-60px;width:calc(100% + 120px);height:calc(100% + 120px);filter:blur(46px) brightness(.5) saturate(.9);z-index:0}
.drone-wrap{position:relative;z-index:1;height:min(var(--h),calc(100vw*16/9));aspect-ratio:9/16;max-width:100%;background:transparent}
video.clip{display:block;width:100%;height:100%;object-fit:contain;background:#000}
.hero-text,.chapter-title{position:absolute;left:0;right:0;text-align:center;padding:0 20px;text-shadow:0 1px 14px rgba(0,0,0,.45);pointer-events:none}
.hero-text{top:22%;transform:translateY(-50%)}
.hero-text a{pointer-events:auto}
.hero-text h1{font-weight:300;font-size:clamp(38px,10vw,76px);line-height:1.05;margin:0 0 14px;letter-spacing:-.01em}
.hero-text .tag{font-size:clamp(17px,4.6vw,24px);margin:0 0 6px;font-weight:300}
.hero-text .btn-wrap{margin:22px 0 0}
.hero-text .btn{text-shadow:none}
.press-strip{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 36px;padding:20px 18px;border-bottom:1px solid var(--line);text-align:center;font-size:15px}
.press-strip p{margin:0}
.press-strip a{text-decoration:none;border-bottom:1px solid var(--line)}
/* chapters */
.chapter{position:relative;display:flex;justify-content:center;background:var(--bg)}
.chapter-clips{display:flex;flex-direction:column;width:100%;gap:0}
.cc{aspect-ratio:9/16;width:100%;background:#000}
.chapter-title{top:calc(50vw*16/9);transform:translateY(-50%);font-weight:300;font-size:clamp(34px,9vw,64px);line-height:1.08;margin:0}
@media (min-width:900px){
 .chapter-clips{flex-direction:row;justify-content:center;gap:6px;width:auto;height:min(calc(100svh - var(--hh)),calc((100vw - 12px)*16/18))}
 .chapter-clips.n1{height:min(calc(100svh - var(--hh)),calc(100vw*16/9))}
 .chapter-clips.n3{height:min(calc(100svh - var(--hh)),calc((100vw - 12px)*16/27))}
 .cc{height:100%;width:auto}
 .chapter-title{top:50%}
 .hero-text h1{font-size:clamp(40px,3.6vw,56px)}
 .chapter-title{font-size:clamp(40px,3.6vw,56px)}
}
.chapter.c1 .chapter-title{top:calc(28vw*16/9)}
@media (min-width:900px){.chapter.c1 .chapter-title{top:28%}}
/* prose */
.prose{max-width:760px;margin:0 auto;padding:54px 22px 30px}
.prose h1,.prose h2,.prose h3,.prose h4{font-weight:300;line-height:1.2;margin:2.1em 0 .6em}
.prose h1{font-size:40px}.prose h2{font-size:34px}.prose h3{font-size:28px}.prose h4{font-size:21px;font-weight:400}
.prose>:first-child{margin-top:0}
.prose p{margin:0 0 1.1em}
.prose h4 a,.prose a{text-underline-offset:3px}
.prose strong{font-weight:400}
.prose ul,.prose ol{padding-left:1.2em}
.prose.page .btn,.prose .btn-wrap .btn{color:#fff;text-decoration:none}
.fh-embed{background:#fff;color:#1a1a1a;border:1px solid rgba(0,0,0,.14);border-radius:10px;padding:14px;margin:26px 0;min-height:120px;overflow:hidden}
.fh-embed *{font-family:var(--font)}
.yt{aspect-ratio:16/9;margin:24px 0}.yt iframe{width:100%;height:100%;border:0}
.p-press .prose p a{word-break:break-word}
/* reviews */
.reviews{max-width:1100px;margin:0 auto;padding:30px 22px;columns:1;column-gap:44px;border-top:1px solid var(--line)}
@media (min-width:760px){.reviews{columns:2}}@media (min-width:1100px){.reviews{columns:3}}
.rev{break-inside:avoid;margin:0 0 30px;padding-bottom:26px;border-bottom:1px solid var(--line)}
.rev .posted::before{content:"★★★★★";color:#d9a400;letter-spacing:.1em;font-size:15px}
.rev figcaption{font-weight:400;font-size:15px;margin-top:2px}
.rev blockquote{margin:6px 0 0;font-size:16px;line-height:1.55}
/* forms */
.nf{margin:26px 0}.nf .field{margin:0 0 16px}.nf label{display:block;font-size:15px;margin-bottom:6px;font-weight:400}
.nf input,.nf textarea{width:100%;font:300 16px var(--font);padding:12px 14px;background:transparent;color:#222;border:1px solid rgba(0,0,0,.3);border-radius:8px}
.nf .req{color:#b07d00}.nf .req-note{font-size:14px;color:var(--mute)}
.sample-note{font-size:13px;color:var(--mute)}
/* footer */
.foot{border-top:1px solid var(--line);margin-top:40px;padding:34px 18px 48px;text-align:center}
.foot-cta{margin:0 0 22px}
.foot-nav{display:flex;flex-wrap:wrap;gap:6px 20px;justify-content:center;font-size:15px;margin-bottom:18px}
.foot-nav a{text-decoration:none;opacity:.85}.foot-nav a:hover{text-decoration:underline;opacity:1}
.copy{font-size:14px;color:var(--mute);margin:0 0 4px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Home hero: header overlays the video (no separate bar); thin white Helvetica with a soft top gradient. */
@media (min-width:900px){
.p-index .top{position:absolute;left:0;right:0;top:0;background:linear-gradient(to bottom,rgba(0,0,0,.25),rgba(0,0,0,0));text-shadow:0 1px 8px rgba(0,0,0,.5);z-index:30;padding:14px 22px 30px}
.p-index .top .brand,.p-index .top nav{font-weight:300}
.p-index .top nav a.btn{font-weight:300;text-shadow:none}
.p-index .hero{--hh2:0px}
}
/* DESKTOP ONLY, plain min-width:900px: the portrait clip fills the full width edge to edge (no side fill); site.js moves it vertically every frame so the
   boat's measured centre is the hero centre, trimming only what the screen cannot hold. No viewport-height/aspect conditions. Without JS the top of the frame shows. */
@media (min-width:900px){
 .hero.hero-drone{display:block;height:100vh;height:100svh;min-height:520px;background:#000}
 .hero.hero-drone::before,.hero.hero-drone canvas.ambient{display:none}
 .hero-drone .drone-wrap{position:absolute;top:0;right:0;bottom:0;left:0;width:auto;height:auto;max-width:none;aspect-ratio:auto}
 .hero-drone video.drone{position:absolute;left:0;top:0;width:100%;height:auto;max-width:none;object-fit:fill}
 .hero-drone .hero-text{z-index:3;top:auto;bottom:0;left:0;right:0;padding:110px 36px 26px;background:linear-gradient(to top,rgba(0,0,0,.24),rgba(0,0,0,0));transform:none;display:grid;grid-template-columns:1fr auto;align-items:end;text-align:left;text-shadow:0 1px 6px rgba(0,0,0,.65),0 2px 22px rgba(0,0,0,.6)}
 .hero-drone .hero-text h1{grid-column:1;grid-row:1;font-size:clamp(30px,2.8vw,44px);margin:0;line-height:1.05}
 .hero-drone .hero-text .tag{grid-column:1;grid-row:2;font-size:clamp(17px,1.4vw,22px);margin:6px 0 0}
 .hero-drone .hero-text .btn-wrap{margin:0;grid-column:2;grid-row:1/3;align-self:end}
}
/* Scroll-story moments (DESKTOP ONLY; display:none below 900px so mobile layout and weight are unchanged). */
.moment{display:none}
.media-head{max-width:1100px;margin:0 auto;padding:46px 22px 18px;text-align:center}
.media-head h1{font-weight:300;font-size:clamp(34px,6vw,56px);margin:0 0 6px;line-height:1.1}
.media-head p{margin:0;color:var(--mute);font-size:18px}
.media-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;padding:8px 6px 0;max-width:1500px;margin:0 auto}
.mcard{aspect-ratio:9/16;background:#05080c;overflow:hidden}
.mcard video.clip{width:100%;height:100%;object-fit:contain}
@media (min-width:700px){.media-grid{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1100px){.media-grid{grid-template-columns:repeat(4,1fr)}}
@media (min-width:900px){
 .moment{display:flex;position:relative;align-items:center;justify-content:center;overflow:hidden;background:#05080c;--mh:100vh;height:var(--mh);min-height:520px}
 @supports (height:100svh){.moment{--mh:100svh}}
 .moment canvas.amb{position:absolute;top:-60px;left:-60px;width:calc(100% + 120px);height:calc(100% + 120px);filter:blur(46px) brightness(.45) saturate(.9);z-index:0}
 .moment-clips{position:relative;z-index:1;display:flex;justify-content:center;gap:6px;height:var(--mh)}
 .moment-clips.n1{height:min(var(--mh),calc(100vw*16/9))}
 .moment-clips.n2{height:min(var(--mh),calc((100vw - 6px)*16/18))}
 .moment-clips.n4{height:min(var(--mh),calc((100vw - 18px)*16/36))}
 .moment-clips.n3{height:min(var(--mh),calc((100vw - 12px)*16/27))}
 .moment .mc{height:100%;aspect-ratio:9/16;background:#000}
 .moment .mc video.clip{width:100%;height:100%;object-fit:contain}
 .moment-line{position:absolute;z-index:3;left:0;right:0;bottom:0;margin:0;padding:90px 36px 40px;text-align:center;font-weight:300;font-size:clamp(22px,2.2vw,34px);letter-spacing:.005em;line-height:1.2;background:linear-gradient(to top,rgba(0,0,0,.22),rgba(0,0,0,0));text-shadow:0 1px 8px rgba(0,0,0,.6);pointer-events:none}
}
/* DESKTOP ONLY: press strip made prominent (same wording, thin Helvetica) */
@media (min-width:900px){
 .press-strip{flex-direction:column;align-items:center;gap:22px;padding:64px 36px 68px}
 .press-strip p{font-weight:300;font-size:clamp(26px,2.6vw,40px);line-height:1.25;letter-spacing:-.005em;max-width:1200px}
 .press-strip a{border-bottom:1px solid rgba(0,0,0,.35);padding-bottom:2px}
 .press-strip a:hover{border-bottom-color:#000}
}

/* Buy Tickets at the bottom of every video row / scroll-story moment (DESKTOP ONLY) */
.row-cta{display:none}
@media (min-width:900px){
 .row-cta{display:block;position:absolute;z-index:4;left:0;right:0;bottom:34px;margin:0;text-align:center;pointer-events:none}
 .row-cta .btn{pointer-events:auto;box-shadow:0 2px 16px rgba(0,0,0,.35)}
 .chapter:has(.row-cta)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:150px;background:linear-gradient(to top,rgba(0,0,0,.14),rgba(0,0,0,0));z-index:3;pointer-events:none}
 .moment-line{bottom:0;padding:90px 36px 104px;background:linear-gradient(to top,rgba(0,0,0,.22),rgba(0,0,0,0))}
}

/* Sailboat footage behind the 'built in 2002' text block (DESKTOP ONLY; on phones the section is just the original article, no clips, nothing loaded) */
.sail canvas.amb,.sail-clips,.sail-shade{display:none}
.prose.sail-a{padding-bottom:0}
.prose.sail-b{padding-top:0}
.prose.sail-b>h3:first-child{margin-top:2.1em}
@media (min-width:900px){
 .sail{position:relative;overflow:hidden;background:#05080c;--mh:100vh;min-height:var(--mh);display:flex;align-items:center;justify-content:center}
 @supports (height:100svh){.sail{--mh:100svh}}
 .sail canvas.amb{display:block;position:absolute;top:-60px;left:-60px;width:calc(100% + 120px);height:calc(100% + 120px);filter:blur(46px) brightness(.45);z-index:0}
 .sail-clips{display:flex;position:absolute;top:0;right:0;bottom:0;left:0;justify-content:center;align-items:center;gap:6px;z-index:1}
 .sail-clips .mc{height:min(100%,calc((100vw - 12px)*16/27));aspect-ratio:9/16;background:#000}
 .sail-clips video.clip{width:100%;height:100%;object-fit:contain}
 .sail-shade{display:block;position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;background:linear-gradient(to bottom,rgba(0,0,0,.16),rgba(0,0,0,.24) 35%,rgba(0,0,0,.24) 65%,rgba(0,0,0,.16));pointer-events:none}
 .prose.sail-a{position:relative;z-index:3;padding:110px 22px 110px;color:#fff;font-weight:300;text-shadow:0 1px 3px rgba(0,0,0,.8),0 2px 24px rgba(0,0,0,.75)}
 .prose.sail-a p{font-size:19px;line-height:1.7}
 .prose.sail-b{padding-top:54px}
}

/* Desktop header: the nav "Buy Tickets" is a plain nav link like Home / FAQ / Media (no white pill) - Whitetail 26 Oct 2:30 PM; phones unchanged */
@media (min-width:900px){
 .top nav a.btn,.top nav a.btn-tix{background:none;color:inherit;border:0;border-radius:0;box-shadow:none;padding:0;font-size:15px;opacity:.9;text-decoration:none}
 .top nav a.btn:hover,.top nav a.btn-tix:hover{background:none;opacity:1;text-decoration:underline}
}

/* Press strip: phones keep it under the hero (.ps-m); desktop shows it under the 'Immaculate Vibes and Perfect Views' section (.ps-d) instead */
.press-strip.ps-d{display:none}
@media (min-width:900px){.press-strip.ps-m{display:none}.press-strip.ps-d{display:flex;background:#fff;border-bottom:0;border-top:0;padding:30px 18px;position:relative;z-index:5}}

/* Desktop: Gothamist quote directly below the hero video (.ps-h); phones keep the original strip under the hero (.ps-m) */
.press-strip.ps-h{display:none}
@media (min-width:900px){.press-strip.ps-h{display:flex;background:#fff;border-bottom:0;padding:34px 18px;font-size:clamp(22px,2.2vw,34px);font-weight:300}.press-strip.ps-h a{border-bottom:1px solid rgba(0,0,0,.35)}}

/* Night group flows straight out of the Skyline row (Whitetail 26 Oct 3:50 PM): no empty bands above/below the 4 clips, same page background, no gradient seam */
@media (min-width:900px){
 .moment.mn4{height:auto;min-height:0;align-items:flex-start;padding-bottom:0;background:var(--bg)}
 .moment.mn4 canvas.amb{display:none}
 .moment.mn4 .moment-clips{height:min(var(--mh),calc((100vw - 18px)*16/36))}
 .moment.mn4 .moment-line{bottom:0;padding:120px 36px 44px;background:linear-gradient(to top,rgba(0,0,0,.22),rgba(0,0,0,0));text-shadow:0 1px 3px rgba(0,0,0,.7),0 2px 24px rgba(0,0,0,.7)}
}

/* FAQ page (desktop only): sticky full-bleed sailboat-style video backgrounds behind each group of questions. Phones: plain text exactly as before (no clips loaded). */
.fq-clips,.fq-amb{display:none}
.fq .prose.fq-a{padding-top:0;padding-bottom:0}
.fq1 .prose.fq-a{padding-top:54px}
.fq4 .prose.fq-a{padding-bottom:30px}
.fq:not(.fq1) .prose.fq-a>h3:first-child,.fq:not(.fq1) .prose.fq-a>h4:first-child{margin-top:2.1em}
@media (min-width:900px){
 .p-faq .fq{position:relative;overflow:clip;background:#05080c;--mh:100vh;min-height:var(--mh)}
 @supports (height:100svh){.p-faq .fq{--mh:100svh}}
  .p-faq .fq{--rh:min(var(--mh),calc((100vw - 18px)*16/var(--sum,27)))}
 .p-faq .fq-amb{display:block;position:sticky;top:0;height:var(--mh);margin-bottom:calc(-1 * var(--mh));z-index:0;overflow:hidden}
 .p-faq .fq-amb::after{content:"";position:absolute;inset:0;z-index:2;background:rgba(0,0,0,.58);pointer-events:none}
 .p-faq .fq-clips{display:flex;position:sticky;top:0;height:var(--rh);margin-bottom:calc(-1 * var(--rh));z-index:0;justify-content:center;align-items:center;overflow:hidden}
 .p-faq .fq-amb canvas.amb{position:absolute;top:-60px;left:-60px;width:calc(100% + 120px);height:calc(100% + 120px);filter:blur(46px) brightness(.45) saturate(.9);z-index:0}
 .p-faq .fq-row{position:relative;z-index:1;display:flex;gap:6px;justify-content:center;height:var(--rh)}
 .p-faq .fq-clips.n2 .fq-row{--n:2}.p-faq .fq-clips.n3 .fq-row{--n:3}
 .p-faq .fq-row .mc{height:100%;aspect-ratio:9/16;background:#000}
 .p-faq .fq-row .mc.ph{aspect-ratio:3/4}
 .p-faq .fq-row .mc.ph img{display:block;width:100%;height:100%;object-fit:contain}
 .p-faq .fq-row video.clip{width:100%;height:100%;object-fit:contain}
 .p-faq .fq-clips::after{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(to bottom,rgba(0,0,0,.58),rgba(0,0,0,.62) 40%,rgba(0,0,0,.62) 60%,rgba(0,0,0,.58));pointer-events:none}
 .p-faq .prose.fq-a{position:relative;z-index:3;color:#fff;font-weight:300;text-shadow:0 1px 3px rgba(0,0,0,.85),0 2px 26px rgba(0,0,0,.8);padding-left:22px;padding-right:22px}
 .p-faq .fq1 .prose.fq-a{padding-top:130px}
 .p-faq .fq .prose.fq-a{padding-bottom:110px}
 .p-faq .fq4 .prose.fq-a{padding-bottom:130px}
 .p-faq .prose.fq-a p{font-size:19px;line-height:1.7}
 .p-faq .prose.fq-a h3,.p-faq .prose.fq-a h4,.p-faq .prose.fq-a strong{font-weight:300}
 .p-faq .prose.fq-a a:not(.btn){color:#fff}
}

/* Heading above the Google reviews (Whitetail 26 Oct 4:35 PM): thin white sans like the other section headings; phones and desktop */
.rev-title{font-weight:300;font-size:clamp(26px,3vw,40px);line-height:1.2;text-align:center;margin:0;padding:48px 22px 14px;color:var(--ink);max-width:900px;margin-left:auto;margin-right:auto}

/* FAQ header (desktop): nav overlaid on the first background video like the Home page top row (no solid bar) */
@media (min-width:900px){
 .p-faq .top{position:absolute;left:0;right:0;top:0;background:linear-gradient(to bottom,rgba(0,0,0,.45),rgba(0,0,0,0));text-shadow:0 1px 8px rgba(0,0,0,.5);z-index:30;padding:14px 22px 30px}
 .p-faq .top .brand,.p-faq .top nav{font-weight:300}
 .p-faq .top nav a.btn{font-weight:300;text-shadow:none}
}

/* WHITE PAGE (Whitetail 26 Oct): page background is white like willywall.com; text dark; thin Helvetica kept. Text that sits on top of video stays white. */
.prose p,.prose li{color:#444}
.prose h1,.prose h2,.prose h3,.prose h4{color:#111}
.hero,.hero-text,.chapter-title,.moment{color:#fff}
@media (min-width:900px){.sail,.p-faq .fq{color:#fff}}
.hero-text .btn,.row-cta .btn{background:#fff;color:#0b1620}
.hero-text .btn:hover,.row-cta .btn:hover{background:#e9eef2}
@media (min-width:900px){
 .p-index .top,.p-faq .top{color:#fff;border-bottom:0}
 .top nav a.btn,.top nav a.btn-tix{color:inherit}
 .p-faq .prose.fq-a h3,.p-faq .prose.fq-a h4,.p-faq .prose.fq-a p,.p-faq .prose.fq-a li{color:#fff}
 .prose.sail-a h3,.prose.sail-a h4,.prose.sail-a p,.prose.sail-a li{color:#fff}
}

/* FAQ header polish (desktop, Whitetail 26 Oct 5 PM): the nav sits INSIDE the first media row (brand and links no longer straddle the clip edges), over a full-width top shade, no bar */
@media (min-width:900px){
 .p-faq .top{background:linear-gradient(to bottom,rgba(0,0,0,.62),rgba(0,0,0,.28) 55%,rgba(0,0,0,0));min-height:0;padding:16px 22px 56px;gap:0 16px;flex-wrap:nowrap;--rw:calc(min(100vh,(100vw - 18px)*16/18)*9/16*2 + 6px)}
 .p-faq:has(.fq1 .fq-clips.n2) .top{padding-left:max(22px,calc((100vw - var(--rw))/2 + 18px));padding-right:max(22px,calc((100vw - var(--rw))/2 + 18px))}
 .p-faq .top .brand{font-size:17px;white-space:nowrap}
 .p-faq .top nav{flex-wrap:nowrap;gap:0 20px;font-size:14px}
 .p-faq .top nav a{opacity:1;line-height:1.2;display:inline-block;text-shadow:0 1px 6px rgba(0,0,0,.55)}
}

/* WHITE moments (Whitetail 26 Oct 5:22 PM): the scroll-story rows sit on the white page - no dark panel or blurred fill around the clips; caption overlay stays on the video */
@media (min-width:900px){
 .moment{background:var(--bg);height:auto;min-height:0}
 .moment canvas.amb{display:none}
}

/* FAQ desktop (Whitetail 26 Oct 5:24 PM): the three photos are the only media - a fixed full-width row at the very top edge, all FAQ text scrolls over them; nav overlaid like home */
@media (min-width:900px){
 .p-faq .fq1 .prose.fq-a{padding-top:150px}
 .p-faq .fq .prose.fq-a{padding-bottom:140px}
 .p-faq .fq-amb::after{background:rgba(0,0,0,.6)}
}

/* LEGIBILITY v2 (Whitetail 26 Oct 6:24 PM, pt141u) - DESKTOP ONLY. Scrims cut to a faint (<=24% black) short strip right at the text; the work is done by a soft multi-layer text-shadow. No bands behind titles. Clips untouched. */
@media (min-width:900px){
 .chapter-title{text-shadow:0 0 2px rgba(0,0,0,.55),0 0 8px rgba(0,0,0,.5),0 0 22px rgba(0,0,0,.5),0 2px 44px rgba(0,0,0,.45)}
 .moment-line,.moment.mn4 .moment-line{text-shadow:0 0 2px rgba(0,0,0,.55),0 0 8px rgba(0,0,0,.5),0 0 22px rgba(0,0,0,.5),0 2px 44px rgba(0,0,0,.45)}
 .p-index .top{text-shadow:0 0 2px rgba(0,0,0,.75),0 0 5px rgba(0,0,0,.7),0 0 12px rgba(0,0,0,.6),0 0 26px rgba(0,0,0,.5)}
 .p-index .top .brand,.p-index .top nav,.p-index .top nav a{font-weight:400}
 .hero-drone .hero-text{text-shadow:0 0 2px rgba(0,0,0,.55),0 0 8px rgba(0,0,0,.5),0 0 22px rgba(0,0,0,.5),0 2px 40px rgba(0,0,0,.4)}
 .prose.sail-a{text-shadow:0 0 2px rgba(0,0,0,.6),0 0 8px rgba(0,0,0,.55),0 0 22px rgba(0,0,0,.55),0 2px 40px rgba(0,0,0,.5)}
}

/* MEDIA page (desktop, Whitetail 26 Oct 6:27 PM): like Home and FAQ - no header bar; the clip grid starts at the very top edge and the nav (brand left, links + Buy Tickets right) is overlaid on it with the same light treatment (faint short top scrim + soft multi-layer text-shadow). Clips untouched. The 'Media' heading block moves below the grid. Phones unchanged. */
@media (min-width:900px){
 .p-media .top{position:absolute;left:0;right:0;top:0;background:linear-gradient(to bottom,rgba(0,0,0,.42),rgba(0,0,0,.3) 50%,rgba(0,0,0,0));border-bottom:0;color:#fff;z-index:30;padding:14px 22px 30px;text-shadow:0 0 2px rgba(0,0,0,.75),0 0 5px rgba(0,0,0,.7),0 0 12px rgba(0,0,0,.6),0 0 26px rgba(0,0,0,.5)}
 .p-media .top .brand,.p-media .top nav,.p-media .top nav a{font-weight:400}
 .p-media .top nav a.btn{text-shadow:inherit}
 .p-media main{display:flex;flex-direction:column}
 .p-media .media-grid{padding-top:0}
 .p-media .media-head{order:2}
}

/* Third clip of the Prime Views row (IMG_1757) is desktop only; phones keep the two-clip row exactly as before */
.cc-d{display:none}
@media (min-width:900px){.cc-d{display:block}}

/* No-bars fixes (Whitetail 26 Oct 7:25 PM): every tile has the shape of its clip - nothing is cropped, zoomed or letterboxed */
.mcard.n34{aspect-ratio:3/4;align-self:center;background:transparent}
@media (min-width:900px){
 /* sailboat band: tiles keep their full 9:16 height (width/3 * 16/9) and the band is exactly that tall, so no dark bar above/below or beside them */
 .sail{--tile:calc((100vw - 12px)*16/27);min-height:var(--tile)}
 .sail-clips .mc{height:var(--tile)}
 .prose.sail-a{padding-top:24px;padding-bottom:24px}
}

/* CONTACT page (Whitetail 26 Oct 8:26 PM): no media at all and no header bar - a clean plain top: same nav items and type, dark text on white, no bar background or border, not sticky, brand left / links right (phones: same stacked nav as the other pages, without the bar). */
.p-contact .top{position:static;background:none;border-bottom:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}

/* SOFT LETTERING GLOWS (Whitetail 26 Oct 8:26 PM, DESKTOP ONLY; re-tuned 27 Oct): a very soft, feathered, low-opacity dark glow sits right behind each white text block over video (nav brand + links, hero tagline, chapter titles, moment captions, sailboat paragraphs). Radial fall-off to 0 plus a blur - no band, no box, no hard edge. Video stays fully visible. Phones: the extra <span class="gl"> is display:inline with no styling (layout/colour neutral). --gk is a test multiplier (1 = base). */
@media (min-width:900px){
 .gl{position:relative;display:inline-block;isolation:isolate}
 .gl::before{content:"";position:absolute;z-index:-1;left:-1.2em;right:-1.2em;top:-.6em;bottom:-.6em;background:radial-gradient(closest-side,rgba(0,0,0,calc(var(--ga,.30)*var(--gk,1))) 0%,rgba(0,0,0,calc(var(--ga,.30)*.7*var(--gk,1))) 50%,rgba(0,0,0,0) 100%);filter:blur(14px);pointer-events:none}
 .p-index .top .brand,.p-index .top nav{position:relative;isolation:isolate}
 .p-index .top .brand::before,.p-index .top nav::before{--g:var(--gn,.34);content:"";position:absolute;z-index:-1;left:-22px;right:-22px;top:-16px;bottom:-16px;background:radial-gradient(closest-side,rgba(0,0,0,calc(var(--g)*var(--gk,1))) 0%,rgba(0,0,0,calc(var(--g)*.7*var(--gk,1))) 50%,rgba(0,0,0,0) 100%);filter:blur(10px);pointer-events:none}
 .p-index .top .brand::before{--g:var(--gb,.17)}
 .hero-drone .hero-text::before{content:"";position:absolute;z-index:-1;left:0;bottom:0;width:min(62%,880px);height:230px;background:radial-gradient(ellipse 50% 50% at 34% 62%,rgba(0,0,0,calc(var(--gh,.36)*var(--gk,1))) 0%,rgba(0,0,0,calc(var(--gh,.36)*.72*var(--gk,1))) 50%,rgba(0,0,0,0) 100%);filter:blur(16px);pointer-events:none}
 .prose.sail-a::before{content:"";position:absolute;z-index:-1;left:-90px;right:-90px;top:-10px;bottom:-10px;background:radial-gradient(closest-side,rgba(0,0,0,calc(var(--gs,.28)*var(--gk,1))) 0%,rgba(0,0,0,calc(var(--gs,.28)*.78*var(--gk,1))) 60%,rgba(0,0,0,0) 100%);filter:blur(34px);pointer-events:none}
}
@media (min-width:900px){ .p-index .top{text-shadow:0 0 2px rgba(0,0,0,.9),0 0 4px rgba(0,0,0,.85),0 0 8px rgba(0,0,0,.8),0 0 14px rgba(0,0,0,.65),0 0 28px rgba(0,0,0,.5)} }

/* GLOW RE-TUNE (Whitetail 27 Oct 10:25 AM): lightest backing per block that still meets the contrast target, measured worst-case over 24 video frames (tools/legib_tune.py). Targets: nav links 3:1; chapter titles 4.5:1; sailboat body text 4.5:1. Hero tagline and the two moment captions already clear 4.5:1 with text-shadow alone, so they get NO glow. */
@media (min-width:900px){
 .p-index .top{--gn:.51;--gb:.255}
 .prose.sail-a{--gs:.084}
 .hero-drone .hero-text::before{display:none}
 .moment .gl::before{display:none}
 .chapter.c1 .gl,.chapter:not(.c1) .gl{--ga:.24}
 .chapter.c1 ~ .chapter ~ .chapter .gl{--ga:.20}
}

/* mobile only: sections show just their first clip; the rest are desktop-only and never requested on phones */
@media (max-width:899.98px){.cc-m{display:none}}

/* MOBILE ONLY (Whitetail 27 Oct): (1) only 3 reviews on phones; (2) the history/sailboat text block gets ONE of the desktop sailboat clips as its background (full 9:16 frame, section as tall as the frame so no bars), white text with a light text-shadow */
@media (max-width:899.98px){
 .rev-m{display:none}
 .sail{position:relative;overflow:clip;background:#05080c;min-height:calc(100vw*16/9);display:flex;align-items:center;color:#fff}
 .sail canvas.amb{display:block;position:absolute;top:-60px;left:-60px;width:calc(100% + 120px);height:calc(100% + 120px);filter:blur(46px) brightness(.45);z-index:0}
 .sail-clips{display:flex;position:absolute;top:0;right:0;bottom:0;left:0;justify-content:center;align-items:center;z-index:1}
 .sail-clips .mc{display:none;background:#000}
 .sail-clips .mc.mc-pick{display:block;width:100%;max-height:100%;aspect-ratio:9/16}
 .sail-clips video.clip{display:block;width:100%;height:100%;object-fit:contain}
 .prose.sail-a>:first-child{margin-top:0}.prose.sail-a>:last-child{margin-bottom:0}
 .prose.sail-a{position:relative;z-index:3;width:100%;padding:10px 22px;color:#fff;font-weight:300;text-shadow:0 0 2px rgba(0,0,0,.6),0 0 8px rgba(0,0,0,.55),0 0 22px rgba(0,0,0,.55),0 2px 40px rgba(0,0,0,.5)}
 .prose.sail-a h3,.prose.sail-a h4,.prose.sail-a p,.prose.sail-a li{color:#fff}
 .prose.sail-a::before{content:"";position:absolute;z-index:-1;left:-24px;right:-24px;top:-6px;bottom:-6px;background:rgba(0,0,0,var(--mgs,.14));filter:blur(22px);pointer-events:none}
}

/* MOBILE ONLY (Whitetail 27 Oct 2:28 PM): (1) the history clip is faded (opacity over the dark section backdrop) so the white text reads easier; (2) drone hero fills the full width edge to edge (no side borders): the clip is scaled to the screen width and moved vertically by site.js so the boat stays in view; the clip's own ratio is kept (nothing is stretched), only top/bottom may be cropped on short screens */
@media (max-width:899.98px){
 .sail-clips .mc.mc-pick video.clip{opacity:var(--mvo,.6)}
 .hero.hero-drone .drone-wrap{position:absolute;top:0;right:0;bottom:0;left:0;width:auto;height:auto;max-width:none;aspect-ratio:auto}
 .hero-drone video.drone{position:absolute;left:0;top:0;width:100%;height:auto;max-width:none;object-fit:fill}
}

/* MOBILE ONLY (Whitetail 27 Oct 6:51 PM): the FAQ background on phones is ONE still (drone frame at 185 s, full 9:16 frame, fitted to the width, no crop/zoom) fixed behind the text, faded like the History-of-the-Willy-Wall video: reduced opacity over the dark backdrop, with a dimmed blurred copy of the same frame filling the rest of the screen. White text with a light text-shadow. Phones never request the three guest photos (desktop keeps them). */
@media (max-width:899.98px){
 .p-faq .fq1{position:relative;overflow:clip;--mh:100vh}
 @supports (height:100lvh){.p-faq .fq1{--mh:100lvh}}
 .p-faq .fq1 .fq-clips{display:block;position:sticky;top:0;height:calc(var(--mh) + 64px);margin-bottom:calc(-1 * (var(--mh) + 64px));z-index:0;overflow:hidden;background:#05080c;pointer-events:none}
 .p-faq .fq1 .fq-row{display:none}
 .p-faq .fq1 .fq-clips::before{content:"";position:absolute;inset:-60px;background:var(--ww-mbg-faq-185-jpg) center/cover no-repeat,url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD//gAQTGF2YzYxLjE5LjEwMQD/2wBDABIMDRANCxIQDhAUExIVGywdGxgYGzYnKSAsQDlEQz85Pj1HUGZXR0thTT0+WXlaYWltcnNyRVV9hnxvhWZwcm7/2wBDARMUFBsXGzQdHTRuST5Jbm5ubm5ubm5ubm5ubm5ubm5ubm5ubm5ubm5ubm5ubm5ubm5ubm5ubm5ubm5ubm5ubm7/wAARCAArABgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwBuygJVwQ+1L5IUZbAHvXo86OLlZUEdFXxB7UUvaIOVmSt/OflDnd2IpymfaNrluOzZJNR6Vew20pLxoxwcl+RitW4vbSWIkWkDZXAKr/hXFKSudkVoZguHACr8hU8kf1oqpdyK92xhHlp/cyflOTxzRVpIhtmcrndnNSm7fgbjwMdaqk0tZFk4k5zmioVJoqrisf/Z) center/cover no-repeat;filter:blur(46px) brightness(.45) saturate(.9);z-index:0}
 .p-faq .fq1 .fq-clips::after{content:"";position:absolute;left:0;right:0;top:calc(50% - 32px);height:calc(100vw*16/9);transform:translateY(-50%);background:var(--ww-mbg-faq-185-jpg) center/100% 100% no-repeat,url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD//gAQTGF2YzYxLjE5LjEwMQD/2wBDABIMDRANCxIQDhAUExIVGywdGxgYGzYnKSAsQDlEQz85Pj1HUGZXR0thTT0+WXlaYWltcnNyRVV9hnxvhWZwcm7/2wBDARMUFBsXGzQdHTRuST5Jbm5ubm5ubm5ubm5ubm5ubm5ubm5ubm5ubm5ubm5ubm5ubm5ubm5ubm5ubm5ubm5ubm7/wAARCAArABgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwBuygJVwQ+1L5IUZbAHvXo86OLlZUEdFXxB7UUvaIOVmSt/OflDnd2IpymfaNrluOzZJNR6Vew20pLxoxwcl+RitW4vbSWIkWkDZXAKr/hXFKSudkVoZguHACr8hU8kf1oqpdyK92xhHlp/cyflOTxzRVpIhtmcrndnNSm7fgbjwMdaqk0tZFk4k5zmioVJoqrisf/Z) center/100% 100% no-repeat;opacity:var(--fo,.35);z-index:1}
 .p-faq .fq1 .prose.fq-a{position:relative;z-index:4;color:#fff;font-weight:300;text-shadow:0 0 2px rgba(0,0,0,.55),0 1px 6px rgba(0,0,0,.5),0 2px 24px rgba(0,0,0,.45)}
 .p-faq .fq1 .prose.fq-a h3,.p-faq .fq1 .prose.fq-a h4,.p-faq .fq1 .prose.fq-a p,.p-faq .fq1 .prose.fq-a li,.p-faq .fq1 .prose.fq-a strong,.p-faq .fq1 .prose.fq-a a:not(.btn){color:#fff}
 .p-faq .fq1 .prose.fq-a h3,.p-faq .fq1 .prose.fq-a h4,.p-faq .fq1 .prose.fq-a strong{font-weight:300}
}

/* Whitetail 29 Oct 2:32 PM: the top-right "Buy Tickets" is a plain nav link exactly like Home / FAQ / Media / Contact on every page and width (same colour, weight, size, opacity, shadow; no pill) */
html body .top nav a.btn.btn-tix{background:none;color:inherit;border:0;border-radius:0;box-shadow:none;padding:0;margin:0;min-height:0;font:inherit;letter-spacing:inherit;text-transform:none;text-decoration:none;line-height:inherit;opacity:.9;text-shadow:inherit}
html body .top nav a.btn.btn-tix:hover{background:none;text-decoration:underline}
@media (min-width:900px){ html body.p-faq .top nav a.btn.btn-tix{opacity:1;line-height:1.2;display:inline-block;text-shadow:0 1px 6px rgba(0,0,0,.55)} }

/* Site helper chat bubble (Whitetail 29 Oct 6:53 PM): small corner bubble, thin sans, white panel / dark bubble; answers only with text from the site's own pages */
.ww-chat{position:fixed;right:18px;bottom:18px;z-index:9999;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:300;color:#222}
.ww-chat-bubble{width:54px;height:54px;border-radius:50%;border:0;background:#1a1a1a;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 18px rgba(0,0,0,.28);padding:0}
.ww-chat-bubble:hover{background:#000}
.ww-chat.ww-open .ww-chat-bubble{display:none}
.ww-chat-panel{position:absolute;right:0;bottom:0;width:340px;max-width:calc(100vw - 24px);height:min(500px,calc(100vh - 110px));background:#fff;border-radius:14px;box-shadow:0 10px 40px rgba(0,0,0,.25);display:flex;flex-direction:column;overflow:hidden}
.ww-chat-panel[hidden]{display:none}
.ww-chat-head{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#1a1a1a;color:#fff;font-size:16px;font-weight:300}
.ww-chat-x{background:none;border:0;color:#fff;font-size:24px;line-height:1;cursor:pointer;padding:0 2px;font-weight:300}
.ww-chat-log{flex:1;overflow-y:auto;padding:14px 14px 6px;font-size:14.5px;line-height:1.45}
.ww-m{margin:0 0 10px;max-width:92%;padding:9px 12px;border-radius:12px;word-wrap:break-word}
.ww-m p{margin:0 0 6px}.ww-m p:last-child{margin:0}
.ww-bot{background:#f2f2f2;color:#222}
.ww-me{background:#1a1a1a;color:#fff;margin-left:auto;width:fit-content}
.ww-q{font-weight:400}
.ww-m a{color:#222;text-decoration:underline}
.ww-also{font-size:13px;color:#555}
.ww-link{background:none;border:0;padding:0;font:inherit;color:#222;text-decoration:underline;cursor:pointer;text-align:left}
.ww-chat-chips{display:flex;flex-wrap:wrap;gap:6px;padding:4px 14px 8px}
.ww-chat-chips button{border:1px solid #ccc;background:#fff;border-radius:16px;padding:5px 10px;font:inherit;font-size:13px;color:#222;cursor:pointer}
.ww-chat-chips button:hover{border-color:#222}
.ww-chat-form{display:flex;border-top:1px solid #e6e6e6}
.ww-chat-form input{flex:1;border:0;padding:12px 14px;font:inherit;font-size:16px;color:#222;outline:none;min-width:0}
.ww-chat-form button{border:0;background:none;padding:0 16px;font:inherit;font-size:15px;color:#222;cursor:pointer;font-weight:400}
@media (max-width:599.98px){.ww-chat{right:12px;bottom:12px}.ww-chat-bubble{width:50px;height:50px}.ww-chat-panel{position:fixed;left:8px;right:8px;bottom:8px;width:auto;max-width:none;height:min(72vh,520px)}}
.ww-form{display:flex;flex-direction:column;gap:8px;max-width:100%;width:100%;box-sizing:border-box}
.ww-form label{display:flex;flex-direction:column;gap:3px;font-size:13px;color:#444}
.ww-form input,.ww-form textarea{font:inherit;font-size:16px;color:#222;border:1px solid #ccc;border-radius:8px;padding:7px 9px;background:#fff;resize:vertical;box-sizing:border-box;width:100%}
.ww-form .ww-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.ww-wc{float:right;font-size:12px;color:#777}.ww-wc.ww-over{color:#b00020}
.ww-err{color:#b00020;font-size:13px;margin:0}.ww-err:empty{display:none}
.ww-send{border:0;background:#1a1a1a;color:#fff;border-radius:18px;padding:9px 14px;font:inherit;font-size:14px;cursor:pointer}
.ww-send[disabled]{opacity:.6}

/* Footer email-list signup (Whitetail 29 Oct 7:35 PM): thin sans, white page, dark pill button like Buy Tickets */
.ww-signup{max-width:560px;margin:0 auto 24px;font-weight:300}
.ww-su-h{margin:0 0 10px;font-size:16px}
.ww-su-row{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.ww-signup input{font:inherit;font-size:16px;color:#222;border:1px solid #ccc;border-radius:22px;padding:9px 14px;background:#fff;min-width:0;flex:1 1 150px;max-width:220px}
.ww-signup button{font:inherit;font-size:15px;border:0;border-radius:22px;background:#1a1a1a;color:#fff;padding:9px 20px;cursor:pointer}
.ww-signup button[disabled]{opacity:.6}
.ww-signup .ww-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.ww-su-msg{margin:8px 0 0;font-size:14px;min-height:1em}
@media (max-width:599.98px){.ww-signup input{max-width:none;flex-basis:100%}.ww-signup button{width:100%}}

/* WordPress: keep the sticky header below the admin bar for logged-in editors */
body.admin-bar .top{top:32px}@media (max-width:782px){body.admin-bar .top{top:46px}}
