:root {
  --ink: #07335a;
  --muted: #607484;
  --paper: #f2f7fa;
  --card: rgba(255,255,255,.86);
  --line: #d7e3ea;
  --green: #003c71;
  --green-dark: #002d56;
  --terracotta: #009bdf;
  --sand: #d8ebf6;
  --shadow: 0 24px 80px rgba(0, 60, 113, .11);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: "DM Sans", sans-serif; min-height: 100vh; }
button, input, select { font: inherit; }
button, label { -webkit-tap-highlight-color: transparent; }
.ambient { position: fixed; pointer-events: none; filter: blur(2px); z-index: -1; border-radius: 50%; opacity: .7; }
.ambient-one { width: 45vw; height: 45vw; right: -18vw; top: -17vw; background: radial-gradient(circle, rgba(0,155,223,.18), transparent 68%); }
.ambient-two { width: 45vw; height: 45vw; left: -22vw; top: 40vh; background: radial-gradient(circle, rgba(0,60,113,.10), transparent 68%); }
.topbar { max-width: 1320px; margin: 0 auto; padding: 28px 34px; display: flex; justify-content: space-between; align-items: center; }
.brand { color: var(--ink); text-decoration: none; display: inline-flex; align-items: center; gap: 15px; }
.brand img { width: 205px; height: auto; display: block; }
.product-finder-label { border-left: 1px solid #cbdce6; padding-left: 15px; color: var(--green); letter-spacing: .18em; font-size: 9px; font-weight: 700; }
.private-pill { font-size: 12px; font-weight: 600; color: var(--green-dark); background: rgba(255,255,255,.76); border: 1px solid rgba(0,60,113,.14); padding: 9px 13px; border-radius: 999px; display: flex; align-items: center; gap: 8px; backdrop-filter: blur(10px); }
.private-pill span { width: 7px; height: 7px; border-radius: 50%; background: var(--terracotta); box-shadow: 0 0 0 4px rgba(0,155,223,.12); }
main { max-width: 1320px; margin: 0 auto; padding: 20px 34px 80px; }
.hero { display: grid; grid-template-columns: 1.25fr .75fr; gap: 70px; align-items: end; padding: 62px 0 50px; }
.eyebrow, .step-label { margin: 0 0 11px; color: var(--terracotta); text-transform: uppercase; letter-spacing: .15em; font-size: 10px; font-weight: 700; }
.hero h1 { font-family: Manrope, sans-serif; font-size: clamp(42px, 6vw, 78px); line-height: .98; letter-spacing: -.055em; margin: 0; max-width: 850px; font-weight: 600; }
.hero-lede { color: var(--muted); font-size: 17px; line-height: 1.7; max-width: 650px; margin: 25px 0 0; }
.market-card { background: rgba(255,255,255,.68); border: 1px solid rgba(255,255,255,.95); border-radius: 24px; padding: 24px; box-shadow: 0 18px 55px rgba(0,60,113,.07); backdrop-filter: blur(14px); }
.market-card h2 { margin: 0 0 20px; font: 600 20px/1.2 Manrope, sans-serif; letter-spacing: -.025em; }
.segmented { display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; background: #ecebe5; padding: 6px; border-radius: 15px; }
.segment { border: 0; cursor: pointer; background: transparent; border-radius: 11px; padding: 10px 6px; display: grid; gap: 1px; color: #737874; transition: .2s ease; }
.segment b { font-size: 12px; }
.segment span { font-size: 10px; }
.segment.active { color: var(--green-dark); background: white; box-shadow: 0 5px 16px rgba(0,60,113,.09); }
.microcopy { color: #888d89; font-size: 10px; margin: 12px 2px 0; }
.finder-shell { background: rgba(255,255,255,.82); border: 1px solid rgba(255,255,255,.95); min-height: 620px; border-radius: 30px; display: grid; grid-template-columns: 230px 1fr; overflow: hidden; box-shadow: var(--shadow); backdrop-filter: blur(18px); }
.progress-rail { background: var(--green-dark); color: white; padding: 44px 30px; position: relative; display: flex; flex-direction: column; gap: 9px; }
.progress-track { position: absolute; top: 67px; bottom: 230px; left: 48px; width: 1px; background: rgba(255,255,255,.14); }
.progress-track span { display: block; width: 2px; background: var(--terracotta); height: 0; transition: height .35s ease; }
.rail-step { cursor: pointer; border: 0; background: transparent; color: rgba(255,255,255,.52); display: grid; grid-template-columns: 38px 1fr; align-items: start; text-align: left; gap: 5px; padding: 14px 0; position: relative; z-index: 1; transition: color .2s ease; }
.rail-step > span { width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(255,255,255,.2); background: var(--green-dark); display: grid; place-items: center; font-size: 10px; }
.rail-step div { display: grid; gap: 4px; padding-top: 2px; }
.rail-step b { font: 600 13px Manrope, sans-serif; }
.rail-step small { font-size: 10px; }
.rail-step.active, .rail-step.done { color: white; }
.rail-step.active > span { border-color: var(--terracotta); color: #8ddaff; box-shadow: 0 0 0 5px rgba(0,155,223,.12); }
.rail-step.done > span { background: var(--terracotta); border-color: var(--terracotta); color: white; }
.rail-note { margin-top: auto; border-top: 1px solid rgba(255,255,255,.12); padding-top: 22px; }
.rail-note span { font-size: 9px; letter-spacing: .14em; text-transform: uppercase; color: #69c9f2; font-weight: 700; }
.rail-note p { font-size: 10px; line-height: 1.55; color: rgba(255,255,255,.54); margin: 9px 0 0; }
.wizard-card { min-width: 0; }
#finder-form { min-height: 620px; display: flex; flex-direction: column; }
.panel { display: none; padding: 48px 54px 26px; animation: appear .3s ease; }
.panel.active { display: block; }
@keyframes appear { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }
.panel-head { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-bottom: 34px; }
.panel-head h2 { font: 600 29px/1.15 Manrope, sans-serif; letter-spacing: -.035em; margin: 0; max-width: 580px; }
.panel-head > p { color: var(--muted); font-size: 11px; line-height: 1.5; max-width: 230px; margin: 0; }
.product-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.product-option { position: relative; border: 1px solid var(--line); border-radius: 17px; padding: 19px; min-height: 145px; cursor: pointer; display: flex; flex-direction: column; transition: .2s ease; background: rgba(255,255,255,.5); }
.product-option:hover { transform: translateY(-2px); border-color: #bdbdb5; }
.product-option.selected { border-color: var(--green); background: #f3f9fd; box-shadow: inset 0 0 0 1px var(--green); }
.product-option input { position: absolute; opacity: 0; pointer-events: none; }
.product-option b { font: 600 14px Manrope, sans-serif; margin-top: auto; }
.product-option small { color: var(--muted); font-size: 10px; margin-top: 5px; }
.product-option em { position: absolute; top: 14px; right: 13px; font-style: normal; font-size: 8px; color: var(--green); background: #e8f6fc; border-radius: 99px; padding: 5px 7px; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; }
.option-icon { width: 44px; height: 44px; display: grid; place-items: center; color: var(--green); }
.option-icon svg { width: 44px; height: 44px; display: block; overflow: visible; }
.option-icon path, .option-icon circle { fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.product-option.selected .option-icon { color: var(--terracotta); }
.subtype-block { margin-top:22px;padding-top:20px;border-top:1px solid var(--line); }
.subtype-block[hidden] { display:none; }
.subtype-block h3 { margin:0 0 12px;font:600 15px/1.3 Manrope,sans-serif;color:var(--ink); }
.subtype-grid { display:flex;flex-wrap:wrap;gap:9px; }
.subtype-option { position:relative;cursor:pointer; }
.subtype-option input { position:absolute;opacity:0;pointer-events:none; }
.subtype-option span { display:block;padding:10px 14px;border:1px solid var(--line);border-radius:999px;background:white;color:var(--ink);font-size:14px;transition:.2s ease; }
.subtype-option small { display:block;font-size:11px;line-height:1.35;font-weight:400;margin-top:4px; }
.subtype-option:has(small) span { border-radius:16px; }
.subtype-option.selected span { color:white;background:var(--green);border-color:var(--green);box-shadow:0 6px 16px rgba(0,60,113,.16); }
.dimension-visual { display: grid; grid-template-columns: 1.15fr .85fr; gap: 48px; align-items: center; }
.room-plan { height: 330px; background: linear-gradient(135deg,#e8f2f8,#f8fbfd); border: 1px solid #dceaf1; position: relative; border-radius: 20px; display: grid; place-items: center; overflow: hidden; }
.room-plan::before { content:""; position:absolute; inset:0; background-image: linear-gradient(rgba(0,60,113,.05) 1px, transparent 1px),linear-gradient(90deg, rgba(0,60,113,.05) 1px, transparent 1px); background-size:25px 25px; }
.fixture-shape { width: 58%; height: 55%; border: 2px solid var(--green); background: linear-gradient(145deg,rgba(255,255,255,.9),rgba(216,235,246,.62)); border-radius: 10px 30px 10px 10px; box-shadow: 12px 15px 30px rgba(0,60,113,.11); transform: perspective(700px) rotateX(4deg) rotateZ(-4deg); position:relative; display:grid; place-items:center; }
.fixture-shape::after { content:""; position:absolute; inset:13px; border:1px solid rgba(0,60,113,.25); border-radius:5px 22px 5px 5px; }
.fixture-shape span { font-size:9px; letter-spacing:.16em; color:rgba(0,60,113,.6); }
.measure { position:absolute; font-style:normal; color:var(--green-dark); font-size:10px; font-weight:500; z-index:2; }
.measure b { font-size:13px; }
.measure i { display:block; background:var(--terracotta); position:relative; opacity:.65; }
.measure-w { bottom:25px; left:25%; right:25%; text-align:center; }
.measure-w i { height:1px; margin-bottom:5px; }
.measure-d { top:23%; bottom:23%; right:21px; writing-mode:vertical-rl; display:flex; align-items:center; gap:5px; }
.measure-d i { width:1px; height:100%; }
.dimension-fields { display:grid; gap:14px; }
.dimension-fields label > span, .select-field > span { display:block; font-size:10px; font-weight:600; margin:0 0 6px; color:#59615e; }
.dimension-fields label > div { display:flex; align-items:center; background:white; border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.dimension-fields input { border:0; outline:0; width:100%; padding:13px 14px; color:var(--ink); background:transparent; font-weight:600; }
.dimension-fields em { font-style:normal; font-size:10px; color:var(--muted); padding-right:14px; }
.field-tip { display:flex; align-items:flex-start; gap:9px; padding:10px 12px; border-radius:10px; background:#eaf6fb; color:#35647f; }
.field-tip span { width:16px; height:16px; border:1px solid #7dbbd7; border-radius:50%; display:grid; place-items:center; font-size:9px; flex:0 0 auto; }
.field-tip p { font-size:9px; line-height:1.5; margin:0; }
.clearance-layout { display:grid;grid-template-columns:minmax(290px,.9fr) minmax(360px,1.1fr);gap:38px;align-items:center; }
.clearance-controls { min-width:0; }
.clearance-sketch { margin:0;border:1px solid #d7e6ee;border-radius:18px;padding:14px;background:linear-gradient(145deg,#f9fcfd,#eaf4f8);box-shadow:inset 0 0 0 1px rgba(255,255,255,.75); }
.clearance-sketch svg { width:100%;height:auto;display:block;overflow:visible; }
.clearance-sketch figcaption { margin:3px 0 0;text-align:center;color:#527083;font-size:12px;font-weight:600; }
.clearance-sketch marker path { fill:var(--terracotta);stroke:none; }
.sketch-product { fill:rgba(255,255,255,.78);stroke:var(--green);stroke-width:2;vector-effect:non-scaling-stroke; }
.sketch-product.built-in { fill:rgba(216,235,246,.45); }
.sketch-product.combo { fill:rgba(255,255,255,.88); }
.sketch-product.panel { fill:rgba(216,235,246,.55); }
.sketch-base { fill:rgba(0,155,223,.12);stroke:var(--green);stroke-width:2;vector-effect:non-scaling-stroke; }
.sketch-wall { fill:none;stroke:#7192a5;stroke-width:7;stroke-linecap:square;vector-effect:non-scaling-stroke; }
.sketch-detail,.sketch-door,.sketch-divider,.sketch-long-side { fill:none;stroke:#6d8da0;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke; }
.sketch-divider { stroke:var(--green);stroke-width:2; }
.sketch-long-side { stroke:var(--terracotta);stroke-width:2; }
.sketch-arrow { fill:none;stroke:var(--terracotta);stroke-width:2.4;stroke-linecap:round;marker-start:url(#arrow-tip);marker-end:url(#arrow-tip);vector-effect:non-scaling-stroke; }
.sketch-product-label { fill:var(--green-dark);font:700 11px "DM Sans",sans-serif;letter-spacing:.07em;text-anchor:middle; }
.sketch-measure { fill:var(--green-dark);font:700 15px "DM Sans",sans-serif; }
.sketch-direction { fill:#647e8f;font:700 10px "DM Sans",sans-serif;letter-spacing:.07em; }
.clearance-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;max-width:720px; }
.clearance-grid.one-column { grid-template-columns:minmax(0,360px); }
.clearance-field > span,.install-mode > span { display:block;font-size:14px;font-weight:600;margin:0 0 7px;color:#59615e; }
.clearance-input { display:flex;align-items:center;background:white;border:1px solid var(--line);border-radius:12px;overflow:hidden; }
.clearance-input input { border:0;outline:0;width:100%;padding:14px;color:var(--ink);background:transparent;font-weight:600;font-size:16px; }
.clearance-input em { font-style:normal;font-size:13px;color:var(--muted);padding-right:14px; }
.install-mode { display:block;max-width:360px;margin:0 0 20px; }
.install-mode select { width:100%;border:1px solid var(--line);border-radius:12px;padding:13px 14px;background:white;color:var(--ink);outline:none;font-size:14px; }
.clearance-note { color:var(--muted);font-size:13px;line-height:1.5;margin:17px 0 0;max-width:720px; }
.geometry-block { margin-bottom:28px;padding-bottom:24px;border-bottom:1px solid var(--line); }
.geometry-block legend { font-size:15px;line-height:1.4;margin-bottom:12px; }
.choice-row { display:flex;flex-wrap:wrap;gap:9px; }
.choice-row label { position:relative;cursor:pointer; }
.choice-row input { position:absolute;opacity:0; }
.choice-row span { display:block;padding:10px 15px;border:1px solid var(--line);border-radius:999px;background:white;color:var(--ink);font-size:14px;transition:.2s ease; }
.choice-row input:checked + span { color:white;background:var(--green);border-color:var(--green);box-shadow:0 6px 16px rgba(0,60,113,.16); }
.detail-columns { display:grid; grid-template-columns:1.1fr .9fr; gap:45px; }
fieldset { border:0; margin:0; padding:0; min-width:0; }
legend { font:600 12px Manrope,sans-serif; margin-bottom:14px; }
.chip-grid { display:flex; flex-wrap:wrap; gap:8px; }
.chip { cursor:pointer; position:relative; }
.chip input { position:absolute; opacity:0; }
.chip span { display:block; border:1px solid var(--line); background:rgba(255,255,255,.68); border-radius:999px; padding:10px 13px; color:#565d5a; font-size:10px; transition:.2s ease; }
.chip input:checked + span { background:var(--green); border-color:var(--green); color:white; }
.select-field { display:block; margin-bottom:13px; }
.select-field select { width:100%; border:1px solid var(--line); border-radius:11px; padding:11px 12px; background:white; color:var(--ink); outline:none; font-size:11px; }
.switch-row { display:flex; align-items:center; gap:10px; padding:11px 0; border-top:1px solid #e6e4de; cursor:pointer; }
.switch-row span { display:grid; gap:3px; margin-right:auto; }
.switch-row b { font-size:10px; font-weight:600; }
.switch-row small { font-size:9px; color:var(--muted); }
.switch-row input { position:absolute; opacity:0; }
.switch-row i { width:34px; height:19px; border-radius:99px; background:#d5d7d3; position:relative; transition:.2s; flex:0 0 auto; }
.switch-row i::after { content:""; position:absolute; width:13px; height:13px; background:white; border-radius:50%; left:3px; top:3px; box-shadow:0 1px 4px rgba(0,0,0,.2); transition:.2s; }
.switch-row input:checked + i { background:var(--green); }
.switch-row input:checked + i::after { transform:translateX(15px); }
.wizard-footer { margin-top:auto; border-top:1px solid #e6e4de; padding:18px 54px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; }
.text-button, .outline-button { border:0; background:transparent; color:var(--muted); cursor:pointer; font-size:11px; }
.text-button { justify-self:start; }
.hidden { visibility:hidden; }
.footer-status { display:flex; align-items:center; gap:8px; color:var(--muted); }
.footer-status > span { display:grid; place-items:center; width:22px; height:22px; border-radius:50%; background:#ece9e2; color:var(--green-dark); font-size:9px; font-weight:700; }
.footer-status small { font-size:9px; }
.primary-button { justify-self:end; border:0; background:linear-gradient(135deg,var(--green),#075993); color:white; border-radius:999px; padding:11px 15px 11px 19px; cursor:pointer; font-size:11px; font-weight:600; display:flex; align-items:center; gap:13px; box-shadow:0 7px 20px rgba(0,60,113,.22); transition:.2s ease; }
.primary-button:hover { transform:translateY(-1px); background:var(--green-dark); }
.primary-button span { width:23px; height:23px; border-radius:50%; background:rgba(255,255,255,.15); display:grid; place-items:center; }
.results-section { display:none; padding:80px 0 20px; }
.results-section.visible { display:block; animation:appear .45s ease; }
.results-heading { display:flex; align-items:end; justify-content:space-between; gap:30px; }
.results-heading h2 { font:600 clamp(30px,4vw,46px)/1.1 Manrope,sans-serif; letter-spacing:-.045em; margin:0; }
.outline-button { border:1px solid #c9c9c2; border-radius:999px; padding:10px 16px; color:var(--ink); }
.summary-strip { margin:27px 0 20px; display:flex; gap:8px; flex-wrap:wrap; }
.summary-strip span { border-radius:999px; background:rgba(255,255,255,.7); border:1px solid rgba(255,255,255,.95); box-shadow:0 5px 20px rgba(0,60,113,.05); padding:8px 11px; color:#5f7180; font-size:10px; }
.summary-strip b { color:var(--green-dark); }
.result-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.availability-group-title { grid-column:1/-1; margin:14px 0 0; color:var(--green-dark); font-size:12px; letter-spacing:.12em; }
.availability-label { display:grid; gap:4px; margin-top:10px; color:var(--green-dark); font-size:11px; line-height:1.4; }
.availability-label small { color:var(--muted); font-size:10px; font-weight:400; }
.result-card { background:rgba(255,255,255,.84); border:1px solid rgba(255,255,255,.98); border-radius:22px; padding:23px; min-height:390px; display:flex; flex-direction:column; box-shadow:0 15px 45px rgba(0,60,113,.08); position:relative; overflow:hidden; }
.result-card::before { content:""; position:absolute; width:120px; height:120px; border-radius:50%; background:radial-gradient(circle,rgba(0,155,223,.12),transparent 70%); right:-25px; top:-30px; }
.match-row { display:flex; justify-content:space-between; align-items:center; position:relative; }
.match-badge { font-size:8px; letter-spacing:.1em; text-transform:uppercase; font-weight:700; padding:6px 8px; border-radius:999px; background:#e4f5fc; color:var(--green); }
.match-badge.close { background:#eaf1f6; color:#476b81; }
.match-score { color:#868c88; font-size:9px; }
.result-card h3 { font:600 20px/1.2 Manrope,sans-serif; letter-spacing:-.025em; margin:18px 0 4px; position:relative; }
.result-type { color:var(--terracotta); font-size:9px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.dimension-line { display:flex; align-items:center; gap:9px; margin:18px 0; padding:11px 0; border-top:1px solid #e8e6e0; border-bottom:1px solid #e8e6e0; font-size:11px; font-weight:600; }
.dimension-line span { color:var(--green); font-size:15px; }
.features { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:16px; }
.features span { background:#f0efe9; color:#5f6663; border-radius:7px; padding:6px 7px; font-size:8px; }
.power { display:flex; gap:9px; align-items:flex-start; color:#5d6461; font-size:9px; line-height:1.45; margin-top:auto; }
.power b { color:var(--ink); }
.power-icon { width:19px; height:19px; border:1px solid #bfc7c2; border-radius:50%; display:grid; place-items:center; color:var(--green); flex:0 0 auto; font-size:10px; }
.warnings { margin:12px 0 0; padding:0; list-style:none; display:grid; gap:5px; }
.warnings li { font-size:8px; line-height:1.4; color:#476b81; padding-left:12px; position:relative; }
.warnings li::before { content:"•"; position:absolute; left:2px; }
.store-link { margin-top:20px; color:white; text-decoration:none; background:var(--ink); border-radius:12px; padding:12px 14px; font-size:10px; font-weight:600; display:flex; justify-content:space-between; align-items:center; transition:.2s ease; }
.store-link:hover { background:var(--green); transform:translateY(-1px); }
.store-link small { color:rgba(255,255,255,.58); font-size:8px; font-weight:400; }
.no-results { text-align:center; background:rgba(255,255,255,.65); border:1px solid rgba(255,255,255,.9); padding:50px 20px; border-radius:22px; }
.no-results > span { display:grid; place-items:center; width:42px; height:42px; border-radius:50%; background:#e5f5fb; color:var(--terracotta); margin:0 auto; }
.no-results h3 { font:600 21px Manrope,sans-serif; margin:15px 0 6px; }
.no-results p { color:var(--muted); font-size:11px; margin:0 auto 18px; max-width:440px; }
.no-results a { color:var(--green); font-size:11px; font-weight:700; }
.results-footnote { border-top:1px solid #dcdad3; margin-top:28px; padding-top:17px; display:grid; grid-template-columns:80px 1fr; gap:10px; }
.results-footnote span { color:var(--terracotta); text-transform:uppercase; letter-spacing:.1em; font-size:8px; font-weight:700; }
.results-footnote p { color:var(--muted); font-size:9px; line-height:1.6; margin:0; max-width:900px; }
footer { max-width:1320px; margin:0 auto; border-top:1px solid #dedbd3; padding:25px 34px 36px; display:flex; justify-content:space-between; color:#818783; font-size:9px; }
footer span { letter-spacing:.16em; font-weight:700; color:var(--ink); }
footer p { margin:0; }
@media (max-width: 950px) {
  .hero { grid-template-columns:1fr; gap:30px; padding-top:35px; }
  .market-card { max-width:520px; }
  .finder-shell { grid-template-columns:1fr; }
  .progress-rail { flex-direction:row; padding:17px 24px; align-items:center; }
  .progress-track,.rail-step div,.rail-note { display:none; }
  .rail-step { width:auto; padding:0; }
  .rail-step > span { width:31px; height:31px; }
  .panel { padding:36px 34px 24px; }
  .wizard-footer { padding-left:34px; padding-right:34px; }
  .result-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 680px) {
  .topbar, main { padding-left:18px; padding-right:18px; }
  .topbar { padding-top:20px; }
  .private-pill { font-size:0; padding:10px; }
  .private-pill span { margin:0; }
  .hero { padding:30px 0 35px; }
  .hero h1 { font-size:42px; }
  .product-grid { grid-template-columns:repeat(2,1fr); }
  .panel-head { display:block; }
  .panel-head > p { margin-top:10px; }
  .dimension-visual,.detail-columns { grid-template-columns:1fr; gap:25px; }
  .room-plan { height:230px; }
  .wizard-footer { grid-template-columns:1fr 1fr; }
  .footer-status { display:none; }
  .primary-button { grid-column:2; }
  .result-grid { grid-template-columns:1fr; }
  .results-heading { align-items:start; }
  .results-footnote { grid-template-columns:1fr; }
  footer { padding-left:18px; padding-right:18px; display:block; }
  footer p { margin-top:8px; }
}
@media (max-width: 430px) {
  .brand img { width: 165px; }
  .product-finder-label { display: none; }
  .panel { padding:31px 20px 20px; }
  .product-grid { grid-template-columns:1fr; }
  .product-option { min-height:110px; }
  .wizard-footer { padding:15px 20px; }
  .segment span { display:none; }
}

/* Finder v1 usability and product presentation */
.category-glyph { font: 500 34px/1 Manrope,sans-serif; }
.category-glyph svg { width:44px;height:44px;display:block; }
.product-visual { height: 145px; margin: -23px -23px 20px; padding: 20px; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; background:linear-gradient(140deg,#dcecf4,#f8fbfd); border-bottom:1px solid #e1edf3; }
.product-visual::before,.product-visual::after { content:""; position:absolute; border-radius:50%; border:1px solid rgba(0,155,223,.25); }
.product-visual::before { width:180px;height:180px;right:-55px;top:-90px; }
.product-visual::after { width:110px;height:110px;left:-35px;bottom:-65px; }
.product-visual > span { width:86px;height:86px;border-radius:27px;display:grid;place-items:center;background:rgba(255,255,255,.82);box-shadow:0 18px 45px rgba(0,60,113,.14);font:500 46px/1 Manrope,sans-serif;color:var(--terracotta);z-index:1; }
.product-visual > span svg { width:54px;height:54px;display:block; }
.product-visual > span svg path,.product-visual > span svg circle { fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke; }
.product-visual small { position:absolute;left:19px;bottom:14px;color:rgba(0,60,113,.55);font-size:11px;letter-spacing:.16em;font-weight:700; }
.type-finnish-sauna,.type-infrared-sauna { background:linear-gradient(140deg,#e1edf2,#d7e9f4 55%,#f7fafb); }
.type-bathtub { background:linear-gradient(140deg,#e8f7fc,#d6edf7); }
.match-badge.prep { background:#fff1d8;color:#8a5a00; }.match-badge.verify { background:#eaf1f6;color:#476b81; }
.match-badge.unsuitable { background:#fde8e8;color:#9b3030; }
.why { margin:0 0 14px;padding:11px 12px;border-radius:10px;background:#f1f7fa;color:#4f6878;font-size:12px;line-height:1.5; }
.why b { color:var(--ink);font-size:12px; }.why p { margin:3px 0 0; }
.dimension-line div { display:grid;gap:3px; }.dimension-line small { display:block;color:var(--muted);font-size:11px;font-weight:500; }
.product-option b,.rail-step b { font-size:14px; }.product-option small,.panel-head>p,.dimension-fields label>span,.select-field>span,.chip span,.switch-row b,.primary-button,.text-button,.outline-button { font-size:14px; }
.switch-row small,.field-tip p,.footer-status small,.microcopy { font-size:12px; }.features span,.warnings li,.power,.result-type,.store-link,.store-link small { font-size:12px; }
.result-card { min-height:620px; }.result-grid { align-items:stretch; }
button:focus-visible,input:focus-visible,select:focus-visible,label:has(input:focus-visible) { outline:3px solid rgba(0,155,223,.45);outline-offset:3px; }
@media(max-width:850px){.clearance-layout{grid-template-columns:1fr;gap:24px}.clearance-sketch{max-width:460px;margin:0 auto;width:100%}}
@media(max-width:680px){.hero h1{font-size:38px}.hero-lede{font-size:16px}.market-card{padding:18px}.finder-shell{border-radius:22px}.panel-head h2{font-size:25px}.product-option{min-height:126px}.product-visual{height:165px}.result-card{min-height:0}.wizard-footer{position:sticky;bottom:0;background:rgba(255,255,255,.95);z-index:5}.primary-button{min-height:48px}.text-button{min-height:44px}.segment{min-height:48px}.clearance-grid{grid-template-columns:1fr}.clearance-sketch{padding:9px}.clearance-sketch figcaption{font-size:11px}}

/* Compact home-spa photo and the same line icons used in product selection. */
.hero-visual{height:176px;position:relative;overflow:hidden;border-radius:18px;margin:-18px 0 28px;background:#17334a}
.hero-visual>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 54%}
.hero-visual::after{content:"";position:absolute;inset:32% 0 0;background:linear-gradient(transparent,rgba(0,32,54,.82));pointer-events:none}
.hero-icon-row{position:absolute;z-index:1;bottom:12px;left:18px;right:18px;display:flex;align-items:end;justify-content:space-evenly;gap:12px;color:white}
.hero-icon{display:flex;align-items:center;gap:8px;min-width:0;font-size:12px;font-weight:600;text-shadow:0 1px 4px #163b50}
.hero-icon i{display:block;flex:none;width:32px;height:32px}
.hero-icon svg{display:block;width:100%;height:100%}
.hero-icon svg path,.hero-icon svg circle{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* The existing product-page action remains separate from contact shortcuts. */
.product-contact{margin-top:12px;position:relative}
.product-contact-verify{padding:12px;border:1px solid #c8dfe9;border-radius:12px;background:#f1f8fb}
.product-contact strong,.results-contact strong{display:block;font-size:13px;line-height:1.45;margin-bottom:9px}
.contact-actions{display:flex;flex-wrap:wrap;gap:8px}
.contact-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:8px 11px;border-radius:9px;font-size:12px;font-weight:700;line-height:1.2;text-decoration:none;text-align:center}
.contact-whatsapp{color:white;background:#006b6c}
.contact-email{color:var(--ink);background:white;border:1px solid #b4cfdd}
.contact-actions a:hover{filter:brightness(.93)}
.contact-actions a:focus-visible{outline:3px solid rgba(0,155,223,.45);outline-offset:2px}
.results-contact{margin-top:22px;padding:16px 18px;background:rgba(255,255,255,.8);border:1px solid var(--line);border-radius:15px}
@media(max-width:680px){
 .hero-visual{height:138px;margin:-15px 0 20px;border-radius:14px}
 .hero-icon-row{left:8px;right:8px;bottom:8px;gap:3px}
 .hero-icon{flex-direction:column;gap:2px;font-size:10px;line-height:1.15;text-align:center;flex:1}
 .hero-icon i{width:27px;height:27px}
 .contact-actions a{min-height:44px;flex:1}
}