/* ==========================================================================
   Thermador Houston — "Lone Star" skin
   Loaded after style.css (the shared Houston base). Everything visual that
   makes this site its own lives here: tokens, type, buttons, the star motif,
   and the blocks only this home page has (star hero, ticker, bento, concierge,
   star map, timeline, price card, journal).
   ========================================================================== */

/* ---------- 1. Tokens: graphite + brass + flame blue, cool steel paper ---------- */
:root{
  --paper:#F3F2EE;
  --paper-2:#E7E5DF;
  --ink:#16181C;
  --ink-2:#2B2F36;
  --muted:#646A73;
  --line:#D6D3CB;
  --line-dark:#33373F;
  --on-dark:#F1EEE7;
  --on-dark-2:#C4C0B6;
  --on-dark-3:#9C988E;
  --brass:#C29A5B;
  --brass-2:#E2C48E;
  --brass-text:#8A6630;   /* brass for small text on light backgrounds (contrast ≥ 4.5:1 on white) */
  --amber:var(--brass);
  --ring-1:var(--brass);
  --ring-2:rgba(255,255,255,.55);
  --ring-3:rgba(255,255,255,.25);
  --display:"Fraunces",Georgia,serif;
  --body:"Manrope",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;
  --radius:18px;
  --radius-sm:12px;
  --star:polygon(50% 0%,58.4% 29.7%,85.4% 14.6%,70.3% 41.6%,100% 50%,70.3% 58.4%,85.4% 85.4%,58.4% 70.3%,50% 100%,41.6% 70.3%,14.6% 85.4%,29.7% 58.4%,0% 50%,29.7% 41.6%,14.6% 14.6%,41.6% 29.7%);
  --ease:cubic-bezier(.2,.8,.2,1);
}

/* ---------- 2. Type: serif display, quieter weights ---------- */
body{font-size:16.5px;letter-spacing:.005em}
h1,h2,h3,h4{font-family:var(--display);font-stretch:normal;font-weight:500;letter-spacing:-.015em;font-variation-settings:"opsz" 96}
h1{font-weight:400;line-height:1.02}
h2{font-weight:400;line-height:1.06}
h3{font-weight:600;font-size:21px;letter-spacing:-.005em;font-variation-settings:"opsz" 24}
h4{font-family:var(--body);font-weight:700;font-size:16px}
h1 em,h2 em{font-style:italic;color:var(--brass)}
.tx-star{display:inline-block;vertical-align:-.12em;color:var(--brass);flex-shrink:0}

/* Kicker: brass star instead of the ring; spins a quarter turn on hover */
.kicker{font-size:11.5px;letter-spacing:.2em;color:var(--muted);gap:10px}
.kicker::before{width:14px;height:14px;border:0;border-radius:0;box-shadow:none!important;background:var(--brass);clip-path:var(--star);transition:transform .6s var(--ease)}
.kicker:has(.tx-star)::before{display:none}
.kicker:hover::before,.kicker:hover .tx-star{transform:rotate(45deg)}
.kicker .tx-star{transition:transform .6s var(--ease)}
.is-dark .kicker,.tx-hero .kicker{color:var(--brass-2)}

/* Section head: thin brass rule, serif numerals */
.sec{padding:120px 0}
.sec-num{border-top:1px solid var(--brass);font-family:var(--display);font-style:italic;font-size:15px;letter-spacing:.02em}
.sec-num span:first-child{font-size:28px;line-height:1;font-style:normal;color:var(--brass)}
.sec-head p,.sec-lede{font-size:17px}

/* ---------- 3. Buttons: pills with a flame sweep on hover ---------- */
.btn{clip-path:none;border-radius:999px;font-family:var(--body);font-stretch:normal;font-weight:700;font-size:14.5px;letter-spacing:.02em;position:relative;overflow:hidden;isolation:isolate}
.btn>span{padding:15px 22px 15px 26px}
.btn>i{width:46px;border-left:0;margin:5px 5px 5px 0;border-radius:50%;background:rgba(255,255,255,.14);transition:transform .45s var(--ease),background .2s}
.btn::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.28) 46%,rgba(226,196,142,.35) 52%,transparent 68%);transform:translateX(-110%);transition:transform .8s var(--ease)}
.btn:hover{transform:translateY(-1px)}
.btn:hover::after{transform:translateX(110%)}
.btn:hover>i{transform:rotate(-45deg);background:rgba(255,255,255,.24)}
.btn-ghost,.btn-outline-dark{box-shadow:inset 0 0 0 1px currentColor}
.btn-ghost>i,.btn-outline-dark>i{background:transparent;box-shadow:inset 0 0 0 1px currentColor}
.btn-ghost:hover>i,.btn-outline-dark:hover>i{background:var(--ink);color:#fff}
.btn-light{--bg:#fff;--fg:var(--ink)}
.btn-light>i{background:var(--paper-2)}
.btn:not(:has(>span)){border-radius:999px}
.arrow-link{font-family:var(--body);font-stretch:normal;border-bottom:0;background:linear-gradient(var(--brass),var(--brass)) left bottom/0 1px no-repeat;padding-bottom:3px;transition:background-size .4s var(--ease)}
.arrow-link:hover{background-size:100% 1px}

/* ---------- 4. Rail + header: dark glass bar ---------- */
.hx-rail{background:#0E1013;color:var(--on-dark-3)}
.hx-rail b{color:var(--brass-2)}
.dot{background:var(--brass);box-shadow:0 0 0 3px rgba(194,154,91,.25);animation:tx-pulse 2.4s ease-in-out infinite}
@keyframes tx-pulse{50%{box-shadow:0 0 0 7px rgba(194,154,91,0)}}
.hx-head{background:rgba(22,24,28,.9);border-bottom:1px solid rgba(255,255,255,.08);color:var(--on-dark)}
.hx-logo svg{color:var(--on-dark)}
.hx-logo-word{font-family:var(--display);font-stretch:normal;font-weight:500;text-transform:none;font-size:22px;letter-spacing:-.01em}
.hx-logo-word small{color:var(--brass-2);font-size:9.5px;letter-spacing:.24em;text-transform:uppercase}
.main-nav a{color:var(--on-dark);font-weight:600;font-size:14.5px}
.main-nav a::after{background:var(--brass);height:1px}
.hx-head-phone{color:var(--brass-2)}
.nav-toggle{border-color:var(--on-dark);color:var(--on-dark);border-radius:50%}
.hx-head .btn-ghost{color:var(--on-dark)}

/* Scroll progress hairline (novelty 1) */
.tx-progress{position:fixed;top:0;left:0;height:2px;width:100%;transform-origin:0 50%;transform:scaleX(var(--p,0));background:linear-gradient(90deg,var(--brass),var(--brass-2),var(--signal));z-index:200;pointer-events:none}

/* ---------- 5. HERO: centered, full-bleed, turning star (layout change 1) ---------- */
.tx-hero{position:relative;min-height:min(92svh,860px);display:grid;place-items:center;text-align:center;background:var(--ink) center/cover no-repeat;color:var(--on-dark);overflow:hidden;padding:110px 0 130px}
.tx-hero .wrap{position:relative;z-index:2;max-width:980px}
.tx-hero .kicker{justify-content:center}
.tx-hero h1{font-size:clamp(44px,7vw,104px);margin:26px auto 24px;max-width:15ch;color:#fff}
.tx-hero .lede{font-size:18.5px;color:var(--on-dark-2);max-width:620px;margin:0 auto}
.tx-hero-star{position:absolute;left:50%;top:50%;width:min(1100px,150vw);height:auto;transform:translate(-50%,-50%);opacity:.38;z-index:1;animation:tx-spin 140s linear infinite;--ring-1:var(--brass);--ring-2:rgba(255,255,255,.35);--ring-3:rgba(255,255,255,.18)}
@keyframes tx-spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.tx-zip{margin:34px auto 0;max-width:520px;border:1px solid rgba(255,255,255,.28);border-radius:999px;background:rgba(255,255,255,.08);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);overflow:hidden}
.tx-zip label{border-right:1px solid rgba(255,255,255,.2);color:var(--brass-2);padding:0 18px 0 24px}
.tx-zip input{color:#fff}
.tx-zip input::placeholder{color:rgba(255,255,255,.4)}
.tx-zip button{background:var(--brass);color:var(--ink);font-family:var(--body);font-weight:800;border-radius:999px;margin:5px;padding:0 22px}
.tx-hero .zip-note{color:var(--on-dark-3);text-align:center}
.tx-hero .zip-note b{color:#fff}
.tx-hero .zip-note a{color:var(--brass-2)}
.tx-hero .btn-row{justify-content:center;margin-top:28px}
.tx-hero .btn-ghost{--fg:#fff}
.tx-hero-scroll{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);width:26px;height:42px;border:1px solid rgba(255,255,255,.4);border-radius:14px;z-index:2}
.tx-hero-scroll span{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--brass);animation:tx-wheel 1.8s ease-in-out infinite}
@keyframes tx-wheel{60%{transform:translateY(12px);opacity:0}100%{opacity:0}}

/* ---------- 6. Stat ticker with count-up numbers (novelty 2) ---------- */
.tx-ticker{display:flex;overflow:hidden;background:var(--brass);color:var(--ink);border-bottom:1px solid rgba(0,0,0,.1)}
.tx-ticker-run{display:flex;flex-shrink:0;gap:0;animation:tx-marquee 46s linear infinite;padding:18px 0}
.tx-ticker:hover .tx-ticker-run{animation-play-state:paused}
@keyframes tx-marquee{to{transform:translateX(-100%)}}
.tx-stat{display:flex;align-items:center;gap:6px;padding:0 34px;white-space:nowrap;font-weight:600;font-size:15px}
.tx-stat b{font-family:var(--display);font-weight:500;font-size:30px;line-height:1;font-variant-numeric:tabular-nums}
.tx-stat i{font-style:normal;font-family:var(--display);font-size:22px;margin-right:4px}
.tx-stat .tx-star{color:var(--ink);opacity:.5;margin-left:28px}

/* ---------- 7. BENTO appliances (layout change 2) + tilt (novelty 3) ---------- */
.tx-bento{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:240px;gap:16px}
.tx-tile{position:relative;border-radius:var(--radius);overflow:hidden;text-decoration:none;color:#fff;background:var(--ink);display:flex;align-items:flex-end;transform-style:preserve-3d;transform:perspective(900px) rotateX(var(--rx,0)) rotateY(var(--ry,0));transition:transform .35s var(--ease),box-shadow .35s;will-change:transform}
.tx-tile:hover{box-shadow:0 30px 60px -28px rgba(0,0,0,.55)}
.tx-tile-0{grid-column:span 2;grid-row:span 2}
.tx-tile-1{grid-column:span 2}
.tx-tile-4{grid-column:span 2}
.tx-tile-pic{position:absolute;inset:0;background:var(--ink-2) center/cover no-repeat;transform:scale(1.02);transition:transform .9s var(--ease)}
.tx-tile:hover .tx-tile-pic{transform:scale(1.08)}
.tx-tile::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(14,16,20,0) 30%,rgba(14,16,20,.88))}
.tx-tile::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:radial-gradient(420px circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.18),transparent 55%);opacity:0;transition:opacity .3s}
.tx-tile:hover::after{opacity:1}
.tx-tile-body{position:relative;z-index:2;padding:24px 26px;width:100%;transform:translateZ(30px)}
.tx-tile h3{font-size:clamp(24px,2.4vw,34px);font-weight:400;color:#fff}
.tx-tile-0 h3{font-size:clamp(34px,3.6vw,52px)}
.tx-tile-meta{font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--brass-2)}
.tx-tile ul{list-style:none;padding:0;margin-top:0;max-height:0;overflow:hidden;opacity:0;transition:max-height .5s var(--ease),opacity .4s,margin .4s}
.tx-tile:hover ul,.tx-tile:focus-visible ul{max-height:120px;opacity:1;margin-top:12px}
.tx-tile li{font-size:14px;color:var(--on-dark-2);padding-left:16px;position:relative}
.tx-tile li::before{content:"";position:absolute;left:0;top:.55em;width:7px;height:7px;background:var(--brass);clip-path:var(--star)}
.tx-tile-go{position:absolute;right:18px;top:18px;z-index:2;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.12);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font-size:18px;transition:background .3s,transform .5s var(--ease)}
.tx-tile:hover .tx-tile-go{background:var(--brass);color:var(--ink);transform:rotate(45deg)}

/* ---------- 8. CONCIERGE band (booking + channels) ---------- */
.tx-concierge{padding:110px 0;background:radial-gradient(900px 500px at 85% 20%,rgba(194,154,91,.16),transparent 60%),var(--ink)}
.tx-concierge .wrap{display:grid;grid-template-columns:1fr 470px;gap:64px;align-items:start}
.tx-concierge .wrap>*{min-width:0}
.tx-concierge h2{font-size:clamp(32px,3.8vw,52px);margin:20px 0 18px;color:#fff}
.tx-concierge p{color:var(--on-dark-2);max-width:560px}
.tx-channels{margin-top:34px;display:grid;gap:10px}
.tx-channel{display:grid;grid-template-columns:22px 1fr auto;gap:16px;align-items:center;padding:18px 22px;border:1px solid var(--line-dark);border-radius:var(--radius-sm);text-decoration:none;transition:border-color .3s,background .3s,transform .3s var(--ease)}
.tx-channel:hover{border-color:var(--brass);background:rgba(194,154,91,.08);transform:translateX(6px)}
.tx-channel b{display:block;color:#fff;font-weight:700}
.tx-channel small{color:var(--on-dark-3);font-size:13.5px}
.tx-channel em{font-style:normal;font-family:var(--mono);font-size:13px;color:var(--brass-2)}
.tx-channel .tx-star{transition:transform .6s var(--ease)}
.tx-channel:hover .tx-star{transform:rotate(90deg) scale(1.15)}
.tx-hours{display:grid;grid-template-columns:auto 1fr;gap:6px 22px;margin-top:28px;font-size:14.5px;color:var(--on-dark-2)}
.tx-hours dt{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--on-dark-3);padding-top:2px}
.ticket{border:0;border-radius:var(--radius);box-shadow:0 40px 80px -40px rgba(0,0,0,.6);overflow:hidden;background:#fff;color:var(--ink)}
.ticket::before,.ticket::after{display:none}
.ticket-head{border-bottom:1px solid var(--line);background:var(--paper);padding:18px 24px}
.ticket-head b{font-family:var(--display);font-stretch:normal;font-weight:500;font-size:22px}
.ticket-head span{color:var(--brass)}

/* ---------- 9. Gulf Coast notes ---------- */
.tx-notes{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line)}
.tx-note{padding:34px 28px 10px 0;border-right:1px solid var(--line);margin-right:28px}
.tx-note:last-child{border-right:0;margin-right:0}
.tx-note-n{display:block;font-family:var(--display);font-style:italic;font-size:54px;line-height:1;color:var(--brass);margin-bottom:22px;transition:transform .5s var(--ease)}
.tx-note:hover .tx-note-n{transform:translateX(8px)}
.tx-note h3{margin-bottom:10px}
.tx-note p{color:var(--ink-2);font-size:15.5px}

/* ---------- 10. Decoder restyle ---------- */
.tx-decoder{border:0;border-radius:var(--radius);overflow:hidden;box-shadow:0 30px 70px -45px rgba(0,0,0,.45)}
.term{background:#111317}
.term .prompt{display:grid;place-items:center}
.term button{background:var(--brass);border-radius:999px;padding:9px 16px;font-family:var(--body);font-weight:800}
.anat .code b{border-radius:var(--radius-sm);border:1px solid var(--line);font-family:var(--display);font-weight:400}
.anat .code b:first-child{background:var(--ink);border-color:var(--ink);color:var(--brass-2)}
.chips a{border-radius:999px;border-color:var(--line);transition:background .25s,color .25s,border-color .25s}
.chips a:hover{background:var(--ink);border-color:var(--ink);color:var(--brass-2)}

/* ---------- 11. STAR MAP with county tabs (layout change 3) ---------- */
.tx-starmap{display:grid;grid-template-columns:minmax(0,480px) minmax(0,1fr);gap:56px;align-items:start}
.tx-star-svg{width:100%;height:auto;overflow:visible}
.tx-star-shape{fill:rgba(194,154,91,.07);stroke:var(--brass);stroke-width:1.2;stroke-dasharray:4 6;animation:tx-dash 30s linear infinite}
@keyframes tx-dash{to{stroke-dashoffset:-400}}
.tx-pt{cursor:pointer}
.tx-pt circle{fill:var(--paper);stroke:var(--ink);stroke-width:1.5;transition:fill .3s,stroke .3s,r .3s}
.tx-pt text{font-family:var(--body);font-size:13px;font-weight:700;fill:var(--ink);text-anchor:middle;transition:fill .3s}
.tx-pt.is-core circle{fill:var(--ink)}
.tx-pt.is-core text{fill:var(--brass-2);font-size:12px}
.tx-pt:hover circle,.tx-pt.is-on circle{fill:var(--brass);stroke:var(--brass)}
.tx-pt.is-on text{fill:var(--brass)}
.tx-pt.is-core.is-on text{fill:var(--ink)}
.tx-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
.tx-tab{border:1px solid var(--line);background:transparent;border-radius:999px;padding:9px 16px;font-weight:700;font-size:14px;color:var(--ink-2);transition:background .25s,color .25s,border-color .25s}
.tx-tab:hover{border-color:var(--ink)}
.tx-tab.is-on{background:var(--ink);border-color:var(--ink);color:var(--brass-2)}
.tx-panel{border-top:1px solid var(--brass);padding-top:24px;animation:tx-panel .5s var(--ease)}
@keyframes tx-panel{from{opacity:0;transform:translateY(10px)}}
.tx-panel[hidden]{display:none}
.tx-panel-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.tx-panel-head h3{font-size:30px;font-weight:400}
.tx-panel-head span{font-family:var(--mono);font-size:12px;color:var(--muted);letter-spacing:.06em}
.tx-panel p{color:var(--ink-2);max-width:640px}
.tx-cloud{list-style:none;padding:0;margin:22px 0 24px;columns:3 170px;column-gap:24px}
.tx-cloud li{break-inside:avoid;padding:5px 0}
.tx-cloud a{text-decoration:none;font-size:15px;background:linear-gradient(var(--brass),var(--brass)) left bottom/0 1px no-repeat;transition:background-size .35s var(--ease),color .2s}
.tx-cloud a:hover{background-size:100% 1px;color:var(--brass)}

/* ---------- 12. Timeline (fills on scroll) ---------- */
.tx-process{background:linear-gradient(180deg,var(--ink),#0F1114)}
.tx-timeline-wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:72px;align-items:start}
.tx-timeline-wrap>*{min-width:0}
.tx-timeline-head{position:sticky;top:130px}
.tx-timeline-head h2{margin:20px 0 18px;color:#fff}
.tx-timeline-head p{color:var(--on-dark-2);max-width:460px}
.tx-timeline{list-style:none;padding:0;position:relative}
.tx-timeline::before,.tx-timeline::after{content:"";position:absolute;left:27px;top:10px;bottom:10px;width:1px;background:var(--line-dark)}
.tx-timeline::after{background:var(--brass);transform-origin:top;transform:scaleY(var(--fill,0));transition:transform .2s linear}
.tx-timeline li{display:grid;grid-template-columns:56px 1fr;gap:26px;padding:0 0 54px;position:relative;z-index:1}
.tx-timeline li:last-child{padding-bottom:0}
.tx-tl-n{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;font-family:var(--display);font-size:24px;background:var(--ink);border:1px solid var(--line-dark);color:var(--on-dark-2);transition:background .4s,color .4s,border-color .4s}
.tx-timeline li.is-lit .tx-tl-n{background:var(--brass);border-color:var(--brass);color:var(--ink)}
.tx-timeline h3{color:#fff;font-size:24px;font-weight:400;margin:12px 0 8px}
.tx-timeline p{color:var(--on-dark-2)}

/* ---------- 13. Price card ---------- */
.tx-price{display:grid;grid-template-columns:.85fr 1.15fr;gap:72px;align-items:start}
.tx-price>*{min-width:0}
.tx-price h2{margin:22px 0 16px}
.tx-price-card{background:#fff;border-radius:var(--radius);padding:12px 30px;box-shadow:0 30px 70px -50px rgba(0,0,0,.5);border:1px solid var(--line)}
.tx-price-row{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 0;border-bottom:1px dashed var(--line)}
.tx-price-row:last-child{border-bottom:0}
.tx-price-row b{display:block;font-family:var(--display);font-weight:500;font-size:19px}
.tx-price-row span{font-size:14px;color:var(--muted)}
.tx-price-row em{font-style:normal;font-family:var(--mono);font-size:12.5px;color:var(--brass);white-space:nowrap;text-align:right}

/* ---------- 14. Models ---------- */
.tx-model-search{border-radius:999px;overflow:hidden;border:1px solid var(--ink)}
.tx-model-search button{border-radius:999px;margin:4px;background:var(--ink);color:var(--brass-2)}
.tx-models{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.tx-model{background:#fff;border-radius:var(--radius);padding:14px 14px 22px;text-decoration:none;border:1px solid var(--line);transform:perspective(900px) rotateX(var(--rx,0)) rotateY(var(--ry,0));transition:transform .35s var(--ease),box-shadow .35s;position:relative;overflow:hidden}
.tx-model:hover{box-shadow:0 26px 50px -30px rgba(0,0,0,.45)}
.tx-model::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(320px circle at var(--gx,50%) var(--gy,50%),rgba(194,154,91,.16),transparent 60%);opacity:0;transition:opacity .3s}
.tx-model:hover::after{opacity:1}
.tx-model-shot{display:block;aspect-ratio:4/3;border-radius:var(--radius-sm);background:var(--paper-2) center/cover no-repeat;margin-bottom:16px}
.tx-model-type{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass);padding:0 8px}
.tx-model h3{font-family:var(--mono);font-weight:600;font-size:19px;letter-spacing:.02em;margin:6px 8px 10px}
.tx-model ul{list-style:none;padding:0 8px;font-size:14px;color:var(--ink-2)}
.tx-model li{padding-left:14px;position:relative}
.tx-model li::before{content:"";position:absolute;left:0;top:.6em;width:6px;height:6px;background:var(--brass);clip-path:var(--star)}

/* ---------- 15. Voices + journal ---------- */
.tx-voices{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tx-voice{margin:0;padding:30px;border-radius:var(--radius);background:#fff;border:1px solid var(--line)}
.tx-voice-stars{display:flex;gap:3px;color:var(--brass);margin-bottom:16px}
.tx-voice blockquote{font-family:var(--display);font-size:19px;line-height:1.45;font-weight:400}
.tx-voice figcaption{margin-top:18px;font-size:14px;color:var(--muted)}
.tx-voice figcaption b{color:var(--ink)}
.tx-journal{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:22px}
.tx-entry{text-decoration:none;display:flex;flex-direction:column}
.tx-entry-pic{display:block;aspect-ratio:4/3;border-radius:var(--radius);background:var(--paper-2) center/cover no-repeat;margin-bottom:16px;transition:transform .6s var(--ease),border-radius .6s var(--ease)}
.tx-entry:hover .tx-entry-pic{transform:scale(.97);border-radius:40px}
.tx-entry.is-lead .tx-entry-pic{aspect-ratio:16/11}
.tx-entry-meta{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--brass)}
.tx-entry h3{font-weight:400;font-size:22px;margin-top:8px;line-height:1.25}
.tx-entry.is-lead h3{font-size:30px}

/* ---------- 16. FAQ, close band, page heads, footer ---------- */
.hx-faq summary{font-family:var(--display);font-weight:400;font-size:21px}
.hx-faq summary::after{border-radius:50%}
.close-band{background-blend-mode:normal}
.close-band h2{font-family:var(--display);font-weight:400}
.close-band .rings{opacity:.25;--ring-1:#fff;--ring-2:#fff;--ring-3:#fff;animation:tx-spin-plain 120s linear infinite}
@keyframes tx-spin-plain{to{transform:rotate(360deg)}}
.page-head{background:radial-gradient(800px 420px at 90% 0%,rgba(194,154,91,.14),transparent 60%),var(--ink);color:var(--on-dark)}
.page-head h1{color:#fff}
.page-head .lede{color:var(--on-dark-2)}
.page-head .rings{--ring-1:var(--brass);--ring-2:rgba(255,255,255,.3);--ring-3:rgba(255,255,255,.15)}
.page-head .btn-ghost{--fg:#fff}
.page-head .facts{border-color:var(--line-dark)}
.page-head .facts dt{color:var(--on-dark-3)}
.page-head .facts dd{color:#fff}
.page-head .kicker{color:var(--brass-2)}
.breadcrumbs{background:var(--ink);color:var(--on-dark-3);border-bottom-color:var(--line-dark)}
.breadcrumbs a{color:var(--on-dark-2)}
.hx-foot{background:#0E1013}
.hx-foot a:hover{color:var(--brass-2)}
.tile,.post-card,.rail-box,.note,.callout,.county-hero .slot,.area-brief,.zips span,.neighbors a{border-radius:var(--radius-sm)}
.tile:hover{border-color:var(--brass)}
.severity{border-radius:999px}
.filter-pill{border-radius:999px}
.filter-pill.is-active{background:var(--ink);color:var(--brass-2)}
.page-numbers{border-radius:50%}
.prose a{text-decoration-color:var(--brass);text-underline-offset:3px}
.prose h2{font-weight:400}
.prose ul li::marker{color:var(--brass)}

/* ---------- 17. Floating buttons: round, stacked, brass ring ---------- */
.contact-fab-toggle{border-radius:50%;border:0;background:var(--brass);color:var(--ink);box-shadow:0 0 0 6px rgba(194,154,91,.22),0 14px 30px -12px rgba(0,0,0,.5)}
.contact-fab-toggle:hover{transform:scale(1.06);box-shadow:0 0 0 9px rgba(194,154,91,.2),0 16px 34px -12px rgba(0,0,0,.5)}
.contact-fab.is-open .contact-fab-toggle{background:var(--ink);color:var(--brass-2)}
.contact-fab-action{border-radius:999px;border:1px solid var(--line);box-shadow:0 10px 26px -14px rgba(0,0,0,.45);font-family:var(--body);font-weight:700}
.contact-fab-action:hover{background:var(--ink);color:var(--brass-2)}
.back-to-top{border-radius:50%;border:1px solid var(--line);box-shadow:0 10px 26px -14px rgba(0,0,0,.45);background:#fff}
.back-to-top:hover{background:var(--ink);color:var(--brass-2)}

/* ---------- 18. Word-by-word heading reveal (novelty 4) ---------- */
.hx-js [data-words] .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em}
.hx-js [data-words] .w>span{display:inline-block;transform:translateY(105%);transition:transform .9s var(--ease);transition-delay:calc(var(--wi,0) * 55ms)}
.hx-js [data-words].is-words-in .w>span{transform:none}
@media (prefers-reduced-motion:reduce){
  .hx-js [data-words] .w>span{transform:none}
  .tx-hero-star,.tx-ticker-run,.tx-star-shape,.close-band .rings,.dot{animation:none}
  .tx-tile,.tx-model{transform:none}
}

/* ---------- 19. Responsive ---------- */
@media (max-width:1100px){
  .tx-bento{grid-template-columns:repeat(2,1fr);grid-auto-rows:220px}
  .tx-tile-0{grid-column:span 2}
  .tx-tile-1,.tx-tile-4{grid-column:span 1}
  .tx-concierge .wrap,.tx-starmap,.tx-timeline-wrap,.tx-price{grid-template-columns:1fr;gap:44px}
  .tx-timeline-head{position:static}
  .tx-starmap .tx-star-svg{max-width:440px;margin:0 auto}
  .tx-notes{grid-template-columns:1fr 1fr}
  .tx-note:nth-child(2n){border-right:0;margin-right:0}
  .tx-models{grid-template-columns:1fr 1fr}
  .hx-head{color:var(--on-dark)}
}
@media (max-width:700px){
  .sec{padding:80px 0}
  .tx-hero{min-height:auto;padding:90px 0 110px}
  .tx-hero h1{font-size:clamp(38px,11vw,56px)}
  .tx-bento{grid-template-columns:1fr;grid-auto-rows:200px}
  .tx-tile-0,.tx-tile-1,.tx-tile-4{grid-column:span 1;grid-row:span 1}
  .tx-tile ul{max-height:none;opacity:1;margin-top:10px}
  .tx-notes{grid-template-columns:1fr}
  .tx-note{border-right:0;margin-right:0;border-bottom:1px solid var(--line);padding-right:0}
  .tx-models,.tx-voices,.tx-journal{grid-template-columns:1fr}
  .tx-stat b{font-size:24px}
  .tx-zip{border-radius:22px}
  .tx-price-card{padding:6px 18px}
  .tx-price-row{flex-direction:column;align-items:flex-start;gap:6px}
  .tx-price-row em{text-align:left}
  .tx-cloud{columns:2 130px}
}

/* ---------- 20. Readable brass on light backgrounds ---------- */
.tx-price-row em,.tx-model-type,.tx-entry-meta,.tx-panel-head span,.ticket-head span,.anat .kicker,.sec:not(.is-dark) .sec-num span:first-child,.tx-cloud a:hover,.tx-pt.is-on text,.kicker{color:var(--brass-text)}
.is-dark .kicker,.tx-hero .kicker,.page-head .kicker,.tx-concierge .kicker{color:var(--brass-2)}

/* ---------- 21. Dark page heads: fact card and ghost buttons readable ---------- */
.page-head .facts{background:rgba(255,255,255,.05);border:1px solid var(--line-dark);border-radius:var(--radius-sm);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.page-head .facts>div{border-color:var(--line-dark)}
.page-head .facts dd{color:#fff}
.page-head .facts dd b,.page-head .facts dd strong{color:var(--brass-2)}
.county-hero .btn-ghost,.page-head .btn-ghost{--fg:#fff;color:#fff}

/* ---------- 22. Mobile header: the longer booking label must not push past the edge ---------- */
@media (max-width:700px){
  .hx-head .wrap{gap:12px}
  .hx-head .btn-schedule>span{padding:9px 14px;font-size:13px}
  .hx-logo-word{font-size:18px}
  .hx-logo svg{width:32px;height:32px}
}
@media (max-width:400px){
  .hx-head .btn-schedule{display:none}
}

/* ---------- 23. Bento with 8–9 categories (ventilation, warming drawers): last row fills evenly ---------- */
@media (min-width:1101px){
  .tx-bento:has(>.tx-tile-8) .tx-tile-7,.tx-bento:has(>.tx-tile-8) .tx-tile-8{grid-column:span 2}
  .tx-bento:has(>.tx-tile-7):not(:has(>.tx-tile-8)) .tx-tile-7{grid-column:span 4;grid-row:span 1}
}