/* 24 October 2026: responsive unified full-range size finder for home and town pages. */
body .category-size-finder.town-size-finder .category-size-controls,
body .category-size-finder.home-building-finder .category-size-controls{
  display:grid;
  grid-template-columns:minmax(205px,1.6fr) minmax(115px,.95fr) 22px minmax(115px,.95fr) minmax(310px,2fr) minmax(165px,1.2fr);
  align-items:end;
  gap:10px;
  min-width:0;
}
body .category-size-finder.town-size-finder,
body .category-size-finder.home-building-finder{
  grid-template-columns:minmax(0,1fr);
  gap:14px;
  padding:22px 24px;
  align-items:stretch;
}
body .category-size-finder.town-size-finder .category-size-controls>label,
body .category-size-finder.home-building-finder .category-size-controls>label{
  display:grid;
  gap:6px;
  min-width:0;
  font-size:12px;
  align-self:end;
}
body .category-size-finder.town-size-finder .category-size-controls select,
body .category-size-finder.home-building-finder .category-size-controls select{
  width:100%;
  min-width:0;
  max-width:100%;
  height:48px;
  min-height:48px;
  padding:0 12px;
  font-size:14px;
  font-weight:700;
  text-overflow:ellipsis;
}
body .category-size-finder.town-size-finder .size-cross,
body .category-size-finder.home-building-finder .size-cross{
  height:48px;
  width:22px;
  min-width:0;
  margin:0;
  padding:0;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  justify-self:center;
  align-self:end;
}
body .category-size-finder.town-size-finder .category-size-mode,
body .category-size-finder.home-building-finder .category-size-mode{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  min-width:0;
  align-self:end;
}
body .category-size-finder.town-size-finder .category-size-mode>label,
body .category-size-finder.home-building-finder .category-size-mode>label{
  min-width:0;
  min-height:48px;
  padding:8px 10px;
  gap:7px;
  background:#fff;
}
body .category-size-finder.town-size-finder .category-size-mode strong,
body .category-size-finder.home-building-finder .category-size-mode strong{
  font-size:12px;
  line-height:1.2;
}
body .category-size-finder.town-size-finder .category-size-mode small,
body .category-size-finder.home-building-finder .category-size-mode small{
  font-size:10px;
  line-height:1.25;
  margin-top:3px;
}
body .category-size-finder.town-size-finder .category-size-controls .btn,
body .category-size-finder.home-building-finder .category-size-controls .btn{
  width:100%;
  min-width:0;
  min-height:48px;
  height:auto;
  padding:10px 12px;
  white-space:normal;
  text-align:center;
  line-height:1.2;
  font-size:15px;
  justify-self:stretch;
}
body .category-size-finder.town-size-finder .category-size-copy,
body .category-size-finder.home-building-finder .category-size-copy{
  min-width:0;
  max-width:880px;
}
body .category-size-finder.town-size-finder .category-size-copy h3{
  font-size:23px;
  line-height:1.2;
}
body .category-size-finder.town-size-finder .category-size-copy p,
body .category-size-finder.home-building-finder .category-size-copy p{
  max-width:85ch;
}
body .home-building-finder .category-popular-sizes{grid-column:1/-1}
@media(max-width:1180px){
  body .category-size-finder.town-size-finder .category-size-controls,
  body .category-size-finder.home-building-finder .category-size-controls{
    grid-template-columns:minmax(0,1fr) 22px minmax(0,1fr);
    gap:10px;
  }
  body .category-size-finder.town-size-finder .category-size-controls>.home-building-type,
  body .category-size-finder.home-building-finder .category-size-controls>.home-building-type{
    grid-column:1/-1;
  }
  body .category-size-finder.town-size-finder .category-size-mode,
  body .category-size-finder.home-building-finder .category-size-mode{
    grid-column:1/-1;
  }
  body .category-size-finder.town-size-finder .category-size-controls .btn,
  body .category-size-finder.home-building-finder .category-size-controls .btn{
    grid-column:1/-1;
    width:100%;
    justify-self:stretch;
  }
}
@media(max-width:620px){
  body .category-size-finder.town-size-finder,
  body .category-size-finder.home-building-finder{
    padding:16px;
    gap:13px;
  }
  body .category-size-finder.town-size-finder .category-size-copy h3{
    font-size:21px;
  }
  body .category-size-finder.town-size-finder .category-size-controls,
  body .category-size-finder.home-building-finder .category-size-controls{
    gap:10px;
  }
}
@media(max-width:450px){
  body .category-size-finder.town-size-finder .category-size-mode,
  body .category-size-finder.home-building-finder .category-size-mode{
    grid-template-columns:1fr;
  }
}

/* Popular size shortcuts: prominent, finger-friendly buttons (24 Oct 2026). */
body .home-building-finder .category-popular-sizes{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
  padding-top:12px;
  margin-top:5px;
  border-top:1px solid var(--line,#e2e7e2);
}
body .home-building-finder .category-popular-sizes>strong{
  color:var(--text,#25313b);
  font-size:13px;
  line-height:1.4;
  font-weight:850;
  white-space:nowrap;
}
body .home-building-finder .category-popular-sizes>div{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:9px;
}
body .home-building-finder .category-popular-sizes>div>a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  min-width:87px;
  min-height:44px;
  padding:10px 15px;
  border:1.5px solid color-mix(in srgb,var(--brand,#e85c2b) 48%,#c5cbd0);
  border-radius:999px;
  background:color-mix(in srgb,var(--brand,#e85c2b) 9%,#fff);
  color:var(--text,#26313b);
  text-decoration:none;
  font-size:14px;
  font-weight:850;
  line-height:1.2;
  white-space:nowrap;
  box-shadow:0 2px 5px rgba(0,0,0,.05);
  transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease;
}
body .home-building-finder .category-popular-sizes>div>a:hover{
  background:color-mix(in srgb,var(--brand,#e85c2b) 19%,#fff);
  border-color:var(--brand,#e85c2b);
  box-shadow:0 3px 9px rgba(0,0,0,.11);
  transform:translateY(-1px);
}
body .home-building-finder .category-popular-sizes>div>a:focus-visible{
  outline:3px solid var(--brand,#e85c2b);
  outline-offset:3px;
}
body .home-building-finder .category-popular-sizes>div>a:active{
  background:color-mix(in srgb,var(--brand,#e85c2b) 26%,#fff);
  transform:translateY(0);
  box-shadow:0 1px 2px rgba(0,0,0,.07);
}
@media(max-width:620px){
  body .home-building-finder .category-popular-sizes{
    align-items:flex-start;
    gap:9px;
  }
  body .home-building-finder .category-popular-sizes>strong{
    width:100%;
  }
  body .home-building-finder .category-popular-sizes>div{
    gap:9px;
  }
  body .home-building-finder .category-popular-sizes>div>a{
    min-height:46px;
    padding:11px 14px;
    font-size:14px;
  }
}
@media(prefers-reduced-motion:reduce){
  body .home-building-finder .category-popular-sizes>div>a{
    transition:none;
  }
}

/* High-contrast rollover for large popular-size shortcuts. */
body .home-building-finder .category-popular-sizes>div>a:hover,
body .home-building-finder .category-popular-sizes>div>a:focus-visible{
  background:color-mix(in srgb,var(--brand-dark,#a53c20) 90%,#000);
  border-color:color-mix(in srgb,var(--brand-dark,#a53c20) 90%,#000);
  color:#fff;
  box-shadow:0 4px 12px rgba(0,0,0,.16);
}
body .home-building-finder .category-popular-sizes>div>a:focus-visible{
  outline:3px solid var(--brand,#a53c20);
  outline-offset:3px;
}
body .home-building-finder .category-popular-sizes>div>a:active{
  background:var(--brand-dark,#a53c20);
  border-color:var(--brand-dark,#a53c20);
  color:#fff;
  transform:translateY(0);
}

/* Switch background and text together instantly for readable rollover contrast. */
body .home-building-finder .category-popular-sizes>div>a{
  transition:box-shadow .16s ease,transform .16s ease;
}

/* Same large, high-contrast quick size shortcuts on town/city and category pages. */
body .town-size-finder .category-popular-sizes{
  grid-column:1/-1;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  margin-top:4px;
  padding-top:13px;
  padding-bottom:1px;
  border-top:1px solid var(--line,#e2e7e2);
  overflow:visible;
}
body .town-size-finder .category-popular-sizes>strong{
  color:var(--text,#25313b);
  font-size:13px;
  font-weight:850;
  line-height:1.4;
  white-space:nowrap;
}
body .town-size-finder .category-popular-sizes>div{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:9px;
}
body .category-size-finder .category-popular-sizes>div>a{
  box-sizing:border-box;
  display:inline-flex;
  flex:0 0 auto;
  justify-content:center;
  align-items:center;
  min-width:87px;
  min-height:44px;
  padding:10px 15px;
  border:1.5px solid color-mix(in srgb,var(--brand,#e85c2b) 48%,#c5cbd0);
  border-radius:999px;
  background:color-mix(in srgb,var(--brand,#e85c2b) 9%,#fff);
  color:var(--text,#26313b);
  text-decoration:none;
  font-size:14px;
  font-weight:850;
  line-height:1.2;
  white-space:nowrap;
  box-shadow:0 2px 5px rgba(0,0,0,.05);
  transition:box-shadow .16s ease,transform .16s ease;
}
body .category-size-finder .category-popular-sizes>div>a:hover,
body .category-size-finder .category-popular-sizes>div>a:focus-visible{
  border-color:color-mix(in srgb,var(--brand-dark,#a53c20) 90%,#000);
  background:color-mix(in srgb,var(--brand-dark,#a53c20) 90%,#000);
  color:#fff;
  box-shadow:0 4px 12px rgba(0,0,0,.16);
  transform:translateY(-1px);
}
body .category-size-finder .category-popular-sizes>div>a:focus-visible{
  outline:3px solid var(--brand,#a53c20);
  outline-offset:3px;
}
body .category-size-finder .category-popular-sizes>div>a:active{
  background:var(--brand-dark,#a53c20);
  border-color:var(--brand-dark,#a53c20);
  color:#fff;
  box-shadow:0 1px 2px rgba(0,0,0,.07);
  transform:translateY(0);
}
@media(max-width:620px){
  body .town-size-finder .category-popular-sizes{
    display:flex;
    align-items:flex-start;
    gap:9px;
  }
  body .town-size-finder .category-popular-sizes>strong{
    width:100%;
  }
  body .town-size-finder .category-popular-sizes>div{
    gap:9px;
  }
  body .category-size-finder .category-popular-sizes>div>a{
    min-height:46px;
    padding:11px 14px;
  }
}
@media(prefers-reduced-motion:reduce){
  body .category-size-finder .category-popular-sizes>div>a{
    transition:none;
  }
}

/* Return route to originating town or city in filtered product results. */
body .town-search-return{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:0 0 22px;
  padding:14px 18px;
  border:1px solid color-mix(in srgb,var(--brand,#6b8d43) 38%,#ddd);
  border-left:4px solid var(--brand,#6b8d43);
  border-radius:12px;
  background:color-mix(in srgb,var(--brand,#6b8d43) 6%,#fff);
  color:var(--text,#26313b);
  font-size:14px;
  line-height:1.5;
}
body .town-search-return a{
  color:var(--brand-dark,#455f20);
  font-weight:850;
  text-decoration:underline;
  text-underline-offset:3px;
}
body .town-search-return a:focus-visible{
  outline:3px solid var(--brand,#6b8d43);
  outline-offset:3px;
}
@media(max-width:620px){
  body .town-search-return{
    align-items:flex-start;
    flex-direction:column;
    padding:13px 14px;
    gap:8px;
  }
}

/* UK-wide delivery message and locally rendered product matching on town/city pages. */
body .town-uk-delivery{
  display:flex;
  gap:13px;
  align-items:flex-start;
  margin:0 0 24px;
  padding:16px 19px;
  border:1px solid color-mix(in srgb,var(--brand,#607a36) 36%,#dfe6dc);
  border-left:5px solid var(--brand,#607a36);
  border-radius:12px;
  background:color-mix(in srgb,var(--brand,#607a36) 5%,#fff);
  color:var(--text,#26313b);
}
body .town-uk-delivery-icon{font-size:24px;line-height:1.3;flex:0 0 auto}
body .town-uk-delivery strong{display:block;font-size:17px;line-height:1.35;margin-bottom:4px}
body .town-uk-delivery p{margin:0;color:var(--text,#26313b);line-height:1.55;font-size:13px}
body .town-uk-delivery a{font-weight:850;color:var(--brand-dark,#50672f);text-decoration:underline;text-underline-offset:3px}
body .town-size-live-results{margin:18px 0 36px;scroll-margin-top:85px}
body .hb-town-size-section+.town-size-live-results>.container{max-width:1200px;margin-inline:auto}
body .town-live-results-inner{padding:22px 22px 26px;border:1px solid var(--line,#e1e6e1);border-radius:14px;background:#fff}
body .town-live-results-heading{display:flex;flex-wrap:wrap;align-items:start;justify-content:space-between;gap:16px;margin-bottom:19px}
body .town-live-results-heading>div{flex:1 1 280px}
body .town-live-results-heading h2{margin:4px 0 9px;line-height:1.2;font-size:24px}
body .town-live-results-heading p{margin:0;font-size:14px;line-height:1.55;max-width:70ch}
body .town-live-results-heading .btn{white-space:nowrap}
body .town-live-product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:17px}
body .town-live-product-grid>.card{min-width:0;display:flex;flex-direction:column}
body .town-live-product-grid>.card .card-body{display:flex;flex-direction:column;flex:1}
body .town-live-product-grid>.card .card-body h3{font-size:15px;line-height:1.38}
body .town-live-product-grid>.card .card-price-line{margin-top:auto}
body .town-live-product-grid>.card .town-card-action{margin-top:12px;text-align:center;font-size:13px;padding:11px 12px}
body .town-live-load-wrap{text-align:center;margin-top:22px}
body .town-live-load-wrap button{min-height:44px}
body .town-live-results-state{padding:23px;border:1px solid var(--line,#ddd);background:#fff;border-radius:12px;font-size:14px}
body .town-no-results{padding:18px 0;font-size:15px}
body .town-live-results-state a{color:var(--brand-dark,#607a36);font-weight:800}
@media(max-width:1050px){body .town-live-product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:740px){body .town-live-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}body .town-live-results-inner{padding:16px}body .town-live-results-heading h2{font-size:22px}}
@media(max-width:450px){body .town-uk-delivery{padding:13px 12px;gap:10px}body .town-uk-delivery strong{font-size:15px}body .town-uk-delivery p{font-size:12px}body .town-live-product-grid{gap:10px}body .town-live-results-heading .btn{width:100%}body .town-live-product-grid>.card .town-card-action{padding:9px 7px}}

/* Product/town postcode check and local results refinements. */
body .shop-postcode-widget{
  min-width:0;
  margin:15px 0 20px;
  padding:16px 18px;
  border:1px solid color-mix(in srgb,var(--brand,#63853a) 30%,#d8dfd5);
  border-radius:12px;
  background:#fff;
  color:var(--text,#25313b);
}
body .shop-postcode-form>label{display:block;font-size:16px;font-weight:800;line-height:1.25;margin-bottom:10px}
body .shop-postcode-form>label span{display:block;margin-top:4px;font-size:12px;font-weight:400;color:#52616a}
body .shop-postcode-inputrow{display:flex;align-items:stretch;gap:9px}
body .shop-postcode-inputrow input{min-width:0;flex:1;min-height:44px;padding:10px 12px;border:1px solid #bdc7c4;border-radius:8px;background:#fff;font-size:15px;text-transform:uppercase;color:#26313b}
body .shop-postcode-inputrow button{min-height:44px;white-space:nowrap;font-weight:800;font-size:14px;padding:8px 16px}
body .shop-postcode-answer{font-weight:650;font-size:13px;line-height:1.5}
body .shop-postcode-answer:not(:empty){margin-top:11px;padding:10px 12px;border-radius:8px;background:#f2f5f4}
body .shop-postcode-answer.is-success{color:#184b2b;background:#e8f5ec}
body .shop-postcode-answer.is-warning{color:#74410c;background:#fff3df}
body .shop-postcode-disclaimer{display:block;margin-top:10px;color:#59636d;font-size:11px;line-height:1.5}
body .shop-local-back{margin:0 0 16px}
body .shop-local-back a{display:inline-flex;align-items:center;min-height:40px;max-width:100%;padding:9px 13px;border-radius:8px;text-decoration:none;font-size:14px;font-weight:800;border:1px solid color-mix(in srgb,var(--brand,#63853a) 40%,#ccc);color:var(--brand-dark,#486029);background:color-mix(in srgb,var(--brand,#63853a) 6%,#fff)}
body .shop-local-back a:hover,body .shop-local-back a:focus-visible{background:var(--brand-dark,#486029);color:#fff}
body .town-live-filter-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) repeat(2,minmax(100px,.7fr)) minmax(130px,1.15fr) minmax(140px,auto);gap:11px;align-items:end;padding:16px;margin:0 0 23px;background:#f7f9f6;border:1px solid var(--line,#e1e6df);border-radius:12px}
body .town-live-filter-form label{min-width:0;display:grid;gap:6px;font-weight:750;font-size:12px;line-height:1.3}
body .town-live-filter-form select,body .town-live-filter-form input{width:100%;min-width:0;height:44px;padding:8px 10px;border:1px solid #c4cecb;border-radius:8px;background:#fff;color:#29333e;font-size:13px}
body .town-live-filter-form .btn{min-width:0;min-height:44px;padding:8px 12px;font-size:14px;line-height:1.2}
body .town-live-filter-form :is(select,input,.btn):focus-visible,body .shop-postcode-widget :is(input,button):focus-visible{outline:3px solid var(--brand,#63853a);outline-offset:2px}
@media(max-width:1180px){body .town-live-filter-form{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:740px){body .town-live-filter-form{grid-template-columns:repeat(2,minmax(0,1fr));padding:13px;gap:10px}}
@media(max-width:450px){body .shop-postcode-widget{padding:13px;margin-block:12px 18px}body .shop-postcode-inputrow{flex-wrap:wrap}body .shop-postcode-inputrow button{width:100%}body .town-live-filter-form .btn{grid-column:1/-1;width:100%}}