/* The Household Daily — theme additions on top of the ported prototype CSS (legacy.css). */

/* Hero slideshow: slow crossfade, no controls */
.hero-v4 .hero-image.hd-slideshow{position:relative;overflow:hidden;background:#dfe7e1}
.hero-v4 .hero-image.hd-slideshow .hd-slide{position:absolute;inset:0;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important;object-position:center;opacity:0;transform:scale(1.04);transition:opacity 1.8s ease-in-out,transform 7s ease-out;will-change:opacity,transform}
.hero-v4 .hero-image.hd-slideshow .hd-slide.is-active{opacity:1;transform:scale(1)}
.hero-v4 .hero-image.hd-slideshow::before{z-index:2}
@media (prefers-reduced-motion:reduce){.hero-v4 .hero-image.hd-slideshow .hd-slide{transition:none;transform:none}}
/* Brand wordmark */
.logo{display:inline-flex;align-items:center;line-height:0;text-decoration:none}
.hd-logo-img{display:block;width:auto;height:54px;max-width:100%}
.mast .logo{flex:0 0 auto}
.footer-v5 .logo{display:inline-flex;margin-bottom:17px}
.footer-v5 .hd-logo-img{height:46px}
@media (max-width:850px){.hd-logo-img{height:40px}.footer-v5 .hd-logo-img{height:40px}}
@media (max-width:420px){.hd-logo-img{height:34px}}
/* Header area switcher */
.head-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:flex-end}
.hd-area-switch{position:relative}
.hd-area-btn{display:inline-flex;align-items:center;gap:8px;background:#eaf5ef;border:1px solid #cfe3d7;color:#143e35;border-radius:50px;padding:9px 14px;font:700 13px/1.2 Arial,Helvetica,sans-serif;cursor:pointer;max-width:220px}
.hd-area-btn .hd-pin{color:#d9774c;font-size:12px}
.hd-area-btn .hd-area-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hd-area-btn .nav-chevron{display:inline-block;width:7px;height:7px;border-right:1.8px solid currentColor;border-bottom:1.8px solid currentColor;transform:rotate(45deg);margin-top:-3px}
.hd-area-menu{position:absolute;right:0;top:calc(100% + 10px);width:min(560px,92vw);background:#fff;border:1px solid #dbe5df;border-radius:14px;box-shadow:0 18px 50px rgba(20,62,53,.16);padding:18px;z-index:60;text-align:left}
.hd-area-menu[hidden]{display:none}
.hd-area-menu-head{display:flex;flex-direction:column;gap:3px;margin:4px 0 10px}
.hd-area-menu-head strong{font-family:Georgia,serif;font-size:18px;color:#173e34}
.hd-area-menu-head span{font-size:12px;color:#66746f}
.hd-area-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-bottom:12px}
.hd-area-grid a{display:block;padding:9px 10px;border:1px solid #e1e9e4;border-radius:9px;font-size:13px;color:#173e34;text-decoration:none;background:#fbfaf7}
.hd-area-grid a:hover{border-color:#143e35}
.hd-area-grid a.is-current{background:#143e35;color:#fff;border-color:#143e35}
.hd-area-grid-regions a{font-size:12px;color:#466158}
.hd-area-all{display:inline-block;font-size:13px;font-weight:700;color:#143e35;text-decoration:none;margin-top:4px}
@media (max-width:850px){.hd-area-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hd-area-switch{position:static}.hd-area-menu{position:fixed;left:3%;right:auto;top:88px;width:94%;max-height:75vh;overflow-y:auto}.hd-area-btn{max-width:160px}}
@media (max-width:620px){.head-actions .textlink{display:none}}
/* Area prompt band on the homepage */
.hd-area-prompt{background:#143e35;color:#fff;padding:34px 0}
.hd-area-prompt[hidden]{display:none}
.hd-area-prompt .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:28px;align-items:center}
.hd-area-prompt .eyebrow{color:#b1dac3}
.hd-area-prompt h2{font-family:Georgia,serif;font-size:clamp(26px,3vw,38px);margin:8px 0 10px;color:#fff;line-height:1.15}
.hd-area-prompt p{color:#d7e9df;line-height:1.6;margin:0}
.hd-area-prompt .hd-area-chips a{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.25);color:#fff}
.hd-area-prompt .hd-area-chips a:hover,.hd-area-prompt .hd-area-chips a.is-current{background:#fff;color:#143e35;border-color:#fff}
@media (max-width:850px){.hd-area-prompt .wrap{grid-template-columns:1fr}}
/* Area chips */
.hd-area-chips{display:flex;flex-wrap:wrap;gap:8px}
.hd-area-chips a{display:inline-block;padding:9px 14px;border:1px solid #cfe3d7;border-radius:50px;background:#eaf5ef;color:#143e35;text-decoration:none;font:700 13px/1.2 Arial,Helvetica,sans-serif}
.hd-area-chips a:hover,.hd-area-chips a.is-current{background:#143e35;color:#fff;border-color:#143e35}
.hd-area-chips-lg a{padding:12px 18px;font-size:14px}
/* Area cards */
.hd-area-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.hd-area-card{display:flex;flex-direction:column;gap:8px;padding:20px;background:#fff;border:1px solid #dbe5df;border-radius:12px;text-decoration:none;color:#173e34;min-width:0}
.hd-area-card strong{font-family:Georgia,serif;font-size:21px}
.hd-area-card span{font-size:14px;color:#4d685e;line-height:1.5}
.hd-area-card small{font-size:12px;font-weight:700;color:#268062;margin-top:auto}
.hd-area-card:hover{border-color:#143e35}
@media (max-width:980px){.hd-area-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.hd-area-cards{grid-template-columns:1fr}}
/* Service strip (hub pages) */
.hd-service-strip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}
.hd-strip-item{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 8px;background:#fff;border:1px solid #dbe5df;border-radius:12px;text-decoration:none;color:#173e34;text-align:center;font:700 12px/1.3 Arial,Helvetica,sans-serif}
.hd-strip-item img{width:46px;height:46px;object-fit:contain}
.hd-strip-item:hover,.hd-strip-item.is-active{border-color:#143e35;background:#eaf5ef}
@media (max-width:980px){.hd-service-strip{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:520px){.hd-service-strip{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* Edition bar (global + local editions of the hub) */
.hd-edition{background:#143e35;color:#fff;padding:34px 0}
.hd-edition[hidden]{display:none}
.hd-edition .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:30px;align-items:center}
.hd-edition .eyebrow{color:#b1dac3}
.hd-edition h2{font-family:Georgia,serif;font-size:clamp(25px,3vw,36px);margin:8px 0 10px;color:#fff;line-height:1.15}
.hd-edition p{color:#d7e9df;line-height:1.6;margin:0;max-width:52ch}
.hd-edition .hd-area-chips a{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.28);color:#fff}
.hd-edition .hd-area-chips a:hover,.hd-edition .hd-area-chips a.is-current{background:#fff;color:#143e35;border-color:#fff}
.hd-edition .hd-chip-plain{background:transparent;border-color:#f3bf41;color:#f3bf41}
@media (max-width:850px){.hd-edition .wrap{grid-template-columns:1fr}}
/* Service tiles: tick inline with the label, CTA pinned to the bottom so rows line up */
.v11-service-grid{align-items:stretch}
.v11-service-tile{position:relative;display:flex;flex-direction:column;gap:6px;padding:18px 18px 18px 44px;min-height:100%;transition:border-color .2s}
.v11-service-tile:before{position:absolute;left:18px;top:18px;line-height:1.35}
.v11-service-tile strong{font-size:16px;line-height:1.35;color:#173e34}
.v11-service-tile span{margin-top:auto;padding-top:10px}
.v11-service-tile:hover{border-color:#143e35}
/* Service hero: .wrap was zeroing the panel's vertical padding, so content sat on the border */
section.v11-service-hero.wrap,.v11-service-hero{padding:clamp(28px,3.2vw,46px) clamp(24px,2.6vw,42px);align-items:start}
.v11-service-hero>div:first-child{display:flex;flex-direction:column;align-items:flex-start}
.v11-service-hero .btn{margin-top:6px}
/* Demonstration ad placements: room to breathe, never clipped in a narrow column */
.v11-ad{gap:20px;padding:22px 24px;align-items:center}
.v11-ad>div{min-width:0}
.v11-ad .v11-ad-label{display:block;margin-bottom:9px;line-height:1.4}
.v11-ad strong{display:block;margin-bottom:8px;line-height:1.3;overflow-wrap:anywhere}
.v11-ad p{margin:0;line-height:1.6;overflow-wrap:anywhere}
.v11-ad a{white-space:nowrap;align-self:center}
/* Wide ribbon placements: copy left, CTA right. A later prototype rule had forced one column. */
@media (min-width:761px){
	.hd-ad-ribbon .v11-ad,.v11-ad-ribbon .v11-ad,.v11-ad.v11-ad-wide{grid-template-columns:minmax(0,1fr) auto}
}
.v11-aside-stack .v11-ad,.sidebar .v11-ad{grid-template-columns:1fr!important;gap:14px}
.v11-aside-stack .v11-ad a,.sidebar .v11-ad a{justify-self:start;white-space:normal}
.hd-ad-ribbon,.v11-ad-ribbon{margin:34px auto 44px}
main>.hd-ad-ribbon:last-child,main>.v11-ad-ribbon:last-child{margin-bottom:56px}
/* Footer placement, after the locations block */
.hd-foot-ad{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center;margin:30px 0 6px;padding:22px 26px;border:1px solid rgba(255,255,255,.22);border-radius:12px;background:rgba(255,255,255,.05)}
.hd-foot-ad-copy{min-width:0}
.hd-foot-ad-label{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#9fc9b4;margin-bottom:8px}
.hd-foot-ad strong{display:block;font-family:Georgia,serif;font-size:21px;color:#fff;margin-bottom:7px;line-height:1.3}
.hd-foot-ad p{margin:0;color:#cfe3d8;font-size:14px;line-height:1.6;max-width:62ch}
.hd-foot-ad .btn{background:#f3bf41;color:#143e35;border-color:#f3bf41;white-space:nowrap}
@media (max-width:760px){.hd-foot-ad{grid-template-columns:1fr}.hd-foot-ad .btn{justify-self:start}}
/* Article hero photograph */
.hd-article-hero{margin:4px auto 10px}
.hd-article-hero img{width:100%;height:auto;aspect-ratio:1200/560;object-fit:cover;border-radius:14px;display:block;background:#eef4ef}
.hd-article-hero figcaption{margin-top:9px;font-size:12px;color:#7d8c86}
/* Article cards */
.hd-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.hd-card-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.hd-card{display:flex;flex-direction:column;background:#fff;border:1px solid #dbe5df;border-radius:12px;overflow:hidden;text-decoration:none;color:#173e34;min-width:0;transition:border-color .2s,transform .2s}
.hd-card:hover{border-color:#143e35;transform:translateY(-2px)}
.hd-card-visual{display:flex;align-items:center;justify-content:center;height:168px;background:#eef4ef;border-bottom:1px solid #e1e9e4;overflow:hidden}
.hd-card-visual img{width:100%;height:100%;object-fit:cover;display:block}
.hd-card-visual img.hd-card-sketch{width:64px;height:64px;object-fit:contain;opacity:.9}
.hd-card:hover .hd-card-visual img:not(.hd-card-sketch){transform:scale(1.03)}
.hd-card-visual img{transition:transform .4s ease}
.hd-card-body{display:flex;flex-direction:column;gap:8px;padding:18px}
.hd-card-body small{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#477b65;font-weight:800}
.hd-card-body strong{font-family:Georgia,serif;font-size:19px;line-height:1.25;color:#173e34}
.hd-card-excerpt{font-size:13px;color:#5a7167;line-height:1.55}
.hd-card-meta{font-size:12px;color:#8a9a93;margin-top:auto;padding-top:6px}
@media (max-width:980px){.hd-card-grid,.hd-card-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.hd-card-grid,.hd-card-grid-2{grid-template-columns:1fr}}
/* Pagination */
.pagination,.navigation.pagination{margin:28px 0 10px}
.nav-links{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.nav-links .page-numbers{display:inline-block;padding:9px 13px;border:1px solid #dbe5df;border-radius:8px;text-decoration:none;color:#173e34;font:700 13px/1 Arial,Helvetica,sans-serif;background:#fff}
.nav-links .page-numbers.current{background:#143e35;color:#fff;border-color:#143e35}
.hd-empty p{background:#fff8e6;border:1px solid #f0dca8;border-radius:10px;padding:14px 16px;color:#5a4a1e;font-size:14px;margin:0 0 18px}
/* Article body */
.hd-article-meta{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;color:#66746f;margin-top:12px}
.hd-article-meta span+span::before{content:'·';margin-right:14px;color:#b9c6bf}
.hd-article h2{font-family:Georgia,serif;font-size:clamp(24px,2.6vw,32px);color:#193a30;line-height:1.2;margin:34px 0 12px}
.hd-article h3{font-size:19px;color:#173e34;margin:24px 0 8px}
.hd-article p,.hd-article li{font-size:17px;line-height:1.8;color:#3e544b}
.hd-article ul,.hd-article ol{padding-left:22px;margin:0 0 18px}
.hd-article li{margin-bottom:8px}
.hd-article li strong{color:#173e34}
.hd-faq{margin:36px 0 26px;padding:24px;background:#eef4ef;border:1px solid #dbe5df;border-radius:12px}
.hd-faq h2{margin-top:0;font-size:24px}
.hd-faq details{border-top:1px solid #d6e1da;padding:12px 0}
.hd-faq details:first-of-type{border-top:0}
.hd-faq summary{cursor:pointer;font-weight:700;color:#173e34;font-size:16px;list-style:none;position:relative;padding-right:28px}
.hd-faq summary::after{content:'+';position:absolute;right:0;top:0;font-size:20px;color:#268062}
.hd-faq details[open] summary::after{content:'−'}
.hd-faq p{margin:10px 0 0;font-size:15px}
/* Hub hero tweak */
.hd-hub-hero .hero-copy h1{font-size:clamp(34px,4.4vw,58px)}
/* Mega menu blogs feature spacing */
.mega-feature strong{display:block;margin-bottom:6px}
/* Form draft result */
[data-draft] .btn{margin-top:10px}
.desk-result p{margin:0 0 8px;font-size:14px}
/* ---- Accessibility pass: contrast, legible label sizes, tap targets ---- */
/* Muted greys were failing 4.5:1 on cream */
.hd-card-meta{color:#5f726b}
.hd-article-hero figcaption{color:#5f726b}
.eyebrow{color:#2c6a50}
.urgency .eyebrow,.hd-edition .eyebrow,.final-cta .eyebrow,.v11-cta-box .v11-kicker{color:#b1dac3}
.hd-card-body small{font-size:11.5px;color:#36705a}
/* 10px labels were below a comfortable floor */
.v11-ad-label,.hd-foot-ad-label,.hd-ad-marker{font-size:11px!important;letter-spacing:.1em}
/* Standalone arrow links are not inline-in-sentence, so give them a real target */
a.arrow{display:inline-flex;align-items:center;gap:6px;min-height:30px}
.linklist a,.footer-locations a,.foot-top a:not(.logo){display:block;padding:4px 0}
.sect-head>a{display:inline-flex;align-items:center;min-height:30px}
@media (max-width:620px){
	.footer-locations a,.foot-top a{padding:7px 0}
	.breadcrumb a{display:inline-block;padding:4px 0}
}
/* WP admin bar offset */
.admin-bar .mega-menu{top:auto}
/* ============================================================
   v1.2.3 — Unified button system
   Measured before: four radii (6 / 7 / 8 / 50px), four heights
   (42 / 44 / 46 / 52px) and three font sizes across one service
   page. Sidebar CTAs were 206px and 136px wide, left-aligned, so
   their right edges never lined up. One scale now governs every
   in-page button; the header and mobile bar keep their pill.
   ============================================================ */
a.btn,button.btn,.btn,
.v11-ad>a,
.v11-cta-box a,
.hd-foot-ad .btn{
	display:inline-flex;align-items:center;justify-content:center;gap:8px;
	box-sizing:border-box;min-height:46px;padding:12px 22px;
	border:1px solid transparent;border-radius:8px;
	font-family:Arial,Helvetica,sans-serif;font-size:14px;font-weight:700;
	line-height:1.2;text-align:center;text-decoration:none;white-space:nowrap;
	transition:background-color .18s ease,border-color .18s ease;
}
/* Variants: primary (forest), accent (gold), inverse (on dark panels) */
a.btn,button.btn,.btn{background:#143e35;color:#fff;border-color:#143e35}
a.btn:hover,button.btn:hover,.btn:hover{background:#1d5748;border-color:#1d5748}
.v11-ad>a{background:#143e35;color:#fff;border-color:#143e35}
.v11-ad>a:hover{background:#1d5748;border-color:#1d5748}
.btn.orange,.hd-foot-ad .btn,.final-cta .btn,.head-actions .btn,.mobile .btn{
	background:#f3bf41;color:#143e35!important;border-color:#f3bf41}
.btn.orange:hover,.hd-foot-ad .btn:hover,.final-cta .btn:hover{
	background:#e3a92e;border-color:#e3a92e}
.v11-cta-box a{background:#fff;color:#174539;border-color:#fff}
.v11-cta-box a:hover{background:#e9f3ed;border-color:#e9f3ed}
/* The header and the sticky mobile bar stay pills on purpose */
.head-actions .btn{min-height:42px;padding:11px 24px;border-radius:50px;font-size:13px}
.mobile .btn{border-radius:35px}
/* Sidebar CTAs fill their card, so every right edge lines up */
.v11-aside-stack .v11-cta-box a,
.v11-aside-stack .v11-ad>a{width:100%;align-self:stretch}
/* Service hero: button baseline matches the aside card's bottom edge */
@media (min-width:861px){section.v11-service-hero.wrap,.v11-service-hero{align-items:stretch}}
.v11-service-hero>div:first-child{display:flex;flex-direction:column;align-items:flex-start}
.v11-service-hero>div:first-child>a.btn{margin-top:auto}
.v11-service-hero .v11-hero-aside{display:flex;flex-direction:column}
.v11-service-hero .v11-hero-aside>a:last-child{margin-top:auto}
/* ---- Footer: the advertising panel occupies the area index's spare cell ----
   Seven location groups in a four-column grid leave exactly one empty cell
   beside Scotland & Wales. The panel sits in it rather than as a separate
   full-width banner, so the dead space carries the placement. */
.footer-locations{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1100px){.footer-locations{grid-template-columns:repeat(3,minmax(0,1fr))}}
.footer-v5 .hd-foot-ad{
	display:flex;flex-direction:column;align-items:flex-start;gap:0;
	margin:0;padding:18px;border:1px solid rgba(255,255,255,.22);border-radius:12px;
	background:rgba(255,255,255,.05);min-width:0}
.footer-v5 .hd-foot-ad-label{
	display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;
	color:#9fc9b4;margin:0 0 10px}
.footer-v5 .hd-foot-ad strong{
	display:block;font-family:Georgia,serif;font-size:18px;line-height:1.3;
	color:#fff;margin:0 0 8px}
.footer-v5 .hd-foot-ad p{
	margin:0 0 16px;color:#cfe3d8;font-size:13px;line-height:1.55;max-width:none}
.footer-v5 .hd-foot-ad .btn{margin-top:auto;white-space:normal;text-align:center}
/* Too narrow to be useful once the grid drops to two columns */
@media (max-width:620px){.footer-v5 .hd-foot-ad{grid-column:1/-1}}
/* ============================================================
   v1.2.5 — The UK-wide edition is a choice, not the absence of one.
   It was a text link at the foot of the switcher and it cleared the
   cookie, so the next visit to the homepage auto-detected and
   redirected again. It is now a first-class option stored as
   hd_area=uk, which survives and suppresses the redirect.
   ============================================================ */
.hd-area-uk{
	display:block;margin:0 0 14px;padding:14px 16px;border-radius:10px;
	border:1px solid #cfe0d4;background:#f4f8f4;text-decoration:none;
	transition:border-color .18s ease,background-color .18s ease}
.hd-area-uk:hover{border-color:#2f7b5e;background:#eaf3ed}
.hd-area-uk-name{
	display:block;font-family:Arial,Helvetica,sans-serif;font-size:14px;
	font-weight:700;color:#143e35;line-height:1.3}
.hd-area-uk-sub{
	display:block;margin-top:3px;font-size:12px;color:#5f726b;line-height:1.45}
.hd-area-uk.is-current{background:#143e35;border-color:#143e35}
.hd-area-uk.is-current .hd-area-uk-name{color:#fff}
.hd-area-uk.is-current .hd-area-uk-sub{color:#bcd9c9}
.hd-area-menu .hd-area-menu-head+.hd-area-uk{margin-top:2px}
/* ============================================================
   v1.2.7 — Focus ring, site search, deferred hero slides
   ============================================================ */

/* A ring that survives both surfaces. The forest outline carries the
   cream and white backgrounds; the gold halo outside it carries the
   dark green header, footer and hero, where a dark ring disappears. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible{
	outline:3px solid #143e35;
	outline-offset:2px;
	box-shadow:0 0 0 6px rgba(243,191,65,.95);
	border-radius:4px}
/* Inside the dark panels the order inverts: gold ring, forest halo. */
.footer-v5 :where(a,button,input):focus-visible,
.top :where(a,button):focus-visible,
.v11-cta-box a:focus-visible,
.hd-foot-ad :where(a,button):focus-visible,
.mobile :where(a,button):focus-visible,
.hd-area-uk.is-current:focus-visible{
	outline-color:#f3bf41;
	box-shadow:0 0 0 6px rgba(20,62,53,.9)}
/* ---- Site search ---- */
.hd-search{display:flex;align-items:center;gap:6px;min-width:0}
.hd-search-field{
	box-sizing:border-box;min-width:0;width:190px;height:36px;padding:8px 12px;
	border:1px solid #d8e2da;border-radius:50px;background:#fff;
	font-family:Arial,Helvetica,sans-serif;font-size:13px;color:#173b30}
.hd-search-field::placeholder{color:#7d8c86}
.hd-search-field:hover{border-color:#b9cdc0}
.hd-search-go{
	flex:0 0 auto;height:36px;padding:0 16px;border:1px solid #143e35;border-radius:50px;
	background:#143e35;color:#fff;font:700 13px/1 Arial,Helvetica,sans-serif;cursor:pointer}
.hd-search-go:hover{background:#1d5748;border-color:#1d5748}
/* In the nav strip it sits at the far right and must not force a scrollbar */
.mega-nav .mega-search{margin-left:auto;list-style:none}
@media (max-width:1100px){.mega-nav .mega-search .hd-search-field{width:140px}}
@media (max-width:850px){.mega-nav .mega-search{display:none}}
/* On the results page it is a full-width refine box under the heading */
.v16-hero-copy .hd-search{margin-top:16px;max-width:520px}
.v16-hero-copy .hd-search-field{width:100%;height:46px;font-size:15px}
.v16-hero-copy .hd-search-go{height:46px;font-size:14px}
/* ============================================================
   v1.2.8 — Article page: green hero, honest sticky offset,
   and the dead band under the photograph
   ============================================================ */

/* 1. The hero panel computed to a transparent background, so it read as
      a bordered hole in the cream page. Light green gives it a body and
      lets the white help-desk card inside read as a card. */
/* legacy.css line 79 carries `.pagehead{background:transparent!important}
`,
   a prototype override that blanks every pagehead, so this has to answer it
   in kind rather than merely outrank it. */
.wrap.pagehead.v16-hero,
.pagehead.v16-hero{
	background:#eaf3ed!important;
	border:1px solid #d2e3d7}
.v16-hero .v16-hero-side{background:#fff;border:1px solid #dbe7df}
.v16-hero .eyebrow,.v16-hero .v16-side-kicker{color:#2c6a50}
/* 2. The sticky sidebar was pinned at 135px under a 148px header, so its
      top 13px slid underneath on scroll. The header's real height is
      published as --hd-header-h by main.js (it changes with the breakpoint
      and with the WordPress admin bar), and the offset follows it. */
:root{--hd-header-h:148px}
.sidebar{top:calc(var(--hd-header-h) + 18px)}
/* Taller than the viewport means sticky can never reveal the bottom, so
   let it scroll internally instead of trapping the lower panels. */
@media (min-width:981px){
	.sidebar{max-height:calc(100vh - var(--hd-header-h) - 36px);overflow-y:auto;scrollbar-width:thin;
		padding-right:4px;overscroll-behavior:contain}
}
/* 3. 109px of nothing between the photograph and the first content block. */
.hd-article-hero{margin-bottom:4px}
.single .section.layout,
.layout.section{padding-top:34px}
/* ============================================================
   v1.3.0 — Design-system pass
   Tokens, reading comfort, contrast and target sizes, measured
   against WCAG 2.2 AA and the published layout guidance.
   ============================================================ */

:root{
	/* Radii: the build had eight values in circulation (12, 9, 50, 8, 4,
	   5, 7, 11, 14). Three plus a pill is the whole system. */
	--r-sm:4px; --r-md:8px; --r-lg:12px; --r-pill:50px;
	/* Type scale, 1.25 ratio off a 16px base */
	--t-xs:12px; --t-sm:14px; --t-base:16px; --t-lg:20px;
	--t-xl:25px; --t-2xl:31px; --t-3xl:39px; --t-4xl:48px;
	/* Spacing rhythm */
	--s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:32px; --s-7:48px; --s-8:56px;
	/* Text colours, all verified at or above 4.5:1 on cream and on light green */
	--ink:#173b30; --ink-muted:#5a6762; --ink-quiet:#4d685e;
	--forest:#143e35; --mint:#eaf3ed; --gold:#f3bf41;
	--measure:60ch;
}
/* ---- Radii: fold the stray values onto the three tokens ---- */
.hd-card,.panel,.v11-ad,.hd-foot-ad,.v16-hero-side,.locale-panel,.mega-feature,
.v11-cta-box,.v11-service-tile,.hd-article-hero img,.hd-card-visual img,
.wrap.pagehead.v16-hero,.v11-service-hero,.hd-area-uk{border-radius:var(--r-lg)}
.btn,a.btn,button.btn,.v11-ad>a,.v11-cta-box a,.hd-foot-ad .btn,
.hd-search-field,.hd-search-go,.service-paths a{border-radius:var(--r-md)}
.hd-card-sketch,.hd-area-grid a,.linklist a{border-radius:var(--r-sm)}
.head-actions .btn,.mobile .btn,.hd-area-chips a,.intro-chips a,
.hd-search-field,.hd-search-go{border-radius:var(--r-pill)}
/* ---- Reading comfort ----
   Lines were running to 96 characters at 16px in a 712px column. Past
   roughly 80 the eye loses the return sweep, and these are read end to
   end. Constrain the measure rather than shrink the type. */
.hd-article>p,.hd-article>ul,.hd-article>ol,.hd-article>blockquote,
.hd-article>h2,.hd-article>h3,.hd-article>h4,.articlebody>p,.articlebody>ul,.articlebody>ol{
	max-width:var(--measure)}
.hd-article p,.articlebody p,.hd-article li,.articlebody li{line-height:1.62}
/* 13px was carrying real prose in cards, tiles and intros. 13px is a
   caption size; body copy starts at 15px. */
.hd-card-excerpt{font-size:15px;line-height:1.55}
.v11-service-tile span{font-size:14px}
.v16-hero-copy>p,.v11-service-hero p{font-size:17px;line-height:1.6}
/* ---- Contrast: two measured failures, 4.38:1 and 4.3:1 against 4.5 ---- */
.hd-card-excerpt,.hd-card-meta,.v16-hero-copy>p,.footnote,
.hd-article-hero figcaption,.locale-panel p{color:var(--ink-muted)}
.v11-service-tile span,.hd-strip-item span,.mega-menu p{color:var(--ink-quiet)}
/* ---- Target size: WCAG 2.2 sets 24x24 as the floor. Three desktop
       links measured 21px and 14px tall. Mobile was already padded. ---- */
.textlink,.footer-bottom a,.breadcrumb a,.mega-all,.hd-area-all,.sect-head>a{
	display:inline-flex;align-items:center;min-height:24px}
.breadcrumb{line-height:1.9}
/* ---- Section rhythm: 76px against a 48-64px guideline ---- */
.section{padding-top:var(--s-8);padding-bottom:var(--s-8)}
/* ---- Type scale: H1 ran 64px and H2 34px ---- */
.hero-copy h1,.v16-hero-copy h1,.pagehead h1{font-size:clamp(32px,4vw,var(--t-4xl));line-height:1.12}
.section h2,.sect-head h2,.hd-article h2{font-size:clamp(24px,2.4vw,var(--t-2xl));line-height:1.2}
.hd-article h3{font-size:var(--t-lg);line-height:1.3}
/* ---- Skip link ---- */
.hd-skip{position:absolute;left:-9999px;top:0;z-index:100;
	padding:12px 20px;background:var(--forest);color:#fff;font:700 14px Arial,Helvetica,sans-serif;
	border-radius:0 0 var(--r-md) 0;text-decoration:none}
.hd-skip:focus{left:0}
/* Mega-menu column labels are labels, not document headings */
.mega-menu .mega-label{font:700 12px Arial,Helvetica,sans-serif;color:#65736b;
	text-transform:uppercase;letter-spacing:1px;margin:0 0 15px}
.mega-location .mega-label{margin-top:12px}
.footer-locations h3{font:700 12px Arial,Helvetica,sans-serif;color:#aec9bb;
	text-transform:uppercase;letter-spacing:.5px;margin:0 0 11px}
/* Remaining radius strays folded onto the tokens */
.hd-area-menu{border-radius:var(--r-lg)}
.repair-action{border-radius:var(--r-lg)}
.desk-form input,.desk-form textarea,.desk-form select,.desk-form button{border-radius:var(--r-md)}
.v16-reading-guide,.hd-faq{border-radius:var(--r-lg)}
/* Callouts share the prose measure so the column edge stays straight */
.v16-reading-guide p,.v16-reading-guide strong,.hd-faq p{max-width:var(--measure)}
/* legacy carries `main .articlebody p{line-height:1.8}
` at specificity 0,1,2,
   which outranks a single-class rule. Match it to land the reading settings. */
main .articlebody p,main .articlebody li,
main .hd-article p,main .hd-article li{font-size:16px;line-height:1.62}
main .articlebody{max-width:none}
/* Two h2s sat outside the scale at 36px and 45px */
.hd-edition-copy h2,.urgency h2,.final-cta h2,.locale-cta h2,.v11-content h2{
	font-size:clamp(24px,2.4vw,var(--t-2xl));line-height:1.2}
/* Final radius strays: quick-form controls and the promise band */
.quick-row input,.quick-row select,.quick-row button,
form input,form select,form textarea{border-radius:var(--r-md)}
.promise,.promise>div{border-radius:var(--r-lg)}

/* ============================================================
   v1.3.3 — Service aside sticky offset
   .sidebar was fixed in 1.2.8 but .v11-aside-stack, used on service
   and for-trades pages, was still pinned at top:20px under a 148px
   header, hiding 128px of the card behind it on scroll.
   ============================================================ */
@media (min-width:981px){
	.v11-aside-stack{
		position:sticky;
		top:calc(var(--hd-header-h, 148px) + 18px);
		max-height:calc(100vh - var(--hd-header-h, 148px) - 36px);
		overflow-y:auto;scrollbar-width:thin;padding-right:4px;overscroll-behavior:contain}
}

/* ============================================================
   v1.3.4 — Logo scale, footer ad proportions, area menu,
   service content section
   ============================================================ */

/* ---- Logo: larger in both header and footer ---- */
.hd-logo-img{height:68px}
.footer-v5 .hd-logo-img{height:60px}
@media (max-width:1100px){.hd-logo-img{height:58px}}
@media (max-width:850px){.hd-logo-img{height:46px}.footer-v5 .hd-logo-img{height:46px}}
.mast{min-height:92px}

/* ---- Footer advertising panel ----
   One grid cell made it a tall, narrow card with the headline breaking
   over three lines. Five columns leaves three free cells on row two,
   so the panel spans them and reads as a proper landscape unit. */
.footer-locations{grid-template-columns:repeat(5,minmax(0,1fr))}
.footer-v5 .hd-foot-ad{
	grid-column:span 3;
	display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:26px;
	padding:22px 26px}
.footer-v5 .hd-foot-ad-copy{min-width:0}
.footer-v5 .hd-foot-ad strong{font-size:21px;max-width:28ch}
.footer-v5 .hd-foot-ad p{margin:0;max-width:52ch}
.footer-v5 .hd-foot-ad .btn{margin-top:0;white-space:nowrap;align-self:center}
@media (max-width:1300px){.footer-locations{grid-template-columns:repeat(4,minmax(0,1fr))}
	.footer-v5 .hd-foot-ad{grid-column:span 2}}
@media (max-width:1000px){.footer-locations{grid-template-columns:repeat(3,minmax(0,1fr))}
	.footer-v5 .hd-foot-ad{grid-column:1/-1;grid-template-columns:minmax(0,1fr) auto}}
@media (max-width:620px){.footer-v5 .hd-foot-ad{grid-template-columns:1fr}
	.footer-v5 .hd-foot-ad .btn{justify-self:start}}

/* ---- Area menu: even rows, calmer rhythm ----
   Two-line labels such as "South East England" made some chips taller
   than their neighbours, so every row sat at a different height. */
.hd-area-menu{padding:22px 22px 18px;max-height:min(78vh,720px);overflow-y:auto;scrollbar-width:thin}
.hd-area-menu-head{margin:0 0 10px}
.hd-area-menu-head strong{font-size:17px}
.hd-area-menu-head span{font-size:12.5px;color:var(--ink-muted,#5a6762)}
.hd-area-menu .hd-area-menu-head+.hd-area-grid{margin-top:2px}
.hd-area-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:18px}
.hd-area-grid a{
	display:flex;align-items:center;justify-content:center;text-align:center;
	min-height:46px;padding:8px 10px;
	border:1px solid #dde7e0;background:#fbfdfb;color:#173b30;
	font-size:13px;font-weight:600;line-height:1.25;text-decoration:none;
	transition:border-color .15s ease,background-color .15s ease}
.hd-area-grid a:hover{border-color:#2f7b5e;background:#eef5f0}
.hd-area-grid a.is-current{background:var(--forest,#143e35);border-color:var(--forest,#143e35);color:#fff}
.hd-area-menu .hd-area-uk{margin-bottom:18px;padding:15px 16px}
.hd-area-all{display:inline-flex;align-items:center;min-height:30px;margin-top:2px;font-size:13px;font-weight:700}
@media (max-width:720px){.hd-area-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---- Service hub content section ---- */
.hd-seo{margin:38px 0 8px}
.hd-seo h2{font-size:clamp(24px,2.4vw,var(--t-2xl,31px));line-height:1.2;margin:0 0 14px}
.hd-seo h3{font-size:var(--t-lg,20px);line-height:1.3;margin:30px 0 12px}
.hd-seo p{font-size:16px;line-height:1.62;max-width:var(--measure,60ch);color:#2f4a41}
.hd-seo-standards{
	margin:22px 0;padding:18px 20px;border-radius:var(--r-lg,12px);
	border:1px solid #d2e3d7;background:#eaf3ed}
.hd-seo-standards strong{display:block;margin-bottom:6px;font-size:14px;color:var(--forest,#143e35)}
.hd-seo-standards p{margin:0;font-size:15px}
.hd-seo-costs{display:grid;gap:0;margin:0}
.hd-seo-costs dt{
	font:700 15px Arial,Helvetica,sans-serif;color:var(--forest,#143e35);
	padding-top:14px;border-top:1px solid #e1e9e4}
.hd-seo-costs dt:first-child{border-top:0;padding-top:0}
.hd-seo-costs dd{margin:4px 0 14px;font-size:15px;line-height:1.6;color:#4a5f58;max-width:var(--measure,60ch)}
.hd-seo-note{font-size:13.5px;color:var(--ink-muted,#5a6762);font-style:normal}
.hd-seo-prepare{margin:0 0 6px;padding-left:20px}
.hd-seo-prepare li{font-size:15.5px;line-height:1.6;margin-bottom:7px;max-width:var(--measure,60ch)}
.hd-seo-faqs details{
	border-top:1px solid #e1e9e4;padding:14px 0}
.hd-seo-faqs details:last-child{border-bottom:1px solid #e1e9e4}
.hd-seo-faqs summary{
	cursor:pointer;list-style:none;font:700 16px Georgia,serif;color:var(--forest,#143e35);
	display:flex;justify-content:space-between;gap:16px;align-items:flex-start;min-height:28px}
.hd-seo-faqs summary::-webkit-details-marker{display:none}
.hd-seo-faqs summary::after{content:"+";font:400 22px Arial,Helvetica,sans-serif;line-height:1;color:#2f7b5e;flex:0 0 auto}
.hd-seo-faqs details[open] summary::after{content:"\2212"}
.hd-seo-faqs details p{margin:10px 0 0;font-size:15.5px}

/* ---- About page ---- */
.hd-about-stats{
	display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;
	margin:0 auto 6px;padding:0;background:#dfeae2;
	border:1px solid #dfeae2;border-radius:var(--r-lg,12px);overflow:hidden}
.hd-about-stats>div{background:#fff;padding:22px 20px;min-width:0}
.hd-about-stats strong{
	display:block;font-family:Georgia,serif;font-size:clamp(28px,3vw,38px);
	line-height:1;color:var(--forest,#143e35)}
.hd-about-stats span{
	display:block;margin-top:7px;font-size:13px;line-height:1.4;color:var(--ink-muted,#5a6762)}
@media (max-width:860px){.hd-about-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
.hd-about-steps{margin:0 0 16px;padding-left:22px}
.hd-about-steps li{margin-bottom:10px;line-height:1.62;max-width:var(--measure,60ch)}
.hd-about-steps strong{color:var(--forest,#143e35)}
/* The generic page sidebar held one small box, leaving the column empty below it */
.sidebar .panel+.panel{margin-top:14px}

/* ============================================================
   v1.3.5 — Responsive sweep, 320 to 1440px, nine breakpoints
   Found by a DOM probe across nine pages, not by screenshot.
   ============================================================ */

/* 1. Header overflowed the viewport at 320 to 414px: area pill plus
      "Request help" button were 265px in a 320px screen. The sticky
      mobile bar already carries Request help below 850px, so the
      header copy of it is redundant there. */
@media (max-width:850px){
	.head-actions .btn{display:none}
	.head-actions{gap:10px}
	.hd-area-btn{max-width:min(60vw,220px);padding:8px 12px}
	.hd-area-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
}
@media (max-width:360px){.hd-area-btn{max-width:52vw}.hd-pin{display:none}}

/* 2. The sticky mobile bar shows up to 850px but the footer only
      cleared it up to 580px, so on 768 and 834px tablets the last
      40px of every page sat permanently under the bar. */
@media (max-width:850px){.footer-v5{padding-bottom:104px}}

/* 3. Labels at 11px across eyebrows, kickers, ad labels and card
      meta. 12px is the floor. */
.eyebrow,.quick-note,.v11-ad-label,.hd-foot-ad-label,.v16-side-kicker,
.v11-kicker,.hd-card-body small,small{font-size:12px!important}

/* 4. Area menu: every chip the same height whether its label is one
      line or two, so all six rows align. Anchored to the right edge
      and capped to the viewport so it can never run off the left. */
.hd-area-menu{right:0;left:auto;width:min(680px,calc(100vw - 24px))}
.hd-area-grid{grid-auto-rows:1fr}
.hd-area-grid a{min-height:54px;padding:6px 10px}
@media (max-width:720px){
	.hd-area-menu{position:fixed;top:var(--hd-header-h,148px);left:12px;right:12px;width:auto;
		max-height:calc(100vh - var(--hd-header-h,148px) - 16px)}
	.hd-area-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
	.hd-area-grid a{min-height:50px;font-size:14px}
	.hd-area-uk{padding:13px 14px}
}

/* 5. Nav strip scrolls sideways on phones by design; give it an
      edge fade so the scroll is discoverable, and tighter gaps. */
@media (max-width:850px){
	.mega-shell{position:relative}
	.mega-shell::after{content:"";position:absolute;top:0;right:0;bottom:0;width:36px;pointer-events:none;
		background:linear-gradient(to right,rgba(255,253,249,0),#fffdf9 80%)}
	.mega-nav{gap:14px;padding-right:40px}
	.mega-nav>li>a,.mega-nav>li>button{padding:15px 2px;font-size:13px}
}

/* 6. Tablet portrait: two-column grids that were still three */
@media (min-width:621px) and (max-width:900px){
	.hd-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.hd-area-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
	.v11-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.hd-about-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
	.footer-v5 .foot-top{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
}
/* 7. Phones: single column everywhere a grid still had two */
@media (max-width:480px){
	.hd-card-grid,.hd-card-grid-2,.hd-area-cards,.v11-service-grid{grid-template-columns:1fr}
	.hd-about-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
	.v16-hero,.v11-service-hero{padding:22px 18px}
	.hd-seo-costs dd{font-size:14.5px}
	.hd-foot-ad{padding:18px}
}
/* 8. At 320px the wordmark took 200px of a 320px mast, leaving the
      area pill nowhere to go. Scale the logo down, cap the pill. */
@media (max-width:400px){
	.hd-logo-img{height:38px}
	.mast{min-height:64px;gap:8px}
	.hd-area-btn{max-width:calc(100vw - 190px);padding:7px 10px;font-size:12px}
	.hd-area-btn .nav-chevron{display:none}
}

/* ---------- WhatsApp button vs the mobile bar ----------
   The connector plugin pins its button 20px from the bottom of the
   viewport, which on phones lands on top of our fixed action bar. Lift it
   clear and give the footer room so nothing sits under it. */
@media (max-width:850px){
  .wabot-fab{bottom:calc(var(--hd-bar-h,66px) + 14px)!important}
  body:has(.wabot-fab) .footer-v5{padding-bottom:calc(var(--hd-bar-h,66px) + 84px)}
}

/* ---------- v1.3.6: nav must fit between 851 and 1100px ----------
   Seven items plus the search form measured 1050px, so on iPad landscape
   and 1024-wide laptops the search box was cut off at the right edge.
   Tighter gaps, a 13px label size, a capped "Blogs · Area" label and an
   icon-only search button bring the row under 851px even with the
   longest area name. */
.hd-search-ico{display:none}
@media (min-width:851px) and (max-width:1100px){
  .mega-nav{gap:16px}
  .mega-nav>li>a,.mega-nav>li>button{font-size:13px}
  .hd-nav-area{display:none}
  .mega-nav .mega-search .hd-search-field{width:100px}
  .mega-nav .mega-search .hd-search-go{display:inline-flex;align-items:center;justify-content:center;width:38px;padding:0}
  .mega-nav .mega-search .hd-search-go-text{display:none}
  .mega-nav .mega-search .hd-search-ico{display:block}
}
@media (min-width:1101px) and (max-width:1240px){.hd-nav-area{display:none}}

/* ---------- v1.3.6: phone footer index ----------
   Three columns of area links at 390px left 11px text and 2px gaps; two
   columns keep each name on one line at 13px. The ad spans both. */
@media (max-width:520px){
  .footer-locations{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 16px}
  .footer-v5 .hd-foot-ad{grid-column:1/-1}
  .footer-locations a{font-size:13px;padding:6px 0}
}

/* ---------- v1.3.7: advert units carry a photograph ----------
   Wide ribbon: photo | copy | button, photo bleeding to the card edge.
   Sidebar card: photo on top, copy, full-width button. */
.hd-ad-unit{position:relative;overflow:hidden;background:#f4f7f3;border:1px solid #d9e3dc}
.hd-ad-unit .hd-ad-img{display:block;width:100%;object-fit:cover;background:#dfe8e2}
.v11-ad-ribbon .v11-ad-wide.hd-ad-unit,.hd-ad-ribbon .v11-ad-wide.hd-ad-unit,.v11-ad-wide.hd-ad-unit{
  display:grid!important;grid-template-columns:minmax(200px,26%) minmax(0,1fr) auto!important;
  align-items:center;gap:0 28px;padding:0 28px 0 0!important;min-height:176px}
.v11-ad-wide.hd-ad-unit .hd-ad-img{height:100%;min-height:176px;border-radius:0}
.v11-ad-wide.hd-ad-unit>div{padding:22px 0}
.v11-ad-wide.hd-ad-unit>a{white-space:nowrap}
@media (max-width:760px){
  .v11-ad-ribbon .v11-ad-wide.hd-ad-unit,.hd-ad-ribbon .v11-ad-wide.hd-ad-unit,.v11-ad-wide.hd-ad-unit{
    grid-template-columns:minmax(0,1fr)!important;gap:0;padding:0 0 20px!important;justify-items:start}
  .v11-ad-wide.hd-ad-unit .hd-ad-img{height:170px;min-height:0;width:100%}
  .v11-ad-wide.hd-ad-unit>div{padding:18px 20px 14px}
  .v11-ad-wide.hd-ad-unit>a{margin:0 20px;white-space:normal}
}
/* Sidebar card (article and service pages) */
.v11-aside-stack .v11-ad.hd-ad-unit,.sidebar .v11-ad.hd-ad-unit{padding:0 0 20px!important;gap:0}
.v11-aside-stack .v11-ad.hd-ad-unit .hd-ad-img,.sidebar .v11-ad.hd-ad-unit .hd-ad-img{height:150px;border-radius:0}
.v11-aside-stack .v11-ad.hd-ad-unit>div,.sidebar .v11-ad.hd-ad-unit>div{padding:16px 20px 12px}
.v11-aside-stack .v11-ad.hd-ad-unit>a,.sidebar .v11-ad.hd-ad-unit>a{margin:0 20px;width:calc(100% - 40px)!important;align-self:flex-start!important}

/* ---------- v1.3.7: larger wordmark ----------
   Header 88px / footer 76px on desktop; the mobile sizes step down so the
   area pill keeps room beside it (its max-width is derived from the logo). */
.hd-logo-img{height:88px}
.footer-v5 .hd-logo-img{height:76px}
.mast{min-height:112px}
@media (max-width:1100px){.hd-logo-img{height:74px}.mast{min-height:98px}}
@media (max-width:850px){.hd-logo-img{height:54px}.footer-v5 .hd-logo-img{height:58px}.mast{min-height:80px}
  .hd-area-btn{max-width:calc(100vw - 236px)}}
@media (max-width:480px){.hd-logo-img{height:46px}.hd-area-btn{max-width:calc(100vw - 208px)}}
@media (max-width:400px){.hd-logo-img{height:42px}.mast{min-height:66px}.hd-area-btn{max-width:calc(100vw - 196px)}}
@media (max-width:340px){.hd-logo-img{height:38px}.hd-area-btn{max-width:calc(100vw - 182px)}}

/* ============================================================
   v1.3.8 — sidebars without scrollers, about layout 70/30,
   four new homepage sections
   ============================================================ */
/* Sidebars: no internal scroll. Tall ones (class set by main.js) flow with the page. */
@media (min-width:981px){
  .sidebar,.v11-aside-stack{max-height:none;overflow:visible;padding-right:0;overscroll-behavior:auto}
}
/* About page: 70/30 split, copy fills its column */
@media (min-width:981px){
  .hd-about-layout{grid-template-columns:minmax(0,7fr) minmax(0,3fr);gap:56px}
}
.hd-about-layout .articlebody p,.hd-about-layout .articlebody ol,.hd-about-layout .articlebody ul,.hd-about-layout .articlebody li,.hd-about-layout .hd-about-steps li,.hd-about-layout .articlebody h2,.hd-about-layout .articlebody h3{max-width:none}
.hd-about-layout .articlebody h2{margin-top:34px}
.hd-about-layout .articlebody h2:first-child{margin-top:0}

/* Costs at a glance */
.hd-costs-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 22px}
.hd-cost-item{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px 16px;
  background:#fff;border:1px solid #e1e9e4;border-radius:var(--r-md,8px);text-decoration:none;color:inherit;min-height:72px;transition:border-color .15s,box-shadow .15s}
.hd-cost-item:hover{border-color:#b9cdc0;box-shadow:0 6px 18px rgba(20,62,53,.08)}
.hd-cost-item img{width:40px;height:40px;opacity:.9}
.hd-cost-body{display:block;min-width:0}
.hd-cost-body small{display:block;font:600 12px Arial,Helvetica,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-muted,#5a6762);margin-bottom:3px}
.hd-cost-body strong{display:block;font:600 15.5px/1.35 Arial,Helvetica,sans-serif;color:var(--forest,#143e35)}
.hd-cost-arrow{color:#2f7b5e;font-size:18px}
@media (max-width:760px){.hd-costs-grid{grid-template-columns:1fr}}

/* Popular questions */
.hd-home-faqs{max-width:900px}
.hd-home-faqs details p{max-width:none}
.hd-faq-more a{font:700 14px Arial,Helvetica,sans-serif;color:#1d5748;text-decoration:none}
.hd-faq-more a:hover{text-decoration:underline}

/* Help desk band */
.hd-ai-band{background:#143e35;color:#fff;padding:60px 0}
.hd-ai-inner{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:48px;align-items:center}
.hd-ai-band .eyebrow{color:#b1dac3}
.hd-ai-band h2{color:#fff;margin:0 0 14px;font-size:clamp(28px,3vw,40px)}
.hd-ai-band p{color:#d6e8de;font-size:17px;line-height:1.6;max-width:var(--measure,60ch)}
.hd-ai-actions{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-top:22px}
.hd-ai-band .textlink{color:#fff;font-weight:700;text-decoration:underline;text-underline-offset:4px}
.hd-ai-demo{background:#fffdf9;border-radius:16px;padding:22px;display:flex;flex-direction:column;gap:12px;box-shadow:0 18px 60px rgba(0,0,0,.25)}
.hd-ai-msg{max-width:88%;padding:12px 15px;border-radius:14px;font:15px/1.5 Arial,Helvetica,sans-serif}
.hd-ai-in{background:#edf3ee;color:#1e302b;align-self:flex-start}
.hd-ai-out{background:#143e35;color:#fff;align-self:flex-end}
@media (max-width:850px){.hd-ai-inner{grid-template-columns:1fr;gap:28px}.hd-ai-band{padding:44px 0}}

/* Editorial promise */
.hd-promise-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.hd-promise-card{background:#fff;border:1px solid #e1e9e4;border-radius:var(--r-lg,12px);padding:22px 20px}
.hd-promise-card strong{display:block;font:700 17px Georgia,serif;color:var(--forest,#143e35);margin-bottom:8px}
.hd-promise-card p{margin:0;font-size:14.5px;line-height:1.6;color:#4a5f58}
@media (max-width:1000px){.hd-promise-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.hd-promise-grid{grid-template-columns:1fr}}

/* ============================================================
   v1.3.9 — v11 template rhythm, compact Blogs and area menus,
   Locations menu ad slot, Christmas creative, favicon
   ============================================================ */
/* The v11 templates (service hubs, How it works, For trades) lost their
   section margins to .wrap{margin:auto}, so headings sat on the hero and
   the area chips sat on the footer. Restored with a stronger selector. */
section.wrap.v11-service-hero{margin:16px auto 0}
section.wrap.v11-content{margin:48px auto 84px}
.v11-content .v11-kicker{margin:0 0 8px}
.v11-content h2{margin-top:0}
.v11-content .v11-split>div>p:first-of-type{margin-top:0}
.v11-by-area{margin-top:48px;padding-top:30px;border-top:1px solid #e1e9e4}
.v11-by-area p{max-width:var(--measure,60ch)}
.hd-area-chips{margin-top:14px}
.hd-chip-all{font-weight:700}
@media (max-width:850px){section.wrap.v11-content{margin:30px auto 60px}.v11-by-area{margin-top:36px}}

/* Compact Blogs dropdown: a 400px panel under its own button instead of a four-column mega menu */
@media (min-width:851px){
  .mega-nav>li.hd-nav-blogs{position:relative}
  .mega-menu.mega-compact{left:0;right:auto;width:400px;padding:16px 18px 14px;border-radius:12px;box-shadow:0 18px 40px rgba(23,58,43,.16)}
}
.mega-menu a.mega-compact-top{display:block;padding:12px 14px;margin:0 0 12px;border-radius:10px;background:#143e35;color:#fff;text-decoration:none}
.mega-compact-top strong{display:block;font:700 15px Arial,Helvetica,sans-serif;margin-bottom:3px;color:#fff}
.mega-compact-top span{display:block;font-size:12.5px;line-height:1.45;color:#cfe3d7}
.mega-menu a.mega-compact-top:hover{background:#1d5748}
.mega-compact .mega-label{margin:0 0 6px}
.mega-compact-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px 10px}
.mega-compact-grid a{padding:5px 0;font-size:13.5px}
.mega-compact-foot{display:flex;justify-content:space-between;gap:12px;margin-top:10px;padding-top:10px;border-top:1px solid #e4dfd1}
.mega-compact-foot a{font:700 13px Arial,Helvetica,sans-serif;color:#143e35;text-decoration:none;padding:4px 0}
.mega-compact-foot a:hover{text-decoration:underline}
@media (max-width:850px){.mega-compact-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Area switcher: compact on desktop (it was a 680px wall of tiles) */
@media (min-width:721px){
  .hd-area-menu{width:min(470px,calc(100vw - 24px));padding:14px 16px 12px;border-radius:12px}
  .hd-area-menu-head{margin:2px 0 8px}
  .hd-area-menu-head strong{font-size:15px}
  .hd-area-menu-head span{display:none}
  .hd-area-uk{padding:10px 12px;margin-bottom:10px}
  .hd-area-uk-sub{display:none}
  .hd-area-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 6px;grid-auto-rows:auto}
  .hd-area-grid a{min-height:34px;padding:4px 8px;font-size:13px;border-radius:6px}
  .hd-area-all{margin-top:8px}
}

/* Locations menu: the second row had three empty cells; the advert spans them */
.mega-location .mega-ad{grid-column:span 3;align-self:stretch;display:flex}
.mega-location .mega-ad .hd-ad-unit{flex:1;min-height:0}
.v11-ad-wide.hd-ad-unit.hd-ad-menu{grid-template-columns:minmax(150px,30%) minmax(0,1fr)!important;gap:0 18px;min-height:0;padding:0 18px 0 0!important}
.hd-ad-menu .hd-ad-img{min-height:0;height:100%}
.hd-ad-menu>div{padding:14px 0}
.hd-ad-menu>a{display:inline-flex;margin-top:10px;min-height:38px;padding:8px 14px;font-size:13px}
.hd-ad-menu>div strong{font-size:16px}
.hd-ad-menu>div p{font-size:13px;line-height:1.5}
.hd-ad-menu>div{grid-column:2}
.hd-ad-menu>a{grid-column:2;justify-self:start}
@media (max-width:1100px){.mega-location{grid-template-columns:repeat(4,minmax(0,1fr))}.mega-location .mega-ad{grid-column:span 2}}
@media (max-width:850px){.mega-location .mega-ad{grid-column:1/-1}}

/* Christmas creative: illustrations sit on mint, so the unit shares the tint */
.hd-ad-xmas{background:#f3f8f4;border-color:#d4e3d8}
.hd-ad-xmas .hd-ad-img{background:#eaf3ed;object-fit:cover}
.hd-ad-xmas .v11-ad-label{color:#b8433a}
.hd-ad-xmas>div strong{color:#143e35}
/* Footer placement with the illustration */
.footer-v5 .hd-foot-ad-xmas{grid-template-columns:150px minmax(0,1fr) auto;padding:0 26px 0 0;overflow:hidden}
.footer-v5 .hd-foot-ad-img{display:block;width:100%;height:100%;min-height:150px;object-fit:cover}
.footer-v5 .hd-foot-ad-xmas .hd-foot-ad-copy{padding:20px 0}
.footer-v5 .hd-foot-ad-xmas .hd-foot-ad-label{color:#f3bf41}
@media (max-width:1000px){.footer-v5 .hd-foot-ad-xmas{grid-template-columns:140px minmax(0,1fr) auto}}
@media (max-width:620px){.footer-v5 .hd-foot-ad-xmas{grid-template-columns:1fr;padding:0 0 18px}
  .footer-v5 .hd-foot-ad-img{height:150px}.footer-v5 .hd-foot-ad-xmas .hd-foot-ad-copy{padding:16px 18px 6px}.footer-v5 .hd-foot-ad-xmas .btn{margin:0 18px}}

/* Christmas offer tile: fills the spare cell in the services strip, same size and radius as its neighbours */
.hd-strip-item.hd-strip-offer{background:#143e35;border-color:#143e35;color:#fff;gap:6px}
.hd-strip-item.hd-strip-offer img{width:46px;height:46px;border-radius:10px}
.hd-strip-offer-kicker{font:700 11px Arial,Helvetica,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#f3bf41!important}
.hd-strip-item.hd-strip-offer span:not(.hd-strip-offer-kicker){color:#fff!important;font-size:13px;line-height:1.35}
.hd-strip-item.hd-strip-offer:hover{background:#1d5748;border-color:#1d5748}

/* ============================================================
   v1.4.0 — ad alignment, offer tile height, AI band, FAQ order,
   single post width, sticky last panel, all-locations switcher
   ============================================================ */
/* Locations menu advert: picture fills the full height, copy and button share the right column */
.v11-ad-wide.hd-ad-unit.hd-ad-menu{grid-template-rows:auto auto;align-items:center;align-content:center}
.hd-ad-menu .hd-ad-img{grid-row:1/3;grid-column:1;height:100%;min-height:0;align-self:stretch}
.hd-ad-menu>div{grid-column:2;grid-row:1;padding:16px 0 0}
.hd-ad-menu>a{grid-column:2;grid-row:2;margin:8px 0 16px;justify-self:start}

/* Services strip: the offer tile matches the height of an ordinary tile */
.hd-strip-item.hd-strip-offer{gap:5px;padding:12px 8px}
.hd-strip-item.hd-strip-offer img{width:40px;height:40px}
.hd-strip-offer-kicker{font-size:10.5px!important;letter-spacing:.08em}
.hd-strip-item.hd-strip-offer span:not(.hd-strip-offer-kicker){font-size:12px;line-height:1.3}

/* Help desk band: mint, so it no longer merges into the dark urgency band below it */
.hd-ai-band{background:#eaf3ed;color:#173e34;border-top:1px solid #d9e6dd}
.hd-ai-band .eyebrow{color:#2c6a50}
.hd-ai-band h2{color:#173e34}
.hd-ai-band p{color:#3f5a50}
.hd-ai-band .textlink{color:#143e35}
.hd-ai-demo{box-shadow:0 18px 50px rgba(20,62,53,.14);border:1px solid #d9e6dd}

/* Popular questions: full width, last section before the closing call to action */
.hd-home-faqs{max-width:none}
.hd-home-faq{padding-bottom:70px}

/* Single posts and other sidebar layouts: copy uses the whole column */
.layout .hd-article>p,.layout .hd-article>ul,.layout .hd-article>ol,.layout .hd-article>blockquote,
.layout .hd-article>h2,.layout .hd-article>h3,.layout .hd-article>h4,
.layout .articlebody>p,.layout .articlebody>ul,.layout .articlebody>ol,.layout .articlebody>h2,.layout .articlebody>h3{max-width:none}
.layout .hd-faq p,.layout .v16-reading-guide p,.layout .v16-reading-guide strong{max-width:none}

/* Sticky done properly: a sidebar that fits sticks whole; a taller one
   flows with the page while its last panel sticks as the article scrolls past. */
@media (min-width:981px){
  .layout .sidebar,.v11-split .v11-aside-stack{position:sticky;top:calc(var(--hd-header-h,148px) + 18px);align-self:start;will-change:top}
}

/* Area switcher: every location, in a compact seven-group list */
@media (min-width:721px){
  .hd-area-menu{width:min(600px,calc(100vw - 24px));padding:16px 18px 14px}
  .hd-area-menu-head span{display:block;font-size:12px}
  .hd-area-uk{display:flex;align-items:baseline;gap:10px;padding:9px 12px;margin-bottom:12px}
  .hd-area-uk-sub{display:block;margin:0}
}
.hd-area-groups{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 16px}
.hd-area-group strong{display:block;font:700 10.5px Arial,Helvetica,sans-serif;letter-spacing:.09em;text-transform:uppercase;color:#60766b;margin:0 0 4px}
.hd-area-group a{display:block;padding:3px 0;font:500 13px/1.35 Arial,Helvetica,sans-serif;color:#173b30;text-decoration:none;border:0;background:none;border-radius:4px}
.hd-area-group a:hover{color:#143e35;text-decoration:underline}
.hd-area-group a.is-current{color:#143e35;font-weight:700}
.hd-area-group a.is-current::before{content:"\25CF ";color:#e07b39;font-size:9px;vertical-align:middle}
.hd-area-all{margin-top:10px}
@media (max-width:720px){.hd-area-groups{grid-template-columns:repeat(2,minmax(0,1fr))}.hd-area-group a{padding:6px 0;font-size:14px}}
.hd-area-group a.is-current ~ a.is-current{font-weight:500}
.hd-area-group a.is-current ~ a.is-current::before{content:none}

/* Offer tile: pinned to the height of a one-line tile */
.hd-strip-item.hd-strip-offer{gap:4px;padding:11px 8px 10px}
.hd-strip-item.hd-strip-offer img{width:38px;height:38px}
.hd-strip-item.hd-strip-offer span:not(.hd-strip-offer-kicker){font-size:11.5px;line-height:1.25;white-space:nowrap}
/* Area switcher: inline index per region, two columns, so the panel is short */
@media (min-width:721px){
  .hd-area-menu{width:min(560px,calc(100vw - 24px))}
  .hd-area-groups{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 22px}
  .hd-area-group a{display:inline;padding:0;line-height:1.7}
  .hd-area-group a+a::before{content:"\00b7";color:#9fb3a8;margin:0 6px;font-weight:400}
  .hd-area-group a.is-current ~ a.is-current::before{content:"\00b7"}
}

/* ============================================================
   v1.4.1 — area switcher back to tiles, shorter
   ============================================================ */
@media (min-width:721px){
  .hd-area-menu{width:min(540px,calc(100vw - 24px));padding:14px 16px 12px}
  .hd-area-menu-head{margin:2px 0 6px}
  .hd-area-menu-head strong{font-size:15px}
  .hd-area-menu-head span{display:none}
  .hd-area-uk{display:flex;align-items:baseline;gap:10px;padding:9px 12px;margin-bottom:10px}
  .hd-area-uk-sub{display:block;margin:0}
  .hd-area-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;grid-auto-rows:auto;margin-bottom:10px}
  .hd-area-grid a{display:flex;align-items:center;justify-content:center;min-height:34px;padding:4px 8px;font-size:12.5px;line-height:1.2;border-radius:6px;text-align:center}
  .hd-area-all{margin-top:4px}
}

/* ---------- v1.4.1: Costs at a glance as price cards ---------- */
.hd-cost-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.hd-cost-card{display:flex;flex-direction:column;gap:6px;padding:18px 18px 16px;background:#fff;border:1px solid #e1e9e4;border-radius:var(--r-lg,12px);text-decoration:none;color:inherit;min-height:168px;transition:border-color .15s,box-shadow .15s,transform .15s}
.hd-cost-card:hover{border-color:#b9cdc0;box-shadow:0 10px 26px rgba(20,62,53,.09);transform:translateY(-2px)}
.hd-cost-top{display:flex;align-items:center;gap:10px;margin-bottom:4px}
.hd-cost-top img{width:36px;height:36px;object-fit:contain;flex:0 0 auto}
.hd-cost-service{font:700 13px Arial,Helvetica,sans-serif;color:#2c6a50;letter-spacing:.02em}
.hd-cost-range{display:flex;align-items:baseline;gap:6px;font:400 28px/1.1 Georgia,serif;color:var(--forest,#143e35);letter-spacing:-.01em}
.hd-cost-range small{font:500 12px Arial,Helvetica,sans-serif;color:#7d8c86;text-transform:uppercase;letter-spacing:.06em}
.hd-cost-label{font:400 14px/1.4 Arial,Helvetica,sans-serif;color:#4a5f58}
.hd-cost-link{margin-top:auto;padding-top:10px;font:700 13px Arial,Helvetica,sans-serif;color:#1d5748}
.hd-cost-card:hover .hd-cost-link{text-decoration:underline}
.hd-cost-note{grid-column:span 3;display:flex;flex-direction:column;justify-content:center;gap:8px;padding:18px 22px;background:#eaf3ed;border:1px solid #d9e6dd;border-radius:var(--r-lg,12px)}
.hd-cost-note strong{font:700 15px Georgia,serif;color:var(--forest,#143e35)}
.hd-cost-note p{margin:0;font-size:14px;line-height:1.55;color:#3f5a50;max-width:none}
.hd-cost-note .arrow{align-self:flex-start}
@media (max-width:1100px){.hd-cost-cards{grid-template-columns:repeat(3,minmax(0,1fr))}.hd-cost-note{grid-column:span 2}}
@media (max-width:760px){.hd-cost-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.hd-cost-card{min-height:0;padding:14px}.hd-cost-range{font-size:24px}.hd-cost-note{grid-column:1/-1}}
@media (max-width:420px){.hd-cost-cards{grid-template-columns:1fr}}

/* Hero aside cards size to their content; no stretched white space when the left column is longer */
@media (min-width:861px){.v11-service-hero .v11-hero-aside{align-self:start}.v11-service-hero>div:first-child>a.btn{margin-top:18px}}

/* ============================================================
   v1.4.5: UK edition by default, strip marks, wider desk copy
   ============================================================ */
/* Services strip: the drawing alone, larger, no paper square behind it */
.hd-strip-item{justify-content:center;gap:10px;padding:16px 8px 14px}
.hd-strip-item img{width:66px;height:66px;object-fit:contain;background:none;border-radius:0}
.hd-strip-item.hd-strip-offer{gap:6px;padding:14px 8px 12px}
.hd-strip-item.hd-strip-offer img{width:50px;height:50px;border-radius:0}
@media (max-width:520px){.hd-strip-item img{width:54px;height:54px}.hd-strip-item.hd-strip-offer img{width:42px;height:42px}}

/* Service desk pages: the explainer uses the whole main column */
.v11-split .hd-seo p,.v11-split .hd-seo-costs dd,.v11-split .hd-seo-prepare li,.v11-split .v11-by-area p{max-width:none}
.v11-split .hd-seo p{font-size:17px;line-height:1.7}

/* Section heads: clear space between the heading and its standfirst */
@media (min-width:761px){.sect-head{gap:72px}.sect-head p{max-width:440px;flex:0 0 auto}}

/* ============================================================
   v1.4.6: request form — real place lookup, name, phone, email
   ============================================================ */
.hd-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.desk-form label em{font-style:normal;font-weight:400;color:#6b7f76;font-size:12px;margin-left:4px}

/* Place lookup: the list sits under the field, over whatever follows */
.hd-ac{position:relative}
.hd-ac-list{
	position:absolute;z-index:40;left:0;right:0;top:calc(100% + 4px);margin:0;padding:6px;list-style:none;
	background:#fff;border:1px solid #c7d4c9;border-radius:10px;box-shadow:0 18px 40px rgba(12,40,32,.16);max-height:280px;overflow:auto}
.hd-ac-list>span{display:flex;flex-direction:column;gap:2px;padding:9px 11px;border-radius:7px;cursor:pointer}
.hd-ac-list>span strong{font-size:14.5px;color:#143e35;line-height:1.3}
.hd-ac-list>span>span{font-size:12.5px;color:#5d7169;line-height:1.35}
.hd-ac-list>span.is-active,.hd-ac-list>span:hover{background:#eaf5ef}
.hd-ac-status{display:block;margin:5px 0 0;font-size:12.5px;line-height:1.5;color:#5d7169}
.hd-ac-status:empty{display:none}
.hd-ac-status.is-ok{color:#1d6a4f}
.hd-ac-status.is-ok::before{content:"\2713\00a0";font-weight:700}
.hd-ac-status.is-warn{color:#b35735}
.hd-ac[data-verified="1"] input[name="place"]{border-color:#1d6a4f;background:#f6fbf8}

/* Result panel: one message, coloured by outcome */
.desk-result{line-height:1.6}
.desk-result.is-ok{background:#eaf5ed;border-color:#b8d7c0;color:#14432f}
.desk-result.is-warn{background:#fdf1ec;border-color:#e8c3b2;color:#8a3a22}
.desk-result.is-busy{background:#f4f6f3;border-color:#d8e0d6;color:#3f5349}

/* ============================================================
   v1.4.7: request form on two columns, so the card is short
   ============================================================ */
.desk-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px;align-items:start}
.desk-form-grid .df-field{display:block;margin:0;min-width:0}
.desk-form-grid .df-wide{grid-column:1/-1}
.desk-form-grid .df-field label{display:block;margin:0 0 5px;font-size:12.5px;font-weight:700}
.desk-form-grid .hd-ac{display:block}
.desk-form-grid .hd-ac-list:not([hidden]){display:block}
.hd-ac-list[hidden],.desk-form-grid .hd-ac-list[hidden]{display:none}
.desk-form-grid input,.desk-form-grid select,.desk-form-grid textarea{padding:11px 12px;font-size:15px}
.desk-form-grid textarea{min-height:64px}
.desk-form-grid .desk-submit{margin-top:4px;padding:13px 20px}
.desk-form-grid .desk-disclaimer{margin:0;font-size:11.5px}
.desk-form-grid .desk-result{width:100%;margin:2px 0 0}
.desk-form-card{padding:28px}
.desk-form-card h3{margin-bottom:5px}
.desk-form-card>p{margin-bottom:18px}
@media (max-width:560px){
	.desk-form-grid{grid-template-columns:1fr;gap:10px}
	.desk-form-card{padding:22px}
}

/* ============================================================
   v1.5.0: Household AI 1.1.0 widget sits above the mobile bar
   ============================================================ */
#hai-widget{bottom:calc(22px + var(--hd-bar-h,0px))}
@media (max-width:720px){#hai-widget{right:14px}}