/* =========================================================================== Jail411 facility record page — 2026 redesign Built from design_handoff_jail411_facility_page (README fidelity: "high"). SCOPED TO body.facility-composition-state-prison ON PURPOSE — the 30 California state prisons, not the whole directory. Two reasons. The handoff says to put these tokens in california-shared.css, but that file is also loaded by all 57 California COUNTY hubs, which have their own finished visual language: a token named --navy landing there would silently restyle pages nobody asked to change. And the facility page type covers ~6,700 records, most carrying a fraction of this data — a jail with a phone number and nothing else does not need a four-metric hero strip. So: its own sheet, loaded only for a California state-prison record, every rule scoped to that body class. The one deliberate deviation from the handoff. Everything else — colour, type, spacing, motion — follows it exactly. ======================================================================== */ body.facility-composition-state-prison, body.facility-stay{ /* Colour */ --navy:#0D1B2A; --navy-mid:#1B263B; --steel:#415A77; --slate:#778DA9; --ash:#8A8F98; --fog:#DDDDD6; --bone:#E0E1DD; --milk:#F4F4F1; --warm:#D4A03C; --warm-hover:#C08F2F; --white:#FFFFFF; --body-ink:#3A4453; --body-mute:#5A6472; --hair:#EDEDE8; --card-hover-border:#C9C9C1; --warn-bg:#FCF0EF; --warn-border:#F0C9C6; --warn-ink:#7A2620; --cav-bg:#FBF6EA; --cav-border:#E4CE9A; --cav-ink:#3A2F16; --pill-bg:#E7E3D6; /* Type */ --ui:'Instrument Sans',system-ui,-apple-system,'Segoe UI',Arial,sans-serif; --text:'Outfit',system-ui,-apple-system,'Segoe UI',Arial,sans-serif; /* Geometry */ --wrap:1180px; --pad:28px; --rail:316px; --gap:56px; --ease:cubic-bezier(.22,.61,.36,1); } /* Two classes plus the element, because california-shared.css carries `.state-scope-california.page-facility{background:#fff;color:var(--ca-ink)}` at (0,2,0) — which beat this rule at (0,1,1) and painted the page white on white, flattening every card edge on the page. */ body.facility-composition-state-prison.page-facility{ background:var(--milk);color:var(--body-ink);font-family:var(--text)} /* .wrap carries a white background of its own, which paints OVER the body's --milk ground. Computed style on reported the right colour while the rendered pixel was #FFFFFF — a child covering the ground is invisible to getComputedStyle, so this one has to be checked by sampling the pixel. */ body.facility-composition-state-prison.page-facility .wrap{ width:auto;max-width:none;margin:0;padding:0;background:transparent; /* The site-wide .wrap carries overflow:hidden as a horizontal guard. Any `overflow` other than visible makes an ancestor a scroll container, and a sticky descendant then sticks to THAT box rather than the viewport — which is why the rail scrolled away instead of holding. `clip` keeps the guard without creating the scroll container. */ overflow-x:clip;overflow-y:visible} body.facility-composition-state-prison.page-facility{ overflow-x:clip;overflow-y:visible} /* ── Hero ──────────────────────────────────────────────────────────────── min-height 560px, image cover, double-dark scrim. The scrim is dark at the top to protect the breadcrumb, light through the middle so the photograph survives, then very dark at the bottom under the metric strip. */ body.facility-composition-state-prison .fx2-hero{ position:relative;display:flex;align-items:flex-end; min-height:560px;background:var(--navy);isolation:isolate;overflow:hidden} body.facility-composition-state-prison .fx2-hero__img{ position:absolute!important;z-index:-2;inset:0; display:block;width:100%!important;height:100%!important;max-width:none!important; object-fit:cover;object-position:center} body.facility-composition-state-prison .fx2-hero__scrim{ position:absolute;z-index:-1;inset:0;pointer-events:none; /* The handoff's stops are .70 / .30@32% / .86@68% / .97. Measured against the real photograph the breadcrumb lands at 29-32% and the gold eyebrow at 37-39% — both inside the thinnest part of the ramp, over a bright dusk sky. The protected band is extended to clear the eyebrow before the photograph opens up. Unreadable text is broken text; a slightly quieter sky is not. */ background:linear-gradient(180deg, rgba(13,27,42,.80) 0%, rgba(13,27,42,.66) 34%, rgba(13,27,42,.34) 52%, rgba(13,27,42,.86) 72%, rgba(13,27,42,.97) 100%)} body.facility-composition-state-prison .fx2-hero__inner{ width:100%;max-width:var(--wrap);margin:0 auto;padding:120px var(--pad) 44px} body.facility-composition-state-prison .fx2-crumbs, body.facility-stay .fx2-crumbs{ display:flex;flex-wrap:wrap;align-items:center;gap:.5em; width:auto;max-width:none;margin:0 0 28px;padding:0;border:0; background:transparent!important; color:rgba(224,225,221,.7);font-family:var(--text);font-size:13px} body.facility-composition-state-prison .fx2-crumbs a{color:rgba(224,225,221,.7);text-decoration:none} body.facility-composition-state-prison .fx2-crumbs a:hover{color:var(--warm)} body.facility-composition-state-prison .fx2-crumbs [aria-current]{color:var(--milk)} /* The handoff's scrim thins to 30% opacity at 32% height so the photograph's midtones survive. On a bright dusk sky that band lands exactly on the eyebrow and breadcrumb and washes both out. A shadow on those two elements fixes the legibility without darkening the picture, which deepening the scrim would. */ body.facility-composition-state-prison .fx2-crumbs, body.facility-composition-state-prison .fx2-hero__eyebrow, body.facility-stay .fx2-hero__eyebrow{ text-shadow:0 1px 6px rgba(13,27,42,.9),0 0 2px rgba(13,27,42,.7)} body.facility-composition-state-prison .fx2-hero__eyebrow, body.facility-stay .fx2-hero__eyebrow{ margin:0 0 14px;color:var(--warm); font:600 12px/1 var(--ui);letter-spacing:.16em;text-transform:uppercase} body.facility-composition-state-prison .fx2-hero h1{ max-width:16ch;margin:0;color:#fff; font:600 clamp(36px,5.2vw,56px)/1.04 var(--ui);letter-spacing:-.025em; text-transform:none} body.facility-composition-state-prison .fx2-hero__sub{ margin:10px 0 30px;color:rgba(224,225,221,.72);font:400 22px/1.3 var(--ui)} /* Identity chip */ body.facility-composition-state-prison .fx2-chip{ display:inline-flex;align-items:center;flex-wrap:wrap;gap:0 18px; margin:0 0 26px;padding:12px 18px;border-radius:8px; background:rgba(27,38,59,.72);border:1px solid rgba(65,90,119,.55); backdrop-filter:blur(8px)} body.facility-composition-state-prison .fx2-chip__badge{ padding:4px 9px;border-radius:3px;background:var(--warm);color:var(--navy); font:700 13px/1 var(--ui);letter-spacing:.1em} body.facility-composition-state-prison .fx2-chip__div{width:1px;height:30px;background:rgba(65,90,119,.6)} body.facility-composition-state-prison .fx2-chip small{ display:block;color:rgba(224,225,221,.55); font:400 11px/1.4 var(--text);letter-spacing:.1em;text-transform:uppercase} body.facility-composition-state-prison .fx2-chip b{display:block;color:#fff;font:600 15px/1.3 var(--ui)} /* Metric strip — the 1px grid gap IS the divider. This is what carries the hero on a facility with no photograph. */ body.facility-composition-state-prison .fx2-metrics, body.facility-stay .fx2-metrics{ display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px; max-width:760px;margin:0;padding:0;list-style:none; background:rgba(65,90,119,.5);border:1px solid rgba(65,90,119,.5);border-radius:6px; overflow:hidden} body.facility-composition-state-prison .fx2-metrics li, body.facility-stay .fx2-metrics li{ margin:0;padding:13px 18px;border:0; background:rgba(27,38,59,.86);backdrop-filter:blur(8px)} body.facility-composition-state-prison .fx2-metrics small, body.facility-stay .fx2-metrics small{ display:block;color:rgba(224,225,221,.55); font:400 11px/1.4 var(--text);letter-spacing:.1em;text-transform:uppercase} body.facility-composition-state-prison .fx2-metrics b, body.facility-stay .fx2-metrics b{display:block;margin-top:3px;color:#fff;font:600 18px/1.3 var(--ui)} body.facility-composition-state-prison .fx2-metrics .is-warm, body.facility-stay .fx2-metrics .is-warm{color:var(--warm)} body.facility-composition-state-prison .fx2-hero__caption{ position:absolute;right:var(--pad);bottom:12px;z-index:1;max-width:52ch; margin:0;text-align:right; color:rgba(224,225,221,.45);font:400 11px/1.5 var(--text)} body.facility-composition-state-prison .fx2-hero__caption a{color:inherit} /* ── Action bar ──────────────────────────────────────────────────────────── */ body.facility-composition-state-prison .fx2-actions{ background:var(--navy);border-top:1px solid rgba(65,90,119,.4)} body.facility-composition-state-prison .fx2-actions__inner{ display:flex;flex-wrap:wrap;align-items:center;gap:12px; max-width:var(--wrap);margin:0 auto;padding:20px var(--pad)} body.facility-composition-state-prison .fx2-btn, body.facility-stay .fx2-btn{ display:inline-flex;align-items:center;gap:8px; padding:12px 20px;border-radius:4px;border:0; background:var(--warm);color:var(--navy); font:600 15px/1 var(--ui);text-decoration:none; transition:background 240ms var(--ease),color 240ms var(--ease),border-color 240ms var(--ease)} body.facility-composition-state-prison .fx2-btn:hover,body.facility-composition-state-prison .fx2-btn:focus{background:var(--warm-hover)} body.facility-composition-state-prison .fx2-btn--ghost{ background:transparent;color:var(--milk);border:1px solid rgba(224,225,221,.35)} body.facility-composition-state-prison .fx2-btn--ghost:hover,body.facility-composition-state-prison .fx2-btn--ghost:focus{ background:transparent;border-color:var(--warm);color:var(--warm)} body.facility-composition-state-prison .fx2-actions__note{ max-width:38ch;margin:0 0 0 auto; color:rgba(224,225,221,.62);font:400 13px/1.5 var(--text)} /* ── Condensed sub-bar — fixed, appears past the hero ────────────────────── */ body.facility-composition-state-prison .fx2-sub{ position:fixed;top:64px;left:0;right:0;z-index:55;height:52px; display:flex;align-items:center; background:rgba(27,38,59,.94);backdrop-filter:blur(12px); border-bottom:1px solid rgba(65,90,119,.45); opacity:0;transform:translateY(6px);pointer-events:none; transition:opacity 240ms var(--ease),transform 240ms var(--ease)} body.facility-composition-state-prison .fx2-sub.is-on{opacity:1;transform:none;pointer-events:auto} body.facility-composition-state-prison .fx2-sub__inner{ display:flex;align-items:center;gap:14px; width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--pad)} body.facility-composition-state-prison .fx2-sub__name{color:#fff;font:600 15px/1 var(--ui)} body.facility-composition-state-prison .fx2-sub__where{color:rgba(224,225,221,.55);font:400 13px/1 var(--text)} body.facility-composition-state-prison .fx2-sub__spacer{margin-left:auto} body.facility-composition-state-prison .fx2-sub .fx2-btn{padding:7px 15px;font-size:13px} /* Live-status pill + dot */ body.facility-composition-state-prison .fx2-status{ display:inline-flex;align-items:center;gap:7px; color:var(--warm);font:600 12px/1 var(--ui);letter-spacing:.08em;text-transform:uppercase} body.facility-composition-state-prison .fx2-dot{ width:7px;height:7px;border-radius:100px;background:var(--warm); animation:j411pulse 2400ms ease-in-out infinite} @keyframes j411pulse{ 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.35;transform:scale(.82)} } /* ── Lede + provenance ─────────────────────────────────────────────────── Both used to sit inside the dark hero band, set over a photograph. Moved into the body so the lede can run at a readable measure. */ body.facility-composition-state-prison .fx2-lede{ max-width:66ch;margin:0 0 22px;color:var(--body-ink);font:400 19px/1.62 var(--text)} body.facility-composition-state-prison .fx2-lede b, body.facility-composition-state-prison .fx2-lede strong{font-weight:600} body.facility-composition-state-prison .fx2-prov{ max-width:70ch;margin:0 0 44px;padding:18px 22px; background:var(--white);border:1px solid var(--fog);border-left:3px solid var(--steel); border-radius:0 8px 8px 0;color:var(--body-mute);font:400 14px/1.6 var(--text)} body.facility-composition-state-prison .fx2-prov b{color:var(--navy);font-weight:600} body.facility-composition-state-prison .fx2-prov a{color:var(--steel);font-weight:500} /* The redesigned composition gets its own wrapper rather than .ca-record-body, whose descendant rules in california-shared.css outrank anything scoped to the body class alone. */ body.facility-composition-state-prison.page-facility .fx2-body{ width:auto;max-width:var(--wrap);margin:0 auto;padding:56px var(--pad) 0} /* ── Reveal ──────────────────────────────────────────────────────────────── */ body.facility-composition-state-prison [data-reveal], body.facility-stay [data-reveal]{ opacity:0;transform:translateY(12px); transition:opacity 600ms var(--ease),transform 600ms var(--ease)} body.facility-composition-state-prison [data-reveal].is-in, body.facility-stay [data-reveal].is-in{opacity:1;transform:none} @media (prefers-reduced-motion:reduce){ body.facility-composition-state-prison [data-reveal], body.facility-stay [data-reveal]{opacity:1;transform:none;transition:none} body.facility-composition-state-prison .fx2-dot{animation:none} body.facility-composition-state-prison .fx2-sub{transition:none} } /* ── Responsive ──────────────────────────────────────────────────────────── */ @media (max-width:760px){ /* The caption follows the hero inner in the DOM. The desktop flex row made that static caption a second, squeezed flex item on narrow screens. */ body.facility-composition-state-prison .fx2-hero{display:block;min-height:auto} body.facility-composition-state-prison .fx2-hero__inner{padding:88px 20px 32px} body.facility-composition-state-prison .fx2-hero__sub{font-size:18px;margin-bottom:22px} body.facility-composition-state-prison .fx2-metrics, body.facility-stay .fx2-metrics{grid-template-columns:1fr 1fr} body.facility-composition-state-prison .fx2-metrics--3{grid-template-columns:repeat(3,minmax(0,1fr))} body.facility-composition-state-prison .fx2-metrics li{padding:12px 10px} body.facility-composition-state-prison .fx2-hero__caption{ position:relative;right:auto;bottom:auto;max-width:none; margin:-8px 20px 0;padding:0 0 16px;text-align:left} body.facility-composition-state-prison .fx2-actions__inner{padding:16px 20px} /* Call first and full width — it is the one thing someone does from a car park. */ body.facility-composition-state-prison .fx2-btn, body.facility-stay .fx2-btn{width:100%;justify-content:center} body.facility-composition-state-prison .fx2-actions__note{margin:4px 0 0;max-width:none} body.facility-composition-state-prison .fx2-sub{display:none} } /* ==FX2-BODY-START== */ /* =========================================================================== 2026 facility body — cards, visiting flow, places, figures, rail. Appended to facility-2026.css. Scoped, like the rest, to the state-prison composition. ======================================================================== */ /* ── Body grid ───────────────────────────────────────────────────────────── */ body.facility-composition-state-prison .fx2-grid{ display:grid;grid-template-columns:minmax(0,1fr) var(--rail);gap:var(--gap); align-items:start;max-width:var(--wrap);margin:0 auto;padding:0 var(--pad) 96px} /* The grid already lives inside .fx2-body, which owns the page gutters. */ body.facility-composition-state-prison.page-facility .fx2-body>.fx2-grid{ padding-inline:0} body.facility-composition-state-prison .fx2-main{min-width:0} body.facility-composition-state-prison .fx2-main>section{margin:0 0 var(--gap);scroll-margin-top:130px} body.facility-composition-state-prison h2{ margin:0 0 14px;padding:0;border:0;color:var(--navy); font:600 32px/1.15 var(--ui);letter-spacing:-.02em;text-transform:none} body.facility-composition-state-prison h3{ margin:0 0 8px;color:var(--navy);font:600 19px/1.3 var(--ui);text-transform:none} body.facility-composition-state-prison p{ max-width:70ch;margin:0 0 14px;color:var(--body-ink);font:400 17px/1.65 var(--text)} body.facility-composition-state-prison a{color:var(--steel)} body.facility-composition-state-prison .fx2-eyebrow{ margin:0 0 20px;padding:0 0 12px;border-bottom:1px solid var(--fog); color:var(--steel);font:600 15px/1 var(--ui);letter-spacing:.14em;text-transform:uppercase} body.facility-composition-state-prison h3.fx2-eyebrow{ margin:30px 0 14px;padding:0;border-bottom:0;letter-spacing:.12em} /* ── Cards ───────────────────────────────────────────────────────────────── */ body.facility-composition-state-prison .fx2-card{ min-width:0;padding:20px 22px;overflow-wrap:anywhere; background:var(--white);border:1px solid var(--fog);border-radius:8px; transition:box-shadow 240ms var(--ease),border-color 240ms var(--ease)} body.facility-composition-state-prison .fx2-card:hover{ box-shadow:0 2px 8px rgba(13,27,42,.08);border-color:var(--card-hover-border)} body.facility-composition-state-prison .fx2-card p{font-size:15px;line-height:1.6} body.facility-composition-state-prison .fx2-card--wide{margin-top:20px} body.facility-composition-state-prison .fx2-card--span{grid-column:1/-1} body.facility-composition-state-prison .fx2-pair{ display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr); min-width:0;gap:20px;align-items:start} body.facility-composition-state-prison .fx2-pair--tight{gap:16px;margin:14px 0} body.facility-composition-state-prison .fx2-card ul{ max-width:none;margin:0;padding-left:16px;border:0;list-style:disc} body.facility-composition-state-prison .fx2-card li{ padding:0;border:0;color:var(--body-ink);font:400 14px/1.65 var(--text)} body.facility-composition-state-prison .fx2-minihead{ margin:0 0 8px;color:var(--steel);font:600 13px/1 var(--ui); letter-spacing:.08em;text-transform:uppercase} /* Label/value inside the contact card */ body.facility-composition-state-prison .fx2-kv{ padding:12px 0;border-bottom:1px solid var(--hair)} body.facility-composition-state-prison .fx2-kv:first-child{padding-top:0} body.facility-composition-state-prison .fx2-kv:last-child{border-bottom:0;padding-bottom:0} body.facility-composition-state-prison .fx2-kv__k{ display:block;margin-bottom:4px;color:var(--ash); font:400 11px/1 var(--text);letter-spacing:.1em;text-transform:uppercase} body.facility-composition-state-prison .fx2-kv__phone{ color:var(--navy);font:600 21px/1.2 var(--ui);text-decoration:none; font-variant-numeric:tabular-nums} body.facility-composition-state-prison .fx2-kv__phone:hover{color:var(--steel)} body.facility-composition-state-prison .fx2-kv__v{ display:block;color:var(--body-ink);font:400 15px/1.5 var(--text);font-style:normal} body.facility-composition-state-prison .fx2-kv__link{ display:inline-block;margin-top:5px;font:500 13px/1 var(--text)} /* Attribute rows */ body.facility-composition-state-prison .fx2-fact{ display:flex;justify-content:space-between;gap:18px;align-items:baseline; padding:11px 0;border-bottom:1px solid var(--hair)} body.facility-composition-state-prison .fx2-fact:last-child{border-bottom:0;padding-bottom:0} body.facility-composition-state-prison .fx2-fact>span{ color:var(--body-mute);font:400 14px/1.5 var(--text)} body.facility-composition-state-prison .fx2-fact>b{ color:var(--navy);font:600 14px/1.5 var(--text);text-align:right; font-variant-numeric:tabular-nums} body.facility-composition-state-prison .fx2-fact>b.is-warm{color:var(--warm)} body.facility-composition-state-prison .fx2-dim{color:var(--body-mute);font-weight:400} body.facility-composition-state-prison .fx2-pill{ display:inline-block;padding:3px 9px;border-radius:100px; background:var(--pill-bg);border:1px solid var(--warm);color:var(--navy); font:600 12px/1.4 var(--ui)} /* ── Occupancy meter ─────────────────────────────────────────────────────── */ body.facility-composition-state-prison .fx2-occ{margin-top:20px} body.facility-composition-state-prison .fx2-occ__head{ display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:12px} body.facility-composition-state-prison .fx2-occ__head span{ color:var(--navy);font:600 14px/1 var(--ui)} body.facility-composition-state-prison .fx2-occ__head b{ color:var(--warm);font:600 26px/1 var(--ui);letter-spacing:-.02em} body.facility-composition-state-prison .fx2-occ__track{ position:relative;height:12px;border-radius:100px;background:var(--hair);overflow:hidden} body.facility-composition-state-prison .fx2-occ__within{ position:absolute;inset:0 auto 0 0;background:var(--steel)} /* The gold segment IS the over-capacity population. */ body.facility-composition-state-prison .fx2-occ__over{ position:absolute;top:0;bottom:0;background:var(--warm)} body.facility-composition-state-prison .fx2-occ__ends{ display:flex;justify-content:space-between;gap:16px;margin-top:10px; color:var(--body-mute);font:400 13px/1.5 var(--text)} body.facility-composition-state-prison .fx2-occ__ends b{color:var(--navy);font-weight:600} /* ── Callouts ────────────────────────────────────────────────────────────── */ body.facility-composition-state-prison .fx2-cav, body.facility-composition-state-prison .fx2-warn{ max-width:none;margin:14px 0;padding:16px 20px;border-radius:0 8px 8px 0; font:400 15px/1.6 var(--text)} body.facility-composition-state-prison .fx2-cav{ background:var(--cav-bg);border:1px solid var(--cav-border); border-left:3px solid var(--warm);color:var(--cav-ink)} body.facility-composition-state-prison .fx2-warn{ background:var(--warn-bg);border:1px solid var(--warn-border); border-left:3px solid var(--warn-ink);color:var(--warn-ink);font-size:14px} body.facility-composition-state-prison :is(.fx2-cav,.fx2-warn) b{font-weight:600} body.facility-composition-state-prison .fx2-quiet{ color:var(--body-mute);font-size:14px} body.facility-composition-state-prison .fx2-src{ max-width:none;margin:14px 0 0;color:var(--ash);font:400 13px/1.6 var(--text)} body.facility-composition-state-prison .fx2-outbtn{ display:inline-block;padding:11px 18px;border:1px solid var(--fog);border-radius:4px; background:var(--white);color:var(--navy);font:600 14px/1 var(--text);text-decoration:none; transition:border-color 240ms var(--ease)} body.facility-composition-state-prison .fx2-outbtn:hover{border-color:var(--steel)} /* ── Visiting: hours panel ───────────────────────────────────────────────── */ body.facility-composition-state-prison .fx2-hours{ margin:0 0 4px;padding:26px 28px;border-radius:8px;background:var(--navy)} body.facility-composition-state-prison .fx2-hours__head{ display:flex;justify-content:space-between;align-items:center;gap:16px; flex-wrap:wrap;margin-bottom:18px} body.facility-composition-state-prison .fx2-hours h3{margin:0;color:#fff} body.facility-composition-state-prison .fx2-live{ display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:100px; background:var(--warm);color:var(--navy); font:600 12px/1 var(--ui);letter-spacing:.08em;text-transform:uppercase} body.facility-composition-state-prison .fx2-live .fx2-dot{background:var(--navy)} body.facility-composition-state-prison .fx2-live--caution{ background:var(--sand);color:var(--navy)} body.facility-composition-state-prison .fx2-live--closed{ background:#f3cbc5;color:#6d1f18} body.facility-composition-state-prison .fx2-live--closed .fx2-dot{background:#9b2c24;animation:none} body.facility-composition-state-prison .fx2-days{ display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1px; background:rgba(65,90,119,.5);border:1px solid rgba(65,90,119,.5); border-radius:6px;overflow:hidden} body.facility-composition-state-prison .fx2-day{padding:18px 20px;background:var(--navy-mid)} body.facility-composition-state-prison .fx2-day__n{ display:block;color:var(--warm);font:600 15px/1.3 var(--ui)} body.facility-composition-state-prison .fx2-day__h{ display:block;margin-top:3px;color:#fff;font:400 15px/1.4 var(--text)} /* The processing cutoff is the number that decides whether the visit happens. */ body.facility-composition-state-prison .fx2-day__c{ display:block;margin-top:4px;color:rgba(224,225,221,.6);font:400 13px/1.4 var(--text)} body.facility-composition-state-prison .fx2-hours__note{ max-width:none;margin:14px 0 0;color:rgba(224,225,221,.82);font:400 14px/1.6 var(--text)} body.facility-composition-state-prison .fx2-hours__note b{color:#fff;font-weight:600} /* ── Visiting: the four steps ────────────────────────────────────────────── */ body.facility-composition-state-prison ol.fx2-steps{ max-width:none;margin:22px 0 0;padding:0;list-style:none; background:var(--white);border:1px solid var(--fog);border-radius:8px;overflow:hidden} body.facility-composition-state-prison ol.fx2-steps>li{ display:flex;gap:20px;padding:24px 26px;border:0;border-bottom:1px solid var(--hair)} body.facility-composition-state-prison ol.fx2-steps>li:last-child{border-bottom:0} body.facility-composition-state-prison .fx2-step__n{ flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:100px; background:var(--navy);color:var(--warm);font:600 15px/1 var(--ui)} body.facility-composition-state-prison .fx2-step__b{min-width:0;flex:1} body.facility-composition-state-prison .fx2-step__b p{font-size:15px;line-height:1.6} body.facility-composition-state-prison .fx2-wins{ display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:14px 0} body.facility-composition-state-prison .fx2-win{ padding:12px 14px;border:1px solid var(--fog);border-radius:6px} body.facility-composition-state-prison .fx2-win__k{ display:block;margin-bottom:5px;color:var(--ash); font:400 12px/1 var(--text);letter-spacing:.06em;text-transform:uppercase} body.facility-composition-state-prison .fx2-win span{ display:block;color:var(--body-ink);font:400 14px/1.5 var(--text)} body.facility-composition-state-prison .fx2-sub2{ margin-top:16px;padding-top:16px;border-top:1px solid var(--hair)} body.facility-composition-state-prison .fx2-sub2>b{ display:block;margin-bottom:6px;color:var(--navy);font:600 15px/1.3 var(--ui)} /* ── Money mini-cards ────────────────────────────────────────────────────── */ body.facility-composition-state-prison .fx2-mini{ margin:12px 0;padding:12px 14px;border:1px solid var(--fog);border-radius:6px} body.facility-composition-state-prison .fx2-mini>span{ display:block;margin-bottom:4px;color:var(--steel); font:600 12px/1 var(--ui);letter-spacing:.08em;text-transform:uppercase} body.facility-composition-state-prison .fx2-mini--warm>span{color:var(--warm)} body.facility-composition-state-prison .fx2-mini p{margin:0;font-size:14px} /* ── Mailing address + copy ──────────────────────────────────────────────── */ body.facility-composition-state-prison .fx2-addr{ display:inline-block;margin-top:6px;padding:14px 18px; background:var(--milk);border:1px solid var(--fog);border-radius:6px} body.facility-composition-state-prison .fx2-addr__head{ display:flex;align-items:center;gap:12px;margin-bottom:8px} body.facility-composition-state-prison .fx2-addr__head span{ color:var(--ash);font:400 12px/1 var(--text);letter-spacing:.08em;text-transform:uppercase} body.facility-composition-state-prison .fx2-addr p{margin:0;font-size:15px;line-height:1.5} body.facility-composition-state-prison .fx2-mail-routes{display:grid;gap:12px;margin-top:16px} body.facility-composition-state-prison .fx2-copy{ padding:3px 9px;border:1px solid var(--fog);border-radius:4px;background:var(--white); color:var(--steel);font:600 12px/1.4 var(--text);cursor:pointer; transition:border-color 240ms var(--ease),color 240ms var(--ease)} body.facility-composition-state-prison .fx2-copy.is-done{color:var(--navy);border-color:var(--warm)} /* ── Places ──────────────────────────────────────────────────────────────── */ body.facility-composition-state-prison .fx2-places{ display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin:0 0 16px} body.facility-composition-state-prison .fx2-place{ display:flex;flex-direction:column;gap:4px;padding:18px 20px; background:var(--white);border:1px solid var(--fog);border-radius:8px} body.facility-composition-state-prison .fx2-place b{color:var(--navy);font:600 16px/1.3 var(--ui)} body.facility-composition-state-prison .fx2-place__m{color:var(--ash);font:400 13px/1.45 var(--text)} body.facility-composition-state-prison .fx2-place__a{color:var(--body-ink);font:400 14px/1.5 var(--text)} body.facility-composition-state-prison .fx2-place__t{margin-top:2px;font:600 14px/1 var(--text)} body.facility-composition-state-prison .fx2-more{margin:0 0 22px} body.facility-composition-state-prison .fx2-more>summary{ display:inline-block;margin-bottom:14px;color:var(--steel); font:500 13px/1 var(--text);cursor:pointer;list-style:none} body.facility-composition-state-prison .fx2-more>summary::-webkit-details-marker{display:none} body.facility-composition-state-prison .fx2-more[open]>summary{color:var(--navy)} /* ── Yard cards ──────────────────────────────────────────────────────────── */ body.facility-composition-state-prison .fx2-yards{ display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin:16px 0} body.facility-composition-state-prison .fx2-yard{ padding:20px 22px;border-radius:8px;background:var(--navy-mid)} body.facility-composition-state-prison .fx2-yard__k{ display:block;margin-bottom:8px;color:var(--warm); font:600 12px/1 var(--ui);letter-spacing:.12em;text-transform:uppercase} body.facility-composition-state-prison .fx2-yard p{ margin:0;max-width:none;color:rgba(224,225,221,.75);font:400 14px/1.6 var(--text)} body.facility-composition-state-prison .fx2-yard__t{ display:block;margin:0 0 8px;color:#fff;font:600 17px/1.3 var(--ui);letter-spacing:-.01em} /* ── Facility photo gallery ─────────────────────────────────────────────── */ body.facility-composition-state-prison .fx2-gallery-intro{max-width:64ch} body.facility-composition-state-prison .fx2-gallery{ display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:22px} body.facility-composition-state-prison .fx2-gallery__item{ min-width:0;margin:0;overflow:hidden;background:var(--white); border:1px solid var(--fog);border-radius:8px} body.facility-composition-state-prison .fx2-gallery__item--lead{grid-column:1/-1} body.facility-composition-state-prison .fx2-gallery__item img{ display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;background:var(--fog)} body.facility-composition-state-prison .fx2-gallery__item--lead img{aspect-ratio:16/9} body.facility-composition-state-prison .fx2-gallery__item--portrait img{aspect-ratio:4/5} body.facility-composition-state-prison .fx2-gallery__item figcaption{ padding:12px 14px;color:var(--body-mute);font:400 14px/1.5 var(--text)} /* ── Eat table ───────────────────────────────────────────────────────────── */ body.facility-composition-state-prison .fx2-table{ width:100%;min-width:560px;border-collapse:collapse;background:var(--white)} body.facility-composition-state-prison .fx2-table-scroll{ overflow-x:auto;border:1px solid var(--fog);border-radius:8px;background:var(--white)} body.facility-composition-state-prison .fx2-table th, body.facility-composition-state-prison .fx2-table td{ padding:14px 20px;border-bottom:1px solid var(--hair);text-align:left;vertical-align:top; color:var(--body-ink);font:400 14px/1.55 var(--text)} body.facility-composition-state-prison .fx2-table th{ background:var(--milk);color:var(--mute);font-weight:600;letter-spacing:.06em;text-transform:uppercase} body.facility-composition-state-prison .fx2-table th:first-child, body.facility-composition-state-prison .fx2-table td:first-child{width:34%} body.facility-composition-state-prison .fx2-table th:last-child, body.facility-composition-state-prison .fx2-table td:last-child{width:22%} body.facility-composition-state-prison .fx2-table tbody tr:last-child td{border-bottom:0} body.facility-composition-state-prison .fx2-table b{color:var(--navy);font-weight:600} body.facility-composition-state-prison .fx2-table small{ display:block;margin-top:3px;color:var(--mute);font:400 13px/1.45 var(--text)} body.facility-composition-state-prison .fx2-table a{color:var(--navy);font-weight:600;text-decoration:none} body.facility-composition-state-prison .fx2-table a:hover{text-decoration:underline} body.facility-composition-state-prison .fx2-copy-status{ position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden; clip:rect(0,0,0,0);white-space:nowrap;border:0} /* ── Figures ─────────────────────────────────────────────────────────────── */ body.facility-composition-state-prison .fx2-figs{ display:grid;grid-template-columns:1fr 1fr;gap:20px} body.facility-composition-state-prison .fx2-fig__head{ display:flex;justify-content:space-between;align-items:baseline;gap:16px; margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid var(--hair)} body.facility-composition-state-prison .fx2-fig__head h3{margin:0;font-size:16px} body.facility-composition-state-prison .fx2-fig__head span{ color:var(--ash);font:400 12px/1.4 var(--text);white-space:nowrap} /* ── Guides band + neighbours ────────────────────────────────────────────── */ body.facility-composition-state-prison .fx2-guides{ padding:34px 36px;border-radius:8px;background:var(--navy)} body.facility-composition-state-prison .fx2-guides h2{color:#fff;font-size:24px;margin-bottom:8px} body.facility-composition-state-prison .fx2-guides p{ max-width:60ch;color:rgba(224,225,221,.72);font-size:15px} body.facility-composition-state-prison .fx2-guides>div{ display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-top:18px} body.facility-composition-state-prison .fx2-guides a{ padding:16px 18px;border:1px solid rgba(65,90,119,.6);border-radius:6px; color:var(--milk);font:500 15px/1.3 var(--ui);text-decoration:none; transition:border-color 240ms var(--ease),color 240ms var(--ease)} body.facility-composition-state-prison .fx2-guides a:hover{border-color:var(--warm);color:var(--warm)} body.facility-composition-state-prison .fx2-near{ display:flex;flex-direction:column;gap:4px;text-decoration:none} body.facility-composition-state-prison .fx2-near b{color:var(--navy);font:600 17px/1.3 var(--ui)} body.facility-composition-state-prison .fx2-near span{color:var(--body-mute);font:400 14px/1.5 var(--text)} /* ── Rail ────────────────────────────────────────────────────────────────── */ body.facility-composition-state-prison .fx2-rail{ position:sticky;top:132px;display:flex;flex-direction:column;gap:20px} body.facility-composition-state-prison .fx2-railnav__k{ margin:0 0 8px;color:var(--ash); font:600 12px/1 var(--ui);letter-spacing:.12em;text-transform:uppercase} body.facility-composition-state-prison .fx2-railnav a{ display:block;padding:7px 0;border-bottom:1px solid var(--hair); border-left:2px solid transparent;color:var(--body-mute); font:400 14px/1.4 var(--text);text-decoration:none; transition:color 240ms var(--ease),padding 240ms var(--ease),border-color 240ms var(--ease)} body.facility-composition-state-prison .fx2-railnav a:last-child{border-bottom:0} body.facility-composition-state-prison .fx2-railnav a:hover{color:var(--warm)} body.facility-composition-state-prison .fx2-railnav a.is-active{ color:var(--navy);font-weight:600;padding-left:10px;border-left-color:var(--warm)} body.facility-composition-state-prison .fx2-promo{ padding:20px 22px;border-radius:8px;background:var(--navy-mid)} body.facility-composition-state-prison .fx2-promo__k{ margin:0 0 6px;color:var(--warm); font:600 12px/1 var(--ui);letter-spacing:.12em;text-transform:uppercase} body.facility-composition-state-prison .fx2-promo p{ max-width:none;margin:0;color:rgba(224,225,221,.82);font:400 14px/1.6 var(--text)} body.facility-composition-state-prison .fx2-promo__b{ display:block;margin-top:14px;padding:10px 16px;border-radius:4px;text-align:center; background:var(--warm);color:var(--navy);border:1px solid var(--warm); font:600 14px/1.5 var(--text);text-decoration:none; transition:background 240ms var(--ease),border-color 240ms var(--ease)} body.facility-composition-state-prison .fx2-promo__b:hover{background:var(--warm-hover);border-color:var(--warm-hover)} /* ── Responsive ──────────────────────────────────────────────────────────── */ @media (max-width:1080px){ body.facility-composition-state-prison .fx2-grid{grid-template-columns:1fr;gap:36px} body.facility-composition-state-prison .fx2-rail{position:static;order:-1} body.facility-composition-state-prison .fx2-railnav a{border-left:0;padding-left:0} body.facility-composition-state-prison .fx2-railnav a.is-active{padding-left:0} } @media (max-width:760px){ body.facility-composition-state-prison .fx2-grid{padding-bottom:64px} body.facility-composition-state-prison .fx2-rail{gap:12px} body.facility-composition-state-prison .fx2-railnav{ display:grid;grid-template-columns:1fr 1fr;gap:0 14px;padding:18px 20px} body.facility-composition-state-prison .fx2-railnav__k{grid-column:1/-1} body.facility-composition-state-prison .fx2-promo{padding:16px 20px} body.facility-composition-state-prison .fx2-pair, body.facility-composition-state-prison .fx2-figs{grid-template-columns:minmax(0,1fr)} body.facility-composition-state-prison h2{font-size:26px} body.facility-composition-state-prison ol.fx2-steps>li{padding:20px;gap:14px} body.facility-composition-state-prison .fx2-hours{padding:20px} body.facility-composition-state-prison .fx2-guides{padding:24px 20px} body.facility-composition-state-prison .fx2-gallery{grid-template-columns:minmax(0,1fr);gap:12px} body.facility-composition-state-prison .fx2-gallery__item--lead{grid-column:auto} /* 44px minimum tap target on every phone link. */ body.facility-composition-state-prison a[href^="tel:"]{display:inline-block;min-height:44px;line-height:44px} } /* ==FX2-BODY-END== */ /* ==FX2-STAY-START== */ /* =========================================================================== "Where to stay & eat near ⟨facility⟩". Shares the facility page's tokens; adds only the shapes unique to this page. ======================================================================== */ body.facility-stay .fxs-hero{background:var(--navy);padding:44px var(--pad) 40px} /* With a photograph the hero becomes a layered band, matching the facility hero: image behind, scrim over it, content above. Without one it stays the plain navy field the design specifies — the no-image state is the common case across the directory, not the exception. */ body.facility-stay .fxs-hero.has-img{ position:relative;isolation:isolate;overflow:hidden; padding-top:72px;padding-bottom:56px;min-height:420px; display:flex;align-items:flex-end} body.facility-stay .fxs-hero__img{ position:absolute!important;z-index:-2;inset:0; display:block;width:100%!important;height:100%!important;max-width:none!important; object-fit:cover;object-position:center 62%} body.facility-stay .fxs-hero__scrim{ position:absolute;z-index:-1;inset:0;pointer-events:none; background:linear-gradient(180deg, rgba(13,27,42,.82) 0%, rgba(13,27,42,.46) 34%, rgba(13,27,42,.80) 72%, rgba(13,27,42,.96) 100%)} body.facility-stay .fxs-hero__caption{ position:absolute;right:var(--pad);bottom:10px;z-index:1;max-width:52ch; margin:0;text-align:right; color:rgba(224,225,221,.45);font:400 11px/1.5 var(--text)} body.facility-stay .fxs-hero.has-img .fxs-hero__inner{width:100%} body.facility-stay .fxs-hero__inner{max-width:var(--wrap);margin:0 auto} body.facility-stay .fxs-hero h1{ max-width:20ch;margin:0;color:#fff; font:600 clamp(32px,4.6vw,46px)/1.06 var(--ui);letter-spacing:-.025em;text-transform:none} body.facility-stay .fxs-stand{ max-width:62ch;margin:12px 0 26px;color:rgba(224,225,221,.75);font:400 18px/1.55 var(--text)} body.facility-stay .fx2-metrics{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))} body.facility-stay .fxs-grid{padding-top:40px} /* "Start here" — the page's centrepiece. Of 21 places, two are usable before a weekend visit, and the page says so before it shows the other nineteen. */ body.facility-stay .fxs-start{ padding:26px 28px;border-radius:8px;background:var(--navy-mid);margin-bottom:var(--gap)} body.facility-stay .fxs-start__k{ margin:0 0 8px;color:var(--warm); font:600 12px/1 var(--ui);letter-spacing:.16em;text-transform:uppercase} body.facility-stay .fxs-start h2{margin:0 0 8px;color:#fff;font:600 24px/1.2 var(--ui)} body.facility-stay .fxs-start__lede{ max-width:64ch;margin:0 0 18px;color:rgba(224,225,221,.75);font:400 15px/1.6 var(--text)} body.facility-stay .fxs-start__grid{ display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px} body.facility-stay .fxs-early{ display:flex;gap:16px;padding:18px 20px;border-radius:6px;background:var(--white)} body.facility-stay .fxs-early__t{ flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center; padding:8px 12px;border:1px solid var(--fog);border-radius:6px;background:var(--milk)} body.facility-stay .fxs-early__t b{color:var(--navy);font:600 20px/1 var(--ui)} body.facility-stay .fxs-early__t span{ margin-top:2px;color:var(--ash);font:400 11px/1 var(--text);text-transform:uppercase;letter-spacing:.06em} body.facility-stay .fxs-early>div:last-child{min-width:0} body.facility-stay .fxs-early b{display:block;color:var(--navy);font:600 17px/1.3 var(--ui)} body.facility-stay .fxs-early__m{display:block;margin-top:2px;color:var(--ash);font:400 13px/1.45 var(--text)} body.facility-stay .fxs-early__d{display:block;margin-top:6px;color:var(--body-ink);font:400 14px/1.55 var(--text)} /* Section heading treatment — richer than the facility page's eyebrow rule. */ body.facility-stay .fxs-head{margin:0 0 20px} body.facility-stay .fxs-head__k{ margin:0 0 6px;color:var(--warm); font:600 12px/1 var(--ui);letter-spacing:.16em;text-transform:uppercase} body.facility-stay .fxs-head__r{display:flex;align-items:baseline;justify-content:space-between;gap:16px} body.facility-stay .fxs-head h2{ margin:0;color:var(--navy);font:600 36px/1.1 var(--ui);letter-spacing:-.025em} body.facility-stay .fxs-pill{ padding:5px 13px;border:1px solid var(--fog);border-radius:100px;background:var(--white); color:var(--steel);font:500 13px/1.4 var(--text);white-space:nowrap} body.facility-stay .fxs-rule{ display:block;width:56px;height:3px;margin-top:16px;border-radius:2px;background:var(--warm)} body.facility-stay .fxs-sub{ display:flex;align-items:center;gap:12px;margin:26px 0 12px; color:var(--navy);font:600 17px/1.3 var(--ui)} body.facility-stay .fxs-sub i{display:block;width:20px;height:3px;background:var(--warm)} /* Lodging cards */ body.facility-stay .fxs-lodge{ display:grid;grid-template-columns:minmax(0,1fr) 190px;gap:24px;margin-bottom:16px} body.facility-stay .fxs-lodge__n{display:block;color:var(--navy);font:600 19px/1.3 var(--ui)} body.facility-stay .fxs-lodge__a{display:block;margin-top:3px;color:var(--ash);font:400 13px/1.5 var(--text)} body.facility-stay .fxs-lodge__r{ padding-left:22px;border-left:1px solid var(--hair);display:flex;flex-direction:column;gap:4px} body.facility-stay .fxs-lodge__k{ color:var(--ash);font:400 11px/1 var(--text);letter-spacing:.1em;text-transform:uppercase} body.facility-stay .fxs-lodge__d{ color:var(--navy);font:600 28px/1.1 var(--ui);letter-spacing:-.02em;font-variant-numeric:tabular-nums} body.facility-stay .fxs-lodge__d i{ margin-left:5px;color:var(--ash);font:500 14px/1 var(--text);font-style:normal} body.facility-stay .fxs-lodge__p{margin-top:6px;color:var(--navy);font:600 15px/1.3 var(--ui);text-decoration:none} body.facility-stay .fxs-map{color:var(--steel);font:500 13px/1.4 var(--text)} /* Amenity chips */ body.facility-stay .fxs-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px} body.facility-stay .fxs-chip{ display:inline-flex;align-items:center;gap:6px; padding:5px 12px;border:1px solid var(--fog);border-radius:100px;background:var(--white); color:var(--body-ink);font:500 12.5px/1.4 var(--text); transition:border-color 240ms var(--ease),background 240ms var(--ease)} body.facility-stay .fxs-chip:hover{border-color:var(--card-hover-border);background:#FAFAF7} /* Asymmetric padding: the icon well needs less room on its side than the label does on its own, or the chip reads as if it is leaning. */ body.facility-stay .fxs-chip{padding:5px 12px 5px 9px} body.facility-stay .fx-ico{flex:none;display:block;color:var(--steel)} body.facility-stay .fxs-chip.is-neg .fx-ico{color:#B4453C} body.facility-stay .fxs-chip.is-neg{ background:var(--warn-bg);border-color:var(--warn-border);color:var(--warn-ink)} body.facility-stay .fxs-caveat{ margin:8px 0 0;color:var(--ash);font:400 13px/1.5 var(--text)} /* Filters */ body.facility-stay .fxs-filters{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 8px} body.facility-stay .fxs-f{ padding:7px 15px;border:1px solid var(--fog);border-radius:100px;background:var(--white); color:var(--body-ink);font:600 13px/1.4 var(--text);cursor:pointer; transition:background 240ms var(--ease),border-color 240ms var(--ease),color 240ms var(--ease)} body.facility-stay .fxs-f.is-on{background:var(--navy);border-color:var(--navy);color:#fff} /* Eat tables — CSS grid, not */ body.facility-stay .fxs-table{ border:1px solid var(--fog);border-radius:8px;background:var(--white);overflow:hidden} body.facility-stay .fxs-tr{ display:grid;grid-template-columns:1.5fr 1.7fr .9fr;gap:16px; padding:14px 20px;border-bottom:1px solid var(--hair);align-items:baseline} body.facility-stay .fxs-tr:last-child{border-bottom:0} body.facility-stay .fxs-th{ background:var(--milk);border-bottom:1px solid var(--fog); color:var(--ash);font:600 12px/1.4 var(--text);letter-spacing:.06em;text-transform:uppercase} body.facility-stay .fxs-tr b{color:var(--navy);font-weight:600} body.facility-stay .fxs-tr small{ display:block;margin-top:3px;color:var(--ash);font:400 13px/1.45 var(--text)} body.facility-stay .fxs-tr>span{color:var(--body-ink);font:400 14px/1.55 var(--text)} body.facility-stay .fxs-badge{ display:inline-block;margin-left:4px;padding:2px 8px;border-radius:100px; background:var(--warm);color:var(--navy); font:600 11px/1.5 var(--ui);letter-spacing:.06em;text-transform:uppercase;font-style:normal} body.facility-stay .fxs-tr__a{display:grid;gap:3px;justify-items:start} body.facility-stay .fxs-tr__a a{font:600 14px/1.4 var(--text);color:var(--navy);text-decoration:none} body.facility-stay .fxs-tr__a a.fxs-map{color:var(--steel);font-weight:500;font-size:13px} body.facility-stay .fxs-group.is-hidden{display:none} body.facility-stay .fxs-tr.is-hidden{display:none} /* Share row */ body.facility-stay .fxs-share{ display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px; align-items:center;padding:24px 26px} body.facility-stay .fxs-share__k{ margin:0 0 4px;color:var(--ash);font:400 12px/1 var(--text);letter-spacing:.08em;text-transform:uppercase} body.facility-stay .fxs-share__l{max-width:46ch;margin:0;color:var(--body-ink);font:400 15px/1.5 var(--text)} body.facility-stay .fxs-share__b{display:flex;flex-wrap:wrap;gap:10px} body.facility-stay .fxs-sb{ display:inline-flex;align-items:center;gap:8px;padding:6px 16px 6px 6px;border-radius:4px; border:1px solid var(--fog);background:var(--white); color:var(--navy);font:600 14px/1.6 var(--text);text-decoration:none;cursor:pointer; transition:border-color 240ms var(--ease)} body.facility-stay .fxs-sb:hover{border-color:var(--steel)} body.facility-stay .fxs-sb--gold{background:var(--warm);border-color:var(--warm)} body.facility-stay .fxs-sb--gold:hover{background:var(--warm-hover);border-color:var(--warm-hover)} /* Round icon badge leading each share button. */ body.facility-stay .fxs-sb__i{ display:inline-flex;align-items:center;justify-content:center;flex:none; width:26px;height:26px;border-radius:100px;background:var(--milk);color:var(--steel)} body.facility-stay .fxs-sb__i--wa{background:#EAF9F0} body.facility-stay .fxs-sb__i--fb{background:#EAF1FD} body.facility-stay .fxs-sb__i--gold{background:rgba(13,27,42,.14);color:var(--navy)} body.facility-stay .fxs-sb__i .fx-ico{display:block} /* Rail — no condensed bar on this page, so it sits higher. */ /* Same ancestor-overflow problem as the facility page: the site-wide .wrap and body carry overflow:hidden, which makes them scroll containers and leaves any sticky descendant resolving against that box instead of the viewport. */ body.facility-stay .wrap{overflow-x:clip;overflow-y:visible} body.facility-stay{overflow-x:clip;overflow-y:visible} body.facility-stay .fxs-rail{top:88px} body.facility-stay .fxs-back{width:100%;justify-content:center;margin-top:12px} @media (max-width:760px){ body.facility-stay .fxs-hero{padding:32px 20px} body.facility-stay .fxs-hero.has-img{padding:56px 20px 44px;min-height:340px} body.facility-stay .fxs-hero__caption{ position:static;max-width:none;margin:14px 0 0;text-align:left} body.facility-stay .fxs-lodge{grid-template-columns:1fr;gap:16px} body.facility-stay .fxs-lodge__r{padding-left:0;border-left:0;border-top:1px solid var(--hair);padding-top:14px} body.facility-stay .fxs-tr{grid-template-columns:1fr;gap:6px} body.facility-stay .fxs-th{display:none} body.facility-stay .fxs-head h2{font-size:26px} } /* ==FX2-STAY-END== */ /* ── Brand lockup ──────────────────────────────────────────────────────────── The handoff draws it as one 20px Instrument Sans line: "jail" at normal weight and reduced opacity, "411" gold and bold at the SAME size, baseline aligned with a 1px gap. The site's own brand rule shrinks "411" to ~0.7rem, which is what made it read as a different mark. */ body.facility-composition-state-prison .site-brand{ font-family:'Instrument Sans',system-ui,sans-serif; font-size:20px;letter-spacing:-.02em;color:#F4F4F1; display:inline-flex;align-items:baseline;gap:1px} body.facility-composition-state-prison .site-brand span{font-weight:400;opacity:.7;font-size:1em;color:inherit} body.facility-composition-state-prison .site-brand strong{font-weight:700;color:#D4A03C;font-size:1em;letter-spacing:-.02em} /* ── Brand lockup ──────────────────────────────────────────────────────────── The handoff draws it as one 20px Instrument Sans line: "jail" at normal weight and reduced opacity, "411" gold and bold at the SAME size, baseline aligned with a 1px gap. The site's own brand rule shrinks "411" to ~0.7rem, which is what made it read as a different mark. */ body.facility-stay .site-brand{ font-family:'Instrument Sans',system-ui,sans-serif; font-size:20px;letter-spacing:-.02em;color:#F4F4F1; display:inline-flex;align-items:baseline;gap:1px} body.facility-stay .site-brand span{font-weight:400;opacity:.7;font-size:1em;color:inherit} body.facility-stay .site-brand strong{font-weight:700;color:#D4A03C;font-size:1em;letter-spacing:-.02em}