/* =========================================================
   GOLDEN HOUR — inner pages layer
   Loads after styles.css and golden.css on every inner page.
   Re-points the old design tokens at the Golden Hour palette so
   the existing page layouts keep working, then restyles the
   hero and a few page-level patterns.
   ========================================================= */

:root {
  --bg: var(--night);
  --bg-alt: var(--slate);
  --bg-deep: var(--mist);
  --bg-deep-alt: #1d3252;
  --ink: #f3eee6;
  --ink-soft: rgba(243, 238, 230, 0.8);
  --ink-mute: rgba(243, 238, 230, 0.66);
  --line: rgba(243, 238, 230, 0.14);
  --line-soft: rgba(243, 238, 230, 0.07);
  --line-light: rgba(243, 238, 230, 0.14);
  --cream: #f3eee6;
  --radius: 0;
  --max-narrow: 880px;
}
/* light surfaces keep dark text */
.paper-panel, .idx-embed, .idx-quicksearch { --ink: #1a1f24; --ink-soft: #3a444e; color: #1a1f24; }
.idx-embed { background: var(--paper); padding: clamp(1rem, 2.5vw, 2rem); }
.idx-embed p { color: #3a444e; }

/* old reveal base: visible unless JS is running (golden.css hides under .js) */
.reveal, .reveal-stagger > * { opacity: 1; transform: none; }

/* ---------- HERO (inner pages) ---------- */
.hero { position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: flex-end; min-height: min(76svh, 780px); padding: 9rem 0 clamp(3rem, 6vw, 5rem); background: var(--night); color: var(--paper); }
.hero.hero-compact { min-height: min(52svh, 520px); }
.hero-bg { position: absolute; inset: 0; z-index: -3; background: var(--hero-photo, radial-gradient(ellipse at 78% 18%, rgba(214,172,108,.22), transparent 55%), linear-gradient(160deg, #1d262e 0%, #141a20 55%, #0e1216 100%)) center 60% / cover no-repeat; animation: settle 2.8s var(--ease) both; }
@media (prefers-reduced-motion: reduce) { .hero-bg { animation: none; } }
.hero-bg::after { content: none; }
.hero:has(.hero-slides) .hero-bg { display: block; }
.hero-slides { position: absolute; inset: 0; z-index: -3; overflow: hidden; }
.hero-slide { position: absolute; inset: 0; background-size: cover; background-position: center 55%; opacity: 0; animation: none; }
.hero-slide:first-child { opacity: 1; animation: settle 2.8s var(--ease) both; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg, rgba(14,18,22,.82) 0%, rgba(14,18,22,.45) 45%, rgba(14,18,22,.05) 80%), linear-gradient(180deg, rgba(14,18,22,.6) 0%, rgba(14,18,22,0) 24%, rgba(14,18,22,0) 50%, rgba(14,18,22,.88) 100%); }
.hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: url(../images/grain.png); opacity: .07; mix-blend-mode: overlay; pointer-events: none; }
.hero-grain, .hero-orbs, .hero-video-wrap { display: none; }
.hero-content { position: relative; width: 100%; max-width: var(--max); margin: 0 auto; padding: 0 var(--gutter); }
.hero-content > * { max-width: 760px; }
.hero h1, .hero .h-display { font-size: clamp(2.75rem, 6.4vw, 5.25rem); margin-bottom: 1rem; text-shadow: 0 2px 36px rgba(0,0,0,.45); animation: rise 1s var(--ease) .1s both; }
.hero .eyebrow, .hero .lead, .hero .actions { animation: rise 1s var(--ease) .25s both; }
.hero .lead { color: var(--paper); }
.hero .reveal { opacity: 1; transform: none; transition: none; }
@media (max-width: 720px) { .hero { min-height: min(68svh, 640px); padding-top: 7rem; } .hero.hero-compact { min-height: min(46svh, 420px); } .hero::before { background: linear-gradient(180deg, rgba(14,18,22,.6) 0%, rgba(14,18,22,.25) 25%, rgba(14,18,22,.6) 55%, rgba(14,18,22,.92) 100%); } }
@media (prefers-reduced-motion: reduce) { .hero h1, .hero .eyebrow, .hero .lead, .hero .actions, .hero-slide:first-child { animation: none; } }

/* sections that follow a hero */
.section-alt .wrap > .stats:first-child { margin-top: 0; }
section { padding: clamp(3.5rem, 8vw, 7rem) 0; }
.section-alt[style*="padding-top: 0"], section[style*="padding-top: 0"] { padding-top: 0 !important; }
.kicker { font-size: .75rem; letter-spacing: .2em; color: var(--gold); }
.mt-3 { margin-top: 1.5rem; } .mt-4 { margin-top: 2.5rem; }

/* three-up text blocks (neighborhood features, etc.) */
.cols > div:not([class]) { border-top: 1px solid var(--hair-strong); padding-top: 1.25rem; }
.cols-3 > div:not([class]) h3 { font-style: italic; }
.cols h3, .cols h4 { font-style: italic; }

/* ---------- ARTICLES (blog) ---------- */
.article { max-width: 760px; margin: 0 auto; padding: 0 var(--gutter); }
.article h2 { font-size: clamp(2rem, 4vw, 2.75rem); margin: 3.5rem 0 1rem; }
.article h3 { font-size: 1.6rem; font-style: italic; margin: 2.25rem 0 .75rem; }
.article p, .article li { font-size: 1.125rem; line-height: 1.75; color: var(--paper-soft); max-width: none; }
.article ul, .article ol { padding-left: 1.25rem; }
.article li { margin-bottom: .5rem; }
.article blockquote { margin: 2rem 0; padding: .25rem 0 .25rem 1.5rem; border-left: 1px solid var(--gold); font-family: var(--serif); font-style: italic; font-size: 1.6rem; line-height: 1.3; color: var(--paper); }
.article p a, .article li a { color: var(--gold-light); text-decoration: underline; text-decoration-color: var(--hair-strong); text-underline-offset: 3px; border-bottom: 0; }
.article p a:hover, .article li a:hover { color: var(--gold); }
.byline { display: flex; align-items: center; gap: 1rem; padding: 1.25rem 0; margin-bottom: 2rem; border-bottom: 1px solid var(--hair); }
.byline-img { width: 56px; height: 56px; border-radius: 50%; background-size: cover; background-position: center top; flex: none; }
.byline-text { font-size: .9375rem; color: var(--paper-mute); }
.toc { padding: 1.5rem 1.75rem; margin: 0 0 2.5rem; border: 1px solid var(--hair); background: rgba(255,255,255,.03); }
.toc ol { margin: .5rem 0 0; }
.article .toc a { color: var(--paper); text-decoration: none; }
.article .toc a:hover { color: var(--gold-light); }
.ledger { width: 100%; border-collapse: collapse; margin: 1.5rem 0; font-size: 1rem; }
.ledger th, .ledger td { text-align: left; padding: .8rem .75rem; border-bottom: 1px solid var(--hair); color: var(--paper-soft); }
.ledger th { font-size: .75rem; letter-spacing: .16em; text-transform: uppercase; color: var(--gold); font-weight: 600; }
.school-row { display: flex; justify-content: space-between; gap: 1rem; padding: .85rem 0; border-bottom: 1px solid var(--hair); }
.school-row .rating { color: var(--gold-light); font-family: var(--serif); font-size: 1.25rem; }

/* ---------- LISTING / SOLD pages ---------- */
.listing-hero { position: relative; isolation: isolate; min-height: min(70svh, 720px); display: flex; align-items: flex-end; padding: 9rem 0 3rem; overflow: hidden; }
.listing-hero .photo { position: absolute; inset: 0; z-index: -2; background-size: cover; background-position: center; }
.listing-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(14,18,22,.6), rgba(14,18,22,.1) 30%, rgba(14,18,22,.92)); }
.listing-hero .content { width: 100%; }
.listing-hero h1 { font-size: clamp(2.5rem, 6vw, 4.75rem); }
.listing-hero .city { color: var(--gold-light); letter-spacing: .2em; text-transform: uppercase; font-size: .8125rem; margin-bottom: 1.25rem; }
.listing-hero-meta { display: flex; flex-wrap: wrap; gap: 0; margin-top: 1.5rem; border: 1px solid var(--hair); width: fit-content; max-width: 100%; background: var(--glass); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); }
.listing-hero-meta .item { padding: 1rem 1.5rem; border-right: 1px solid var(--hair); }
.listing-hero-meta .item:last-child { border-right: 0; }
.listing-body { display: grid; grid-template-columns: 1.7fr 1fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
@media (max-width: 960px) { .listing-body { grid-template-columns: 1fr; } }
.detail-table { width: 100%; border-collapse: collapse; }
.detail-table th, .detail-table td { text-align: left; padding: .75rem 0; border-bottom: 1px solid var(--hair); color: var(--paper-soft); }
.detail-table th { color: var(--paper-mute); font-weight: 500; width: 40%; }
.sale-callout, .feature-grid { border: 1px solid var(--hair); background: rgba(255,255,255,.03); }
.sale-cell .val.gold, .gold { color: var(--gold-light); }
.listing-aside { padding: 1.75rem; border: 1px solid var(--hair); background: rgba(255,255,255,.03); }
.gallery .g { background-size: cover; background-position: center; }

/* ---------- CALCULATORS / TOOLS ---------- */
.calc-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(1.5rem, 4vw, 3.5rem); align-items: start; }
@media (max-width: 880px) { .calc-grid { grid-template-columns: 1fr; } }
.calc-form, .calc-result, .form-block { padding: clamp(1.5rem, 3vw, 2.5rem); border: 1px solid var(--hair); background: rgba(255,255,255,.03); }
.calc-result .total { font-family: var(--serif); font-size: clamp(2.5rem, 6vw, 4rem); color: var(--gold-light); line-height: 1; }
.total-label, .breakdown-row .lbl { color: var(--paper-mute); }
.breakdown-row { display: flex; justify-content: space-between; padding: .7rem 0; border-bottom: 1px solid var(--hair); }
.input-prefix, .input-suffix { position: relative; }
.field select option { background: var(--mist); color: var(--paper); }
input[type="range"] { accent-color: var(--gold); }
.field-row .field { margin-bottom: 1.5rem; }

/* ---------- misc old components ---------- */
.t-grid, .features, .why-grid, .property-grid, .listings { gap: clamp(1rem, 3vw, 2rem); }
.t-card, .feature, .why-card, .listing, .market-stat-row > * { background: rgba(255,255,255,.03); border: 1px solid var(--hair); }
.t-card blockquote { font-family: var(--serif); font-style: italic; font-size: 1.35rem; line-height: 1.3; }
.stars { color: var(--gold); letter-spacing: .15em; }
.btn-outline-light { color: var(--paper); }
.tag { color: var(--gold-light); }
.check { color: var(--gold); }
.arrow-link { color: var(--gold-light); }
.photo, .portrait-frame { background-color: var(--mist); }
hr { border-top-color: var(--hair); }
a.brand { display: inline-block; }
.error-content, .thanks-content { position: relative; z-index: 1; min-height: 100svh; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 6rem var(--gutter); }
.error-num { font-size: clamp(6rem, 22vw, 14rem); color: var(--gold); margin: 0; line-height: .9; }
.check-circle { display: grid; place-items: center; width: 72px; height: 72px; border: 1px solid var(--gold); border-radius: 50%; color: var(--gold); margin-bottom: 1.5rem; }
.thanks-next-grid, .error-links { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1rem; max-width: 900px; width: 100%; margin-top: 2rem; }
.thanks-next-grid a, .error-links a { display: block; padding: 1.25rem; border: 1px solid var(--hair); }
.thanks-next-grid a:hover, .error-links a:hover { border-color: var(--gold); }
.policy { max-width: 760px; margin: 0 auto; padding: 8rem var(--gutter) 4rem; }
.policy h1 { font-size: clamp(2.5rem, 6vw, 4rem); }
.policy h2 { font-size: 1.75rem; margin-top: 2.5rem; }

/* refinements from pilot review */
.toc { border-left: 1px solid var(--hair) !important; }
.listing-hero-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); width: 100%; max-width: 920px; }
.listing-hero-meta .item { border-bottom: 1px solid var(--hair); }
body:not([data-phone]) > .floating-cta { display: none; }

/* centered text blocks stay centered inside max-width paragraphs */
p.text-center, .text-center p, p[style*="text-align:center"], p[style*="text-align: center"], .form-disclaimer, .team-note, .cta-strip p, .cta-band p, .section-header p { margin-left: auto; margin-right: auto; }
.form-disclaimer { text-align: center; }
.listing-aside .actions { flex-direction: column; align-items: stretch; }
.ty-sub, .error-lead { margin-left: auto; margin-right: auto; }
main.policy ~ .floating-cta { display: none; }
.ty-next p { margin-left: auto; margin-right: auto; }
