:root {
  --black: #090908;
  --ink: #14130f;
  --charcoal: #1c1b17;
  --gold: #d5aa49;
  --gold-bright: #f1cd74;
  --cream: #f5f0e7;
  --muted: #9d988c;
  --line: rgba(213, 170, 73, 0.25);
  --display: "Playfair Display", Georgia, serif;
  --sans: "DM Sans", system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; }
body { margin: 0; color: var(--cream); background: var(--black); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
img { display: block; width: 100%; }
.skip-link { position: fixed; z-index: 100; top: -80px; left: 1rem; padding: .75rem 1rem; background: var(--gold); color: var(--black); }
.skip-link:focus { top: 1rem; }
.eyebrow { margin: 0 0 1.2rem; color: var(--gold); font-size: .69rem; font-weight: 700; letter-spacing: .19em; text-transform: uppercase; }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { font-family: var(--display); font-weight: 600; letter-spacing: -.035em; }
h1 em, h2 em { color: var(--gold-bright); font-weight: 600; }

.site-header { position: fixed; z-index: 40; inset: 0 0 auto; height: 84px; display: flex; align-items: center; justify-content: space-between; padding: 0 clamp(1.25rem, 4vw, 4.5rem); border-bottom: 1px solid rgba(255,255,255,.11); background: rgba(8,8,6,.78); backdrop-filter: blur(18px); }
.brand { display: flex; align-items: center; gap: .72rem; }
.brand-mark { width: 34px; height: 36px; flex: 0 0 34px; }
.brand-mark-image { object-fit: contain; mix-blend-mode: screen; }
.brand span { display: flex; flex-direction: column; line-height: 1; }
.brand strong { font-size: .84rem; letter-spacing: .17em; }
.brand small { margin-top: .32rem; color: var(--gold); font-size: .51rem; letter-spacing: .29em; }
.main-nav { display: flex; align-items: center; gap: clamp(1rem, 2vw, 2rem); font-size: .75rem; font-weight: 600; }
.main-nav a { position: relative; color: rgba(255,255,255,.75); transition: color .2s ease; }
.main-nav a:not(.nav-cta)::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -.5rem; height: 1px; background: var(--gold); transition: right .25s ease; }
.main-nav a:hover, .main-nav a.active { color: var(--gold-bright); }
.main-nav a:hover::after, .main-nav a.active::after { right: 0; }
.nav-cta { padding: .72rem 1.1rem; border: 1px solid var(--gold); color: var(--gold-bright) !important; }
.menu-toggle { display: none; width: 42px; height: 42px; padding: 0; border: 0; background: transparent; }
.menu-toggle span { display: block; width: 22px; height: 1px; margin: 7px auto; background: var(--cream); transition: transform .2s; }

.hero { min-height: 100svh; position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 410px); align-items: end; gap: 3rem; overflow: hidden; padding: 9.5rem clamp(1.25rem, 7vw, 7.5rem) 7.5rem; }
.hero-image, .hero-overlay { position: absolute; inset: 0; height: 100%; object-fit: cover; }
.hero-image { object-position: 60% center; filter: saturate(.82) contrast(1.02) brightness(1.1); }
.hero-overlay { background: linear-gradient(90deg, rgba(4,4,3,.78) 0%, rgba(4,4,3,.46) 52%, rgba(4,4,3,.12) 100%), linear-gradient(0deg, rgba(4,4,3,.62), transparent 48%); }
.hero-copy, .hero-card, .scroll-cue { position: relative; z-index: 2; }
.hero-copy { max-width: 780px; }
.hero h1 { margin-bottom: 1.6rem; font-size: clamp(3.75rem, 7.6vw, 8rem); line-height: .89; }
.hero-lede { max-width: 570px; color: rgba(255,255,255,.72); font-size: clamp(1rem, 1.45vw, 1.2rem); line-height: 1.7; }
.hero-actions { display: flex; align-items: center; gap: 2.2rem; margin-top: 2.1rem; }
.button { display: inline-flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-width: 184px; padding: 1rem 1.2rem; border: 1px solid transparent; cursor: pointer; font-size: .76rem; font-weight: 700; letter-spacing: .04em; transition: transform .2s, background .2s; }
.button:hover { transform: translateY(-2px); }
.button-gold { color: var(--black); background: var(--gold-bright); }
.button-gold:hover { background: #ffe099; }
.text-link { padding: .7rem 0; border-bottom: 1px solid rgba(255,255,255,.32); font-size: .78rem; font-weight: 600; }
.hero-card { padding: 1.7rem; border: 1px solid rgba(255,255,255,.17); background: rgba(9,9,8,.68); backdrop-filter: blur(14px); }
.hero-card > p { margin-bottom: 1rem; color: var(--muted); font-size: .66rem; letter-spacing: .15em; text-transform: uppercase; }
.intent-links a { display: grid; grid-template-columns: 28px 1fr auto; align-items: center; gap: .75rem; padding: 1rem 0; border-top: 1px solid rgba(255,255,255,.13); font-family: var(--display); font-size: 1.08rem; }
.intent-links a span { color: var(--gold); font-family: var(--sans); font-size: .6rem; }
.intent-links a b { color: var(--gold); font-family: var(--sans); transition: transform .2s; }
.intent-links a:hover b { transform: translateX(4px); }
.scroll-cue { position: absolute; bottom: 2rem; left: clamp(1.25rem, 7vw, 7.5rem); display: flex; align-items: center; gap: .8rem; color: var(--muted); font-size: .63rem; letter-spacing: .12em; text-transform: uppercase; }
.scroll-cue i { display: block; width: 42px; height: 1px; background: var(--gold); }

.properties-section { padding: clamp(5rem, 9vw, 9rem) clamp(1.25rem, 6vw, 6.5rem); background: var(--cream); color: var(--ink); }
.section-heading { display: grid; grid-template-columns: 1.5fr .7fr; align-items: end; gap: 4rem; margin-bottom: 3.2rem; }
.section-heading h2, .story-copy h2, .panel-heading h2, .contact-copy h2 { margin: 0; font-size: clamp(2.6rem, 5.1vw, 5.4rem); line-height: .98; }
.properties-section h2 em, .story-section h2 em { color: #967126; }
.section-heading > p { margin: 0; color: #656056; line-height: 1.75; }
.filter-bar { display: flex; gap: .5rem; overflow-x: auto; padding: 0 0 1rem; scrollbar-width: thin; }
.filter-button { flex: 0 0 auto; padding: .77rem 1rem; border: 1px solid #d2cabc; color: #5d584f; background: transparent; cursor: pointer; font-size: .73rem; font-weight: 600; }
.filter-button span { margin-left: .55rem; color: #91887a; font-size: .61rem; }
.filter-button:hover, .filter-button.active { border-color: var(--black); color: var(--cream); background: var(--black); }
.filter-button.active span { color: var(--gold-bright); }
.property-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: clamp(1rem, 2.2vw, 2rem); margin-top: 1rem; }
.property-card { overflow: hidden; background: #fff; box-shadow: 0 14px 38px rgba(32,27,17,.08); animation: card-in .38s ease both; }
@keyframes card-in { from { opacity: 0; transform: translateY(12px); } }
.property-card figure { position: relative; overflow: hidden; aspect-ratio: 1.28; margin: 0; background: #ddd6c8; }
.property-card figure img { height: 100%; object-fit: cover; transition: transform .5s ease; }
.property-card:hover figure img { transform: scale(1.035); }
.property-tag, .sample-tag { position: absolute; top: .9rem; padding: .46rem .64rem; font-size: .58rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.property-tag { left: .9rem; color: var(--black); background: var(--gold-bright); }
.sample-tag { right: .9rem; color: white; background: rgba(0,0,0,.7); }
.property-content { padding: 1.25rem; }
.property-meta { display: flex; justify-content: space-between; color: #776f63; font-size: .68rem; }
.property-content h3 { margin: .7rem 0 .35rem; font-family: var(--display); font-size: 1.34rem; }
.property-location { color: #787167; font-size: .76rem; }
.property-details { display: flex; gap: 1rem; margin: 1rem 0; padding-top: 1rem; border-top: 1px solid #e7e1d7; color: #4c483f; font-size: .69rem; }
.property-footer { display: flex; justify-content: space-between; align-items: center; }
.property-price { font-weight: 700; font-size: 1rem; }
.property-link { color: #72520e; font-size: .71rem; font-weight: 700; }
.results-status { margin: 1rem 0 0; color: #6e685d; font-size: .72rem; }
.idx-note { display: flex; justify-content: space-between; align-items: center; gap: 2rem; margin-top: 3.5rem; padding: 1.4rem 1.6rem; border: 1px solid #cfc5b4; }
.idx-note > div { display: flex; align-items: center; gap: 1rem; }
.idx-icon { display: grid; place-items: center; width: 42px; height: 42px; color: var(--gold); background: var(--black); font-size: 1.5rem; }
.idx-note strong { font-size: .76rem; letter-spacing: .08em; text-transform: uppercase; }
.idx-note p { margin: .3rem 0 0; color: #716b61; font-size: .72rem; }
.idx-note a { flex: 0 0 auto; color: #6d4c08; font-size: .73rem; font-weight: 700; }

.story-section { display: grid; grid-template-columns: 1fr 1fr; min-height: 780px; }
.story-image { position: relative; min-height: 620px; }
.story-image img { height: 100%; object-fit: cover; filter: saturate(.65); }
.story-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.38), transparent 40%); }
.story-image > span { position: absolute; z-index: 1; left: 2rem; bottom: 2rem; padding: .5rem .65rem; border: 1px solid rgba(255,255,255,.42); font-size: .61rem; letter-spacing: .14em; text-transform: uppercase; }
.story-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(3rem, 7vw, 7rem); background: #11110f; }
.story-copy > p:not(.eyebrow) { margin: 2rem 0 1rem; color: #aaa69d; line-height: 1.8; }
.principles { margin-top: 1rem; }
.principles > div { display: grid; grid-template-columns: 34px 1fr; gap: .8rem; padding: 1rem 0; border-top: 1px solid rgba(255,255,255,.12); }
.principles b { color: var(--gold); font-size: .63rem; }
.principles span { display: flex; justify-content: space-between; gap: 1rem; }
.principles strong { font-family: var(--display); font-size: 1rem; }
.principles small { color: #918c82; }

.connection-section { background: #141310; }
.team-panel, .news-panel { padding: clamp(5rem, 8vw, 8rem) clamp(1.25rem, 7vw, 7.5rem); }
.panel-heading { display: grid; grid-template-columns: 1.2fr .65fr; align-items: end; gap: 3rem; }
.panel-heading > p { color: #969188; line-height: 1.7; }
.agent-card { display: grid; grid-template-columns: 128px 1fr 48px; align-items: center; gap: 1.5rem; max-width: 720px; margin-top: 3.5rem; padding: 1rem; border: 1px solid rgba(255,255,255,.14); }
.agent-portrait { display: grid; place-items: center; aspect-ratio: 1; color: var(--gold); background: radial-gradient(circle at 50% 25%, #5a4b2c, #211d14 60%, #0c0c0a); font-family: var(--display); font-size: 1.4rem; }
.agent-card p { margin-bottom: .35rem; color: var(--gold); font-size: .61rem; letter-spacing: .13em; text-transform: uppercase; }
.agent-card h3 { margin-bottom: .35rem; font-family: var(--display); font-size: 1.35rem; }
.agent-card small { color: #928c83; }
.agent-card > a { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid var(--gold); color: var(--gold); }
.testimonial-panel { padding: clamp(5rem, 8vw, 8rem) clamp(1.25rem, 14vw, 15rem); text-align: center; background: var(--gold-bright); color: var(--black); }
.testimonial-panel .eyebrow { color: #62470d; }
.testimonial-panel blockquote { max-width: 980px; margin: 0 auto 2rem; font-family: var(--display); font-size: clamp(2rem, 4vw, 4.15rem); line-height: 1.15; }
.quote-meta { display: flex; justify-content: center; gap: 1.5rem; font-size: .69rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.disclosure { display: block; margin-top: 1.4rem; color: rgba(0,0,0,.6); font-size: .62rem; }
.news-panel { background: #0d0d0b; }
.panel-heading.compact { grid-template-columns: 1fr; }
.article-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 3rem; background: rgba(255,255,255,.12); }
.article-list article { display: flex; flex-direction: column; min-height: 250px; padding: 1.6rem; background: #0d0d0b; }
.article-list span { color: var(--gold); font-size: .61rem; letter-spacing: .1em; text-transform: uppercase; }
.article-list h3 { margin: 1.5rem 0; font-family: var(--display); font-size: 1.35rem; line-height: 1.35; }
.article-list a { margin-top: auto; color: #b8b2a8; font-size: .7rem; }
.news-panel > .disclosure { color: #6f6b64; text-align: right; }
.contact-panel { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(3rem, 7vw, 8rem); padding: clamp(5rem, 8vw, 8rem) clamp(1.25rem, 7vw, 7.5rem); background: #191711; }
.contact-copy > p:not(.eyebrow) { max-width: 580px; margin: 2rem 0; color: #a29d93; line-height: 1.75; }
.contact-details { display: flex; gap: 1rem; color: var(--gold); font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; }
.contact-details span + span::before { content: "·"; margin-right: 1rem; }
.contact-email { display: inline-flex; gap: .65rem; margin-top: 1.35rem; padding-bottom: .35rem; border-bottom: 1px solid rgba(213,170,73,.45); color: var(--cream); font-size: .77rem; }
.contact-form { display: flex; flex-direction: column; gap: 1.15rem; padding: clamp(1.4rem, 3vw, 2.5rem); background: var(--cream); color: var(--ink); }
.honey-field { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.contact-form label { color: #5d584f; font-size: .65rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.contact-form input, .contact-form select, .contact-form textarea { width: 100%; margin-top: .5rem; padding: .8rem 0; border: 0; border-bottom: 1px solid #c8bfaf; border-radius: 0; outline: none; color: var(--ink); background: transparent; text-transform: none; }
.contact-form textarea { resize: vertical; }
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { border-color: #8f681b; }
.contact-form .button { align-self: flex-start; border: 0; background: var(--black); color: var(--gold-bright); }
.contact-form small { color: #827b70; font-size: .62rem; line-height: 1.5; text-transform: none; }
.form-status { display: none; margin: 0; padding: .7rem; background: #e5dccb; color: #3f392e; font-size: .72rem; }
.form-status.visible { display: block; }

.site-footer { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 1rem; padding: 3rem clamp(1.25rem, 7vw, 7.5rem); border-top: 1px solid rgba(255,255,255,.1); background: #080806; }
.site-footer > p { grid-column: 2; grid-row: 1; margin: 0; color: var(--gold); font-family: var(--display); font-size: 1.6rem; font-style: italic; }
.site-footer > div { grid-column: 1 / -1; display: flex; justify-content: space-between; margin-top: 1.5rem; color: #716d66; font-size: .62rem; }

.reveal { opacity: 0; transform: translateY(18px); transition: opacity .75s ease, transform .75s ease; }
.reveal.visible { opacity: 1; transform: translateY(0); }

@media (max-width: 980px) {
  .menu-toggle { display: block; }
  .main-nav { position: fixed; inset: 84px 0 auto; display: flex; flex-direction: column; align-items: flex-start; gap: 0; padding: 1rem 1.25rem 2rem; background: #0c0c0a; transform: translateY(-120%); opacity: 0; pointer-events: none; transition: transform .25s, opacity .25s; }
  .main-nav.open { transform: translateY(0); opacity: 1; pointer-events: auto; }
  .main-nav a { width: 100%; padding: 1rem 0; border-bottom: 1px solid rgba(255,255,255,.09); }
  .nav-cta { margin-top: 1rem; padding: .9rem !important; text-align: center; }
  .menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(4px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-4px) rotate(-45deg); }
  .hero { grid-template-columns: 1fr; align-content: end; padding-bottom: 5.2rem; }
  .hero-image { object-position: 72% center; }
  .hero-card { display: none; }
  .hero h1 { font-size: clamp(3.7rem, 12vw, 7rem); }
  .property-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .story-section { grid-template-columns: 1fr; }
  .story-image { min-height: 520px; }
  .panel-heading, .contact-panel { grid-template-columns: 1fr; }
  .article-list { grid-template-columns: 1fr; }
  .article-list article { min-height: 200px; }
}

@media (max-width: 640px) {
  .site-header { height: 72px; }
  html { scroll-padding-top: 72px; }
  .main-nav { inset: 72px 0 auto; }
  .hero { min-height: 760px; padding-top: 8.5rem; }
  .hero-image { object-position: 78% center; }
  .hero-overlay { background: linear-gradient(90deg, rgba(4,4,3,.78), rgba(4,4,3,.28)), linear-gradient(0deg, rgba(4,4,3,.76), transparent 58%); }
  .hero h1 { font-size: clamp(3.45rem, 17vw, 5rem); }
  .hero-actions { align-items: stretch; flex-direction: column; gap: .75rem; }
  .button { width: 100%; }
  .text-link { align-self: flex-start; }
  .scroll-cue { display: none; }
  .section-heading { grid-template-columns: 1fr; gap: 1.5rem; }
  .section-heading h2, .story-copy h2, .panel-heading h2, .contact-copy h2 { font-size: clamp(2.55rem, 12vw, 4rem); }
  .property-grid { grid-template-columns: 1fr; }
  .idx-note { align-items: flex-start; flex-direction: column; }
  .idx-note > div { align-items: flex-start; }
  .principles span { flex-direction: column; gap: .25rem; }
  .agent-card { grid-template-columns: 78px 1fr; }
  .agent-card > a { display: none; }
  .testimonial-panel { text-align: left; }
  .quote-meta { align-items: flex-start; flex-direction: column; gap: .4rem; }
  .form-row { grid-template-columns: 1fr; }
  .site-footer { grid-template-columns: 1fr; }
  .site-footer > p { grid-column: 1; grid-row: 2; }
  .site-footer > div { flex-direction: column; gap: .5rem; }
}

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