@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;650;700;750;800&display=swap');
:root{--ink:#172d49;--blue:#315ddd;--muted:#58697c;--line:#dce3ee;--pale:#f0f5ff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f7f9fc;color:var(--ink);font:16px/1.55 Inter,Arial,sans-serif}button,input,select{font:inherit}button,a,summary,input,select{touch-action:manipulation}a{color:inherit;text-decoration:none}button,a,summary{cursor:pointer}button{color:inherit}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #8aa8ff;outline-offset:4px}.topbar{background:#183450;color:#fff;display:flex;justify-content:space-between;padding:12px 5%;font-size:13px}.topbar i{padding:0 12px;font-style:normal}.calc-page header{display:flex;justify-content:space-between;align-items:center;gap:24px;background:white;padding:20px 5%;border-bottom:1px solid var(--line)}.brand img{width:190px;height:62px;object-fit:contain}nav{display:flex;gap:28px;font-size:14px}nav .active{font-weight:700;color:var(--blue)}.visit{font-size:14px;font-weight:600;border:1px solid #b8c7e1;border-radius:9px;padding:12px 18px;background:#fff}.visit span{margin-left:16px}main{max-width:1320px;margin:auto;padding:0 30px}.breadcrumb{padding:23px 0;display:flex;gap:14px;font-size:13px;color:var(--muted)}.hero{display:grid;grid-template-columns:1.4fr 1fr;align-items:center;gap:40px;padding:14px 0 42px}.eyebrow{color:var(--blue);font-size:14px;font-weight:650;letter-spacing:0}.eyebrow>span{display:none}h1{font-size:46px;line-height:1.13;font-weight:750;letter-spacing:-1.8px;margin:14px 0 20px}h1 em{font-style:normal;color:var(--blue)}.hero p{font-size:16px;line-height:1.75;color:var(--muted);margin:0}.hero-notes{display:flex;flex-wrap:wrap;gap:20px;margin-top:23px;color:#365b89;font-size:13px;font-weight:500}.hero-image{height:280px;position:relative;overflow:hidden;border-radius:20px}.hero-image img{width:100%;height:100%;object-fit:cover}.image-label{position:absolute;bottom:18px;left:18px;background:#ffffffed;border-radius:9px;padding:12px 18px;font-size:13px;color:#52647a;line-height:1.7}.image-label strong{font-size:15px;color:var(--ink);font-weight:600}.calculator{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(380px,1fr);gap:28px;align-items:start}.workspace{background:white;border:1px solid var(--line);border-radius:16px;padding:30px}.section-title{display:flex;align-items:center;gap:14px}.step{display:grid;place-items:center;width:40px;height:40px;border-radius:11px;flex-shrink:0;background:#e9efff;color:var(--blue);font-weight:700;font-size:14px}h2{font-size:23px;line-height:1.3;letter-spacing:-.7px;margin:0 0 6px;font-weight:700}.section-title p{font-size:14px;color:var(--muted);margin:0}.live{display:none}.categories{display:grid;grid-template-columns:repeat(2,1fr);gap:13px;margin:25px 0 0}.category{position:relative;display:flex;align-items:center;gap:16px;text-align:left;border:1.5px solid var(--line);border-radius:12px;background:white;min-height:84px;padding:17px 20px;font-size:15px;font-weight:600;transition:.15s}.category svg{stroke:#7489a6;stroke-width:1.5;fill:none;width:40px;height:40px;flex-shrink:0}.category:hover{background:#f6f8ff;border-color:#a5b9f3}.category.selected{border:2px solid var(--blue);background:#edf3ff;color:#244ec4;padding:16.5px 19.5px}.category.selected svg{stroke:var(--blue)}.category.selected:after{content:'✓';position:absolute;right:8px;top:6px;font-size:11px;color:#fff;background:var(--blue);border-radius:50%;width:18px;height:18px;text-align:center;line-height:18px}.second{border-top:1px solid var(--line);margin-top:30px;padding-top:30px;margin-bottom:25px;flex-wrap:wrap}.unit-label{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted);margin-left:auto}.unit-label select{width:104px;height:44px;padding:8px 10px;font-size:14px}.field{display:flex;flex-direction:column;gap:10px;font-size:14px}.field label{font-size:14px;font-weight:600}.field small{font-size:13px;color:var(--muted);line-height:1.6}select,input{width:100%;height:54px;padding:12px 15px;font-size:16px;color:var(--ink);border:1px solid #c6d1e1;background:white;border-radius:9px;outline:none}select:focus,input:focus{border-color:var(--blue);box-shadow:0 0 0 3px #315ddd14}.surface-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:25px 0 14px;font-size:14px;font-weight:600}.text-button{border:0;background:none;color:var(--blue);padding:7px 0;font-size:13px;font-weight:600}.surface{background:#f5f8fe;border:1px solid #dce6f6;padding:12px;border-radius:10px;margin-bottom:10px}.surface-top{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:600;color:#4b6281;margin-bottom:8px}.remove{background:white;border:1px solid #d8dfeb;border-radius:6px;width:30px;height:30px;color:#526987;font-size:20px;line-height:20px;margin-left:10px}.dimensions{display:grid;grid-template-columns:1fr 18px 1fr;gap:8px;align-items:center}.dimensions label{font-size:13px;color:#596c86;display:flex;flex-direction:column;gap:4px}.dimensions>span{font-size:18px;color:#8293aa;align-self:end;padding-bottom:14px}.dimension-result{grid-column:1/-1;font-size:14px;font-weight:650;color:#43699e;text-align:right;margin-top:0}.area-strip{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:20px 0 0;border-radius:10px;background:#eaf1ff;padding:18px;font-size:14px}.area-strip>span>small{display:block;font-size:13px;font-weight:400;color:#526b91;margin-top:4px}.area-strip>strong{font-size:26px;color:#2e5ac7;white-space:nowrap}.area-strip>strong small{font-size:14px;font-weight:500}.options-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:25px 0}.input-suffix{display:flex;align-items:center;border:1px solid #c6d1e1;border-radius:9px;background:white;overflow:hidden;min-height:52px}.input-suffix input{height:50px;border:0;background:transparent;border-radius:0;min-width:0;padding:10px 13px}.input-suffix>span{padding:0 11px;white-space:nowrap;font-size:13px;color:#657992}.install-row{display:flex;justify-content:space-between;align-items:center;gap:14px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:23px 0}.install-row>div{display:flex;gap:13px;align-items:center}.install-row strong{font-weight:600;font-size:14px}.install-row p{font-size:13px;color:var(--muted);margin:4px 0 0}.switch{position:relative;width:42px;height:24px;flex-shrink:0}.switch input{position:absolute;opacity:0;width:42px;height:24px;margin:0;cursor:pointer}.switch span{display:block;width:42px;height:24px;border-radius:20px;background:#acb9ca;pointer-events:none}.switch span:after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;background:white;border-radius:50%;transition:.2s}.switch input:checked+span{background:var(--blue)}.switch input:checked+span:after{transform:translateX(18px)}.switch input:focus-visible+span{outline:3px solid #8aa8ff;outline-offset:3px}.install-price{width:154px;flex-shrink:0}.install-price input{width:60px;padding:10px 4px}.install-price>span{padding:0 8px}.additional{padding-top:22px}.additional summary{font-size:14px;font-weight:600;display:flex;justify-content:space-between;list-style:none;cursor:pointer}.scope-note{font-size:13px;line-height:1.7;color:#61748d;background:#f5f7fb;border-radius:8px;padding:15px;margin:20px 0 0}.reset-row{display:flex;justify-content:space-between;align-items:center;gap:20px;color:#65768c;font-size:13px;margin-top:18px}.estimate{border:0;border-radius:16px;background:var(--blue);padding:30px;color:white}.estimate-top{display:flex;justify-content:space-between;align-items:center;color:#dbe5ff;font-size:14px;margin-bottom:18px}.estimate-icon{font-size:24px}.estimate h2{font-size:28px;letter-spacing:-.9px;font-weight:650}.estimate-caption{color:#dce6ff;font-size:14px;line-height:1.6;margin:10px 0 23px}.project-tag{border-top:1px solid #ffffff35;border-bottom:1px solid #ffffff35;padding:18px 0;display:flex;flex-direction:column;gap:6px;font-size:16px;font-weight:600}.project-tag span:last-child{font-size:14px;color:#dee8ff;font-weight:400}.total-label{font-size:15px;color:#e1e9ff;margin-top:25px}.total{font-size:52px;line-height:1.25;letter-spacing:-2px;font-weight:700;margin:8px 0}.rate-note{font-size:13px;color:#e0e8ff;line-height:1.6}.breakdown{border-top:1px solid #ffffff35;margin-top:24px;padding-top:12px}.breakdown>div{display:flex;justify-content:space-between;gap:15px;font-size:14px;line-height:1.55;padding:11px 0;color:#e5edff}.breakdown strong{color:white;font-size:15px;font-weight:600;white-space:nowrap}.breakdown small{font-size:13px;display:block}.breakdown .grand{border-top:1px solid #ffffff35;margin-top:8px;padding:19px 0;font-size:15px;font-weight:600}.breakdown .grand strong{font-size:18px}.primary{display:flex;justify-content:space-between;align-items:center;gap:12px;border-radius:9px;background:white;color:#264fc0;font-size:14px;line-height:1.5;font-weight:650;padding:17px 18px;margin-top:8px}.primary:hover{background:#eaf0ff}.primary span{font-size:20px;font-family:Arial,sans-serif}.download{width:100%;border:1px solid #ffffff70;border-radius:9px;background:transparent;color:white;font-size:14px;padding:14px 12px;margin-top:13px;font-weight:500}.download:hover{background:#ffffff12}.estimate-fine{color:#e1eaff;font-size:13px;line-height:1.7;margin-top:21px}.help-card{display:flex;gap:16px;background:white;border:1px solid var(--line);border-radius:14px;margin-top:20px;padding:24px}.help-icon{display:grid;place-items:center;background:#eaf1ff;color:var(--blue);font-size:28px;width:45px;height:45px;border-radius:12px;flex-shrink:0}.help-card h3{font-size:17px;margin:0 0 8px;letter-spacing:-.3px}.help-card p{font-size:14px;line-height:1.7;margin:0;color:var(--muted)}.help-card a{display:flex;justify-content:space-between;gap:15px;color:var(--blue);font-size:14px;font-weight:600;margin-top:14px}.how{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:28px;padding:38px 0;margin-top:42px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.how .eyebrow{font-size:13px;color:#5d7493;font-weight:500}.how h2{font-size:26px;margin-top:12px}.how article>span{font-size:14px;font-weight:600;color:var(--blue)}.how h3{font-size:16px;margin:14px 0 10px}.how p{font-size:14px;line-height:1.7;color:var(--muted);margin:0}.faq{display:grid;grid-template-columns:1fr 1.8fr;gap:40px;padding:40px 0 60px}.faq h2{font-size:26px}.faq details{border-bottom:1px solid var(--line);padding:20px 0}.faq details:first-child{padding-top:0}.faq summary{display:flex;justify-content:space-between;list-style:none;font-size:16px;font-weight:500;gap:20px}.faq summary:after{content:'+';color:var(--blue);font-size:20px;line-height:1.3}.faq details[open] summary:after{content:'−'}.faq p{font-size:14px;line-height:1.8;color:var(--muted);margin:15px 0 0}footer{display:flex;justify-content:space-between;gap:25px;align-items:center;padding:28px 5%;border-top:1px solid var(--line);background:white;font-size:13px;color:var(--muted)}footer>a{font-size:16px;letter-spacing:1px;color:var(--ink)}button:disabled{opacity:.5;cursor:default}@media(max-width:1100px){nav{gap:18px}.hero{gap:25px}.hero h1{font-size:40px}.hero p br{display:none}.hero p{font-size:15px}.hero-notes{gap:13px}.calculator{grid-template-columns:minmax(0,1.45fr) minmax(350px,1fr);gap:20px}.workspace,.estimate{padding:24px}.section-title h2{font-size:21px}.category{padding:16px 14px;gap:10px;font-size:14px}.category.selected{padding:15.5px 13.5px}.category svg{width:34px;height:34px}.install-row{align-items:flex-start;flex-direction:column}.install-price{margin-left:55px}.how{grid-template-columns:1fr 1fr;gap:30px}.input-suffix>span{padding:0 8px}}@media(max-width:800px){.topbar{justify-content:center;font-size:13px;padding:10px 18px}.topbar>span:first-child{display:none}.topbar i{padding:0 7px}.calc-page header{padding:15px 20px;gap:15px}.brand img{width:155px;height:52px}nav{display:none}.visit{font-size:13px;padding:10px 12px}.visit span{margin-left:6px}main{padding:0 20px}.breadcrumb{padding:20px 0;font-size:13px}.hero{grid-template-columns:1fr;padding:4px 0 30px;gap:22px}.hero h1{font-size:38px;letter-spacing:-1.4px}.hero p{font-size:15px}.hero p br{display:none}.hero-notes{font-size:13px;gap:12px}.hero-image{height:205px;border-radius:14px}.image-label{font-size:13px;padding:10px 14px;bottom:13px;left:13px}.image-label strong{font-size:14px}.calculator{grid-template-columns:1fr;gap:23px}.workspace{padding:24px}.section-title h2{font-size:22px}.section-title p{font-size:14px}.second{gap:12px}.unit-label{margin-left:54px}.categories{gap:10px}.category{font-size:14px;padding:17px 12px;min-height:84px;gap:10px}.category.selected{padding:16.5px 11.5px}.category svg{width:32px;height:32px}.surface-heading{align-items:flex-start;flex-direction:column;gap:3px}.surface{padding:16px}.dimensions{gap:10px;grid-template-columns:1fr 14px 1fr}.dimensions input{font-size:16px;padding:12px}.area-strip{padding:16px;gap:10px}.area-strip>strong{font-size:24px}.area-strip>span>small{font-size:13px}.options-grid{gap:18px;grid-template-columns:1fr}.install-row{flex-direction:column;align-items:flex-start}.install-price{margin-left:55px;width:165px}.reset-row{align-items:flex-start;gap:14px;font-size:13px}.reset-row .text-button{white-space:nowrap}.estimate{padding:27px}.estimate h2{font-size:28px}.total{font-size:52px}.estimate-caption,.estimate-fine,.rate-note{font-size:14px}.breakdown>div{font-size:14px}.help-card{padding:22px}.how{grid-template-columns:1fr;gap:26px;margin-top:30px;padding:30px 0}.how h2{font-size:26px}.how article{position:relative;padding-left:40px}.how article>span{position:absolute;left:0;top:1px}.how h3{margin:0 0 8px}.faq{grid-template-columns:1fr;gap:25px;padding:30px 0 40px}.faq h2{font-size:26px}.faq summary{font-size:15px}footer{padding:25px 20px;flex-direction:column;align-items:flex-start;gap:13px;font-size:13px}}@media(max-width:380px){main{padding:0 14px}.workspace{padding:19px}.hero h1{font-size:34px}.category{gap:7px;font-size:13px}.category svg{width:28px}.estimate{padding:23px}.visit{font-size:13px}.brand img{width:130px}.area-strip{flex-direction:column;align-items:flex-start}.breakdown>div{gap:8px}}@media print{.topbar,.calc-page header,.hero,.breadcrumb,.workspace,.help-card,.how,.faq,footer,.primary,.download{display:none}.calculator{display:block}.estimate{background:white;color:#172d49;max-width:650px}.estimate *{color:#172d49!important}}
/* Calculator-first layout: inputs and totals before marketing */
.calc-page header{padding-top:12px;padding-bottom:12px}.brand img{height:52px}main{max-width:1380px}.breadcrumb{display:none}.calculator-heading{display:flex;justify-content:space-between;gap:24px;align-items:center;padding:28px 0}.calculator-heading h1 {
    font-size: 28px;
    letter-spacing: -1px;
    margin: 0 0 7px;
    line-height: 1.2;
}.calculator-heading p{font-size:15px;color:var(--muted);margin:0}.currency-badge{font-size:14px;font-weight:600;color:#4b6390;border:1px solid #d2ddec;background:#fff;border-radius:8px;padding:10px 16px;white-space:nowrap}.calculator{grid-template-columns:minmax(0,1.65fr) minmax(380px,1fr);gap:24px;margin-bottom:32px}.workspace{padding:25px}.section-title h2{font-size:20px;margin:0}.categories{grid-template-columns:repeat(4,1fr);gap:10px;margin-top:17px}.category{flex-direction:column;justify-content:center;gap:7px;text-align:center;padding:14px 6px;min-height:100px;font-size:14px}.category.selected{padding:13.5px 5.5px}.category svg{height:30px;width:30px}.second{margin-top:24px;padding-top:22px;margin-bottom:20px;justify-content:space-between;gap:12px}.second p{margin-top:6px}.unit-label{margin-left:0}.field{gap:8px}.surface-heading{margin:19px 0 10px}.surface{padding:14px 17px}.surface-top{margin-bottom:10px}.dimensions{grid-template-columns:1fr 18px 1fr 90px}.dimension-result{grid-column:auto;text-align:right;align-self:end;height:54px;display:flex;align-items:center;justify-content:flex-end;white-space:nowrap}.area-strip{margin-top:14px;padding:13px 16px}.area-strip>span>small{display:none}.options-grid{padding:20px 0}.estimate{background:white;border:1px solid #ccd9ee;color:var(--ink);padding:25px;position:sticky;top:20px}.estimate h2{font-size:22px;color:var(--ink);margin-bottom:18px}.project-tag{color:var(--ink);border-color:var(--line);font-size:16px;padding:15px 0}.project-tag span:last-child{color:var(--muted);font-size:14px}.total-label{color:#526c92;margin-top:21px;font-size:15px}.total{background:#edf3ff;border-radius:10px;color:#254fc5;font-size:46px;margin:10px 0 7px;padding:15px 18px;line-height:1.15;letter-spacing:-1.5px}.rate-note{color:#677c98;font-size:13px}.breakdown{border-color:var(--line);margin-top:21px;padding-top:10px}.breakdown>div{color:#536a87;padding:10px 0;font-size:14px}.breakdown strong{color:var(--ink);font-size:15px}.breakdown .grand{border-color:var(--line);color:var(--ink)}.breakdown .grand strong{color:#2854c9}.primary{background:var(--blue);color:white;font-size:14px;padding:16px}.primary:hover{background:#254ec3}.download{border-color:#c7d3e9;color:#365cae;background:#f6f8fe}.download:hover{background:#e9f0ff}.estimate-fine{color:#657790;font-size:13px;border-top:1px solid var(--line);padding-top:17px;margin-top:19px}.scope-note{font-size:13px}.install-row{padding:20px 0}footer{font-size:13px}footer>span:nth-child(2){display:none}.reset-row{margin-top:15px}@media(max-width:1100px){.calculator{grid-template-columns:minmax(0,1.45fr) minmax(340px,1fr)}.workspace,.estimate{padding:21px}.category{font-size:14px}.dimensions{grid-template-columns:1fr 15px 1fr}.dimension-result{grid-column:1/-1;height:auto}.second h2{font-size:19px}.install-row{flex-direction:column}.install-price{margin-left:55px}}@media(max-width:800px){.calc-page header{padding:12px 20px}.calculator-heading{padding:24px 0;align-items:flex-start}.calculator-heading h1 {
    font-size: 28px;
    letter-spacing: -1px;
    margin: 0 0 7px;
    line-height: 1.2;
}.calculator-heading p{font-size:14px}.currency-badge{display:none}.calculator{grid-template-columns:1fr;gap:20px}.workspace{padding:21px}.categories{grid-template-columns:repeat(2,1fr);gap:10px}.category{flex-direction:row;text-align:left;justify-content:flex-start;min-height:70px;gap:12px;padding:13px}.category.selected{padding:12.5px}.second{margin-top:22px;padding-top:22px}.section-title h2{font-size:20px}.unit-label{margin-left:0}.dimensions{grid-template-columns:1fr 16px 1fr}.dimension-result{grid-column:1/-1}.surface-heading{flex-direction:row;align-items:center;flex-wrap:wrap}.area-strip{flex-direction:row}.area-strip>span{font-size:14px}.area-strip strong{font-size:23px}.options-grid{grid-template-columns:1fr 1fr;gap:15px}.estimate{position:static;padding:25px}.total{font-size:44px}.estimate h2{font-size:23px}.scope-note{font-size:13px}.reset-row>span{font-size:13px}}@media(max-width:420px){.options-grid{grid-template-columns:1fr}.surface-heading{flex-direction:column;align-items:flex-start}.category{font-size:14px;gap:9px}.category svg{width:27px}.area-strip{align-items:flex-start;flex-direction:column}.calculator-heading h1 {
    font-size: 28px;
    letter-spacing: -1px;
    margin: 0 0 7px;
    line-height: 1.2;
}.workspace{padding:18px}.dimensions{gap:8px}.dimension-result{font-size:14px}.unit-label{width:100%;justify-content:flex-start}.second{gap:14px}.total{font-size:41px}}

.section-title h2 {
    font-size: 16px !important;
}

.estimate h2 {
    font-size: 20px !important;
}

.unit-label {
    display: none !important;
}

.field {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
}
.field label {
    flex-shrink: 0 !important;
    margin-bottom: 0 !important;
    white-space: nowrap !important;
}
.field select {
    flex: 1 !important;
}

#calculator .field {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 12px !important;
}
#calculator .field > label {
    display: inline !important;
    margin: 0 !important;
    white-space: nowrap !important;
    min-width: auto !important;
}
#calculator .field select {
    flex: 1 !important;
    margin: 0 !important;
}

#calculator .field select {
    flex: 0 1 auto !important;
    max-width: 280px !important;
    padding: 8px 12px !important;
    height: auto !important;
    font-size: 14px !important;
}

.surface-top {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}
.surface-top input[type="checkbox"] {
    width: 14px !important;
    height: 14px !important;
    cursor: pointer !important;
}

.surface input[type="number"] {
    height: 36px !important;
    font-size: 14px !important;
    padding: 6px 10px !important;
}
.surface label {
    font-size: 12px !important;
}

.total-area {
    display: none !important;
}

.baskets-section {
    opacity: 1 !important;
}
.baskets-section input[type="checkbox"] {
    width: 18px !important;
    height: 18px !important;
    cursor: pointer !important;
    accent-color: #3bb77e !important;
}
.baskets-section label {
    color: #333 !important;
    font-size: 14px !important;
    cursor: pointer !important;
}
.basket-options {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 12px !important;
    padding: 12px 0 !important;
}

.baskets-section {
    opacity: 1 !important;
    background: #fff !important;
}
.baskets-section .basket-options {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
    padding: 12px 0 !important;
}
.baskets-section .basket-options label {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    cursor: pointer !important;
    padding: 8px 12px !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 6px !important;
    background: #fff !important;
    font-size: 13px !important;
    color: #333 !important;
}
.baskets-section .basket-options label:hover {
    border-color: #3bb77e !important;
    background: #f8fff8 !important;
}
.baskets-section .basket-options input[type="checkbox"] {
    width: 16px !important;
    height: 16px !important;
    cursor: pointer !important;
    accent-color: #3bb77e !important;
}
.baskets-section .basket-options label:has(input:checked) {
    border-color: #3bb77e !important;
    background: #f0fff4 !important;
}

.baskets-section,
.baskets-section * {
    opacity: 1 !important;
    pointer-events: auto !important;
}
.baskets-section input[type="checkbox"] {
    opacity: 1 !important;
    pointer-events: auto !important;
    cursor: pointer !important;
}
.baskets-section label {
    opacity: 1 !important;
    color: #333 !important;
    cursor: pointer !important;
}

/* Blend surface into parent box */
.pricing-breakdown { margin-top: 0; }

/* Remove inner surface box when inside wrapper */
#surfaces .surface { background: #f5f8fe !important; border: 1px solid #dce6f6 !important; padding: 16px !important; margin-bottom: 12px !important; border-radius: 12px !important; }
#surfaces .surface[style*="background"] { background: #f0faf4 !important; border: 1px solid #a7f3d0 !important; }

#surfaces .wall-box { background: #f0faf4 !important; border: 1px solid #a7f3d0 !important; }

/* Wall Panels Green Theme */
#surfaces .wall-box { background: #f0faf4 !important; border: 1px solid #a7f3d0 !important; }
.wall-box .surface-top { color: #0d5c2a !important; }
.wall-box .price-separator { border-top-color: #a7f3d0 !important; color: #0d5c2a !important; }
.wall-box button[data-save] { background: #128a3e !important; }
.wall-box button[data-save]:hover { background: #0f7334 !important; }
#add { background: #128a3e !important; border-color: #128a3e !important; color: #fff !important; }
#add:hover { background: #0f7334 !important; }
.wall-box input[type="number"] { border-color: #a7f3d0 !important; }
.wall-box input[type="number"]:focus { border-color: #128a3e !important; outline-color: #128a3e !important; }
.wall-box .dimension-result { color: #0d5c2a !important; }

/* Wall Panels - Product card green */
.product.selected { border-color: #128a3e !important; }
.product.selected .check { background: #128a3e !important; }

/* Wall Panels - Buttons green */
.primary-button { background: #128a3e !important; border-color: #128a3e !important; }
.primary-button:hover { background: #0f7334 !important; }
.secondary-button { border-color: #a7f3d0 !important; color: #0d5c2a !important; }
.secondary-button:hover { background: #f0faf4 !important; }

/* Wall Panels - Estimated price green */
.total { background: #f0faf4 !important; }
.total strong { color: #128a3e !important; }

/* Wall Panels - Product card green */
.category.selected { border-color: #128a3e !important; }
.category.selected .check, .category.selected::after { background: #128a3e !important; }

/* Wall Panels - Buttons green */
a.primary { background: #128a3e !important; border-color: #128a3e !important; }
a.primary:hover { background: #0f7334 !important; }
button.download { border-color: #a7f3d0 !important; color: #0d5c2a !important; }
button.download:hover { background: #f0faf4 !important; }

/* Wall Panels - Estimated price green */
.estimate { background: #f0faf4 !important; border-color: #a7f3d0 !important; }
.total { color: #128a3e !important; }

#add { background: transparent !important; border: none !important; color: #128a3e !important; padding: 0 !important; font-weight: 500 !important; text-decoration: none !important; }
#add:hover { background: transparent !important; color: #0f7334 !important; text-decoration: underline !important; }

#summary-category, #summary-material, .summary-row:has(#summary-category) { display: none !important; }

.area-strip { display: none !important; }

.dimensions { display: flex !important; flex-wrap: nowrap !important; align-items: center !important; gap: 8px !important; }
.dimensions label { display: flex !important; flex-direction: column !important; font-size: 12px !important; }
.dimensions input { width: 70px !important; padding: 6px 8px !important; }
.dimensions .times, .dimensions span { font-size: 14px !important; }
.dimension-result { font-size: 14px !important; font-weight: 600 !important; margin-left: auto !important; }

.dimensions { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; gap: 6px !important; }
.dimensions label { display: inline-flex !important; flex-direction: row !important; align-items: center !important; gap: 4px !important; font-size: 13px !important; white-space: nowrap !important; }
.dimensions input { width: 60px !important; padding: 5px 6px !important; }
.dimensions span { margin: 0 4px !important; }

.dimensions input { height: 28px !important; padding: 2px 6px !important; font-size: 13px !important; }

.wall-box .dimensions input, .surface .dimensions input { height: 28px !important; padding: 2px 6px !important; }

.surface input[type="checkbox"] {
  accent-color: #1caf51;
  width: 14px;
  height: 14px;
  margin-right: 6px;
}

/* Compact Wall Box */
#surfaces .wall-box,
.wall-box.surface {
  padding: 10px 12px !important;
  margin-bottom: 8px !important;
}
.wall-box .surface-top {
  margin-bottom: 4px !important;
  font-size: 13px !important;
}
.wall-box .dimensions {
  gap: 6px !important;
  margin-bottom: 4px !important;
}
.wall-box .dimensions label {
  font-size: 11px !important;
  gap: 4px !important;
  flex-direction: row !important;
  align-items: center !important;
}
.wall-box .dimensions input {
  height: 26px !important;
  padding: 2px 6px !important;
  font-size: 13px !important;
}
.wall-box .dimension-result {
  font-size: 13px !important;
  margin-top: 2px !important;
}
.wall-box .price-separator {
  margin: 4px 0 2px !important;
  padding-top: 3px !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
}
.wall-box button[data-save] {
  bottom: 8px !important;
  right: 10px !important;
  padding: 3px 10px !important;
  font-size: 11px !important;
}

/* Fix dimensions alignment */
.wall-box .dimensions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: nowrap !important;
}
.wall-box .dimensions label {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 12px !important;
}
#surfaces .wall-box .dimensions > span,
.wall-box .dimensions > span {
  align-self: center !important;
  padding: 0 !important;
  font-size: 16px !important;
  line-height: 1 !important;
  transform: translateY(-2px) !important;
}

/* Compact Price Breakdown */
.estimate {
  padding: 16px 18px !important;
}
.estimate-top {
  margin-bottom: 10px !important;
}
.total-label {
  margin-top: 12px !important;
  font-size: 13px !important;
}
.total {
  font-size: 36px !important;
  margin: 4px 0 !important;
  line-height: 1.1 !important;
}
.rate-note {
  font-size: 12px !important;
  margin-top: 4px !important;
}
.breakdown {
  margin-top: 12px !important;
  padding-top: 8px !important;
}
.breakdown > div {
  padding: 6px 0 !important;
  font-size: 13px !important;
}
.primary {
  padding: 12px 16px !important;
  margin-top: 10px !important;
  font-size: 14px !important;
}
.download {
  padding: 10px 12px !important;
  margin-top: 8px !important;
  font-size: 13px !important;
}
.estimate-fine {
  margin-top: 12px !important;
  font-size: 11px !important;
  line-height: 1.5 !important;
}

/* Tighter Measurements section */
.section-title.second {
  margin-top: 12px !important;
  padding-top: 12px !important;
  margin-bottom: 10px !important;
  gap: 4px !important;
}
.section-title.second h2 {
  margin-bottom: 2px !important;
}
.section-title.second p {
  margin: 0 !important;
  font-size: 13px !important;
}

/* Compact Measurements Section */
.section-title.second {
  padding-top: 6px !important;
  margin-top: 6px !important;
  margin-bottom: 6px !important;
}
.section-title.second h2 {
  margin-bottom: 0 !important;
}
.section-title.second p {
  margin: 0 !important;
  line-height: 1.3 !important;
}
.workspace .field {
  margin-top: 4px !important;
  margin-bottom: 6px !important;
}

/* Compact Baskets */
.baskets-section {
  padding: 10px 12px !important;
}
.baskets-section .surface-top {
  margin-bottom: 6px !important;
  font-size: 13px !important;
}
.basket-options {
  gap: 5px !important;
  padding: 2px 0 !important;
}
.baskets-section .basket-options label,
.basket-options label {
  padding: 2px 5px !important;
  font-size: 11px !important;
  gap: 3px !important;
  border-radius: 4px !important;
}
.basket-options input[type="checkbox"],
.baskets-section input[type="checkbox"] {
  width: 12px !important;
  height: 12px !important;
}

.basket-options {
  gap: 4px !important;
  padding: 2px 0 !important;
}
.baskets-section {
  padding: 8px 10px !important;
}

/* Smaller checkbox override */
.baskets-section .basket-options input[type="checkbox"],
.baskets-section .basket-options label input[type="checkbox"] {
  width: 12px !important;
  height: 12px !important;
  min-width: 12px !important;
  min-height: 12px !important;
}

.basket-options input[type="checkbox"],
.baskets-section input[type="checkbox"] {
  width: 10px !important;
  height: 10px !important;
  min-width: 10px !important;
  min-height: 10px !important;
}



/* Reduce Baskets Box Height Only */
.baskets-section {
  padding: 8px 12px !important;
}
.baskets-section .surface-top {
  margin-bottom: 4px !important;
}
.basket-options {
  gap: 5px !important;
  padding: 2px 0 !important;
}

.baskets-section .basket-options {
  gap: 5px !important;
}

.baskets-section .basket-options label,
.basket-options label {
  gap: 2px !important;
}

.baskets-section .basket-options input[type="checkbox"] {
  width: 10px !important;
  height: 10px !important;
  min-width: 10px !important;
  min-height: 10px !important;
}

.baskets-section .basket-options label input[type="checkbox"].basket-cb {
  width: 10px !important;
  height: 10px !important;
  min-width: 10px !important;
  min-height: 10px !important;
}

/* Hide checkboxes - make boxes directly clickable */
.baskets-section .basket-options input[type="checkbox"],
.basket-options input[type="checkbox"] {
  position: absolute !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  pointer-events: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.baskets-section .basket-options label,
.basket-options label {
  cursor: pointer !important;
  padding-left: 8px !important;
}

/* Style for selected state without checkbox */
.baskets-section .basket-options label:has(input:checked),
.basket-options label:has(input:checked) {
  background: #e8f5e9 !important;
  border-color: #4caf50 !important;
}

.baskets-section {
  padding: 4px 8px !important;
}
.baskets-section .surface-top {
  margin-bottom: 2px !important;
  padding: 0 !important;
}
.basket-options {
  padding: 2px 0 !important;
}

#surfaces .baskets-section.surface,
.baskets-section.surface {
  padding: 4px 8px !important;
}

/* Whole Baskets Box */
#surfaces .baskets-section.surface,
.baskets-section.surface {
  background: #fff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.03) !important;
}

#surfaces .baskets-section .surface-top,
.baskets-section .surface-top {
  margin-bottom: 8px !important;
  padding-bottom: 6px !important;
  border-bottom: 1px solid #f3f4f6 !important;
}

#surfaces .baskets-section h3,
.baskets-section h3 {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #1f2937 !important;
  letter-spacing: 0.2px !important;
  margin: 0 !important;
}

/* Baskets Section - Whole Box Redesign */
#surfaces .baskets-section,
.baskets-section.surface {
  background: #fff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 10px 12px !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.03) !important;
}

#surfaces .baskets-section .surface-top,
.baskets-section .surface-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 8px !important;
  padding-bottom: 6px !important;
  border-bottom: 1px solid #f3f4f6 !important;
}

#surfaces .baskets-section h3,
.baskets-section h3 {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  margin: 0 !important;
  letter-spacing: -0.01em !important;
}

#surfaces .baskets-section .basket-options,
.baskets-section .basket-options {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  padding: 0 !important;
}

#surfaces .baskets-section .basket-options label,
.baskets-section .basket-options label {
  background: #f9fafb !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 5px !important;
  padding: 3px 8px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  color: #4b5563 !important;
  transition: all 0.15s ease !important;
  box-shadow: none !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}

#surfaces .baskets-section .basket-options label:hover,
.baskets-section .basket-options label:hover {
  background: #f3f4f6 !important;
  border-color: #d1d5db !important;
  color: #374151 !important;
  transform: none !important;
}

#surfaces .baskets-section .basket-options label:has(input:checked),
.baskets-section .basket-options label:has(input:checked) {
  background: #ecfdf5 !important;
  border-color: #10b981 !important;
  color: #065f46 !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}

#surfaces .baskets-section .basket-options,
.baskets-section .basket-options {
  gap: 4px !important;
}

/* Material dropdown - reduced size */
#material,
select#material {
  font-size: 12px !important;
  padding: 4px 10px !important;
  height: auto !important;
  min-height: 28px !important;
}

label[for="material"],
.field:has(#material) label,
.form-row:has(#material) label {
  font-size: 12px !important;
}

#calculator .field select#material,
#calculator #material {
  font-size: 12px !important;
  padding: 4px 10px !important;
  height: auto !important;
  min-height: 28px !important;
}

/* Kitchen surfaces - green theme like wall panels */
#surfaces .surface:not(.baskets-section) {
  background: #f0fdf4 !important;
  border: 1px solid #86efac !important;
  border-radius: 8px !important;
}

#surfaces .surface:not(.baskets-section) .surface-top span {
  color: #166534 !important;
  font-weight: 600 !important;
}

#surfaces .surface:not(.baskets-section) .price-separator {
  border-top-color: #86efac !important;
  color: #166534 !important;
}

#surfaces .surface:not(.baskets-section) input[type="checkbox"]:checked {
  accent-color: #16a34a !important;
}

/* Kitchen surfaces - reduced padding */
#surfaces .surface:not(.baskets-section) {
  padding: 8px 12px !important;
}

#surfaces .surface:not(.baskets-section) .surface-top {
  margin-bottom: 4px !important;
  padding-bottom: 0 !important;
}

#surfaces .surface:not(.baskets-section) .dimensions {
  margin: 4px 0 !important;
}

#surfaces .surface:not(.baskets-section) .price-separator {
  margin: 6px 0 2px !important;
  padding-top: 4px !important;
}

/* Dimensions - same line, smaller inputs */
#surfaces .surface .dimensions {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex-wrap: nowrap !important;
}

#surfaces .surface .dimensions label {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 12px !important;
  white-space: nowrap !important;
}

#surfaces .surface .dimensions input[type="number"] {
  width: 50px !important;
  height: 22px !important;
  padding: 0px 2px !important;
  font-size: 12px !important;
  border-radius: 4px !important;
}

#surfaces .surface .dimensions .times {
  font-size: 12px !important;
  color: #666 !important;
}

#surfaces .surface .dimensions output,
#surfaces .surface .dimensions .dimension-result {
  font-size: 12px !important;
  margin-left: auto !important;
}

/* Force × on same line */
#surfaces .surface .dimensions {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 4px !important;
}

#surfaces .surface .dimensions .times,
#surfaces .surface .dimensions span {
  display: inline !important;
  flex-shrink: 0 !important;
  margin: 0 2px !important;
}

#surfaces .surface .dimensions label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
  flex-shrink: 0 !important;
}

/* Force two-column layout on desktop */
@media (min-width: 801px) {
  .calculator {
    display: grid !important;
    grid-template-columns: minmax(0, 1.6fr) minmax(380px, 1fr) !important;
    gap: 28px !important;
  }
  
  .calculator > aside {
    grid-column: 2 !important;
    grid-row: 1 / span 10 !important;
  }
}

/* Hide reset row for kitchen */
.calculator.kitchen-mode .reset-row,
body:has(#categories .category.selected[data-cat="2"]) .reset-row {
  display: none !important;
}







/* × vertical alignment */
#surfaces .surface .dimensions .times,
#surfaces .surface .dimensions span {
  display: flex !important;
  align-items: center !important;
  height: 22px !important;
  line-height: 22px !important;
  vertical-align: middle !important;
  padding: 0 !important;
  margin: 0 2px !important;
}

/* Kitchen surface box - better spacing */
#surfaces .surface:not(.baskets-section) {
  padding: 12px 14px !important;
  margin-bottom: 10px !important;
}

#surfaces .surface:not(.baskets-section) .surface-top {
  margin-bottom: 10px !important;
  padding-bottom: 6px !important;
  border-bottom: 1px solid #d1fae5 !important;
}

#surfaces .surface:not(.baskets-section) .dimensions {
  margin: 6px 0 !important;
}

#surfaces .surface:not(.baskets-section) .price-separator {
  margin-top: 8px !important;
  padding-top: 6px !important;
}

/* Fix × vertical position */
#surfaces .surface .dimensions .times,
#surfaces .surface .dimensions span {
  transform: translateY(-5px) !important;
}

/* Kitchen surface box padding */
#surfaces .surface:not(.baskets-section) {
  padding: 5px 15px !important;
}

/* Basket options styling */
#surfaces .baskets-section .basket-options label,
.baskets-section .basket-options label {
  background: #f9fafb !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 5px !important;
  padding: 2px 5px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  color: #4b5563 !important;
  transition: all 0.15s ease !important;
  box-shadow: none !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}