@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@700;800&display=swap');
/* UK adaptation of the established BetterHomeDirect hero and type scale. */
@font-face{font-family:Manrope;src:url('/assets/manrope.woff2') format('woff2');font-style:normal;font-weight:200 800;font-display:swap}
@font-face{font-family:'DM Sans';src:url('/assets/dm-sans-regular.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'DM Sans';src:url('/assets/dm-sans-bold.woff2') format('woff2');font-style:normal;font-weight:700;font-display:swap}
.wordmark{font-family:'Plus Jakarta Sans',Manrope,Arial,sans-serif;font-size:26px;font-weight:800;line-height:1.1;letter-spacing:-1.1px}
.wordmark small{font-size:10px;letter-spacing:5px;font-weight:700;margin:7px 0 0 3px}
h1,h2,h3{font-weight:800}
.hero{position:relative;padding:63px 0 49px}
.hero::after{content:"";position:absolute;width:600px;height:600px;right:-280px;top:-330px;border-radius:50%;background:#dceefd;opacity:.5;pointer-events:none}
.hero-grid{grid-template-columns:1.14fr .95fr;gap:28px;position:relative;z-index:1}
.hero-text h1{font-size:clamp(42px,4.5vw,62px);line-height:1.08;letter-spacing:-2.4px;font-weight:800;max-width:700px}
.hero-text .lead{max-width:550px;color:#173b70;line-height:1.65}
.hero-art{width:110%;max-width:none;height:auto;margin:-91px 0 -15px;animation:arrive .7s ease-out}
.hero-service .hero-art{margin-top:-145px;margin-bottom:-34px}
.home-service-cards{padding-top:58px;padding-bottom:58px}
.home-service-cards .card img{height:178px;aspect-ratio:auto;object-fit:cover}
.home-service-cards .card-body{padding:20px}
.home-service-cards .card-body h3{margin-bottom:8px}
.home-service-cards .card-body p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;margin-bottom:17px}
.entry-panel{position:relative;z-index:2;margin-left:18px;padding:38px;border-radius:30px;align-self:center}
.entry-panel h2{font-size:36px;line-height:1.15;letter-spacing:-1px}
.hero-home .hero-note{position:absolute;display:block;width:300px;height:auto;top:-112px;left:23%;pointer-events:none}
@media (min-width:761px) and (max-width:1100px){.hero-grid{gap:20px}.hero-art{width:100%;margin:4px 0 -12px}.hero-service .hero-art{margin-top:-20px;margin-bottom:-15px}}
@media (min-width:761px) and (max-width:900px){.hero-service .hero-art{margin-top:40px}}
/* Keep the three-service homepage as compact and balanced as the SunForward
   reference without pushing the illustration through the lead paragraph. */
.hero-home .hero-text h1,.hero-home .entry-panel h2{font-family:'Plus Jakarta Sans',Manrope,Arial,sans-serif;font-weight:800}
@media(min-width:1101px){.hero-home{padding:32px 0 55px}.hero-home .hero-grid{align-items:start;gap:0}.hero-home .hero-text h1{font-size:44px;line-height:1.15;letter-spacing:-1.5px}.hero-home .hero-art{width:105%;margin:-66px 0 -18px}.hero-home .entry-panel{align-self:start;margin-top:196px}}
@media(min-width:761px) and (max-width:1100px){.hero-home .hero-text h1{font-size:clamp(33px,4.2vw,45px);line-height:1.09;letter-spacing:-1.7px}.hero-home .hero-art{width:100%;margin:0 auto}.hero-home .entry-panel{align-self:center}}
@media(min-width:761px) and (max-width:1100px){.hero-home .hero-note{width:245px;top:-91px;left:16%}}
@keyframes arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:900px){.hero-grid{gap:16px}.entry-panel{margin-left:0;padding:28px}.entry-panel h2{font-size:29px}}
@media(max-width:760px){.wordmark{font-size:24px}.wordmark small{font-size:8px;letter-spacing:3px}.hero{padding:33px 0 20px}.hero-grid{display:flex;flex-direction:column;gap:16px;align-items:stretch}.hero-text h1{font-size:clamp(34px,10vw,43px);letter-spacing:-1.6px}.hero-text .lead{font-size:16px}.hero-art{width:100%;margin:0 auto;max-width:480px}.hero-service .hero-art{margin:-35px auto -22px}.entry-panel{width:100%;margin:0;border-radius:20px;padding:25px 20px}.entry-panel h2{font-size:27px}.home-service-cards .card img{height:165px}}
@media(max-width:760px){.hero-home .hero-note{display:none}}
/* Keep all three homepage project choices in the first phone viewport.  This
   is homepage-only: the service-page postcode layout has its own tuning. */
@media(max-width:760px){body:has(.hero-home) .nav{min-height:80px;flex-wrap:nowrap;gap:8px;padding:0}body:has(.hero-home) .nav .brand{min-width:0}body:has(.hero-home) .nav .menu{margin-left:auto;flex:none}.hero-home{padding-top:28px}.hero-home .hero-grid{gap:10px}.hero-home .eyebrow{margin-bottom:10px}.hero-home .hero-text h1{font-size:clamp(34px,9vw,38px);line-height:1.07;margin-bottom:12px}.hero-home .hero-text .lead{line-height:1.48;margin-bottom:12px}.hero-home .entry-panel{padding:20px}.hero-home .entry-panel h2{font-size:27px;margin-bottom:15px}.hero-home .choice-list{gap:8px}.hero-home .choice{padding:10px 14px;min-height:55px}.hero-home .choice svg{width:28px;height:28px;margin-right:10px}}
@media(max-width:760px){body:has(.hero-home) .nav:has(.navlinks.open){flex-wrap:wrap;padding:12px 0}}
@media(max-width:350px){body:has(.hero-home) .nav{gap:4px}body:has(.hero-home) .wordmark{font-size:20px}body:has(.hero-home) .wordmark small{font-size:7px;letter-spacing:1.3px}body:has(.hero-home) .brand img{width:37px;height:37px}body:has(.hero-home) .menu{font-size:12px;padding:6px}.hero-home{padding-top:20px}.hero-home .eyebrow{font-size:10px;letter-spacing:1.3px;margin-bottom:5px}.hero-home .hero-grid{gap:6px}.hero-home .hero-text h1{font-size:30px;line-height:1.04;margin-bottom:5px}.hero-home .hero-text .lead{font-size:14px;line-height:1.35;margin-bottom:5px}.hero-home .entry-panel{padding:14px}.hero-home .entry-panel h2{font-size:23px;margin-bottom:8px}.hero-home .choice-list{gap:6px}.hero-home .choice{min-height:47px;padding:7px 10px;font-size:15px}.hero-home .choice svg{width:24px;height:24px;margin-right:7px}}
/* On a phone, keep the service postcode action clear of the fixed bottom bar.
   The illustration remains after the decision panel, without obscuring copy. */
@media(max-width:760px){.hero-service{padding-top:16px}.hero-service .hero-grid{gap:8px}.hero-service .eyebrow{margin-bottom:12px}.hero-service .hero-text h1{font-size:clamp(32px,8.7vw,37px);line-height:1.06;margin-bottom:12px}.hero-service .hero-text .lead{line-height:1.5;margin-bottom:12px}.hero-service .entry-panel{padding-top:18px;padding-bottom:18px}.hero-service .entry-panel h2{font-size:25px;margin-bottom:10px}.hero-service .entry-panel p{margin-bottom:12px}.hero-service .area-lookup{gap:8px}}
@media(prefers-reduced-motion:reduce){.hero-art{animation:none}}
/* Prepared UK quote journey; activated only with the verified private relay. */
.quote-dialog{width:min(610px,calc(100% - 24px));max-height:min(92vh,900px);max-height:min(92dvh,900px);overflow-y:auto;overscroll-behavior:contain;border:0;border-radius:22px;padding:30px;box-shadow:0 24px 80px #172e5b55;color:#173b70}
.quote-dialog::backdrop{background:#182b54a8}
.quote-dialog-top{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}
.quote-dialog-top .brand{transform:scale(.78);transform-origin:left center}
.quote-close{border:1px solid #d5e2ed;background:white;color:#173b70;border-radius:7px;padding:9px 13px;cursor:pointer}
.quote-progress{display:flex;justify-content:space-between;font-size:12px;color:#58718b;margin-bottom:8px}
.quote-progress-bar{height:5px;background:#d9e6eb;border-radius:99px;overflow:hidden;margin-bottom:31px}
.quote-progress-bar span{display:block;height:100%;background:#42a33b;transition:width .2s}
.quote-form h2{font-size:34px;line-height:1.16;letter-spacing:-1px;margin:0 0 21px}
.quote-step{display:grid;gap:12px}
.quote-option{display:flex;justify-content:space-between;align-items:center;width:100%;border:1px solid #cbdce6;border-radius:10px;background:white;color:#173b70;font:inherit;font-size:17px;font-weight:700;text-align:left;padding:18px 20px;cursor:pointer}
.quote-option:hover,.quote-option:focus-visible{border-color:#287c2b;background:#f3fbf0}
.quote-step label,.quote-fields label{display:block;font-weight:700;font-size:14px}
.quote-step input,.quote-step select,.quote-fields input{display:block;width:100%;padding:15px 16px;border:1px solid #b7cbdc;border-radius:9px;margin-top:7px;background:#fff;font:inherit;color:#173b70}
.quote-fields{display:grid;gap:14px}
.quote-next,.quote-submit{margin-top:12px;width:max-content;min-width:170px}
.quote-step .quote-area-note{margin:0;color:#65748a;font-size:13px;line-height:1.4}
.quote-step .quote-submit{min-width:240px;padding:18px 26px;font-size:18px;font-weight:800}
.quote-back{background:transparent;border:0;color:#287c2b;text-decoration:underline;padding:17px 0 0;cursor:pointer}
.quote-step label.quote-consent{display:grid;grid-template-columns:18px minmax(0,1fr);align-items:start;column-gap:10px;width:100%;font-size:13px;font-weight:400;line-height:1.45;color:#65748a;margin:28px 0 0;cursor:pointer}
.quote-step .quote-consent input{grid-column:1;display:block;width:18px;height:18px;min-height:0;padding:0;margin:1px 0 0;accent-color:#287c2b}
.quote-step .quote-consent span{grid-column:2;font-size:13px;font-weight:400}
.quote-consent a,.inline-quote{text-decoration:underline;text-underline-offset:2px}
.inline-quote{color:#16702b;font-weight:800}
.inline-quote:hover{color:#173b70}
.inline-quote:focus-visible{outline:3px solid #1f7b2b;outline-offset:3px;border-radius:2px}
.home-buyer-faq{background:#f7faf3}
.home-faq-inner{max-width:1220px}
.home-faq-inner>.intro{max-width:980px}
.home-faq-list{margin-top:28px;border-bottom:1px solid #dce7d7}
.home-faq-list article{display:grid;grid-template-columns:minmax(220px,31%) minmax(0,1fr);gap:30px;align-items:start;border-top:1px solid #dce7d7;padding:21px 0}
.home-faq-list h3{margin:0;color:#173b70;font-size:22px;line-height:1.28}
.home-faq-list p{margin:0;line-height:1.55}
@media(max-width:760px){.home-faq-list article{grid-template-columns:1fr;gap:10px;padding:19px 0}.home-faq-list h3{font-size:21px}}
.postcode-entry{display:grid;gap:11px}
.postcode-entry label{font-weight:700;font-size:15px}
.postcode-entry input{width:100%;padding:16px;border:1px solid #b7cbdc;border-radius:9px;font:inherit;color:#173b70}
.postcode-entry .btn{width:100%;border:0;cursor:pointer}
.quote-error{color:#9b2d2d;font-size:14px;margin-top:15px}
.quote-thanks{padding:12px 0 18px}
.quote-thanks p{font-size:17px}
.quote-slide-forward .quote-step{animation:quote-in-forward .2s ease-out}
.quote-slide-back .quote-step{animation:quote-in-back .2s ease-out}
@keyframes quote-in-forward{from{opacity:.4;transform:translateX(15px)}to{opacity:1;transform:translateX(0)}}
@keyframes quote-in-back{from{opacity:.4;transform:translateX(-15px)}to{opacity:1;transform:translateX(0)}}
@media(max-width:760px){.quote-dialog{padding:22px 18px}.quote-form h2{font-size:27px}.quote-option{padding:15px}.quote-step .quote-submit{width:100%}}
@media(prefers-reduced-motion:reduce){.quote-slide-forward .quote-step,.quote-slide-back .quote-step{animation:none}.quote-progress-bar span{transition:none}}
/* Postcode area finder, separate from the gated lead form. */
.area-lookup{display:grid;gap:11px;max-width:490px}
.area-lookup label{font-size:15px;font-weight:700}
.area-lookup input{width:100%;min-width:0;padding:15px 16px;border:1px solid #b7cbdc;border-radius:9px;background:#fff;color:#173b70;font:inherit}
.area-lookup .btn{width:100%;border:0;cursor:pointer}
.area-lookup .btn:disabled{opacity:.68;cursor:wait}
.area-lookup-note{font-size:12px;line-height:1.5;color:#536d83;margin:0}
.area-lookup-error{color:#9b2d2d;font-size:14px;margin:0}
.area-lookup-inline{font-size:14px;margin:0}
.area-finder-intro .area-lookup{margin-top:26px}
.area-result[hidden]{display:none}
.area-result{background:#eff7fb;border-top:1px solid #d5e5ed;border-bottom:1px solid #d5e5ed}
.area-result h2{margin-top:0}
.area-result-links{display:flex;flex-wrap:wrap;gap:12px;margin:23px 0}
.area-result-links a{display:inline-flex;align-items:center;padding:12px 16px;border:1px solid #cbdce6;border-radius:8px;background:#fff;color:#173b70;font-weight:700;text-decoration:none}
.area-result-links a:hover,.area-result-links a:focus-visible{border-color:#287c2b}
@media(max-width:760px){.area-result-links{display:grid}.area-result-links a{width:100%}}
/* The area finder follows the compact US directory hierarchy while keeping
   postcode-to-reviewed-place routing separate from service quote entry. */
.area-directory-hero{position:relative;overflow:hidden;background:linear-gradient(115deg,#f1f9fe,#eff7ff 60%,#f4fbef);padding:32px 0}
.area-directory-hero::after{content:"";position:absolute;width:460px;height:460px;right:-220px;top:-330px;border-radius:50%;background:#dceefd;opacity:.55;pointer-events:none}
.area-directory-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.5fr 1fr;gap:50px;align-items:center}
.area-directory-grid>div,.area-search-field{min-width:0}
.area-directory-grid h1{font:800 42px/1.15 'Plus Jakarta Sans',Manrope,Arial,sans-serif;letter-spacing:-1.5px;margin:0 0 20px}
.area-directory-grid h1 em{font-style:normal;color:#287c2b}
.area-directory-grid .lead{max-width:710px;color:#526b7d;font-size:18px;font-weight:400;line-height:1.55;margin:0}
.area-project-choices>p{font-weight:700;color:#287c2b;margin:0 0 16px}
.area-project-choices>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.area-project-choices a{display:flex;align-items:center;justify-content:center;gap:9px;min-height:55px;padding:11px;background:#fff;border:1px solid #d6e3ce;border-radius:12px;text-align:center;text-decoration:none;color:#173b70;font-size:14px;font-weight:700}
.area-project-choices a:last-child{grid-column:1/-1}
.area-project-choices a:hover,.area-project-choices a:focus-visible{border-color:#287c2b;background:#f9fff6}
.area-project-choices svg{width:25px;height:25px;flex:none}
.area-directory-main{background:#fff;padding-top:52px}
.area-search-panel{padding:27px 30px;background:#fffbea;border-radius:21px}
.area-directory-lookup{display:grid;grid-template-columns:minmax(180px,1fr) minmax(220px,1.4fr) auto;gap:14px;align-items:end;max-width:none}
.area-search-field label{display:block;font-size:14px;font-weight:700;margin-bottom:7px}
.area-directory-lookup select,.area-directory-lookup input{display:block;width:100%;height:58px;padding:12px 16px;border:1px solid #b7cbdc;border-radius:8px;background:#fff;color:#173b70;font:inherit}
.area-directory-lookup .btn{height:58px;width:auto;padding:0 22px;white-space:nowrap;background:#243a74}
.area-directory-lookup .area-lookup-error{grid-column:1/-1}
.area-method{max-width:1050px;margin:13px 0 0;color:#607184;font-size:12px;line-height:1.5}
.area-method small{display:block;font-size:10px;margin-top:3px}
.area-directory-main .area-result{background:#eff7fb;border:1px solid #d5e5ed;border-radius:18px;padding:26px 29px;margin:27px 0 39px}
.area-directory-main .area-result .eyebrow{margin-bottom:10px}
.area-directory-main .area-result h2{font-size:30px;margin-bottom:10px}
.area-directory-main .area-result p:not(.eyebrow){max-width:960px;color:#526b7d;margin-bottom:18px}
.area-directory-main .area-result-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0}
.area-result-item{display:flex;flex-direction:column;align-items:flex-start;gap:7px;min-width:0;padding:17px;background:#fff;border:1px solid #cbdce6;border-radius:10px}
.area-result-item>a{display:block;padding:0;border:0;background:none;text-decoration:underline;text-underline-offset:3px}
.area-result-quote{padding:0;border:0;background:none;color:#287c2b;font:700 14px 'DM Sans',Arial,sans-serif;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.area-result-quote:hover{color:#173b70}
.area-directory-intro{margin-top:50px;max-width:900px}
.area-directory-intro h2{font-size:34px}
.area-directory-intro p{color:#526b7d}
.area-directory-intro a{color:#287c2b;font-weight:700;text-decoration:underline}
@media(max-width:1000px){.area-directory-grid{grid-template-columns:1fr;gap:20px}.area-project-choices{max-width:570px}.area-directory-lookup{grid-template-columns:1fr 1fr}.area-directory-lookup .btn{grid-column:1/-1;width:100%}}
@media(max-width:760px){.area-directory-hero{padding:28px 0}.area-directory-grid h1{font-size:34px}.area-directory-grid .lead{font-size:16px}.area-project-choices>div{gap:7px}.area-project-choices a{font-size:13px;min-height:50px;padding:9px 5px}.area-project-choices svg{width:23px;height:23px}.area-directory-main{padding-top:28px}.area-search-panel{padding:20px 18px}.area-directory-lookup{grid-template-columns:1fr;gap:11px}.area-directory-lookup .btn{grid-column:1}.area-directory-main .area-result{padding:21px 18px}.area-directory-main .area-result-links{grid-template-columns:1fr}.area-directory-intro{margin-top:37px}.area-directory-intro h2{font-size:29px}}
.place-intro{padding:48px 0 44px}
.place-intro h1{max-width:990px}
.place-intro .intro{max-width:900px;font-size:18px;line-height:1.65}
.place-copy .place-photo{display:block;width:100%;height:255px;object-fit:cover;border-radius:14px;margin:0 0 27px}
.place-copy h2:first-of-type{margin-top:0}
.place-copy .place-source{font-size:14px;border-left:3px solid #4aaa39;padding-left:14px}
.place-directory{background:#f7fbf3}
.place-directory h3{margin:23px 0 12px}
@media(max-width:760px){.place-intro{padding:34px 0}.place-copy .place-photo{height:185px}.place-directory .chips{display:grid}.place-directory .chips a{display:block}}
@media(min-width:761px) and (max-width:900px){.foot{padding-bottom:88px}.mobile-bar{display:flex;position:fixed;bottom:0;left:0;right:0;align-items:center;justify-content:space-between;gap:12px;background:#b9df8e;border-top:1px solid #8fbd69;padding:8px 24px;z-index:9;font-size:12px;color:#173b70}.mobile-bar .btn{padding:10px 15px;font-size:13px}}