/* residence-hub-r2.css — Residence Hub UX R2 + photographic cards R2.1. Two-mode interface on the shared onh-* system.
   COLOUR POLICY: only existing sitewide tokens (--gs-*/--ok-* via --onh-* pass-throughs). No hardcoded colours,
   no residence palette, no gradients. Card media = self-hosted approved photographs (4:3). */

/* ---------- hero preview ---------- */
.rz-hero__preview { background:var(--ok-card-surface-quiet); border:1px solid var(--ok-card-line); border-radius:18px; padding:22px; }
.rz-hero__preview h3 { font-size:16px; font-weight:800; color:var(--gs-navy); margin:0 0 6px; }
.rz-hero__preview p { font-size:14px; color:var(--ok-muted); margin:0 0 16px; line-height:1.5; }

/* ---------- decision assistant ---------- */
.rz-asst { background:var(--ok-card-surface); border:1px solid var(--ok-card-line); border-radius:18px; padding:26px; max-width:760px; }
.rz-asst__prog { font-size:13px; font-weight:800; color:var(--ok-muted); letter-spacing:.03em; margin:0 0 10px; }
.rz-asst__q { font-size:20px; font-weight:800; color:var(--gs-navy); margin:0 0 16px; }
.rz-asst__opts { display:grid; gap:10px; }
.rz-opt { text-align:left; background:var(--ok-card-surface); border:1.5px solid var(--ok-card-line); border-radius:12px; padding:14px 16px; font-family:inherit; font-size:15px; font-weight:700; color:var(--ok-ink); cursor:pointer; min-height:44px; }
.rz-opt:hover { border-color:var(--gs-teal); }
.rz-opt:focus-visible { outline:2px solid var(--gs-teal); outline-offset:2px; }
.rz-opt.on { border-color:var(--gs-teal); background:var(--ok-card-surface-quiet); }
.rz-asst__nav { display:flex; gap:12px; margin-top:18px; flex-wrap:wrap; }
.rz-res__primary { border:2px solid var(--gs-teal); border-radius:16px; padding:20px; background:var(--ok-card-surface-quiet); }
.rz-res__lbl { font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.05em; color:var(--gs-teal); }
.rz-res__t { font-size:19px; font-weight:800; color:var(--gs-navy); margin:4px 0 6px; }
.rz-res__reason { font-size:14.5px; color:var(--ok-ink); line-height:1.5; margin:8px 0; }
.rz-res__sec { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; align-items:center; }
.rz-res__secchip { font-size:13px; font-weight:700; background:var(--ok-card-accent); color:var(--gs-teal); border-radius:999px; padding:5px 12px; }
.rz-res__note { font-size:13.5px; color:var(--ok-muted); margin:10px 0 0; }

/* ---------- catalogue filter chips (shared OKNO chip style) ---------- */
.rz-filters { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 12px; }
.rz-filter { display:inline-flex; align-items:center; background:var(--ok-card-surface); border:1.5px solid var(--ok-card-line); border-radius:999px; padding:9px 16px; font-family:inherit; font-size:14px; font-weight:700; color:var(--ok-muted); cursor:pointer; min-height:44px; white-space:nowrap; }
.rz-filter:hover { color:var(--ok-ink); border-color:var(--gs-teal); }
.rz-filter:focus-visible { outline:2px solid var(--gs-teal); outline-offset:2px; }
.rz-filter[aria-pressed="true"] { border-color:var(--gs-teal); color:var(--gs-teal); background:var(--ok-card-surface-quiet); }
/* special application-location filter — visibly distinct from category chips */
.rz-filter--pt { border-style:dashed; }
.rz-filter--pt[aria-pressed="true"] { border-style:solid; }
.rz-filter-help { font-size:13.5px; color:var(--ok-muted); line-height:1.5; max-width:640px; margin:0 0 12px; }
.rz-count { font-size:14px; color:var(--ok-muted); margin:0 0 18px; }
/* grouped assistant result: 4 compact sections (not eight full cards) */
.rz-res__groups { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 22px; margin:4px 0 14px; }
.rz-res__grp-t { font-size:12px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:var(--ok-muted); margin:0 0 6px; }
.rz-res__grp-l { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:5px; }
.rz-res__grp-l li { font-size:14px; line-height:1.35; }
.rz-res__grp-l a, .rz-res__grp-b { color:var(--gs-teal); font-weight:700; text-decoration:none; background:none; border:none; padding:0; font-family:inherit; font-size:14px; cursor:pointer; text-align:left; }
.rz-res__grp-l a:hover, .rz-res__grp-b:hover { text-decoration:underline; }

/* ---------- photographic catalogue cards ---------- */
.rz-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.rz-card { display:flex; flex-direction:column; background:var(--ok-card-surface); border:1px solid var(--ok-card-line); border-radius:16px; overflow:hidden; transition:box-shadow .15s,border-color .15s; }
.rz-card:hover { box-shadow:var(--ok-card-shadow-hover); border-color:var(--ok-card-line); }
.rz-card.is-hidden { display:none; }
.rz-card__media { display:block; position:relative; aspect-ratio:4/3; background:var(--ok-card-surface-quiet); }
/* grounds without a detail page open the contextual widget — normalize the button to render identically to the <a> media */
.rz-card__media--btn { width:100%; border:none; padding:0; margin:0; cursor:pointer; font:inherit; text-align:left; }
.rz-card__tbtn { background:none; border:none; padding:0; margin:0; font:inherit; font-weight:800; color:var(--gs-navy); cursor:pointer; text-align:left; }
.rz-card__tbtn:hover { color:var(--gs-teal); }
.rz-pic { display:block; width:100%; height:100%; }
.rz-pic img { width:100%; height:100%; object-fit:cover; display:block; }
.rz-pic__tag { position:absolute; left:10px; bottom:10px; font-size:11px; font-weight:800; letter-spacing:.04em; text-transform:uppercase;
  color:var(--ok-card-surface); background:rgba(12,30,60,.55); border-radius:8px; padding:3px 9px; }
.rz-card__body { display:flex; flex-direction:column; flex:1; padding:16px; }
.rz-card__t { font-size:16px; font-weight:800; margin:0 0 6px; line-height:1.25; }
.rz-card__t a { color:var(--gs-navy); text-decoration:none; }
.rz-card__t a:hover { color:var(--gs-teal); }
.rz-card__s { font-size:13.5px; color:var(--ok-muted); line-height:1.45; margin:0 0 14px; flex:1;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.rz-card__foot { display:flex; align-items:center; gap:10px; margin-top:auto; }
.rz-card__widget { min-height:44px; padding:10px 16px; border-radius:11px; border:1.5px solid var(--gs-teal); background:var(--ok-card-surface); color:var(--gs-teal); font-family:inherit; font-weight:800; font-size:14px; cursor:pointer; width:100%; }
.rz-card__widget:hover { background:var(--ok-card-surface-quiet); }

/* ---------- compact text cards (shared decorative section photos removed in R2.3 — no reserved blank panels) ---------- */
.rz-compact { background:var(--ok-card-surface); border:1px solid var(--ok-card-line); border-radius:14px; padding:18px; display:flex; flex-direction:column; }
.rz-compact h3 { font-size:15.5px; font-weight:800; color:var(--gs-navy); margin:0 0 6px; }
.rz-compact h3 a { color:var(--gs-navy); text-decoration:none; }
.rz-compact h3 a:hover { color:var(--gs-teal); }
.rz-compact p { font-size:13.5px; color:var(--ok-muted); line-height:1.45; margin:0 0 12px; flex:1; }
.rz-compact__a { font-size:13.5px; font-weight:800; color:var(--gs-teal); text-decoration:none; background:none; border:none; padding:0; font-family:inherit; cursor:pointer; text-align:left; align-self:flex-start; }
.rz-compact__a:hover { text-decoration:underline; }

@media (max-width:1000px){ .rz-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){
  .rz-grid { grid-template-columns:repeat(2,1fr); gap:12px; }
  .rz-card__t { font-size:14px; } .rz-card__s { font-size:12.5px; -webkit-line-clamp:3; }
  .rz-card__body { padding:12px; }
  .rz-asst { padding:18px; } .rz-asst__q { font-size:18px; }
  /* filter chips: horizontal scroll row */
  .rz-filters { flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; padding-bottom:4px; }
  .rz-filters::-webkit-scrollbar { display:none; }
  .rz-filter { flex:0 0 auto; }
  /* grouped assistant result stacks to a single column (four compact groups) */
  .rz-res__groups { grid-template-columns:1fr; }
}
@media (max-width:360px){ .rz-grid { grid-template-columns:1fr; } }
@media (prefers-reduced-motion: reduce){ .rz-card,.rz-opt,.rz-filter { transition:none; } }