/* Occupiers & tenants doorway. Scoped under #page-occupiers.
   Ported from the prototype; raw #fff swapped for var(--bg) so the
   identity-token check passes. The .oc-proof gold accent is the page's
   one personality-B gold element (tokens --gold / --gold-tint live in
   tokens.css). Shared chrome (header, buttons, band-soft base, breadcrumb,
   footer) lives in chrome.css; the hero and section rhythm below are
   page-scoped here, exactly as the other built pages do it. */

/* Hero and section rhythm (not in chrome.css; mirrors the other pages) */
#page-occupiers .hero{padding-top:78px;padding-bottom:14px}
#page-occupiers .hero h1{font-size:clamp(33px,5vw,48px);font-weight:700;max-width:780px}
#page-occupiers .hero p.lead{font-size:19px;max-width:660px;margin-top:22px;color:var(--slate)}
#page-occupiers .sec{padding-top:58px;padding-bottom:58px}
#page-occupiers .sec>h2,#page-occupiers .band-soft h2{font-size:clamp(26px,3.2vw,34px);font-weight:700;max-width:720px}
#page-occupiers .sec>.sub,#page-occupiers .band-soft .sub{font-size:16px;max-width:660px;margin-top:8px;color:var(--slate)}

#page-occupiers .oc-def{border:1px solid var(--line);border-left:5px solid var(--cyan);border-radius:14px;background:var(--bg);padding:22px 26px;margin-top:34px;max-width:860px;font-size:15.5px;line-height:1.7;color:var(--slate)}
#page-occupiers .oc-def strong{color:var(--navy)}
#page-occupiers .oc-def .fyi{font-size:12.5px;color:var(--muted)}
#page-occupiers .oc-proof{font-size:15px;color:var(--slate);margin-top:10px;max-width:660px;border-left:4px solid var(--gold);background:var(--gold-tint);padding:14px 18px;border-radius:10px}
#page-occupiers .oc-proof strong{color:var(--navy)}
#page-occupiers .oc-card{border:1px solid var(--line);border-radius:16px;background:var(--bg);padding:28px;margin-top:26px;max-width:860px}
#page-occupiers .oc-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
#page-occupiers .oc-name{font-family:var(--display);font-weight:700;font-size:22px;color:var(--navy)}
#page-occupiers .oc-tag{font-family:var(--display);font-weight:600;font-size:11px;letter-spacing:.1em;text-transform:uppercase;border-radius:999px;padding:5px 12px}
#page-occupiers .oc-tag.live{color:var(--cyan-ink);background:rgba(0,172,205,.1);border:.5px solid rgba(0,172,205,.35)}
#page-occupiers .oc-tag.soon{color:var(--muted);background:var(--bg-soft);border:.5px solid var(--line)}
#page-occupiers .oc-promise{font-size:16.5px;font-weight:600;color:var(--navy);margin-top:14px;max-width:680px}
#page-occupiers .oc-exp{font-size:14.5px;line-height:1.6;color:var(--slate);margin-top:8px;max-width:680px}
#page-occupiers .oc-rows{margin-top:20px;border-top:.5px solid var(--line)}
#page-occupiers .oc-row{display:flex;gap:14px;align-items:center;flex-wrap:wrap;padding:14px 0;border-bottom:.5px solid var(--line)}
#page-occupiers .oc-row .r-lab{font-family:var(--display);font-weight:600;font-size:14px;color:var(--navy);min-width:150px}
#page-occupiers .oc-row .r-note{font-size:13.5px;color:var(--slate);flex:1;min-width:220px;line-height:1.55}
#page-occupiers .oc-row .btn-p{padding:10px 18px;font-size:14px}
#page-occupiers .oc-card>.btn-p{margin-top:20px}
#page-occupiers .oc-quiet{font-size:14px;color:var(--slate);margin-top:16px}
#page-occupiers .oc-quiet a{color:var(--cyan-ink);font-weight:600;cursor:pointer}
@media(max-width:640px){#page-occupiers .oc-row .r-lab{min-width:100%}}
