/* Blue Bottom launch r3 additions: the hosted inquiry form frame, its fallback line and the privacy notice. */
.request-panel .inquiry-frame{display:block;width:100%;min-height:840px;margin:12px 0 0;border:0;border-radius:12px;background:#fff}
.request-panel .fallback{margin:10px 0 0;font-size:14px;color:#a9bcc8}
.request-panel .privacy a,.request-panel .fallback a{color:var(--pool-soft)}
.privacy-notice .wrap{max-width:820px}
.privacy-notice p{font-size:16px;line-height:1.6}
/* Combined revision r3 (2026-11-04). Mobile centering: up to 860px the hero figure has a 4:5 ratio and a 62svh height
   cap but no width, so the cap shrank its width through the ratio and left it flush left with a dark strip. A full
   width keeps it centred and filled; the cap still limits the height. */
@media (max-width:860px){.landing-hero figure{width:100%}}
/* The portrait blue-hour image: keep the pergola, seating and pool in the crop. */
.landing-hero figure img{object-position:50% 45%}
/* Top bar: the full request label at every width (no hidden short label); it wraps on narrow screens. */
.minimal-header .header-cta{white-space:normal;text-align:center;line-height:1.2}
@media (max-width:480px){.minimal-header .header-cta{font-size:14px;min-height:40px;padding:8px 14px;max-width:calc(100vw - 112px - 2 * var(--gutter) - 12px)}}
.footer-links a{display:inline;padding:0;color:#e1e9ee;text-decoration:underline;text-underline-offset:3px}
.policy h1{margin:0 0 6px}
.policy h2{margin:28px 0 8px;font-size:clamp(22px,3vw,28px)}
/* Navy, blue, white and restrained gold (Kevin, 2026-11-04; colours drawn from the supplied Navy working-uniform
   reference, used as palette inspiration only). The R2.1 styles.css stays byte-identical: its variables are redefined
   here, and the few hard-coded colours on these pages are overridden. Contrast is measured in tests/site-checks.cjs. */
:root{
  --night:#0a1a33;--deep:#10274a;--sea:#1d4778;--pool:#9dc0e6;--pool-soft:#cfe0f4;
  --sand:#eef3f9;--stone:#e2eaf4;--line:#c5d3e4;--ink:#0b1a33;--ink-2:#3a4a63;
  --gold:#d4ad43;--gold-deep:#a8841f;--cream:#ffffff;--mist:#c4d2e3;
  --shadow:0 24px 60px -24px rgba(10,26,51,.45);
}
body.landing{background:var(--sand)}
.minimal-header{background:rgba(10,26,51,.95)}
.button:hover{background:#e2c063}
.light :focus-visible,.paper :focus-visible{outline-color:#1d4778}
.landing-hero .copy p{color:#dce6f3}
.landing-hero .eyebrow{color:#c9d8ec}
.landing-hero .trust li{color:#d3deee}
.concierge{background:rgba(16,39,74,.7);border-color:rgba(255,255,255,.18);color:#e6eef8}
.media-label{background:rgba(10,26,51,.8);color:#f2f6fb}
.band.light .eyebrow,.band.paper .eyebrow{color:#2a5a92}
.band.light h2 em,.band.paper h2 em{color:#1d4778}
.band.light a:not(.button),.band.paper a:not(.button){color:#1d4778}
.faq summary::after{color:#1d4778}
.request-panel .form-intro{color:#d6e2f0}
.request-panel .privacy,.request-panel .fallback{color:#c2d1e4}
.request-panel .privacy a,.request-panel .fallback a{color:var(--pool-soft)}
/* The navy form panel sits inside a light band: keep its links light and its focus ring gold. */
.band .request-panel a:not(.button){color:var(--pool-soft)}
.band .request-panel :focus-visible{outline-color:var(--gold)}
.skip:focus-visible{outline-color:#0b1a33}
/* Customer testimonial (Firas issa's words from Blue Bottom's own site), navy with white text and a gold rule. */
.testimonial{background:var(--deep);color:#eef3fa}
.testimonial .eyebrow{color:#c9d8ec}
.testimonial h2{color:#fff}
.testimonial h2 em{color:var(--gold)}
.testimonial .quote{margin:0;max-width:68ch}
.testimonial blockquote{margin:0;padding:0 0 0 clamp(16px,3vw,28px);border-left:3px solid var(--gold)}
.testimonial blockquote p{color:#e6eef8;font-size:clamp(17px,1.6vw,19px);line-height:1.65;margin:0 0 14px}
.testimonial figcaption{margin:16px 0 0;color:#c9d8ec;font-size:15px}
.testimonial figcaption a{color:var(--pool-soft)}
footer{background:#071428;color:#c9d6e6}
footer .small{color:#b4c4d8}
.footer-links a{color:#eaf0f8}
/* Copy and spacing revision (2026-11-04). The logo band's artwork sits right of and above the centre of its canvas, so
   the figure is shifted back and the white band is padded evenly; the artwork itself is then centred. Measured on the
   first 1280 x 500 asset (13.5 px right, 1.5 px up: -1.0547%, .3%) and again on Kevin's supplied 1536 x 600 logo
   (2026-11-04: artwork x 171-1397, y 6-589, 16.5 px right, 2 px up: about -1.07%, .33%). The difference is at most
   0.2 CSS px at the band's 620 px, so the values are kept. The asset files are unchanged. */
.logo-band{padding:clamp(24px,3.5vw,44px) 0}
.logo-film{transform:translate(-1.0547%,.3%)}
/* Conversion and performance release (2026-11-04). The two photos are AVIF copies inside <picture> (the published WebPs
   are the fallback); the wrapper must not change layout, so the image still lays out as the figure's own child. */
.landing-hero figure picture,.proof-photo picture{display:contents}
/* The cost question sits just above the hero button. */
.landing-hero .cost-prompt{margin:18px 0 6px}
/* The new headline is longer than the old one. In the two-column hero the R2.1 size (7.4vw, up to 96 px) set it in five
   lines at 1280 px and pushed the button about 250 px lower, so those widths use a smaller size and it sets in four;
   phones and tablets (one column) keep the R2.1 size. "starts here." is held together with a non-breaking space. */
@media (min-width:861px){.landing-hero h1{font-size:clamp(44px,5.6vw,80px)}}
/* The proof sections now follow the hero, then the logo band, then the request form. Phones keep one rhythm, about
   72 px of visible space, at the four boundaries: the hero's trust lines to the evening image, the Contact button to
   the testimonial, the attribution to the logo artwork, and the logo artwork to the request section. */
@media (max-width:600px){
  /* Hero copy on phones: lead, Seon's card, the cost question, the button and the trust lines 18 px apart. */
  .landing-hero .lead{margin-bottom:0}
  .landing-hero .concierge{margin:18px 0 0}
  .landing-hero .cost-prompt{margin:18px 0 0}
  .landing-hero .actions{margin-top:18px}
  .landing-hero .trust{margin-top:18px}
  .landing-hero .copy{padding-bottom:28px}
  .band.light[aria-labelledby="fiberglass-title"]{padding-top:44px;padding-bottom:36px}
  .band.testimonial{padding-top:36px;padding-bottom:46px}
  .band.paper#request{padding-top:46px}
  /* Bottom of the page on phones (Kevin's correction, 2026-11-04): less pale-blue space after the last FAQ divider and
     a tighter navy footer (top and bottom padding, and the gaps between its paragraphs, the links row and Meta ad
     choices). The words, links, behaviour, line height and the disclosure's tap target are unchanged; the bottom padding
     adds the device's safe area. */
  .band.light.faq{padding-bottom:32px}
  footer{padding:28px 0 calc(24px + env(safe-area-inset-bottom, 0px))}
  footer .wrap > .small{margin:10px 0 0}
  footer .wrap > .small:first-child{margin-top:0}
  footer .wrap > .ad-choices{margin-top:8px}
}
