/* Reference-inspired palette. Keep data, routing and calculations unchanged. */
:root {
    --navy: #074b59;
    --forest: #075e6e;
    --teal: #078798;
    --mint: #e3f2f1;
    --cream: #f8f6f2;
    --gold: #f3af48;
    --ink: #163c45;
    --muted: #5b7076;
    --line: #dae5e3;
    --brand-orange: #b96510;
    --brand-shadow: 0 12px 34px rgb(7 75 89 / 6%);
}

body.brand-theme {
    background: radial-gradient(ellipse at 0 650px, #fff0dc80, transparent 600px), var(--cream);
    -webkit-font-smoothing: antialiased;
}
.brand-theme h1, .brand-theme h2, .brand-theme h3 { letter-spacing: -.035em; }
.brand-theme a, .brand-theme button, .brand-theme input, .brand-theme select { -webkit-tap-highlight-color: transparent; }
.brand-theme :is(a, button, input, select):focus-visible { outline: 3px solid #047b8e; outline-offset: 4px; }
.brand-theme button { font-family: inherit; }
.brand-theme .topbar { background: #fffdf9; color: var(--navy); border-bottom: 1px solid #e0e8e5; }
.brand-theme .nav { min-height: 88px; gap: 20px; }
.brand-theme .brand { font-size: 25px; letter-spacing: .04em; gap: 13px; }
.brand-theme .logo { width: 46px; height: 46px; display: block; flex: none; border: 0; border-radius: 14px; background: transparent; }
.brand-theme .nav-link { color: #4d646a; border-radius: 9px; padding: 11px 16px; transition: background .18s, color .18s; }
.brand-theme .nav-link:hover { background: #e8f4f2; color: var(--navy); }
.brand-theme .nav-link.active { background: #e3f2f1; color: #056e80; box-shadow: inset 0 -2px #0f91a2; }
.brand-theme .nav-note { color: #65797f; font-size: 12px; padding-left: 18px; border-left: 1px solid #d2e1de; }

/* Airy, editorial hero with turquoise curves and warm gold accents. */
.brand-theme :is(.hero, .category-hero, .loan-hero) {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    color: var(--navy);
    background: radial-gradient(ellipse at 94% 110%, #fbd9a68c, transparent 45%), linear-gradient(110deg, #f8f6f2 50%, #edf4f0);
    border-bottom: 1px solid #e8e5dc;
}
.brand-theme :is(.hero, .category-hero, .loan-hero)::before {
    content: '';
    position: absolute;
    z-index: -1;
    pointer-events: none;
    width: 215px;
    height: 190px;
    top: -90px;
    left: -157px;
    border-radius: 0 0 110px 0;
    background: linear-gradient(140deg, #52bfca, #00778d);
    box-shadow: 21px 17px 0 #a5d4d8;
}
.brand-theme :is(.hero, .category-hero, .loan-hero)::after {
    content: '';
    position: absolute;
    z-index: -1;
    pointer-events: none;
    width: 380px;
    height: 380px;
    top: -210px;
    right: -130px;
    border: 1px solid #bed4d17a;
    border-radius: 50%;
    box-shadow: 0 0 0 23px #f8f6f2, 0 0 0 24px #bed4d14d, 0 0 0 49px #f8f6f2, 0 0 0 50px #bed4d133;
}
.brand-theme .hero { padding: 40px 0 78px; }
.home-hero-layout { display: grid; grid-template-columns: 1.12fr 1fr; gap: 30px; align-items: center; }
.home-hero-copy { padding: 10px 0 16px; min-width: 0; }
.home-hero-art { min-width: 0; }
.home-hero-art svg { width: 100%; height: auto; display: block; }
.brand-theme :is(.hero, .category-hero, .loan-hero) .eyebrow { color: #097d8d; font-size: 11px; letter-spacing: .17em; display: flex; align-items: center; gap: 10px; }
.eyebrow-line { width: 27px; height: 2px; background: #eaa540; }
.brand-theme .hero h1 { color: var(--navy); font-size: clamp(32px, 3.8vw, 50px); line-height: 1.45; margin: 18px 0; font-weight: 800; letter-spacing: -.045em; }
.hero-highlight { color: #078494; position: relative; white-space: nowrap; }
.hero-highlight::after { content: ''; position: absolute; bottom: -3px; height: 4px; border-radius: 50%; background: #f1bc67; left: 0; right: 0; }
.brand-theme :is(.hero, .category-hero, .loan-hero) p { color: #53696e; line-height: 1.9; font-size: 16px; }
.hero-benefits { display: flex; flex-wrap: wrap; gap: 15px; margin-top: 26px; }
.hero-benefits > span { display: inline-flex; align-items: center; gap: 7px; color: #36575e; font-size: 12px; font-weight: 600; }
.hero-benefits i { width: 28px; height: 28px; display: grid; place-items: center; font-style: normal; font-size: 15px; color: #087d8c; border: 1px solid #e7c795; border-radius: 50%; background: #fffdf6; }
.brand-theme .category-hero, .brand-theme .loan-hero { padding: 52px 0; }
.brand-theme :is(.category-hero, .loan-hero) h1 { color: var(--navy); font-size: clamp(30px, 4vw, 43px); margin: 14px 0; }

/* Shared cards and controls across all pages. */
.brand-theme :is(.panel, .record, .stat, .category-card, .map-shell, .rank-item) { border-color: var(--line); box-shadow: var(--brand-shadow); border-radius: 18px; background: #fffefb; }
.brand-theme :is(.record, .category-card):hover { border-color: #6dbdc6; box-shadow: 0 12px 26px #08596c12; }
.brand-theme :is(.section-head, .section-heading, .section-title) h2 { color: var(--navy); }
.brand-theme :is(.label, .badge, .back) { color: #077888; }
.brand-theme .badge { background: #e8f5f3; border: 1px solid #d4e9e5; border-radius: 6px; }
.brand-theme :is(.data-status, .recommended) { background: #e2f2ef; color: #086c72; }
.brand-theme :is(.field, .term-select, .tool-select, .per-page select, .input-unit input) { border-color: #d3e1de; background: #fffefa; border-radius: 9px; }
.brand-theme input::placeholder { color: #667b7e; opacity: 1; }
.brand-theme :is(.field, .term-select, .input-unit input):focus { border-color: #0c93a3; box-shadow: 0 0 0 3px #1398a21a; }
.brand-theme :is(.search-btn, .tool-btn.accent) { background: linear-gradient(120deg, #1198a8, #066c80); color: white; box-shadow: 0 4px 10px #08748821; }
.brand-theme :is(.search-btn, .tool-btn.accent):hover { background: #06596b; }
.brand-theme .search-wrap { margin-top: -43px; }
.brand-theme .search-card { border: 1px solid #d5e6e2; border-top: 4px solid #0e94a5; border-radius: 18px; padding: 10px; box-shadow: 0 14px 32px #0c596811; }
.brand-theme :is(.tabs, .type-switch, .map-tabs, .segment) { background: #eff4f1; }
.brand-theme :is(.tab.active, .type-switch a.active, .map-tab.active, .segment button.active) { color: #067386; background: #fffefb; box-shadow: 0 2px 8px #0d5d6810; }
.brand-theme .tab.active { box-shadow: inset 0 -3px #eeb15b, 0 2px 8px #0d5d680a; }
.brand-theme .stat { border-top: 2px solid #a6d2d4; }
.brand-theme .stat:nth-child(2) { border-top-color: #efb55f; }
.brand-theme .stat-value { color: #095868; }
.brand-theme .price strong { color: #b96910; }
.brand-theme .price small, .brand-theme .address { line-height: 1.7; }
.brand-theme .page.active { background: #087d90; border-color: #087d90; }

/* Feature panels: a smaller dose of saturated teal against warm whites. */
.brand-theme :is(.side-card, .map-side, .hero-price, .kpi.primary, .category-note) { background: linear-gradient(135deg, #168d9e, #065465); color: white; border-color: #087285; border-radius: 18px; }
.brand-theme :is(.side-card .mini, .map-side small, .primary .kpi-label) { color: #d4f2f0; }
.brand-theme :is(.side-card p, .map-hint, .map-stat span, .category-note p, .primary .kpi-sub, .hero-price span) { color: #e0efed; }
.brand-theme .side-card h3 { color: white; }
.brand-theme .hero-price strong { color: #ffd189; }
.brand-theme :is(.notice, .saving) { background: #fff1d9; color: #805011; border-left: 3px solid #edb259; }
.brand-theme :is(.amenity-card, .news-item, .trend-kpi, .radar-score, .privacy-note) { background: #f1f7f5; border-color: #dbe9e4; }
.brand-theme .photo-card { box-shadow: 0 4px 13px #07526012; }
.brand-theme :is(.amenity-icon, .section-icon, .building-card .visual) { background: #e3f3f1; color: #087889; border: 1px solid #cae4e2; }
.brand-theme .district-panel { background: #e9f3ef; border: 1px solid #d4e5df; }
.brand-theme .category-card.selected, .brand-theme .compare-option.active { background: #eff9f5; border-color: #138f9f; }
.brand-theme .age-card::before { background: linear-gradient(#20a7b7, #eeb860); }
.brand-theme .map-hero { padding-top: 45px; padding-bottom: 30px; }
.brand-theme .map-hero h1 { color: var(--navy); }
.brand-theme .map-stage { background: radial-gradient(ellipse at 50% 40%, #f5faf6, #e2eeeb); }
.brand-theme .loan-shell { padding-top: 28px; }
.brand-theme .schedule-table th { background: #e7f2ef; color: #15535e; }
.brand-theme .quick-buttons button { background: #fff4df; border-color: #efd7b0; color: #865519; }
.brand-theme .footer { background: #f0f3ee; border-top: 1px solid #d6e1dc; position: relative; color: #526c70; }
.brand-theme .footer::before { content: ''; display: block; height: 3px; width: 110px; position: absolute; top: -2px; left: max(20px, calc((100% - 1180px) / 2)); background: linear-gradient(90deg, #0995a5 65%, #efb255 65%); }
.search-guide { padding-top: 48px; }
.guide-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.guide-card { background: #fffefb; border: 1px solid var(--line); border-radius: 17px; padding: 20px; box-shadow: var(--brand-shadow); }
.guide-card > span { color: #078798; font-size: 12px; font-weight: 800; letter-spacing: .06em; }
.guide-card h3 { color: var(--navy); font-size: 17px; line-height: 1.5; margin: 12px 0 9px; }
.guide-card p, .guide-note { color: var(--muted); font-size: 13px; line-height: 1.8; margin: 0; }
.guide-card a { color: #067c8e; font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
.guide-note { margin-top: 14px; }
@media (max-width: 900px) { .guide-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

@media (max-width: 1050px) {
    .brand-theme .nav-note { display: none; }
    .home-hero-layout { gap: 12px; grid-template-columns: 1.2fr 1fr; }
    .brand-theme .hero h1 { font-size: clamp(30px, 3.8vw, 44px); }
    .hero-benefits { gap: 10px; }
}
@media (max-width: 760px) {
    .brand-theme .hero { padding: 32px 0 74px; }
    .home-hero-layout { grid-template-columns: 1fr; gap: 2px; }
    .brand-theme .hero h1 { font-size: clamp(29px, 5.6vw, 40px); }
    .home-hero-art { max-width: 360px; width: 75%; justify-self: center; margin-top: -8px; }
    .home-hero-copy { padding-bottom: 0; }
    .brand-theme .hero p { font-size: 14px; }
    .hero-benefits { margin-top: 16px; }
    .brand-theme .nav { min-height: 76px; }
    .brand-theme :is(.category-hero, .loan-hero) { padding: 34px 0; }
    .brand-theme :is(.hero, .category-hero, .loan-hero)::before { top: -174px; }
    .brand-theme :is(.category-hero, .loan-hero) h1 { text-wrap: balance; }
}
@media (max-width: 700px) {
    .guide-grid { grid-template-columns: 1fr; }
    .brand-theme .nav { gap: 14px; padding: 14px 0 10px; }
    .brand-theme .brand { font-size: 22px; }
    .brand-theme .logo { width: 39px; height: 39px; }
    .brand-theme .nav-links { gap: 3px; }
    .brand-theme .nav-link { font-size: 13px; padding: 10px 4px; }
    .brand-theme .search-card { padding: 6px; }
    .brand-theme .filters { padding: 15px 7px 9px; }
    .brand-theme .field { padding: 0 10px; font-size: 14px; min-width: 0; }
    .brand-theme .section-head { flex-wrap: wrap; }
}
@media (max-width: 380px) {
    .hero-benefits { gap: 9px 12px; }
    .hero-benefits > span { font-size: 11px; }
    .hero-benefits i { width: 22px; height: 22px; }
    .brand-theme .hero h1 { font-size: 28px; }
    .brand-theme .nav-link { font-size: 12px; padding-inline: 3px; }
}
@media (prefers-reduced-motion: reduce) {
    .brand-theme *, .brand-theme *::before, .brand-theme *::after { transition: none !important; animation: none !important; }
}
@media print {
    body.brand-theme { background: white; }
    .brand-theme .panel { box-shadow: none; }
    .home-hero-art, .hero-benefits { display: none; }
}