.domestic-reference-page { background: #fff; color: #172033; }
.service-ref-shell { width: min(var(--layout-max),calc(100% - (var(--layout-gutter) * 2))); margin-inline: auto; }
.service-ref-header { position: sticky; z-index: 35; top: 0; background: rgba(255,255,255,.97); border-bottom: 1px solid #edf0ee; box-shadow: 0 3px 18px rgba(24,54,36,.04); backdrop-filter: blur(14px); }
.service-ref-nav { display: flex; align-items: center; min-height: 76px; gap: 25px; }
.header-contact { display: inline-grid; place-items: center; width: 42px; height: 42px; flex: 0 0 auto; color: var(--green,#2E7D32); background: #f0f7f1; border: 1px solid #dbe8de; border-radius: 11px; text-decoration: none; transition: background .15s ease, transform .15s ease; }
.header-contact:hover { background: #e3f1e6; transform: translateY(-1px); }
.header-contact .lucide-icon { width: 19px; height: 19px; }
@media (max-width: 800px) {
  .header-contact { width: 38px; height: 38px; }
  .header-contact .lucide-icon { width: 17px; height: 17px; }
  /* Call · Email · Menu grouped on the RIGHT edge */
  .service-ref-header .mobile-header-cta { display: none; }
  .service-ref-nav { gap: 10px; justify-content: flex-end; }
  .service-ref-brand { margin-right: auto; }
  .header-contact:first-of-type { margin-left: 0; }
  /* refined menu button — matches the Call/Email icon buttons */
  .service-ref-header .menu-toggle {
    order: 5; width: 38px; height: 38px; margin: 0; padding: 0;
    display: grid; place-content: center; gap: 4px;
    background: #f0f7f1; border: 1px solid #dbe8de; border-radius: 11px;
    transition: background .15s ease, transform .15s ease;
  }
  .service-ref-header .menu-toggle:active { transform: scale(.94); background: #e3f1e6; }
  .service-ref-header .menu-toggle i { width: 17px; height: 2px; margin: 0 auto; background: var(--green, #2E7D32); border-radius: 2px; }
}
/* LANDSCAPE phones (short viewport): fixed header + tall heroes were obstructing the view. */
@media (orientation: landscape) and (max-height: 520px) {
  .service-ref-nav { min-height: 48px; }
  main, .service-ref-main, .areas-ref-main, .blog-ref-main, .booking-ref-main,
  .contact-ref-main, .pricing-ref-main, .borough-ref-main, .article-ref-main { padding-top: 48px !important; }
  /* open hamburger menu: fit the short viewport + scroll, not a giant overlay */
  .service-ref-header .main-nav { top: 48px; height: calc(100dvh - 48px); max-height: calc(100dvh - 48px); padding-top: 12px; padding-bottom: 20px; overflow-y: auto; }
  /* don't force tall heroes on a 380px-tall screen -> content fits, no big empty gap */
  .service-ref-hero-grid, .booking-ref-hero-grid, .home-format-hero,
  [class*="hero-grid"] { min-height: auto !important; }
  .booking-ref-hero-grid > img, .service-ref-visual > img, .contact-ref-visual > img,
  .borough-hero-visual > img { max-height: 220px; }
  /* keep the fixed bottom action bar from doubling up the squeeze */
  .mobile-action-bar { padding-block: 6px; }
}
.service-ref-brand { flex: 0 0 auto; display: flex; align-items: center; }
.service-ref-brand img { display: block; height: 50px; width: auto; max-width: 260px; }
.service-ref-header .main-nav { margin-left: auto; padding: 0; background: transparent; border: 0; border-radius: 0; }
.service-ref-header .main-nav a { padding: 10px 12px; background: transparent; border-radius: 0; font-size: .78rem; }
.service-ref-header .main-nav a:hover { background: #f0f7f1; }
.service-ref-header .main-nav a.active { color: var(--green); background: transparent; box-shadow: none; }
.service-ref-header .main-nav a.active::after { position: absolute; right: 12px; bottom: 1px; left: 12px; display: block; height: 2px; content: ""; background: var(--green); }
.inner-page .site-header { position: sticky; z-index: 35; top: 0; background: rgba(255,255,255,.97); border-bottom: 1px solid #edf0ee; box-shadow: 0 3px 18px rgba(24,54,36,.04); backdrop-filter: blur(14px); }
.inner-page .site-header .header-inner { min-height: 76px; }
.inner-page .site-header .brand-logo { width: 205px; height: 54px; }
.inner-page .site-header .main-nav { margin-left: auto; padding: 0; background: transparent; border: 0; border-radius: 0; }
.inner-page .site-header .main-nav a { padding: 10px 12px; background: transparent; border-radius: 0; font-size: .78rem; }
.inner-page .site-header .main-nav a:hover { background: #f0f7f1; }
.inner-page .site-header .main-nav a.active { color: var(--green); background: transparent; box-shadow: none; }
.inner-page .site-header .main-nav a.active::after { position: absolute; right: 12px; bottom: 1px; left: 12px; display: block; height: 2px; content: ""; background: var(--green); }
.service-ref-main { padding: 0; }
.service-ref-hero { padding: 24px 0 30px; }
.service-ref-crumbs { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 0 0 8px; color: #68756e; font-size: .72rem; }
.service-ref-crumbs a,.service-ref-crumbs > span { display: inline-flex; align-items: center; gap: 6px; }
.service-ref-crumbs a { color: #53645c; text-decoration: none; transition: color .2s ease,transform .2s ease; }
.service-ref-crumbs a:hover { color: var(--green); transform: translateY(-1px); }
.service-ref-crumbs .lucide-icon { width: 13px; height: 13px; color: #98a59e; }
.service-ref-crumbs a .lucide-icon { color: var(--green); }
.service-ref-crumbs .crumb-current {
  padding: 5px 9px;
  color: var(--green-dark);
  background: linear-gradient(135deg,#edf7ef,#fff8ed);
  border: 1px solid #d5e7d8;
  border-radius: 999px;
  font-weight: 700;
}
.service-ref-crumbs .crumb-current .lucide-icon { color: var(--orange); }
.service-icon-nav { display: grid; grid-template-columns: repeat(6,1fr); gap: 6px; margin: 14px 0 18px; padding: 7px; background: #f7faf8; border: 1px solid #e2eae4; border-radius: 14px; }
.service-icon-nav a { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 43px; padding: 8px 7px; color: #44524a; border-radius: 9px; font: 700 .63rem/1.15 Manrope,sans-serif; text-align: center; text-decoration: none; transition: color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease; }
.service-icon-nav a:hover { color: var(--green); background: #fff; box-shadow: 0 7px 18px rgba(35,75,45,.09); transform: translateY(-1px); }
.service-icon-nav a.active { color: #fff; background: var(--green); box-shadow: 0 7px 18px rgba(46,125,50,.2); }
.service-icon-nav .lucide-icon { width: 19px; height: 19px; flex: 0 0 19px; }
.service-ref-hero-grid { display: grid; grid-template-columns: minmax(0,.9fr) minmax(420px,1.1fr); align-items: center; gap: 60px; }
.service-ref-hero-grid > * { min-width: 0; }
.service-ref-visual,
.service-ref-visual-generic,
.service-ref-visual-unified,
.agent-hero-visual { aspect-ratio: 16 / 10; overflow: hidden; }
.landlord-hero-visual,
.contact-hero-v2 { aspect-ratio: 16 / 10; overflow: hidden; }
.service-ref-visual img,
.service-ref-visual-generic img,
.service-ref-visual-unified img,
.agent-hero-visual img,
.landlord-hero-visual img,
.contact-hero-v2 img { width: 100%; height: 100%; object-fit: cover; }
.landlord-hero-visual img { object-position: 69% center; }
.contact-hero-v2 img { object-position: 66% center; }
.service-ref-audiences article > img { aspect-ratio: 4 / 3; object-fit: cover; }
.service-ref-footer-grid > a img { display: block; height: 46px; width: auto; }
.service-ref-copy { padding: 25px 0 10px; }
.service-ref-label { display: inline-flex; margin-bottom: 13px; padding: 6px 13px; color: var(--green); background: #edf7ef; border: 1px solid #dbeade; border-radius: 999px; font: 800 .67rem/1 Manrope,sans-serif; text-transform: uppercase; }
.service-ref-copy h1 { max-width: 570px; margin-bottom: 14px; font-size: clamp(2.55rem,4.1vw,3.75rem); line-height: 1.04; letter-spacing: -.05em; }
.service-ref-copy h1 em { display: block; color: var(--green); font-style: normal; }
.service-ref-copy > p { max-width: 570px; margin-bottom: 22px; color: #303c35; font-size: 1rem; line-height: 1.62; }
.service-ref-copy .button { gap: 8px; min-width: 165px; }
.service-ref-copy .button .lucide-icon { width: 19px; height: 19px; }
.service-ref-outline { color: #172033; background: #fff; border-color: #ccd5cf; box-shadow: none; }
.service-ref-outline:hover { color: var(--green); background: #f5faf6; border-color: #99c7a1; }
.service-ref-rating { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; margin-top: 23px; color: #34423b; font-size: .72rem; }
.service-ref-rating .tp-stars { padding: 2px 5px; font-size: .7rem; }
.service-ref-visual { overflow: hidden; border-radius: 14px; box-shadow: 0 20px 50px rgba(32,55,42,.12); }
.service-ref-visual img { width: 100%; height: 315px; object-fit: cover; object-position: center; border-radius: 14px; box-shadow: none; }
.service-ref-visual-generic { overflow: hidden; border-radius: 14px; box-shadow: 0 20px 50px rgba(32,55,42,.12); }
.service-ref-visual-generic img { height: 315px; object-fit: cover; object-position: center; box-shadow: none; }
.service-ref-visual-unified img,.service-ref-visual-generic img { object-position: 68% center; }
.service-ref-trust { border-block: 1px solid #e8ece9; }
.service-ref-trust > div { display: grid; grid-template-columns: repeat(5,1fr); }
.service-ref-trust > div > div { display: flex; align-items: center; gap: 14px; min-height: 82px; padding: 15px 18px; }
.service-ref-trust > div > div:nth-child(3) { color: #fff; background: var(--orange); }
.service-ref-trust > div > div:nth-child(3) .lucide-icon,.service-ref-trust > div > div:nth-child(3) small { color: #fff; }
.service-ref-trust > div > div:nth-child(4) { color: var(--orange); background: #fff8f0; }
.service-ref-trust > div > div:nth-child(4) .lucide-icon { color: var(--orange); }
.service-ref-trust > div > div:nth-child(4) small { color: #93520f; }
.service-ref-trust .lucide-icon { width: 34px; height: 34px; color: #111827; stroke-width: 1.7; }
.service-ref-trust span { display: grid; }
.service-ref-trust b { font: 700 .77rem/1.25 Manrope,sans-serif; }
.service-ref-trust small { color: #69756f; font-size: .63rem; }
.service-ref-section { padding: 30px 0 12px; }
.service-ref-heading { margin-bottom: 20px; text-align: center; }
.service-ref-heading span { display: block; margin-bottom: 7px; color: var(--green); font: 800 .65rem/1 Manrope,sans-serif; letter-spacing: .04em; text-transform: uppercase; }
.service-ref-heading h2 { margin: 0; font-size: clamp(1.7rem,2.8vw,2.35rem); }
.service-ref-benefits { display: grid; grid-template-columns: repeat(4,1fr); gap: 24px; }
.service-ref-benefits article { min-height: 225px; padding: 28px 22px; text-align: center; background: #fff; border: 1px solid #dde4df; border-radius: 9px; }
.service-ref-benefits .lucide-icon { width: 51px; height: 51px; margin: 0 auto 18px; color: var(--green); stroke-width: 1.7; }
.service-ref-benefits h3 { margin-bottom: 9px; font-size: 1.02rem; }
.service-ref-benefits p { margin: 0; color: #5f6b65; font-size: .76rem; line-height: 1.6; }
.landlord-services { padding-top: 20px; }
.landlord-services .service-ref-benefits article { min-height: 245px; }
.landlord-services .service-ref-benefits a { display: inline-block; margin-top: 15px; color: var(--green); font-size: .7rem; font-weight: 800; text-decoration: none; }

.areas-ref-main { padding: 0; }
.areas-service-hero { padding-block: 24px 32px; }
.areas-service-hero .service-ref-hero-grid { grid-template-columns: minmax(0,.88fr) minmax(460px,1.12fr); }
.areas-service-hero .areas-ref-copy h1 {
  max-width: 600px;
  margin-bottom: 15px;
  font-size: clamp(2.75rem,4.3vw,4rem);
  line-height: 1.02;
}
.areas-service-hero .areas-ref-copy > p { max-width: 570px; color: #4b5952; }
.areas-hero-visual {
  position: relative;
  min-width: 0;
  min-height: 365px;
  padding: 22px 195px 22px 20px;
  overflow: hidden;
  background: linear-gradient(145deg,#f4faf5,#fff);
  border: 1px solid #e2e9e4;
  border-radius: 12px;
  box-shadow: 0 20px 50px rgba(24,54,36,.09);
}
.areas-hero-visual .areas-ref-map { height: 320px; aspect-ratio: auto; }
.areas-hero-visual .areas-ref-panel {
  position: absolute;
  z-index: 2;
  top: 25px;
  right: 20px;
  width: 205px;
  padding: 20px;
}
.areas-hero-visual .areas-ref-panel h2 { font-size: 1rem; }
.areas-hero-visual .areas-ref-panel li { font-size: .62rem; }
.areas-hero-visual .areas-ref-panel label { font-size: .6rem; }
/* keep the panel's CTA single-line and inside the card (was wrapping + overflowing) */
.areas-hero-visual .areas-ref-panel .button { width: 100%; min-height: 40px; margin-top: 14px; padding: 9px 12px; font-size: .66rem; white-space: nowrap; }
.areas-ref-hero { padding: 22px 0 26px; background: linear-gradient(110deg,#fff 0%,#fff 57%,#f4faf5 100%); }
.areas-ref-hero .breadcrumbs { margin-bottom: 18px; }
.areas-ref-hero-grid { display: grid; grid-template-columns: minmax(0,.88fr) minmax(330px,.9fr) minmax(250px,.55fr); align-items: center; gap: 32px; }
.areas-ref-copy h1 { max-width: 500px; margin-bottom: 12px; font-size: clamp(2.65rem,4.4vw,4rem); line-height: 1.02; letter-spacing: -.052em; }
.areas-ref-copy h1 em { display: block; color: var(--green); font-style: normal; }
.areas-ref-copy > p:not(.eyebrow) { max-width: 510px; color: #48574f; font-size: .95rem; line-height: 1.6; }
.areas-ref-copy .button { gap: 8px; }
.areas-ref-map { min-width: 0; aspect-ratio: 4 / 3; }
.areas-ref-map img { width: 100%; height: 100%; max-height: 320px; object-fit: contain; mix-blend-mode: multiply; }
.areas-ref-panel { padding: 25px; background: #fff; border: 1px solid #e0e6e2; border-radius: 14px; box-shadow: 0 14px 40px rgba(28,60,39,.09); }
.areas-ref-panel h2 { margin-bottom: 15px; font-size: 1.15rem; }
.areas-ref-panel ul { display: grid; gap: 11px; padding: 0; margin: 0; list-style: none; }
.areas-ref-panel li { display: flex; align-items: center; gap: 8px; font-size: .72rem; }
.areas-ref-panel li .lucide-icon { width: 18px; height: 18px; color: var(--green); }
.areas-ref-panel hr { margin: 18px 0; border: 0; border-top: 1px solid #e6ebe8; }
.areas-ref-panel label { display: block; margin-bottom: 7px; font-size: .68rem; font-weight: 700; }
.areas-ref-panel small { display: block; margin-top: 7px; color: #718078; font-size: .58rem; }
.areas-postcode { display: flex; }
.areas-postcode input { width: 100%; min-width: 0; height: 45px; padding: 0 14px; border: 1px solid #d4ddd7; border-radius: 8px 0 0 8px; outline: none; }
.areas-postcode .button { min-height: 45px; padding-inline: 16px; border-radius: 0 8px 8px 0; box-shadow: none; }
.areas-ref-trust { color: #fff; background: #102838; }
.areas-ref-trust > div { display: grid; grid-template-columns: repeat(5,1fr); }
.areas-ref-trust > div > div { display: flex; align-items: center; gap: 13px; min-height: 72px; padding: 13px 18px; }
.areas-ref-trust .lucide-icon { width: 30px; height: 30px; }
.areas-ref-trust span { display: grid; }
.areas-ref-trust b { font-size: .73rem; }
.areas-ref-trust small { color: #c8d6d2; font-size: .6rem; }
.areas-ref-section { padding-block: 27px 8px; }
.areas-ref-heading { margin-bottom: 17px; text-align: center; }
.areas-ref-heading h2 { margin: 0; font-size: clamp(1.65rem,2.7vw,2.15rem); }
.areas-borough-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 10px 13px; }
.areas-borough-grid a { display: flex; align-items: center; gap: 9px; min-height: 43px; padding: 9px 14px; color: #26332d; border: 1px solid #dce4df; border-radius: 7px; font-size: .7rem; text-decoration: none; transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.areas-borough-grid a:hover { border-color: #9fc9a6; box-shadow: 0 7px 18px rgba(38,83,49,.08); transform: translateY(-2px); }
.areas-borough-grid .lucide-icon { width: 17px; height: 17px; color: var(--green); }
.areas-ref-search { display: grid; grid-template-columns: .8fr 1.5fr; align-items: center; gap: 35px; margin-top: 18px; padding: 20px 25px; background: #f0f7f2; border: 1px solid #dce9df; border-radius: 10px; }
.areas-ref-search h2 { margin: 0 0 2px; font-size: 1.05rem; }
.areas-ref-search p { margin: 0; color: #627068; font-size: .65rem; }
.areas-region-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; }
.areas-region-grid article { display: grid; grid-template-columns: 64px 1fr; gap: 15px; min-height: 160px; padding: 22px 18px; border: 1px solid #dde5e0; border-radius: 9px; }
.areas-region-grid > article > .lucide-icon { width: 55px; height: 55px; color: var(--green); }
.areas-region-grid h3 { margin-bottom: 6px; font-size: .86rem; }
.areas-region-grid p { margin-bottom: 12px; color: #5d6b63; font-size: .63rem; line-height: 1.55; }
.areas-region-grid a,.areas-service-grid a { color: var(--green); font-size: .66rem; font-weight: 800; text-decoration: none; }
.areas-service-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; }
.areas-service-grid article { min-height: 165px; padding: 22px; border: 1px solid #dde5e0; border-radius: 9px; }
.areas-service-grid article > div { display: grid; width: 50px; height: 50px; margin-bottom: 12px; color: var(--green); background: #eef8ef; border-radius: 50%; place-items: center; }
.areas-service-grid h3 { margin-bottom: 7px; font-size: .9rem; }
.areas-service-grid p { margin-bottom: 13px; color: #5d6b63; font-size: .64rem; line-height: 1.55; }
.areas-ref-faq { padding-bottom: 28px; }

@media (max-width: 900px) {
  .areas-ref-main { padding-top: 64px; }
  .areas-service-hero { padding-top: 18px; }
  .areas-service-hero .service-ref-hero-grid { grid-template-columns: 1fr; }
  .areas-hero-visual { min-height: 0; padding: 18px; }
  .areas-hero-visual .areas-ref-map { height: 280px; padding-right: 150px; }
  .areas-hero-visual .areas-ref-panel { top: 20px; right: 18px; width: 190px; }
  .areas-ref-hero-grid { grid-template-columns: 1fr; gap: 20px; }
  .areas-ref-copy h1 { font-size: clamp(2.35rem,10vw,3.2rem); }
  .areas-ref-map { order: 2; }
  .areas-ref-panel { order: 3; }
  .areas-ref-trust > div { display: flex; padding-bottom: 7px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: var(--orange) rgba(255,255,255,.16); }
  .areas-ref-trust > div > div { flex: 0 0 72%; scroll-snap-align: start; }
  .areas-borough-grid { grid-template-columns: repeat(2,1fr); }
  .areas-ref-search { grid-template-columns: 1fr; gap: 13px; }
  .areas-region-grid,.areas-service-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 540px) {
  .areas-service-hero .areas-ref-copy h1 { font-size: clamp(2.2rem,10vw,2.75rem); overflow-wrap: normal; }
  .areas-service-hero .button-row { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .areas-service-hero .button {
    width: 100%;
    min-width: 0;
    padding-inline: 10px;
    font-size: .68rem;
    white-space: normal;
    text-align: center;
  }
  .areas-hero-visual { display: grid; gap: 12px; }
  .areas-hero-visual .areas-ref-map { height: 220px; padding-right: 0; }
  .areas-hero-visual .areas-ref-panel { position: static; width: 100%; }
  .areas-borough-grid,.areas-region-grid,.areas-service-grid { grid-template-columns: 1fr; }
  .areas-ref-map img { max-height: 260px; }
}

.blog-ref-main { padding-bottom: 30px; }
.blog-service-hero { padding-block: 24px 32px; }
.blog-service-hero .service-ref-hero-grid { grid-template-columns: minmax(0,.88fr) minmax(420px,1.12fr); }
.blog-service-hero .blog-ref-copy { padding: 0; }
.blog-service-hero .blog-ref-copy h1 {
  max-width: 600px;
  margin: 12px 0 15px;
  font-size: clamp(2.75rem,4.3vw,4rem);
  line-height: 1.02;
}
.blog-service-hero .blog-ref-copy h1 em { display: block; color: var(--green); font-style: normal; }
.blog-service-hero .blog-ref-copy > p { max-width: 580px; color: #4b5952; font-size: .95rem; }
.blog-ref-visual { box-shadow: 0 20px 50px rgba(24,54,36,.09); }
.blog-ref-visual img { object-position: center; }
.blog-ref-hero { background: linear-gradient(100deg,#f4faf6 0%,#fff 55%); }
.blog-ref-hero > div { display: grid; grid-template-columns: 1.12fr .95fr; align-items: stretch; }
.blog-ref-hero > div > * { min-width: 0; }
.blog-ref-copy { padding: 50px 35px 42px 0; }
.blog-ref-copy h1 { margin-bottom: 14px; font-size: clamp(3rem,5vw,4.5rem); line-height: 1; }
.blog-ref-copy > p:not(.eyebrow) { max-width: 620px; color: #37463e; font-size: 1.05rem; }
.blog-ref-hero > div > img { width: 100%; height: 100%; min-height: 330px; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 14px 0 0 14px; }
.blog-ref-benefits { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; margin-top: 35px; }
.blog-ref-benefits > span { display: grid; grid-template-columns: 42px 1fr; align-items: center; gap: 3px 10px; }
.blog-ref-benefits .lucide-icon { grid-row: 1 / 3; width: 36px; height: 36px; padding: 7px; color: var(--green); background: #eaf6ec; border-radius: 50%; }
.blog-ref-benefits b { font-size: .72rem; }
.blog-ref-benefits small { color: #68766f; font-size: .59rem; }
.blog-ref-content { padding-block: 28px; }
.blog-ref-tools { display: grid; grid-template-columns: 1fr 190px; gap: 20px; }
.blog-ref-search { display: flex; align-items: center; gap: 10px; height: 48px; padding: 0 15px; border: 1px solid #dce3df; border-radius: 9px; }
.blog-ref-search .lucide-icon { width: 20px; height: 20px; color: #65736c; }
.blog-ref-search input { width: 100%; border: 0; outline: 0; }
.blog-ref-tools select { padding: 0 15px; background: #fff; border: 1px solid #dce3df; border-radius: 9px; }
.blog-ref-filters { display: flex; gap: 12px; padding: 19px 0 27px; overflow-x: auto; scrollbar-width: thin; scrollbar-color: var(--green) #e6eee8; }
.blog-ref-filters button { flex: 0 0 auto; min-height: 38px; padding: 0 22px; color: #29372f; background: #fff; border: 1px solid #dce3df; border-radius: 999px; cursor: pointer; font-size: .68rem; }
.blog-ref-filters button.active,.blog-ref-filters button:hover { color: #fff; background: var(--green); border-color: var(--green); }
.blog-ref-filters a { flex: 0 0 auto; display: inline-flex; align-items: center; min-height: 38px; padding: 0 22px; color: #29372f; background: #fff; border: 1px solid #dce3df; border-radius: 999px; font-size: .68rem; text-decoration: none; }
.blog-ref-filters a.active,.blog-ref-filters a:hover { color: #fff; background: var(--green); border-color: var(--green); }
.blog-ref-empty { padding: 45px 0; text-align: center; color: #5d6a63; }
.article-related-grid a { display: block; color: inherit; text-decoration: none; }
.blog-ref-grid article h2 a,.blog-ref-grid article footer a { color: inherit; text-decoration: none; }
.blog-ref-grid article footer a { color: var(--green); font-weight: 700; }
.blog-ref-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 25px 22px; }
.blog-ref-grid article { overflow: hidden; background: #fff; border: 1px solid #dce3df; border-radius: 9px; box-shadow: 0 6px 20px rgba(35,62,44,.035); }
.blog-ref-grid article > img { width: 100%; height: 180px; aspect-ratio: 16 / 10; object-fit: cover; }
.blog-ref-grid article > div { padding: 17px; }
.blog-ref-grid article span { color: var(--green); font: 800 .64rem/1 Manrope,sans-serif; text-transform: uppercase; }
.blog-ref-grid article h2 { min-height: 55px; margin: 9px 0; font-size: 1.12rem; line-height: 1.28; letter-spacing: -.025em; }
.blog-ref-grid article p { min-height: 58px; color: #5d6a63; font-size: .7rem; line-height: 1.58; }
.blog-ref-grid article footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.blog-ref-grid article small { color: #6c7972; font-size: .58rem; }
.blog-ref-grid article a { color: var(--green); font-size: .65rem; font-weight: 800; text-decoration: none; }
.blog-pagination { display: flex; justify-content: center; gap: 8px; padding: 25px 0 5px; }
.blog-pagination a,.blog-pagination span { display: grid; width: 33px; height: 33px; color: #35443c; border: 1px solid #d9e2dc; border-radius: 6px; font-size: .7rem; text-decoration: none; place-items: center; }
.blog-pagination a.active { color: #fff; background: var(--green); border-color: var(--green); }
.blog-newsletter { display: grid; grid-template-columns: 70px 1fr 1.5fr; align-items: center; gap: 22px; padding: 25px 30px; background: linear-gradient(90deg,#edf7ef,#f8fbf9); border: 1px solid #dce8df; border-radius: 10px; }
.blog-newsletter-icon { display: grid; width: 62px; height: 62px; color: #fff; background: var(--green); border: 6px double #fff; border-radius: 50%; box-shadow: 0 0 0 1px var(--green); place-items: center; }
.blog-newsletter h2 { margin: 0 0 4px; font-size: 1.3rem; }
.blog-newsletter p { margin: 0; color: #5f6d65; font-size: .72rem; }
.blog-newsletter form { display: grid; grid-template-columns: 1fr auto; }
.blog-newsletter input { min-width: 0; padding: 0 14px; border: 1px solid #d6dfd9; border-radius: 8px 0 0 8px; }
.blog-newsletter .button { min-height: 43px; border-radius: 0 8px 8px 0; box-shadow: none; }
.blog-newsletter form small { grid-column: 1 / -1; display: flex; align-items: center; gap: 5px; margin-top: 7px; color: #67756e; font-size: .56rem; }
.blog-newsletter form small .lucide-icon { width: 13px; height: 13px; color: var(--green); }

@media (max-width: 900px) {
  .blog-ref-main { padding-top: 64px; }
  .blog-service-hero { padding-top: 18px; }
  .blog-service-hero .service-ref-hero-grid { grid-template-columns: 1fr; }
  .blog-service-hero .blog-ref-copy { padding: 8px 0 0; }
  .blog-ref-visual { order: 2; }
  .blog-ref-hero > div { grid-template-columns: 1fr; }
  .blog-ref-copy { padding: 35px 0 25px; }
  .blog-ref-copy h1 { font-size: clamp(2.6rem,11vw,3.5rem); }
  .blog-ref-hero > div > img { min-height: 230px; border-radius: 14px; }
  .blog-ref-benefits { gap: 12px; }
  .blog-ref-tools { grid-template-columns: 1fr; }
  .blog-ref-grid { grid-template-columns: 1fr 1fr; }
  .blog-newsletter { grid-template-columns: 60px 1fr; }
  .blog-newsletter form { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .blog-service-hero .blog-ref-copy h1 { font-size: clamp(2.2rem,10vw,2.75rem); overflow-wrap: normal; }
  .blog-service-hero .service-ref-visual img { height: 230px; }
  .blog-ref-benefits { grid-template-columns: 1fr; }
  .blog-ref-grid { grid-template-columns: 1fr; }
  .blog-ref-grid article h2,.blog-ref-grid article p { min-height: 0; }
  .blog-newsletter { grid-template-columns: 1fr; text-align: center; }
  .blog-newsletter-icon { margin: auto; }
  .blog-newsletter form { grid-column: auto; }
}

.booking-ref-main { padding: 0; }
.booking-ref-hero { background: linear-gradient(100deg,#fff 0%,#fff 43%,#f2f8f3 100%); }
.booking-ref-hero .breadcrumbs { padding-top: 18px; margin-bottom: 10px; }
.booking-ref-hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; min-height: 285px; }
.booking-ref-hero-grid > * { min-width: 0; }
.booking-ref-hero-grid h1 { margin-bottom: 12px; font-size: clamp(2.8rem,4.5vw,4.15rem); line-height: 1.02; }
.booking-ref-hero-grid > div > p:not(.eyebrow) { max-width: 620px; color: #4b5952; }
.booking-ref-hero-grid > img { width: 100%; height: 285px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 12px 0 0 12px; }
.booking-ref-hero-grid > img,.article-ref-hero > img {
  transition: transform .55s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease,filter .35s ease;
}
.booking-ref-hero-grid:hover > img,.article-ref-hero:hover > img {
  filter: saturate(1.035);
  box-shadow: 0 20px 42px rgba(24,54,36,.12);
  transform: translateY(-3px) scale(1.008);
}
.booking-ref-benefits { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 28px; }
.booking-ref-benefits span { display: inline-flex; align-items: center; gap: 7px; font-size: .66rem; font-weight: 700; }
.booking-ref-benefits .lucide-icon { width: 19px; height: 19px; color: var(--green); }
.booking-ref-section { padding-block: 25px; }
#book { scroll-margin-top: 84px; }
@media (max-width: 800px) { #book { scroll-margin-top: 66px; } .booking-ref-section { padding-top: 14px; } }
.booking-ref-layout { display: grid; grid-template-columns: minmax(0,1fr) 310px; gap: 22px; }
.booking-ref-form,.booking-sidebar > section { padding: 22px; background: #fff; border: 1px solid #dce4df; border-radius: 10px; box-shadow: 0 8px 25px rgba(33,61,42,.04); }
.booking-steps { display: grid; grid-template-columns: repeat(5,1fr); gap: 5px; padding-bottom: 20px; margin-bottom: 18px; border-bottom: 1px solid #e2e8e4; }
.booking-steps span { position: relative; display: grid; justify-items: center; gap: 5px; color: #68766f; font-size: .6rem; text-align: center; }
.booking-steps span:not(:last-child)::after { position: absolute; top: 14px; left: 62%; width: 76%; content: ""; border-top: 2px solid #d7ded9; }
.booking-steps b { position: relative; z-index: 1; display: grid; width: 29px; height: 29px; color: #fff; background: #aeb8b2; border-radius: 50%; font-size: .68rem; place-items: center; }
.booking-steps span.active { color: #17231c; font-weight: 700; }
.booking-steps span.active b { background: var(--green); }
.booking-ref-form fieldset { padding: 0 0 18px; margin: 0 0 18px; border: 0; border-bottom: 1px solid #e3e9e5; }
.booking-ref-form legend { margin-bottom: 14px; font: 700 .94rem Manrope,sans-serif; }
.booking-ref-form legend small { color: #78857e; font: 400 .65rem Inter,sans-serif; }
.booking-service-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.booking-service-grid label { position: relative; display: grid; align-content: start; justify-items: center; min-height: 205px; padding: 20px 12px; text-align: center; border: 1px solid #d6ded9; border-radius: 8px; cursor: pointer; }
.booking-service-grid label.selected { background: #f1f9f2; border-color: var(--green); box-shadow: inset 0 0 0 1px var(--green); }
.booking-service-grid input,.booking-time-options input { position: absolute; opacity: 0; }
.booking-check { position: absolute; top: 9px; right: 9px; display: none; width: 20px; height: 20px; color: #fff; background: var(--green); border-radius: 50%; font-size: .7rem; place-items: center; }
.booking-service-grid label.selected .booking-check { display: grid; }
.booking-service-grid .lucide-icon { width: 43px; height: 43px; margin: 3px 0 13px; color: var(--green); }
.booking-service-grid b { font: 700 .82rem/1.25 Manrope,sans-serif; }
.booking-service-grid small { margin-top: 10px; color: #536159; font-size: .62rem; line-height: 1.5; }
.booking-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.booking-ref-form label { display: grid; gap: 6px; margin-bottom: 12px; font-size: .66rem; font-weight: 700; }
.booking-ref-form input,.booking-ref-form select,.booking-ref-form textarea { min-width: 0; min-height: 44px; padding: 9px 12px; border: 1px solid #d8e0db; border-radius: 6px; font-weight: 400; }
.booking-ref-form textarea { width: 100%; min-height: 80px; resize: vertical; }
.booking-coverage,.booking-ref-form fieldset > small { display: flex; align-items: center; gap: 5px; color: #607067; font-size: .57rem; }
.booking-coverage { color: var(--green); }
.booking-coverage .lucide-icon,.booking-ref-form fieldset > small .lucide-icon { width: 13px; height: 13px; }
.booking-time-label { display: block; margin-bottom: 7px; font-size: .66rem; font-weight: 700; }
.booking-time-options { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 10px; }
.booking-time-options label { display: grid; min-height: 68px; margin: 0; padding: 10px; text-align: center; border: 1px solid #d7dfda; border-radius: 7px; cursor: pointer; place-content: center; }
.booking-time-options label.selected { color: var(--green); background: #f0f8f1; border-color: var(--green); box-shadow: inset 0 0 0 1px var(--green); }
.booking-time-options b { font-size: .82rem; }
.booking-time-options small { font-size: .57rem; }
.booking-details-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 13px; }
.booking-submit { width: 100%; min-height: 45px; }
.booking-secure { display: flex; justify-content: center; align-items: center; gap: 6px; margin: 10px 0 0; color: #69766f; font-size: .57rem; }
.booking-secure .lucide-icon { width: 13px; height: 13px; color: var(--green); }
.booking-sidebar { display: grid; align-content: start; gap: 14px; }
.booking-sidebar h2 { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; font-size: 1rem; }
.booking-sidebar h2 .lucide-icon { width: 20px; height: 20px; color: var(--green); }
.booking-summary dl { margin: 0; }
.booking-summary dl div { display: flex; justify-content: space-between; gap: 15px; padding: 10px 0; border-bottom: 1px solid #e5eae7; font-size: .65rem; }
.booking-summary dt { font-weight: 700; }
.booking-summary dd { margin: 0; text-align: right; }
.booking-price { display: flex; justify-content: space-between; gap: 15px; padding-top: 15px; color: var(--green); font-size: .75rem; }
.booking-sidebar ul { display: grid; gap: 8px; padding: 0; margin: 0; list-style: none; }
.booking-sidebar li { position: relative; padding-left: 20px; color: #435249; font-size: .63rem; }
.booking-sidebar li::before { position: absolute; left: 0; content: "✓"; color: var(--green); font-weight: 800; }
.booking-sidebar p { color: #536159; font-size: .65rem; }
.booking-sidebar a { color: var(--green); font-weight: 700; }
.booking-how { padding-bottom: 28px; text-align: center; }
.booking-how > h2 { font-size: 1.4rem; text-align: left; }
.booking-how > div { display: grid; grid-template-columns: repeat(4,1fr); }
.booking-how article { position: relative; padding: 10px 25px; border-right: 1px solid #dce4df; }
.booking-how article:last-child { border-right: 0; }
.booking-how .lucide-icon { width: 40px; height: 40px; padding: 8px; color: var(--green); background: #edf7ef; border-radius: 50%; }
.booking-how article > b { display: block; color: var(--green); font-size: .65rem; }
.booking-how h3 { margin: 4px 0; font-size: .75rem; }
.booking-how p { color: #617068; font-size: .56rem; }

@media (max-width: 900px) {
  .booking-ref-main { padding-top: 64px; }
  .booking-ref-hero-grid { grid-template-columns: 1fr; }
  .booking-ref-hero-grid > img { height: 230px; border-radius: 12px; }
  .booking-ref-layout { grid-template-columns: 1fr; }
  .booking-sidebar { grid-template-columns: 1fr 1fr; }
  .booking-summary { grid-row: span 2; }
  .booking-service-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .booking-ref-hero-grid h1 { font-size: 2.55rem; }
  .booking-service-grid,.booking-two-col,.booking-details-grid,.booking-sidebar,.booking-how > div { grid-template-columns: 1fr; }
  .booking-service-grid label { min-height: 155px; }
  .booking-steps { overflow-x: auto; grid-template-columns: repeat(5,85px); }
  .booking-how article { border-right: 0; border-bottom: 1px solid #dce4df; }
}

.contact-ref-main { padding: 0; }
.contact-service-hero { padding-block: 24px 32px; }
.contact-service-hero .service-ref-hero-grid { grid-template-columns: minmax(0,.9fr) minmax(420px,1.1fr); }
.contact-service-hero .contact-ref-copy h1 {
  max-width: 600px;
  margin-bottom: 15px;
  font-size: clamp(2.75rem,4.3vw,4rem);
  line-height: 1.02;
}
.contact-service-hero .contact-ref-copy h1 em { display: block; color: var(--green); font-style: normal; }
.contact-service-hero .contact-ref-copy > p { max-width: 570px; color: #4b5952; font-size: .95rem; }
.contact-service-hero .service-ref-rating { margin-top: 24px; }
.contact-ref-visual { box-shadow: 0 20px 50px rgba(24,54,36,.09); }
.contact-ref-section { width: min(var(--layout-max),calc(100% - (var(--layout-gutter) * 2))); }
.contact-ref-grid { gap: 22px; }
.contact-ref-form,.contact-ref-info {
  border-radius: 9px;
  box-shadow: 0 7px 24px rgba(33,61,42,.035);
}
.contact-ref-form { padding: 30px; }
.contact-ref-info { padding: 30px; }
.contact-method-grid article {
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.contact-method-grid article:hover {
  border-color: #abd2b1;
  box-shadow: 0 12px 28px rgba(35,75,45,.08);
  transform: translateY(-3px);
}
.contact-ref-hero { position: relative; min-height: 355px; overflow: hidden; background: url('assets/images/homepage-hero-london-sunset.jpg') center/cover no-repeat; }
.contact-ref-overlay { position: absolute; inset: 0; background: linear-gradient(90deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.75) 48%,rgba(255,255,255,.1) 75%); }
.contact-ref-hero > .shell { position: relative; display: grid; grid-template-columns: 1.2fr .75fr; align-items: center; gap: 90px; min-height: 355px; }
.contact-ref-hero > .shell > *,
.contact-ref-grid > *,
.contact-ref-bottom > * { min-width: 0; }
.contact-ref-copy h1 { margin-bottom: 13px; font-size: clamp(3.1rem,5vw,4.6rem); line-height: .98; }
.contact-ref-copy h1 em { display: block; color: var(--green); font-style: normal; }
.contact-ref-copy > p { max-width: 570px; color: #35443c; font-size: 1rem; }
.contact-ref-copy .button { gap: 8px; }
.contact-ref-chips { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 24px; }
.contact-ref-chips span { display: inline-flex; align-items: center; gap: 7px; font-size: .68rem; font-weight: 700; }
.contact-ref-chips .lucide-icon { width: 18px; height: 18px; color: var(--green); }
.contact-ref-summary { display: grid; gap: 0; padding: 20px 28px; background: rgba(255,255,255,.96); border: 1px solid rgba(215,225,218,.9); border-radius: 13px; box-shadow: 0 17px 42px rgba(26,56,36,.14); }
.contact-ref-summary > div,.contact-ref-info > div { display: flex; align-items: center; gap: 14px; padding: 13px 0; border-bottom: 1px solid #e3e9e5; }
.contact-ref-summary > div:last-child,.contact-ref-info > div:last-child { border-bottom: 0; }
.contact-ref-summary .lucide-icon,.contact-ref-info .lucide-icon { width: 25px; height: 25px; color: var(--green); }
.contact-ref-summary span,.contact-ref-info span { display: grid; }
.contact-ref-summary b,.contact-ref-info b { font-size: .65rem; }
.contact-ref-summary strong { font-size: .76rem; }
.contact-ref-summary small,.contact-ref-info small { color: #3f4c45; font-size: .66rem; }
.contact-ref-section { padding-block: 28px 8px; }
.contact-ref-grid { display: grid; grid-template-columns: 1.25fr .85fr; gap: 28px; }
.contact-ref-form,.contact-ref-info { padding: 27px; background: #fff; border: 1px solid #dce4df; border-radius: 10px; }
.contact-ref-form h2,.contact-ref-info h2,.contact-faq h2 { margin-bottom: 17px; font-size: 1.35rem; }
.contact-ref-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.contact-ref-fields input,.contact-ref-fields select,.contact-ref-fields textarea { min-width: 0; min-height: 45px; padding: 10px 13px; border: 1px solid #d8e0db; border-radius: 6px; }
.contact-ref-fields select,.contact-ref-fields textarea,.contact-ref-fields button { grid-column: 1 / -1; }
.contact-ref-fields textarea { min-height: 115px; resize: vertical; }
.contact-ref-fields .button { gap: 8px; min-height: 45px; }
.contact-ref-fields .button .lucide-icon { width: 18px; height: 18px; }
.contact-ref-form .form-note { display: flex; align-items: center; gap: 6px; margin: 12px 0 0; color: #69766f; font-size: .6rem; }
.contact-ref-form .form-note .lucide-icon { width: 13px; height: 13px; }
.contact-method-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 17px; }
.contact-method-grid article { min-height: 210px; padding: 25px 20px; text-align: center; border: 1px solid #dce4df; border-radius: 9px; }
.contact-method-grid .lucide-icon { width: 48px; height: 48px; margin: 0 auto 16px; color: var(--green); }
.contact-method-grid h3 { margin-bottom: 9px; font-size: 1rem; }
.contact-method-grid p { color: #5f6d65; font-size: .68rem; line-height: 1.55; }
.contact-method-grid a { color: var(--green); font-size: .7rem; font-weight: 800; text-decoration: none; }
.contact-ref-bottom { display: grid; grid-template-columns: 1.2fr .8fr; gap: 20px; padding-bottom: 28px; }
.contact-coverage { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; padding: 23px; background: #eff7f0; border: 1px solid #dce9df; border-radius: 10px; }
.contact-coverage h2 { margin-bottom: 8px; color: var(--green); font-size: 1.25rem; }
.contact-coverage p { color: #4e5d55; font-size: .68rem; }
.contact-coverage img { width: 100%; max-height: 220px; aspect-ratio: 4 / 3; object-fit: contain; mix-blend-mode: multiply; }
.contact-coverage > div > a,.contact-faq > a { display: inline-block; margin-top: 12px; color: var(--green); font-size: .68rem; font-weight: 800; text-decoration: none; }
.contact-faq { padding: 23px; border: 1px solid #dce4df; border-radius: 10px; }
.contact-faq details { border: 1px solid #dde4df; border-bottom: 0; }
.contact-faq details:last-of-type { border-bottom: 1px solid #dde4df; }
.contact-faq summary { display: flex; justify-content: space-between; padding: 11px 13px; font-size: .7rem; cursor: pointer; list-style: none; }
.contact-faq summary::-webkit-details-marker { display: none; }
.contact-faq details p { margin: 0; padding: 0 13px 12px; color: #5d6b63; font-size: .64rem; }

.pricing-ref-main { padding: 0; }
.pricing-service-hero { padding-block: 24px 34px; }
.pricing-service-hero .service-ref-hero-grid { grid-template-columns: minmax(0,.92fr) minmax(390px,.78fr); }
.pricing-service-hero .service-ref-copy h1 { max-width: 650px; font-size: clamp(2.8rem,4.4vw,4.1rem); }
.pricing-service-hero .service-ref-copy h1 em { display: block; color: var(--green); font-style: normal; }
.pricing-hero-card { position: relative; min-height: 350px; padding: 38px; overflow: hidden; color: #fff; background: linear-gradient(145deg,#0d3028,#18813b); border-radius: 14px; box-shadow: 0 24px 55px rgba(17,66,39,.2); }
.pricing-hero-card {
  display: flex;
  justify-content: flex-end;
  flex-direction: column;
  background:
    linear-gradient(90deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.9) 48%,rgba(255,255,255,.08) 76%),
    url('assets/images/service-hero-unified.jpg') center/cover no-repeat;
  color: var(--ink);
}
.pricing-hero-card::after { opacity: .28; }
.pricing-hero-card > p { color: var(--green); }
.pricing-hero-card h2 { color: var(--ink); }
.pricing-hero-card ul { color: #34423b; }
.pricing-hero-card a { color: var(--green); }
.pricing-hero-card > ul,
.pricing-hero-card > a { display: none; }
.pricing-hero-card > span,
.pricing-hero-card > p,
.pricing-hero-card > h2,
.pricing-hero-card > ul,
.pricing-hero-card > a { position: relative; z-index: 1; max-width: 330px; }
.pricing-hero-card::after { position: absolute; right: -80px; bottom: -110px; width: 280px; height: 280px; content: ""; background: rgba(255,143,0,.18); border-radius: 50%; }
.pricing-hero-card > span { display: grid; width: 56px; height: 56px; color: var(--green); background: #fff; border-radius: 50%; place-items: center; }
.pricing-hero-card > span .lucide-icon { width: 29px; height: 29px; }
.pricing-hero-card > p { margin: 20px 0 4px; color: #bfe1c8; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.pricing-hero-card h2 { margin-bottom: 18px; font-size: 2rem; }
.pricing-hero-card h2 em { color: #ffb04a; font-style: normal; }
.pricing-hero-card ul { display: grid; gap: 7px; padding-left: 18px; color: #e4f1e8; font-size: .72rem; }
.pricing-hero-card a { position: relative; z-index: 1; color: #fff; font-size: .72rem; font-weight: 800; text-decoration: none; }
.pricing-section { padding-block: 36px; }
.pricing-section .service-ref-heading > p { max-width: 720px; margin: 10px auto 0; color: #627068; font-size: .72rem; }
.pricing-card-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; }
.pricing-card-grid article { position: relative; display: flex; min-height: 490px; padding: 25px 22px; flex-direction: column; background: #fff; border: 1px solid #dce4df; border-radius: 12px; box-shadow: 0 8px 28px rgba(35,62,44,.04); transition: transform .2s ease,box-shadow .2s ease,border-color .2s ease; }
.pricing-card-grid article:hover { border-color: #a7cfae; box-shadow: 0 18px 38px rgba(35,75,45,.1); transform: translateY(-5px); }
.pricing-card-grid article.featured { background: linear-gradient(160deg,#fff 58%,#f0f8f1); border-color: #8bc596; box-shadow: 0 16px 38px rgba(35,90,48,.1); }
.pricing-card-tag { position: absolute; top: 15px; right: 15px; padding: 5px 9px; color: #9a4e00; background: #fff0df; border-radius: 999px; font-size: .55rem; font-weight: 800; text-transform: uppercase; }
.pricing-card-icon { display: grid; width: 54px; height: 54px; margin-bottom: 20px; color: var(--green); background: #edf7ef; border-radius: 14px; place-items: center; }
.pricing-card-icon .lucide-icon { width: 28px; height: 28px; }
.pricing-card-grid h3 { margin-bottom: 8px; font-size: 1.05rem; }
.pricing-card-grid > article > p { min-height: 64px; color: #617068; font-size: .68rem; }
.pricing-status { padding: 13px 0; margin-bottom: 12px; border-block: 1px solid #e2e8e4; }
.pricing-status small,.pricing-status strong { display: block; }
.pricing-status small { color: #75827b; font-size: .58rem; text-transform: uppercase; }
.pricing-status strong { color: var(--green); font: 800 1.05rem Manrope,sans-serif; }
.pricing-card-grid ul { display: grid; gap: 9px; padding: 0; margin: 0 0 22px; list-style: none; }
.pricing-card-grid li { display: flex; align-items: center; gap: 7px; color: #46554d; font-size: .62rem; }
.pricing-card-grid li .lucide-icon { width: 15px; height: 15px; flex: 0 0 15px; color: var(--green); }
.pricing-card-grid .button { width: 100%; min-height: 44px; margin-top: auto; font-size: .7rem; }
.pricing-process { padding-block: 38px; background: #f4f8f5; border-block: 1px solid #e1e8e3; }
.pricing-steps { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; }
.pricing-steps article { position: relative; min-height: 185px; padding: 25px; background: #fff; border: 1px solid #dce4df; border-radius: 10px; }
.pricing-steps article > .lucide-icon { width: 38px; height: 38px; color: var(--green); }
.pricing-steps article > b { position: absolute; top: 20px; right: 20px; display: grid; width: 27px; height: 27px; color: #fff; background: var(--orange); border-radius: 50%; place-items: center; font-size: .68rem; }
.pricing-steps h3 { margin: 19px 0 7px; font-size: .9rem; }
.pricing-steps p { color: #617068; font-size: .64rem; }
.pricing-factor-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 15px; }
.pricing-factor-grid article { display: grid; grid-template-columns: 55px 1fr; gap: 16px; padding: 22px; border: 1px solid #dce4df; border-radius: 10px; }
.pricing-factor-grid article > .lucide-icon { width: 48px; height: 48px; padding: 9px; color: var(--green); background: #edf7ef; border-radius: 50%; }
.pricing-factor-grid h3 { margin-bottom: 6px; font-size: .9rem; }
.pricing-factor-grid p { margin: 0; color: #617068; font-size: .66rem; }
.pricing-faq { padding-top: 10px; }

.borough-ref-main { padding: 0; }
.borough-service-hero { padding-block: 24px 34px; }
.borough-service-hero .service-ref-hero-grid { grid-template-columns: minmax(0,.88fr) minmax(440px,1.12fr); }
.borough-service-hero .service-ref-copy h1 { max-width: 620px; font-size: clamp(2.8rem,4.4vw,4.1rem); }
.borough-service-hero .service-ref-copy h1 em { display: block; color: var(--green); font-style: normal; }
.borough-hero-visual {
  position: relative;
  min-height: 365px;
  overflow: hidden;
  isolation: isolate;
  background: #f3f8f4;
  border: 1px solid #d4e4d7;
  border-radius: 16px;
  box-shadow: 0 24px 58px rgba(24,54,36,.13),0 8px 24px rgba(255,126,0,.05);
}
.borough-hero-visual::before {
  position: absolute;
  z-index: 1;
  inset: 0;
  content: "";
  background:
    linear-gradient(90deg,rgba(255,255,255,.12) 35%,transparent 72%),
    radial-gradient(circle at 88% 15%,rgba(255,126,0,.16),transparent 28%),
    linear-gradient(145deg,transparent 58%,rgba(18,105,51,.16));
  pointer-events: none;
}
.borough-hero-visual::after {
  position: absolute;
  z-index: 2;
  top: 18px;
  right: 18px;
  width: 70px;
  height: 4px;
  content: "";
  background: linear-gradient(90deg,var(--green),var(--orange));
  border-radius: 999px;
  box-shadow: 0 0 18px rgba(255,126,0,.26);
}
.borough-hero-property { width: 100%; height: 100%; min-height: 365px; object-fit: cover; object-position: 68% center; transition: transform .7s cubic-bezier(.2,.7,.2,1),filter .4s ease; }
/* the hero image is injected via shortcode and gets wrapped in a <p> by wpautop — neutralise it */
.borough-hero-visual p { display: contents; margin: 0; }
.borough-hero-map {
  position: absolute;
  z-index: 3;
  right: 20px;
  bottom: 20px;
  width: 235px;
  padding: 12px 13px 13px;
  background: linear-gradient(145deg,rgba(255,255,255,.97),rgba(242,249,244,.94));
  border: 1px solid rgba(171,207,178,.95);
  border-top: 3px solid var(--orange);
  border-radius: 13px;
  box-shadow: 0 17px 38px rgba(25,58,37,.18),0 4px 16px rgba(255,126,0,.08);
  backdrop-filter: blur(12px);
  transition: transform .35s ease,box-shadow .35s ease;
}
.borough-hero-map::after {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 8px;
  height: 8px;
  content: "";
  background: var(--orange);
  border: 3px solid #fff;
  border-radius: 50%;
  box-shadow: 0 0 0 4px rgba(255,126,0,.15);
}
.borough-hero-map img { width: 100%; height: 134px; object-fit: contain; mix-blend-mode: multiply; filter: saturate(1.12) contrast(1.03); }
.borough-hero-map span { display: flex; align-items: center; gap: 6px; color: var(--green-dark); font-size: .64rem; font-weight: 800; letter-spacing: .01em; }
.borough-hero-map .lucide-icon { width: 16px; height: 16px; }
.borough-hero-visual:hover .borough-hero-property { filter: saturate(1.07) contrast(1.015); transform: scale(1.022); }
.borough-hero-visual:hover .borough-hero-map { box-shadow: 0 22px 48px rgba(25,58,37,.22),0 7px 20px rgba(255,126,0,.12); transform: translateY(-5px); }
.borough-local-grid,.borough-service-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 17px; }
.borough-local-grid article,.borough-service-grid article { min-height: 205px; padding: 25px 21px; background: #fff; border: 1px solid #dce4df; border-radius: 10px; transition: transform .25s ease,box-shadow .25s ease,border-color .25s ease; }
.borough-local-grid article:hover,.borough-service-grid article:hover { border-color: #a8cfaf; box-shadow: 0 15px 34px rgba(35,75,45,.09); transform: translateY(-5px); }
.borough-local-grid > article > .lucide-icon,.borough-service-grid article > div { width: 50px; height: 50px; margin-bottom: 16px; padding: 10px; color: var(--green); background: #edf7ef; border-radius: 14px; }
.borough-service-grid article > div { display: grid; place-items: center; }
.borough-service-grid article > div .lucide-icon { width: 29px; height: 29px; }
.borough-local-grid h3,.borough-service-grid h3 { margin-bottom: 8px; font-size: .92rem; }
.borough-local-grid p,.borough-service-grid p { color: #617068; font-size: .66rem; }
.borough-service-grid a,.borough-coverage-grid a { color: var(--green); font-size: .68rem; font-weight: 800; text-decoration: none; }
.borough-coverage-section { padding-block: 38px; background: linear-gradient(110deg,#edf7ef,#fff); border-block: 1px solid #dce8df; }
.borough-coverage-grid { display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: 50px; }
.borough-coverage-grid h2 { margin: 12px 0 8px; font-size: 2rem; }
.borough-coverage-grid p { color: #58675f; }
.borough-coverage-grid .areas-postcode { max-width: 520px; margin: 18px 0 8px; }
.borough-coverage-grid > img { width: 100%; height: 285px; object-fit: contain; mix-blend-mode: multiply; transition: transform .5s ease; }
.borough-coverage-grid:hover > img { transform: translateY(-4px) scale(1.01); }

/* Restrained shared micro-interactions for hero imagery and controls. */
.service-ref-visual,.blog-ref-visual,.contact-ref-visual,.areas-hero-visual,.pricing-hero-card {
  transition: transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease,border-color .35s ease;
}
.service-ref-visual img,.blog-ref-visual img,.contact-ref-visual img {
  transition: transform .65s cubic-bezier(.2,.7,.2,1),filter .35s ease;
}
.service-ref-visual:hover,.blog-ref-visual:hover,.contact-ref-visual:hover,.areas-hero-visual:hover,.pricing-hero-card:hover {
  box-shadow: 0 28px 62px rgba(24,54,36,.14);
  transform: translateY(-4px);
}
.service-ref-visual:hover img,.blog-ref-visual:hover img,.contact-ref-visual:hover img { filter: saturate(1.035); transform: scale(1.018); }
.button { position: relative; isolation: isolate; overflow: hidden; }
.button::before { position: absolute; z-index: -1; inset: 0; content: ""; background: rgba(255,255,255,.13); transform: scaleX(0); transform-origin: left; transition: transform .3s ease; }
.button:hover::before { transform: scaleX(1); }
.service-ref-copy h1 em { transition: letter-spacing .35s ease,color .35s ease; }
.service-ref-hero:hover .service-ref-copy h1 em { letter-spacing: -.025em; }

@media (max-width: 900px) {
  .contact-ref-main { padding-top: 64px; }
  .contact-service-hero { padding-top: 18px; }
  .contact-service-hero .service-ref-hero-grid { grid-template-columns: 1fr; }
  .contact-service-hero .contact-ref-copy h1 { font-size: clamp(2.25rem,8.8vw,3rem); }
  .contact-ref-visual { order: 2; }
  .contact-ref-hero > .shell { grid-template-columns: 1fr; gap: 22px; padding-block: 35px; }
  .contact-ref-overlay { background: rgba(255,255,255,.88); }
  .contact-ref-copy h1 { font-size: clamp(2.7rem,11vw,3.7rem); }
  .contact-ref-summary { max-width: 500px; }
  .contact-ref-grid,.contact-ref-bottom { grid-template-columns: 1fr; }
  .contact-method-grid { grid-template-columns: 1fr 1fr; }
  .pricing-ref-main { padding-top: 64px; }
  .pricing-service-hero .service-ref-hero-grid { grid-template-columns: 1fr; }
  .pricing-card-grid,.pricing-steps { grid-template-columns: 1fr 1fr; }
  .borough-ref-main { padding-top: 64px; }
  .borough-service-hero .service-ref-hero-grid { grid-template-columns: 1fr; }
  .borough-local-grid,.borough-service-grid { grid-template-columns: 1fr 1fr; }
  .borough-coverage-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .contact-ref-fields,.contact-method-grid,.contact-coverage { grid-template-columns: 1fr; }
  .contact-service-hero .contact-ref-copy,
  .contact-service-hero .contact-ref-visual {
    width: 100%;
    max-width: none;
  }
  .contact-service-hero .contact-ref-copy h1 { overflow-wrap: normal; }
  .contact-service-hero .service-ref-visual img { height: 230px; }
  .contact-ref-hero > .shell {
    width: auto !important;
    max-width: none;
    margin-inline: var(--layout-gutter);
  }
  .contact-ref-copy,
  .contact-ref-summary {
    width: 100%;
    max-width: calc(100vw - (var(--layout-gutter) * 2));
  }
  .contact-ref-copy h1,
  .contact-ref-copy > p { max-width: 100%; overflow-wrap: anywhere; }
  .contact-ref-copy .button-row { display: grid; grid-template-columns: 1fr 1fr; }
  .contact-ref-chips { gap: 9px; }
  .contact-coverage img { order: -1; }
  .pricing-service-hero .service-ref-copy h1 { font-size: clamp(2.25rem,10vw,2.8rem); }
  .pricing-service-hero .button-row { display: grid; grid-template-columns: 1fr 1fr; }
  .pricing-service-hero .button { min-width: 0; padding-inline: 10px; font-size: .68rem; white-space: normal; text-align: center; }
  .pricing-hero-card { min-height: 320px; padding: 28px 24px; }
  .pricing-card-grid,.pricing-steps,.pricing-factor-grid { grid-template-columns: 1fr; }
  .pricing-card-grid article { min-height: 0; }
  .home-format-hero .service-ref-copy { width: 100%; max-width: calc(100vw - (var(--layout-gutter) * 2)); }
  .home-format-hero .button-row { grid-template-columns: minmax(0,1fr) minmax(0,1fr); width: 100%; }
  .home-format-hero .button { width: 100%; min-width: 0 !important; padding-inline: 8px; font-size: .68rem; white-space: normal; }
  .borough-service-hero .service-ref-copy h1 { font-size: clamp(2.2rem,10vw,2.75rem); }
  .borough-service-hero .button-row { display: grid; grid-template-columns: 1fr 1fr; }
  .borough-service-hero .button { min-width: 0; padding-inline: 10px; font-size: .68rem; }
  .borough-hero-visual,.borough-hero-property { min-height: 300px; }
  .borough-hero-map { right: 12px; bottom: 12px; width: 170px; }
  .borough-hero-map img { height: 90px; }
  .borough-local-grid,.borough-service-grid { grid-template-columns: 1fr; }
}

@media (max-width: 430px) {
  .home-format-hero .button-row { grid-template-columns: 1fr; }
  .borough-service-hero .button-row { grid-template-columns: 1fr; }
  .borough-service-hero .service-ref-copy h1 { font-size: clamp(2.05rem,9.2vw,2.45rem); overflow-wrap: anywhere; }
  .borough-service-hero .button { width: 100%; }
  .landlord-service-hero .button-row,
  .contact-service-hero .button-row { display: grid; grid-template-columns: 1fr; width: 100%; }
  .landlord-service-hero .button,
  .contact-service-hero .button { width: 100%; min-width: 0; }
}

@media (hover: none) {
  .service-ref-visual:hover,.blog-ref-visual:hover,.contact-ref-visual:hover,.areas-hero-visual:hover,.pricing-hero-card:hover,
  .borough-hero-visual:hover,.borough-local-grid article:hover,.borough-service-grid article:hover { transform: none; }
  .booking-ref-hero-grid:hover > img,.article-ref-hero:hover > img { filter: none; box-shadow: none; transform: none; }
}

/* Master first-fold format: header → split hero → feature bar. */
@media (min-width: 901px) {
  .service-ref-hero {
    display: flex;
    min-height: clamp(580px,calc(100svh - 158px),720px);
    padding-block: 24px 34px;
    align-items: stretch;
  }
  .service-ref-hero > .service-ref-shell {
    display: flex;
    flex-direction: column;
  }
  .service-ref-hero-grid {
    flex: 1;
    min-height: 0;
    align-items: center;
  }
  .service-ref-visual,
  .service-ref-visual-generic,
  .service-ref-visual-unified,
  .agent-hero-visual,
  .blog-ref-visual,
  .contact-ref-visual {
    height: clamp(365px,45vh,430px);
    aspect-ratio: auto;
  }
  .service-ref-visual img,
  .service-ref-visual-generic img,
  .service-ref-visual-unified img,
  .agent-hero-visual img,
  .blog-ref-visual img,
  .contact-ref-visual img {
    width: 100%;
    height: 100%;
  }
  .areas-hero-visual,
  .borough-hero-visual,
  .pricing-hero-card {
    height: clamp(365px,45vh,430px);
    min-height: 0;
  }
  .areas-hero-visual .areas-ref-map { height: 100%; }
  .article-ref-hero {
    min-height: clamp(500px,calc(100svh - 158px),650px);
    padding-block: 24px 34px;
  }
  .article-ref-hero > img { height: clamp(365px,45vh,430px); border-radius: 14px; }
  .booking-ref-hero-grid { min-height: clamp(500px,calc(100svh - 158px),650px); }
  .booking-ref-hero-grid > img { height: clamp(365px,45vh,430px); border-radius: 14px; }
  .service-ref-trust { flex: 0 0 82px; }
}

/* Unified hero typography and brand treatment. */
.service-ref-copy h1,
.contact-service-hero .contact-ref-copy h1,
.areas-service-hero .areas-ref-copy h1,
.blog-service-hero .blog-ref-copy h1,
.pricing-service-hero .service-ref-copy h1,
.borough-service-hero .service-ref-copy h1,
.article-ref-hero h1,
.booking-ref-hero-grid h1 {
  max-width: 620px;
  margin-bottom: 16px;
  font-size: clamp(2.65rem,3.55vw,3.55rem);
  line-height: 1.04;
  letter-spacing: -.05em;
}
.service-ref-copy h1 em,
.contact-service-hero .contact-ref-copy h1 em,
.areas-service-hero .areas-ref-copy h1 em,
.blog-service-hero .blog-ref-copy h1 em,
.pricing-service-hero .service-ref-copy h1 em,
.borough-service-hero .service-ref-copy h1 em {
  color: var(--green);
}
.service-ref-visual,
.service-ref-visual-generic,
.service-ref-visual-unified,
.agent-hero-visual,
.blog-ref-visual,
.contact-ref-visual,
.areas-hero-visual,
.borough-hero-visual,
.pricing-hero-card,
.article-ref-hero > img,
.booking-ref-hero-grid > img {
  border: 1px solid #e1e8e3;
  border-radius: 14px;
  box-shadow: 0 22px 52px rgba(24,54,36,.1);
}
.home-hero-visual img,
.service-ref-visual-unified img,
.service-ref-visual-generic img,
.contact-ref-visual img,
.pricing-hero-card {
  object-position: 68% center;
}
.blog-ref-visual img,
.booking-ref-hero-grid > img {
  object-position: 68% center;
}
.blog-ref-visual img { content: url('assets/images/service-hero-unified.jpg'); }
.booking-ref-hero-grid > img { content: url('assets/images/booking-hero-reference.jpg'); object-position: 62% center; }

/* Booking hero is intentionally more compact than the content-led service heroes. */
@media (min-width: 901px) {
  .booking-ref-hero-grid {
    grid-template-columns: minmax(0,1.08fr) minmax(410px,.82fr);
    min-height: clamp(430px,calc(100svh - 220px),540px);
    gap: 54px;
  }
  .booking-ref-hero-grid > img {
    width: 100%;
    height: clamp(300px,36vh,350px);
    aspect-ratio: 16 / 10;
    border-radius: 14px;
  }
}

@media (max-width: 900px) {
  .service-ref-copy h1,
  .contact-service-hero .contact-ref-copy h1,
  .areas-service-hero .areas-ref-copy h1,
  .blog-service-hero .blog-ref-copy h1,
  .pricing-service-hero .service-ref-copy h1,
  .borough-service-hero .service-ref-copy h1,
  .article-ref-hero h1,
  .booking-ref-hero-grid h1 {
    font-size: clamp(2.15rem,9vw,2.8rem);
    overflow-wrap: normal;
  }
}

.article-ref-main { padding-bottom: 28px; }
.article-ref-breadcrumb { padding-top: 18px; }
.article-ref-breadcrumb .breadcrumbs { margin-bottom: 18px; }
.article-ref-hero { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); align-items: center; gap: 55px; padding-bottom: 25px; }
.article-ref-hero > * { min-width: 0; }
.article-ref-hero h1 { max-width: 560px; margin: 12px 0; font-size: clamp(2.55rem,4.3vw,3.8rem); line-height: 1.03; }
.article-ref-hero > div > p { max-width: 550px; color: #435149; }
.article-ref-hero > img { width: 100%; height: 330px; object-fit: cover; border-radius: 10px; }
.article-author { display: flex; align-items: center; gap: 10px; margin-top: 20px; }
.article-author img { width: 43px; height: 43px; object-fit: cover; border-radius: 50%; }
.article-author span { display: grid; }
.article-author b { font-size: .67rem; }
.article-author small { color: #68766f; font-size: .57rem; }
.article-meta { display: flex; align-items: center; gap: 8px; margin-top: 13px; color: #69766f; font-size: .59rem; }
.article-meta .lucide-icon { width: 14px; height: 14px; }
.article-ref-layout { display: grid; grid-template-columns: minmax(0,1fr) 285px; align-items: start; gap: 55px; }
.article-ref-content { color: #28362f; font-size: .75rem; line-height: 1.7; }
.article-ref-content h2 { margin: 24px 0 7px; font-size: 1.35rem; letter-spacing: -.025em; }
.article-ref-content ul { padding-left: 0; list-style: none; }
.article-ref-content li { position: relative; padding-left: 20px; }
.article-ref-content li::before { position: absolute; left: 0; content: "●"; color: var(--green); font-size: .65rem; }
.article-ref-content h3 { margin: 20px 0 6px; font-size: 1.02rem; letter-spacing: -.02em; }
.article-ref-content p { margin: 0 0 .95rem; }
.article-ref-content a { color: var(--green); font-weight: 600; }
/* In-article data tables (e.g. EPC pricing) — clean styled grid */
.article-ref-content table { width: 100%; border-collapse: collapse; margin: 1.8rem 0; font-size: .72rem; border: 1px solid #e3ebe6; border-radius: 12px; overflow: hidden; box-shadow: 0 12px 30px rgba(31,41,55,.06); }
.article-ref-content thead th,.article-ref-content table tr:first-child th { padding: 12px 16px; color: #fff; background: var(--green,#2E7D32); text-align: left; font: 800 .7rem/1.25 Manrope,sans-serif; }
.article-ref-content td,.article-ref-content tbody th { padding: 11px 16px; border-top: 1px solid #eef3ef; color: #3d4a43; vertical-align: top; }
.article-ref-content tbody tr:nth-child(even) td { background: #fafcfb; }
.article-ref-content table strong { color: #1f3b2a; font-family: Manrope,sans-serif; }
@media (max-width: 600px) { .article-ref-content table { display: block; overflow-x: auto; } }
.article-inline-cta { display: grid; grid-template-columns: 50px 1fr auto; align-items: center; gap: 15px; margin-top: 24px; padding: 15px 20px; background: #f1f8f2; border: 1px solid #d7e8da; border-radius: 9px; }
.article-inline-cta > .lucide-icon { width: 42px; height: 42px; padding: 8px; color: var(--green); background: #fff; border-radius: 50%; }
.article-inline-cta p { margin: 2px 0 0; font-size: .62rem; }
.article-inline-cta .button { min-height: 40px; font-size: .65rem; }
.article-takeaways { margin-top: 14px; padding: 17px; background: #f2f8f3; border: 1px solid #d8e7da; border-radius: 9px; }
.article-takeaways h3 { display: flex; align-items: center; gap: 8px; margin-bottom: 13px; }
.article-takeaways h3 .lucide-icon { width: 25px; height: 25px; color: var(--green); }
.article-takeaways > div { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.article-takeaways span { padding-right: 10px; border-right: 1px solid #d4e0d7; font-size: .62rem; }
.article-takeaways span:last-child { border-right: 0; }
.article-faq { margin-top: 20px; }
.article-faq details { border: 1px solid #dce4df; border-bottom: 0; }
.article-faq details:last-child { border-bottom: 1px solid #dce4df; }
.article-faq summary { display: flex; justify-content: space-between; padding: 10px 13px; cursor: pointer; list-style: none; }
.article-faq summary::-webkit-details-marker { display: none; }
.article-faq details p { margin: 0; padding: 0 13px 12px; font-size: .65rem; }
.article-author-card { display: grid; grid-template-columns: 55px 1fr; gap: 14px; margin-top: 18px; padding: 15px; border: 1px solid #dce4df; border-radius: 9px; }
.article-author-card img { width: 52px; height: 52px; object-fit: cover; border-radius: 50%; }
.article-author-card h3 { margin: 1px 0; }
.article-author-card p { margin: 0; color: #637168; font-size: .62rem; }
.article-ref-sidebar { display: grid; gap: 14px; }
.article-ref-sidebar section { padding: 18px; border: 1px solid #dce4df; border-radius: 9px; }
.article-ref-sidebar h3 { display: flex; align-items: center; gap: 7px; margin-bottom: 13px; font-size: .85rem; }
.article-ref-sidebar h3 .lucide-icon { width: 18px; height: 18px; color: var(--green); }
.article-ref-sidebar dl { margin: 0; }
.article-ref-sidebar dl div { display: flex; justify-content: space-between; padding: 9px 0; border-bottom: 1px solid #e4e9e6; font-size: .62rem; }
.article-ref-sidebar dl div:last-child { border-bottom: 0; }
.article-ref-sidebar dd { margin: 0; text-align: right; }
.article-share { display: flex; gap: 9px; }
.article-share button { width: 35px; height: 35px; border: 0; border-radius: 50%; cursor: pointer; }
.article-side-cta { background: linear-gradient(145deg,#eef7f0,#fff); }
.article-side-cta p,.article-ref-sidebar section > p { color: #617068; font-size: .65rem; }
.article-side-cta .button { min-height: 40px; margin-bottom: 12px; font-size: .65rem; }
.article-side-image { width: 100%; height: 95px; aspect-ratio: 16 / 7; margin-bottom: 13px; object-fit: cover; border-radius: 6px; }
.article-ref-sidebar .service-ref-outline { min-height: 38px; font-size: .63rem; }
.article-related { padding-block: 25px; }
.article-related > div:first-child { display: flex; justify-content: space-between; align-items: center; }
.article-related > div:first-child a { color: var(--green); font-size: .65rem; font-weight: 700; text-decoration: none; }
.article-related-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; }
.article-related-grid article { overflow: hidden; border: 1px solid #dce4df; border-radius: 7px; }
.article-related-grid img { width: 100%; height: 105px; aspect-ratio: 16 / 9; object-fit: cover; }
.article-related-grid span,.article-related-grid h3,.article-related-grid small { display: block; margin-inline: 11px; }
.article-related-grid span { margin-top: 9px; color: var(--green); font-size: .53rem; font-weight: 800; text-transform: uppercase; }
.article-related-grid h3 { min-height: 42px; margin-block: 5px; font-size: .75rem; }
.article-related-grid small { margin-bottom: 10px; color: #6b7971; font-size: .54rem; }

@media (max-width: 900px) {
  .article-ref-main { padding-top: 64px; }
  .article-ref-hero { grid-template-columns: minmax(0,1fr); gap: 22px; }
  .article-ref-hero > img { height: 260px; }
  .article-ref-layout { grid-template-columns: 1fr; gap: 25px; }
  .article-ref-sidebar { grid-template-columns: 1fr 1fr; }
  .article-related-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .article-ref-breadcrumb,
  .article-ref-hero,
  .article-ref-layout,
  .article-related,
  .blog-newsletter {
    width: auto !important;
    max-width: none;
    margin-inline: var(--layout-gutter);
  }
  .article-ref-hero > div,
  .article-ref-hero > img {
    width: 100%;
    max-width: calc(100vw - (var(--layout-gutter) * 2));
  }
  .article-ref-hero h1 { max-width: 100%; font-size: clamp(2rem,10.5vw,2.4rem); overflow-wrap: anywhere; }
  .article-ref-hero > div > p { overflow-wrap: anywhere; }
  .article-ref-hero > img { width: 100%; height: auto; aspect-ratio: 16 / 10; }
  .article-ref-sidebar,.article-related-grid,.article-takeaways > div { grid-template-columns: 1fr; }
  .article-inline-cta { grid-template-columns: 42px 1fr; }
  .article-inline-cta .button { grid-column: 1 / -1; }
  .article-takeaways span { padding: 8px 0; border-right: 0; border-bottom: 1px solid #d4e0d7; }
}
.service-ref-steps-section { padding-top: 22px; }
.service-ref-steps { display: grid; grid-template-columns: repeat(3,1fr); gap: 65px; max-width: 960px; margin: auto; }
.service-ref-steps.four-steps { grid-template-columns: repeat(4,1fr); gap: 32px; max-width: 1180px; }
.service-ref-steps.four-steps article { grid-template-columns: 62px 1fr; padding-inline: 16px; }
.service-ref-steps.four-steps article:not(:last-child)::after { left: calc(100% + 5px); width: 22px; }
.service-ref-steps.four-steps .lucide-icon { width: 46px; height: 46px; }
.service-ref-steps article { position: relative; display: grid; grid-template-columns: 75px 1fr; align-items: center; min-height: 120px; padding: 20px; background: #fff; border: 1px solid #dde4df; border-radius: 9px; }
.service-ref-steps article:not(:last-child)::after { position: absolute; top: 50%; left: calc(100% + 8px); width: 48px; content: ""; border-top: 2px dashed #cad3cd; }
.service-ref-steps article > b { position: absolute; top: -15px; left: 50%; display: grid; width: 30px; height: 30px; color: var(--green); background: #fff; border: 1px solid #dce7df; border-radius: 50%; font: 800 .8rem/1 Manrope,sans-serif; place-items: center; }
.service-ref-steps .lucide-icon { width: 56px; height: 56px; color: var(--green); stroke-width: 1.7; }
.service-ref-steps h3 { margin: 0 0 6px; font-size: .92rem; }
.service-ref-steps p { margin: 0; color: #626f68; font-size: .65rem; line-height: 1.55; }
.service-ref-audiences { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.service-ref-audiences article { position: relative; display: grid; grid-template-columns: 48% 52%; min-height: 170px; overflow: hidden; background: #fff; border: 1px solid #dde4df; border-radius: 9px; }
.service-ref-audiences img { width: 100%; height: 100%; object-fit: cover; }
.service-ref-audiences article > div:last-child { padding: 24px 18px; }
.service-ref-audiences h3 { margin-bottom: 8px; font-size: .9rem; }
.service-ref-audiences p { margin-bottom: 14px; color: #5d6a63; font-size: .65rem; line-height: 1.55; }
.service-ref-audiences a { color: var(--green); font-size: .7rem; font-weight: 800; text-decoration: none; }
.service-ref-audience-icon { position: absolute; top: 22px; left: calc(48% - 25px); display: grid; width: 50px; height: 50px; color: var(--green); background: #eff8f0; border-radius: 50%; place-items: center; }
.service-ref-audience-icon .lucide-icon { width: 27px; height: 27px; }
.service-ref-faq { padding-bottom: 25px; }
.service-ref-faq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 30px; }
.service-ref-faq details { border: 1px solid #dde4df; border-bottom: 0; }
.service-ref-faq details:nth-last-child(-n+2) { border-bottom: 1px solid #dde4df; }
.service-ref-faq summary { display: flex; justify-content: space-between; padding: 12px 18px; font: 600 .72rem/1.3 Inter,sans-serif; cursor: pointer; list-style: none; }
.service-ref-faq summary::-webkit-details-marker { display: none; }
.service-ref-faq details p { margin: 0; padding: 0 18px 15px; color: #5c6962; font-size: .7rem; }
.service-ref-cta { margin-top: 8px; color: #fff; }
.service-ref-cta > div { display: grid; grid-template-columns: 65px 1.5fr auto 1fr 1fr; align-items: center; gap: 18px; min-height: 105px; padding: 18px 35px; background: linear-gradient(110deg,#08752d,#008435); border-radius: 10px; }
.service-ref-cta-icon { display: grid; width: 58px; height: 58px; color: var(--green); background: #fff; border-radius: 50%; place-items: center; }
.service-ref-cta-icon .lucide-icon { width: 32px; height: 32px; }
.service-ref-cta h2 { margin: 0 0 3px; font-size: 1.3rem; }
.service-ref-cta p { margin: 0; color: #e6f6ea; font-size: .7rem; }
.service-ref-cta .button { min-height: 43px; color: var(--green); background: #fff; border-color: #fff; font-size: .72rem; }
.service-ref-contact { display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; }
.service-ref-contact .lucide-icon { width: 30px; height: 30px; }
.service-ref-contact span { display: grid; }
.service-ref-contact b { font-size: .72rem; }
.service-ref-contact small { color: #d4f0dc; font-size: .6rem; }
.service-ref-footer { padding-top: 18px; background: #fff; }
.service-ref-footer-grid { display: grid; grid-template-columns: 1.15fr repeat(4,.82fr) 1.05fr; gap: 24px; padding: 0 20px 18px; }
.service-ref-footer-grid > a img { height: 46px; width: auto; max-width: 230px; }
.service-ref-footer-grid > div { display: grid; align-content: start; gap: 3px; }
.service-ref-footer-grid b { margin-bottom: 4px; font-size: .68rem; }
.service-ref-footer-grid a,.service-ref-footer-grid span { color: #38463f; font-size: .57rem; text-decoration: none; }
.service-ref-partner { display: grid; align-content: start; justify-items: end; gap: 7px; }
.service-ref-partner > span { color: #75827c; font: 700 .52rem/1 Manrope,sans-serif; letter-spacing: .1em; text-transform: uppercase; }
.service-ref-partner img { display: block; width: 250px; max-width: 100%; height: auto; }
.service-ref-footer-bottom { color: #d4e0dc; background: #0d2631; font-size: .57rem; }
.service-ref-footer-bottom > div { display: flex; justify-content: space-between; padding-block: 9px; }

@media (max-width: 900px) {
  .service-ref-shell { width: min(var(--layout-max),calc(100% - (var(--layout-gutter) * 2))); }
  .service-ref-header { position: fixed; right: 0; left: 0; }
  .service-ref-nav { min-height: 64px; }
  .service-ref-brand img { height: 44px; max-width: 200px; }
  .service-ref-header .main-nav { top: 64px; }
  .service-ref-main { padding-top: 64px; }
  .service-ref-hero { padding-top: 18px; }
  .service-ref-hero-grid { grid-template-columns: 1fr; gap: 24px; }
  .service-icon-nav { display: flex; margin-inline: -2px; padding-bottom: 13px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: var(--green) #e5eee7; }
  .service-icon-nav::-webkit-scrollbar { display: block; height: 7px; }
  .service-icon-nav::-webkit-scrollbar-track { background: #e5eee7; border-radius: 999px; }
  .service-icon-nav::-webkit-scrollbar-thumb { background: linear-gradient(90deg,var(--green),var(--orange)); border: 1px solid #fff; border-radius: 999px; }
  .service-icon-nav a { flex: 0 0 145px; justify-content: flex-start; scroll-snap-align: start; }
  .service-ref-copy { padding-top: 8px; }
  .service-ref-copy h1 { font-size: clamp(2.1rem,8.7vw,2.85rem); }
  .service-ref-visual { order: 2; }
  .service-ref-visual img,.service-ref-visual-generic img { height: 260px; }
  .service-ref-trust > div { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
  .service-ref-trust > div > div { flex: 0 0 70%; scroll-snap-align: start; }
  .service-ref-benefits { grid-template-columns: 1fr 1fr; gap: 12px; }
  .service-ref-benefits article { min-height: 200px; }
  .service-ref-steps { grid-template-columns: 1fr; gap: 25px; }
  .service-ref-steps.four-steps { grid-template-columns: 1fr; gap: 25px; }
  .service-ref-steps article:not(:last-child)::after { display: none; }
  .service-ref-audiences { grid-template-columns: 1fr; }
  .service-ref-faq-grid { grid-template-columns: 1fr; gap: 0; }
  .service-ref-faq details:nth-last-child(-n+2) { border-bottom: 0; }
  .service-ref-faq details:last-child { border-bottom: 1px solid #dde4df; }
  .service-ref-cta > div { grid-template-columns: 55px 1fr; padding: 20px; }
  .service-ref-cta .button,.service-ref-contact { grid-column: 1 / -1; justify-content: center; }
  .service-ref-footer-grid { grid-template-columns: 1fr 1fr; }
  .service-ref-footer-grid > a { grid-column: 1 / -1; }
  .service-ref-partner { grid-column: 1 / -1; justify-items: start; }
}

@media (max-width: 520px) {
  .service-ref-copy .button-row { display: grid; grid-template-columns: 1fr 1fr; }
  .service-ref-copy .button { min-width: 0; padding-inline: 12px; font-size: .72rem; }
  .service-ref-benefits { grid-template-columns: 1fr; }
  .service-ref-benefits article { min-height: 0; }
  .service-ref-audiences article { grid-template-columns: 43% 57%; }
  .service-ref-audience-icon { left: calc(43% - 23px); }
  .service-ref-footer-grid { grid-template-columns: 1fr 1fr; gap: 22px; }
}

/* Homepage-inspired FAQ tiles used consistently across page templates. */
.service-ref-faq,
.areas-ref-faq { padding-block: 34px 30px; }
.service-ref-faq .service-ref-heading,
.areas-ref-faq .areas-ref-heading { margin-bottom: 25px; }
.service-ref-faq-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px 14px;
}
.service-ref-faq-grid details,
.article-faq details,
.contact-faq details {
  overflow: hidden;
  background: #fff;
  border: 1px solid #dce4df !important;
  border-radius: 14px;
  box-shadow: 0 5px 16px rgba(31,55,40,.035);
  transition: background .25s ease,border-color .25s ease,box-shadow .25s ease,transform .25s ease;
}
.service-ref-faq-grid details:hover,
.article-faq details:hover,
.contact-faq details:hover {
  border-color: #b7d3bc !important;
  box-shadow: 0 11px 25px rgba(31,75,42,.08);
  transform: translateY(-2px);
}
.service-ref-faq-grid details[open],
.article-faq details[open],
.contact-faq details[open] {
  background: linear-gradient(135deg,#fff8f0,#fffdf9);
  border-color: #efc79e !important;
  box-shadow: 0 14px 30px rgba(180,91,10,.09);
}
.service-ref-faq-grid summary,
.article-faq summary,
.contact-faq summary {
  display: flex;
  min-height: 54px;
  padding: 15px 17px;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  color: #26332d;
  font: 700 .74rem/1.35 Manrope,Inter,sans-serif;
  cursor: pointer;
  list-style: none;
}
.service-ref-faq-grid summary::-webkit-details-marker,
.article-faq summary::-webkit-details-marker,
.contact-faq summary::-webkit-details-marker { display: none; }
.service-ref-faq-grid summary span,
.article-faq summary span,
.contact-faq summary span {
  display: grid;
  width: 25px;
  height: 25px;
  flex: 0 0 25px;
  color: #fff;
  background: var(--green);
  border-radius: 50%;
  transition: background .25s ease,transform .25s ease;
  place-items: center;
}
.service-ref-faq-grid details[open] summary span,
.article-faq details[open] summary span,
.contact-faq details[open] summary span {
  background: var(--orange);
  transform: rotate(180deg);
}
.service-ref-faq-grid details p,
.article-faq details p,
.contact-faq details p {
  margin: 0;
  padding: 0 48px 17px 17px;
  color: #5c675f;
  font-size: .68rem;
  line-height: 1.65;
}

@media (max-width: 700px) {
  .service-ref-faq-grid { grid-template-columns: 1fr; }
  .service-ref-faq-grid details:hover,
  .article-faq details:hover,
  .contact-faq details:hover { transform: none; }
}

/* Final desktop first-fold geometry; kept last to override legacy template rules. */
@media (min-width: 901px) {
  .service-ref-hero {
    display: flex;
    min-height: clamp(580px,calc(100svh - 158px),720px);
    padding-block: 24px 34px;
    align-items: stretch;
  }
  .service-ref-hero > .service-ref-shell { display: flex; flex-direction: column; }
  .service-ref-hero-grid { flex: 1; min-height: 0; align-items: center; }
  .service-ref-visual,
  .service-ref-visual-generic,
  .service-ref-visual-unified,
  .agent-hero-visual,
  .blog-ref-visual,
  .contact-ref-visual {
    height: clamp(365px,45vh,430px);
    aspect-ratio: auto;
  }
  .service-ref-visual img,
  .service-ref-visual-generic img,
  .service-ref-visual-unified img,
  .agent-hero-visual img,
  .blog-ref-visual img,
  .contact-ref-visual img { width: 100%; height: 100%; }
  .areas-hero-visual,
  .borough-hero-visual,
  .pricing-hero-card { height: clamp(365px,45vh,430px); min-height: 0; }
  .areas-hero-visual .areas-ref-map { height: 100%; }
  .article-ref-hero {
    min-height: clamp(500px,calc(100svh - 158px),650px);
    padding-block: 24px 34px;
  }
  .article-ref-hero > img { height: clamp(365px,45vh,430px); border-radius: 14px; }
  .booking-ref-hero-grid { min-height: clamp(500px,calc(100svh - 158px),650px); }
  .booking-ref-hero-grid > img { height: clamp(365px,45vh,430px); border-radius: 14px; }
}

/* preserved long-form content on service pages */
.service-ref-prose{max-width:820px;margin:0 auto;color:#3d4a43;font-size:1.04rem;line-height:1.75;}
.service-ref-prose p{margin:0 0 1rem;}
.service-ref-prose ul{margin:0 0 1rem 1.2rem;}
.service-ref-prose li{margin:.35rem 0;}

/* Services dropdown (cluster integration) */
.service-ref-header{overflow:visible;}
.ep-nav-sub{position:relative;display:inline-flex;align-items:center;}
.ep-caret{font-size:.7em;margin-left:3px;font-weight:400;}
.ep-nav-sub>.ep-sub{position:absolute;top:calc(100% + 6px);left:0;min-width:248px;display:none;flex-direction:column;gap:2px;background:#fff;border:1px solid #e6ede8;border-radius:14px;box-shadow:0 20px 44px rgba(31,41,55,.16);padding:8px;z-index:70;}
.ep-nav-sub:hover>.ep-sub,.ep-nav-sub:focus-within>.ep-sub{display:flex;}
.ep-nav-sub .ep-sub a{padding:10px 12px;border-radius:9px;white-space:nowrap;font-size:.82rem;color:#37443d;}
.ep-nav-sub .ep-sub a:hover{background:#f0f7f1;color:var(--green-dark);}
@media (max-width:900px){
  .ep-nav-sub{display:block;}
  .ep-caret{display:none;}
  .ep-nav-sub>.ep-sub{position:static;display:flex;min-width:0;border:0;box-shadow:none;border-radius:0;padding:2px 0 6px 14px;}
  .ep-nav-sub .ep-sub a{font-size:.9rem;border-bottom:1px solid #eef3ef;}
}

/* style the embedded CF7 contact form to match the prototype form */
.contact-ref-form .wpcf7 input:not([type=submit]),.contact-ref-form .wpcf7 select,.contact-ref-form .wpcf7 textarea{width:100%;padding:13px 15px;margin:0 0 12px;border:1px solid #d8e2db;border-radius:11px;font:inherit;font-size:.95rem;background:#fff;box-sizing:border-box;}
.contact-ref-form .wpcf7 textarea{min-height:120px;resize:vertical;}
.contact-ref-form .wpcf7 input:focus,.contact-ref-form .wpcf7 select:focus,.contact-ref-form .wpcf7 textarea:focus{outline:none;border-color:var(--green,#2E7D32);box-shadow:0 0 0 3px rgba(46,125,50,.12);}
.contact-ref-form .wpcf7 input[type=submit],.contact-ref-form .wpcf7 .wpcf7-submit{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border:0;border-radius:13px;background:var(--green,#2E7D32);color:#fff;font-weight:800;cursor:pointer;}
.contact-ref-form .wpcf7 input[type=submit]:hover{background:var(--green-dark,#174D2C);}
.contact-ref-form .wpcf7-response-output{border-radius:10px;margin:.5rem 0 0;}

/* Borough/postcode pages: new-design wrapper + styled real content */
.borough-top{padding-top:1.4rem;}
.article-faq{display:grid;gap:12px;margin:1.9rem 0;}
.borough-prose .ep-area-cta{margin:2.2rem 0;padding:22px 26px;background:linear-gradient(135deg,#f4faf6,#fffdf9);border:1px solid #d3e7d8;border-left:4px solid var(--green,#2E7D32);border-radius:14px;box-shadow:0 10px 26px rgba(24,54,36,.06);}
.borough-prose .ep-area-cta p{margin:0 0 .5rem;color:#46544c;font-size:.95rem;line-height:1.55;opacity:1;}
.borough-prose .ep-area-cta p:first-child{margin-bottom:.4rem;color:#163a21;font-weight:800;font-size:1.18rem;font-family:Manrope,Inter,sans-serif;letter-spacing:-.01em;}
.borough-prose .ep-area-cta a.ep-area-cta-btn{display:inline-block;margin-top:.45rem;padding:10px 22px;background:var(--green,#2E7D32);color:#fff !important;font-weight:700;border-radius:8px;text-decoration:none !important;font-size:.9rem;}
.borough-prose .ep-area-cta a.ep-area-cta-btn:hover{background:#25652a;}
.borough-prose .ep-area-cta strong{color:#163a21;}
.borough-content-section{padding:2.4rem 0 1rem;}
.borough-prose{min-width:0;}
/* Hero shows the page title as H1; the body's duplicate title H1 is hidden */
.borough-prose h1{display:none;}
.borough-hero-copy .wp-block-post-title{margin:.2rem 0 .2rem;font-size:clamp(1.85rem,3.6vw,2.9rem);line-height:1.06;letter-spacing:-.02em;color:#16241c;}
.borough-prose h2{font-size:clamp(1.45rem,2.8vw,2.05rem);line-height:1.15;margin:2rem 0 .8rem;}
.borough-prose h3{font-size:1.2rem;margin:1.4rem 0 .5rem;}
.borough-prose p{line-height:1.72;margin:0 0 1rem;color:#3d4a43;}
.borough-prose ul,.borough-prose ol{line-height:1.72;margin:0 0 1rem 1.25rem;color:#3d4a43;}
.borough-prose li{margin:.35rem 0;}
.borough-prose a{color:var(--green,#2E7D32);}
.borough-prose img{border-radius:14px;height:auto;}
.borough-allareas{text-align:center;padding:.5rem 0 2.5rem;}

/* Borough hero credentials strip */
.ep-credentials{display:flex;flex-wrap:wrap;gap:.5rem .9rem;margin:1rem 0 1.1rem;padding:.85rem 1rem;background:#f0f8f2;border:1px solid #d9ebdf;border-radius:14px;font-size:.85rem;color:#37443d;font-weight:600;}
.ep-credentials>span{display:inline-flex;align-items:center;gap:.4rem;}
.ep-credentials .lucide-icon{width:16px;height:16px;color:var(--green,#2E7D32);}
.ep-cred-stars{color:#FDB022;letter-spacing:.06em;}
/* Pricing tiles */
.ep-pricing{max-width:920px;margin:0 auto;border:1px solid #e6ede8;border-radius:18px;overflow:hidden;box-shadow:0 18px 44px rgba(31,41,55,.07);}
.ep-pricing-head{display:flex;justify-content:space-between;padding:14px 20px;background:var(--green-dark,#174D2C);color:#fff;font-weight:800;font-family:Manrope,sans-serif;}
.ep-pricing-row{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:14px 20px;border-top:1px solid #eef3ef;background:#fff;}
.ep-pricing-row:nth-child(even){background:#fafcfb;}
.ep-pricing-row>span{display:inline-flex;align-items:center;gap:.6rem;color:#2b3630;font-weight:600;}
.ep-pricing-row .lucide-icon{width:22px;height:22px;color:var(--green,#2E7D32);flex:0 0 22px;}
.ep-pricing-row b{font-family:Manrope,sans-serif;font-size:1.05rem;white-space:nowrap;}
.ep-pricing-row small{color:#6b7a72;font-weight:500;}
.ep-pricing-row.is-best{background:#f0f8f2;}
.ep-pricing-row.is-best em{display:inline-block;margin-left:.4rem;padding:.15rem .55rem;border-radius:999px;background:var(--green,#2E7D32);color:#fff;font-style:normal;font-size:.66rem;font-weight:800;text-transform:uppercase;}
.ep-pricing-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:1rem;margin:1.4rem 0 0;}
@media(max-width:560px){.ep-pricing-row{flex-wrap:wrap;gap:.3rem;}.ep-pricing-row b{font-size:1rem;}}

/* Refine borough hero H1 (cap long headings for site-wide alignment) + content typography */
.borough-hero-copy h1{font-size:clamp(1.65rem,2.9vw,2.5rem)!important;max-width:680px;line-height:1.12;letter-spacing:-.03em;}
.borough-hero-copy h1 em{display:block;}
.borough-prose>p:first-of-type{font-size:1.1rem;color:#2b3630;}
.borough-prose h2{font-size:clamp(1.4rem,2.6vw,1.85rem);margin:2.2rem 0 .7rem;padding-left:.9rem;border-left:4px solid var(--green,#2E7D32);line-height:1.22;color:#1f2937;letter-spacing:-.01em;}
.borough-prose a{color:var(--green,#2E7D32);font-weight:600;text-decoration:underline;text-underline-offset:.15em;}

/* Internal-link cluster (flats pages) — styled as a card grid */
.borough-prose ul.ep-related-links{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(225px,1fr));gap:12px;margin:1.6rem 0;padding:0;}
.ep-related-links li{margin:0;}
.ep-related-links a{display:flex;align-items:center;gap:.6rem;padding:13px 16px;height:100%;background:#fff;border:1px solid #e3ebe6;border-radius:13px;font-weight:600;font-size:.82rem;line-height:1.3;color:#1f3b2a!important;text-decoration:none!important;box-shadow:0 6px 18px rgba(31,41,55,.05);transition:transform .2s,box-shadow .2s,border-color .2s;}
.ep-related-links a::before{content:"";flex:0 0 9px;width:9px;height:9px;border-radius:50%;background:linear-gradient(135deg,var(--green,#2E7D32),var(--orange,#F57C00));}
.ep-related-links a:hover{transform:translateY(-3px);border-color:var(--green,#2E7D32);box-shadow:0 14px 30px rgba(24,77,44,.14);}
.ep-related-links li:first-child a{background:linear-gradient(120deg,#f0f8f2,#fff);border-color:#cfe6d6;}

/* Highlighted intro box (borough pages) */
.ep-intro-box{display:flex;gap:1rem;align-items:flex-start;padding:1.4rem 1.6rem;background:#f0f8f2;border:1px solid #d9ebdf;border-radius:16px;margin:0 0 1.8rem;}
.ep-intro-box .lucide-icon{width:26px;height:26px;color:var(--green,#2E7D32);flex:0 0 26px;margin-top:.15rem;}
.ep-intro-box p{margin:0;font-size:1.05rem;line-height:1.6;color:#2b3630;}

/* ============================================================
   BLOG + ARTICLE HERO TITLES — refined to a smaller, consistent
   size (these titles are long sentences, unlike the short
   landing-page hero phrases, which keep their approved sizes).
   ============================================================ */
.blog-ref-copy h1,
.article-ref-hero h1 {
  max-width: 660px;
  margin: 0 0 14px;
  font-family: Manrope, Inter, sans-serif;
  font-weight: 800;
  font-size: clamp(1.9rem, 3vw, 2.75rem) !important;
  line-height: 1.12;
  letter-spacing: -.025em;
  color: #18351f;
}
.blog-ref-copy h1 em,
.article-ref-hero h1 em {
  display: block;
  color: var(--green, #2e7d32);
  font-style: normal;
}
@media (max-width: 700px) {
  .blog-ref-copy h1,
  .article-ref-hero h1 {
    font-size: clamp(1.65rem, 6.5vw, 2.25rem) !important;
  }
}
/* uniform hero image treatment */
.service-ref-visual img,
.blog-ref-visual img,
.contact-ref-visual img,
.article-ref-hero > img,
.borough-hero-property,
.booking-ref-hero-grid > img {
  border-radius: 14px !important;
}
.article-ref-hero > img { height: clamp(300px, 34vw, 380px) !important; object-fit: cover; }

/* ============================================================
   PREMIUM ARTICLE TYPOGRAPHY — high-quality long-form reading
   ============================================================ */
.article-ref-content { color: #2b3a32; font-size: 1.06rem; line-height: 1.78; }
.article-ref-content > *:first-child,
.article-ref-content .entry-content > *:first-child { margin-top: 0; }
.article-ref-content p { margin: 0 0 1.25rem; }
.article-ref-content .entry-content > p:first-of-type { font-size: 1.18rem; line-height: 1.68; color: #21302a; }
.article-ref-content h2 { margin: 2.5rem 0 .9rem; font-family: Manrope, Inter, sans-serif; font-weight: 800; font-size: clamp(1.5rem, 2.3vw, 1.9rem); line-height: 1.18; letter-spacing: -.02em; color: #163a21; }
.article-ref-content h3 { margin: 1.9rem 0 .55rem; font-family: Manrope, Inter, sans-serif; font-weight: 800; font-size: 1.25rem; letter-spacing: -.01em; color: #1f3b2a; }
.article-ref-content h4 { margin: 1.5rem 0 .45rem; font-weight: 700; font-size: 1.08rem; color: #28362f; }
.article-ref-content ul,
.article-ref-content ol { margin: 0 0 1.35rem; }
.article-ref-content ul { padding-left: 2px; list-style: none; }
.article-ref-content ul li { position: relative; margin: .55rem 0; padding-left: 28px; line-height: 1.7; }
.article-ref-content ul li::before { content: ""; position: absolute; left: 3px; top: .62em; width: 8px; height: 8px; border-radius: 2px; background: linear-gradient(135deg, var(--green, #2e7d32), var(--orange, #f57c00)); }
.article-ref-content ol { padding-left: 22px; }
.article-ref-content ol li { margin: .55rem 0; padding-left: 6px; line-height: 1.7; }
.article-ref-content a { color: var(--green, #2e7d32); font-weight: 600; text-decoration: underline; text-underline-offset: .16em; text-decoration-thickness: 1px; text-decoration-color: rgba(46,125,50,.38); transition: text-decoration-color .2s ease; }
.article-ref-content a:hover { text-decoration-color: var(--green, #2e7d32); }
.article-ref-content strong { color: #15301c; font-weight: 700; }
.article-ref-content blockquote { margin: 1.9rem 0; padding: 1.05rem 1.5rem; border-left: 4px solid var(--green, #2e7d32); background: #f3f8f4; border-radius: 0 14px 14px 0; color: #283a30; font-size: 1.1rem; font-style: italic; }
.article-ref-content blockquote p:last-child { margin: 0; }
.article-ref-content hr { height: 1px; margin: 2.6rem 0; border: 0; background: linear-gradient(90deg, transparent, #cbdcd0 16%, #cbdcd0 84%, transparent); }
.article-ref-content img { max-width: 100%; height: auto; margin: 1.7rem 0; border-radius: 16px; box-shadow: 0 18px 44px rgba(24,54,36,.11); }
.article-ref-content figure { margin: 1.7rem 0; }
.article-ref-content figcaption { margin-top: .55rem; color: #6b7971; font-size: .9rem; text-align: center; }
.article-ref-content table { font-size: .94rem; margin: 2rem 0; }
.article-ref-content thead th,
.article-ref-content table tr:first-child th { font-size: .9rem; padding: 14px 18px; }
.article-ref-content td,
.article-ref-content tbody th { padding: 13px 18px; }
.article-ref-content > h2:first-of-type { margin-top: .6rem; }

/* Blog archive cards — lift + image zoom on hover */
.blog-ref-grid article { transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.blog-ref-grid article > a { display: block; overflow: hidden; }
.blog-ref-grid article > a img { display: block; width: 100%; height: 180px; aspect-ratio: 16 / 10; object-fit: cover; transition: transform .55s cubic-bezier(.2,.7,.2,1); }
.blog-ref-grid article:hover { transform: translateY(-5px); border-color: #cfe6d6; box-shadow: 0 22px 46px rgba(24,54,36,.13); }
.blog-ref-grid article:hover > a img { transform: scale(1.06); }
.blog-ref-grid article h2 { letter-spacing: -.02em; }
/* uniform card heights — flex column, clamped title/excerpt, footer pinned */
.blog-ref-grid article { display: flex; flex-direction: column; }
.blog-ref-grid article > div { display: flex; flex: 1; flex-direction: column; }
.blog-ref-grid article h2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 0; }
.blog-ref-grid article p { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; min-height: 0; }
.blog-ref-grid article footer { margin-top: auto; padding-top: 12px; }

/* ============================================================
   BOOKING PAGE — CF7 "Booking" estimation form in new design
   ============================================================ */
.booking-page-hero .booking-urgency { display: inline-flex; align-items: center; gap: 8px; margin: 4px 0 16px; padding: 10px 16px; background: #fff8e6; border: 1px solid #ffe2a6; border-radius: 12px; color: #6b5410; font-size: .92rem; font-weight: 600; }
.booking-page-hero .booking-urgency .lucide-icon { width: 17px; height: 17px; color: #c98a00; }
.booking-page-hero .booking-urgency b { color: #4a3a08; }
.booking-ref-form h2 { margin: 0 0 18px; font-size: 1.25rem; }
.booking-ref-form .wndfal-esti-form { display: grid; gap: 22px; }
.booking-ref-form .estimation-item { margin: 0; }
.booking-ref-form .estimation-title { margin: 0 0 10px; font: 800 .98rem/1.3 Manrope, Inter, sans-serif; color: #1f3b2a; }
.booking-ref-form .wpcf7-checkbox { display: flex; flex-wrap: wrap; gap: 10px; }
.booking-ref-form .wpcf7-checkbox .wpcf7-list-item { margin: 0; }
.booking-ref-form .wpcf7-checkbox .wpcf7-list-item label { display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 9px 16px; border: 1px solid #d8e0db; border-radius: 999px; background: #fff; cursor: pointer; font-size: .82rem; font-weight: 600; color: #2b3a32; transition: border-color .15s ease, background .15s ease, color .15s ease; }
.booking-ref-form .wpcf7-checkbox .wpcf7-list-item label:hover { border-color: var(--green, #2e7d32); }
.booking-ref-form .wpcf7-checkbox .wpcf7-list-item label:has(input:checked) { background: #eef7f0; border-color: var(--green, #2e7d32); color: #15301c; }
.booking-ref-form .wpcf7-checkbox input { width: 16px; height: 16px; min-height: 0; margin: 0; accent-color: var(--green, #2e7d32); }
.booking-ref-form .row { display: flex; flex-wrap: wrap; gap: 14px; margin: 0; }
.booking-ref-form [class*="col-md-4"] { flex: 1 1 200px; min-width: 0; }
.booking-ref-form [class*="col-md-12"] { flex: 1 1 100%; min-width: 0; }
.booking-ref-form .row p { margin: 0; flex: 1 1 200px; }
.booking-ref-form .wndfal-esti-form input[type=text],
.booking-ref-form .wndfal-esti-form input[type=tel],
.booking-ref-form .wndfal-esti-form input[type=email],
.booking-ref-form .wndfal-esti-form input[type=date],
.booking-ref-form .wndfal-esti-form textarea { width: 100%; min-height: 46px; padding: 11px 14px; border: 1px solid #d8e0db; border-radius: 9px; font-size: .95rem; font-weight: 400; }
.booking-ref-form .wndfal-esti-form textarea { min-height: 92px; resize: vertical; }
.booking-ref-form .last-item { padding-top: 4px; }
.booking-ref-form input.button-primary,
.booking-ref-form .wpcf7-submit { width: auto; min-height: 52px; margin-top: 6px; padding: 0 34px; background: var(--green, #2e7d32); color: #fff; border: 0; border-radius: 13px; font: 800 .92rem Manrope, Inter, sans-serif; cursor: pointer; box-shadow: 0 12px 26px rgba(24,77,44,.18); transition: transform .2s ease, box-shadow .2s ease; }
.booking-ref-form input.button-primary:hover,
.booking-ref-form .wpcf7-submit:hover { transform: translateY(-2px); box-shadow: 0 16px 32px rgba(24,77,44,.24); }
.booking-ref-form .wpcf7-not-valid-tip { margin-top: 4px; color: #c0392b; font-size: .72rem; font-weight: 600; }
.booking-ref-form .wpcf7-response-output { margin: 16px 0 0 !important; padding: 12px 16px !important; border-radius: 9px; font-size: .88rem; }
@media (max-width: 880px) { .booking-ref-layout { grid-template-columns: 1fr; } }
/* postcode prediction dropdown */
.ep-pc-suggest { position: absolute; z-index: 40; top: 100%; left: 0; right: 0; display: none; max-height: 250px; margin: 5px 0 0; padding: 6px; overflow: auto; list-style: none; background: #fff; border: 1px solid #d8e0db; border-radius: 11px; box-shadow: 0 16px 38px rgba(31,41,55,.16); }
.ep-pc-suggest li { padding: 10px 13px; border-radius: 8px; font-size: .92rem; color: #2b3a32; cursor: pointer; }
.ep-pc-suggest li:hover { background: #eef7f0; color: #15301c; }
.booking-ref-form .wndfal-esti-form input[name="your-post"] { text-transform: uppercase; }
/* booking form — live field order (FullName, Email, Phone, Date, Time, Service, Address, Notes) */
.booking-ref-form .ep-booking-form p { margin: 0 0 14px; }
.booking-ref-form .ep-booking-form input,
.booking-ref-form .ep-booking-form select,
.booking-ref-form .ep-booking-form textarea { width: 100%; min-height: 44px; padding: 9px 13px; border: 1px solid #d8e0db; border-radius: 10px; background: #fff; font-size: .92rem; font-weight: 400; color: #2b3a32; }
.booking-ref-form .ep-booking-form textarea { min-height: 46px; resize: vertical; line-height: 1.4; }
/* Address = short field (in sync with the other tiles); Additional Information stays tall */
.booking-ref-form .ep-booking-form textarea[name="Address"] { min-height: 38px; padding-top: 8px; padding-bottom: 8px; line-height: 1.35; }
.booking-ref-form .ep-booking-form textarea[name="AdditionalInformation"] { min-height: 46px; padding-top: 8px; padding-bottom: 8px; line-height: 1.35; }
.booking-ref-form .ep-booking-form select { appearance: none; -webkit-appearance: none; padding-right: 40px; background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="%232e7d32" stroke-width="3"><path d="M6 9l6 6 6-6"/></svg>'); background-repeat: no-repeat; background-position: right 14px center; cursor: pointer; }
.booking-ref-form .ep-booking-form input:focus,
.booking-ref-form .ep-booking-form select:focus,
.booking-ref-form .ep-booking-form textarea:focus { outline: none; border-color: var(--green, #2e7d32); box-shadow: 0 0 0 3px rgba(46,125,50,.12); }
.booking-ref-form .ep-booking-form .wpcf7-submit { width: 100%; min-height: 54px; margin-top: 4px; background: var(--green, #2e7d32); color: #fff; border: 0; border-radius: 13px; font: 800 .95rem Manrope, Inter, sans-serif; cursor: pointer; box-shadow: 0 12px 26px rgba(24,77,44,.18); transition: transform .2s ease, box-shadow .2s ease; }
.booking-ref-form .ep-booking-form .wpcf7-submit:hover { transform: translateY(-2px); box-shadow: 0 16px 32px rgba(24,77,44,.24); }
/* desktop: 2-column layout so the form fits with minimal scrolling
   (short fields pair up; Address, notes and the submit span full width) */
@media (min-width: 768px) {
  .booking-ref-form .ep-booking-form { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; }
  .booking-ref-form .ep-booking-form p { margin: 0; }
  .booking-ref-form .ep-booking-form input,
  .booking-ref-form .ep-booking-form select { min-height: 46px; }
  .booking-ref-form .ep-booking-form p:has(textarea),
  .booking-ref-form .ep-booking-form p:has(.wpcf7-submit),
  .booking-ref-form .ep-booking-form p:has(input[type="submit"]) { grid-column: 1 / -1; }
  .booking-ref-form .ep-booking-form textarea { min-height: 74px; }
}

/* ============================================================
   MOBILE: lift the floating chat + WhatsApp buttons ABOVE the
   bottom action bar so they don't cover its buttons (or each
   other). Chat sits bottom-right, WhatsApp bottom-left.
   ============================================================ */
@media (max-width: 900px) {
  #ep-trigger {
    bottom: calc(var(--mobile-actions-height, 72px) + 12px) !important;
    right: 12px !important;
    left: auto !important;
    width: 54px !important;
    height: 54px !important;
  }
  #ep-wrap, #ep-panel {
    bottom: calc(var(--mobile-actions-height, 72px) + 76px) !important;
  }
  .simplewebchat_float {
    bottom: calc(var(--mobile-actions-height, 72px) + 12px) !important;
    left: 12px !important;
    right: auto !important;
    z-index: 99997 !important;
  }
}

/* ============================================================
   AREAS HUB — "Popular areas" region cards as top-image cards
   (overrides the side-by-side audience layout for this grid)
   ============================================================ */
.areas-region-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; }
.areas-region-grid article { position: relative; display: flex; flex-direction: column; min-height: 0; padding: 0; overflow: hidden; background: #fff; border: 1px solid #dde5e0; border-radius: 13px; box-shadow: 0 6px 20px rgba(35,62,44,.05); transition: transform .25s ease, box-shadow .25s ease; }
.areas-region-grid article:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(24,54,36,.13); }
.areas-region-grid article > img { width: 100%; height: 132px; aspect-ratio: auto; object-fit: cover; }
.areas-region-grid .service-ref-audience-icon { position: absolute; top: 106px; left: 16px; width: 46px; height: 46px; box-shadow: 0 6px 16px rgba(24,54,36,.18); }
.areas-region-grid .service-ref-audience-icon .lucide-icon { width: 23px; height: 23px; }
.areas-region-grid article > div:last-child { display: flex; flex: 1; flex-direction: column; padding: 30px 18px 18px; }
.areas-region-grid h3 { margin: 0 0 6px; font-size: .95rem; }
.areas-region-grid p { margin: 0 0 12px; color: #5d6b63; font-size: .67rem; line-height: 1.55; }
.areas-region-grid a { margin-top: auto; color: var(--green, #2e7d32); font-size: .68rem; font-weight: 800; text-decoration: none; }
@media (max-width: 900px) { .areas-region-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .areas-region-grid { grid-template-columns: 1fr; } }

/* ============================================================
   MOBILE FIXES — nav background + inline Services sub-menu, and
   the blog-hero "benefits" single-column readable layout.
   ============================================================ */
@media (max-width: 800px) {
  /* solid menu panel + larger, easier-to-tap nav text */
  .service-ref-header .main-nav { background: #fff !important; box-shadow: 0 22px 38px rgba(31,41,55,.16); padding: 14px 18px 22px; gap: 2px; }
  .service-ref-header .main-nav > a,
  .service-ref-header .ep-nav-sub > a { padding: 13px 8px !important; font-size: 1.06rem !important; font-weight: 700; border-bottom: 1px solid #eef3ef; }

  /* Services = click-to-expand accordion (collapsed until tapped) */
  .service-ref-header .ep-nav-sub { display: block; position: relative; }
  .service-ref-header .ep-nav-sub > a { display: flex; align-items: center; justify-content: space-between; }
  .service-ref-header .ep-caret { display: inline-block !important; margin: 0; font-size: 1.1rem; transition: transform .25s ease; }
  .service-ref-header .ep-nav-sub.ep-open .ep-caret { transform: rotate(180deg); color: var(--green, #2e7d32); }
  .service-ref-header .ep-nav-sub > .ep-sub { position: static !important; display: none !important; min-width: 0; padding: 4px 0 8px 12px; background: transparent; border: 0; border-radius: 0; box-shadow: none; }
  .service-ref-header .ep-nav-sub.ep-open > .ep-sub { display: flex !important; }
  .service-ref-header .ep-nav-sub .ep-sub a { padding: 11px 12px; font-size: .98rem; border-bottom: 1px solid #f1f5f2; }

  /* blog hero benefits — one per row, full-width text (no one-word-per-line) */
  .blog-ref-benefits { display: flex; flex-direction: column; gap: 12px; margin-top: 22px; }
  .blog-ref-benefits > span { display: grid; grid-template-columns: 40px minmax(0,1fr); column-gap: 12px; row-gap: 1px; align-items: center; }
  .blog-ref-benefits b { font-size: .82rem; }
  .blog-ref-benefits small { font-size: .72rem; white-space: normal; }
}

/* ============================================================
   MOBILE HERO CONTAINMENT — every hero collapses to one column
   and no hero image / visual ever bleeds past the screen.
   ============================================================ */
@media (max-width: 900px) {
  .service-ref-hero-grid,
  .booking-ref-hero-grid,
  .areas-service-hero .service-ref-hero-grid,
  .blog-service-hero .service-ref-hero-grid,
  .contact-service-hero .service-ref-hero-grid,
  .pricing-service-hero .service-ref-hero-grid,
  .borough-service-hero .service-ref-hero-grid { grid-template-columns: 1fr !important; }
  .service-ref-visual, .service-ref-visual-unified, .service-ref-visual-generic,
  .blog-ref-visual, .contact-ref-visual, .areas-hero-visual,
  .borough-hero-visual, .home-hero-visual, .article-ref-hero,
  .service-ref-hero-grid > *, .booking-ref-hero-grid > * { max-width: 100% !important; min-width: 0 !important; }
  .service-ref-visual img, .service-ref-visual-unified img, .service-ref-visual-generic img,
  .blog-ref-visual img, .contact-ref-visual img, .areas-hero-visual img,
  .borough-hero-property, .home-hero-visual img, .article-ref-hero > img,
  .booking-ref-hero-grid > img { width: 100% !important; max-width: 100% !important; }
  .borough-hero-map { right: 12px !important; left: auto; max-width: calc(100% - 24px); }
}

/* Landscape phones / short viewports: hero min-heights (500-720px, portrait-tuned)
   are too tall for a ~390px landscape screen and let the fixed header dominate.
   Shrink them to a MODERATE height (not 0 — that left a white gap). Added 2026-07-01. */
@media (orientation: landscape) and (max-height: 560px) {
  .hero, .service-ref-hero-grid, .booking-ref-hero-grid,
  .areas-service-hero, .article-ref-hero, .contact-service-hero,
  .pricing-service-hero { min-height: 260px !important; }
  .service-ref-hero-grid > img, .booking-ref-hero-grid > img,
  .article-ref-hero > img { height: clamp(150px, 42vh, 200px) !important; }
}