/* Flackton daylight palette — approved 20 September 2026. */
:root {
  --ink: #fbfcfa;
  --ink-2: #f0f4f3;
  --ink-3: #e7efef;
  --ink2: #f0f4f3;
  --ink3: #e7efef;
  --ivory: #17384b;
  --ivory-dim: #465e6b;
  --ivory-faint: #546873;
  --gold: #805a28;
  --gold-soft: #795522;
  --gold2: #795522;
  --paper: #fbfcfa;
  --paper2: #eff3ef;
  --copy: #17384b;
  --muted: #465e6b;
  --hairline: #c8d5d8;
  --line: #c8d5d8;
  --darkline: #c8d5d8;
}
html { color-scheme: light; background: #fbfcfa; }
body { background: #fbfcfa; color: #17384b; }
body::after { opacity: .012; }

/* Dark framing is retained around photography and the brand mark. */
:is(nav, footer, header:not(.fhero), .fx-hero, .lightbox, .lxgrid, .slbar, #loader, .conversation, .legend, .quiet, .kym-stage, #fy-consent) {
  --ink: #17394f;
  --ink-2: #20475e;
  --ink-3: #2c566d;
  --ink2: #20475e;
  --ink3: #2c566d;
  --ivory: #fffdf7;
  --ivory-dim: #e2ebed;
  --ivory-faint: #cad9df;
  --gold: #e0c593;
  --gold-soft: #ead4af;
  --gold2: #ead4af;
  --line: #577587;
  --hairline: #577587;
  color: var(--ivory);
  color-scheme: dark;
}
header:not(.fhero), footer { background-color: #17394f; }
nav, .nav, nav.scrolled, .nav.scrolled { background: rgba(23,57,79,.97); }
nav::before, nav.scrolled::before { background: transparent; }
nav :is(a, summary), .nav :is(a, summary) { color: #edf3f4; }
nav .nav-cta, .nav .nav-cta { color: #ead4af !important; border-color: #ead4af; }
nav .nav-cta:hover, .nav .nav-cta:hover { background: #ead4af; color: #17384b !important; }
.nav-menu, .more-menu>div { background-color: #17394f; }
@media(max-width:1180px) { .nav-links { background: #17394f; } }
@media(min-width:1201px) { .nav-menu { background: transparent; } }

/* Let the daylight show, while shading the actual text area. */
.hero-overlay {
  background: linear-gradient(180deg,rgba(10,34,51,.12),rgba(10,34,51,.03) 25%,rgba(12,36,54,.54) 78%,#17394f),
    linear-gradient(90deg,rgba(9,32,48,.61),rgba(9,32,48,.33) 53%,transparent 88%);
}
.hero-media::after {
  background: linear-gradient(180deg,rgba(15,41,58,.08),rgba(15,41,58,.03) 28%,rgba(13,37,53,.66) 78%,#17394f),
    linear-gradient(90deg,rgba(12,35,51,.62),rgba(12,35,51,.25) 57%,transparent);
}
.yhero-media::after {
  background: linear-gradient(180deg,rgba(15,41,58,.08),transparent 38%,rgba(13,37,53,.73) 80%,#17394f);
}
.hero :is(h1,.hero-bottom>p), .hero-inner :is(h1,.hero-sub), .yhero-inner {
  text-shadow: 0 2px 12px rgba(6,22,34,.7);
}
.hero-bottom>p, .hero-sub { color: #fffdf7; }
.hero :is(.eyebrow,.film-control) { color: #f3dfb9; }
.fx-hero-scrim { background: linear-gradient(90deg,rgba(15,40,58,.91),rgba(15,40,58,.65) 40%,rgba(15,40,58,.08) 75%),linear-gradient(0deg,#17394f,transparent 60%); }

/* Light catalogue, editorial and detail pages follow the same palette. */
.section-dark, .home-selection { background: #f0f4f3; color: #17384b; }
.section-dark .eyebrow { color: #805a28; }
.proof { background: #eaf0f0; color: #17384b; }
.proof strong { color: #17384b; }
.proof span { color: #465e6b; }
.decision.active, .decision:hover, .decision:focus-visible { background: #e7efef; color: #17384b; }
.decision.active p, .decision:hover p, .decision:focus-visible p { color: #465e6b; }
.decision.active :is(b,span), .decision:hover :is(b,span), .decision:focus-visible :is(b,span) { color: #805a28; }
.yacht-meta small, .yacht-meta>p { color: #465e6b; }
.home-yacht-title>span { color: #465e6b; }
.home-yacht-link { color: #805a28; }
.yc, .sim, .ufs-card, .fbar, .ufs-bar, .ypanel, .enquire-band { background-color: #fff; border-color: #c8d5d8; }
.yc, .sim, .ypanel { box-shadow: 0 6px 24px rgba(23,56,75,.045); }
.ufs { background: #fbfcfa; color: #17384b; }
.ufs-controls { background: #f0f4f3; border-color: #c8d5d8; }
.ufs-card { color: #17384b; }
.ufs :is(label,.ufs-card small,.ufs-empty) { color: #465e6b; }
.ufs :is(input,select) { background: #fff; color: #17384b; border-color: #9baeb7; }
.ufs-count, .ufs-card em { color: #805a28; }
.ytabs { background: rgba(247,250,248,.97); border-color: #c8d5d8; }
.ytabs a { color: #465e6b; }
.ytabs a.on, .ytabs a:hover { color: #805a28; }

/* Button fills and controls need their own contrast on the lighter surfaces. */
:is(.btn-gold,.button-gold,.gal-viewall,.chip-new,.yvideo-play),
:is(.fseg button,.funits button,.pcur button,.path-toggle button).on {
  background: #e4c89c; border-color: #e4c89c; color: #17384b;
}
:is(.btn-gold,.button-gold):hover { background: #eedcbd; color: #17384b; }
.btn-ghost { color: var(--ivory); border-color: var(--hairline); }
.whatsapp, .fy-whatsapp { background: #e4c89c; color: #17384b; }
:is(input,select,textarea) { accent-color: #805a28; }
:is(input,textarea)::placeholder { color: #5a6c74; opacity: 1; }
:is(input,select,textarea):focus-visible { outline: 2px solid #805a28; outline-offset: 3px; }
:is(a,button,summary):focus-visible { outline: 2px solid #805a28; outline-offset: 4px; }
:is(nav,header,footer,.conversation) :focus-visible { outline-color: #f3dfb9; }
.gal-nav, .gal-count, .lx-arrow, .lightbox .lx, .lx-pos, .lx-toolbar button, .yc .fav, .yc .chip {
  color: #fffdf7; background: rgba(16,43,61,.88); border-color: #8097a2;
}
.yc .fav.on { color: #17384b; background: #e4c89c; }
.conversation { background: linear-gradient(120deg,#254d63,#17394f); }
.conversation .enquiry { background: #20475e; }
.conversation :is(.contact-copy>p:nth-of-type(2),.faqs p,.form-note,.form-status,.enquiry label) { color: #e2ebed; }
.conversation :is(input,select,textarea)::placeholder { color: #cad9df; }
footer :is(p,a), .footer-brand p { color: #e2ebed; }
.popular-listings { background: #f0f4f3; }
.fx-calc-sec { --ink: #17384b; }

@media(max-width:700px) {
  .hero-overlay, .hero-media::after {
    background: linear-gradient(180deg,rgba(12,36,54,.12),rgba(12,36,54,.48) 35%,rgba(12,36,54,.76) 76%,#17394f);
  }
  .fx-hero-scrim { background: linear-gradient(180deg,rgba(15,40,58,.14),rgba(15,40,58,.66) 45%,#17394f); }
}