.guide-page {background:#f3f5f1;color:#122027;}
.immersive-hero{position:relative;min-height:82vh;display:flex;align-items:flex-end;isolation:isolate;background:#0f1f28;}
.immersive-backdrop{position:absolute;inset:0;background-color:#dce6ea;background-image:var(--guide-photo);background-size:cover;background-position:center center;filter:saturate(1.08) contrast(1.01) brightness(1.08);}
.immersive-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,16,20,.08) 0%,rgba(9,19,26,.32) 42%,rgba(9,17,22,.62) 100%),linear-gradient(120deg,rgba(15,45,52,.24),rgba(255,255,255,.04));}
.immersive-inner{position:relative;z-index:2;max-width:1280px;margin:0 auto;padding:7rem 3rem 4rem;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,.7fr);gap:2rem;align-items:end;width:100%;}
.hero-label,.section-mini,.guide-kicker{font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;color:var(--guide-accent);font-weight:700;}
.hero-copy h1{font-family:'Cormorant Garamond',serif;font-size:clamp(3.3rem,6vw,6.1rem);line-height:.96;color:#f8fbfc;margin:.6rem 0 1rem;}
.hero-lead{max-width:760px;color:rgba(247,251,252,.9);font-size:1.08rem;line-height:1.8;}
.hero-meta{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.5rem;}
.hero-meta span{padding:.65rem 1rem;border-radius:999px;background:rgba(255,255,255,.08);backdrop-filter:blur(10px);color:#edf7fb;border:1px solid rgba(255,255,255,.14);font-size:.82rem;}
.hero-note{padding:1.25rem 1.35rem;border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(247,243,236,.90));backdrop-filter:blur(18px);border:1px solid rgba(20,36,44,.08);color:#162a33;box-shadow:0 20px 50px rgba(0,0,0,.12);}
.hero-note-title{font-family:'Cormorant Garamond',serif;font-size:1.6rem;color:#162a33;margin-bottom:.55rem;}
.hero-note p{line-height:1.8;font-size:.96rem;color:#253a43;}
.guide-intro-wrap{background:linear-gradient(180deg,#f3f5f1 0%,#eef4f7 100%);padding:4rem 3rem 1rem;}
.guide-intro{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:2rem;align-items:start;}
.guide-intro h2,.guide-section h2,.cta-band h2,.generic-hero h1,.generic-section h2{font-family:'Cormorant Garamond',serif;font-weight:500;line-height:1.02;color:#10212b;}
.guide-intro h2{font-size:clamp(2.3rem,4vw,3.5rem);margin:.55rem 0 1rem;}
.guide-intro p,.guide-text p,.generic-copy p,.faq-grid details p,.cta-band p{font-size:1rem;line-height:1.9;color:#30424b;}
.toc-panel{position:sticky;top:104px;padding:1.35rem;border-radius:24px;background:#fff;border:1px solid rgba(16,33,43,.08);box-shadow:0 15px 40px rgba(25,42,52,.09);}
.toc-title{font-size:.86rem;letter-spacing:.16em;text-transform:uppercase;color:var(--guide-deep);margin-bottom:.9rem;font-weight:700;}
.toc-links{display:grid;gap:.45rem;}
.toc-links a{color:#173444;text-decoration:none;padding:.55rem .2rem;border-bottom:1px solid rgba(22,52,68,.08);transition:.2s ease;}
.toc-links a:hover{color:var(--guide-deep);padding-left:.35rem;}
.scenic-band{padding:2rem 3rem 0;background:linear-gradient(180deg,#eef4f7 0%,#f7faf8 100%);}
.scenic-band-inner{max-width:1280px;margin:0 auto;padding:1.4rem 1.6rem;border-left:4px solid var(--guide-accent);background:rgba(255,255,255,.75);backdrop-filter:blur(6px);}
.scenic-band-inner p{font-family:'Cormorant Garamond',serif;font-size:1.8rem;line-height:1.22;color:#1c3140;max-width:920px;}
.guide-article{max-width:980px;margin:0 auto;padding:2.5rem 3rem 4rem;}
.guide-section{padding:2rem 0;border-bottom:1px solid rgba(23,52,68,.08);}
.guide-section h2{font-size:clamp(2rem,3.2vw,2.9rem);margin:.45rem 0 1rem;}
.mini-links-wrap{padding:0 3rem 4rem;max-width:1280px;margin:0 auto;}
.mini-links-title{font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;color:#415862;margin-bottom:1rem;font-weight:700;}
.mini-links{display:flex;flex-wrap:wrap;gap:.75rem;}
.mini-link{padding:.8rem 1rem;border-radius:999px;text-decoration:none;color:#173444;background:#fff;border:1px solid rgba(22,52,68,.11);transition:.2s ease;}
.mini-link:hover,.mini-link.active{background:var(--guide-deep);border-color:var(--guide-deep);color:#fff;transform:translateY(-1px);}
.cta-band{max-width:1280px;margin:0 auto 4rem;padding:2rem 2.2rem;border-radius:30px;background:linear-gradient(135deg,var(--guide-deep),#14262f);display:flex;justify-content:space-between;gap:1.5rem;align-items:center;color:#edf6f8;box-shadow:0 20px 50px rgba(16,33,43,.18);}
.cta-band h2{color:#fff;font-size:clamp(2rem,3vw,3rem);margin:.45rem 0 .8rem;}
.cta-band p{color:rgba(237,246,248,.86);max-width:700px;}
.generic-page{background:linear-gradient(180deg,#f5f5f1 0%,#f1f5f7 100%);} 
.generic-hero{position:relative;min-height:68vh;display:flex;align-items:flex-end;background:#12222b;overflow:hidden;}
.generic-hero::before{content:'';position:absolute;inset:0;background-color:#dce6ea;background-image:var(--guide-photo);background-size:cover;background-position:center;opacity:.48;filter:saturate(1.02) brightness(1.06);} 
.generic-hero::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(12,22,27,.72));}
.generic-hero-inner{position:relative;z-index:1;max-width:1240px;margin:0 auto;padding:6.5rem 3rem 4rem;width:100%;}
.generic-hero h1{font-size:clamp(3.2rem,6vw,5.8rem);color:#f9fbfb;margin:.8rem 0 1rem;}
.generic-hero p{max-width:820px;color:rgba(249,251,251,.9);font-size:1.06rem;line-height:1.85;}
.generic-main{max-width:1180px;margin:0 auto;padding:3rem 3rem 0;}
.generic-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:2rem;}
.generic-section{padding:2rem 0;border-bottom:1px solid rgba(22,52,68,.08);} 
.generic-section h2{font-size:clamp(1.9rem,3vw,2.7rem);margin:.5rem 0 1rem;}
.local-guide-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.8rem;margin-top:1.2rem;}
.local-guide-grid a{text-decoration:none;padding:1rem 1.05rem;border-radius:20px;background:#fff;border:1px solid rgba(22,52,68,.1);color:#173444;}
.local-guide-grid a:hover{background:#173444;color:#fff;}
.faq-grid{display:grid;gap:.9rem;margin-top:1rem;}
.faq-grid details{background:#fff;border:1px solid rgba(22,52,68,.09);border-radius:18px;padding:1rem 1.1rem;}
.faq-grid summary{cursor:pointer;font-weight:600;color:#153340;}
@media (max-width: 940px){.immersive-inner,.guide-intro{grid-template-columns:1fr}.toc-panel{position:relative;top:auto}.cta-band{flex-direction:column;align-items:flex-start}.guide-article,.guide-intro-wrap,.scenic-band,.mini-links-wrap,.generic-main,.immersive-inner,.generic-hero-inner{padding-left:1.35rem;padding-right:1.35rem;}}


/* global consistency refresh */
html, body { min-height: 100%; }
body { min-height: 100vh; display: flex; flex-direction: column; }
.page-content { flex: 1 0 auto; display: flex; flex-direction: column; }
footer { margin-top: auto; }
.site-header { backdrop-filter: blur(10px); background: rgba(12,22,19,0.94); box-shadow: 0 10px 32px rgba(0,0,0,0.16); }
.site-nav { gap: 0.35rem; justify-content: flex-end; }
.nav-dropdown { box-shadow: 0 18px 45px rgba(0,0,0,0.22); }
.sidebar { background: linear-gradient(180deg,#0f1f1a 0%,#142821 100%); border-left: 1px solid rgba(200,164,90,0.18); }
.sidebar-links li a { color: #f3eee4 !important; letter-spacing: 0.08em; text-transform: uppercase; font-size: 0.82rem; }
.sidebar-links li a.active, .sidebar-links li a:hover { color: var(--gold) !important; }
.sidebar-logo { color: #fff; }
.sidebar-logo span { color: var(--gold); }
.footer-inner { max-width: 1280px; margin: 0 auto; }
.footer-top { align-items: flex-start; }
.footer-bottom { gap: 1rem; }
.generic-page-shell .generic-main { padding-bottom: 3rem; }
.generic-page-shell .generic-section:last-child { border-bottom: none; }
.cta-band { align-items: flex-start; }
.cta-band > div { flex: 1 1 580px; min-width: 0; }
.cta-band .btn-primary { flex: 0 0 auto; align-self: center; white-space: nowrap; }

/* richer guide layouts */
.immersive-hero { min-height: 88vh; }
.immersive-backdrop { transform: scale(1.02); }
.loc-tacoma .immersive-backdrop, .loc-seattle .immersive-backdrop, .loc-everett .immersive-backdrop, .loc-bremerton .immersive-backdrop { background-position: center 35%; }
.loc-gigharbor .immersive-backdrop, .loc-lakebay .immersive-backdrop, .loc-longbranch .immersive-backdrop { background-position: center 52%; }
.loc-puyallup .immersive-backdrop, .loc-yelm .immersive-backdrop, .loc-auburn .immersive-backdrop { background-position: center 42%; }
.guide-intro-wrap { padding-top: 4.8rem; }
.guide-intro { gap: 2.8rem; }
.guide-intro > div:first-child { max-width: 830px; }
.toc-panel { background: rgba(255,255,255,0.86); backdrop-filter: blur(20px); border-radius: 28px; box-shadow: 0 22px 55px rgba(12,26,34,0.10); }
.toc-links a { font-size: 0.95rem; line-height: 1.45; }
.scenic-band { padding-top: 2.4rem; }
.scenic-band-inner { background: transparent; border: none; padding: 0; }
.scenic-band-inner p { max-width: 760px; color: #223c4b; }
.guide-article { max-width: 1140px; padding-top: 2.7rem; }
.guide-section { position: relative; border-bottom: none; padding: 2.6rem 0 1.6rem; }
.guide-section::after { content: ''; display: block; height: 1px; background: linear-gradient(90deg,transparent,rgba(32,58,74,0.12),transparent); margin-top: 2rem; }
.guide-section:last-child::after { display: none; }
.guide-section h2 { max-width: 700px; }
.guide-text { max-width: 720px; }
.guide-text p + p { margin-top: 1rem; }
.guide-section.layout-left .guide-text, .guide-section.layout-left h2 { margin-left: 0; margin-right: auto; text-align: left; }
.guide-section.layout-right .guide-text, .guide-section.layout-right h2, .guide-section.layout-right .guide-kicker { margin-left: auto; text-align: left; max-width: 640px; }
.guide-section.layout-center .guide-kicker, .guide-section.layout-center h2, .guide-section.layout-center .guide-text { margin-left: auto; margin-right: auto; text-align: center; max-width: 760px; }
.guide-section.layout-split { display: grid; grid-template-columns: minmax(0,0.95fr) minmax(260px,0.7fr); gap: 2.4rem; align-items: start; }
.guide-section.layout-split .guide-kicker, .guide-section.layout-split h2 { grid-column: 1; }
.guide-section.layout-split .guide-text { grid-column: 1; max-width: unset; }
.guide-section.layout-split::before { content: ''; grid-column: 2; grid-row: 1 / span 3; align-self: stretch; border-radius: 28px; background: linear-gradient(180deg,rgba(255,255,255,0.25),rgba(255,255,255,0.02)), linear-gradient(135deg,var(--guide-accent),rgba(255,255,255,0.2)); min-height: 220px; box-shadow: inset 0 0 0 1px rgba(255,255,255,0.2); }
.loc-tacoma .guide-section.layout-right, .loc-seattle .guide-section.layout-right, .loc-bremerton .guide-section.layout-right { padding-right: 2rem; }
.loc-gigharbor .guide-section.layout-left, .loc-lakebay .guide-section.layout-left, .loc-longbranch .guide-section.layout-left { padding-left: 0.6rem; }
.loc-puyallup .guide-section.layout-center h2, .loc-auburn .guide-section.layout-center h2, .loc-yelm .guide-section.layout-center h2 { max-width: 820px; }
.loc-olympia .hero-copy h1, .loc-bremerton .hero-copy h1 { max-width: 9ch; }
.loc-gigharbor .hero-copy h1, .loc-universityplace .hero-copy h1 { max-width: 12ch; }
.loc-federalway .hero-copy h1 { max-width: 10ch; }
@media (max-width: 940px) {
  .guide-section.layout-split { display: block; }
  .guide-section.layout-split::before { display: none; }
  .guide-section.layout-right, .guide-section.layout-left, .guide-section.layout-center { padding-left: 0; padding-right: 0; }
  .cta-band .btn-primary { align-self: flex-start; }
}

.generic-page-shell .generic-layout > .generic-section:last-of-type {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 1.25rem 2rem;
  align-items: center;
  padding: 2.4rem 0 0.6rem;
}
.generic-page-shell .generic-layout > .generic-section:last-of-type .section-mini,
.generic-page-shell .generic-layout > .generic-section:last-of-type h2,
.generic-page-shell .generic-layout > .generic-section:last-of-type .generic-copy {
  grid-column: 1;
}
.generic-page-shell .generic-layout > .generic-section:last-of-type .btn-primary {
  grid-column: 2;
  grid-row: 1 / span 3;
  align-self: center;
  justify-self: end;
  white-space: nowrap;
}
@media (max-width: 760px) {
  .generic-page-shell .generic-layout > .generic-section:last-of-type {
    grid-template-columns: 1fr;
  }
  .generic-page-shell .generic-layout > .generic-section:last-of-type .btn-primary {
    grid-column: 1;
    grid-row: auto;
    justify-self: start;
  }
}

/* city specific refresh */
.buyer-page .hero-note{background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(247,243,236,.92));}
.seller-page .hero-note{background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(246,240,231,.90));color:#162a33;border:1px solid rgba(20,36,44,.08);}
.seller-page .hero-note p,.seller-page .hero-note-title{color:#162a33;}
.seller-page .immersive-backdrop{filter:saturate(1.08) contrast(1.01) brightness(1.04);}
.buyer-page .immersive-backdrop{filter:saturate(1.06) contrast(1.01) brightness(1.08);}
.toc-links a{font-size:.94rem;line-height:1.42;}


/* market report and resource sections */
.quick-resource-panel{margin:-1.2rem 0 1rem;padding:1.6rem;border-radius:28px;background:linear-gradient(135deg,rgba(255,255,255,.86),rgba(236,244,242,.92));box-shadow:0 18px 48px rgba(17,38,48,.10);border:1px solid rgba(22,52,68,.08);display:flex;align-items:center;justify-content:space-between;gap:1.3rem;flex-wrap:wrap;}
.quick-resource-panel h2{font-size:clamp(1.8rem,2.8vw,2.5rem);margin:.2rem 0 .5rem;color:#10212b;}
.quick-resource-panel p{max-width:700px;line-height:1.75;color:#31454f;margin:0;}
.resource-actions{display:flex;gap:.8rem;flex-wrap:wrap;}
.resource-actions a,.market-city-grid a,.report-directory a{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border-radius:999px;padding:.9rem 1.15rem;font-weight:700;transition:.22s ease;border:1px solid rgba(21,51,64,.14);}
.resource-actions a:first-child,.market-city-grid a,.report-directory a{background:#153340;color:#fff;box-shadow:0 10px 26px rgba(21,51,64,.16);}
.resource-actions a:nth-child(2){background:#fff;color:#153340;}
.resource-actions a:hover,.market-city-grid a:hover,.report-directory a:hover{transform:translateY(-2px);box-shadow:0 16px 36px rgba(21,51,64,.22);}
.market-page{background:radial-gradient(circle at top left,rgba(159,199,191,.26),transparent 38%),linear-gradient(180deg,#f6f7f1 0%,#edf4f6 45%,#f8faf7 100%);color:#14252e;}
.market-hero{position:relative;overflow:hidden;min-height:72vh;display:flex;align-items:flex-end;background:#132a35;}
.market-hero:before{content:'';position:absolute;inset:0;background-image:var(--guide-photo);background-size:cover;background-position:center;filter:saturate(1.05) brightness(1.04);opacity:.48;}
.market-hero:after{content:'';position:absolute;inset:0;background:linear-gradient(105deg,rgba(10,24,31,.88) 0%,rgba(10,24,31,.58) 46%,rgba(10,24,31,.18) 100%);}
.market-hero-inner{position:relative;z-index:1;max-width:1240px;margin:0 auto;padding:7rem 3rem 4rem;width:100%;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.7fr);gap:3.5rem;align-items:end;}
.market-hero h1{font-family:'Cormorant Garamond',serif;font-size:clamp(3.1rem,6vw,5.7rem);line-height:.98;margin:.65rem 0 1rem;color:#fff;font-weight:500;}
.market-hero p{max-width:780px;color:rgba(255,255,255,.9);font-size:1.06rem;line-height:1.82;}
.market-card{background:rgba(255,255,255,.92);border:1px solid rgba(255,255,255,.18);border-radius:28px;padding:1.35rem;box-shadow:0 24px 60px rgba(0,0,0,.16);margin-left:1.5rem;}
.market-card h2,.market-section h2,.market-index h2{font-family:'Cormorant Garamond',serif;color:#112934;font-weight:500;line-height:1.08;}
.market-card h2{font-size:2rem;margin:.3rem 0 .7rem;}
.market-card p{color:#253c47;font-size:.97rem;}
.market-shell{max-width:1240px;margin:0 auto;padding:3rem;}
.market-intro-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.55fr);gap:2rem;align-items:start;margin-bottom:2.4rem;}
.market-index{background:#fff;border-radius:30px;padding:1.6rem;border:1px solid rgba(22,52,68,.08);box-shadow:0 16px 42px rgba(22,52,68,.08);}
.market-index h2{font-size:2.45rem;margin:.2rem 0 .7rem;}
.market-index p{line-height:1.8;color:#344954;}
.market-city-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:.85rem;margin-top:1.3rem;}
.report-directory{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.2rem;}
.report-directory a{background:#fff;color:#153340;border-color:rgba(21,51,64,.15);box-shadow:none;}
.market-section{margin:2.5rem 0;padding:2.2rem;border-radius:34px;background:rgba(255,255,255,.72);border:1px solid rgba(22,52,68,.08);box-shadow:0 18px 45px rgba(22,52,68,.08);}
.market-section:nth-of-type(even){background:linear-gradient(135deg,rgba(255,255,255,.86),rgba(241,247,244,.75));}
.market-section h2{font-size:clamp(2.1rem,3.5vw,3.5rem);margin:.4rem 0 1rem;}
.market-section .lead{font-size:1.06rem;line-height:1.86;color:#2f4550;max-width:930px;}
.period-tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.4rem 0 1.2rem;}
.period-tabs button{border:1px solid rgba(21,51,64,.16);background:#fff;color:#153340;border-radius:999px;padding:.65rem .95rem;cursor:pointer;font-weight:700;}
.period-tabs button.active{background:#153340;color:#fff;}
.period-panel{display:none;grid-template-columns:minmax(0,.85fr) minmax(280px,.62fr);gap:1.35rem;align-items:start;}
.period-panel.active{display:grid;}
.period-panel p{line-height:1.82;color:#30454f;}
.metric-list{display:grid;gap:.7rem;}
.metric-list div{padding:.85rem 1rem;border-radius:18px;background:rgba(21,51,64,.06);color:#18313c;line-height:1.45;}
.reference-names{margin-top:1.3rem;padding-top:1rem;border-top:1px solid rgba(22,52,68,.1);font-size:.89rem;line-height:1.7;color:#4f626c;}
.bot-note{font-size:.9rem;color:#53666f;line-height:1.7;}
@media(max-width:900px){.market-hero-inner,.market-intro-grid,.period-panel{grid-template-columns:1fr}.market-shell,.market-hero-inner{padding-left:1.35rem;padding-right:1.35rem}.quick-resource-panel{align-items:flex-start}.resource-actions{width:100%}.resource-actions a{flex:1 1 220px}}

/* ===== FIX: Hero photo preload - eliminate grey flash ===== */
.immersive-backdrop, .generic-hero::before, .market-hero::before {
  background-color: #0e1e28;
  background-image: var(--guide-photo);
  background-size: cover;
  background-position: center;
  will-change: opacity;
}
.immersive-backdrop {
  filter: saturate(1.08) contrast(1.01) brightness(1.08);
  transition: none !important;
}
.generic-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: #0e1e28;
  background-image: var(--guide-photo);
  background-size: cover;
  background-position: center;
  opacity: .48;
  filter: saturate(1.02) brightness(1.06);
  transition: none !important;
}

/* ===== FIX: Footer full-width on buyers/sellers pages ===== */
.generic-page-shell footer,
.generic-page footer {
  width: 100%;
  box-sizing: border-box;
}
.generic-page-shell .generic-layout {
  padding-bottom: 0;
}
/* Fix footer nested inside generic-layout */
.generic-layout > footer {
  margin-left: -3rem;
  margin-right: -3rem;
  width: calc(100% + 6rem);
}
@media (max-width: 940px) {
  .generic-layout > footer {
    margin-left: -1.35rem;
    margin-right: -1.35rem;
    width: calc(100% + 2.7rem);
  }
}

/* Fix "Let's build" / last CTA section in generic pages */
.generic-page-shell .generic-layout > .generic-section:last-of-type {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem 2rem;
  padding: 2.5rem 2.2rem;
  border-radius: 30px;
  background: linear-gradient(135deg, #173444, #0e2330);
  color: #edf6f8;
  border-bottom: none;
  margin-bottom: 2.5rem;
}
.generic-page-shell .generic-layout > .generic-section:last-of-type .section-mini {
  color: rgba(159,199,191,0.85);
  width: 100%;
}
.generic-page-shell .generic-layout > .generic-section:last-of-type h2 {
  color: #fff;
  font-size: clamp(2rem,3vw,3rem);
  margin: .3rem 0 .6rem;
  flex: 1 1 400px;
}
.generic-page-shell .generic-layout > .generic-section:last-of-type .generic-copy {
  flex: 1 1 400px;
}
.generic-page-shell .generic-layout > .generic-section:last-of-type .generic-copy p {
  color: rgba(237,246,248,.86);
}
.generic-page-shell .generic-layout > .generic-section:last-of-type .btn-primary {
  flex: 0 0 auto;
  align-self: center;
  white-space: nowrap;
  background: #9fc7bf;
  color: #0f1f25;
  border: none;
  padding: 1rem 1.8rem;
  border-radius: 999px;
  font-weight: 700;
  text-decoration: none;
  display: inline-block;
}

/* ===== MARKET REPORT: Tech/Data aesthetic overhaul ===== */
.market-page {
  background: #080f15;
  color: #d8eaf2;
}
.market-shell {
  background: #080f15;
}
.market-intro-grid {
  background: transparent;
}
.market-index {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(100,180,220,.12);
  box-shadow: 0 0 0 1px rgba(100,180,220,.05), 0 16px 42px rgba(0,0,0,.35);
  color: #d8eaf2;
}
.market-index h2 { color: #eef6fb; }
.market-index p { color: #9bb8c8; }
.report-directory a {
  background: rgba(255,255,255,.05);
  color: #9fc7bf;
  border-color: rgba(100,180,220,.18);
}
.report-directory a:hover { background: rgba(159,199,191,.15); }
.market-section {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(100,180,220,.10);
  box-shadow: 0 0 0 1px rgba(100,180,220,.04), 0 18px 45px rgba(0,0,0,.30);
  color: #d8eaf2;
  position: relative;
  overflow: hidden;
}
.market-section::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(100,200,220,.4), transparent);
  pointer-events: none;
}
.market-section:nth-of-type(even) {
  background: rgba(100,180,220,.04);
}
.market-section h2 { color: #eef6fb; }
.market-section .lead { color: #9bb8c8; }
.market-card {
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(100,180,220,.18);
  color: #d8eaf2;
}
.market-card h2 { color: #eef6fb; }
.market-card p { color: #9bb8c8; }
.period-tabs button {
  background: rgba(255,255,255,.06);
  border-color: rgba(100,180,220,.2);
  color: #9bb8c8;
}
.period-tabs button.active {
  background: rgba(100,200,220,.18);
  color: #eef6fb;
  border-color: rgba(100,200,220,.4);
}
.period-panel p { color: #aac6d6; }
.metric-list div {
  background: rgba(100,200,220,.08);
  border: 1px solid rgba(100,200,220,.12);
  color: #d8eaf2;
  border-radius: 12px;
}
.reference-names { color: #587889; border-color: rgba(100,200,220,.12); }
.market-intro-grid { color: #d8eaf2; }
.hero-label, .section-mini { color: #64c8dc !important; }

/* Chart containers */
.chart-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1.4rem;
  margin: 1.6rem 0 1.2rem;
}
.chart-box {
  background: rgba(0,0,0,.28);
  border: 1px solid rgba(100,200,220,.14);
  border-radius: 20px;
  padding: 1.2rem 1.3rem 1rem;
  position: relative;
}
.chart-box-title {
  font-size: .75rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #64c8dc;
  font-weight: 700;
  margin-bottom: .8rem;
}
.chart-box canvas { display: block; }

/* Data stat strip */
.stat-strip {
  display: flex;
  flex-wrap: wrap;
  gap: .9rem;
  margin: 1.2rem 0;
}
.stat-chip {
  padding: .7rem 1.1rem;
  border-radius: 14px;
  background: rgba(100,200,220,.08);
  border: 1px solid rgba(100,200,220,.18);
  flex: 1 1 140px;
  min-width: 120px;
}
.stat-chip-label {
  font-size: .7rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #64c8dc;
  margin-bottom: .25rem;
}
.stat-chip-value {
  font-size: 1.5rem;
  font-weight: 700;
  color: #eef6fb;
  line-height: 1.1;
}
.stat-chip-sub {
  font-size: .75rem;
  color: #587889;
  margin-top: .2rem;
}

/* narrative paragraph style */
.data-narrative {
  line-height: 1.88;
  color: #aac6d6;
  font-size: 1.01rem;
  max-width: 900px;
  margin: 1rem 0 1.4rem;
}
.data-narrative strong { color: #eef6fb; }

/* source tag */
.source-tag {
  display: inline-block;
  font-size: .68rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #64c8dc;
  background: rgba(100,200,220,.08);
  border: 1px solid rgba(100,200,220,.18);
  border-radius: 8px;
  padding: .2rem .55rem;
  margin: 0 .2rem;
  vertical-align: middle;
}

@media (max-width: 900px) {
  .chart-row { grid-template-columns: 1fr; }
  .stat-strip { gap: .6rem; }
}

/* ===== FINAL FIX: Market report background + cleaner scroll behavior ===== */
html {
  scroll-padding-top: calc(var(--nav-h, 80px) + 18px);
  scrollbar-color: #2d6a8a #edf4f6;
}
body {
  scrollbar-color: #2d6a8a #edf4f6;
}
::-webkit-scrollbar {
  width: 14px;
}
::-webkit-scrollbar-track {
  background: linear-gradient(180deg, #edf4f6, #f8faf7);
}
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #2d6a8a, #1a4a6b);
  border: 3px solid #edf4f6;
  border-radius: 999px;
}
::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #3a7fa0, #1a4a6b);
}
.site-header::after {
  content: '';
  position: fixed;
  top: 0;
  right: 0;
  width: 18px;
  height: var(--nav-h, 80px);
  background: rgba(12,22,19,0.96);
  pointer-events: none;
  z-index: 1002;
}
footer {
  position: relative;
  z-index: 2;
}
.market-page {
  background:
    radial-gradient(circle at 12% 0%, rgba(159,199,191,.30), transparent 34%),
    linear-gradient(180deg, #f4f8f6 0%, #eaf3f4 42%, #f8faf7 100%);
  color: #14252e;
}
.market-shell {
  background: transparent;
}
.market-index,
.market-section {
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(22,52,68,.10);
  box-shadow: 0 18px 45px rgba(22,52,68,.09);
  color: #14252e;
}
.market-section:nth-of-type(even) {
  background: linear-gradient(135deg, rgba(255,255,255,.88), rgba(237,246,243,.78));
}
.market-index h2,
.market-section h2,
.market-card h2 {
  color: #112934;
}
.market-index p,
.market-section .lead,
.period-panel p,
.data-narrative,
.market-card p {
  color: #30454f;
}
.data-narrative strong,
.stat-chip-value {
  color: #10212b;
}
.chart-box {
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(21,51,64,.12);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.55);
}
.period-tabs button {
  background: #fff;
  border-color: rgba(21,51,64,.16);
  color: #153340;
}
.period-tabs button.active {
  background: #153340;
  color: #fff;
  border-color: #153340;
}
.metric-list div,
.stat-chip,
.source-tag {
  background: rgba(159,199,191,.16);
  border-color: rgba(21,51,64,.12);
  color: #18313c;
}
.reference-names,
.stat-chip-sub {
  color: #587889;
}
.hero-label,
.section-mini,
.chart-box-title,
.stat-chip-label,
.source-tag {
  color: #2d7483 !important;
}
/* ===== MARKET CARD: must be solid + dark text - sits over the hero photo overlay ===== */
.market-hero .market-card {
  background: rgba(255,255,255,.96);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(22,52,68,.12);
  box-shadow: 0 24px 60px rgba(0,0,0,.22);
  color: #162a33;
}
.market-hero .market-card h2 {
  color: #112934;
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.6rem;
  font-weight: 500;
  margin-bottom: .55rem;
}
.market-hero .market-card p {
  color: #253c47;
  font-size: .96rem;
  line-height: 1.8;
}
.market-section,
.market-index,
.chart-box,
.stat-chip,
.metric-list div,
.report-directory a,
.period-tabs button {
  scroll-margin-top: calc(var(--nav-h, 80px) + 18px);
}
@media (max-width: 760px) {
  ::-webkit-scrollbar { width: 10px; }
  .site-header::after { width: 12px; }
}

/* ===== FIX #1 & #2: Pin hero-note and market-card to bottom-right, never overlap title ===== */
/* Market report pages */
.market-hero-inner {
  align-items: end;
}
.market-hero-inner > div {
  /* left column: let it grow naturally */
  min-width: 0;
}
.market-hero-inner .market-card,
.market-hero aside.market-card {
  align-self: end;
  margin-top: auto;
  margin-left: 0;
  /* keep card at bottom right regardless of title height */
  position: relative;
}

/* Seller guide and buyer guide hero pages */
.immersive-inner {
  align-items: end;
}
.immersive-inner .hero-copy {
  min-width: 0;
}
.immersive-inner .hero-note,
.immersive-inner aside.hero-note {
  align-self: end;
  margin-top: auto;
  position: relative;
}

/* ===== FIX #3: Background image preload — reduce 3-second lag on external photos ===== */
/* Trigger GPU compositing early so the image decodes off the main thread */
.immersive-backdrop,
.generic-hero::before,
.market-hero::before {
  will-change: opacity;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  content-visibility: auto;
}


/* ================================================================
   GUIDE + MARKET REPORT MOBILE OVERHAUL  — May 2026
   ================================================================ */

/* ── Tablet (≤860px): box-pos-fix card stays in column flow ── */
@media (max-width: 860px) {
  .market-hero-inner aside.market-card,
  .immersive-inner aside.hero-note {
    position: static !important;
    width: 100% !important;
    margin-top: 1.4rem;
    border-radius: 0;
  }
  .market-hero-inner { padding-right: 1.4rem !important; }
  .immersive-inner   { padding-right: 1.4rem !important; }
  .market-hero-inner > div:first-child { padding-right: 0 !important; }
}

/* ── Mobile (≤480px) ── */
@media (max-width: 480px) {
  /* Override any per-page box-pos-fix styles */
  .market-hero { min-height: auto !important; }
  .immersive-hero { min-height: 55vh !important; }

  .immersive-inner {
    display: block !important;
    padding: 5rem 1.2rem 2rem !important;
  }
  .immersive-inner aside.hero-note {
    position: static !important;
    width: 100% !important;
    margin-top: 1.4rem;
    border-radius: 0;
  }
  .immersive-inner h1 {
    font-size: clamp(1.9rem, 9vw, 3rem) !important;
    white-space: normal !important;
  }
  .immersive-inner .hero-copy { padding-right: 0 !important; }

  .market-hero-inner {
    padding: 5rem 1.2rem 2rem !important;
    padding-right: 1.2rem !important;
  }
  .market-hero-inner aside.market-card {
    position: static !important;
    width: 100% !important;
    margin-top: 1.4rem;
    border-radius: 0;
  }
  .market-hero-inner > div:first-child { padding-right: 0 !important; }
  .market-hero-inner h1 {
    font-size: clamp(1.9rem, 9vw, 3rem) !important;
    white-space: normal !important;
  }

  /* Generic hero (city listings pages etc.) */
  .generic-hero { padding: 3.5rem 0 2.5rem !important; }
  .generic-hero-inner { padding: 0 1.2rem !important; }
  .generic-hero h1 { font-size: clamp(1.8rem, 8vw, 2.8rem) !important; }

  /* Guide article content */
  .guide-article {
    padding: 1.5rem 1.2rem !important;
    font-size: .93rem;
    line-height: 1.72;
  }
  .guide-section {
    padding: 1.6rem 0 .8rem !important;
  }
  .guide-section::after {
    margin-top: 1rem !important;
  }
  .guide-section h2 {
    font-size: clamp(1.3rem, 5.5vw, 1.9rem) !important;
    margin-bottom: .7rem !important;
  }
  .guide-intro-wrap { padding: 1.5rem 1.2rem !important; }
  .guide-intro { grid-template-columns: 1fr !important; }
  .guide-h2 { font-size: clamp(1.4rem, 6vw, 2rem) !important; }
  .guide-h3 { font-size: 1.05rem !important; }

  /* TOC */
  .toc-panel { padding: 1.2rem 1.2rem !important; top: auto !important; position: static !important; }
  .toc-links { columns: 1 !important; font-size: .88rem; }
  .toc-links a { padding: .35rem 0 !important; }

  /* CTA band */
  .cta-band {
    padding: 1.6rem 1.2rem !important;
    margin-bottom: 1.5rem !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: .75rem !important;
    border-radius: 16px !important;
  }
  .cta-band h2 { font-size: clamp(1.4rem, 5.5vw, 2rem) !important; margin-bottom: .4rem !important; }
  .cta-band p { font-size: .9rem !important; line-height: 1.65 !important; margin: 0 !important; }
  .cta-band .section-mini { margin-bottom: .3rem !important; }
  .cta-band > div { padding: 0 !important; }
  .cta-band .btn-primary {
    align-self: stretch !important;
    text-align: center !important;
    width: 100% !important;
    margin-top: .25rem !important;
    padding: .8rem 1.2rem !important;
  }

  /* Scenic band */
  .scenic-band      { padding: 2rem 1.2rem !important; }
  .scenic-band h2   { font-size: clamp(1.5rem, 6vw, 2.2rem) !important; }
  .scenic-band p    { font-size: .9rem; }

  /* Mini links strip */
  .mini-links-wrap  { padding: 1.5rem 1.2rem !important; }
  .mini-links-grid  { grid-template-columns: repeat(2, 1fr) !important; gap: .45rem; }
  .mini-link-item   { padding: .9rem .8rem !important; font-size: .82rem; }

  /* Market report shell */
  .market-shell     { padding: 2rem 1.2rem !important; }
  .market-intro-grid { grid-template-columns: 1fr !important; gap: 1.5rem; }
  .data-grid        { grid-template-columns: repeat(2, 1fr) !important; gap: .5rem; }
  .data-cell        { padding: .9rem .7rem !important; }
  .data-cell-val    { font-size: clamp(1.2rem, 5vw, 1.6rem) !important; }
  .period-panel     { grid-template-columns: repeat(2, 1fr) !important; }
  .quick-resource-panel { padding: 1.2rem !important; flex-direction: column; gap: .9rem; }
  .resource-actions { width: 100% !important; flex-direction: column; gap: .5rem; }
  .resource-actions a { flex: 1 1 auto !important; text-align: center; }

  /* Global inner content wrappers */
  .guide-intro-wrap,
  .guide-article-wrap,
  .scenic-band,
  .mini-links-wrap,
  .generic-main {
    padding-left: 1.2rem !important;
    padding-right: 1.2rem !important;
  }
}

/* ================================================================
   MARKET REPORT MOBILE FIX — comprehensive overhaul
   ================================================================ */

@media (max-width: 600px) {
  /* Market section cards: reduce padding so content doesn't overflow */
  .market-section {
    padding: 1.5rem 1.1rem !important;
    border-radius: 20px !important;
    margin: 1.2rem 0 !important;
  }
  .market-index {
    padding: 1.2rem 1rem !important;
    border-radius: 20px !important;
  }

  /* Period tabs: wrap cleanly */
  .period-tabs {
    gap: .35rem !important;
    flex-wrap: wrap !important;
    margin: 1rem 0 .85rem !important;
  }
  .period-tabs button {
    padding: .45rem .75rem !important;
    font-size: .75rem !important;
    border-radius: 999px !important;
  }

  /* Period panel: force single column */
  .period-panel,
  .period-panel.active {
    grid-template-columns: 1fr !important;
    display: block !important;
  }
  .period-panel.active {
    display: block !important;
  }

  /* Charts: force single column and prevent overflow */
  .chart-row {
    grid-template-columns: 1fr !important;
    gap: .9rem !important;
    margin: 1rem 0 .8rem !important;
  }
  .chart-box {
    padding: 1rem !important;
    border-radius: 14px !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }
  .chart-box canvas {
    max-width: 100% !important;
    height: auto !important;
  }
  .chart-box-title {
    font-size: .68rem !important;
    margin-bottom: .6rem !important;
  }

  /* Data narrative text */
  .data-narrative {
    font-size: .9rem !important;
    line-height: 1.72 !important;
    margin-bottom: .8rem !important;
  }

  /* Stat chips on market snapshot */
  .stat-strip {
    gap: .5rem !important;
  }
  .stat-chip {
    flex: 1 1 calc(50% - .25rem) !important;
    min-width: 0 !important;
    padding: .55rem .7rem !important;
    border-radius: 12px !important;
  }
  .stat-chip-value {
    font-size: 1.2rem !important;
  }
  .stat-chip-label {
    font-size: .62rem !important;
  }
  .stat-chip-sub {
    font-size: .68rem !important;
  }

  /* Market intro grid */
  .market-intro-grid {
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
    margin-bottom: 1.5rem !important;
  }

  /* Market section heading */
  .market-section h2 {
    font-size: clamp(1.6rem, 6vw, 2.4rem) !important;
    margin-bottom: .75rem !important;
  }
  .market-section .lead {
    font-size: .9rem !important;
    line-height: 1.72 !important;
  }

  /* Report directory links */
  .report-directory {
    flex-direction: column !important;
    gap: .5rem !important;
  }
  .report-directory a {
    text-align: center !important;
    width: 100% !important;
  }

  /* Market hero */
  .market-hero {
    min-height: 52vh !important;
  }
  .market-hero h1 {
    font-size: clamp(2rem, 8vw, 3.2rem) !important;
  }
  .market-hero p {
    font-size: .9rem !important;
  }

  /* Shell padding */
  .market-shell {
    padding: 1.5rem 1rem !important;
  }

  /* Section mini label */
  .section-mini {
    font-size: .62rem !important;
  }

  /* Source tags */
  .source-tag {
    font-size: .65rem !important;
    padding: .15rem .45rem !important;
  }

  /* Reference names */
  .reference-names {
    font-size: .8rem !important;
    margin-top: 1rem !important;
    padding-top: .8rem !important;
  }
}