
*{box-sizing:border-box}body{line-height:1.55}.qb-wrap{max-width:1240px;margin:auto;padding:60px 32px 90px}.qb-intro{display:grid;grid-template-columns:1.7fr 1fr;gap:70px;margin-bottom:42px}.qb-intro h1{font-size:clamp(38px,5vw,64px);line-height:1.04;letter-spacing:-.035em;margin:12px 0 22px;font-weight:800;max-width:12em}.qb-intro p{max-width:42em}.qb-intro aside{border-left:5px solid #bbd51c;padding:22px;background:#fff;align-self:center}.qb-eyebrow{font-size:12px;font-weight:800;letter-spacing:.15em;color:#5e6e0a;margin:0 0 10px}.qb-muted{color:#595959;font-size:15px;font-weight:400}.qb-steps{display:flex;align-items:center;justify-content:space-between;gap:18px;border-top:1px solid #caccc3;border-bottom:1px solid #caccc3;padding:18px 0}.qb-steps ol{display:flex;gap:28px;margin:0;padding:0;list-style:none}.qb-steps li{font-weight:700;color:#62645c}.qb-steps li[aria-current]{color:#333;text-decoration:underline;text-decoration-color:#92a90e;text-decoration-thickness:4px;text-underline-offset:10px}.qb-panel{background:#fff;border:1px solid #d0d2c8;padding:32px;margin-top:24px}.qb-panel h2,.qb-review-heading h2{font-size:clamp(26px,3vw,36px);line-height:1.15;margin:6px 0 28px;letter-spacing:-.02em}.qb-panel h3{font-size:23px;margin:28px 0 8px}.qb-wrap fieldset{border:0;padding:0;margin:24px 0}.qb-wrap legend{font-weight:700;font-size:18px;margin-bottom:12px}.qb-category{display:flex;gap:12px}.qb-category label{flex:0 1 200px}.qb-category span{padding:16px 25px;font-size:21px;font-weight:700;background:#f4f5f0}.qb-wrap button{font:600 16px inherit;font-family:inherit;font-size:16px;font-weight:600;cursor:pointer;border:1.5px solid #333;background:#fff;color:#333;padding:12px 20px;min-height:48px}.qb-wrap button:hover{background:#eef1e1}.qb-wrap button:disabled{opacity:.5;cursor:not-allowed}.qb-wrap .qb-primary{background:#bbd51c;border-color:#bbd51c;color:#262626}.qb-wrap .qb-primary:hover{background:#c7df42}.qb-wrap .qb-link{border:0;background:transparent;text-decoration:underline;color:#526108;padding:10px 3px}.qb-products{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.qb-card{position:relative;cursor:pointer;margin:0!important}.qb-card input,.qb-category input{position:absolute;opacity:0;width:1px;height:1px}.qb-card>span,.qb-category span{display:flex;flex-direction:column;border:2px solid #d0d2c8;height:100%}.qb-card input:checked+span,.qb-category input:checked+span{border-color:#526108;box-shadow:inset 0 0 0 2px #526108;background:#f3f6e4}.qb-card input:focus-visible+span,.qb-category input:focus-visible+span{outline:3px solid #526108;outline-offset:3px}.qb-card img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;background:#EEF0EA;display:block}.qb-card strong{padding:12px 14px;font-size:18px}.qb-card small{padding:0 14px 12px;font-weight:400;color:#595959}.qb-photo-placeholder{height:135px;background:#e8ebdf;display:grid;place-items:center;font-size:28px;font-weight:700;color:#586443}.qb-configs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.qb-configs .qb-card>span{padding:14px;text-align:center}.qb-configs strong{padding:6px 0;font-size:16px}.qb-configs small{font-size:12px;padding:0}.qb-configs svg{width:100%;height:118px;color:#455253}.qb-configs .qb-manual{grid-column:span 2}.qb-configs .qb-manual-first{grid-column:1 / span 2}.qb-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:20px 0}.qb-two{grid-template-columns:repeat(2,minmax(0,1fr))}.qb-wrap label:not(.qb-card){font-weight:600;display:flex;flex-direction:column;gap:7px}.qb-wrap input:not([type=checkbox]):not([type=radio]),.qb-wrap select,.qb-wrap textarea{font:400 16px/1.4 inherit;font-family:inherit;font-size:16px;color:#333;background:#fff;border:1.5px solid #888;min-height:48px;padding:11px 12px;width:100%;border-radius:0}.qb-wrap textarea{resize:vertical}.qb-wrap input:disabled{background:#eee}.qb-wrap label.qb-check{flex-direction:row;align-items:flex-start;font-weight:400;margin:18px 0;gap:12px}.qb-check input{width:21px;height:21px;flex-shrink:0;accent-color:#5e6e0a;margin-top:2px}.qb-notice{padding:16px 20px;background:#f0f3e3;border-left:4px solid #a3b92a;font-size:15px}.qb-swatch{height:45px;border:1px solid #ccc;display:block}.qb-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:28px}.qb-status:empty{display:none}.qb-status{background:#edf1df;padding:12px 18px;border-left:4px solid #8da319}.qb-review-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:32px}.qb-review-heading h2{margin-bottom:0}.qb-review-item{background:#fff;border:1px solid #d0d2c8;padding:26px;margin-top:16px;display:grid;grid-template-columns:150px 1fr;gap:28px;overflow-wrap:anywhere}.qb-review-item h3{margin:0 0 8px;font-size:23px}.qb-review-item svg{width:140px;height:140px}.qb-review-item .qb-item-image{width:140px;height:140px;object-fit:cover}.qb-review-item dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 24px;margin:18px 0}.qb-review-item dt{font-size:13px;color:#595959}.qb-review-item dd{margin:0;font-size:15px}.qb-review-item .qb-qty{max-width:110px}.qb-review-item .qb-actions{margin-top:16px}.qb-item-notes{white-space:pre-wrap}.qb-error{padding:14px;background:#fbece5;color:#842900}.qb-wrap dialog{max-width:520px;width:calc(100% - 36px);border:0;padding:32px;color:#333;box-shadow:0 20px 100px #0004}.qb-wrap dialog::backdrop{background:#0008}.qb-wrap dialog h2{margin-top:0;font-size:28px;line-height:1.2}.qb-wrap #quote-contact>label{margin-top:22px}.qb-skip{position:absolute;left:20px;top:-100px;padding:14px;background:#fff;z-index:100}.qb-skip:focus{top:10px}h2[tabindex]{scroll-margin-top:100px}
@media(max-width:800px){.qb-intro{grid-template-columns:1fr;gap:12px}.qb-products{grid-template-columns:repeat(2,minmax(0,1fr))}.qb-configs{grid-template-columns:repeat(2,minmax(0,1fr))}.qb-steps{align-items:flex-start;flex-direction:column}.qb-steps ol{width:100%;justify-content:space-between;gap:12px;font-size:14px}.qb-review-item{grid-template-columns:100px 1fr;gap:18px}.qb-review-item svg,.qb-review-item .qb-item-image{width:100px;height:100px}}
@media(max-width:520px){.qb-wrap{padding:32px 16px 60px}.qb-panel{padding:22px 16px}.qb-intro h1{font-size:40px}.qb-photo-placeholder{height:110px}.qb-products{gap:10px}.qb-card strong{font-size:16px;padding:10px}.qb-fields{grid-template-columns:1fr}.qb-review-item{grid-template-columns:1fr;padding:20px}.qb-review-item dl{grid-template-columns:1fr}.qb-review-heading{align-items:flex-start;flex-direction:column}.qb-steps li{display:flex;flex-direction:column}.qb-steps li span{font-size:12px}.qb-configs .qb-card>span{padding:8px}.qb-configs svg{height:100px}.qb-configs .qb-manual{grid-column:span 2}.qb-actions>button{flex:1 1 auto}.qb-wrap dialog{padding:24px}.qb-wrap button{padding:12px 16px}}
@media(max-width:480px){.hdr{gap:12px !important}.nav-mobile{flex-shrink:0}}

.qb-choice h2{font-size:clamp(24px,2.6vw,32px);line-height:1.15;margin:0 0 20px;letter-spacing:-.02em}
.qb-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.qb-option{background:#fff;border:2px solid #d0d2c8;padding:32px;display:flex;flex-direction:column;gap:14px}
.qb-option h3{font-size:26px;line-height:1.15;margin:4px 0 0;letter-spacing:-.01em}
.qb-option p{margin:0;color:#555}
.qb-option ul{list-style:none;margin:4px 0 8px;padding:0;display:flex;flex-direction:column;gap:8px}
.qb-option li{display:flex;gap:10px;align-items:flex-start;font-size:16px}.qb-option li svg{flex-shrink:0;margin-top:4px}
.qb-option-btn{margin-top:auto;display:flex;align-items:center;justify-content:center;min-height:54px;padding:0 24px;background:#bbd51c;color:#262626 !important;font-weight:700;font-size:18px;text-decoration:none}
.qb-option-btn:hover{background:#c7df42}
.qb-choice-foot{margin:20px 0 0}
.qb-back{display:inline-flex;align-items:center;min-height:44px;font-weight:600;margin-bottom:8px}
#qb-simple .qb-back{margin-top:-12px}
@media(max-width:800px){.qb-options{grid-template-columns:1fr}.qb-option{padding:24px 20px}}
/* Layout grids for products that set layoutColumns (2 or 3 across); others use the 4-across grid */
.qb-configs.qb-configs-2,.qb-configs.qb-configs-3{grid-template-columns:repeat(6,minmax(0,1fr))}
.qb-configs-3 .qb-card{grid-column:span 2}.qb-configs-2 .qb-card{grid-column:span 3}
.qb-configs-2 .qb-manual,.qb-configs-3 .qb-manual{grid-column:span 3}.qb-configs-2 .qb-manual-first,.qb-configs-3 .qb-manual-first{grid-column:1 / span 3}
@media(max-width:800px){.qb-configs.qb-configs-2,.qb-configs.qb-configs-3{grid-template-columns:repeat(2,minmax(0,1fr))}.qb-configs-2 .qb-card,.qb-configs-3 .qb-card{grid-column:span 1}.qb-configs-2 .qb-manual,.qb-configs-3 .qb-manual,.qb-configs-2 .qb-manual-first,.qb-configs-3 .qb-manual-first{grid-column:1 / span 2}}
/* Whole-project details (step 3) summary shown in the cart */
.qb-project-summary{margin-top:16px}
.qb-summary-head{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.qb-summary-head h3{margin:0 !important}
.qb-project-summary dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 24px;margin:18px 0 0}
.qb-project-summary dt{font-size:13px;color:#595959}.qb-project-summary dd{margin:0;font-size:16px;font-weight:600}
@media(max-width:520px){.qb-project-summary dl{grid-template-columns:1fr}}
@media(max-width:520px){.qb-steps li[aria-current]{text-decoration:none;border-bottom:4px solid #92a90e;padding-bottom:4px}}
/* ---- Phone polish ---- */
/* headings receive focus when a step changes (for screen readers); no box around them */
[tabindex="-1"]:focus{outline:none}
/* colour swatch only once a colour is chosen */
.qb-swatch:not([class*="sw-"]){display:none}
@media(max-width:800px){
  /* shorter intro so the two quote options start higher */
  .qb-intro{margin-bottom:24px}
  .qb-intro aside{padding:14px 16px}
  .qb-intro aside p{margin:6px 0 0;font-size:15px}
  /* bigger tap area for phone numbers */
  .qb-wrap a[href^="tel:"],.tel-link{display:inline-block;padding:10px 0}
  /* step 1: keep "Choose configuration" on screen while scrolling the product list */
  #step-1 .qb-actions{position:sticky;bottom:0;z-index:5;background:#fff;margin:24px -32px -32px;padding:12px 32px calc(12px + env(safe-area-inset-bottom));box-shadow:0 -6px 18px rgba(0,0,0,.08)}
}
@media(max-width:520px){
  #step-1 .qb-actions{margin:20px -16px -22px;padding:12px 16px calc(12px + env(safe-area-inset-bottom))}
  #step-1 .qb-actions>button{flex:1 1 auto}
  /* quantity, width and height on one row, inputs lined up */
  .qb-fields.qb-sizes{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  .qb-sizes label{justify-content:space-between;font-size:15px}
}
@media(max-width:520px){
  .qb-intro h1{font-size:34px;margin:8px 0 14px}
  .qb-choice h2{font-size:22px;margin-bottom:14px}
  .qb-option{gap:10px}
  .qb-option>svg:first-child,.qb-option>.qb-option-icon{width:30px;height:30px}
}
/* on small phones the option cards already explain both routes, so skip the intro sentence */
@media(max-width:520px){.qb-intro h1+p{display:none}}
