﻿.community-hero-eyebrow { color: var(--accent) !important; margin-bottom: 1rem; }

.community-hero-gradient {background:radial-gradient(ellipse at 30% 20%, rgba(120, 188, 200, 0.35), transparent 55%), radial-gradient(ellipse at 80% 80%, rgba(0, 30, 40, 0.55), transparent 60%), linear-gradient(135deg, var(--ink-deep) 0%, var(--ink-deep-hi) 100%);}
.community-hero {height:88vh; min-height:600px;}
.community-hero-overlay {padding:0 var(--pad-x);}

.community-hero-gradient::after {content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0, 30, 40, 0.25) 0%, rgba(0, 30, 40, 0.1) 35%, rgba(0, 30, 40, 0.55) 100%);}
.community-hero-title {margin:0 0 1.4rem; max-width:900px;}
.community-promo-banner {background:var(--ink-deep); padding:0.95rem var(--pad-x); font-size:0.95rem;}
.community-promo-banner strong {color:var(--accent); font-weight:600; letter-spacing:0.04em; font-size:0.78rem; margin-right:0.5rem;}

.community-stats {background:var(--ink-deep); grid-template-columns:repeat(4, 1fr); padding:2.5rem var(--pad-x); gap:2rem;}
.community-stat {border-right:1px solid rgba(255, 255, 255, 0.12);}
.community-stat-num {font-family:var(--font-display); font-size:clamp(1.6rem, 2.5vw, 2.4rem); color:var(--accent); letter-spacing:-0.01em;}
.community-stat-label {font-size:0.7rem; letter-spacing:0.22em; color:rgba(255, 255, 255, 0.7);}
.community-stat:last-child {border-right:none;}

.listing-carousel {margin-bottom:4rem;}
.listing-carousel-head {gap:2rem; margin-bottom:2rem;}
.listing-carousel-head .eyebrow {margin-bottom:0.75rem;}
.listing-carousel-head h2 {font-family:var(--font-display); font-size:clamp(1.9rem, 3.4vw, 2.8rem); line-height:1.05; letter-spacing:-0.01em; color:var(--ink-deep);}
.listing-carousel-head h2 em {font-family:var(--font-body); font-style:italic; color:var(--accent);}

.listing-track {
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:minmax(280px, calc((100% - 3rem) / 3.2));
    gap:1.5rem;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scroll-behavior:smooth;
    padding:0.25rem 0.25rem 1.5rem;
    scrollbar-width:thin;
    scrollbar-color:var(--ink-soft) var(--canvas-soft);
}
.listing-track > .plan-card {scroll-snap-align:start;}
.plan-card-image{aspect-ratio:4 / 2.5;}
.plan-card-image img {transition:transform .5s ease;}
.plan-card-image:hover img {transform:scale(1.04);}

.qmi-card .status-pill {top:0.85rem; left:0.85rem; background:var(--accent); color:var(--ink-deep);font-size:0.58rem; letter-spacing:0.22em; padding:0.42rem 0.75rem; box-shadow:0 2px 8px rgba(0, 62, 81, 0.18);}
.qmi-card .status-pill.under-construction {background:rgba(255, 255, 255, 0.95); color:var(--ink-deep);}
.qmi-address {font-size:0.72rem; letter-spacing:0.05em; color:var(--ink-mute); margin:0 0 0.45rem; line-height:1.4;}
.qmi-ready { font-size:0.6rem; letter-spacing:0.22em; font-weight:600; color:var(--ink-deep); background:rgba(155, 211, 221, 0.3); padding:0.35rem 0.7rem; margin:0 0 1rem; }

.plan-card-name {bottom:1.1rem; left:1.25rem; right:1.25rem; font-family:var(--font-display); font-size:clamp(1.6rem, 2.2vw, 2.2rem); letter-spacing:-0.005em;}
.plan-card-image::after {content:''; position:absolute; inset:0; background:linear-gradient(to top, rgba(0, 30, 40, 0.55) 0%, rgba(0, 30, 40, 0) 55%);
pointer-events:none;}
.plan-card-meta {padding:1.25rem 0 0; gap:0.7rem; border-top:1px solid var(--rule); margin-top:1.25rem;}
.qmi-address {font-family:var(--font-body); font-size:0.72rem; letter-spacing:0.05em; color:var(--ink-mute); margin:0 0 0.45rem; line-height:1.4;}
.plan-card-price {font-size:0.95rem; color:var(--ink-deep);}
.meta-specs {gap:0.4rem; font-size:0.85rem; color:var(--ink-deep);}
.meta-specs li{gap:0.55rem;}
.meta-specs svg {width:22px; height:18px; color:var(--ink-deep);}

/* border-bottom:1.5px solid var(--ink-deep); */
.plan-card-cta {gap:0.4rem; margin-top:0.4rem; font-size:0.72rem; letter-spacing:0.22em; color:var(--ink-deep);  padding-bottom:0.4rem; align-self:flex-start; transition:gap .2s ease;   position:relative; overflow: hidden; transition:gap .3s ease, color .3s ease;}
.plan-card-cta:hover{color: var(--SecondaryClr);}
.plan-card-cta::before{content:""; position:absolute; left:0; bottom:0; width:100%; height:2px; background:var(--ink-deep); transform:translateX(0); transition:transform .45s cubic-bezier(.4,0,.2,1);}
.plan-card-cta::after{content:""; position:absolute; left:calc(-100% - 6px); bottom:0; width:100%; height:2px; background:var(--SecondaryClr); transition:left .45s cubic-bezier(.4,0,.2,1);}
.plan-card-cta:hover::before{transform:translateX(calc(100% + 6px));}
.plan-card-cta:hover::after{left:0;}


.listing-carousel-nav {display:flex; gap:0.6rem; flex-shrink:0; margin-bottom:0.5rem;}
.listing-arrow:disabled {opacity:0.25; cursor:not-allowed;}
.listing-arrow {--size:44px; width:var(--size); height:var(--size); border:1.5px solid var(--ink-deep); background:transparent;
color:var(--ink-deep); cursor:pointer; transition:background .2s ease, color .2s ease, opacity .2s ease;}
.listing-arrow:hover:not(:disabled) {background:var(--ink-deep); color:#fff;}
.listing-arrow svg {--size:16px; width:var(--size); height:var(--size); display:block;}

.community-section-soft{background:#f8f5f0; max-width:none;}
.community-section-soft .section-intro, .community-section-soft .site-plan-grid{max-width:var(--max-w);}
.site-plan-grid {grid-template-columns:minmax(0, 3fr) minmax(0, 1fr); gap:clamp(2rem, 4vw, 2rem);}
.site-plan-map {border:1px solid var(--rule); aspect-ratio:2400 / 1696;}
.site-plan-placeholder {inset:0; background:linear-gradient(135deg, rgba(0, 62, 81, 0.04), rgba(0, 62, 81, 0.12)); border:1px dashed rgba(0, 62, 81, 0.25);}
.site-plan-placeholder span {font-size:0.7rem; font-weight:600;letter-spacing:0.24em; color:rgba(0, 62, 81, 0.5);}
.site-plan-placeholder small {font-size:0.78rem; color:rgba(0, 62, 81, 0.45); letter-spacing:0; text-transform:none;}

.map-meta{background: #003e5250; border-radius: 30px; backdrop-filter: blur(10px);}
.map-meta div{font-size: 12px; color: var(--ink-deep);}
.map-meta div span{width: 14px; height: 14px;}

.site-plan-aside {border:1px solid var(--rule); gap:1.2rem;}
.site-plan-aside-title {font-family:var(--font-body); font-size:0.72rem; font-weight:600; letter-spacing:0.22em; color:var(--ink-deep);}
.site-plan-toggle {grid-template-columns:1fr 1fr; border:1px solid var(--rule); padding:4px; background:rgba(255, 255, 255, 0.6);}
.site-plan-toggle input[type="radio"] {position:absolute; width:1px; height:1px; opacity:0; pointer-events:none;}
.site-plan-toggle label {cursor:pointer; padding:0.7rem 0.5rem; font-family:var(--font-body); font-size:0.68rem; font-weight:600;
letter-spacing:0.14em; color:var(--ink-deep); transition:background .2s ease, color .2s ease;}
.site-plan-toggle input[type="radio"]:checked + label {background:var(--ink-deep); color:#fff;}
.site-plan-toggle input[type="radio"]:focus-visible + label {outline:2px solid var(--ink-deep-hi); outline-offset:2px;}

.site-plan-field {gap:0.4rem;}
.site-plan-group {display:flex; flex-direction:column; gap:1rem;}
.site-plan-field span {font-size:0.65rem; font-weight:600; letter-spacing:0.22em; color:var(--ink-mute);}
.site-plan-cta {margin-top:0.4rem; padding:0.85rem 1rem; font-size:0.62rem;}
.site-plan-group[hidden] {display:none;}
.site-plan-preview {margin-top:0.4rem;}
.site-plan-preview img {aspect-ratio:16 / 9; object-position:center 35%;}
.site-plan-preview-meta {padding:0.85rem 0.2rem 0;}
.site-plan-preview-name {font-size:1.05rem; color:var(--ink-deep);}
.site-plan-preview-price {font-size:0.78rem; color:var(--ink-mute); letter-spacing:0.04em;}

.neighborhood-photos {grid-template-columns:repeat(3, 1fr);}
.neighborhood-photo-placeholder {background:linear-gradient(135deg, rgba(0, 62, 81, 0.06), rgba(0, 62, 81, 0.16)); border:1px dashed rgba(0, 62, 81, 0.3);}
.neighborhood-photo {aspect-ratio:4 / 5;}
.neighborhood-photo-placeholder span {font-size:0.7rem; font-weight:600; letter-spacing:0.22em; color:rgba(0, 62, 81, 0.5);}

.brochure-section {grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); background:var(--ink-deep); min-height:600px;}
.brochure-image-gradient {background:radial-gradient(ellipse at 25% 25%, rgba(120, 188, 200, 0.45), transparent 55%), linear-gradient(135deg, var(--ink-deep) 0%, var(--ink-deep-hi) 100%);}
.brochure-form {padding:clamp(3rem, 6vw, 5rem) clamp(2rem, 5vw, 4rem);}
.brochure-eyebrow {color:var(--accent) !important; margin-bottom:0.5rem;}
.brochure-title {font-family:var(--font-display); font-size:clamp(1.8rem, 3vw, 2.6rem); margin:0 0 0.5rem; letter-spacing:-0.01em; line-height:1.1;}
.brochure-sub {font-size:0.95rem; color:rgba(255, 255, 255, 0.75); margin:0 0 1.2rem; line-height:1.5;}
.form-row {grid-template-columns:1fr 1fr; gap:0.75rem;}
.form-field {gap:0.35rem;}

.form-field span {font-size:0.62rem; font-weight:600; letter-spacing:0.22em; color:rgba(255, 255, 255, 0.6);}
.form-field input, .form-field select {padding:0.7rem 0.95rem; border:1px solid rgba(255, 255, 255, 0.18); background:rgba(255, 255, 255, 0.04); color:#fff; border-radius:4px; font-family:var(--font-body); font-size:0.95rem; transition:border-color .2s ease, background .2s ease;}
.brochure-submit {margin-top:0.5rem; padding:1.1rem 1.6rem; background:var(--accent); color:var(--ink-deep); font-family:var(--font-body); font-size:0.78rem; font-weight:600; letter-spacing:0.22em; cursor:pointer; transition:background .2s ease, transform .15s ease;}
.brochure-submit:hover {background:#b9e0e8; transform:translateY(-1px);}
.form-meta {margin:0.4rem 0 0; font-family:var(--font-body); font-size:0.72rem; color:rgba(255, 255, 255, 0.55); letter-spacing:0.02em;}
.form-field input:focus, .form-field select:focus {outline:none; border-color:var(--accent); background:rgba(255, 255, 255, 0.08);}

@media all and (max-width:960px){
  .hm-100{height: 100%;}
  .community-hero {height:75vh; min-height:500px;}
  .community-stats {grid-template-columns:1fr 1fr; gap:1.5rem; padding:2rem var(--pad-x);}
  .community-stat {border-bottom:1px solid rgba(255, 255, 255, 0.08); padding-bottom:1.5rem;}
  .community-stat:nth-last-child(-n+2) {border-bottom:none; padding-bottom:0;}
  .community-stat:nth-child(2n) {border-right:none;}
  .site-plan-grid, .neighborhood-photos, .brochure-section, .form-row {grid-template-columns:1fr;}
}