/* client_custom.css - post-launch tweaks only. Loaded AFTER tidewater-global.css on every page.
   tidewater-global.css is regenerated whenever skill 6 Phase 6A re-runs; this file is not. Keep it short. */

/* Skill 8 M2 (2026-10-22): the mobile header's quote button (40 px) and menu button (42 px) reach the
   44 px tap-target minimum. Header height unchanged (measured at 360/390/430/768 in Chromium and WebKit). */
@media (max-width: 960px){.hdr__quote{min-height:44px}.hdr__burger{min-width:44px;min-height:44px}}

/* ===== Pre-launch QA 2026-10-28 (Ugi's confirmed rows; Amer go 2026-10-29). Styling only: no words change. ===== */

/* M-10/12/14/16/37/39: two-column sections start level (top-aligned instead of vertically centred) */
@media (min-width: 769px){.review__in,.split__in,.winter__in,.specials__in,.spec,.offer{align-items:start}
  .specials__in>div:first-child,.offer>div:first-child{padding-top:8px}}
/* M-9/13/17/18 (Ugi's alternative): the shorter, non-text column stays put while the text scrolls past it */
@media (min-width: 961px){
  .where__in>:last-child,.spec>:last-child,.review__in>.review__media{position:sticky;top:150px}
}
/* M-76: the two arrow links under the pricing copy sit side by side */
.price-split>div>.link-line{display:inline-block;margin-right:28px}

/* A-4: H1 on the lock's scale, clamp(34px,3.6vw,52px) (51.84 px at 1440, 34 px at 430) */
.hero--home h1{font-size:clamp(34px,3.6vw,52px)}
/* A-6: H2 in blog posts, cost guides and legal pages at the lock's 48 px on desktop (mobile stays on the lock's 30 px) */
@media (min-width: 769px){.post__body h2,.edge h2,.legal__body h2,.callout--slim h2{font-size:48px;line-height:1.1}}
/* A-1 + A-332: the mobile header's quote button at the lock's 16 px button size, in the label's own title case
   (no uppercase) with 10 px side padding, so the logo keeps 48 px at the QA's 430 px phone width */
@media (max-width: 960px){.hdr__quote{font-size:16px;letter-spacing:0;text-transform:none;padding:8px 10px}}
/* A-332: the mobile header logo at least 48 px tall */
@media (max-width: 420px){.hdr__logo img{max-height:48px}}
/* A-291..294: one coupon size on every page (the Specials page's) */
.ticket__big{font-size:clamp(56px,16vw,96px)}
.ticket__what{font-size:20px}

/* A-288/A-300: the homepage town chips take the outline button's size, border, radius and padding */
a.chip{font-size:16px;font-weight:600;min-height:52px;padding:14px 28px;border:2px solid var(--ink);border-radius:8px;color:var(--ink);transition:background-color .2s,border-color .2s,color .2s}
a.chip:hover{background:var(--blue);border-color:var(--blue);color:var(--white)}
a.chip:hover::before{color:var(--white)}
/* A-289/290/295..302: blog topic filters at 16 px, outline style (pressed: primary), with a 0.2 s hover */
.topic{font-size:16px;border:2px solid var(--blue);border-radius:8px;background:transparent;color:var(--blue);transition:background-color .2s,border-color .2s,color .2s}
.topic span{font-size:16px}
.topic:hover{background:var(--wash);border-color:var(--blue-h);color:var(--blue-h)}
.topic[aria-pressed="true"]{background:var(--blue);border-color:var(--blue);color:var(--white)}
.topic[aria-pressed="true"]:hover{background:var(--blue-h);border-color:var(--blue-h);color:var(--white)}

/* A-15..21/217: no heading, label or list item ends on one or two words; paragraphs wrap evenly
   (the inline script joins a paragraph's last three short words; the words themselves never change) */
h3,h4,h5,h6,li,dt,dd,figcaption,label,.btn,.eyebrow,.chip,.topic{text-wrap:balance}

/* M-6: the post-meta icons keep one width before and after the icon font loads, so the blog header
   no longer re-wraps (CLS 0.119-0.144 -> 0 on desktop) */
.post-meta i{display:inline-block;width:1.25em;text-align:center}

/* B-2 (revised 2026-10-29 after Cha's design QA: no empty band under the form): the load-time reservation
   matches the height GHL gives the form at each width (measured 2026-10-29, Chromium and WebKit agree within
   1 px), so the page barely moves while it loads; once form_embed.js sizes the iframe the reservation is
   released (L-197), so a later change to the form in GHL never leaves an empty band */
.ghl-form-embed,.ghl-form-embed iframe{min-height:754px}
@media (min-width: 769px) and (max-width: 1199px){.ghl-form-embed,.ghl-form-embed iframe{min-height:814px}}
@media (max-width: 768px){.ghl-form-embed,.ghl-form-embed iframe{min-height:600px}}
@media (max-width: 480px){.ghl-form-embed,.ghl-form-embed iframe{min-height:880px}}