@import url("https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap");

:root {
    --bg: #f7f0e5;
    --panel: #fffdf9;
    --panel-2: #f3e8d9;
    --text: #2d211a;
    --muted: #76685d;
    --line: rgba(91, 57, 36, .18);
    --green: #61704a;
    --yellow: #a96724;
    --red: #a23b35;
    --blue: #815334;
    --shadow: 0 22px 64px rgba(71, 43, 26, .12);
    --land-brown: #6f4328;
    --land-brown-deep: #3e2619;
    --land-clay: #a9673f;
    --land-paper: #fbf7ef;
    --land-white: #fffdf9;
    --land-sage: #6d7752;
    --land-display: "Cinzel", Georgia, serif;
    --land-body: "Manrope", Arial, sans-serif;
}

html { color-scheme: light; scroll-behavior: smooth; }

body {
    position: relative;
    min-height: 100vh;
    color: var(--text);
    background:
        radial-gradient(circle at 7% 0%, rgba(169,103,63,.14), transparent 30rem),
        radial-gradient(circle at 94% 18%, rgba(109,119,82,.11), transparent 27rem),
        linear-gradient(180deg, #fbf7ef, #f4eadc 52%, #fffdf9);
    font-family: var(--land-body);
}

body::before {
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    opacity: .48;
    background-image:
        url("data:image/svg+xml,%3Csvg width='260' height='220' viewBox='0 0 260 220' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%236f4328' stroke-opacity='.11'%3E%3Cpath d='M-30 48c55-42 104-39 147-5s83 31 154-19'/%3E%3Cpath d='M-35 82c61-38 105-33 145-2s88 30 166-15'/%3E%3Cpath d='M-24 118c55-31 99-26 139 0s85 27 153-7'/%3E%3Cpath d='M-19 154c52-24 93-20 132 2s83 25 146-3'/%3E%3C/g%3E%3C/svg%3E"),
        linear-gradient(rgba(111,67,40,.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(111,67,40,.025) 1px, transparent 1px);
    background-size: 430px 360px, 64px 64px, 64px 64px;
    content: "";
}

::selection { color: #fff; background: var(--land-clay); }

a { color: var(--land-brown); }
a:hover { color: var(--land-clay); }

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
summary:focus-visible {
    outline: 3px solid rgba(169,103,63,.42);
    outline-offset: 3px;
}

.shell { width: min(1180px, calc(100vw - 32px)); padding-top: 18px; }
.shell.narrow { width: min(1080px, calc(100vw - 32px)); }

.hero {
    position: relative;
    min-height: 190px;
    margin: 0 0 18px;
    padding: 42px clamp(24px, 5vw, 58px);
    overflow: hidden;
    background: linear-gradient(120deg, rgba(255,253,249,.96), rgba(237,221,199,.86));
    border: 1px solid var(--line);
    border-radius: 30px;
    box-shadow: var(--shadow);
}

.hero::before,
.hero::after {
    position: absolute;
    pointer-events: none;
    content: "";
}

.hero::before {
    right: -42px;
    bottom: -84px;
    width: 330px;
    height: 250px;
    border: 1px solid rgba(111,67,40,.25);
    border-radius: 43% 57% 49% 51% / 53% 45% 55% 47%;
    box-shadow:
        0 0 0 24px rgba(111,67,40,.055),
        0 0 0 49px rgba(111,67,40,.04),
        0 0 0 74px rgba(111,67,40,.028);
    transform: rotate(-9deg);
}

.hero::after {
    right: 108px;
    bottom: 62px;
    width: 14px;
    height: 14px;
    background: var(--land-clay);
    border: 5px solid #fff5e7;
    border-radius: 50% 50% 50% 0;
    box-shadow: 0 8px 18px rgba(72,43,26,.2);
    transform: rotate(-45deg);
}

.hero > * { position: relative; z-index: 1; }
.hero.compact { min-height: 140px; padding-block: 34px; }

.eyebrow {
    color: var(--land-clay);
    font-size: .72rem;
    letter-spacing: .19em;
}

h1,
.hero h1 {
    color: var(--land-brown-deep);
    font-family: var(--land-display);
    font-weight: 600;
    letter-spacing: -.045em;
}

h2,
h3 { color: var(--land-brown-deep); }

.subhead {
    max-width: 690px;
    color: var(--muted);
    line-height: 1.7;
}

.panel {
    background: rgba(255,253,249,.92);
    border-color: var(--line);
    border-radius: 24px;
    box-shadow: 0 16px 45px rgba(71,43,26,.09);
    backdrop-filter: blur(16px);
}

label { color: #57483d; font-weight: 700; }

input,
textarea,
select {
    color: var(--text);
    background: #fff;
    border-color: rgba(91,57,36,.24);
    box-shadow: inset 0 1px 2px rgba(71,43,26,.04);
}

input::placeholder,
textarea::placeholder { color: #9b8c80; }

input:focus,
textarea:focus,
select:focus {
    border-color: var(--land-clay);
    box-shadow: 0 0 0 4px rgba(169,103,63,.12);
}

details {
    padding: 12px 14px;
    background: #f8efe3;
    border: 1px solid var(--line);
    border-radius: 14px;
}

summary { color: var(--land-brown); cursor: pointer; font-weight: 800; }

.button {
    min-height: 46px;
    color: #fff;
    background: linear-gradient(135deg, var(--land-brown), var(--land-clay));
    box-shadow: 0 10px 24px rgba(111,67,40,.18);
    transition: transform 200ms ease, box-shadow 200ms ease, background 200ms ease;
}

.button.secondary {
    color: var(--land-brown);
    background: rgba(255,253,249,.84);
    border-color: rgba(91,57,36,.26);
    box-shadow: none;
}

.button:hover {
    color: #fff;
    background: var(--land-brown-deep);
    box-shadow: 0 14px 30px rgba(111,67,40,.24);
    filter: none;
    transform: translateY(-2px);
}

.button.secondary:hover { color: #fff; background: var(--land-brown); }

.status {
    color: var(--muted);
    background: #f5ebdd;
    border-color: var(--line);
}

.score-card {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 92% 12%, rgba(109,119,82,.15), transparent 10rem),
        linear-gradient(145deg, #f2e4d1, #fffaf2);
    border-color: var(--line);
}

.score-card::after {
    position: absolute;
    right: -34px;
    bottom: -52px;
    width: 170px;
    height: 145px;
    border: 1px solid rgba(111,67,40,.18);
    border-radius: 50% 38% 55% 42%;
    box-shadow: 0 0 0 16px rgba(111,67,40,.04), 0 0 0 34px rgba(111,67,40,.025);
    content: "";
}

.score-card > * { position: relative; z-index: 1; }

.chips span {
    color: var(--land-brown-deep);
    background: rgba(255,253,249,.72);
    border-color: var(--line);
}

#map,
.master-map,
.interactive-map {
    border-color: rgba(91,57,36,.28);
    box-shadow: inset 0 0 0 4px rgba(255,255,255,.7), 0 12px 30px rgba(71,43,26,.1);
}

.property-row,
.metric,
.fact-card,
.readiness-factor,
.distance-item,
.map-disclosure-grid > div,
.buildability-metrics > div,
.metric-visual-card,
.soil-components article,
.utility-status,
.road-list article,
.parcel-screen,
.nri-summary > div,
.zoning-hero-grid article,
.use-matrix article,
.comp-chart article,
.cost-inputs label,
.infrastructure-groups article {
    color: var(--text);
    background: rgba(255,253,249,.86);
    border-color: var(--line);
    box-shadow: 0 8px 22px rgba(71,43,26,.055);
}

.property-row,
.distance-item,
.fact-card,
.readiness-factor {
    transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
}

.property-row:hover,
.distance-item:hover,
.fact-card:hover,
.readiness-factor:hover {
    border-color: rgba(111,67,40,.38);
    background: #fffdf9;
    box-shadow: 0 15px 32px rgba(71,43,26,.1);
    transform: translateY(-3px);
}

.badge {
    color: var(--land-brown-deep);
    background: #f7eddf;
    border-color: var(--line);
}

.report-section { border-top-color: var(--line); }

pre.json,
.raw-json pre {
    color: #f9eee1;
    background: #35251d;
    border-color: rgba(91,57,36,.4);
}

.score-box,
.risk-box,
.big-badge {
    border-color: rgba(91,57,36,.22);
    box-shadow: 0 10px 28px rgba(71,43,26,.08);
}

.summary-hero,
.raw-json {
    background: linear-gradient(135deg, rgba(169,103,63,.1), rgba(255,253,249,.8));
    border: 1px solid var(--line);
}

.fact-card,
.readiness-factor { background: #fffdf9; }

.signal-list.evidence li { background: rgba(111,67,40,.08); border-left-color: var(--land-brown); }

.map-card {
    background: linear-gradient(145deg, #f0dfc7, #fffaf2);
    border-color: var(--line);
}

.map-button {
    color: #fff;
    background: var(--land-brown);
    border-color: var(--land-brown);
}

.map-button:hover { color: #fff; background: var(--land-brown-deep); }
.map-coordinates,
.climate-heading .climate-station,
.distance-item b { color: var(--land-clay); }

.temperature-plot,
.precipitation-chart,
.climate-section {
    background: rgba(255,253,249,.65);
    border-color: var(--line);
}

.temperature-values strong { color: var(--land-brown-deep); }
.precipitation-month { color: var(--muted); }

.report-navigator {
    background: rgba(247,238,225,.94);
    border-color: var(--line);
    box-shadow: 0 12px 30px rgba(71,43,26,.08);
    backdrop-filter: blur(14px);
}

.report-navigator a { color: var(--land-brown); }
.report-navigator a:hover,
.report-navigator a:focus-visible { color: #fff; background: var(--land-brown); }

.section-kicker { color: var(--land-clay); }
.section-description,
.subsection-heading p,
.map-disclosure-grid small,
.buildability-metrics span,
.metric-visual-card > span,
.metric-visual-card small,
.soil-components span,
.utility-status small,
.road-list span,
.parcel-screen span,
.nri-summary span,
.nri-summary small,
.hazard-row span,
.method-note,
.zoning-hero-grid span,
.zoning-hero-grid small,
.use-matrix span,
.use-matrix small,
.comp-chart span,
.public-data-gap span,
.cost-inputs small,
.cost-total span,
.cost-total small,
.infrastructure-group-title span,
.infrastructure-groups article > p { color: var(--muted); }

.source-pill.public,
.data-state.available { color: #4e6740; background: rgba(97,112,74,.1); border-color: rgba(97,112,74,.34); }
.source-pill.claim { color: var(--land-brown); background: rgba(169,103,63,.1); border-color: rgba(169,103,63,.34); }
.data-state.pending,
.source-count-badge { color: #8b5a1f; background: rgba(169,103,36,.1); border-color: rgba(169,103,36,.32); }
.data-state.unavailable { color: #76685d; background: #eee4d7; border-color: var(--line); }

.evidence-table-wrap,
.evidence-table th,
.evidence-table td { border-color: var(--line); }
.evidence-table { background: rgba(255,253,249,.72); }
.evidence-table thead th { color: var(--land-brown-deep); background: #efe1cf; }
.evidence-table tbody th { color: var(--land-brown-deep); }
.evidence-value { border-left-color: var(--land-sage); background: rgba(109,119,82,.06); }
.evidence-value a,
.evidence-value small { color: var(--land-brown); }
.evidence-value.unavailable { color: var(--muted); background: #f2e9dc; border-left-color: #9b8c80; }

.master-map .leaflet-control-layers {
    color: var(--text);
    background: rgba(255,253,249,.96);
    border-color: var(--line);
    box-shadow: 0 12px 28px rgba(71,43,26,.16);
}
.master-map .leaflet-control-layers label { color: var(--text); }

.visual-empty-state,
.public-data-gap,
.cost-empty {
    color: var(--muted);
    background: repeating-linear-gradient(135deg, rgba(111,67,40,.035) 0 8px, transparent 8px 16px);
    border-color: rgba(111,67,40,.28);
}

.buildability-layout,
.cost-visual-panel {
    background: linear-gradient(135deg, rgba(109,119,82,.1), rgba(255,253,249,.9));
    border-color: var(--line);
}

.coverage-ring {
    background: conic-gradient(var(--land-sage) var(--coverage), #eadfce 0);
    box-shadow: 0 0 30px rgba(109,119,82,.14);
}
.coverage-ring::before { background: #fffdf9; }
.coverage-ring span { color: var(--muted); }

.constraint-stack span {
    color: #895821;
    background: rgba(169,103,36,.08);
    border-color: rgba(169,103,36,.3);
}

.soil-bar,
.hazard-track,
.comp-bar,
.cost-bars > div > div { background: #eadfce; }

.money-input {
    color: var(--text);
    background: #fff;
    border-color: var(--line);
}
.money-input i { color: var(--land-clay); }

.cost-visual-panel { box-shadow: var(--shadow); }
.cost-visual-panel > p { color: var(--muted); }

.infrastructure-groups article > a { border-top-color: var(--line); }
.infrastructure-groups article > a b { color: var(--land-sage); }

table th { color: var(--land-brown-deep); }
th,
td { border-bottom-color: var(--line); }

@media (max-width: 820px) {
    .hero { min-height: 0; padding: 30px 22px; }
    .hero::before { opacity: .6; }
    .hero::after { right: 48px; bottom: 36px; opacity: .65; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}