/* O-Town Finder palette (Orlando, Florida).
   Taken from the official O-Town marks: a rose-to-coral glossy pin, a gold arc and a lagoon-blue center.
   Light: warm Florida sand background, deep lagoon ink. Dark: night-lake teal-black.
   Contrast (WCAG 2.x, computed 2026-10-30):
     light  accent #BE3449 with white text 5.56:1, as text on --bg 5.21:1, on --bg-2 4.82:1; --muted on --bg 5.51:1
     dark   accent #FF8F86 as text on --bg 8.42:1, on --surface 7.43:1; button text #1A0E10 on accent 8.55:1, on --accent-d 6.66:1
   Headings use Bricolage Grotesque (SIL OFL 1.1), self-hosted from assets/fonts/ (CSP font-src self). */

@font-face {
  font-family: "Bricolage Grotesque";
  src: url("../fonts/bricolage-grotesque-latin-wght.woff2") format("woff2");
  font-weight: 200 800; font-style: normal; font-display: swap;
}

:root {
  --accent: #BE3449;
  --accent-d: #9E2A3C;
  --accent-soft: rgba(190, 52, 73, .09);
  --on-accent: #FFFFFF;
  --ink: #13202A;
  --ink2: #26343E;
  --muted: #5A6670;
  --faint: #8A939A;
  --line: #E7DFD3;
  --line-2: #F0E9DF;
  --bg: #FBF7F1;
  --bg-2: #F4EDE3;
  --surface: #FFFFFF;
  --navy: #0F6B6B;               /* lagoon teal: focus ring, second chart series */
  --gold: #E3A044;
  --lagoon: #7FD8D0;
  --chrome: linear-gradient(180deg, #FFFDF9 0%, #F3E9DC 55%, #E2D3C1 100%);
  --glass: rgba(255, 252, 247, .64);
  --glass-strong: rgba(255, 252, 247, .86);
  --glass-b: rgba(255, 255, 255, .85);
  --display: "Bricolage Grotesque", var(--sans);
}

:root[data-theme="dark"] {
  --accent: #FF8F86;
  --accent-d: #F27272;
  --accent-soft: rgba(255, 143, 134, .14);
  --on-accent: #1A0E10;
  --ink: #F4EFE8;
  --ink2: #DCD5CC;
  --muted: #A3ADB3;
  --faint: #7E888E;
  --line: #26323A;
  --line-2: #1F2A31;
  --bg: #0E1418;
  --bg-2: #141C21;
  --surface: #172126;
  --navy: #6FD3CB;
  --glass: rgba(23, 33, 38, .64);
  --glass-strong: rgba(23, 33, 38, .88);
  --glass-b: rgba(255, 255, 255, .10);
}

/* Display type: the wordmark is a heavy grotesque, so headings follow it. Accent words keep the core serif italic. */
h1, h2, .brand-name { font-family: var(--display); }
h1 { letter-spacing: -.03em; }
.brand-name { font-weight: 800; letter-spacing: -.025em; }

/* Text and marks that sit on the accent. The core hard-codes white, which fails AA on the light dark-mode coral. */
.btn-primary, .btn-primary:hover { color: var(--on-accent); }
.btn-primary { box-shadow: 0 8px 20px -8px rgba(190, 52, 73, .5); }
:root[data-theme="dark"] .btn-primary { box-shadow: 0 8px 22px -10px rgba(255, 143, 134, .45); }
::selection { color: var(--on-accent); }
:root .iv-stepper li.current .n,
:root .mk-state.on .mk-state-ab,
:root .pd-stage.st-live .pd-stage-dot,
:root .sol-nav a[aria-current="page"] .ico,
:root .price-card .ribbon .badge,
:root .ops-pv-btn,
:root .inv .side a.nav-i .count { color: var(--on-accent); }

/* Core colors that are hard-coded to the 3FS crimson. */
.side a.nav-i[aria-current="page"] { background: linear-gradient(90deg, rgba(190, 52, 73, .40), rgba(190, 52, 73, .10)); box-shadow: inset 2px 0 0 #FF8F86; }
.side a.nav-i .count { background: #9E2A3C; color: #fff; }
.pd-hero .badge.accent, .prop-media .badges .badge.accent { background: #9E2A3C; color: #fff; }
.checklist li::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23BE3449' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E"); }
:root[data-theme="dark"] .checklist li::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FF8F86' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E"); }
.chrome-edge::after { background: linear-gradient(140deg, rgba(255,255,255,.95), rgba(227,160,68,.35) 40%, rgba(190,52,73,.35)); }
.ambient::before { background: radial-gradient(closest-side, rgba(236, 106, 140, .16), transparent 70%); }
.ambient::after { background: radial-gradient(closest-side, rgba(127, 216, 208, .18), transparent 70%); }
.cta-band::after { background: linear-gradient(100deg, rgba(110, 24, 40, .92) 0%, rgba(176, 52, 64, .74) 45%, rgba(14, 20, 24, .25) 100%); }
.brand-media .emblem { box-shadow: 0 40px 90px -30px rgba(190, 52, 73, .45); }
.aside-photo.emblem-photo { box-shadow: 0 30px 70px -30px rgba(190, 52, 73, .40); }

/* Footer: night-lake teal-black with a thin sunset rule. */
.site-foot { background: #0B1216; border-top: 3px solid #EE7A3E; border-image: linear-gradient(90deg, #EC6A8C, #EE7A3E 55%, #E3A044) 1; }
.foot-legal { border-top-color: #1E2A31; }

/* ---------- Back office: liquid glass (O-Town only; body.app without .inv) ----------
   Kevan 2026-10-30: "a little more liquid glass ... shinier". Glass needs color behind it, so the work area gets soft
   rose, gold and lagoon glows; panels become frosted white glass with a top highlight and a diagonal sheen; the sidebar
   becomes night-lake glass instead of flat black. Text colors are unchanged (ink on near-white glass). */
body.app:not(.inv) {
  background:
    radial-gradient(900px 520px at 12% -6%, rgba(236, 106, 140, .20), transparent 62%),
    radial-gradient(820px 520px at 96% 4%, rgba(127, 216, 208, .26), transparent 60%),
    radial-gradient(760px 560px at 60% 108%, rgba(227, 160, 68, .18), transparent 62%),
    linear-gradient(180deg, #FBF6EF 0%, #F6EEE4 100%);
  background-attachment: fixed;
}
body.app:not(.inv) .side {
  background:
    linear-gradient(160deg, rgba(255, 255, 255, .07) 0%, rgba(255, 255, 255, 0) 32%),
    radial-gradient(420px 300px at 0% 0%, rgba(236, 106, 140, .22), transparent 70%),
    radial-gradient(380px 320px at 100% 100%, rgba(127, 216, 208, .16), transparent 70%),
    linear-gradient(180deg, #10262E 0%, #0C1B21 55%, #0F1117 100%);
  border-right: 1px solid rgba(127, 216, 208, .16);
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, .05), 8px 0 30px -18px rgba(15, 38, 46, .5);
}
body.app:not(.inv) .side a.nav-i:hover { background: rgba(255, 255, 255, .07); }
body.app:not(.inv) .side a.nav-i[aria-current="page"] {
  background: linear-gradient(90deg, rgba(236, 106, 140, .42), rgba(190, 52, 73, .16) 70%, rgba(190, 52, 73, .04));
  box-shadow: inset 2px 0 0 #FF8F86, inset 0 1px 0 rgba(255, 255, 255, .14);
}
body.app:not(.inv) .topbar {
  background: linear-gradient(180deg, rgba(255, 253, 249, .72), rgba(255, 250, 243, .52));
  border-bottom: 1px solid rgba(255, 255, 255, .8);
  box-shadow: 0 1px 0 rgba(190, 52, 73, .06), 0 10px 30px -22px rgba(19, 32, 42, .35);
}
body.app:not(.inv) .panel {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .62) 0%, rgba(255, 255, 255, 0) 42%),
    linear-gradient(180deg, rgba(255, 255, 255, .80), rgba(255, 251, 246, .62));
  border: 1px solid rgba(255, 255, 255, .85);
  -webkit-backdrop-filter: blur(22px) saturate(180%); backdrop-filter: blur(22px) saturate(180%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .95), inset 0 -1px 0 rgba(190, 52, 73, .05),
    0 2px 6px rgba(19, 32, 42, .05), 0 18px 40px -18px rgba(19, 32, 42, .22);
}
body.app:not(.inv) .panel-head { border-bottom-color: rgba(231, 223, 211, .7); }
body.app:not(.inv) .panel.stat {
  background:
    linear-gradient(90deg, #EC6A8C, #E3A044 55%, #7FD8D0) top / 100% 3px no-repeat,
    linear-gradient(135deg, rgba(255, 255, 255, .7) 0%, rgba(255, 255, 255, 0) 45%),
    linear-gradient(180deg, rgba(255, 255, 255, .84), rgba(255, 251, 246, .62));
}
body.app:not(.inv) .btn-primary {
  background: linear-gradient(180deg, #D4495E 0%, #BE3449 55%, #A82D40 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 10px 22px -10px rgba(190, 52, 73, .6);
}
body.app:not(.inv) .btn-primary:hover { background: linear-gradient(180deg, #C83F54 0%, #A82D40 100%); }

:root[data-theme="dark"] body.app:not(.inv) {
  background:
    radial-gradient(900px 520px at 12% -6%, rgba(236, 106, 140, .16), transparent 62%),
    radial-gradient(820px 520px at 96% 4%, rgba(127, 216, 208, .14), transparent 60%),
    linear-gradient(180deg, #0E1418 0%, #0B1115 100%);
  background-attachment: fixed;
}
:root[data-theme="dark"] body.app:not(.inv) .topbar { background: rgba(14, 20, 24, .66); border-bottom-color: rgba(255, 255, 255, .08); }
:root[data-theme="dark"] body.app:not(.inv) .panel {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .07) 0%, rgba(255, 255, 255, 0) 42%),
    rgba(23, 33, 38, .62);
  border-color: rgba(255, 255, 255, .09);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 18px 40px -18px rgba(0, 0, 0, .6);
}
:root[data-theme="dark"] body.app:not(.inv) .panel.stat {
  background:
    linear-gradient(90deg, #EC6A8C, #E3A044 55%, #7FD8D0) top / 100% 3px no-repeat,
    linear-gradient(135deg, rgba(255, 255, 255, .08) 0%, rgba(255, 255, 255, 0) 45%),
    rgba(23, 33, 38, .66);
}
:root[data-theme="dark"] body.app:not(.inv) .btn-primary { background: linear-gradient(180deg, #FF9F97 0%, #FF8F86 55%, #F27272 100%); }