﻿:root {
    --panel: rgba(255, 252, 246, 0.9);
    --panel-strong: #fffaf1;
    --ink: #16254f;
    --ink-soft: #42506f;
    --accent: #d8b461;
    --accent-deep: #a77824;
    --line: rgba(216, 180, 97, 0.22);
    --panel-border-color: rgba(199, 161, 63, 0.22);
    --font-display: "Segoe UI", Arial, sans-serif;
    --font-body: "Segoe UI", Arial, sans-serif;
    --shadow: 0 12px 34px rgba(25, 39, 78, 0.08);
    --shadow-soft: 0 10px 26px rgba(17, 29, 61, 0.18);
    --radius-xl: 18px;
    --radius-lg: 14px;
    --radius-md: 10px;
    --panel-border-width: 1px;
    --panel-radius: 20px;
}

body {
    background:
        radial-gradient(circle at top left, rgba(199, 161, 63, 0.18), transparent 28%),
        radial-gradient(circle at right center, rgba(22, 37, 79, 0.08), transparent 24%),
        linear-gradient(180deg, #fbf8f2 0%, #f5f0e6 100%);
}

html { font-size: 15px; }
.site-nav a, .mobile-only-link { font-size: 14px; }
.site-nav a, .mobile-only-link { color: #243c5b; }
.site-nav a:hover, .site-nav a.is-active { color: #111d3d; background: #f3d890; }
@media (max-width: 900px) { .site-nav a:not(.is-active), .mobile-only-link { color: #ffffff; } }
.menu-toggle { background: linear-gradient(135deg, #f5df9d 0%, #c89b37 100%); }
.menu-toggle span { background: #111d3d; }
body { line-height: 1.55; }
h1 { font-size: clamp(28px, calc(28px + (17) * ((100vw - 390px) / 1050)), 45px); }
h2 { font-size: clamp(20px, calc(20px + (9) * ((100vw - 390px) / 1050)), 29px); }
h3 { font-size: clamp(16px, calc(16px + (0) * ((100vw - 390px) / 1050)), 16px); }
.hero-copy > .eyebrow, .page-hero > .eyebrow, .section-heading > .eyebrow, .split-copy > .eyebrow, .feature-copy > .eyebrow, .property-main > .eyebrow, .flow-panel > .eyebrow { font-size: clamp(11px, calc(11px + (1) * ((100vw - 390px) / 1050)), 12px); }
.hero-copy h1 { font-size: clamp(28px, calc(28px + (17) * ((100vw - 390px) / 1050)), 45px); }
.hero-copy > p { font-size: clamp(14px, calc(14px + (1) * ((100vw - 390px) / 1050)), 15px); }
.page-hero h1 { font-size: clamp(24px, calc(24px + (10) * ((100vw - 390px) / 1050)), 34px); }
.page-hero > p { font-size: clamp(14px, calc(14px + (1) * ((100vw - 390px) / 1050)), 15px); }
.property-copy h1 { font-size: clamp(34px, calc(34px + (16) * ((100vw - 390px) / 1050)), 50px); }
.property-copy h1 { font-weight: 620; }
h1, h2, h3, h4 { font-weight: 500; }
.container { width: min(1120px, calc(100% - 32px)); }
.site-header { background: linear-gradient(90deg, rgba(255, 255, 251, 1.00) 0%, rgba(161, 147, 95, 1.00) 100%) !important; border-bottom: 1px solid rgba(199, 161, 63, 0.34); box-shadow: 0 12px 32px rgba(22, 37, 79, 0.18); }
.site-header { backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
@media (min-width: 901px) {
    .site-header { position: sticky; overflow: hidden; isolation: isolate; }
    .header-shell { position: relative; z-index: 2; }
    .site-header::before, .site-header::after { content: ""; position: absolute; top: 0; bottom: 0; width: min(340px, 24vw); pointer-events: none; z-index: 1; background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20380%20104%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23f5d174%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M186%2014%20c-20%208-32%2023-31%2039%201%2014%2014%2018%209%2030%2018%202%2034-4%2043-17%209-13%204-22%2018-33-9-12-20-23-39-19z%22%20opacity%3D%22.34%22%2F%3E%3Cpath%20d%3D%22M142%2048%20c-18%203-31%2014-35%2029%2013%206%2031%201%2042-9%208-8%205-15-7-20z%22%20opacity%3D%22.25%22%2F%3E%3Cpath%20d%3D%22M236%2028%20c16%202%2027%2013%2030%2027-14%201-27-7-30-27z%22%20opacity%3D%22.22%22%2F%3E%3Cpath%20d%3D%22M52%2078%20C120%2056%20154%2060%20202%2042%20S282%2030%20342%2054%22%20opacity%3D%22.22%22%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%22%23f5d174%22%3E%3Ccircle%20cx%3D%22205%22%20cy%3D%2257%22%20r%3D%225%22%20opacity%3D%22.68%22%2F%3E%3Ccircle%20cx%3D%22185%22%20cy%3D%2235%22%20r%3D%223.5%22%20opacity%3D%22.50%22%2F%3E%3Ccircle%20cx%3D%22152%22%20cy%3D%2268%22%20r%3D%223%22%20opacity%3D%22.42%22%2F%3E%3Cpath%20d%3D%22M205%2042%20c-8%200-15%207-15%2015%200%2012%2015%2027%2015%2027s15-15%2015-27c0-8-7-15-15-15zm0%209a6%206%200%201%201%200%2012%206%206%200%200%201%200-12z%22%20opacity%3D%22.42%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); background-repeat: no-repeat; background-size: 100% 100%; opacity: 0.70; }
    .site-header::before { left: 0; }
    .site-header::after { right: 0; transform: scaleX(-1); }
}
@media (min-width: 901px) {
    .site-header { padding-top: 0 !important; padding-bottom: 0 !important; }
    .header-shell { min-height: 78px; gap: 16px; }
    .brand-mark { width: 154px; }
    .site-nav { gap: 8px; }
}
@media (max-width: 900px) {
    .site-header { padding-top: env(safe-area-inset-top, 0px) !important; padding-bottom: 0 !important; }
    .header-shell { min-height: 78px; grid-template-columns: auto minmax(28px, 1fr) auto !important; gap: 12px; position: relative; }
    .brand-mark { width: 130px; grid-column: 1; position: relative; z-index: 4; }
    .menu-toggle { width: 48px; height: 48px; grid-column: 3; justify-self: end; position: relative; z-index: 6; touch-action: manipulation; }
    .site-nav { grid-column: 1 / -1; z-index: 1000; }
    .header-shell::after { grid-column: 2; grid-row: 1; justify-self: stretch; align-self: center; content: ""; display: block; min-width: 24px; pointer-events: none; position: relative; z-index: 1; }
    .header-shell::after { height: 2px; border-radius: 999px; background: linear-gradient(90deg, rgba(247, 223, 161, 0), rgba(199, 161, 63, .88), rgba(247, 223, 161, 0)); }
}
body:not(.admin-body)::before { opacity: 0.52; }
body.admin-body::before { content: none !important; display: none !important; }
.button { color: #fffaf1; background: linear-gradient(135deg, #16254f 0%, #223771 100%); }
.button, button, input[type="submit"] { border-radius: 12px !important; }

/* Custom CSS */
.header-actions .desktop-cta,
.header-actions .button-outline,
.header-actions .button-secondary {
    color: #111d3d;
    background: linear-gradient(135deg, #f5df9d 0%, #c89b37 100%);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
}

@media (max-width: 900px) {
    .site-nav {
        background: #111d3d;
        border: 1px solid rgba(216, 180, 97, 0.28);
        box-shadow: 0 18px 42px rgba(17, 29, 61, 0.26);
    }

    .mobile-only-link {
        color: #f5df9d;
    }
}
