/* Bold-lettering variation — layered over styles-brand.css.
   One idea: every title becomes heavy geometric caps, and the Yellowtail
   script is the only soft thing left. Content untouched. */

:root{--display:"Poppins",system-ui,sans-serif;
/* one ratio for the whole design: Yellowtail's x-height is small, so the
   script needs this much size to read level with Poppins 800 caps */
/* Measured at 100px: Poppins 800 cap = 70.5 above the baseline, Yellowtail
   x-height = 44.4 and its ascender = 71.4. The matching length is the
   x-height, not the ascender: 70.5/44.4 = 1.588, so the body of the script
   ('u', 'e', 'o') stands exactly as tall as the caps and the ascenders
   overshoot, as script next to caps should. */
--script-up:1.588;--script-lift:.03em;
/* against a serif title, where there is no cap-height gap to close */
--script-serif:1.14}

/* ── script accent: bigger, so the contrast reads as intent ── */
.s{font-family:var(--script);font-weight:400;text-transform:none;letter-spacing:0;font-size:calc(1em * var(--script-up));line-height:.6;vertical-align:var(--script-lift)}

/* ── labels, kickers, buttons, nav ── */
.cap,.kicker,.btn,.ghost,.nav a,.burger,.sk-foot .lbl,.spec .cap{font-family:var(--display);font-weight:600}
.cap,.kicker{letter-spacing:.2em}
.btn{font-weight:700;letter-spacing:.14em}
.nav a{font-weight:600;letter-spacing:.1em;text-transform:uppercase;font-size:11.5px}
.nav a.btn{text-transform:uppercase}

/* ── hero photograph, zoomed out: no parallax overscan, taller frame ── */
.hero{min-height:min(100vh,1180px);min-height:min(100dvh,1180px)}
/* full bleed, and as much of the frame as a full-bleed crop allows:
   the hero is as tall as the viewport permits, so the least is lost */
.hero-img{top:0;height:100%;object-fit:cover!important;object-position:center 44%!important}

/* ── hero: the anchor of the whole idea ── */
.hero-in{padding-bottom:104px}
.hero h1{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:clamp(46px,8.4vw,124px);line-height:.86;letter-spacing:-.025em;max-width:none;margin:0;text-shadow:0 4px 40px rgba(19,42,59,.45)}
.hero h1 .hs{display:block;height:auto;width:clamp(272px,41vw,618px);margin:0 0 -.22em -.01em;position:relative;z-index:2;vertical-align:baseline;filter:drop-shadow(0 6px 30px rgba(19,42,59,.42))}
.hero h1 .hero-w{display:block;line-height:.86;position:relative;z-index:1}
.hero h1::before{content:"";display:none}
.head h2::after,.gal-head h2::after,.custom-copy h2::after,.closer-in h2::before,.closer-in h2::after{content:none;display:none}
.hero-btns{margin-top:38px}

/* ── section titles ── */
.head h2,.custom-copy h2,.boat-copy h2,.ab-head h1,.ab-h2,.faq-head h2,.faq-split>div>h2{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:-.02em;line-height:.98}
.head h2{font-size:clamp(30px,3.6vw,52px);max-width:14em}
.custom-copy h2{font-size:clamp(28px,3.4vw,48px)}
.gal-head h2{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:-.02em;line-height:.98}
.cx-up .head h2 .s{color:var(--orange)}

/* ── photo band and closer ── */
.band-row{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:-.01em;line-height:.9;font-size:clamp(32px,6.2vw,90px)}
.band-row em{font-family:var(--display);font-style:italic;font-weight:800;text-transform:uppercase;letter-spacing:-.01em;font-size:1em}
.closer-in h2{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:clamp(34px,5.4vw,80px);line-height:.98;letter-spacing:-.025em;max-width:none;white-space:nowrap}
.closer-in h2 .s{margin-left:.06em}

/* ── cards and carousel ── */
.card-body h3,.cx-item h3,.cx-up .cx-item h3{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.cx-item h3{font-size:16px;line-height:1.3}
.cx-up .cx-item h3{font-size:16px}
.card-body h3{font-size:22px;line-height:1.2}
.cx-price,.spec strong,.sk-stat strong,.sk-toggle-label strong{font-family:var(--display);font-weight:700;letter-spacing:-.01em}
.spec strong,.sk-stat strong{font-size:21px}

/* ── the one-word script marks stay script, just tighter ── */
.card-word,.sk-foot .word{font-family:var(--script)}

/* ── more bold elements: numbers and hairlines that carry weight ── */
.kicker{font-size:11px}
.specs{border-top:4px solid var(--ink);padding-top:6px;margin-top:36px;column-gap:40px}
.spec{flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:4px;padding:20px 0 18px}
.spec:nth-child(even){padding-left:0}
.spec .cap{font-size:9.5px;letter-spacing:.22em}
.spec strong{font-size:clamp(24px,2.5vw,34px);line-height:1;text-align:left;margin-top:0;display:block}

/* the boat: heading stacked, three lines, script on its own ── */
#boat .split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center}
.boat-copy h2{font-size:clamp(28px,3.2vw,46px);max-width:none;margin-top:16px;display:flex;flex-direction:column;align-items:flex-start;line-height:.94;font-weight:400}
.boat-copy h2 .s{line-height:.84;margin:.06em 0 .02em}
.boat-copy>p{margin-top:22px;font-size:17.5px;max-width:30em}
.spec strong{white-space:normal;font-size:clamp(21px,2.1vw,28px)}
.sk-stat strong{font-size:clamp(22px,2.4vw,30px);line-height:1}
.cx-price{font-size:19px}
.cx-item h3{padding-bottom:0;border-bottom:0}
.btn{border-width:2px}
.band-row{gap:clamp(56px,17vw,320px)}
.closer-in h2::before{content:none}

@media(max-width:760px){
.closer-in h2{white-space:normal;font-size:clamp(30px,9vw,46px)}
.hero h1{font-size:clamp(38px,12vw,62px)}
.hero h1 .hs{width:min(72vw,260px)}
.hero h1::before{width:150px;height:5px;margin-bottom:20px}
}

.faq-split>div>h2{font-size:clamp(30px,3.6vw,52px)}

/* hero dots read as a tight set, not three separate marks */
.hero-dots{gap:0;margin-left:-8px}
.hero-dot{width:26px;height:30px}
