.op-homes-index .op-home-hero { h1 { letter-spacing:.055em; } .op-home-tagline { max-inline-size:58rem; font-size:clamp(1.1rem,1.6vw,1.35rem); } }
.op-listings { padding:4rem 1.5rem;
    >h2,>header { text-align:center; max-inline-size:62rem; margin:0 auto 3rem; }
    .op-listings-grid { display:grid; gap:2rem; max-inline-size:62rem; margin:auto; }

}
.op-listing-card { min-inline-size:0;
    a { position:relative; display:block; color:inherit; text-decoration:none; }
    .op-listing-image { position:relative; overflow:hidden; border-radius:.2rem; aspect-ratio:3/2; img { inline-size:100%; block-size:100%; object-fit:cover; transition:transform .25s; } }
    a:hover img { transform:scale(1.025); }
    .op-listing-caption { padding:1.1rem .2rem; h3 { font-size:1.35rem; line-height:1.35; margin:0 0 .3rem; } p { margin:0; } .op-listing-price { margin-block-start:.4rem; } }
}
.op-property-detail { max-inline-size:66rem; padding:3.5rem 1.5rem 1rem; margin:auto;
    .op-property-gallery { position:relative; }
    .op-property-track { display:grid; grid-auto-flow:column; grid-auto-columns:100%; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; border-radius:.25rem;
        figure { margin:0; scroll-snap-align:start; a { display:block; aspect-ratio:3/2; background:#ebe9e2; } img { display:block; inline-size:100%; block-size:100%; object-fit:cover; } }
    }
    .op-property-gallery-controls { display:flex; align-items:center; justify-content:center; gap:1rem; padding-block:.7rem; button { background:transparent; color:var(--op-slate); border:1px solid #bbb; padding:0 1rem; font-size:2rem; line-height:1.2; } }
    .op-property-facts { display:grid; gap:2rem; padding-block:3rem 4rem;
        h1 { font-size:clamp(2.1rem,4vw,3.6rem); font-weight:400; line-height:1.2; letter-spacing:.055em; text-transform:uppercase; overflow-wrap:anywhere; margin:1rem 0 1.5rem; }
        .op-property-neighborhood { font-size:.95rem; text-transform:uppercase; letter-spacing:.22em; }
        .op-property-status { color:var(--op-clay); text-transform:uppercase; letter-spacing:.1em; }
        .op-property-price { font-size:1.8rem; margin:0 0 1rem; }
        dl { margin:0 0 1.5rem; div { display:flex; justify-content:space-between; gap:1rem; padding:.55rem 0; border-block-end:1px solid #ddd; } dt { color:#606060; } dd { margin:0; text-align:end; } }
        .op-property-map { display:block; margin-block-end:1.5rem; }
    }
    .op-property-plans { border-block-start:1px solid #ddd; padding-block:3rem; h2 { text-align:center; margin-block-end:2rem; }
        details { border-block-end:1px solid #ccc; padding:1rem 0; } summary { cursor:pointer; font-size:1.2rem; padding:.5rem; }
        figure { margin:1rem auto; max-inline-size:50rem; } img { display:block; inline-size:100%; block-size:auto; } figcaption { padding:1rem 0; text-align:center; }
    }
    .op-property-contact { display:flex; flex-wrap:wrap; justify-content:space-between; gap:1.5rem; padding-block:2rem; border-block-start:1px solid #ddd; overflow-wrap:anywhere; }
}
@media (min-width:700px) {
    .op-listings .op-listings-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .op-property-detail .op-property-facts { grid-template-columns:1.2fr 1fr; gap:4rem; }
}
@media (prefers-reduced-motion:reduce) { .op-listing-card .op-listing-image img { transition:none; } }

/* Folded status ribbons, matching the current site's charcoal/coral tags. */
.op-homes-index {
    .op-listing-status { position:absolute; z-index:2; isolation:isolate; inset-block-start:-.65rem; inset-inline-end:.75rem; padding:.2rem 1.25rem .35rem; border-radius:.15rem .15rem .45rem .45rem; background:#474c55; color:white; font-size:1.5rem; font-weight:400; line-height:1.3; text-align:center; text-transform:uppercase; letter-spacing:normal;
        &::before { content:''; position:absolute; z-index:-1; inset-block-start:0; inset-inline:-.55rem; block-size:.65rem; background:inherit; border-radius:.35rem .35rem 0 0; }
        &[data-status="sold"] { background:#e98961; }
    }
    .op-listings-sold { background:#e7dcc0; color:var(--op-slate);
        .op-project-track { padding-block:1rem .25rem; }
        .op-project-card { overflow:visible;
            a { position:relative; }
            .op-card-image, h3 { border-radius:.25rem; }
            h3 { flex-direction:column; gap:.3rem; small { font-size:.65em; font-weight:400; } }
        }
        .op-carousel-controls[hidden] { display:none; }
    }
}