/* v2.2 accessibility improvements. WCAG 2.2 AA is the target, not a certification.
   Typography in all stylesheets uses rem; the root respects browser preferences. */
:root{--sq-control-border:#718078;--sq-action-dark:#067364}
html{font-size:100%;scroll-padding-top:1.5rem}
body{font-size:1.125rem;line-height:1.65}
body,button,input,select,textarea{letter-spacing:normal}
p,li,dd,dt,label,legend,button,a,summary,small,span,h1,h2,h3{overflow-wrap:anywhere}
h1,h2,h3{letter-spacing:-.025em}
small{font-size:1rem}
.sq-home-lead,.sq-v2-heading>p,.sq-v2-services p:not(.sq-service-strap),
.sq-solution-copy>p,.sq-how-layout>div>p,.sq-v2-steps p,.sq-why-items p,
.sq-calculator-intro>p,.sq-guide-cards p,.sq-network-section p,.sq-final-cta p,
.sq-enquiry-aside>p,.sq-enquiry-panel section>p:not(.sq-kicker),
.sq-partner-content p,.sq-legal p,.sq-faq-list p{font-size:1.125rem;line-height:1.75}
.sq-kicker,.sq-eyebrow,.sq-scenario-label{letter-spacing:.04em}
.sq-container{max-width:80rem}
/* Content determines height. Grid children can shrink and long strings can wrap. */
.sq-container :where(div,article,section,aside,figure,fieldset,form,nav){min-width:0}
.sq-home-hero-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:3.5rem}
.sq-v2-services,.sq-guide-cards,.sq-partner-options{grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr))}
.sq-v2-heading,.sq-section-heading{flex-wrap:wrap;gap:2rem}
.sq-v2-heading>div{flex:1 1 22rem}
.sq-v2-heading>p{flex:1 1 20rem;max-width:30rem}
.sq-calculator-section{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:3rem}
.sq-enquiry-layout,.sq-partner-content{gap:3rem}
.sq-form-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr))}
.sq-footer-v2 .sq-footer-main{grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr));gap:2rem}
.sq-footer-about,.sq-footer-main>div:nth-child(4),.sq-footer-main>div:nth-child(5){grid-column:auto;grid-row:auto}
.sq-location-list{grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));gap:1rem 2rem}
.sq-location-heading,.sq-copyright,.sq-calc-top,.sq-calc-location,.sq-hero-sequence,
.sq-step-actions,.sq-code-tools,.sq-review-heading,.sq-chart-legend,.sq-assumptions>summary{flex-wrap:wrap}
.sq-mini-pill,.sq-large-input>span,.sq-result-primary span,.sq-navigation>a:not(.sq-button),
.sq-nav-trigger,.sq-header-cta,.sq-unsure-v2 a{white-space:normal}
.sq-large-input{flex-wrap:wrap}
.sq-large-input input{flex:1 1 8rem;line-height:1.4;min-height:2.75rem!important}
.sq-money-breakdown>div{flex-wrap:wrap}
.sq-money-breakdown dd{margin-left:auto}
.sq-result-primary{grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr))}
.sq-result-primary>div+div{border:0;padding:0}
.sq-assumptions>summary span{display:inline;margin-left:0}
.sq-calculator-intro,.sq-enquiry-aside{position:static}
/* No sticky header or fixed notices that could obscure focus at high zoom. */
.sq-header{position:relative}
.sq-header-inner{gap:1.5rem;min-height:6rem}
.sq-navigation{gap:1.25rem}
.sq-header .sq-brand{width:11rem;max-width:calc(100% - 4rem)}
.sq-mega-panel,.sq-business-panel{max-height:70vh;max-height:70dvh;overflow:auto;padding:1rem}
.sq-business-panel{width:25rem;max-width:calc(100vw - 2rem)}
.sq-mega-grid{gap:1.5rem;padding:1rem}
.sq-mega-column .sq-mega-title{color:var(--sq-ink);font-weight:600}
.sq-mega-intro,.sq-mega-bottom{flex-wrap:wrap;padding:1rem;gap:1rem}
.sq-mega-bottom>a:last-child{margin-left:0}
.sq-partner-signin{flex-wrap:wrap}
.sq-noscript{position:static}
/* Dual-colour focus stays visible on both dark and light surfaces. */
:focus-visible{outline:3px solid #102e25;outline-offset:3px;box-shadow:0 0 0 3px #fff}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline-offset:3px}
[tabindex="-1"]:focus{outline:3px solid #102e25;outline-offset:3px;box-shadow:0 0 0 3px #fff}
main[tabindex="-1"]:focus{outline-offset:-3px}
:where(a,button,input,select,textarea,summary,[tabindex]){scroll-margin-block:1.5rem}
.sq-skip{font-size:1.125rem;max-width:calc(100% - 1.5rem);z-index:1000}
/* Text links remain identifiable without relying on colour. */
p a,li>a,.sq-field-help a,.sq-text-link,.sq-quiet-link,.sq-service-action,
.sq-footer a:not(.sq-brand),.sq-mega-column>a,.sq-mega-intro>a,.sq-mega-bottom>a{
 text-decoration:underline;text-underline-offset:.2em;text-decoration-thickness:.08em
}
a:hover{text-decoration:underline;text-underline-offset:.2em}
a.sq-button:hover{color:var(--sq-ink)}
a.sq-button-dark:hover{color:#fff}
/* Standalone controls use at least 44px targets at the default font size. */
button,summary,.sq-button,.sq-text-link,.sq-quiet-link,.sq-service-action,
.sq-navigation a,.sq-footer a:not(.sq-brand){min-height:2.75rem;min-width:2.75rem}
button,summary{line-height:1.5}
.sq-button,.sq-header-cta{white-space:normal}
.sq-footer a:not(.sq-brand),.sq-footer-button{padding-block:.5rem;margin-block:.25rem;line-height:1.6;text-align:left}
.sq-footer h2{font-size:1.125rem;line-height:1.5}
.sq-brand{min-height:2.75rem;display:flex;align-items:center}
.sq-close{width:2.75rem;height:2.75rem}
.sq-dialog{padding:3.5rem 1.5rem 1.5rem;max-height:calc(100dvh - 2rem);overflow:auto}
.sq-dialog p{font-size:1.125rem}
.sq-check{min-height:2.75rem;gap:.75rem;align-items:flex-start}
.sq-check>span{flex:1;min-width:0}
.sq-check input,.sq-service-options input{width:1.5rem;height:1.5rem;flex:none;margin-top:.125rem;accent-color:var(--sq-action-dark)}
.sq-service-options label{min-height:2.75rem;padding:1rem;gap:.75rem}
.sq-button-outline,.sq-business-trigger,.sq-nav-toggle,.sq-service-options label,
.sq-partner-options button,.sq-segmented,.sq-solution-tabs{border:1px solid var(--sq-control-border)}
input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea,
.sq-large-input,.sq-postcode-bar{border-color:var(--sq-control-border)}
input::placeholder,textarea::placeholder{color:var(--sq-muted)}
.sq-postcode-bar:focus-within,.sq-large-input:focus-within{outline:3px solid #102e25;outline-offset:3px}
.sq-segmented [aria-pressed=true],.sq-solution-tabs>button[aria-selected=true],
.sq-partner-options button[aria-pressed=true]{outline:2px solid var(--sq-action-dark);outline-offset:-3px;font-weight:700}
/* Restore external keyboard focus in addition to the inset selected indicator. */
.sq-segmented button:focus-visible,.sq-solution-tabs>button:focus-visible,
.sq-partner-options button:focus-visible{outline:3px solid #102e25;outline-offset:3px;box-shadow:0 0 0 3px #fff}
.sq-field-error{display:block;font-size:1rem;line-height:1.6;color:#843126;margin:.5rem 0}
input[aria-invalid=true],select[aria-invalid=true],textarea[aria-invalid=true]{border:2px solid #843126!important}
.sq-check:has(input[aria-invalid=true]){outline:2px solid #843126;outline-offset:4px}
#sq-business-status:empty{padding:0;margin:0;border:0}
/* Native range semantics, with a generous hit area and a numeric alternative. */
input[type=range]{appearance:none;-webkit-appearance:none;height:2.75rem;margin:.75rem 0;background:transparent;accent-color:var(--sq-action-dark)}
input[type=range]::-webkit-slider-runnable-track{height:.5rem;border:1px solid var(--sq-control-border);background:#d9e9e0;border-radius:1rem}
input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:1.75rem;height:1.75rem;background:var(--sq-action-dark);border:2px solid #fff;border-radius:50%;margin-top:-.6875rem;box-shadow:0 0 0 1px var(--sq-action-dark)}
input[type=range]::-moz-range-track{height:.5rem;border:1px solid var(--sq-control-border);background:#d9e9e0;border-radius:1rem}
input[type=range]::-moz-range-thumb{width:1.5rem;height:1.5rem;background:var(--sq-action-dark);border:2px solid #fff;border-radius:50%}
/* Captions occupy their own solid surfaces; text can grow without colliding. */
.sq-home-hero-visual{display:flex;flex-direction:column;min-height:0;border-radius:5rem 1rem 1rem 1rem;background:#213b31;align-self:start}
.sq-home-hero-visual>img{position:static;width:100%;height:auto;aspect-ratio:1.2;object-fit:cover}
.sq-home-hero-visual::after{display:none}
.sq-hero-image-label,.sq-image-index,.sq-image-disclosure{position:static;max-width:100%;margin:0;border-radius:0;box-shadow:none}
.sq-hero-image-label{background:#f0f7f3;padding:1.25rem}
.sq-hero-image-label>span{font-size:1.125rem}
.sq-image-disclosure{padding:1rem 1.25rem 0;color:#fff;font-size:1rem;background:#213b31}
.sq-image-index{padding:1.25rem;flex-wrap:wrap;background:#213b31;color:#fff}
.sq-image-index>span{font-size:1rem}
.sq-solution-panel>figure{aspect-ratio:auto;overflow:visible}
.sq-solution-panel>figure img{height:auto;aspect-ratio:1.25;object-fit:cover;border-radius:.875rem .875rem 0 0}
.sq-solution-panel>figure figcaption{position:static;background:#213b31;color:#fff;padding:1rem;font-size:1rem;line-height:1.6;border-radius:0 0 .875rem .875rem}
.sq-solution-tabs{flex-wrap:wrap}
.sq-solution-tabs>button{flex:1 1 8rem;white-space:normal}
.sq-solution-panel{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:3rem}
.sq-why-items{grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr))}
.sq-why-section>.sq-container{grid-template-columns:minmax(0,.85fr) minmax(0,1.9fr);gap:3rem}
@media(max-width:84em){
 .sq-header-inner{flex-wrap:wrap;gap:1rem;padding-block:.75rem}
 .sq-header-cta{display:none}
 .sq-nav-toggle{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:2.75rem;height:2.75rem;order:3;background:#fff;border-radius:6px;flex:none}
 .sq-nav-toggle span{width:1.125rem;height:2px;background:var(--sq-ink);display:block}
 .sq-navigation{position:static;order:4;flex-basis:100%;width:100%;max-height:none;overflow:visible;padding:1rem 0;box-shadow:none;margin:0}
 .sq-navigation.sq-open{display:flex}
 .sq-mega-panel,.sq-business-panel{max-height:none;max-width:100%;overflow:visible;margin-top:.5rem}
 .sq-mega-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));padding:1rem .5rem}
 .sq-nav-trigger{line-height:1.6}
}
@media(max-width:64em){
 .sq-home-hero-grid,.sq-calculator-section,.sq-enquiry-layout,.sq-how-layout,.sq-network-section,.sq-partner-content{display:grid;grid-template-columns:1fr;gap:2.5rem}
 .sq-home-hero{background:#fff}
 .sq-home-hero-visual{width:100%;max-width:42rem;margin-inline:auto}
 .sq-home-hero-visual>img{aspect-ratio:1.7}
 .sq-hero-secondary{display:flex;flex-wrap:wrap}
 .sq-why-section>.sq-container{grid-template-columns:1fr}
 .sq-footer-v2 .sq-footer-main>div{grid-column:auto;grid-row:auto}
 .sq-calculator-section .sq-calculator{width:100%;max-width:44rem;margin-inline:auto}
 .sq-quick-services{grid-template-columns:repeat(2,minmax(0,1fr))}
 .sq-quick-services>a{padding:1rem!important;border-left:0;gap:.75rem}
}
@media(max-width:48em){
 .sq-header-cta{display:none}.sq-nav-toggle{margin-left:auto}
 .sq-home-hero h1{font-size:clamp(2.25rem,7vw,3.5rem);line-height:1.15}
 .sq-home-hero h1 br{display:none}
 .sq-solution-panel{display:flex;flex-direction:column;align-items:stretch}
 .sq-solution-panel>figure{width:100%}
 .sq-postcode-bar{flex-wrap:wrap}.sq-postcode-bar>div{flex-basis:100%;padding:.25rem .5rem}
 .sq-postcode-bar .sq-button{width:100%}
 .sq-unsure-v2{display:flex;flex-wrap:wrap}
 .sq-unsure-v2 p{flex:1 1 12rem}.sq-unsure-v2 a{margin:0}
 .sq-progress{display:block;margin:2rem 0}
 .sq-progress li{display:flex;align-items:flex-start;gap:1rem;padding-bottom:1.25rem}
 .sq-progress li>span{width:2.75rem;height:2.75rem;flex:none;font-size:1rem;margin:0}
 .sq-progress small{display:block}
.sq-code-row{flex-wrap:wrap}.sq-code-row input{flex-basis:100%}
 .sq-code-row .sq-button{width:100%}
 .sq-review-row{flex-wrap:wrap}
 .sq-dialog h2{font-size:1.75rem}
}
@media(max-width:30em){
 .sq-quick-services{grid-template-columns:1fr}
 .sq-quick-services>a{border-bottom:1px solid var(--sq-border)}
 .sq-calculator-section .sq-calculator,.sq-enquiry-panel,.sq-partner-form{padding:1rem}
 .sq-form-grid,.sq-location-fields,.sq-result-primary{grid-template-columns:1fr}
 .sq-segmented{grid-template-columns:1fr;gap:.5rem}
 .sq-step-actions>*{width:100%;justify-content:center}
 .sq-location-heading{align-items:flex-start;flex-direction:column;gap:.5rem}
 .sq-footer-v2 .sq-footer-main{grid-template-columns:1fr}
 .sq-solution-tabs>button{flex-basis:100%}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
@media(forced-colors:active){
 :focus-visible,[tabindex="-1"]:focus{outline:3px solid Highlight;box-shadow:none}
 .sq-button,.sq-nav-toggle,.sq-segmented button,.sq-solution-tabs>button{border:1px solid ButtonText}
 .sq-segmented [aria-pressed=true],.sq-solution-tabs>button[aria-selected=true],.sq-partner-options button[aria-pressed=true]{outline-color:Highlight}
 input[type=range]{appearance:auto;-webkit-appearance:auto}
 .sq-energy-bar{border:1px solid CanvasText}
 .sq-energy-bar span{background:Highlight;forced-color-adjust:none}
}
