/* The hero blueprint (floor plan + call / booked tags + title block with the typed domain), shared
   by every inner page's hero (Ben, 2026-10-03: "i want that actually on all of our hero section
   pages"). The homepage carries the same rules inline. Everything is scoped under .sheet-bp
   because styles.css already owns a bare .tag. Fonts are the ones every page already loads. */
.sheet-bp { position: relative; display: grid; gap: 0; border: 2px solid #fff; background: rgba(255,255,255,.03); margin-block: 22px; color: #fff; }
.sheet-bp .plan-wrap { position: relative; padding: 12px; }
.sheet-bp .plan { display: block; width: 100%; height: auto; }
.sheet-bp .rn { font-family: "Barlow Condensed", sans-serif; font-weight: 700; font-size: 20px; letter-spacing: .04em; fill: #fff; text-anchor: middle; }
.sheet-bp .rs { font-family: "IBM Plex Mono", monospace; font-size: 10.5px; letter-spacing: .04em; fill: #cfe0f5; text-anchor: middle; }
.sheet-bp .dm { font-family: "IBM Plex Mono", monospace; font-size: 11px; letter-spacing: .06em; fill: #fff; text-anchor: middle; }

.sheet-bp .tag { position: absolute; display: grid; gap: 2px; padding: 10px 14px; background: #fff; color: #161b26; border-left: 4px solid #e04b3a; box-shadow: 0 10px 24px rgba(0,0,0,.25); font-weight: 400; }
.sheet-bp .tag small { font-family: "IBM Plex Mono", monospace; font-size: .6875rem; color: #4a5468; text-transform: uppercase; letter-spacing: .06em; }
.sheet-bp .tag b { font-family: "Barlow Condensed", sans-serif; font-size: 1.25rem; line-height: 1.1; font-weight: 700; }
.sheet-bp .tag-1 { top: -18px; left: 5%; }
.sheet-bp .tag-2 { bottom: 6px; right: 4%; z-index: 2; }

.sheet-bp .title-block { margin: 0; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, .6fr); border-top: 2px solid #fff; font-family: "IBM Plex Mono", monospace; font-size: .75rem; }
.sheet-bp .title-block div { padding: 8px 10px; border-right: 1px solid rgba(255,255,255,.5); border-bottom: 1px solid rgba(255,255,255,.5); }
.sheet-bp .title-block dt { text-transform: uppercase; letter-spacing: .08em; color: #cfe0f5; font-size: .625rem; }
.sheet-bp .title-block dd { margin: 2px 0 0; font-family: "Barlow Condensed", sans-serif; font-size: 1.125rem; font-weight: 700; color: #fff; text-transform: uppercase; letter-spacing: .02em; }
.sheet-bp .title-block .tb-client-cell { grid-column: 1 / -1; order: 3; min-width: 0; overflow: hidden; }
.sheet-bp .title-block .tb-wide { order: 4; grid-column: 1 / -1; }
.sheet-bp .title-block dd.tb-client { text-transform: none; letter-spacing: 0; font-size: 1.125rem; overflow: hidden; white-space: nowrap; }
.sheet-bp .caret { display: inline-block; width: 2px; height: 1em; margin-left: 2px; vertical-align: -0.12em; background: currentColor; animation: bp-caret 1s steps(1) infinite; }
@keyframes bp-caret { 50% { opacity: 0; } }
.sheet-bp [data-demo-tag] { transition: opacity .35s ease, transform .35s ease; }
.sheet-bp [data-demo-tag].is-swapping { opacity: 0; transform: translateY(4px); }

@media (max-width: 979px) { .sheet-bp { max-width: 640px; } }
@media (max-width: 639px) { .sheet-bp .title-block dd, .sheet-bp .title-block dd.tb-client { font-size: 1rem; } }
@media (max-width: 520px) { .sheet-bp .tag { position: static; margin: 8px 12px 0; } .sheet-bp .plan-wrap { display: grid; } }
@media (prefers-reduced-motion: reduce) { .sheet-bp .caret { animation: none; } .sheet-bp [data-demo-tag] { transition: none; } }

/* Inner heroes: the blueprint sits in the right-hand column like the homepage */
.hero-media--bp { align-self: center; }
@media (min-width: 980px) { .hero-media--bp .sheet-bp { margin-top: 26px; } }
