/* Havlo Editorial, the whole public site: tried on /search (2026-10-18, Option B), then About and Impact (2026-10-19),
   then every page (CEO 2026-10-20: "just transition them all properly").
   Source: the Havlo Editorial design system (claude.ai artifact). Loaded on every page while the feature flag
   site-editorial-search is on (audience everyone); off, the site keeps its standard look.
   Presentation only: the scripts and the server cards keep every behaviour (live HAR data, the fair-housing line).
   Every rule is scoped to html[data-intent], which every page carries. Shapes: the ribbon (pills) for anything pressed, the pod (24px) for anything read; targets 44px. */

:root[data-intent]{
  --he-canvas:#faf7f2;--he-container:#f4efea;--he-container-high:#ebe8e3;--he-lowest:#ffffff;--he-hairline:#e7e2da;
  --he-outline:#887369;--he-ink:#111111;--he-ink-soft:#55433a;--he-stone:#6d6860;--he-on-ink:#faf7f2;
  --he-rust:#b86530;--he-rust-strong:#9a4f22;--he-rust-tint:#f3e1d3;--he-on-rust:#ffffff;
  --he-elev-low:0 2px 8px -2px rgba(17,17,17,.04),0 1px 3px -1px rgba(189,101,49,.03);
  --he-elev-medium:0 8px 24px -4px rgba(17,17,17,.06),0 2px 6px -1px rgba(189,101,49,.04);
  --he-pod:24px;--he-photo:18px;--he-matting:8px;--he-ease:cubic-bezier(.22,1,.36,1)
}
:root[data-intent][data-theme="dark"]{
  --he-canvas:#101719;--he-container:#182124;--he-container-high:#1f2a2e;--he-lowest:#26333a;--he-hairline:#2e3a3d;
  --he-outline:#7a8587;--he-ink:#f2eee5;--he-ink-soft:#cfd4d4;--he-stone:#a3abab;--he-on-ink:#101719;
  --he-rust:#d98c5a;--he-rust-strong:#d98c5a;--he-rust-tint:#3a2619;--he-on-rust:#101719;
  --he-elev-low:0 0 0 1px #2e3a3d;--he-elev-medium:0 0 0 1px #2e3a3d
}
@media (prefers-color-scheme:dark){
  :root[data-intent]:not([data-theme="light"]){
    --he-canvas:#101719;--he-container:#182124;--he-container-high:#1f2a2e;--he-lowest:#26333a;--he-hairline:#2e3a3d;
    --he-outline:#7a8587;--he-ink:#f2eee5;--he-ink-soft:#cfd4d4;--he-stone:#a3abab;--he-on-ink:#101719;
    --he-rust:#d98c5a;--he-rust-strong:#d98c5a;--he-rust-tint:#3a2619;--he-on-rust:#101719;
    --he-elev-low:0 0 0 1px #2e3a3d;--he-elev-medium:0 0 0 1px #2e3a3d
  }
}

/* The result's head: a light editorial headline, sources in stone. */
:root[data-intent] .sx-title{font:400 clamp(1.75rem,2.6vw,2.5rem)/1.2 var(--hv-font-display);letter-spacing:-.015em;color:var(--he-ink)}
:root[data-intent] .sx-src,:root[data-intent] .sx-fh .sx-fact{font:500 .6875rem/1.3 var(--hv-font-display);letter-spacing:.06em;text-transform:uppercase;color:var(--he-stone)}

/* Active filters: removable pills. The ✕ is its own 44px target. */
:root[data-intent] .sx-chips{gap:8px}
:root[data-intent] .sx-chip{min-height:44px;padding:0 4px 0 16px;border-radius:999px;background:var(--he-canvas);box-shadow:inset 0 0 0 1px var(--he-hairline);color:var(--he-ink);font:500 .8125rem/1 var(--hv-font-body)}
:root[data-intent] .sx-chip:last-of-type{padding-right:4px}
:root[data-intent] .sx-x{display:inline-grid;place-items:center;width:44px;height:44px;margin:0 -2px 0 2px;padding:0;border-radius:999px;color:var(--he-stone);opacity:1}
:root[data-intent] .sx-x:hover{color:var(--he-rust-strong);background:var(--he-rust-tint)}
:root[data-intent] .sx-editbtn{min-height:44px;padding:0 6px;color:var(--he-rust-strong);font:600 .875rem/1 var(--hv-font-display)}

/* Result cards: a pod with a matted photograph. Listing photos are never zoomed or filtered (HAR): the card lifts instead. */
:root[data-intent] .sx-grid{gap:16px}
:root[data-intent] .sx-card{padding:var(--he-matting);border-radius:var(--he-pod);background:var(--he-container);color:var(--he-ink);box-shadow:inset 0 0 0 1px var(--he-hairline)}
:root[data-intent] .sx-card:hover{transform:translateY(-4px);box-shadow:inset 0 0 0 1px var(--he-hairline),var(--he-elev-medium)}
:root[data-intent] .sx-card:focus-visible{outline:2px solid var(--he-rust);outline-offset:2px;box-shadow:inset 0 0 0 1px var(--he-hairline)}
:root[data-intent] .sx-ph{aspect-ratio:4/3;border-radius:var(--he-photo);background:var(--he-container-high)}
:root[data-intent] .sx-card:hover .sx-ph img{transform:none}
:root[data-intent] .sx-t{gap:4px;padding:14px 8px 8px}
:root[data-intent] .sx-t b{font:600 1.25rem/1.4 var(--hv-font-display);letter-spacing:-.01em;color:var(--he-rust-strong);font-variant-numeric:tabular-nums}
:root[data-intent] .sx-t span{font:400 .9375rem/1.5 var(--hv-font-body);color:var(--he-ink-soft)}
:root[data-intent] .sx-t small{font:500 .6875rem/1.3 var(--hv-font-display);letter-spacing:.06em;text-transform:uppercase;color:var(--he-stone)}
:root[data-intent] .sx-pos{padding:4px 10px;border-radius:999px;background:var(--he-rust-tint);color:var(--he-rust-strong);font:700 .6875rem/1.2 var(--hv-font-display);letter-spacing:.06em;text-transform:uppercase}
:root[data-intent] .sx-why i{color:var(--he-ink-soft)}
:root[data-intent] .sx-why i::before{background:var(--he-rust)}

/* Every action on a result is a pill. */
:root[data-intent] .sx-ask,:root[data-intent] .home-ask{min-height:44px;border-radius:999px;background:var(--he-container);box-shadow:inset 0 0 0 1px var(--he-outline);color:var(--he-ink);font:600 .875rem/1.2 var(--hv-font-display)}
:root[data-intent] .sx-ask:hover,:root[data-intent] .home-ask:hover{background:var(--he-container);box-shadow:inset 0 0 0 1px var(--he-rust)}
:root[data-intent] .sx-more{min-height:44px;padding:0 24px;border-radius:999px}
:root[data-intent] .sx-empty .chip-btn{min-height:44px;padding:0 16px;border-radius:999px;background:var(--he-canvas);box-shadow:inset 0 0 0 1px var(--he-hairline);color:var(--he-ink);font:600 .8125rem/1 var(--hv-font-display)}
:root[data-intent] .cmp-chip{min-height:36px;border-radius:999px;background:var(--he-ink);color:var(--he-on-ink)}

/* The homes the server draws first: the same pods, and the Rent / Buy segmented switch. */
:root[data-intent] .nb-live-grid{gap:16px}
:root[data-intent] .nb-live-grid .home{padding:var(--he-matting);border-radius:var(--he-pod);background:var(--he-container);color:var(--he-ink);box-shadow:inset 0 0 0 1px var(--he-hairline);transition:transform .34s var(--he-ease),box-shadow .34s var(--he-ease)}
:root[data-intent] .nb-live-grid .home:hover{transform:translateY(-4px);box-shadow:inset 0 0 0 1px var(--he-hairline),var(--he-elev-medium)}
:root[data-intent] .nb-live-grid .home:focus-visible{outline:2px solid var(--he-rust);outline-offset:2px}
:root[data-intent] .nb-live-grid .home img{aspect-ratio:4/3;height:auto;border-radius:var(--he-photo)}
:root[data-intent] .nb-live-grid .home .h-t{padding:14px 8px 8px;gap:4px}
:root[data-intent] .nb-live-grid .home .h-t b{font:600 1.25rem/1.4 var(--hv-font-display);color:var(--he-rust-strong);font-variant-numeric:tabular-nums}
:root[data-intent] .nb-live-grid .home .h-t span{font:400 .9375rem/1.5 var(--hv-font-body);color:var(--he-ink-soft)}
:root[data-intent] .nb-live-grid .home .h-t small{font:500 .6875rem/1.3 var(--hv-font-display);letter-spacing:.06em;text-transform:uppercase;color:var(--he-stone)}
:root[data-intent] .nb-seg{display:inline-flex;gap:2px;padding:4px;border-radius:999px;background:var(--he-container);box-shadow:inset 0 0 0 1px var(--he-hairline)}
:root[data-intent] .nb-seg-b{min-height:44px;padding:0 18px;border:0;border-radius:999px;background:transparent;color:var(--he-stone);font:600 .875rem/1 var(--hv-font-display);cursor:pointer}
:root[data-intent] .nb-seg-b.on,:root[data-intent] .nb-seg-b[aria-pressed="true"]{background:var(--he-lowest);color:var(--he-ink);box-shadow:var(--he-elev-low)}
:root[data-intent] .nb-seg-b:focus-visible,:root[data-intent] .sx-x:focus-visible,:root[data-intent] .sx-ask:focus-visible,:root[data-intent] .home-ask:focus-visible,:root[data-intent] .sx-editbtn:focus-visible{outline:2px solid var(--he-rust);outline-offset:2px}

@media (prefers-reduced-motion:reduce){
  :root[data-intent] .sx-card:hover,:root[data-intent] .nb-live-grid .home:hover{transform:none}
}
@media (forced-colors:active){
  :root[data-intent] .sx-card,:root[data-intent] .nb-live-grid .home,:root[data-intent] .sx-chip,:root[data-intent] .nb-seg-b,:root[data-intent] .sx-ask,:root[data-intent] .home-ask{border:1px solid ButtonText}
  :root[data-intent] .nb-seg-b[aria-pressed="true"]{forced-color-adjust:none;background:Highlight;color:HighlightText}
}

/* ===== The composing page (CEO 2026-10-19: "starts with just the ask and each part composes in as I ask").
   Under the same flag the server sends /search with no sections (havlo/site/sections.py COMPOSING_POOL): the page is the
   cover and the ask; what the person asks composes below it. These rules give that page the Editorial shapes. */

/* The conversation band speaks in Editorial tokens. */
:root[data-intent] .ah{--bg:var(--he-canvas);--card:var(--he-lowest);--card-solid:var(--he-lowest);--field:var(--he-container);--line:var(--he-hairline);--tx:var(--he-ink);--tx2:var(--he-ink-soft);--mut:var(--he-stone);--acc:var(--he-rust-strong);--chip:var(--he-container);--soft:var(--he-rust-tint)}
:root[data-intent] body{background:var(--he-canvas)}

/* The cover: one rounded photograph, the heading on it; it settles into a slim band once the person has asked. */
:root[data-intent] .sf-top{margin:12px auto 0;width:calc(100% - 2*max(16px,env(safe-area-inset-left,0px)));max-width:1240px;border-radius:32px;overflow:hidden;min-height:440px;transition:min-height .9s var(--he-ease)}
:root[data-intent] .sf-photo img{transform:scale(1.04);transition:transform 2.4s var(--he-ease)}
:root[data-intent] .sf-top:hover .sf-photo img{transform:scale(1)}
:root[data-intent] .sf-h1{letter-spacing:-.03em;text-wrap:balance}
:root[data-intent] .sf-eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;background:rgba(250,247,242,.14);box-shadow:inset 0 0 0 1px rgba(250,247,242,.28);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
:root[data-intent]:has(.sf-band.is-active) .sf-top{min-height:160px}
:root[data-intent]:has(.sf-band.is-active) .sf-lede,:root[data-intent]:has(.sf-band.is-active) .sf-eyebrow{display:none}
:root[data-intent]:has(.sf-band.is-active) .sf-h1{font-size:clamp(1.75rem,3vw,2.5rem)}

/* The ask: a pill that floats over the cover's edge. */
:root[data-intent] .sf-talk{position:relative;z-index:20;margin:-56px auto 0;max-width:960px;padding:0 max(16px,env(safe-area-inset-left,0px))}
:root[data-intent] .sf-talk{width:100%;box-sizing:border-box}
:root[data-intent] .sf-talk .ah,:root[data-intent] .sf-talk-in{width:100%;max-width:none}
:root[data-intent] .sf-top-in{padding-bottom:96px}
:root[data-intent] .sf-talk .ah{min-height:0;padding:0;background:none}
:root[data-intent] .sf-talk-in{background:var(--he-lowest);border-radius:32px;padding:12px;box-shadow:inset 0 0 0 1px var(--he-hairline),0 24px 48px -12px rgba(17,17,17,.12)}
:root[data-intent] .ah-composer{border-radius:999px;background:var(--he-container);padding:6px 6px 6px 20px;min-height:60px;align-items:center}
:root[data-intent] .ah-composer textarea{background:none;border:0;font-size:1.0625rem;color:var(--he-ink)}
:root[data-intent] .ah-composer button{min-height:48px;border-radius:999px;padding:0 22px;background:var(--he-rust);color:var(--he-on-rust);font:600 .9375rem/1 var(--hv-font-display);transition:background .3s var(--he-ease),transform .3s var(--he-ease)}
:root[data-intent] .ah-composer button:hover{background:var(--he-rust-strong);transform:translateX(2px)}

/* The conversation itself: the person's words in an ink bubble, Havlo's beside the H. */
:root[data-intent] .ah-you{justify-self:end;margin-left:auto;max-width:60ch;border-radius:22px 22px 6px 22px;background:var(--he-ink);color:var(--he-on-ink);padding:12px 18px}
:root[data-intent] .ah-av{background:var(--he-ink);color:var(--he-on-ink);border-radius:50%}
:root[data-intent] .ah-steps .ah-back,:root[data-intent] .ah-steps .ah-link,:root[data-intent] .ah-fb .ah-link{min-height:44px;border-radius:999px;padding:0 16px;box-shadow:inset 0 0 0 1px var(--he-hairline);background:var(--he-lowest);color:var(--he-ink);text-decoration:none}
:root[data-intent] .ah-fb .ah-link:hover,:root[data-intent] .ah-steps .ah-link:hover{box-shadow:inset 0 0 0 1px var(--he-rust);background:var(--he-rust-tint)}

/* The answer: a pod that rises in under the ask. */
:root[data-intent] .sf-answer{max-width:1240px;margin:28px auto 0}
:root[data-intent] .ah-canvas{background:var(--he-lowest);border-radius:28px;padding:16px;box-shadow:inset 0 0 0 1px var(--he-hairline),var(--he-elev-low)}
:root[data-intent] .ah-seg{border-radius:999px;background:var(--he-container);padding:4px}
:root[data-intent] .ah-seg button{min-height:40px;border-radius:999px;border:0;background:none;color:var(--he-ink-soft);padding:0 16px}
:root[data-intent] .ah-seg button.on{background:var(--he-lowest);color:var(--he-ink);box-shadow:var(--he-elev-low)}
:root[data-intent] .ah-chip{min-height:44px;border-radius:999px;background:var(--he-lowest);box-shadow:inset 0 0 0 1px var(--he-hairline);color:var(--he-ink);padding:0 16px}
:root[data-intent] .ah-chip:hover{box-shadow:inset 0 0 0 1px var(--he-rust);background:var(--he-rust-tint)}
:root[data-intent] .ah-row .count{font:700 clamp(1.75rem,3vw,2.5rem)/1.05 var(--hv-font-display);letter-spacing:-.025em}
:root[data-intent] .ah-note{color:var(--he-stone)}
:root[data-intent] .ah-grid{gap:20px}

/* Each home: a pod with its photograph matted inside; listing photos are never zoomed or tilted (HAR). */
:root[data-intent] .ah-card{padding:var(--he-matting);border-radius:var(--he-pod);background:var(--he-lowest);box-shadow:inset 0 0 0 1px var(--he-hairline),var(--he-elev-low);transform:none!important;transition:box-shadow .5s var(--he-ease),translate .5s var(--he-ease)}
:root[data-intent] .ah-card:hover{translate:0 -3px;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--he-rust) 40%,var(--he-hairline)),var(--he-elev-medium)}
:root[data-intent] .ah-pic{border-radius:var(--he-photo);overflow:hidden;background:var(--he-container-high)}
:root[data-intent] .ah-pic img{transform:none!important}
:root[data-intent] .ah-cbody{padding:14px 10px 8px;gap:4px}
:root[data-intent] .ah-cbody b{font:700 1.0625rem/1.25 var(--hv-font-display);letter-spacing:-.015em}
:root[data-intent] .ah-priceline{color:var(--he-rust-strong);font:800 1.1875rem/1.2 var(--hv-font-display);letter-spacing:-.02em}
:root[data-intent] .ah-subline{color:var(--he-ink-soft)}
:root[data-intent] .ah-byline{color:var(--he-stone)}

/* A comparison and the market snapshot the band draws: an honest table and tiles in pods. */
:root[data-intent] .ah-panel{background:var(--he-lowest);border-radius:28px;padding:20px;box-shadow:inset 0 0 0 1px var(--he-hairline)}
:root[data-intent] .ah-panel th,:root[data-intent] .ah-panel td{padding:14px 12px;border-bottom:1px solid var(--he-hairline);text-align:left}
:root[data-intent] .ah-stats > div{background:var(--he-container);border-radius:20px;padding:16px 18px}

/* Sections that compose in when asked about: pods, each led by a library photograph as its scene (Havlo photo library;
   places and streets only, never people with an address). */
:root[data-intent] .sf-list-secs{max-width:1240px;margin:0 auto;display:grid;gap:20px;padding:20px max(16px,env(safe-area-inset-left,0px)) 40px}
:root[data-intent] .sf-list-secs > .sf-sec{background:var(--he-lowest);border-radius:32px;overflow:hidden;box-shadow:inset 0 0 0 1px var(--he-hairline),var(--he-elev-low)}
:root[data-intent="search"] .sf-list-secs > .sf-sec[data-sec="numbers"]::before,:root[data-intent="search"] .sf-list-secs > .sf-sec[data-sec="beds-chart"]::before,:root[data-intent="search"] .sf-list-secs > .sf-sec[data-sec="schools"]::before{content:"";display:block;height:220px;margin:8px 8px 0;border-radius:24px;background:var(--he-container-high) center/cover no-repeat}
:root[data-intent="search"] .sf-list-secs > .sf-sec[data-sec="numbers"]::before{background-image:linear-gradient(180deg,transparent 40%,rgba(10,14,15,.35)),url(/assets/photos/nbhd-bungalows.webp)}
:root[data-intent="search"] .sf-list-secs > .sf-sec[data-sec="beds-chart"]::before{background-image:linear-gradient(180deg,transparent 40%,rgba(10,14,15,.35)),url(/assets/photos/nbhd-townhomes.webp)}
:root[data-intent="search"] .sf-list-secs > .sf-sec[data-sec="schools"]::before{background-image:linear-gradient(180deg,transparent 40%,rgba(10,14,15,.35)),url(/assets/photos/nbhd-historic-ward.webp)}
:root[data-intent] .sf-tiles > div,:root[data-intent] .sf-kpis > div{background:var(--he-container);border-radius:20px}
:root[data-intent] .ah-tile{border-radius:var(--he-pod);overflow:hidden}

@media (max-width:620px){
  :root[data-intent] .sf-top{min-height:380px;border-radius:24px}
  :root[data-intent] .sf-talk{margin-top:-40px}
  :root[data-intent] .sf-talk-in{border-radius:28px;padding:8px}
  :root[data-intent="search"] .sf-list-secs > .sf-sec[data-sec="numbers"]::before,:root[data-intent="search"] .sf-list-secs > .sf-sec[data-sec="beds-chart"]::before,:root[data-intent="search"] .sf-list-secs > .sf-sec[data-sec="schools"]::before{height:160px}
}
@media (prefers-reduced-motion:reduce){
  :root[data-intent] .sf-top,:root[data-intent] .sf-photo img,:root[data-intent] .ah-card{transition:none}
}
@media (forced-colors:active){
  :root[data-intent] .sf-talk-in,:root[data-intent] .ah-canvas,:root[data-intent] .ah-card,:root[data-intent] .sf-list-secs > .sf-sec{border:1px solid CanvasText}
}

/* ===== The story pages (About, Impact): they open pre-filled with their strongest sections; the rest arrive when asked.
   Each section is a pod; a library photograph leads it as a scene. Fair housing: a scene beside who Havlo serves shows
   homes, never people, so no photo can read as who a home is for; Havlo's own staff may appear on About. */
:root[data-intent] .sf-list-secs > .sf-sec{padding:12px}
:root[data-intent] .sf-h{font:700 clamp(1.75rem,3.4vw,2.75rem)/1.06 var(--hv-font-display);letter-spacing:-.03em;text-wrap:balance;color:var(--he-ink)}
:root[data-intent] .sf-eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;background:var(--he-container);box-shadow:inset 0 0 0 1px var(--he-hairline);color:var(--he-rust-strong);font:600 .6875rem/1 var(--hv-font-body);letter-spacing:.12em;text-transform:uppercase}
:root[data-intent] .sf-top .sf-eyebrow{background:rgba(250,247,242,.14);box-shadow:inset 0 0 0 1px rgba(250,247,242,.28);color:#faf7f2}
:root[data-intent] .sf-sub,:root[data-intent] .sf-lede{color:var(--he-ink-soft);max-width:62ch}
:root[data-intent] .sf-tiles3{gap:12px}
:root[data-intent] .sf-tiles3 > li,:root[data-intent] .sf-held > li{background:var(--he-container);border-radius:20px;padding:18px 20px;border:0}
:root[data-intent] .sf-tiles3 b,:root[data-intent] .sf-held b{font:700 1.0625rem/1.3 var(--hv-font-display);letter-spacing:-.01em;color:var(--he-ink)}
:root[data-intent] .sf-profile-ph{border-radius:24px;overflow:hidden}
:root[data-intent] .sf-profile-ph img{border-radius:24px}
:root[data-intent] .sf-quote{border:0;border-radius:20px;background:var(--he-rust-tint);color:var(--he-ink);padding:18px 22px;font:600 1.125rem/1.45 var(--hv-font-display)}
:root[data-intent] .sf-grid.sf-links > a{border-radius:20px;background:var(--he-container);border:0;transition:background .3s var(--he-ease),translate .3s var(--he-ease)}
:root[data-intent] .sf-grid.sf-links > a:hover{background:var(--he-rust-tint);translate:0 -2px}
:root[data-intent] .sf-chain li{border-radius:999px}
:root[data-intent] .sf-list-secs > .sf-sec:is([data-sec="impact-who"],[data-sec="about-believe"])::before{content:"";display:block;height:240px;margin:-4px -4px 16px;border-radius:24px;background:var(--he-container-high) center/cover no-repeat}
:root[data-intent] .sf-list-secs > .sf-sec[data-sec="impact-who"]::before{background-image:linear-gradient(180deg,transparent 45%,rgba(10,14,15,.3)),url(/assets/photos/nbhd-garden-apartments.webp)}
:root[data-intent] .sf-list-secs > .sf-sec[data-sec="about-believe"]::before{background-image:linear-gradient(180deg,transparent 45%,rgba(10,14,15,.3)),url(/assets/photos/staff-community-1.webp)}
@media (max-width:620px){
  :root[data-intent] .sf-list-secs > .sf-sec:is([data-sec="impact-who"],[data-sec="about-believe"])::before{height:170px}
}

/* ===== The frame (CEO 2026-10-20: "the header and footer aren't getting these same upgrades; the search box has a stuck
   square background"). The ask's own strip keeps no fill of its own, so only the rounded pod shows. */
:root[data-intent] .sf-talk{background:none}

/* The header: glass over the page, pill links, the one action in rust. */
:root[data-intent]:root:root:root header.nav{background:color-mix(in srgb,var(--he-canvas) 84%,transparent);backdrop-filter:blur(16px) saturate(1.2);-webkit-backdrop-filter:blur(16px) saturate(1.2);box-shadow:inset 0 -1px 0 var(--he-hairline);color:var(--he-ink)}
:root[data-intent]:root:root:root header.nav .nav-links a.l{min-height:40px;display:inline-flex;align-items:center;padding:0 14px;border-radius:999px;color:var(--he-ink-soft);font:500 .875rem/1 var(--hv-font-body);transition:background .3s var(--he-ease),color .3s var(--he-ease)}
:root[data-intent]:root:root:root header.nav .nav-links a.l:hover{background:var(--he-container);color:var(--he-ink)}
:root[data-intent]:root:root:root header.nav .nav-links a.l.on{background:var(--he-lowest);color:var(--he-ink);box-shadow:inset 0 0 0 1px var(--he-hairline),var(--he-elev-low)}
:root[data-intent]:root:root:root header.nav .nv-p{border-radius:24px;padding:8px;background:var(--he-lowest);box-shadow:inset 0 0 0 1px var(--he-hairline),var(--he-elev-medium)}
:root[data-intent]:root:root:root header.nav .nv-i{border-radius:16px;padding:12px 14px}
:root[data-intent]:root:root:root header.nav .nv-i:hover{background:var(--he-container)}
:root[data-intent]:root:root:root header.nav .nv-i b{color:var(--he-ink);font:600 .9375rem/1.3 var(--hv-font-display)}
:root[data-intent]:root:root:root header.nav .nv-i span{color:var(--he-stone)}
:root[data-intent]:root:root:root header.nav .nav-call{color:var(--he-ink-soft)}
:root[data-intent]:root:root:root header.nav .nav-search{min-height:44px;display:inline-flex;align-items:center;padding:0 18px;border-radius:999px;background:var(--he-rust);color:var(--he-on-rust);font:600 .875rem/1 var(--hv-font-display);transition:background .3s var(--he-ease)}
:root[data-intent]:root:root:root header.nav .nav-search:hover{background:var(--he-rust-strong)}
:root[data-intent]:root:root:root header.nav .nav-util button{min-height:44px;min-width:44px;border-radius:999px;background:var(--he-lowest);box-shadow:inset 0 0 0 1px var(--he-hairline);color:var(--he-ink)}

/* The footer: a rounded pod at the foot of the page. The extra :root weight outranks the bundle's own footer rule
   (:root:root:root:root footer:not(.ah-foot)). The legal lines stay whole and always visible (TREC, HAR, EHO). */
:root[data-intent]:root:root:root footer:not(.ah-foot){background:var(--he-container);color:var(--he-ink-soft);border-radius:36px 36px 0 0;margin-top:24px;border-top:0}
:root[data-intent]:root:root:root footer:not(.ah-foot) .hv-ticker{background:none;border:0;box-shadow:inset 0 -1px 0 var(--he-hairline);color:var(--he-stone);font:600 .6875rem/1 var(--hv-font-body);letter-spacing:.14em;text-transform:uppercase}
:root[data-intent]:root:root:root footer:not(.ah-foot) .hv-ticker i{color:var(--he-rust)}
:root[data-intent]:root:root:root footer:not(.ah-foot) .foot-tag{color:var(--he-ink);font:700 clamp(1.5rem,2.6vw,2rem)/1.1 var(--hv-font-display);letter-spacing:-.025em}
:root[data-intent]:root:root:root footer:not(.ah-foot) .foot-conversation{min-height:44px;border-radius:999px;background:var(--he-rust);color:var(--he-on-rust);border:0;padding:0 20px;font:600 .875rem/1 var(--hv-font-display)}
:root[data-intent]:root:root:root footer:not(.ah-foot) .fh{color:var(--he-stone);font:600 .6875rem/1 var(--hv-font-body);letter-spacing:.12em;text-transform:uppercase}
:root[data-intent]:root:root:root footer:not(.ah-foot) .foot-cols a{color:var(--he-ink);text-decoration:none;border-radius:999px}
:root[data-intent]:root:root:root footer:not(.ah-foot) .foot-cols a:hover{color:var(--he-rust-strong)}
:root[data-intent]:root:root:root footer:not(.ah-foot) .foot-signup{background:var(--he-lowest);border-radius:28px;padding:20px;box-shadow:inset 0 0 0 1px var(--he-hairline)}
:root[data-intent]:root:root:root footer:not(.ah-foot) .signup-row{border-radius:999px;background:var(--he-container);padding:4px;gap:4px}
:root[data-intent]:root:root:root footer:not(.ah-foot) .signup-row input{border:0;background:none;border-radius:999px;padding:0 16px;color:var(--he-ink)}
:root[data-intent]:root:root:root footer:not(.ah-foot) .signup-row .btn{border-radius:999px;background:var(--he-rust);color:var(--he-on-rust);border:0}
:root[data-intent]:root:root:root footer:not(.ah-foot) .legal{border-top:1px solid var(--he-hairline);color:var(--he-stone)}
:root[data-intent]:root:root:root footer:not(.ah-foot) .legal a{color:var(--he-ink-soft)}

/* The navigation, calmer (CEO 2026-10-20: "navigation still is messy"): the five sections sit in one pill bar, their menu
   arrows folded into it in stone; Day/Night is an icon; "Talk to a person" is a plain link; Sign in an outline pill;
   "Search homes" the one rust action, last. Same links and buttons, same order for screen readers. */
:root[data-intent]:root:root:root .nav-links{background:var(--he-container);border-radius:999px;padding:4px;gap:2px;box-shadow:inset 0 0 0 1px var(--he-hairline)}
:root[data-intent]:root:root:root .nv{border-radius:999px}
:root[data-intent]:root:root:root .nv > a.l{padding:0 2px 0 14px;min-height:36px;background:none;box-shadow:none}
:root[data-intent]:root:root:root .nv.on{background:var(--he-lowest);box-shadow:var(--he-elev-low)}
:root[data-intent]:root:root:root .nv.on > a.l{background:none;color:var(--he-ink)}
:root[data-intent]:root:root:root .nv:hover{background:var(--he-lowest)}
:root[data-intent]:root:root:root .nv-t{width:24px;height:36px;margin-right:4px;background:none;color:var(--he-stone);border-radius:999px}
:root[data-intent]:root:root:root .nv-t:hover{background:none;color:var(--he-ink)}
:root[data-intent]:root:root:root .nv-p{top:calc(100% + 10px);border-radius:24px}
:root[data-intent]:root:root:root .nav-end{gap:10px}
:root[data-intent]:root:root:root .nav-end .nav-call{order:1;min-height:40px;font:500 .8125rem/1 var(--hv-font-body);color:var(--he-stone);background:none;box-shadow:none;padding:0 4px}
:root[data-intent]:root:root:root .nav-end .nav-util{order:2;display:flex;align-items:center;gap:6px}
:root[data-intent]:root:root:root .nav-end .nav-search{order:3}
:root[data-intent]:root:root:root .nav-util .theme-one{width:40px;min-width:40px;min-height:40px;padding:0;justify-content:center;border-radius:999px;background:none;box-shadow:inset 0 0 0 1px var(--he-hairline)}
:root[data-intent]:root:root:root .nav-util .theme-one span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:root[data-intent]:root:root:root .nav-util .talk{background:none;box-shadow:none;border:0;min-height:40px;padding:0 8px;color:var(--he-ink-soft);font:500 .875rem/1 var(--hv-font-body)}
:root[data-intent]:root:root:root .nav-util .talk:hover{color:var(--he-ink);text-decoration:underline;text-underline-offset:4px}
:root[data-intent]:root:root:root .nav-util .nav-signin{min-height:40px;display:inline-flex;align-items:center;padding:0 16px;border-radius:999px;background:none;box-shadow:inset 0 0 0 1px var(--he-hairline);color:var(--he-ink);font:600 .875rem/1 var(--hv-font-display)}

/* ===== Every page (CEO 2026-10-20: "just transition them all properly"). A place page opens on its board under a slim
   head, so its top keeps its own height; the .sx search rules above only ever match /search's own markup. */
:root[data-intent] .sf-top.sf-top-slim{min-height:0}
:root[data-intent]:has(.sf-band.is-active) .sf-top.sf-top-slim{min-height:0}

/* Share (CEO 2026-10-20: on a note, a home, a place): a small outline pill beside the thing it shares. */
:root[data-intent] .hv-share{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border:0;border-radius:999px;background:none;box-shadow:inset 0 0 0 1px var(--he-hairline);color:var(--he-ink);font:600 .8125rem/1 var(--hv-font-display);cursor:pointer;transition:background .3s var(--he-ease),box-shadow .3s var(--he-ease)}
:root[data-intent] .hv-share:hover{background:var(--he-rust-tint);box-shadow:inset 0 0 0 1px var(--he-rust)}
:root[data-intent] .hv-share.is-done{background:var(--he-rust);box-shadow:none;color:var(--he-on-rust)}
:root[data-intent] .note-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
:root[data-intent] .bt-act .hv-share{margin-top:4px}

/* Home cards (CEO 2026-10-20): a heart and a share on the photograph of every home in a list. */
:root[data-intent] .home-c{position:relative}
:root[data-intent] .ah-card-acts{position:absolute;top:12px;right:12px;display:flex;gap:8px;z-index:2}
:root[data-intent] .ah-act{display:grid;place-items:center;width:40px;height:40px;border:0;border-radius:999px;background:rgba(250,247,242,.86);color:#111111;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 2px 8px rgba(17,17,17,.12);cursor:pointer;transition:transform .3s var(--he-ease)}
:root[data-intent] .ah-act:hover{transform:scale(1.06)}
:root[data-intent] .ah-act.on{color:#b86530}
:root[data-intent] .ah-act.on svg{fill:currentColor}
:root[data-intent] .ah-act.is-done{background:#b86530;color:#ffffff}
