/* Shared, scoped tile treatment. Existing site layouts and portraits are untouched. */
.zk-tiles { --tile-ink:#0e1c2c; --tile-accent:#c5b18b; --tile-text:#f2eee5; --tile-muted:#b7c3ce; color:var(--tile-text); scroll-margin-top:150px; }
.zk-tiles-intro { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:0 0 28px; color:var(--tile-muted); font-size:11px; line-height:1.7; }
.zk-tiles-intro p { font-size:12px; margin:0; }
.zk-tiles-intro span { font-size:9px; text-transform:uppercase; letter-spacing:.15em; color:var(--tile-accent); }
.zk-tile-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px; padding:22px 10px 32px 0; perspective:1200px; }
.zk-tile { --rx:0deg; --ry:0deg; --lift:0px; position:relative; min-width:0; background:linear-gradient(145deg,#1b2b3d,var(--tile-ink)); border:1px solid #c5b18b55; box-shadow:7px 9px 0 #050c17,8px 10px 0 #c5b18b38,0 18px 30px #0004; transform:perspective(1000px) translateY(var(--lift)) rotateX(var(--rx)) rotateY(var(--ry)); transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease; display:flex; flex-direction:column; isolation:isolate; }
.zk-tile::before { content:''; height:6px; background:linear-gradient(90deg,#6f6b5c,#c5b18b,#716851); position:absolute; top:-7px; left:2px; right:-5px; transform:skewX(-38deg); transform-origin:bottom; opacity:.65; }
.zk-tile::after { content:''; position:absolute; inset:0; pointer-events:none; z-index:-1; background:radial-gradient(circle at var(--px,50%) var(--py,30%),#d9c49b20,transparent 65%); opacity:0; transition:opacity .3s; }
.zk-tile[data-selected='true'] { --lift:-8px; border-color:var(--tile-accent); box-shadow:7px 12px 0 #050c17,8px 13px 0 #c5b18b77,0 22px 40px #0005; }
.zk-tile[data-selected='true']::after,.zk-tile:hover::after { opacity:1; }
.zk-tile-button { appearance:none; background:transparent; color:inherit; border:0; border-radius:0; font:inherit; text-align:left; cursor:pointer; width:100%; padding:28px; flex:1; display:flex; flex-direction:column; align-items:stretch; min-height:275px; }
.zk-tile-top { display:flex; justify-content:space-between; align-items:center; color:var(--tile-accent); font-size:10px; letter-spacing:.14em; }
.zk-tile-plus { display:grid; place-items:center; width:30px; height:30px; border:1px solid #c5b18b66; border-radius:50%; font-size:18px; letter-spacing:0; }
.zk-tile-title { display:block; font-family:var(--serif,Georgia,serif); font-size:clamp(27px,3vw,42px); font-weight:400; line-height:1.12; margin:16px 0 12px; }
.zk-tile-summary { display:block; color:var(--tile-muted); font-size:13px; line-height:1.7; }
.zk-tile-art { display:block; height:74px; margin:16px 0 0; color:var(--tile-accent); }
.zk-tile-art svg { height:100%; width:100%; stroke:currentColor; stroke-width:1; fill:none; opacity:.75; }
.zk-tile-link { display:flex; justify-content:space-between; align-items:center; gap:12px; color:var(--tile-text); padding:18px 28px; margin:0; font-size:11px; border-top:1px solid #c5b18b35; text-decoration:none; min-height:52px; }
.zk-tile-link:hover { background:#c5b18b12; color:#fff; }
.zk-tiles button:focus-visible,.zk-tiles a:focus-visible { outline:2px solid #f0d9ad; outline-offset:5px; }
.zk-tile-detail { padding:30px 34px; background:linear-gradient(115deg,#c5b18b0d,transparent); border-top:1px solid #c5b18b66; border-bottom:1px solid #c5b18b33; }
.zk-tile-detail[hidden] { display:none!important; }
.zk-detail-grid { display:grid; grid-template-columns:1.2fr 1fr; gap:45px; align-items:center; }
.zk-detail-label { font-size:9px; letter-spacing:.16em; color:var(--tile-accent); text-transform:uppercase; }
.zk-tile-detail h3 { font:400 clamp(26px,3vw,36px)/1.2 var(--serif,Georgia,serif); color:var(--tile-text); margin:12px 0; }
.zk-tile-detail p { color:var(--tile-muted); font-size:13px; line-height:1.8; max-width:620px; margin:0; }
.zk-tile-detail ul { list-style:none; padding:0; margin:0; }
.zk-tile-detail li { font-size:12px; color:var(--tile-text); border-bottom:1px solid #c5b18b26; padding:12px 0 12px 22px; position:relative; }
.zk-tile-detail li::before { content:'↗'; position:absolute; left:0; color:var(--tile-accent); }
.zk-tile-detail a { display:inline-flex; gap:20px; min-height:44px; align-items:center; margin-top:12px; color:var(--tile-accent); font-size:12px; text-decoration:underline; text-underline-offset:5px; }
.zk-tile-status { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
#perspective-tiles { margin-top:62px; }
.property-tiles { padding:125px clamp(24px,7vw,110px); background:linear-gradient(135deg,#111a1d,#1e2524 72%,#2b2922); --tile-ink:#121d20; --tile-muted:#c8c4ba; --tile-accent:#c8a77b; }
.property-tiles > header { display:grid; grid-template-columns:.55fr 1.45fr; gap:35px; margin-bottom:48px; }
.property-tiles h2 { color:var(--tile-text); }
.property-tiles h2 em { color:var(--tile-accent); }
.property-tiles .zk-tile { background:linear-gradient(145deg,#2a302e,#111a1d); }
.property-tiles .zk-tile-button { padding:0 26px 24px; }
.zk-tile-photo { display:block; position:relative; overflow:hidden; margin:0 -26px 24px; aspect-ratio:8/5; }
.zk-tile-photo img { width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.zk-tile-photo::after { content:''; position:absolute; inset:0; background:linear-gradient(transparent 50%,#111a1d77); }
.property-tiles .zk-tile-title { font-size:clamp(27px,2.8vw,37px); }
@media (hover:hover) and (pointer:fine) { .zk-tile:hover { --lift:-12px; border-color:var(--tile-accent); } .zk-tile:hover img { transform:scale(1.04); } }
@media (max-width:900px) { .zk-tile-grid { gap:18px; } .zk-tile-button { padding:22px; } .zk-tile-title { font-size:29px; } .zk-tile-link { padding:16px 22px; } .property-tiles > header { grid-template-columns:1fr; gap:12px; } }
@media (max-width:680px) { .zk-tile-grid { grid-template-columns:1fr; gap:26px; padding-right:8px; } .zk-tile[data-selected='true'] { --lift:0px; } .zk-tile-button { min-height:0; padding:24px; } .zk-tile-art { height:48px; } .zk-tile-title { font-size:34px; } .zk-tiles-intro { align-items:flex-start; flex-direction:column; gap:6px; } .zk-tile-detail { padding:26px 22px; } .zk-detail-grid { grid-template-columns:1fr; gap:20px; } .property-tiles { padding:75px 24px; } .property-tiles .zk-tile-photo { aspect-ratio:2.2; } #perspective-tiles { margin-top:40px; } }
@media (prefers-reduced-motion:reduce) { .zk-tiles *, .zk-tiles *::after { transition:none!important; animation:none!important; } .zk-tile { transform:none!important; } .zk-tile img { transform:none!important; } }
.no-motion .zk-tile,.no-motion .zk-tile img { transform:none!important; transition:none!important; }