/* Kristal Microsite — shared neighbourhood microsite styles.
   Extends the plugin's .hf-* homefinder classes; only NEW hood selectors here.
   House rules: no navy backgrounds (#1a2b4a) — light grey/white only; gold +
   brand accents; compact sections (≤50px). --hf-brand is injected per-domain by
   the plugin layout.php (config color, a forest green for this microsite). */

:root {
    --gold: #c9a84c;
    --gold-dark: #b8943a;
    --ms-ink: #1f2a24;          /* deep green-charcoal for text (NOT a bg) */
    --ms-tint: #f4f7f4;         /* light section tint */
}

/* ── Hood hero ──────────────────────────────────────────────────────────── */
.hf-hero--hood {
    position: relative;
    min-height: 460px;
    display: flex;
    align-items: center;
    /* Photo goes in via inline style or override later; gradient placeholder for
       now so the hero never renders flat/navy before art is dropped in. */
    background: linear-gradient(135deg, #2f5d3a 0%, #20402a 100%);
    background-size: cover;
    background-position: center;
}
.hf-hero--hood .hf-hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(20,30,22,.35) 0%, rgba(20,30,22,.62) 100%);
}
.hf-hero--hood .hf-hero__inner {
    position: relative;
    z-index: 2;
    max-width: 1180px;
    margin: 0 auto;
    padding: 56px 24px;
    color: #fff;
}
.hf-hero--hood .hf-hero__label {
    letter-spacing: .14em;
    font-size: 12.5px;
    text-transform: uppercase;
    opacity: .9;
    margin: 0 0 14px;
}
.hf-hero--hood .hf-hero__title {
    font-size: clamp(2.4rem, 5vw, 3.6rem);
    line-height: 1.05;
    margin: 0 0 14px;
    font-weight: 700;
}
.hf-hero__tagline {
    font-size: clamp(1rem, 2vw, 1.18rem);
    max-width: 620px;
    margin: 0 0 26px;
    opacity: .95;
}
.hf-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

/* ── Buttons (ghost + large) ────────────────────────────────────────────── */
.hf-btn-ghost {
    display: inline-block;
    padding: 12px 22px;
    border-radius: 8px;
    border: 1.5px solid rgba(255,255,255,.85);
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    transition: background .15s ease, color .15s ease;
}
.hf-btn-ghost:hover {
    background: #fff;
    color: var(--ms-ink);
}
.hf-btn-primary--lg {
    padding: 15px 32px;
    font-size: 1.05rem;
}

/* ── Closing CTA (single ask) — light grey, never navy ──────────────────── */
.hf-hood-cta {
    background: var(--ms-tint);
    padding: 50px 0;
}
.hf-hood-cta__inner {
    max-width: 760px;
    margin: 0 auto;
    padding: 0 24px;
    text-align: center;
}
.hf-hood-cta .hf-section__title {
    margin: 0 0 14px;
}
.hf-hood-cta__lead {
    font-size: 1.08rem;
    line-height: 1.6;
    color: #3a463f;
    margin: 0 0 26px;
}
.hf-hood-cta__guide {
    margin: 20px 0 0;
    font-size: .96rem;
    color: #5a665f;
}
.hf-hood-cta__guide a,
.hf-quick-answer__bullets a {
    color: var(--gold-dark);
    font-weight: 600;
}
.hf-hood-cta__guide a:hover,
.hf-quick-answer__bullets a:hover {
    color: var(--gold);
}

/* Quick-answer (live market strip) — gold left accent, compact */
.hf-quick-answer {
    border-left: 4px solid var(--gold);
}

/* ── Editorial guide ────────────────────────────────────────────────────── */
.hf-hero--guide { min-height: 340px; }
.hf-guide__inner {
    max-width: 820px;
    margin: 0 auto;
    padding: 50px 24px 10px;
    color: #2c352f;
    font-size: 1.05rem;
    line-height: 1.7;
}
.hf-guide__inner h2 {
    font-size: 1.5rem;
    margin: 34px 0 10px;
    padding-top: 14px;
    border-top: 1px solid #e7ece8;
}
.hf-guide__inner h2:first-of-type { border-top: 0; padding-top: 0; margin-top: 0; }
.hf-guide__inner h3 { font-size: 1.12rem; margin: 20px 0 6px; color: var(--ms-ink); }
.hf-guide__inner p { margin: 0 0 14px; }
.hf-guide__inner a { color: var(--gold-dark); font-weight: 600; }
.hf-guide__inner a:hover { color: var(--gold); }
.hf-guide .hf-hood-cta { margin-top: 40px; }

/* ── Mobile ─────────────────────────────────────────────────────────────── */
@media (max-width: 600px) {
    .hf-hero--hood { min-height: 380px; }
    .hf-hero--guide { min-height: 280px; }
    .hf-hero__actions { gap: 10px; }
    .hf-btn-ghost, .hf-hero__actions .hf-btn-primary { width: 100%; text-align: center; }
    .hf-guide__inner { padding: 40px 18px 8px; }
}

/* ── Microsite chrome + community pages ─────────────────────────────────── */
.hf-header{background:#fff;border-bottom:1px solid #e7ece8}
.hf-header__inner,.hf-footer__inner{max-width:1080px;margin:0 auto;padding:14px 20px;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.hf-logo{font-weight:700;font-size:1.15rem;color:var(--ms-ink);text-decoration:none}
.hf-nav{display:flex;gap:18px;margin-left:auto;flex-wrap:wrap}
.hf-nav a{color:var(--ms-ink);text-decoration:none;font-size:.95rem}
.hf-nav a:hover{color:var(--hf-brand)}
.hf-footer{background:var(--ms-tint);border-top:1px solid #e7ece8;margin-top:48px}
.hf-footer__inner{flex-direction:column;align-items:flex-start;gap:10px}
.hf-footer__brand{font-weight:700}
.hf-footer-links{display:flex;gap:16px;flex-wrap:wrap}
.hf-footer__disclaimer{font-size:.78rem;color:#5a665f}
.ms-page{max-width:840px;margin:0 auto;padding:28px 20px 0}
.ms-breadcrumb{font-size:.85rem;color:#5a665f;margin-bottom:14px}
.ms-breadcrumb a{color:var(--hf-brand);text-decoration:none}
.ms-breadcrumb__sep{margin:0 6px;color:#b6c0b9}
.ms-quick-answer{background:var(--ms-tint);border-left:3px solid var(--hf-brand);padding:14px 18px;border-radius:6px;margin:0 0 22px;font-size:1.02rem}
.ms-facts{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#e7ece8;border:1px solid #e7ece8;border-radius:8px;overflow:hidden;margin:0 0 22px}
.ms-fact{background:#fff;padding:10px 14px}
.ms-fact__label{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;color:#5a665f;margin:0 0 3px}
.ms-fact__value{display:block;font-weight:600;line-height:1.4}
.ms-page__body h2{margin-top:1.6rem}
.ms-faq{margin:1.4rem 0}
.ms-faq__q{font-weight:600;margin-top:1rem}
.ms-homes-strip{max-width:1080px;margin:36px auto 0;padding:24px 20px;border-top:1px solid #e7ece8}
.ms-homes-strip__title{margin:0 0 14px}
.ms-homes-strip__cta{margin-top:16px}
@media(max-width:600px){.ms-facts{grid-template-columns:1fr}.hf-nav{gap:12px}}

/* ── Community tile grid (hub + homepage band) ──────────────────────────── */
.ms-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin:22px 0}
.ms-tile{display:block;background:#fff;border:1px solid #e7ece8;border-radius:10px;padding:18px;text-decoration:none;transition:box-shadow .15s,transform .15s}
.ms-tile:hover{box-shadow:0 6px 18px rgba(31,42,36,.10);transform:translateY(-2px)}
.ms-tile__label{display:block;font-weight:700;color:var(--ms-ink);font-size:1.05rem}
.ms-tile__desc{display:block;color:#5a665f;font-size:.85rem;margin-top:3px}
.hf-community{background:var(--ms-tint);padding:40px 20px}
.hf-community__inner{max-width:1080px;margin:0 auto}
.hf-community__title{margin:0 0 6px}
.hf-community__lead{color:#3a463f;margin:0}

/* ── Developments (status badge + hub list) ─────────────────────────────── */
.ms-status-badge{display:inline-block;font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;padding:5px 12px;border-radius:999px;margin:0 0 14px}
.ms-status-badge--now-selling{background:#e3f3e8;color:#1f7a3d}
.ms-status-badge--coming-soon{background:#fff3d6;color:#9a6b00}
.ms-status-badge--sold-out{background:#f3e3e3;color:#9a2b2b}
.ms-status-badge--completed{background:#e7ece8;color:#5a665f}
.ms-dev-list h2{margin:1.4rem 0 .4rem;font-size:1.1rem}
.ms-dev-list ul{margin:0 0 1rem;padding-left:1.1rem}
.ms-dev-list li{margin:.3rem 0}

/* ── Amenities list ─────────────────────────────────────────────────────── */
.ms-amenities{margin:1rem 0}
.ms-amenity{padding:12px 0;border-bottom:1px solid #e7ece8}
.ms-amenity:last-child{border-bottom:0}
.ms-amenity__cat{margin:0 0 3px;font-size:1.02rem}
.ms-amenity__note{margin:0;color:#3a463f}