/*
Theme Name: Bertazzoni Houston
Template: bosch-houston-theme
Description: Bertazzoni Houston child theme of the Houston line. "Casa Italiana" skin: warm cream and terrazzo surfaces, deep navy ink, polished brass accents, Italian old-style serif headlines, arched photo frames, a thin tricolor rule, burner rings and brass knobs. Loaded after the parent stylesheet.
Version: 1.0.0
Text Domain: bertazzoni-houston
*/

/* ---------- 1. Tokens ---------- */
:root{
  --paper:#F7F1E6;
  --paper-2:#EFE6D5;
  --white:#FFFDF8;
  --ink:#171E2D;
  --ink-2:#3A4152;
  --muted:#776F62;
  --line:#E2D6C1;
  --line-dark:#2B3447;
  --on-dark:#F7F1E6;
  --on-dark-2:#D9D1C1;
  --on-dark-3:#A8A08F;
  --amber:#A8792B;
  --bz-brass:#A8792B;
  --bz-brass-2:#C29440;
  --bz-brass-light:#E6C98A;
  --bz-navy:#171E2D;
  --bz-navy-2:#222B3F;
  --bz-terra:#B4553A;
  --bz-verde:#2F6B4F;
  --bz-rosso:#B23A3A;
  --bz-gold:linear-gradient(180deg,#F1D9A0 0%,#C9A05A 45%,#A8792B 55%,#D9B877 100%);
  --display:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --body:"Karla",system-ui,sans-serif;
  --mono:"Spline Sans Mono",ui-monospace,monospace;
  --r:6px;
  --terrazzo:radial-gradient(circle at 12% 18%,rgba(180,85,58,.18) 0 3px,transparent 4px),radial-gradient(circle at 63% 42%,rgba(47,107,79,.16) 0 2.5px,transparent 3.5px),radial-gradient(circle at 38% 74%,rgba(168,121,43,.2) 0 3px,transparent 4px),radial-gradient(circle at 86% 82%,rgba(23,30,45,.12) 0 2px,transparent 3px),radial-gradient(circle at 24% 52%,rgba(23,30,45,.1) 0 1.5px,transparent 2.5px),radial-gradient(circle at 78% 12%,rgba(180,85,58,.14) 0 2px,transparent 3px);
}

/* ---------- 2. Base ---------- */
body{background:var(--paper);font-family:var(--body)}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;letter-spacing:0;line-height:1.02;text-transform:none}
h1{font-size:clamp(46px,6vw,92px);font-weight:600}
h2{font-size:clamp(34px,4.2vw,60px)}
h3{font-weight:700}
h2.lede{font-family:var(--body);font-weight:400;font-size:clamp(17px,1.5vw,20px);line-height:1.6;letter-spacing:0}
h1 em,h2 em{font-style:italic;font-weight:500;color:var(--bz-brass)}
.kicker,.sec-num,.ticket-head span,.zip label,.lrow em{font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase}
.kicker::before{width:18px;height:1.5px;border-radius:0;background:var(--bz-brass);box-shadow:none}
.dot{background:var(--bz-verde);box-shadow:0 0 0 3px rgba(47,107,79,.2)}
.hx-head{background:rgba(247,241,230,.95);border-bottom:1px solid var(--line)}
.btn{border-radius:2px;clip-path:none;font-family:var(--body);font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:14px}
.btn-signal,.btn-primary{background:var(--bz-navy);--bg:var(--bz-navy);color:var(--bz-brass-light);box-shadow:inset 0 0 0 1px var(--bz-brass)}
.btn-signal:hover,.btn-primary:hover{background:var(--bz-navy-2)}
.btn-signal>i,.btn-primary>i{border-left-color:rgba(230,201,138,.35)}
.chips a{border-radius:2px}
.sec-num{border-top:0;display:flex;align-items:center;gap:12px}
.sec-num span:first-child{font-family:var(--display);font-style:italic;font-weight:600;font-size:34px;letter-spacing:0;text-transform:none;color:var(--bz-brass)}
.is-dark{background:var(--bz-navy)}
.is-dark .sec-num span:first-child{color:var(--bz-brass-light)}
.county-hero{background:var(--bz-navy)}
.county-hero h1 .hx-red{color:var(--bz-brass-light)}
.hx-lead{border-left:2px solid var(--bz-brass);padding-left:18px}
.ticket{border-radius:var(--r);border:1px solid var(--line);box-shadow:0 26px 50px rgba(23,30,45,.16);overflow:hidden;background:var(--white)}
.ticket::before,.ticket::after{display:none}
.ticket-head{background:var(--bz-navy);border-bottom:2px solid var(--bz-brass)}
.ticket-head b{color:var(--on-dark);font-family:var(--display);font-size:25px;font-weight:600}
.ticket-head span{color:var(--bz-brass-light)}
#schedule-appointment input,#schedule-appointment select,#schedule-appointment textarea{border-radius:2px}
#schedule-appointment button,#schedule-appointment input[type="submit"]{background:var(--bz-navy);border-radius:2px;text-transform:uppercase;letter-spacing:.08em}
.rail-box{border-radius:var(--r);border:1px solid var(--line)}
.row:hover,.row.on{background:rgba(168,121,43,.07)}
.contact-fab-toggle{background:var(--bz-navy);box-shadow:0 0 0 3px var(--bz-brass)}
.bosch-modal-panel{border:1px solid var(--line);border-top:3px solid var(--bz-brass);box-shadow:0 30px 70px rgba(0,0,0,.35);background:var(--white)}

/* ---------- 3. Hero: arch photo + serif headline, tricolor rule ---------- */
.bz-hero{background:var(--paper) var(--terrazzo);background-size:180px 180px}
.bz-hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;padding-top:66px;padding-bottom:78px;align-items:center}
.bz-hero .wrap>*{min-width:0}
.bz-eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.bz-eyebrow i{width:30px;height:2px;background:linear-gradient(90deg,var(--bz-verde) 0 33%,#fff 33% 66%,var(--bz-rosso) 66%)}
.bz-hero h1{margin:22px 0 18px;color:var(--ink)}
.bz-hero .lede{color:var(--ink-2);max-width:560px}
.bz-zip{background:var(--white);border:1px solid var(--line);border-radius:2px;max-width:520px}
.bz-zip label{color:var(--muted);border-right-color:var(--line)}
.bz-zip button{background:var(--bz-navy);color:var(--bz-brass-light);text-transform:uppercase;letter-spacing:.08em;font-weight:700}
.bz-hero .btn-row{margin-top:26px}
.bz-hero-side{display:grid;grid-template-columns:.8fr 1fr;gap:18px;align-items:end}
.bz-arch{position:relative;aspect-ratio:3/4.2;border-radius:999px 999px 6px 6px;overflow:hidden;isolation:isolate;background:var(--paper-2);box-shadow:0 0 0 8px var(--white),0 0 0 9px var(--line)}
.bz-tricolor{display:grid;grid-template-columns:1fr 1fr 1fr;height:5px}
.bz-tricolor i:nth-child(1){background:var(--bz-verde)}
.bz-tricolor i:nth-child(2){background:var(--white)}
.bz-tricolor i:nth-child(3){background:var(--bz-rosso)}

/* ---------- 4. NEW: burner board ---------- */
.bz-board{padding:30px;border-radius:10px;background:#1C2333;background-image:radial-gradient(circle at 50% 0,rgba(255,255,255,.06),transparent 60%),repeating-linear-gradient(90deg,transparent 0 31px,rgba(255,255,255,.03) 31px 32px);box-shadow:inset 0 0 0 1px #2F3850,0 24px 50px rgba(23,30,45,.25);display:grid;gap:26px}
.bz-row{display:grid;grid-template-columns:140px 1fr;gap:20px;align-items:start}
.bz-row+.bz-row{padding-top:24px;border-top:1px solid rgba(230,201,138,.18)}
.bz-row-name{font-family:var(--display);font-style:italic;font-size:30px;color:var(--bz-brass-light);padding-top:24px}
.bz-burners{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:18px 14px}
.bz-burner{display:grid;justify-items:center;text-align:center;gap:8px;text-decoration:none;color:var(--on-dark);padding:6px}
.bz-ring{position:relative;display:grid;place-items:center;width:104px;height:104px;border-radius:50%;background:radial-gradient(circle,#2A3247 0 34%,#141A27 35% 44%,#3A4258 45% 48%,#141A27 49% 62%,transparent 63%),var(--bz-gold);box-shadow:inset 0 0 0 4px rgba(0,0,0,.25),0 10px 20px rgba(0,0,0,.35);transition:transform .3s,box-shadow .3s}
.bz-ring img{width:34px;height:34px;filter:invert(1) sepia(.4) saturate(2) hue-rotate(5deg) brightness(.95)}
.bz-ring::after{content:"";position:absolute;inset:-6px;border-radius:50%;background:conic-gradient(from 0deg,rgba(80,140,255,0) 0 10deg,rgba(90,150,255,.85) 10deg 18deg,rgba(80,140,255,0) 18deg 40deg,rgba(90,150,255,.85) 40deg 48deg,rgba(80,140,255,0) 48deg 70deg,rgba(90,150,255,.85) 70deg 78deg,rgba(80,140,255,0) 78deg 100deg,rgba(90,150,255,.85) 100deg 108deg,rgba(80,140,255,0) 108deg 130deg,rgba(90,150,255,.85) 130deg 138deg,rgba(80,140,255,0) 138deg 160deg,rgba(90,150,255,.85) 160deg 168deg,rgba(80,140,255,0) 168deg 190deg,rgba(90,150,255,.85) 190deg 198deg,rgba(80,140,255,0) 198deg 220deg,rgba(90,150,255,.85) 220deg 228deg,rgba(80,140,255,0) 228deg 250deg,rgba(90,150,255,.85) 250deg 258deg,rgba(80,140,255,0) 258deg 280deg,rgba(90,150,255,.85) 280deg 288deg,rgba(80,140,255,0) 288deg 310deg,rgba(90,150,255,.85) 310deg 318deg,rgba(80,140,255,0) 318deg 340deg,rgba(90,150,255,.85) 340deg 348deg,rgba(80,140,255,0) 348deg 360deg);-webkit-mask:radial-gradient(circle,transparent 58%,#000 60%,#000 66%,transparent 68%);mask:radial-gradient(circle,transparent 58%,#000 60%,#000 66%,transparent 68%);opacity:0;transition:opacity .3s}
.bz-burner b{font-family:var(--display);font-size:22px;font-weight:600;line-height:1.05}
.bz-burner small{font-family:var(--mono);font-size:11px;color:var(--on-dark-3)}
.bz-burner:hover .bz-ring,.bz-burner:focus-visible .bz-ring{transform:scale(1.05);box-shadow:inset 0 0 0 4px rgba(0,0,0,.25),0 0 0 2px var(--bz-brass-light),0 14px 26px rgba(0,0,0,.45)}
.bz-burner:hover .bz-ring::after,.bz-burner:focus-visible .bz-ring::after{opacity:1}
.bz-burner:hover b{color:var(--bz-brass-light)}
.bz-burner:focus-visible{outline:none}

/* ---------- 5. NEW: three series ---------- */
.bz-series{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.bz-serie{text-align:center;padding:30px 26px 30px;border:1px solid rgba(230,201,138,.3);border-radius:200px 200px 6px 6px;background:rgba(255,255,255,.03)}
.bz-serie span{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--bz-brass-light)}
.bz-serie h3{font-family:var(--display);font-size:40px;font-weight:600;color:var(--on-dark);margin:8px 0 12px}
.bz-serie p{color:var(--on-dark-2);font-size:15.5px;line-height:1.6;margin:0}
.bz-knob{width:96px;height:96px;margin:6px auto 20px;border-radius:50%;position:relative;display:grid;place-items:center}
.bz-knob i{position:absolute;top:10px;left:50%;width:4px;height:22px;margin-left:-2px;border-radius:2px}
.bz-serie-professional .bz-knob{background:radial-gradient(circle at 40% 30%,#FFFFFF,#AEB4BC 45%,#6E747D);box-shadow:0 8px 16px rgba(0,0,0,.45),inset 0 -4px 8px rgba(0,0,0,.2)}
.bz-serie-professional .bz-knob i{background:#2A2F38}
.bz-serie-master .bz-knob{background:radial-gradient(circle at 40% 30%,#3B4256,#171E2D 70%);box-shadow:0 0 0 3px #AEB4BC,0 8px 16px rgba(0,0,0,.45)}
.bz-serie-master .bz-knob i{background:var(--bz-brass-light)}
.bz-serie-heritage .bz-knob{background:radial-gradient(circle at 40% 30%,#FFF6E0,#E6C98A 40%,#A8792B 80%);box-shadow:0 0 0 5px #B23A3A,0 8px 16px rgba(0,0,0,.45)}
.bz-serie-heritage .bz-knob i{background:#171E2D}
.bz-series-note{text-align:center;color:var(--on-dark-3);margin:26px 0 0}

/* ---------- 6. NEW: knob code finder ---------- */
.bz-dial-wrap{display:grid;grid-template-columns:auto 1fr;gap:56px;align-items:center;padding:34px 40px;border-radius:10px;background:var(--white) var(--terrazzo);background-size:160px 160px;border:1px solid var(--line)}
.bz-dial{position:relative;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,transparent 52%,var(--paper-2) 53% 99%,transparent 100%)}
.bz-mark{position:absolute;left:50%;top:50%;width:0;height:0;transform:rotate(var(--a))}
.bz-mark input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.bz-mark span{position:absolute;left:0;top:-160px;transform:translateX(-50%) rotate(calc(-1 * var(--a)));white-space:nowrap;cursor:pointer;font-family:var(--mono);font-size:11.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);padding:3px 6px;border-radius:2px;transition:color .2s,background .2s}
.bz-mark span::before{content:"";position:absolute;left:50%;top:22px;width:2px;height:10px;margin-left:-1px;background:var(--line)}
.bz-mark input:checked+span{color:var(--white);background:var(--bz-navy)}
.bz-mark input:focus-visible+span{outline:2px solid var(--bz-brass);outline-offset:2px}
.bz-dial-knob{position:absolute;left:50%;top:50%;width:150px;height:150px;margin:-75px 0 0 -75px;border-radius:50%;background:radial-gradient(circle at 38% 30%,#FFF6E0,#E6C98A 30%,#A8792B 70%,#7A5520);box-shadow:0 14px 28px rgba(23,30,45,.35),inset 0 -6px 12px rgba(0,0,0,.25),inset 0 0 0 10px rgba(255,255,255,.08);transform:rotate(var(--rot));transition:transform .45s cubic-bezier(.3,1.4,.5,1)}
.bz-dial-knob i{position:absolute;left:50%;top:12px;width:6px;height:40px;margin-left:-3px;border-radius:3px;background:var(--bz-navy)}
.bz-dial-side label{display:block;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.bz-dial-row{display:grid;grid-template-columns:1fr auto;border:1px solid var(--ink);border-radius:2px;background:var(--white)}
.bz-dial-row input{min-width:0;border:0;background:transparent;padding:16px 18px;font-family:var(--mono);font-size:22px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink)}
.bz-dial-row input:focus{outline:none}
.bz-dial-row:focus-within{box-shadow:0 0 0 3px rgba(168,121,43,.35)}
.bz-dial-row button{border:0;background:var(--bz-navy);color:var(--bz-brass-light);padding:0 24px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;cursor:pointer}
.bz-dial-row button:hover{background:var(--bz-navy-2)}
.bz-dial-side p{margin:14px 0 0;color:var(--ink-2)}

/* ---------- 7. Visit steps (roman numerals) ---------- */
.bz-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}
.bz-steps li{padding:26px 24px 28px;border-right:1px solid var(--line)}
.bz-steps li:last-child{border-right:0}
.bz-step-n{font-family:var(--display);font-style:italic;font-size:54px;font-weight:600;line-height:1;color:var(--bz-brass)}
.bz-steps h3{font-size:26px;margin:12px 0 8px}
.bz-steps p{font-size:15.5px;color:var(--ink-2)}

/* ---------- 8. Service map ---------- */
.bz-map{aspect-ratio:600/552;max-width:620px;border-radius:300px 300px 8px 8px;overflow:hidden;background:var(--white);box-shadow:0 0 0 8px var(--white),0 0 0 9px var(--line),0 20px 40px rgba(23,30,45,.12)}
.bz-map .bz-water{fill:#CFDCE3}
.bz-map .bz-sea{font-family:var(--display);font-style:italic;font-size:13px;fill:#5B7385;pointer-events:none}
.bz-map .bz-county path{stroke:var(--white);stroke-width:1.6;stroke-linejoin:round;transition:fill .25s}
.bz-map .bz-t0 path{fill:#F1E7D4}
.bz-map .bz-t1 path{fill:#E8DCC4}
.bz-map .bz-t2 path{fill:#DFD0B3}
.bz-map .bz-county:hover path,.bz-map .bz-county.is-on path{fill:#E6C98A}
.bz-map .bz-cname{font-family:var(--display);font-weight:700;font-size:13px;letter-spacing:.12em;fill:#9E8E70;pointer-events:none}
.bz-map .bz-cname.is-on{fill:var(--bz-navy)}
.bz-map .lbl{font-family:var(--body);font-weight:600;font-size:9.5px;fill:var(--ink);paint-order:stroke;stroke:rgba(255,253,248,.95);stroke-width:3px;stroke-linejoin:round}
.bz-map .pin{fill:var(--bz-navy);stroke:var(--white);stroke-width:1.5}
.bz-map .bz-pin:hover .pin,.bz-map .is-center .pin{fill:var(--bz-brass)}
.bz-map .bz-pin:hover .lbl{fill:var(--bz-brass)}
.bz-map .is-center .lbl{font-weight:800}
.bz-map .bz-pulse{fill:none;stroke:var(--bz-brass);stroke-width:1.5;transform-box:fill-box;transform-origin:center;animation:bz-pulse 2.4s ease-out infinite}
@keyframes bz-pulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(3.6);opacity:0}}
.county.is-on summary b{color:var(--bz-brass)}

/* ---------- 9. Reused parent blocks ---------- */
.support-desk h2{font-family:var(--display)}
.channel{border-radius:2px}
.models{border:0;background:transparent;gap:20px}
.model{border:1px solid var(--line);border-radius:var(--r);background:var(--white)}
.voice{border:1px solid var(--line);border-radius:var(--r);background:var(--white)}
.voice q{font-family:var(--display);font-style:italic;font-size:22px}
.lrow b{font-family:var(--display);font-size:24px;font-weight:600}
.county{border-radius:var(--r)}
.hx-faq summary{font-family:var(--display);font-size:22px;font-weight:600}
.hx-cover{border-radius:var(--r)}
.hx-cover-1{background:var(--bz-navy);color:var(--bz-brass-light)}
.hx-cover-2{background:var(--bz-terra);color:#fff}
.hx-cover-3{background:var(--paper-2) var(--terrazzo);background-size:140px 140px;color:var(--ink);box-shadow:none}
.hx-cover-3::before{background:var(--bz-brass)}
.hx-cover .hx-cover-title{font-family:var(--display);font-weight:600;font-size:clamp(24px,2.1vw,31px)}

/* ---------- 10. Responsive ---------- */
@media (max-width:1060px){
  .bz-hero .wrap{grid-template-columns:1fr}
  .bz-hero-side{grid-template-columns:1fr}
  .bz-arch{max-width:360px;aspect-ratio:3/3.4}
  .bz-row{grid-template-columns:1fr}
  .bz-row-name{padding-top:0}
  .bz-series{grid-template-columns:1fr}
  .bz-dial-wrap{grid-template-columns:1fr;justify-items:center;padding:28px 18px}
  .bz-steps{grid-template-columns:1fr 1fr}
  .bz-steps li:nth-child(2){border-right:0}
}
@media (max-width:640px){
  .bz-hero .wrap{padding-top:36px;padding-bottom:46px;gap:30px}
  .bz-board{padding:18px}
  .bz-burners{grid-template-columns:repeat(2,1fr)}
  .bz-ring{width:88px;height:88px}
  .bz-dial{width:280px;height:280px}
  .bz-mark span{top:-134px;font-size:10px}
  .bz-dial-knob{width:120px;height:120px;margin:-60px 0 0 -60px}
  .bz-dial-side{width:100%}
  .bz-steps{grid-template-columns:1fr}
  .bz-steps li{border-right:0;border-bottom:1px solid var(--line)}
}
@media (prefers-reduced-motion:reduce){.bz-map .bz-pulse{animation:none;opacity:0}.bz-dial-knob{transition:none}}

/* Hero: the kitchen photo fills the whole first screen; a navy wash keeps the copy readable. */
.bz-hero{position:relative;isolation:isolate;overflow:hidden;background:var(--bz-navy)}
.bz-hero-bg{position:absolute;inset:0;z-index:-2}
.bz-hero-bg img{width:100%;height:100%;object-fit:cover;object-position:70% center}
.bz-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(23,30,45,.94) 0%,rgba(23,30,45,.84) 40%,rgba(23,30,45,.38) 100%)}
.bz-hero .wrap{min-height:clamp(560px,80vh,780px);padding-top:84px;padding-bottom:96px}
.bz-hero h1{color:#fff}
.bz-hero h1 em{color:var(--bz-brass-light)}
.bz-hero .lede{color:rgba(255,255,255,.84)}
.bz-hero .bz-eyebrow,.bz-hero .zip-note{color:rgba(255,255,255,.72)}
.bz-hero-side{grid-template-columns:1fr;justify-items:end}
.bz-hero-side>*{width:100%;max-width:420px}
@media (max-width:960px){
  .bz-hero::before{background:linear-gradient(180deg,rgba(23,30,45,.9) 0%,rgba(23,30,45,.82) 100%)}
  .bz-hero .wrap{min-height:0;padding-top:48px;padding-bottom:56px}
  .bz-hero-side{justify-items:stretch}
  .bz-hero-side>*{max-width:none}
}

/* Burner ring with the uploaded category photo: the gold rim stays, the photo is the burner face. */
.bz-ring.has-photo{isolation:isolate}
.bz-ring.has-photo img.hx-fill{inset:7px;width:calc(100% - 14px)!important;height:calc(100% - 14px)!important;border-radius:50%;object-fit:cover;z-index:0;filter:none;box-shadow:inset 0 0 0 2px rgba(0,0,0,.35)}