/* Shared site chrome styles (header, nav, breadcrumb, footer) for interior/
   property pages. Pairs with site-chrome.js. Single source of truth — edit
   chrome styling here, not per page. Relies on tokens.css for the palette. */

/* NAV / HEADER */
.site-header { background: var(--forest-2); padding: 0 1.5rem; display: flex; align-items: center; justify-content: space-between; height: 60px; position: sticky; top: 0; z-index: 100; }
.site-header a { color: var(--white); text-decoration: none; }
.site-logo { display: flex; align-items: center; gap: 10px; }
.site-logo .logo-mark { width: 36px; height: 36px; background: var(--forest); border-radius: 6px; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: .85rem; color: white; }
.site-logo .logo-text strong { display: block; font-size: .9rem; }
.site-logo .logo-text span { font-size: .7rem; opacity: .7; }
.site-nav a { color: rgba(255,255,255,.8); font-size: .875rem; margin-left: 1.5rem; }
.site-nav a:hover { color: white; }

/* BREADCRUMB */
.breadcrumb { max-width: 1100px; margin: 1rem auto; padding: 0 1.5rem; font-size: .8rem; color: var(--muted); }
.breadcrumb a { color: var(--forest); text-decoration: underline; }
.breadcrumb a:hover { text-decoration: none; }
.breadcrumb span { margin: 0 .4rem; }

/* FOOTER */
.site-footer { background: var(--forest-2); color: rgba(255,255,255,.7); text-align: center; padding: 1.5rem; font-size: .8rem; margin-top: 4rem; }
.site-footer a { color: rgba(255,255,255,.7); }