/* extras for personalised previews; base styles come from /demo/cabins.css */
body[data-theme="mountain"] { --sky-top:#7FA8C9; --sky-bottom:#F1E2C2; --ridge-far:#8C9BB0; --ridge-mid:#4E6A63; --lake-top:#6F8F5E; --lake-bottom:#3E5A3A; }
body[data-theme="coast"]    { --sky-top:#7EB6D6; --sky-bottom:#F6E7C8; --ridge-far:#D9C9A3; --ridge-mid:#C7B48A; --lake-top:#3C8DAA; --lake-bottom:#1F5670; }
body[data-theme="desert"]   { --sky-top:#E2A86F; --sky-bottom:#F7DDB5; --orb:#FFF4DC; --ridge-far:#B9654A; --ridge-mid:#8E4632; --lake-top:#D9A774; --lake-bottom:#B57A4D; }
body[data-theme="plains"]   { --sky-top:#9CC1DA; --sky-bottom:#F3E6C4; --ridge-far:#A7B48A; --ridge-mid:#7A8F5A; --lake-top:#C8B46E; --lake-bottom:#8F7F43; }

.demo-note strong { color: #FFE2A8; font-weight: 600; }
.kicker { margin: 0 0 8px; font: 600 0.8125rem/1.3 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--amber-deep); }
.hero h1.long { font-size: clamp(2.1rem, 5.4vw, 3.6rem); }

.units { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 18px; }
.unit { background: var(--paper); border-top: 3px solid var(--spruce); display: flex; flex-direction: column; }
.unit .ph { aspect-ratio: 16/10; background: linear-gradient(160deg, var(--sky-top), var(--lake-bottom)); display: flex; align-items: flex-end; padding: 10px 12px; color: rgba(255,255,255,.88); font-size: .8125rem; letter-spacing: .04em; }
.unit .body { padding: 16px 18px 20px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.unit h3 { margin: 0; font: 700 1.3rem/1.2 var(--serif); color: var(--spruce); }
.unit .meta { margin: 0; color: var(--muted); font-size: .9375rem; }
.unit ul { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.unit li { font-size: .8125rem; padding: 3px 9px; border-radius: 20px; background: var(--fog); color: var(--spruce); }
.unit .price { margin: auto 0 0; padding-top: 10px; font: 600 1.2rem/1.2 var(--serif); color: var(--ink); }
.unit .price span { font: 400 .8125rem var(--sans); color: var(--muted); }

.nearby { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.nearby li { background: var(--paper); padding: 14px 16px; border-left: 4px solid var(--amber); }

.contact-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 18px; }
.contact-grid div { background: var(--paper); padding: 18px; }
.contact-grid dt { font: 700 1.05rem var(--serif); color: var(--spruce); }
.contact-grid dd { margin: 6px 0 0; color: var(--muted); overflow-wrap: anywhere; }

.direct { margin-top: 18px; padding: 16px 18px; background: #FBEFD6; border-left: 4px solid var(--amber); }