/* Reference artwork is framed in CSS; controls and text remain live HTML. */
:root{--ink:#f6faff;--muted:#a9d7f4;--line:#245c8d;--shadow:0 16px 45px #00102d55}
body{font-family:"Segoe UI",Arial,sans-serif;color:#f5f8ff;background:radial-gradient(ellipse at 55% -6%,#153a72 0,transparent 51%),radial-gradient(ellipse at 8% 55%,#063268 0,transparent 32%),#061a3d;isolation:isolate}
body:before,body:after{content:"";position:fixed;z-index:-1;pointer-events:none;border-radius:48%;transform:rotate(-25deg)}
body:before{width:430px;height:215px;left:-170px;top:29%;background:linear-gradient(140deg,#144778,#0a2452)}
body:after{width:650px;height:220px;right:-170px;bottom:-170px;background:linear-gradient(125deg,#059292,#075faa 45%,#173966)}
h1,h2,h3,button{font-family:"Segoe UI",Arial,sans-serif}
.site-header{height:clamp(96px,8.7vw,126px);min-height:clamp(96px,8.7vw,126px);padding:0 5.5%;position:relative;background:#f5f6f7;border:0;overflow:visible;z-index:2}
.site-header:after{content:"";position:absolute;bottom:-18px;left:0;width:100%;height:36px;border-radius:0 0 50% 50%;background:#f5f6f7;box-shadow:0 9px 14px -9px #b8d9f566;z-index:-1}
.reference-art{position:relative;display:block;overflow:hidden;aspect-ratio:var(--crop-w)/var(--crop-h);flex-shrink:0}
.reference-art img{position:absolute;width:calc(1312 / var(--crop-w) * 100%);max-width:none;height:auto;left:calc(-100% * var(--crop-x) / var(--crop-w));top:calc(-100% * var(--crop-y) / var(--crop-h));pointer-events:none}
.brand{display:block;width:310px;z-index:2}.brand-art{width:100%;opacity:1;mix-blend-mode:multiply}
.header-landscape{display:block;position:absolute;right:0;top:0;width:54%;height:100%;background:#f5f6f7;border-bottom-left-radius:100px;pointer-events:none}
.header-landscape img{display:none}
.header-cta{position:absolute;right:30px;top:144px;z-index:3;box-shadow:none;background:#0b3561;color:#d1e7ff;font-size:12px;padding:11px 18px;border:1px solid #174371}
.journey{width:min(1210px,calc(100% - 96px));margin:16px auto 22px;display:flex;flex-direction:column;position:relative;flex:1}
.progress{order:-1;align-self:center;justify-content:center;margin:0 0 20px;min-height:70px;gap:35px}
.progress li{position:relative;display:flex;flex-direction:column;gap:7px;font-weight:400;font-size:13px;color:#c2dcf5;min-width:80px}
.progress li:after{content:"";height:1px;width:50px;background:#6482ae;position:absolute;left:calc(100% + 2px);top:19px;margin:0}
.progress .number{width:37px;height:37px;background:#0b2146;border:2px solid #6a82ab;box-shadow:inset 0 0 8px #5b85bf22;border-radius:50%;font-size:20px;color:#e6f2ff}
.progress [aria-current=step]{color:#d2eaff}.progress [aria-current=step] .number{background:linear-gradient(#1eafff,#2464ff);border-color:#fff;box-shadow:0 0 0 3px #1d67fba8,inset 0 0 9px #cbf9ff}
.progress .completed{color:#91dcdc}.progress .completed .number{color:#8ef1db;border-color:#269baf}
.journey-banner{background:none;border-radius:0;min-height:0;text-align:center;overflow:visible;margin-bottom:22px}
.banner-copy{padding:0;width:100%;z-index:0}.banner-copy .eyebrow,.journey-banner .hero-art{display:none}
.banner-copy h1{color:#fff;font-size:clamp(30px,4vw,49px);font-weight:750;line-height:1.2;letter-spacing:-1px}.banner-copy h1 span{color:#68d0f9;text-shadow:0 2px 2px #08142b}
.banner-copy p:last-child{font-size:20px;line-height:1.45;max-width:780px;margin:13px auto 0;color:#a2d7f7}
.boiler-grid{gap:23px}.boiler-card{display:flex;flex-direction:column;position:relative;padding:20px 28px 24px;border:1px solid #1475a650;border-radius:28px;box-shadow:inset 0 0 30px #1877ae17,0 18px 45px #00163135;background:radial-gradient(ellipse at 25% 50%,#104b88,#0a2c58)!important;color:#f7faff;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.boiler-card.aqua{background:radial-gradient(ellipse at 30% 50%,#0b5678,#082c57)!important;border-color:#0783997a}
.boiler-card.lime{background:radial-gradient(ellipse at 40% 40%,#252b8f,#141d57)!important;border-color:#4658d57a}
.boiler-card:before{display:none}.boiler-card:hover{transform:translateY(-7px) scale(1.012) rotate(-.25deg);border-color:#49baf1;box-shadow:0 20px 45px #000b2699,0 0 30px #1088e32b}
.boiler-card.aqua:hover{border-color:#20c7b3;box-shadow:0 20px 45px #000b2699,0 0 30px #00c9a82b}.boiler-card.lime:hover{border-color:#7c65f7;box-shadow:0 20px 45px #000b2699,0 0 30px #663afc3b}
.worcester-mark{width:145px;max-width:55%;margin-bottom:7px;mix-blend-mode:lighten}
.boiler-card h3{font-size:26px;font-weight:700;line-height:1.15;letter-spacing:-.45px}
.boiler-card .boiler-subtitle{font-size:18px;color:#e4f5ff;font-weight:600;margin:4px 0 -10px;position:relative;z-index:1}
.product-illustration{width:calc(100% + 14px);margin:0 -7px 8px;clip-path:polygon(0 8%,38% 8%,38% 0,100% 0,100% 100%,0 100%);mask-image:linear-gradient(to bottom,#000 88%,transparent),linear-gradient(to right,transparent,#000 4%,#000 96%,transparent);mask-composite:intersect;transition:transform .35s ease}
.boiler-card:hover .product-illustration{transform:translateY(-3px) scale(1.012)}
.generated-boiler{display:block;position:relative;aspect-ratio:335/282;clip-path:none;overflow:hidden;mask-image:linear-gradient(to bottom,transparent,#000 6%,#000 92%,transparent),linear-gradient(to right,transparent,#000 5%,#000 95%,transparent);mask-composite:intersect}
.generated-boiler img{display:block;width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.boiler-image-select{border:0;padding:0;background:transparent;cursor:pointer;flex-shrink:0}
.boiler-card[data-boiler]{cursor:pointer}
.boiler-image-select:focus-visible{mask-image:none;outline:3px solid #a1edff;outline-offset:-4px;border-radius:16px}
.boiler-features{list-style:none;padding:0;margin:0 0 17px;font-size:13px;color:#e0f1ff;line-height:1.35;display:grid;gap:7px}
.boiler-features li{display:flex;align-items:center;gap:12px}.boiler-features li span{display:grid;place-items:center;border-radius:50%;width:23px;height:23px;background:linear-gradient(135deg,#9ce4ff,#59bbf1);color:#16416d;font-size:17px;font-weight:bold;flex-shrink:0}
.price-block{display:flex;flex-direction:column;margin-top:auto;margin-bottom:15px;padding-left:4px}.price-block>span{color:#b0e6ff;font-size:18px;font-weight:600}
.price-block strong{font-size:42px;line-height:1.05;letter-spacing:-.5px}.price-block small{font-size:12px;color:#e0efff;margin-top:5px}
.select-boiler,.button.primary{border:1px solid #4dadff;background:linear-gradient(160deg,#0fb6f1,#2460ff);border-radius:36px;box-shadow:inset 0 1px 0 #ffffff40,0 8px 22px #062b7470;color:white;font-size:16px;font-weight:600;padding:18px 22px;min-height:58px}
.select-boiler{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%}.select-boiler span{font-size:28px;line-height:.7}
.aqua .select-boiler{background:linear-gradient(135deg,#00c8ae,#009f8d);border-color:#07cdba}.lime .select-boiler{background:linear-gradient(135deg,#8144ff,#5e20dc);border-color:#8960f8}
[data-screen=boiler]>.step-actions{position:absolute;left:0;top:8px;margin:0}
.back-button{background:linear-gradient(130deg,#0e406e,#092b54);color:#f4faff;border:1px solid #174775;border-radius:28px;font-size:14px;padding:12px 20px;font-weight:600}
.assurance-bar{width:min(970px,94%);align-self:center;display:grid;grid-template-columns:repeat(4,1fr);padding:14px 18px;margin:22px auto 0;border:1px solid #14629c66;border-radius:45px;background:linear-gradient(100deg,#082c5c,#06224b);box-shadow:inset 0 0 22px #1961a119}
.assurance-bar>div{display:flex;align-items:center;gap:17px;justify-content:center;font-size:13px;line-height:1.4;border-right:1px solid #345d8e}.assurance-bar>div:last-child{border:0}.assurance-bar>div>span{font-size:36px;color:#edf8ff}
.service-grid{gap:24px}.service-card{color:white;border:1px solid #2585b15c;border-radius:26px;box-shadow:inset 0 0 35px #59c6ef0a,0 10px 35px #000d3033;min-height:290px}
.service-card.teal{background:radial-gradient(at top left,#11597e,#092d56)}.service-card.blue{background:radial-gradient(at top left,#153c8c,#102253)}.service-card.green{background:radial-gradient(at top left,#214790,#20144f)}
.service-card small{color:#b3d8f6;line-height:1.6}.service-icon{color:#78d9ff;font-size:47px}.service-card strong{font-size:26px}.circle-arrow{background:linear-gradient(#26bcfd,#2063f5);color:white;width:43px;height:43px}.service-card:hover{box-shadow:0 18px 40px #000c3555,0 0 24px #0d80d12b}
.narrow-screen{width:min(660px,100%);background:linear-gradient(130deg,#10376a,#072749);border:1px solid #22648f;border-radius:27px;padding:27px 32px;color:white}
.summary{background:#081f47;color:#a8dcff;border:1px solid #185584;border-radius:13px;padding:14px 16px;font-size:14px}
.calendar-head h2{color:white}.calendar-head button{background:#164778;color:#d4efff}.calendar-head button:disabled{opacity:.3;cursor:not-allowed}
.calendar-weekdays{color:#a0c6e4}.calendar{gap:7px}.calendar button{color:#d8edff;background:#163e69;font-size:15px;border:1px solid #24619066;min-height:43px;border-radius:11px}
.calendar button:disabled{opacity:.35;color:#91aac4;background:#102d54}.calendar button:hover:not(:disabled),.calendar button.selected{background:linear-gradient(145deg,#13abef,#235cfc);box-shadow:0 0 15px #078af754;color:white;border-color:#8ddaff}
.slots-wrap{color:#bde5fa;border-color:#316085;font-size:14px}.slot-buttons button{color:#d9efff;background:#10315d;border-color:#2c6d98;padding:12px 17px}.slot-buttons button.selected{background:#007e79;color:white;border-color:#1bddc1}.next-button:disabled,.button.primary:disabled{background:#2c456c;color:#a0b2ca;border-color:#3e5a7c;box-shadow:none}
label{color:#c9e9ff;font-size:13px}input,textarea{background:#081e43;border-color:#2c5d85;color:#f4faff;border-radius:12px;padding:12px}input::placeholder,textarea::placeholder{color:#809ebe}.success p{color:#b3dafa}.success-mark{background:#074e57;color:#77ffdf}
footer{background:transparent;color:#90b4d5;font-size:11px;padding:5px 5% 20px}.screen:focus{outline:none}
:focus-visible{outline:3px solid #a1edff;outline-offset:4px}
.select-boiler,input,textarea,.calendar button,.slot-buttons button{font-family:"Segoe UI",Arial,sans-serif}
.assurance-bar svg{width:36px;height:36px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.worcester-logo{display:block;width:145px;height:47px;margin-bottom:7px}
@media(max-width:1050px){.journey{width:calc(100% - 48px)}.boiler-card{padding:20px}.boiler-card h3{font-size:22px}.boiler-features{font-size:11px;gap:6px}.select-boiler{font-size:13px;padding:16px}.banner-copy p:last-child{max-width:650px;font-size:17px}.header-cta{right:24px}.progress{gap:18px}.progress li:after{width:24px}.assurance-bar>div{font-size:11px;gap:9px}}
@media(max-width:760px){.site-header{height:96px;min-height:96px;padding:0 18px}.brand{width:230px}.header-landscape{width:45%;height:107px;opacity:.8}.header-cta{top:112px;right:14px;font-size:10px;padding:9px 12px}.journey{width:calc(100% - 28px);margin-top:58px}.progress{gap:9px;min-height:64px;margin-bottom:13px}.progress li{min-width:66px;font-size:11px;gap:6px}.progress li:after{width:15px;left:calc(100% - 4px);top:15px}.progress .number{width:31px;height:31px;font-size:16px}.banner-copy{width:100%;padding:0}.banner-copy h1{font-size:31px}.banner-copy p:last-child{font-size:15px;line-height:1.5;margin-top:12px}.journey-banner{margin-bottom:23px}.boiler-grid{gap:19px}.boiler-card{max-width:430px;width:100%;margin:0 auto;padding:22px 27px;border-radius:26px}.boiler-card h3{font-size:27px}.product-illustration{width:100%;margin:0 0 10px}.boiler-card .boiler-subtitle{font-size:18px}.boiler-features{font-size:13px;gap:8px}.select-boiler{font-size:16px;min-height:59px}.price-block strong{font-size:42px}.boiler-card>div:last-child{clear:none}.service-card{min-height:205px;padding:26px}.service-card strong{font-size:23px}.service-card small{font-size:13px}.service-icon{font-size:34px}.narrow-screen{padding:22px 18px}[data-screen=boiler]>.step-actions{top:-42px}.back-button{font-size:12px;padding:9px 14px}.assurance-bar{grid-template-columns:1fr 1fr;border-radius:24px;gap:15px 0;width:100%;padding:16px 8px}.assurance-bar>div{font-size:11px;gap:10px}.assurance-bar>div:nth-child(2){border:0}.assurance-bar>div>span{font-size:28px}.form-grid{grid-template-columns:1fr}.calendar button{min-height:36px;font-size:13px}.slot-buttons{flex-wrap:wrap}}

/* Warm, image-led service selection cards. */
[data-screen="service"] .service-grid{gap:24px;align-items:stretch}
[data-screen="service"] .service-card{display:flex;flex-direction:column;min-height:440px;padding:0 28px 27px;overflow:hidden;border:1px solid #83cbea75;border-radius:30px;background:#f8fcff;color:#082b5f;box-shadow:0 18px 45px #00163338;isolation:isolate}
[data-screen="service"] .service-card::after{content:"";position:absolute;inset:auto -20% -55% -20%;height:70%;border-radius:50%;background:linear-gradient(145deg,#e7f7ff,#fff);z-index:-1}
[data-screen="service"] .service-card-visual{display:block;height:198px;margin:0 -28px 20px;overflow:hidden;background:linear-gradient(145deg,#0d4e8c,#0b7890);border-radius:29px 29px 48% 42%/29px 29px 22% 18%}
[data-screen="service"] .service-card.blue .service-card-visual{background:linear-gradient(145deg,#0b607c,#0c928e)}
[data-screen="service"] .service-card.green .service-card-visual{background:linear-gradient(145deg,#143d86,#3059c6)}
.service-card-visual svg{width:100%;height:100%;display:block}.service-card-visual circle{fill:#ffd487}.service-card-visual .hill-back{fill:#159595}.service-card-visual .hill-front{fill:#0c6072}.service-card-visual .roof{fill:#142e66}.service-card-visual .home{fill:#d9eef3}.service-card-visual .door{fill:#124576}.service-card-visual .window{fill:#ffd894;filter:drop-shadow(0 0 8px #ffd894)}.service-card-visual .tree{fill:none;stroke:#48b68b;stroke-width:10;stroke-linecap:round}.service-card-visual .boiler{fill:#f8fbfd;stroke:#d6e4eb;stroke-width:3;filter:drop-shadow(9px 12px 10px #001d3c55)}.service-card-visual .dial{fill:#13283d;stroke:#78a3bd;stroke-width:5}.service-card-visual .tool{fill:none;stroke:#d7f6fb;stroke-width:9;stroke-linecap:round;stroke-linejoin:round}
[data-screen="service"] .service-icon{position:absolute;top:166px;left:28px;display:grid;place-items:center;width:58px;height:58px;margin:0;border:4px solid #f8fcff;border-radius:50%;background:linear-gradient(145deg,#0b8fe1,#1e60de);color:#fff;font-size:28px;box-shadow:0 9px 23px #00377145}
[data-screen="service"] .service-card.blue .service-icon{background:linear-gradient(145deg,#08afaa,#078b85)}
[data-screen="service"] .service-card.green .service-icon{background:linear-gradient(145deg,#2dc378,#129f72)}
[data-screen="service"] .service-card strong{margin-top:16px;font-size:27px;line-height:1.15;color:#082b5f}
[data-screen="service"] .service-card small{margin:12px 0 24px;padding:0;color:#496d8c;font-size:14px;line-height:1.55}
[data-screen="service"] .service-card-link{margin-top:auto;color:#0870cb;font-size:14px;font-weight:800}
[data-screen="service"] .circle-arrow{right:25px;bottom:23px;width:42px;height:42px;background:#e5f3fc;color:#0566bb;font-size:23px}
[data-screen="service"] .service-card:hover{transform:translateY(-9px) scale(1.012);border-color:#78d8eb;box-shadow:0 27px 55px #00153455,0 0 27px #27b7dc2e}
[data-screen="service"] .service-card:hover .service-card-visual svg{transform:scale(1.035)}
.service-card-visual svg{transition:transform .35s ease}
@media(max-width:760px){[data-screen="service"] .service-card{min-height:390px;max-width:430px;width:100%;margin:auto;padding:0 24px 24px}[data-screen="service"] .service-card-visual{height:180px;margin:0 -24px 18px}[data-screen="service"] .service-icon{top:150px;left:24px}[data-screen="service"] .service-card strong{font-size:24px}}
@media(prefers-reduced-motion:reduce){.product-illustration{transition:none!important}.boiler-card:hover,.boiler-card:hover .product-illustration{transform:none}}
@media(max-width:760px){
  .site-header{background:#f5f6f7}
  .brand-art{opacity:1;mix-blend-mode:multiply}
  .header-landscape{display:block;position:absolute;right:0;top:0;width:42%;max-width:calc(100% - 266px);height:96px;opacity:1;overflow:hidden;border-bottom-left-radius:50px;pointer-events:none}
}

/* Product-group and secondary service navigation. */
[data-screen="category"] .service-grid,[data-screen="other"] .service-grid{gap:24px;align-items:stretch}
[data-screen="other"] .service-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:660px}
[data-screen="category"] .service-card,[data-screen="other"] .service-card{display:flex;flex-direction:column;min-height:440px;padding:0 28px 27px;overflow:hidden;border:1px solid #83cbea75;border-radius:30px;background:#f8fcff;color:#082b5f;box-shadow:0 18px 45px #00163338;isolation:isolate}
[data-screen="category"] .service-card::after,[data-screen="other"] .service-card::after{content:"";position:absolute;inset:auto -20% -55% -20%;height:70%;border-radius:50%;background:linear-gradient(145deg,#e7f7ff,#fff);z-index:-1}
[data-screen="category"] .service-card-visual,[data-screen="other"] .service-card-visual{display:block;height:198px;margin:0 -28px 20px;overflow:hidden;background:linear-gradient(145deg,#0d4e8c,#0b7890);border-radius:29px 29px 48% 42%/29px 29px 22% 18%}
[data-screen="category"] .service-card.blue .service-card-visual,[data-screen="other"] .service-card.blue .service-card-visual{background:linear-gradient(145deg,#0b607c,#0c928e)}
[data-screen="category"] .service-card.green .service-card-visual{background:linear-gradient(145deg,#143d86,#3059c6)}
[data-screen="category"] .service-icon,[data-screen="other"] .service-icon{position:absolute;top:166px;left:28px;display:grid;place-items:center;width:58px;height:58px;margin:0;border:4px solid #f8fcff;border-radius:50%;background:linear-gradient(145deg,#0b8fe1,#1e60de);color:#fff;font-size:28px;box-shadow:0 9px 23px #00377145}
[data-screen="category"] .service-card.blue .service-icon,[data-screen="other"] .service-card.blue .service-icon{background:linear-gradient(145deg,#08afaa,#078b85)}
[data-screen="category"] .service-card.green .service-icon{background:linear-gradient(145deg,#2dc378,#129f72)}
[data-screen="category"] .service-card strong,[data-screen="other"] .service-card strong{margin-top:16px;font-size:27px;line-height:1.15;color:#082b5f}
[data-screen="category"] .service-card small,[data-screen="other"] .service-card small{margin:12px 0 24px;padding:0;color:#496d8c;font-size:14px;line-height:1.55}
[data-screen="category"] .service-card-link,[data-screen="other"] .service-card-link{margin-top:auto;color:#0870cb;font-size:14px;font-weight:800}
[data-screen="category"] .circle-arrow,[data-screen="other"] .circle-arrow{right:25px;bottom:23px;width:42px;height:42px;background:#e5f3fc;color:#0566bb;font-size:23px}
[data-screen="category"] .service-card:hover,[data-screen="other"] .service-card:hover{transform:translateY(-9px) scale(1.012);border-color:#78d8eb;box-shadow:0 27px 55px #00153455,0 0 27px #27b7dc2e}
[data-screen="other"]>.step-actions{position:absolute;left:0;top:8px;margin:0}
.cylinder-shape{fill:#f7fbfd;stroke:#d7e7ed;stroke-width:4;filter:drop-shadow(9px 12px 10px #001d3c55)}
.gauge{fill:#12304a;stroke:#72d5df;stroke-width:4}.pipe-line{fill:none;stroke:#d7f6fb;stroke-width:9;stroke-linecap:round;stroke-linejoin:round}.radiator-shape{fill:#f7fbfd;stroke:#d6edf2;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(8px 11px 8px #001d3c55)}.valve{fill:none;stroke:#d7f6fb;stroke-width:8;stroke-linecap:round}
.cylinder-system-art{display:none!important}body[data-booking-category="cylinder"] [data-screen="service"] .boiler-system-art{display:none!important}body[data-booking-category="cylinder"] [data-screen="service"] .cylinder-system-art{display:block!important}
@media(max-width:760px){[data-screen="other"] .service-grid{grid-template-columns:1fr}[data-screen="category"] .service-card,[data-screen="other"] .service-card{min-height:390px;max-width:430px;width:100%;margin:auto;padding:0 24px 24px}[data-screen="category"] .service-card-visual,[data-screen="other"] .service-card-visual{height:180px;margin:0 -24px 18px}[data-screen="category"] .service-icon,[data-screen="other"] .service-icon{top:150px;left:24px}[data-screen="category"] .service-card strong,[data-screen="other"] .service-card strong{font-size:24px}[data-screen="other"]>.step-actions{top:-42px}}
