.qsl-page{--qsl-ink:#183e36;--qsl-tint:#f3f2eb;color:var(--qsl-ink)}.qsl-page h1,.qsl-page h2,.qsl-page h3{letter-spacing:-.025em}.qsl-hero{position:relative;width:100%;height:650px;min-height:520px;background:#3a3d37;overflow:hidden}.qsl-hero>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 56%}.qsl-hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(12,25,21,.82),rgba(12,25,21,.25) 56%,transparent)}.qsl-hero-copy{position:absolute;z-index:1;left:max(5vw,calc((100vw - 1200px)/2));top:50%;transform:translateY(-50%);max-width:620px;color:white;padding:24px 0}.qsl-hero-copy .eyebrow{color:#e5edb1}.qsl-hero h1{font-size:clamp(40px,5.5vw,76px);line-height:1.03;color:white;margin:20px 0}.qsl-hero p{font-size:22px;line-height:1.5}.qsl-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}.qsl-hero .button{background:#e5edb1;color:#183e36}.qsl-hero .button.secondary{background:white;color:#183e36}.qsl-nav{background:#183e36;color:white}.qsl-nav>.wrap{display:flex;align-items:center;gap:26px;padding-block:18px;overflow-x:auto;white-space:nowrap}.qsl-nav a{color:white;font-size:14px}.qsl-nav strong{margin-right:auto}.qsl-intro{display:grid;grid-template-columns:1fr 1fr;gap:70px;padding-block:70px}.qsl-page h2{font-size:clamp(30px,3.6vw,46px);line-height:1.12;margin:12px 0 24px}.qsl-page p{line-height:1.7}.qsl-note{border-left:3px solid #75883f;padding:8px 16px;background:#f3f2eb}.qsl-range,.qsl-contact{padding:65px 0;background:var(--qsl-tint)}.qsl-filters{display:flex;gap:10px;flex-wrap:wrap;margin-top:30px}.qsl-filters button{border:1px solid #b9c4b6;border-radius:24px;padding:12px 20px;background:white;font:inherit;color:inherit;cursor:pointer}.qsl-filters button[aria-pressed=true]{background:#183e36;color:white}.qsl-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.qsl-card{background:white;overflow:hidden;border:1px solid #dce0d6;border-radius:10px;display:flex;flex-direction:column}.qsl-card[hidden]{display:none}.qsl-card-visual{height:170px;background:#fafaf8}.qsl-card-visual img{display:block;height:100%;width:100%;object-fit:contain}.qsl-colour{height:100%;display:flex;align-items:flex-end;justify-content:center;padding:16px;background:var(--qsl-colour)}.qsl-colour span{font-size:12px;background:#ffffffed;border-radius:20px;padding:5px 12px;color:#183e36}.qsl-card-body{padding:18px;display:flex;flex-direction:column;gap:8px;flex:1}.qsl-card h3{font-size:22px;margin:0}.qsl-card small{font-size:12px;letter-spacing:.08em;text-transform:uppercase}.qsl-card p{font-size:13px;margin:0}.qsl-card strong{font-size:14px;margin:6px 0}.qsl-card .button{font-size:13px;padding:12px 8px;margin-top:auto;text-align:center;white-space:normal}.qsl-section{padding-block:65px}.qsl-benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;margin:30px 0}.qsl-benefits h3{font-size:23px}.qsl-tag{padding:8px 12px;border:1px solid #b7c5b7;border-radius:22px;text-decoration:none;font-size:13px;color:#183e36;background:#f3f2eb}.qsl-feature{display:grid;grid-template-columns:1fr 1fr;background:#e6e9de;align-items:stretch}.qsl-feature>img{display:block;width:100%;height:100%;min-height:440px;max-height:620px;object-fit:cover}.qsl-feature>div{padding:clamp(30px,5vw,75px);align-self:center}.qsl-pack{background:#f3f2eb}.qsl-pack>img{object-fit:contain;background:white}.qsl-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;margin:30px 0;padding:0;list-style:none;counter-reset:steps}.qsl-steps li{counter-increment:steps;border-top:1px solid #b9c4b6;padding-top:20px}.qsl-steps li:before{content:'0' counter(steps);color:#75883f;font-size:28px;font-weight:bold}.qsl-steps h3{font-size:22px}.qsl-faq{border-bottom:1px solid #c8d0c2;padding:18px 0}.qsl-faq summary{font-weight:600;cursor:pointer;line-height:1.6}.qsl-contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}.qsl-page :is(a,button,input,select):focus-visible{outline:3px solid #c58224;outline-offset:4px}.qsl-page section[id],.qsl-page form[id]{scroll-margin-top:130px}.qsl-page .small-note{max-width:100%;font-size:13px;line-height:1.6}
@media(max-width:950px){.qsl-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.qsl-benefits,.qsl-steps{grid-template-columns:repeat(2,1fr)}.qsl-intro{gap:35px}.qsl-contact-grid{gap:30px}.qsl-hero{height:580px}.qsl-hero-copy{left:5vw}}
@media(max-width:650px){.qsl-hero{height:580px;min-height:0}.qsl-hero>img{object-position:62% center}.qsl-hero:after{background:linear-gradient(0deg,rgba(12,25,21,.9),rgba(12,25,21,.1))}.qsl-hero-copy{left:6%;right:6%;top:auto;bottom:22px;transform:none;padding:0}.qsl-hero h1{font-size:43px}.qsl-hero p{font-size:18px}.qsl-actions{gap:8px}.qsl-actions .button{padding:13px 15px;font-size:14px}.qsl-nav>.wrap{gap:20px}.qsl-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.qsl-card-visual{height:130px}.qsl-card-body{padding:13px}.qsl-card h3{font-size:19px}.qsl-colour{padding:10px}.qsl-colour span{font-size:10px;padding:5px 7px;text-align:center}.qsl-intro,.qsl-contact-grid,.qsl-feature{grid-template-columns:1fr;gap:20px}.qsl-intro,.qsl-section{padding-block:40px}.qsl-range,.qsl-contact{padding:40px 0}.qsl-feature{gap:0}.qsl-feature>img{min-height:0;height:auto;max-height:none;aspect-ratio:1.2}.qsl-feature>div{padding:30px 6%}.qsl-benefits,.qsl-steps{gap:18px}.qsl-benefits h3,.qsl-steps h3{font-size:20px}.qsl-benefits p,.qsl-steps p{font-size:14px}.qsl-page .form-grid{grid-template-columns:1fr}.qsl-contact-grid>.form-panel{min-width:0}.qsl-filters{gap:7px}.qsl-filters button{padding:10px 13px;font-size:14px}}
@media(prefers-reduced-motion:reduce){.qsl-page *{scroll-behavior:auto!important}}

/* Full-bleed photography with copy over the quieter side of each image. */
.qsl-carousel{position:relative;width:100%;background:#17291f;color:white;overflow:hidden}
.qsl-slide{position:relative;display:block;height:clamp(560px,calc(100svh - 120px),780px);min-height:560px;isolation:isolate}
.qsl-slide[hidden]{display:none}
.qsl-slide-media{position:absolute;inset:0;z-index:-2}
.qsl-slide-media img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.qsl-slide:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,transparent 35%,rgba(8,18,14,.25) 53%,rgba(8,18,14,.76) 100%)}
.qsl-slide.macro img{object-position:center 36%}
.qsl-slide.outdoors img{object-position:center 66%}
.qsl-slide-copy{position:absolute;top:50%;transform:translateY(-50%);left:59%;right:5%;color:white;padding:0;max-width:550px}
.qsl-slide-copy :is(h1,h2){font-size:clamp(42px,4.7vw,72px);line-height:1.03;margin:18px 0 24px;color:white;text-shadow:0 2px 20px #0004}
.qsl-slide-copy p{font-size:clamp(17px,1.5vw,21px);line-height:1.55;margin:0 0 28px;color:white}
.qsl-slide-copy .eyebrow{color:#e5edb1}
.qsl-slide-copy .button{background:#e5edb1;color:#183e36;border-color:#e5edb1}
.qsl-carousel-controls{display:flex;align-items:center;justify-content:center;gap:12px;padding:12px 4%;background:#183e36;color:white}
.qsl-carousel-controls button{font:inherit;cursor:pointer;min-height:44px;border:1px solid #6a887f;border-radius:6px;background:transparent;color:white;padding:9px 13px}
.qsl-dots{display:flex;gap:8px}.qsl-dots button{font-size:13px}.qsl-dots button span{opacity:.7;margin-right:5px}
.qsl-dots button[aria-pressed=true]{background:#e5edb1;color:#183e36;border-color:#e5edb1}
.qsl-carousel:focus-visible{outline:3px solid #c58224;outline-offset:-3px}
@media(max-width:900px){.qsl-slide-copy{left:56%;right:4%}.qsl-slide-copy :is(h1,h2){font-size:44px}.qsl-dots button{font-size:0}.qsl-dots button span{font-size:14px;margin:0}}
@media(max-width:650px){
 .qsl-slide{height:720px;height:clamp(660px,calc(100svh - 90px),760px);min-height:660px}
 .qsl-slide-media img{object-position:25% center}
 .qsl-slide.macro img{object-position:37% center}
 .qsl-slide.outdoors img{object-position:36% center}
 .qsl-slide.colours img{object-position:28% center}
 .qsl-slide:after{background:linear-gradient(0deg,rgba(8,18,14,.96),rgba(8,18,14,.82) 26%,rgba(8,18,14,.08) 57%,transparent 70%)}
 .qsl-slide-copy{left:6%;right:6%;top:auto;bottom:30px;transform:none;max-width:none}
 .qsl-slide-copy :is(h1,h2){font-size:42px;margin:10px 0 14px}
 .qsl-slide-copy p{font-size:16px;margin-bottom:20px;max-width:360px}
 .qsl-carousel-controls{gap:6px;padding:10px 3%;justify-content:space-between}
 .qsl-carousel-controls button{padding:8px 10px}.qsl-dots{gap:5px}
}

/* Search thumbnails show the fastening, not clothing or distant packaging. */
.shop-photo img[src$="/quickshoelace/reference-2.jpg"]{object-fit:cover;object-position:40% 30%}
.shop-photo img[src$="/quickshoelace/prestige-fastening-search.png"]{object-fit:cover;object-position:center 25%}