/* TLC dark design (2026): the owner-approved direction from design/window-cleaning-v5.html.
   Loaded instead of the earlier light styles on pages using the "TLC dark design" template.
   Every class is prefixed dk- and every variable --dk- so it cannot clash with the light pages. */
/* TLC Window Cleaning – prototype v5. One continuous navy canvas with ambient green light. */
:root {
  --dk-bg: #0a1520; --dk-navy: #0d1926; --dk-navy-2: #13263a; --dk-panel: rgba(255,255,255,.035);
  --dk-edge: rgba(255,255,255,.09); --dk-edge-2: rgba(255,255,255,.16);
  --dk-green: #25d03a; --dk-green-2: #7ff08b; --dk-green-ink: #0e7a21;
  --dk-text: #f2f6f8; --dk-soft: #a9bac6; --dk-soft-2: #c7d4dc;
  --dk-max: 1280px; --dk-gut: clamp(20px, 4vw, 56px); --dk-r: 14px; --dk-sweep: clamp(40px, 6vw, 96px);
  --dk-ease: cubic-bezier(.2,.7,.1,1);
  --dk-font: Arial, Helvetica, sans-serif;
  --dk-sec: clamp(56px, 6.5vw, 96px);
}
@property --dk-a { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
body.tlc-dark { margin: 0; font-family: var(--dk-font); font-size: 17px; line-height: 1.6; color: var(--dk-text); background: var(--dk-bg); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
html:has(body.tlc-dark) { scroll-behavior: smooth; background: var(--dk-bg); }
:where(.dk-root), :where(.dk-root) *, :where(.dk-root) *::before, :where(.dk-root) *::after { box-sizing: border-box; }
:where(.dk-root) img { display: block; max-width: 100%; }
:where(.dk-root) a { color: inherit; }
:where(.dk-root) button { font: inherit; color: inherit; }
.dk-wrap { position: relative; width: 100%; max-width: var(--dk-max); margin-inline: auto; padding-inline: var(--dk-gut); }
.dk-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
:where(.dk-root) :focus-visible { outline: 3px solid var(--dk-green); outline-offset: 3px; }

/* Shared type */
.dk-eyebrow { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 16px; padding: 6px 12px 6px 8px; border-radius: 99px; background: rgba(37,208,58,.08); box-shadow: inset 0 0 0 1px rgba(37,208,58,.25); font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--dk-green-2); }
.dk-eyebrow::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--dk-green); box-shadow: 0 0 0 4px rgba(37,208,58,.18); animation: dk-pulse 2.4s ease-in-out infinite; }
@keyframes dk-pulse { 50% { box-shadow: 0 0 0 7px rgba(37,208,58,0); } }
.dk-h2 { margin: 0; font-weight: 700; letter-spacing: -.035em; line-height: 1.04; font-size: clamp(2rem, 1.3rem + 2.6vw, 3.4rem); }
.dk-h2 em, .dk-hero h1 em { font-style: normal; background: linear-gradient(90deg, var(--dk-green), var(--dk-green-2)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.dk-lead { margin: 18px 0 0; font-size: clamp(1.02rem, .97rem + .25vw, 1.15rem); line-height: 1.6; color: var(--dk-soft); max-width: 58ch; }
.dk-head { max-width: 760px; margin-bottom: 44px; }
.dk-head--split { max-width: none; display: grid; grid-template-columns: 1.1fr 1fr; gap: 20px 56px; align-items: end; }
.dk-head--split .dk-lead { margin: 0; }
@media (max-width: 860px) { .dk-head--split { grid-template-columns: 1fr; } }

/* Buttons */
.dk-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 54px; padding: 0 24px; border: 0; border-radius: 10px; background: var(--dk-green); color: #06120b; font-weight: 700; font-size: 16px; text-decoration: none; cursor: pointer; box-shadow: 0 0 0 1px rgba(255,255,255,.2) inset, 0 10px 30px -10px rgba(37,208,58,.7); transition: transform .25s var(--dk-ease), box-shadow .25s var(--dk-ease); overflow: hidden; }
.dk-btn::after { content: ""; position: absolute; top: 0; bottom: 0; width: 40%; left: -60%; background: linear-gradient(100deg, transparent, rgba(255,255,255,.55), transparent); transform: skewX(-20deg); animation: dk-shine 5s ease-in-out infinite; }
@keyframes dk-shine { 0%, 60% { left: -60%; } 80%, 100% { left: 130%; } }
.dk-btn svg { width: 18px; height: 18px; transition: transform .25s var(--dk-ease); }
.dk-btn:hover { transform: translateY(-2px); box-shadow: 0 0 0 1px rgba(255,255,255,.25) inset, 0 18px 40px -12px rgba(37,208,58,.9); }
.dk-btn:hover svg { transform: translateX(4px); }
.dk-btn--glass { background: rgba(255,255,255,.06); color: var(--dk-text); box-shadow: inset 0 0 0 1px var(--dk-edge-2); }
.dk-btn--glass::after { display: none; }
.dk-btn--glass:hover { box-shadow: inset 0 0 0 1px var(--dk-green); }
.dk-link { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; text-decoration: none; color: var(--dk-text); }
.dk-link svg { width: 16px; height: 16px; color: var(--dk-green); transition: transform .25s var(--dk-ease); }
.dk-link:hover svg { transform: translateX(4px); }

/* Glass card with a glowing edge */
.dk-glass { position: relative; background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.02)); border-radius: var(--dk-r); box-shadow: inset 0 0 0 1px var(--dk-edge); backdrop-filter: blur(12px); }
.dk-glass--edge { border: 1px solid transparent; background: linear-gradient(180deg, #112235, #0c1a28) padding-box, conic-gradient(from var(--dk-a), rgba(37,208,58,.0) 0deg, rgba(37,208,58,.85) 60deg, rgba(127,240,139,.2) 120deg, rgba(255,255,255,.06) 200deg, rgba(37,208,58,0) 360deg) border-box; box-shadow: none; animation: dk-spin 8s linear infinite; }
@keyframes dk-spin { to { --dk-a: 360deg; } }

/* ---------- Ambient light: drifting blobs and a faint grid, no pointer needed ---------- */
.dk-canvas { position: relative; isolation: isolate; overflow: clip; }
.dk-aura { position: absolute; z-index: -1; border-radius: 50%; filter: blur(70px); opacity: .55; pointer-events: none; will-change: transform; }
.dk-aura--g { background: radial-gradient(circle, rgba(37,208,58,.55), rgba(37,208,58,0) 65%); }
.dk-aura--b { background: radial-gradient(circle, rgba(46,120,190,.45), rgba(46,120,190,0) 65%); }
.dk-aura--1 { animation: dk-float1 22s ease-in-out infinite alternate; }
.dk-aura--2 { animation: dk-float2 26s ease-in-out infinite alternate; }
.dk-aura--3 { animation: dk-float3 30s ease-in-out infinite alternate; }
@keyframes dk-float1 { 0% { transform: translate(0,0) scale(1); } 50% { transform: translate(18vw, 8vh) scale(1.2); } 100% { transform: translate(-6vw, 18vh) scale(.9); } }
@keyframes dk-float2 { 0% { transform: translate(0,0) scale(1.1); } 50% { transform: translate(-16vw, -10vh) scale(.85); } 100% { transform: translate(8vw, 12vh) scale(1.15); } }
@keyframes dk-float3 { 0% { transform: translate(0,0) scale(.9); } 100% { transform: translate(-20vw, 6vh) scale(1.25); } }
.dk-grid-bg { position: absolute; inset: 0; z-index: -1; pointer-events: none; background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 64px 64px; -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, #000 20%, transparent 75%); mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, #000 20%, transparent 75%); }
.dk-sec { position: relative; padding-block: var(--dk-sec); }
.dk-sec + .dk-sec { padding-top: calc(var(--dk-sec) * .4); }
.dk-divider { height: 1px; max-width: var(--dk-max); margin: 0 auto; background: linear-gradient(90deg, transparent, rgba(37,208,58,.35), transparent); }

/* ---------- Header: transparent over the hero, solid glass navy once scrolled ---------- */
.dk-hdr { position: fixed; inset: 0 0 auto; z-index: 50; transition: background .35s, box-shadow .35s, backdrop-filter .35s; }
.dk-hdr.dk-solid { background: rgba(10,21,32,.82); backdrop-filter: blur(14px) saturate(140%); box-shadow: 0 1px 0 var(--dk-edge), 0 20px 40px -30px rgba(0,0,0,.8); }
.dk-hdr__in { position: relative; display: flex; align-items: center; gap: 28px; height: 88px; transition: height .35s; }
.dk-hdr.dk-solid .dk-hdr__in { height: 72px; }
.dk-hdr__logo img { height: 54px; width: auto; transition: height .35s; }
.dk-hdr.dk-solid .dk-hdr__logo img { height: 44px; }
.dk-nav { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.dk-nav > a, .dk-nav__btn { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 14px; border: 0; border-radius: 10px; background: none; color: #e6edf1; font-size: 15px; font-weight: 700; text-decoration: none; cursor: pointer; transition: background .2s, color .2s; }
.dk-nav > a:hover, .dk-nav__btn:hover, .dk-nav__item.dk-open .dk-nav__btn { background: rgba(255,255,255,.07); color: #fff; }
.dk-nav [aria-current="page"], .dk-nav__item.dk-current .dk-nav__btn { color: var(--dk-green-2); }
.dk-nav__btn svg { width: 12px; height: 12px; transition: transform .3s var(--dk-ease); }
.dk-nav__item { position: relative; }
.dk-nav__item.dk-open .dk-nav__btn svg { transform: rotate(180deg); }
.dk-mega { position: absolute; top: calc(100% + 10px); left: 50%; width: 560px; padding: 10px; border-radius: 18px; background: rgba(13,27,41,.96); backdrop-filter: blur(16px); box-shadow: inset 0 0 0 1px var(--dk-edge-2), 0 40px 80px -30px rgba(0,0,0,.85); opacity: 0; visibility: hidden; transform: translate(-50%, -8px); transition: opacity .25s, transform .3s var(--dk-ease), visibility .25s; }
.dk-nav__item.dk-open .dk-mega { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.dk-mega__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }
.dk-mega a { display: flex; align-items: center; gap: 12px; padding: 11px 12px; border-radius: 12px; color: #e6edf1; text-decoration: none; font-size: 15px; font-weight: 700; transition: background .2s; }
.dk-mega a:hover, .dk-mega a:focus-visible { background: rgba(255,255,255,.06); }
.dk-mega a[aria-current="page"] { background: rgba(37,208,58,.1); color: var(--dk-green-2); }
.dk-mega i { display: grid; place-items: center; flex: none; width: 36px; height: 36px; border-radius: 10px; background: rgba(37,208,58,.1); box-shadow: inset 0 0 0 1px rgba(37,208,58,.3); color: var(--dk-green); }
.dk-mega i svg { width: 20px; height: 20px; }
.dk-mega small { display: block; color: var(--dk-soft); font-size: 12px; font-weight: 400; margin-top: 1px; }
.dk-mega__foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 8px; padding: 12px 14px; border-radius: 12px; background: rgba(255,255,255,.04); font-size: 14px; color: var(--dk-soft-2); }
.dk-mega__foot a { padding: 0; display: inline-flex; color: var(--dk-green-2); }
.dk-mega--narrow { width: 360px; }
/* The grouped dropdown is wider than the button it opens from, so it centres on the header and never runs off a laptop screen */
.dk-nav__item:has(> .dk-mega--groups) { position: static; }
.dk-mega--groups { top: calc(50% + 34px); width: min(880px, calc(100vw - 32px)); }
.dk-mega--groups .dk-mega__grid { grid-template-columns: 1fr 1.15fr 1.15fr; gap: 6px; }
.dk-mega__col { display: grid; align-content: start; gap: 2px; padding-top: 30px; }
.dk-mega__col + .dk-mega__col { padding-left: 6px; box-shadow: inset 1px 0 0 var(--dk-edge); }
.dk-mega__col:has(.dk-mega__head) { padding-top: 0; }
.dk-mega__head { margin: 0; padding: 8px 12px 6px; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--dk-green-2); }
.dk-mega--narrow .dk-mega__grid { grid-template-columns: 1fr; }
.dk-hdr__tel { display: flex; align-items: center; gap: 10px; padding: 6px 12px 6px 6px; border-radius: 12px; color: #fff; text-decoration: none; transition: background .2s; }
.dk-hdr__tel:hover { background: rgba(255,255,255,.07); }
.dk-hdr__tel i { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: rgba(37,208,58,.14); box-shadow: inset 0 0 0 1px rgba(37,208,58,.4); color: var(--dk-green); }
.dk-hdr__tel i svg { width: 18px; height: 18px; }
.dk-hdr__tel span { display: grid; line-height: 1.15; font-weight: 700; font-size: 16px; white-space: nowrap; }
.dk-hdr__tel small { font-size: 12px; font-weight: 700; color: var(--dk-green-2); letter-spacing: .02em; }
.dk-hdr .dk-btn { min-height: 46px; padding: 0 18px; font-size: 15px; }
.dk-burger { display: none; width: 46px; height: 46px; border: 0; border-radius: 12px; background: rgba(255,255,255,.07); box-shadow: inset 0 0 0 1px var(--dk-edge-2); cursor: pointer; place-items: center; }
.dk-burger span, .dk-burger span::before, .dk-burger span::after { display: block; width: 18px; height: 2px; border-radius: 2px; background: #fff; position: relative; transition: transform .3s var(--dk-ease), background .2s; }
.dk-burger span::before, .dk-burger span::after { content: ""; position: absolute; left: 0; }
.dk-burger span::before { top: -6px; } .dk-burger span::after { top: 6px; }
.dk-menu-open .dk-burger span { background: transparent; }
.dk-menu-open .dk-burger span::before { transform: translateY(6px) rotate(45deg); }
.dk-menu-open .dk-burger span::after { transform: translateY(-6px) rotate(-45deg); }
.dk-drawer { display: none; }
@media (max-width: 1180px) {
  .dk-nav { display: none; }
  .dk-burger { display: grid; }
  .dk-hdr__tel { margin-left: auto; }
  .dk-drawer { display: block; position: fixed; inset: 72px 0 0; z-index: 49; padding: 20px var(--dk-gut) 40px; overflow: auto; background: rgba(10,21,32,.97); backdrop-filter: blur(16px); opacity: 0; visibility: hidden; transform: translateY(-10px); transition: opacity .3s, transform .35s var(--dk-ease), visibility .3s; }
  .dk-menu-open .dk-drawer { opacity: 1; visibility: visible; transform: none; }
  .dk-menu-open .dk-hdr { background: rgba(10,21,32,.97); }
  .dk-menu-open .dk-hdr .dk-hdr__in { height: 72px; }
  .dk-drawer h2 { margin: 22px 0 8px; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--dk-green-2); }
  .dk-drawer a { display: flex; align-items: center; justify-content: space-between; min-height: 52px; border-bottom: 1px solid var(--dk-edge); color: #fff; text-decoration: none; font-weight: 700; font-size: 17px; }
  .dk-drawer a svg { width: 18px; height: 18px; color: var(--dk-green); }
  .dk-drawer h3 { margin: 18px 0 2px; font-size: 13px; font-weight: 700; color: var(--dk-soft); }
  .dk-drawer .dk-drawer__sub { padding-left: 14px; font-size: 16px; box-shadow: inset 2px 0 0 rgba(37,208,58,.35); }
  .dk-drawer .dk-btn { margin-top: 26px; width: 100%; border: 0; justify-content: center; color: #06120b; }
}
@media (max-width: 640px) { .dk-hdr__tel span { display: none; } .dk-hdr__tel { padding: 4px; } .dk-hdr .dk-hdr__quote { display: none; } .dk-hdr__logo img { height: 44px; } }

/* In-page links (#results, #colour) land below the fixed header */
html:has(body.tlc-dark) { scroll-padding-top: 96px; }

/* ---------- Hero ---------- */
.dk-hero { position: relative; overflow: hidden; }
.dk-hero__img { position: absolute; top: 0; right: 0; bottom: 0; left: 30%; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 28%), linear-gradient(0deg, transparent 0, #000 22%); -webkit-mask-composite: source-in; mask-image: linear-gradient(90deg, transparent 0, #000 28%), linear-gradient(0deg, transparent 0, #000 22%); mask-composite: intersect; }
.dk-hero__img img { width: 100%; height: 100%; object-fit: cover; object-position: 24% 50%; animation: dk-kb 22s ease-in-out infinite alternate; }
@keyframes dk-kb { from { transform: scale(1) translate(0, 0); } to { transform: scale(1.05) translate(-1%, -.6%); } }
.dk-hero__img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,21,32,.75) 0%, rgba(10,21,32,0) 22%); }
.dk-hero__in { position: relative; display: flex; flex-direction: column; min-height: min(840px, 94svh); padding-top: 150px; padding-bottom: 150px; }
.dk-hero__copy { margin-top: auto; margin-bottom: auto; }
.dk-hero h1 { margin: 0; max-width: 11ch; font-weight: 700; font-size: clamp(3rem, 1.6rem + 5.2vw, 6.25rem); letter-spacing: -.045em; line-height: .96; }
.dk-hero .dk-lead { margin: 26px 0 34px; max-width: 46ch; color: var(--dk-soft-2); }
.dk-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; }
.dk-trust { display: flex; flex-wrap: wrap; gap: 10px; margin: 44px 0 0; padding: 0; list-style: none; }
.dk-trust li { display: inline-flex; align-items: center; gap: 10px; padding: 9px 15px 9px 11px; border-radius: 99px; background: rgba(8,18,28,.78); box-shadow: inset 0 0 0 1px rgba(255,255,255,.2), 0 8px 24px -12px rgba(0,0,0,.7); backdrop-filter: blur(10px); font-size: 14px; font-weight: 700; color: #fff; }
.dk-trust svg { width: 18px; height: 18px; color: var(--dk-green); flex: none; }
.dk-trust .dk-g { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #fff; color: #4285f4; font-size: 13px; font-weight: 700; }
.dk-trust .dk-stars { color: #f6b02c; letter-spacing: 1px; font-size: 13px; }
.dk-rise { opacity: 0; transform: translateY(22px); animation: dk-rise .9s var(--dk-ease) forwards; }
.dk-rise:nth-child(2) { animation-delay: .1s; } .dk-rise:nth-child(3) { animation-delay: .2s; } .dk-rise:nth-child(4) { animation-delay: .3s; }
@keyframes dk-rise { to { opacity: 1; transform: none; } }
@media (max-width: 999px) {
  .dk-hero__img { position: relative; left: auto; height: 62vw; min-height: 300px; -webkit-mask-image: linear-gradient(0deg, transparent 0, #000 40%); mask-image: linear-gradient(0deg, transparent 0, #000 40%); }
  .dk-hero__img img { object-position: 30% 60%; }
  .dk-hero__in { min-height: 0; padding-top: 0; margin-top: -56px; padding-bottom: 120px; }
}
/* Desktop: the photograph spans the full width behind the copy, like the live site, so it is shown whole
   and at or close to its real size instead of a cropped, enlarged slice; a navy tint from the left keeps the
   copy readable and the hero is no taller than the screen (owner, 8 November 2026). Phones are unchanged. */
@media (min-width: 1000px) {
  .dk-hero:not(.dk-hero--tall) .dk-hero__img { left: 0; -webkit-mask-image: linear-gradient(0deg, transparent 0, #000 18%); mask-image: linear-gradient(0deg, transparent 0, #000 18%); }
  .dk-hero:not(.dk-hero--tall) .dk-hero__img::after { background: linear-gradient(90deg, rgba(10,21,32,.94) 0%, rgba(10,21,32,.82) 30%, rgba(10,21,32,.35) 62%, rgba(10,21,32,.15) 100%), linear-gradient(180deg, rgba(10,21,32,.7) 0%, rgba(10,21,32,0) 20%); }
  .dk-hero__in { min-height: min(780px, calc(100svh - 20px)); padding-top: 130px; padding-bottom: 96px; }
  .dk-hero h1 { font-size: clamp(3rem, 1.4rem + 4.2vw, 5.5rem); }
}
@media (max-width: 560px) { .dk-trust { gap: 8px; } .dk-trust li { font-size: 13px; padding: 8px 12px 8px 10px; } .dk-hero__actions .dk-btn { width: 100%; } }

/* ---------- Credentials: a floating white bar over the hero edge ---------- */
.dk-creds { position: relative; z-index: 3; margin-top: -78px; }
.dk-creds__bar { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 24px; padding: 18px 0 18px 28px; border-radius: 16px; background: #fff; color: #142332; box-shadow: 0 30px 70px -30px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.4); overflow: hidden; }
.dk-creds__label { font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #0e7a21; line-height: 1.4; max-width: 15ch; }
.dk-marquee { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.dk-marquee__track { display: flex; align-items: center; gap: 56px; width: max-content; animation: dk-slide 38s linear infinite; }
.dk-marquee:hover .dk-marquee__track { animation-play-state: paused; }
.dk-marquee__track img { height: 50px; width: auto; filter: grayscale(var(--dk-g, 1)); opacity: var(--dk-o, .7); transform: scale(var(--dk-s, 1)); }
@keyframes dk-slide { to { transform: translateX(-50%); } }
/* Headline figures beneath the ribbon: icon, counting number, lift and glow on hover */
.dk-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; margin: 22px 0 0; padding: 0; list-style: none; }
.dk-stats li { position: relative; overflow: hidden; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 14px; align-items: center; padding: 18px 20px; border-radius: 16px; background: linear-gradient(160deg, rgba(37,208,58,.10), rgba(255,255,255,.025) 55%); box-shadow: inset 0 0 0 1px var(--dk-edge); transition: transform .35s var(--dk-ease), box-shadow .35s var(--dk-ease); transition-delay: var(--dk-d, 0s); }
.dk-stats li::after { content: ""; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 35%, rgba(255,255,255,.10) 50%, transparent 65%); transform: translateX(-120%); transition: transform .9s var(--dk-ease); pointer-events: none; }
.dk-stats li:hover { transform: translateY(-4px); box-shadow: inset 0 0 0 1px rgba(37,208,58,.55), 0 18px 40px -18px rgba(37,208,58,.45); transition-delay: 0s; }
.dk-stats li:hover::after { transform: translateX(120%); }
.dk-stats i { grid-row: 1 / 3; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 12px; background: rgba(37,208,58,.12); box-shadow: inset 0 0 0 1px rgba(37,208,58,.35); color: var(--dk-green); }
.dk-stats i svg { width: 22px; height: 22px; }
.dk-stats b { font-size: clamp(1.45rem, 1.1rem + 1vw, 2rem); font-weight: 700; letter-spacing: -.02em; line-height: 1.05; background: linear-gradient(90deg, #fff, var(--dk-green-2)); -webkit-background-clip: text; background-clip: text; color: transparent; font-variant-numeric: tabular-nums; }
.dk-stats span { font-size: 14px; line-height: 1.4; color: var(--dk-soft-2); }
.dk-js .dk-stats li.dk-reveal.dk-in { transition: opacity .9s var(--dk-ease), filter .9s var(--dk-ease), transform .35s var(--dk-ease), box-shadow .35s var(--dk-ease); transition-delay: var(--dk-d, 0s), var(--dk-d, 0s), 0s, 0s; }
.dk-js .dk-stats li.dk-reveal.dk-in:hover { transform: translateY(-4px); }
/* Client logos: a small static row of white tiles, so low-resolution logos stay crisp */
.dk-clients { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 14px 22px; padding: 16px 0 16px 22px; border-radius: 16px; background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)); box-shadow: inset 0 0 0 1px var(--dk-edge); }
.dk-clients__label { margin: 0; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--dk-green-2); }
.dk-clients__viewport { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.dk-clients__row { display: flex; gap: 12px; width: max-content; margin: 0; padding: 0; list-style: none; animation: dk-slide 45s linear infinite; }
.dk-clients__viewport:hover .dk-clients__row { animation-play-state: paused; }
.dk-clients__row li { display: grid; place-items: center; flex: none; height: 54px; padding: 0 16px; border-radius: 10px; background: #fff; transition: transform .3s var(--dk-ease); }
.dk-clients__row li:hover { transform: translateY(-3px); }
.dk-clients__row img { height: 32px; width: auto; max-width: 120px; object-fit: contain; }
@media (max-width: 700px) { .dk-clients { grid-template-columns: 1fr; padding: 16px 0; } .dk-clients__label { padding-left: 18px; } }
@media (prefers-reduced-motion: reduce) { .dk-clients__row { animation: none; flex-wrap: wrap; width: auto; } .dk-clients__row li[aria-hidden] { display: none; } }
/* A second ribbon further down the page sits in the flow instead of overlapping the hero */
.dk-creds ~ .dk-creds { margin-top: 0; padding: clamp(40px, 6vw, 72px) 0 0; }
@media (max-width: 700px) { .dk-creds__bar { grid-template-columns: 1fr; gap: 12px; padding: 18px 0; } .dk-creds__label { padding-left: 20px; max-width: none; } }

/* ---------- Steps ---------- */
.dk-visit__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 88px); align-items: start; }
.dk-visit__stage { position: sticky; top: 32px; aspect-ratio: 4 / 5; overflow: hidden; border-radius: var(--dk-r) var(--dk-sweep) var(--dk-r) var(--dk-r); background: var(--dk-navy); box-shadow: 0 0 0 1px var(--dk-edge), 0 40px 80px -40px rgba(0,0,0,.8); }
.dk-visit__stage img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; clip-path: inset(0 100% 0 0); transition: clip-path 1s var(--dk-ease); }
.dk-visit__stage img.dk-on { clip-path: inset(0 0 0 0); z-index: 1; animation: dk-kb 12s ease-in-out infinite alternate; }
.dk-visit__stage img.dk-was { clip-path: inset(0 0 0 0); z-index: 0; }
.dk-visit__wiper { position: absolute; top: -10%; bottom: -10%; left: 0; z-index: 2; width: 8px; background: var(--dk-green); box-shadow: 0 0 40px 12px rgba(37,208,58,.55); transform: translateX(-30px) skewX(-6deg); opacity: 0; }
.dk-visit__wiper.dk-go { animation: dk-wipe 1s var(--dk-ease); }
@keyframes dk-wipe { 0% { opacity: 1; transform: translateX(-30px) skewX(-6deg); } 90% { opacity: 1; } 100% { opacity: 0; transform: translateX(var(--dk-w, 600px)) skewX(-6deg); } }
.dk-visit__badge { position: absolute; left: 18px; right: 18px; bottom: 18px; z-index: 3; display: flex; gap: 12px; align-items: center; padding: 14px 16px; border-radius: 12px; background: rgba(10,21,32,.72); backdrop-filter: blur(10px); box-shadow: inset 0 0 0 1px var(--dk-edge); font-size: 14px; line-height: 1.35; }
.dk-visit__badge svg { flex: none; width: 26px; height: 26px; color: var(--dk-green); }
.dk-visit__count { position: absolute; top: 18px; right: 18px; z-index: 3; padding: 6px 12px; border-radius: 99px; background: rgba(10,21,32,.7); backdrop-filter: blur(8px); font-size: 13px; font-weight: 700; box-shadow: inset 0 0 0 1px var(--dk-edge); }
.dk-steps { position: relative; list-style: none; margin: 0; padding: 0; }
.dk-steps::before, .dk-steps__fill { content: ""; position: absolute; left: 25px; top: 26px; bottom: 26px; width: 2px; background: var(--dk-edge-2); }
.dk-steps__fill { background: linear-gradient(var(--dk-green), var(--dk-green-2)); bottom: auto; height: 0; box-shadow: 0 0 14px rgba(37,208,58,.7); transition: height .6s var(--dk-ease); }
.dk-step { position: relative; display: grid; grid-template-columns: 52px 1fr; gap: 0 22px; padding: 0 0 56px; }
.dk-step:last-child { padding-bottom: 0; }
.dk-step__num { position: relative; z-index: 1; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: #10202f; box-shadow: inset 0 0 0 1px var(--dk-edge-2), 0 0 0 6px var(--dk-bg); font-weight: 700; color: var(--dk-soft); transition: background .5s, color .5s, box-shadow .5s, transform .5s var(--dk-ease); }
.dk-step__body { padding-top: 10px; opacity: .35; transform: translateX(16px); transition: opacity .6s var(--dk-ease), transform .6s var(--dk-ease); }
.dk-step__body h3 { margin: 0; font-size: clamp(1.2rem, 1.05rem + .5vw, 1.45rem); letter-spacing: -.015em; line-height: 1.2; }
.dk-step__body p { margin: 10px 0 0; color: var(--dk-soft); max-width: 46ch; }
.dk-chip { display: inline-flex; align-items: center; gap: 6px; margin-top: 14px; padding: 6px 12px; border-radius: 99px; background: rgba(37,208,58,.1); box-shadow: inset 0 0 0 1px rgba(37,208,58,.3); color: var(--dk-green-2); font-size: 13px; font-weight: 700; transform: scale(.9); opacity: 0; transition: transform .5s .2s var(--dk-ease), opacity .5s .2s; }
.dk-chip svg { width: 14px; height: 14px; }
.dk-step.dk-on .dk-step__num { background: var(--dk-green); color: #06120b; box-shadow: 0 0 0 6px var(--dk-bg), 0 0 30px 4px rgba(37,208,58,.6); transform: scale(1.08); }
.dk-step.dk-done .dk-step__num { background: #163a24; color: var(--dk-green-2); box-shadow: inset 0 0 0 1px rgba(37,208,58,.5), 0 0 0 6px var(--dk-bg); }
.dk-step.dk-on .dk-step__body, .dk-step.dk-done .dk-step__body { opacity: 1; transform: none; }
.dk-step.dk-on .dk-chip, .dk-step.dk-done .dk-chip { transform: none; opacity: 1; }
.dk-visit__thumb { display: none; }
@media (max-width: 900px) {
  .dk-visit__grid { grid-template-columns: 1fr; }
  .dk-visit__stage { display: none; }
  .dk-visit__thumb { display: block; margin-top: 16px; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 12px; clip-path: inset(0 100% 0 0); transition: clip-path 1s var(--dk-ease); }
  .dk-step.dk-on .dk-visit__thumb, .dk-step.dk-done .dk-visit__thumb { clip-path: inset(0 0 0 0); }
}

/* ---------- Homes ---------- */
.dk-panels { display: flex; gap: 10px; height: 540px; margin: 0; padding: 0; list-style: none; }
.dk-panels > li { display: flex; flex: 1; min-width: 0; transition: flex .7s var(--dk-ease); }
.dk-panels > li.dk-on { flex: 4.2; }
.dk-panel { position: relative; flex: 1; min-width: 0; overflow: hidden; border: 0; padding: 0; border-radius: var(--dk-r); color: #fff; text-align: left; cursor: pointer; background: var(--dk-navy); isolation: isolate; box-shadow: inset 0 0 0 1px var(--dk-edge); }
.dk-panel img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform 1.2s var(--dk-ease), filter .6s; filter: saturate(.7) brightness(.8); }
li.dk-on .dk-panel img { filter: none; animation: dk-kb 14s ease-in-out infinite alternate; }
.dk-panel::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(10,21,32,.05) 35%, rgba(10,21,32,.9) 100%); }
li.dk-on .dk-panel { box-shadow: inset 0 0 0 1px rgba(37,208,58,.5), 0 30px 60px -30px rgba(37,208,58,.35); }
.dk-panel__label { position: absolute; left: 22px; bottom: 22px; right: 22px; }
.dk-panel__label b { display: block; font-size: 1.45rem; line-height: 1.1; letter-spacing: -.02em; white-space: nowrap; }
.dk-panel__label span { display: block; max-width: 40ch; margin-top: 10px; font-size: 15px; line-height: 1.5; color: var(--dk-soft-2); opacity: 0; transform: translateY(10px); transition: opacity .5s .2s, transform .5s .2s var(--dk-ease); }
li.dk-on .dk-panel__label span { opacity: 1; transform: none; }
li:not(.dk-on) .dk-panel__label b { writing-mode: vertical-rl; transform: rotate(180deg); font-size: 1.1rem; }
.dk-panel__n { position: absolute; top: 18px; left: 20px; font-size: 13px; font-weight: 700; color: var(--dk-green); }
.dk-homes__ctrl { display: none; }
.dk-homes__foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px 32px; margin-top: 28px; }
.dk-homes__foot p { margin: 0; color: var(--dk-soft); font-size: 15px; max-width: 70ch; }
@media (max-width: 900px) {
  .dk-panels { height: auto; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin-right: calc(var(--dk-gut) * -1); padding-right: var(--dk-gut); }
  .dk-panels::-webkit-scrollbar { display: none; }
  .dk-panels > li, .dk-panels > li.dk-on { flex: 0 0 82%; scroll-snap-align: start; }
  .dk-panel { aspect-ratio: 4 / 5; cursor: default; }
  .dk-panel img { filter: none; }
  li:not(.dk-on) .dk-panel__label b { writing-mode: horizontal-tb; transform: none; font-size: 1.3rem; }
  .dk-panel__label span { opacity: 1; transform: none; }
  .dk-homes__ctrl { display: flex; align-items: center; justify-content: space-between; margin-top: 18px; }
  .dk-homes__ctrl button { width: 48px; height: 48px; border: 0; border-radius: 50%; background: rgba(255,255,255,.08); box-shadow: inset 0 0 0 1px var(--dk-edge-2); display: grid; place-items: center; cursor: pointer; }
  .dk-homes__ctrl button:disabled { opacity: .3; }
  .dk-homes__ctrl svg { width: 20px; height: 20px; }
  .dk-dots { display: flex; gap: 8px; }
  .dk-dots i { width: 8px; height: 8px; border-radius: 99px; background: rgba(255,255,255,.25); transition: width .35s var(--dk-ease), background .3s; }
  .dk-dots i.dk-on { width: 26px; background: var(--dk-green); }
}

/* ---------- Schedule ---------- */
.dk-plan__box { position: relative; overflow: hidden; border-radius: 22px; isolation: isolate; }
.dk-plan__box .dk-aura { opacity: .7; }
.dk-plan__top { padding: clamp(32px, 5vw, 60px) clamp(26px, 5vw, 60px) 0; }
.dk-plan__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding: 36px clamp(26px, 5vw, 60px) 0; }
.dk-opt { position: relative; padding: clamp(26px, 3vw, 40px); border-radius: 16px; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 1px var(--dk-edge); transition: background .4s, box-shadow .4s, transform .4s var(--dk-ease); }
.dk-opt:hover { background: rgba(255,255,255,.065); box-shadow: inset 0 0 0 1px rgba(37,208,58,.45); transform: translateY(-3px); }
.dk-opt h3 { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 12px; font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--dk-green-2); }
.dk-opt h3 i { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: rgba(37,208,58,.12); box-shadow: inset 0 0 0 1px rgba(37,208,58,.35); }
.dk-opt h3 svg { width: 18px; height: 18px; }
.dk-opt .dk-slogan { margin: 0; font-weight: 700; font-size: clamp(1.45rem, 1.15rem + 1vw, 2rem); line-height: 1.15; letter-spacing: -.025em; }
.dk-opt p { margin: 12px 0 0; color: var(--dk-soft); max-width: 44ch; }
.dk-every { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 20px; font-weight: 700; font-size: 15px; color: var(--dk-soft-2); }
.dk-every span { padding: 6px 12px; border-radius: 8px; background: rgba(37,208,58,.12); color: var(--dk-green-2); box-shadow: inset 0 0 0 1px rgba(37,208,58,.35); }
.dk-plan__note { display: flex; gap: 12px; align-items: center; margin: 16px clamp(26px, 5vw, 60px) 0; padding: 16px 18px; border-radius: 12px; background: rgba(255,255,255,.03); box-shadow: inset 0 0 0 1px var(--dk-edge); font-size: 15px; color: var(--dk-soft-2); }
.dk-plan__note svg { flex: none; width: 22px; height: 22px; color: var(--dk-green); }
.dk-plan__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 28px; padding: 28px clamp(26px, 5vw, 60px) clamp(28px, 4vw, 48px); }
.dk-plan__foot .dk-tel { color: var(--dk-text); font-weight: 700; text-decoration: none; }
.dk-details { flex-basis: 100%; interpolate-size: allow-keywords; border-top: 1px solid var(--dk-edge); }
.dk-details summary { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; list-style: none; font-weight: 700; padding: 16px 0 6px; }
.dk-details summary::-webkit-details-marker { display: none; }
.dk-details summary::after { content: ""; width: 12px; height: 12px; background: linear-gradient(var(--dk-green), var(--dk-green)) center/100% 2px no-repeat, linear-gradient(var(--dk-green), var(--dk-green)) center/2px 100% no-repeat; transition: transform .35s var(--dk-ease); }
.dk-details[open] summary::after { transform: rotate(135deg); }
.dk-details::details-content { height: 0; overflow: clip; transition: height .45s var(--dk-ease), content-visibility .45s allow-discrete; }
.dk-details[open]::details-content { height: auto; }
.dk-details dl { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px 28px; margin: 10px 0 0; }
.dk-details dt { font-weight: 700; font-size: 14px; color: var(--dk-green-2); }
.dk-details dd { margin: 4px 0 0; font-size: 15px; color: var(--dk-soft); }
@media (max-width: 860px) { .dk-plan__cols { grid-template-columns: 1fr; } .dk-details dl { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .dk-details dl { grid-template-columns: 1fr; } .dk-plan__foot .dk-btn { width: 100%; } }

/* ---------- Reviews (live Trustindex, brand coloured) ---------- */
.dk-rev .ti-widget { position: relative; white-space: normal; font-family: inherit; margin: 0; }
.dk-rev .ti-widget .ti-widget-container .ti-review-item > .ti-inner { border: 0 !important; border-radius: 14px !important; box-shadow: 0 24px 50px -28px rgba(0,0,0,.8) !important; }
.dk-rev .ti-widget .ti-widget-container .ti-widget-header, .dk-rev .ti-widget .ti-widget-container .ti-header-content { border-color: transparent !important; border-radius: 14px !important; }
.dk-rev .ti-widget .ti-widget-container .ti-header-write-btn, .dk-rev .ti-widget .ti-widget-container .ti-header-write-btn-container a { border-color: var(--dk-green) !important; color: #06120b !important; background: var(--dk-green) !important; }
.dk-rev .ti-widget .ti-widget-container .ti-controls .ti-next, .dk-rev .ti-widget .ti-widget-container .ti-controls .ti-prev { background: var(--dk-green) !important; border-color: var(--dk-green) !important; }
.dk-rev .ti-widget .ti-widget-container .ti-controls-line .dot { background: rgba(255,255,255,.3) !important; }
.dk-rev .ti-widget .ti-widget-container .ti-controls-line .dot.active { background: var(--dk-green) !important; }
.dk-rev .ti-widget .ti-widget-container .ti-read-more::after { background-color: var(--dk-green) !important; }

/* ---------- Commercial ---------- */
.dk-biz__box { display: grid; grid-template-columns: 1fr 1.25fr; overflow: hidden; border-radius: 22px; }
.dk-biz__copy { padding: clamp(32px, 4vw, 56px); display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.dk-biz__copy .dk-h2 { font-size: clamp(1.8rem, 1.3rem + 1.6vw, 2.6rem); }
.dk-biz__copy .dk-lead { margin-bottom: 26px; }
.dk-biz__reel { position: relative; overflow: hidden; min-height: 420px; -webkit-mask-image: linear-gradient(90deg, transparent, #000 14%); mask-image: linear-gradient(90deg, transparent, #000 14%); }
.dk-biz__col { position: absolute; top: 0; display: flex; flex-direction: column; gap: 12px; width: calc(50% - 6px); animation: dk-up 36s linear infinite; }
.dk-biz__col + .dk-biz__col { left: calc(50% + 6px); animation-name: dk-down; }
.dk-biz__col img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 12px; }
@keyframes dk-up { from { transform: translateY(0); } to { transform: translateY(-50%); } }
@keyframes dk-down { from { transform: translateY(-50%); } to { transform: translateY(0); } }
.dk-biz__box:hover .dk-biz__col { animation-play-state: paused; }
@media (max-width: 860px) { .dk-biz__box { grid-template-columns: 1fr; } .dk-biz__reel { min-height: 320px; -webkit-mask-image: linear-gradient(180deg, transparent, #000 14%, #000 86%, transparent); mask-image: linear-gradient(180deg, transparent, #000 14%, #000 86%, transparent); } }

/* ---------- FAQ + quote start ---------- */
.dk-faq__grid { display: grid; grid-template-columns: 4fr 8fr; gap: 32px clamp(32px, 5vw, 80px); align-items: start; }
.dk-faq__aside { position: sticky; top: 32px; }
.dk-faq__search { position: relative; display: block; margin-bottom: 14px; }
.dk-faq__search input { width: 100%; min-height: 54px; padding: 0 18px 0 48px; border: 0; border-radius: 12px; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 1px var(--dk-edge); font: inherit; font-size: 16px; color: var(--dk-text); }
.dk-faq__search input::placeholder { color: #7f93a1; }
.dk-faq__search input:focus { outline: none; box-shadow: inset 0 0 0 2px var(--dk-green); }
.dk-faq__search svg { position: absolute; left: 16px; top: 50%; width: 20px; height: 20px; transform: translateY(-50%); color: var(--dk-soft); }
.dk-faq__empty { display: none; padding: 16px 4px; color: var(--dk-soft); }
.dk-faq details { margin-bottom: 8px; border-radius: 12px; background: rgba(255,255,255,.03); box-shadow: inset 0 0 0 1px var(--dk-edge); transition: background .35s, box-shadow .35s; interpolate-size: allow-keywords; }
.dk-faq details:hover { background: rgba(255,255,255,.05); }
.dk-faq details[open] { background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 1px rgba(37,208,58,.45), 0 20px 40px -26px rgba(37,208,58,.4); }
.dk-faq summary { display: grid; grid-template-columns: 1fr 34px; align-items: center; gap: 14px; padding: 18px 20px; cursor: pointer; list-style: none; font-weight: 700; font-size: 17px; line-height: 1.35; }
.dk-faq summary::-webkit-details-marker { display: none; }
.dk-faq summary .dk-pm { width: 34px; height: 34px; border-radius: 50%; background: rgba(255,255,255,.07); display: grid; place-items: center; transition: background .3s, transform .45s var(--dk-ease); }
.dk-faq summary .dk-pm::before { content: ""; width: 12px; height: 12px; background: linear-gradient(#fff,#fff) center/100% 2px no-repeat, linear-gradient(#fff,#fff) center/2px 100% no-repeat; }
.dk-faq details[open] summary .dk-pm { background: var(--dk-green); transform: rotate(135deg); }
.dk-faq details[open] summary .dk-pm::before { background: linear-gradient(#06120b,#06120b) center/100% 2px no-repeat, linear-gradient(#06120b,#06120b) center/2px 100% no-repeat; }
.dk-faq details::details-content { height: 0; overflow: clip; transition: height .45s var(--dk-ease), content-visibility .45s allow-discrete; }
.dk-faq details[open]::details-content { height: auto; }
.dk-faq details p { margin: 0; padding: 0 64px 20px 20px; color: var(--dk-soft); }
.dk-faq details p a { color: var(--dk-green-2); }
@media (max-width: 960px) { .dk-faq__grid { grid-template-columns: 1fr; } .dk-faq__aside { position: static; } }

/* ---------- Final: quote invitation + often booked with, one bento ---------- */
.dk-bento { display: grid; grid-template-columns: 1.55fr 1fr; grid-template-rows: auto; gap: 14px; }
.dk-cta { position: relative; overflow: hidden; display: grid; grid-template-rows: 1fr auto; min-height: 520px; border-radius: 22px; isolation: isolate; }
.dk-cta__img { position: absolute; inset: 0; z-index: -2; }
.dk-cta__img img { width: 100%; height: 100%; object-fit: cover; object-position: 70% 60%; animation: dk-kb 20s ease-in-out infinite alternate; }
.dk-cta::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(10,21,32,.96) 0%, rgba(10,21,32,.85) 40%, rgba(10,21,32,.2) 75%), linear-gradient(0deg, rgba(10,21,32,.85), rgba(10,21,32,0) 45%); }
.dk-cta__copy { align-self: center; padding: clamp(32px, 4vw, 56px); max-width: 560px; }
.dk-cta__copy .dk-h2 { font-size: clamp(2rem, 1.3rem + 2.4vw, 3.4rem); }
.dk-cta__steps { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 28px; padding: 0; list-style: none; counter-reset: c; }
.dk-cta__steps li { counter-increment: c; display: inline-flex; align-items: center; gap: 10px; padding: 7px 14px 7px 7px; border-radius: 99px; background: rgba(255,255,255,.07); box-shadow: inset 0 0 0 1px var(--dk-edge); backdrop-filter: blur(8px); font-size: 14px; font-weight: 700; }
.dk-cta__steps li::before { content: counter(c); display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--dk-green); color: #06120b; font-size: 12px; }
.dk-cta__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 26px; }
.dk-cta__tel { color: var(--dk-text); text-decoration: none; font-weight: 700; font-size: 1.35rem; }
.dk-cta__tel small { display: block; font-size: 11px; font-weight: 700; color: var(--dk-soft); letter-spacing: .1em; text-transform: uppercase; }
.dk-side { display: grid; grid-template-rows: auto 1fr 1fr 1fr; gap: 14px; }
.dk-side__head { padding: 22px 24px; border-radius: 18px; }
.dk-side__head h3 { margin: 0; font-size: 1.25rem; letter-spacing: -.015em; }
.dk-side__head p { margin: 4px 0 0; color: var(--dk-soft); font-size: 14px; }
.dk-svcl { position: relative; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 14px; min-height: 104px; padding: 20px 22px; overflow: hidden; border-radius: 18px; text-decoration: none; isolation: isolate; box-shadow: inset 0 0 0 1px var(--dk-edge); background: rgba(255,255,255,.035); transition: box-shadow .4s; }
.dk-svcl img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; z-index: -2; transform: scale(1.08); transition: transform 1s var(--dk-ease); }
.dk-svcl::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(10,21,32,.9) 25%, rgba(10,21,32,.15)); transition: background .5s; }
.dk-svcl b { display: block; font-size: 1.2rem; letter-spacing: -.015em; }
.dk-svcl small { display: block; margin-top: 3px; color: var(--dk-soft-2); font-size: 14px; }
.dk-svcl .dk-go { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.1); transition: background .3s, color .3s, transform .45s var(--dk-ease); }
.dk-svcl .dk-go svg { width: 20px; height: 20px; }
.dk-svcl:hover, .dk-svcl:focus-visible { box-shadow: inset 0 0 0 1px rgba(37,208,58,.6); }
.dk-svcl:hover img, .dk-svcl:focus-visible img { transform: scale(1.0); }
.dk-svcl:hover::before, .dk-svcl:focus-visible::before { background: linear-gradient(90deg, rgba(10,21,32,.85) 20%, rgba(10,21,32,.1)); }
.dk-svcl:hover .dk-go, .dk-svcl:focus-visible .dk-go { background: var(--dk-green); color: #06120b; transform: rotate(-45deg); }
@media (max-width: 960px) { .dk-bento { grid-template-columns: 1fr; } .dk-cta { min-height: 460px; } .dk-cta::before { background: linear-gradient(0deg, rgba(10,21,32,.97) 30%, rgba(10,21,32,.5) 65%, rgba(10,21,32,.15)); } .dk-cta__copy { align-self: end; } .dk-cta__actions .dk-btn { width: 100%; } }

/* ---------- Footer ---------- */
.dk-ftr { position: relative; overflow: hidden; isolation: isolate; padding: 0 0 calc(24px + env(safe-area-inset-bottom)); background: #08121b; color: var(--dk-soft); font-size: 15px; border-top: 1px solid var(--dk-edge); }
.dk-ftr .dk-aura { opacity: .45; }
.dk-ftr__top { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr 1.25fr; gap: 40px 32px; padding: 64px 0 44px; }
.dk-ftr__brand img { height: 56px; width: auto; }
.dk-ftr__brand p { margin: 16px 0 20px; max-width: 30ch; color: var(--dk-soft); line-height: 1.6; }
.dk-ftr__rate { display: inline-flex; align-items: center; gap: 12px; width: max-content; max-width: 100%; padding: 10px 16px 10px 10px; border-radius: 14px; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 1px var(--dk-edge); color: #e6edf1; text-decoration: none; transition: background .2s, box-shadow .2s; }
.dk-ftr__rate:hover, .dk-ftr__rate:focus-visible { outline: none; background: rgba(255,255,255,.08); box-shadow: inset 0 0 0 1px rgba(37,208,58,.5); }
.dk-ftr__rate-txt { display: grid; gap: 1px; line-height: 1.2; }
.dk-ftr__rate-txt b { display: flex; align-items: center; gap: 8px; color: #fff; font-size: 16px; }
.dk-ftr__rate-txt small { color: var(--dk-soft-2); font-size: 12.5px; font-weight: 700; white-space: nowrap; }
.dk-ftr .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.dk-ftr__rate .dk-g { flex: none; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; background: #fff; }
.dk-ftr__rate .dk-g svg { width: 22px; height: 22px; }
.dk-ftr__rate .dk-stars { color: #f6b02c; letter-spacing: 1px; font-size: 13px; }
.dk-ftr h2 { margin: 4px 0 14px; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--dk-green-2); }
.dk-ftr__col h2 button { padding: 0; border: 0; background: none; color: inherit; font: inherit; letter-spacing: inherit; text-transform: inherit; text-align: left; cursor: default; pointer-events: none; }
.dk-ftr__col ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 2px; }
.dk-ftr__col a { display: inline-flex; align-items: center; min-height: 36px; color: #dbe4ea; text-decoration: none; font-weight: 700; font-size: 15px; background: linear-gradient(var(--dk-green), var(--dk-green)) 0 100% / 0 2px no-repeat; transition: color .2s, background-size .35s var(--dk-ease); }
.dk-ftr__col a:hover, .dk-ftr__col a:focus-visible { color: #fff; background-size: 100% 2px; }
/* Footer link groups: open on desktop; on tablets and phones they open and close with a chevron (owner, 9 November 2026) */
.dk-ftr__col { border-top: 1px solid var(--dk-edge); align-self: start; }
.dk-ftr__col h2 { margin: 0; }
.dk-ftr__col h2 button { pointer-events: auto; display: flex; justify-content: space-between; align-items: center; gap: 14px; width: 100%; min-height: 56px; padding: 0; border: 0; background: none; color: inherit; font: inherit; letter-spacing: inherit; text-transform: inherit; cursor: pointer; }
.dk-ftr__col h2 button::after { content: ""; flex: none; width: 9px; height: 9px; margin: -4px 4px 0 0; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .3s var(--dk-ease), margin .3s var(--dk-ease); }
.dk-ftr__col.dk-open h2 button::after { transform: rotate(225deg); margin-top: 4px; }
.dk-ftr__col ul { display: none; padding-bottom: 12px; }
.dk-ftr__col.dk-open ul { display: grid; }
.dk-ftr__contact { display: grid; gap: 14px; align-content: start; }
.dk-ftr__tel { color: #fff; text-decoration: none; font-weight: 700; font-size: 1.5rem; letter-spacing: -.01em; }
.dk-ftr__tel small { display: block; font-size: 12px; font-weight: 700; color: var(--dk-green-2); letter-spacing: .1em; text-transform: uppercase; }
.dk-ftr address { font-style: normal; line-height: 1.6; color: var(--dk-soft-2); }
.dk-ftr__social { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; color: #dbe4ea; font-weight: 700; text-decoration: none; }
.dk-ftr__social svg { width: 20px; height: 20px; color: #fff; transition: color .2s; }
.dk-ftr__social:hover svg { color: var(--dk-green); }
.dk-ftr__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px 24px; margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--dk-edge); font-size: 13px; }
.dk-ftr__legal { display: flex; flex-wrap: wrap; gap: 4px 22px; }
.dk-ftr__legal a, .dk-ftr__legal button { display: inline-flex; align-items: center; min-height: 36px; padding: 0; border: 0; background: none; color: var(--dk-soft-2); font-size: 13px; text-decoration: none; cursor: pointer; }
.dk-ftr__legal a:hover, .dk-ftr__legal button:hover { color: #fff; }
/* Desktop footer: brand, rating and contact on the left; every link group open on the right, with the
   longer residential list in two columns. No toggles at this size. */
@media (min-width: 1101px) {
  .dk-ftr__top { grid-template-columns: minmax(260px, 1.2fr) minmax(0, 1fr) minmax(0, 1.1fr) minmax(0, .8fr); grid-template-areas: "brand res com about" "contact res com about"; gap: 28px 48px; padding: 72px 0 52px; }
  .dk-ftr__grp > button { min-height: 34px; font-size: 14.5px; }
  .dk-ftr__brand { grid-area: brand; }
  .dk-ftr__contact { grid-area: contact; padding-top: 22px; border-top: 1px solid var(--dk-edge); }
  .dk-ftr__col[aria-labelledby="dk-f-res"] { grid-area: res; }
  .dk-ftr__col[aria-labelledby="dk-f-com"] { grid-area: com; }
  .dk-ftr__col[aria-labelledby="dk-f-about"] { grid-area: about; }
  .dk-ftr__col { border-top: 0; }
  .dk-ftr__col h2 { margin: 0 0 14px; padding-bottom: 12px; border-bottom: 1px solid var(--dk-edge); }
  .dk-ftr__col h2 button { min-height: 0; pointer-events: none; cursor: default; white-space: nowrap; }
  .dk-ftr__col h2 button::after { display: none; }
  .dk-ftr__col ul, .dk-ftr__col.dk-open ul { display: grid; padding-bottom: 0; gap: 0; }
  .dk-ftr__col a { min-height: 34px; padding: 4px 0; font-size: 14.5px; line-height: 1.35; }
  .dk-ftr__tel { font-size: 1.6rem; }
}
/* Footer sub-groups (Roof, Driveways & Patios): a link-styled button with a chevron that opens its links */
.dk-ftr__grp > button { display: inline-flex; align-items: center; gap: 10px; min-height: 36px; padding: 0; border: 0; background: none; color: #dbe4ea; font: inherit; font-weight: 700; font-size: 15px; cursor: pointer; transition: color .2s; }
.dk-ftr__grp > button::after { content: ""; width: 7px; height: 7px; margin-top: -4px; border-right: 2px solid var(--dk-green-2); border-bottom: 2px solid var(--dk-green-2); transform: rotate(45deg); transition: transform .3s var(--dk-ease), margin .3s var(--dk-ease); }
.dk-ftr__grp > button[aria-expanded="true"]::after { transform: rotate(225deg); margin-top: 3px; }
.dk-ftr__grp > button:hover, .dk-ftr__grp > button:focus-visible { outline: none; color: #fff; }
.dk-ftr__grp > button:focus-visible { box-shadow: 0 2px 0 var(--dk-green); }
.dk-ftr__col .dk-ftr__grp > ul { display: none; margin: 0 0 6px; padding: 2px 0 2px 14px; border-left: 2px solid rgba(37,208,58,.35); list-style: none; }
.dk-ftr__col .dk-ftr__grp > ul.dk-open-sub { display: grid; }
.dk-ftr__grp > ul a { min-height: 32px; font-size: 14px; color: var(--dk-soft-2); }
@media (max-width: 1100px) { .dk-ftr__top { grid-template-columns: 1fr 1fr 1fr; } .dk-ftr__brand { grid-column: 1 / -1; } .dk-ftr__contact { grid-column: span 3; grid-template-columns: repeat(3, auto); justify-content: start; gap: 18px 40px; } }
@media (max-width: 700px) {
  .dk-ftr__top { grid-template-columns: 1fr; gap: 0; padding-top: 48px; }
  .dk-ftr__brand { margin-bottom: 26px; }
  .dk-ftr__contact { grid-column: auto; grid-template-columns: 1fr; order: -1; margin-bottom: 18px; padding: 22px; border-radius: 16px; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 1px var(--dk-edge); }
}

/* ---------- Reveal ---------- */
.dk-js .dk-reveal { opacity: 0; transform: translateY(26px); filter: blur(6px); transition: opacity .9s var(--dk-ease), transform .9s var(--dk-ease), filter .9s var(--dk-ease); transition-delay: var(--dk-d, 0s); }
.dk-js .dk-reveal.dk-in { opacity: 1; transform: none; filter: none; }
@media (prefers-reduced-motion: reduce) {
  :where(.dk-root) *, :where(.dk-root) *::before, :where(.dk-root) *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .dk-rise, .dk-js .dk-reveal { opacity: 1 !important; transform: none !important; filter: none !important; }
}

/* ---------- WordPress additions ---------- */

/* ---------- Homepage sections (design/home-v1.html) ---------- */
/* ================= Homepage additions (same system as v5) ================= */
.dk-hero.dk-hero--home h1 { max-width: 12ch; }
.dk-hero.dk-hero--home .dk-lead { max-width: 52ch; }
.dk-hero.dk-hero--home .dk-btn--glass svg { width: 20px; height: 20px; }

/* Window cleaning spotlight */
.dk-spot { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(32px, 5vw, 80px); align-items: center; }
.dk-spot__media { position: relative; padding: 0 0 48px 0; }
.dk-spot__frame { overflow: hidden; border-radius: 22px; aspect-ratio: 4 / 3.4; box-shadow: 0 40px 80px -40px rgba(0,0,0,.8), inset 0 0 0 1px var(--dk-edge); }
.dk-spot__frame img { width: 100%; height: 100%; object-fit: cover; object-position: 62% 50%; transform: scale(1.06); transition: transform 1.4s var(--dk-ease); }
.dk-spot__media.dk-in .dk-spot__frame img { transform: scale(1); }
.dk-spot__inset { position: absolute; right: -28px; bottom: 0; width: 38%; aspect-ratio: 1; overflow: hidden; border-radius: 18px; border: 4px solid var(--dk-bg); box-shadow: 0 24px 50px -20px rgba(0,0,0,.9); animation: dk-bob 7s ease-in-out infinite; }
.dk-spot__inset img { width: 100%; height: 100%; object-fit: cover; }
@keyframes dk-bob { 50% { transform: translateY(-10px); } }
.dk-spot__chip { position: absolute; display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px 10px 12px; border-radius: 99px; background: rgba(10,21,32,.72); backdrop-filter: blur(12px); box-shadow: inset 0 0 0 1px rgba(37,208,58,.35), 0 18px 40px -20px rgba(0,0,0,.9); font-size: 14px; font-weight: 700; animation: dk-bob 6s ease-in-out infinite; }
.dk-spot__chip svg { width: 18px; height: 18px; color: var(--dk-green); }
.dk-spot__chip--1 { left: 22px; top: 22px; }
.dk-spot__chip--2 { left: -18px; bottom: 96px; animation-delay: -3s; }
.dk-feats { display: grid; gap: 4px; margin: 30px 0 0; padding: 0; list-style: none; }
.dk-feats li { display: grid; grid-template-columns: 46px 1fr; gap: 16px; align-items: start; padding: 16px 0; border-top: 1px solid var(--dk-edge); }
.dk-feats li:last-child { border-bottom: 1px solid var(--dk-edge); }
.dk-feats i { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 12px; background: rgba(37,208,58,.1); box-shadow: inset 0 0 0 1px rgba(37,208,58,.3); color: var(--dk-green); }
.dk-feats i svg { width: 22px; height: 22px; }
.dk-feats b { display: block; font-size: 1.08rem; letter-spacing: -.01em; }
.dk-feats span { color: var(--dk-soft); font-size: 15px; line-height: 1.5; }
.dk-spot__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 28px; margin-top: 32px; }
/* Mirrored spotlight: photograph on the right, inset and lower label on its left edge */
.dk-spot--flip { grid-template-columns: 1fr 1.05fr; }
.dk-spot--flip .dk-spot__media { order: 2; }
.dk-spot--flip .dk-spot__inset { right: auto; left: -28px; }
.dk-spot--flip .dk-spot__chip--1 { left: auto; right: 22px; }
.dk-spot--flip .dk-spot__chip--2 { left: auto; right: -18px; }
@media (max-width: 900px) { .dk-spot--flip .dk-spot__media { order: 0; } .dk-spot--flip .dk-spot__inset { left: 0; } .dk-spot--flip .dk-spot__chip--2 { right: 12px; } }
@media (max-width: 900px) { .dk-spot { grid-template-columns: 1fr; } .dk-spot__inset { right: 0; width: 34%; } .dk-spot__chip--2 { left: 12px; } }

/* Service tiles */
.dk-tiles { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, minmax(250px, 1fr)); gap: 14px; }
.dk-tile { position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: flex-end; min-height: 250px; padding: 24px; border-radius: 18px; box-shadow: inset 0 0 0 1px var(--dk-edge); }
.dk-tile--big { grid-column: span 2; grid-row: span 2; padding: 34px; }
.dk-tile > img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transform: scale(1.08); transition: transform 1.1s var(--dk-ease); }
.dk-tile::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(10,21,32,.96) 8%, rgba(10,21,32,.55) 50%, rgba(10,21,32,.1)); transition: background .5s; }
.dk-tile::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(37,208,58,0); transition: box-shadow .4s; pointer-events: none; }
.dk-tile:hover > img, .dk-tile:focus-within > img { transform: scale(1); }
.dk-tile:hover::after, .dk-tile:focus-within::after { box-shadow: inset 0 0 0 1px rgba(37,208,58,.7), 0 0 40px -10px rgba(37,208,58,.6); }
.dk-tile__body { position: relative; max-width: 46ch; }
.dk-tile__icon { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 16px; border-radius: 12px; background: rgba(10,21,32,.6); backdrop-filter: blur(8px); box-shadow: inset 0 0 0 1px rgba(37,208,58,.4); color: var(--dk-green); }
.dk-tile__icon svg { width: 22px; height: 22px; }
.dk-tile h3 { margin: 0; font-size: 1.3rem; letter-spacing: -.02em; line-height: 1.15; }
.dk-tile--big h3 { font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.3rem); letter-spacing: -.03em; }
.dk-tile h3 a { text-decoration: none; }
.dk-tile h3 a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.dk-tile p { margin: 8px 0 0; color: var(--dk-soft-2); font-size: 15px; line-height: 1.5; }
.dk-tile--big p { font-size: 1.05rem; max-width: 40ch; }
.dk-tile__more { position: relative; z-index: 2; color: var(--dk-green-2); font-weight: 700; }
.dk-tile__signs { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 0; padding: 0; list-style: none; }
.dk-tile__signs li { padding: 7px 12px; border-radius: 99px; background: rgba(10,21,32,.6); backdrop-filter: blur(8px); box-shadow: inset 0 0 0 1px var(--dk-edge-2); font-size: 13px; font-weight: 700; }
.dk-tile .dk-go { position: absolute; top: 20px; right: 20px; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: rgba(10,21,32,.5); backdrop-filter: blur(8px); box-shadow: inset 0 0 0 1px var(--dk-edge-2); transition: background .3s, color .3s, transform .45s var(--dk-ease); }
.dk-tile .dk-go svg { width: 20px; height: 20px; }
.dk-tile:hover .dk-go, .dk-tile:focus-within .dk-go { background: var(--dk-green); color: #06120b; transform: rotate(-45deg); }
@media (max-width: 1000px) { .dk-tiles { grid-template-columns: 1fr 1fr; grid-template-rows: none; } .dk-tile--big { grid-column: 1 / -1; grid-row: auto; min-height: 420px; } }
@media (max-width: 560px) { .dk-tiles { grid-template-columns: 1fr; } .dk-tile { min-height: 230px; } }

/* Before and after */
.dk-ba-wrap { display: grid; grid-template-columns: 1.7fr 1fr; gap: 14px; }
.dk-ba { position: relative; overflow: hidden; aspect-ratio: 4 / 3; border-radius: 22px; box-shadow: inset 0 0 0 1px var(--dk-edge), 0 40px 80px -40px rgba(0,0,0,.8); user-select: none; touch-action: pan-y; }
.dk-ba__layer { position: absolute; inset: 0; overflow: hidden; }
.dk-ba__layer img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: var(--dk-f, 50% 50%); }
.dk-ba__a { clip-path: inset(0 0 0 var(--dk-p)); }
/* Side-by-side photographs (before on the left half, after on the right): each layer shows its own half */
.dk-ba--split .dk-ba__layer img { width: 200%; }
.dk-ba--split .dk-ba__a img { left: -100%; }
/* A single photograph showing cleaned and uncleaned areas: no slider */
.dk-ba--photo .dk-ba__a, .dk-ba--photo .dk-ba__line, .dk-ba--photo .dk-ba__range { display: none; }
.dk-ba__line { position: absolute; top: 0; bottom: 0; left: var(--dk-p); width: 2px; margin-left: -1px; background: var(--dk-green); box-shadow: 0 0 24px 2px rgba(37,208,58,.8); pointer-events: none; }
.dk-ba__knob { position: absolute; top: 50%; left: 50%; display: flex; align-items: center; justify-content: center; gap: 0; width: 60px; height: 60px; margin: -30px 0 0 -30px; border-radius: 50%; background: var(--dk-green); color: #06120b; box-shadow: 0 0 0 8px rgba(37,208,58,.22), 0 12px 30px -8px rgba(0,0,0,.6); }
.dk-ba__knob svg { width: 16px; height: 16px; }
.dk-ba__range { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; }
.dk-ba__range:focus-visible ~ .dk-ba__line .dk-ba__knob, .dk-ba:has(.dk-ba__range:focus-visible) .dk-ba__knob { outline: 3px solid #fff; outline-offset: 4px; }
.dk-ba__tag { position: absolute; top: 18px; padding: 7px 13px; border-radius: 99px; background: rgba(10,21,32,.7); backdrop-filter: blur(8px); font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; pointer-events: none; }
.dk-ba__tag--b { left: 18px; } .dk-ba__tag--a { right: 18px; color: var(--dk-green-2); }
.dk-ba__side { display: flex; flex-direction: column; gap: 18px; padding: 26px; border-radius: 22px; background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.02)); box-shadow: inset 0 0 0 1px var(--dk-edge); }
.dk-ba__caption { margin: 0; color: var(--dk-soft); }
.dk-ba__caption b { display: block; color: var(--dk-text); font-size: 1.35rem; letter-spacing: -.02em; }
.dk-ba__thumbs { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; flex: 1; }
.dk-ba__thumbs button { position: relative; overflow: hidden; display: flex; align-items: flex-end; min-height: 110px; padding: 10px 12px; border: 0; border-radius: 12px; cursor: pointer; text-align: left; isolation: isolate; box-shadow: inset 0 0 0 1px var(--dk-edge); }
.dk-ba__thumbs img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--dk-ease); }
.dk-ba__thumbs button::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(10,21,32,.9), rgba(10,21,32,.1) 70%); }
.dk-ba__thumbs span { font-size: 13px; font-weight: 700; }
.dk-ba__thumbs button:hover img { transform: scale(1.06); }
.dk-ba__thumbs button[aria-pressed="true"] { box-shadow: inset 0 0 0 2px var(--dk-green), 0 0 26px -8px rgba(37,208,58,.8); }
.dk-ba.dk-swap .dk-ba__layer img { animation: dk-baIn .6s var(--dk-ease); }
@keyframes dk-baIn { from { opacity: .2; filter: blur(6px); } }
@media (max-width: 900px) { .dk-ba-wrap { grid-template-columns: 1fr; } .dk-ba__thumbs { grid-template-columns: repeat(3, 1fr); } .dk-ba__thumbs button { min-height: 84px; } .dk-ba__thumbs span { font-size: 11px; } }
@media (max-width: 520px) { .dk-ba__thumbs { grid-template-columns: 1fr 1fr 1fr; } .dk-ba__side { padding: 20px; } }

/* Commercial, homepage version: capabilities and two actions */
.dk-biz__box--home { grid-template-columns: 1.15fr 1fr; border-radius: 22px; }
.dk-biz__box--home .dk-biz__reel { min-height: 100%; }
.dk-caps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 26px 0 0; padding: 0; list-style: none; }
.dk-caps li { padding: 16px; border-radius: 12px; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 1px var(--dk-edge); color: var(--dk-soft); font-size: 14px; line-height: 1.45; }
.dk-caps b { display: block; margin-bottom: 4px; color: var(--dk-text); font-size: 15px; }
.dk-caps li::before { content: ""; display: block; width: 26px; height: 3px; margin-bottom: 12px; border-radius: 3px; background: var(--dk-green); box-shadow: 0 0 12px rgba(37,208,58,.8); }
.dk-biz__also { margin: 22px 0 0; color: var(--dk-soft); font-size: 15px; max-width: 60ch; }
.dk-biz__also a { color: var(--dk-green-2); }
.dk-biz__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
@media (max-width: 1100px) { .dk-caps { grid-template-columns: 1fr; } }
@media (max-width: 860px) { .dk-biz__box--home { grid-template-columns: 1fr; } .dk-biz__box--home .dk-biz__reel { min-height: 360px; } .dk-biz__actions .dk-btn { width: 100%; } }

/* Local company and coverage */
.dk-local { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(32px, 5vw, 72px); align-items: center; }
.dk-local__photo { position: relative; margin: 0; overflow: hidden; border-radius: 22px; aspect-ratio: 16 / 12; box-shadow: inset 0 0 0 1px var(--dk-edge), 0 40px 80px -40px rgba(0,0,0,.8); }
.dk-local__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 60%; animation: dk-kb 26s ease-in-out infinite alternate; }
.dk-local__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10,21,32,.7), rgba(10,21,32,0) 45%); }
.dk-local__photo figcaption { position: absolute; left: 18px; bottom: 18px; z-index: 1; padding: 14px 18px; border-radius: 14px; background: rgba(10,21,32,.6); color: var(--dk-soft); font-size: 14px; }
.dk-local__photo figcaption b { display: block; color: var(--dk-text); font-size: 16px; }
.dk-local__copy .dk-link { display: inline-flex; }

/* Coverage: the map from the original homepage, in the dark style */
.dk-areas { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(24px, 4vw, 56px); align-items: center; margin-top: clamp(40px, 5vw, 72px); padding: clamp(20px, 3vw, 36px); border-radius: 22px; overflow: hidden; }
.dk-areas__map { position: relative; border-radius: 16px; background: radial-gradient(circle at 62% 62%, rgba(37,208,58,.12), transparent 55%), #0b1a28; box-shadow: inset 0 0 0 1px var(--dk-edge); overflow: hidden; }
.dk-map__switch { position: absolute; z-index: 2; top: 14px; left: 14px; display: inline-grid; grid-template-columns: 1fr 1fr; padding: 4px; border-radius: 99px; background: rgba(10,21,32,.8); backdrop-filter: blur(8px); box-shadow: inset 0 0 0 1px var(--dk-edge-2); }
.dk-map__switch button { min-height: 38px; padding: 0 14px; border: 0; border-radius: 99px; background: none; font-size: 14px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.dk-map__switch button[aria-pressed="true"] { background: var(--dk-green); color: #06120b; }
.h-map { display: block; width: 100%; height: auto; aspect-ratio: 500 / 367; }
.h-map image { filter: brightness(1.15) saturate(1.2); }
.h-map__county { fill: #e8f0f4; font: 700 15px var(--dk-font); text-anchor: middle; opacity: 0; pointer-events: none; transition: opacity .4s; }
.h-map.is-region .h-map__county { opacity: 1; }
.h-map__place { fill: #8fb0bf; font: italic 400 7px var(--dk-font); letter-spacing: .06em; text-anchor: middle; pointer-events: none; transition: opacity .4s; }
.h-map.is-region .h-map__place, .h-map.is-region .h-pin text { opacity: 0; }
.h-pin { cursor: pointer; outline: none; transition: opacity .4s; }
.h-map.is-region .h-pin:not([data-pin="Ipswich"]) { opacity: 0; pointer-events: none; }
.h-map.is-region .h-pin[data-pin="Ipswich"] text { opacity: 1; font-size: 15px; }
.h-map.is-region .h-pin[data-pin="Ipswich"] .h-pin__dot { r: 6px; }
.h-map.is-region .h-pin[data-pin="Ipswich"] .h-pin__halo { opacity: .4; r: 13px; animation: dk-halo 2.4s ease-in-out infinite; }
@keyframes dk-halo { 50% { opacity: .1; } }
.h-pin__hit { fill: transparent; }
.h-pin__halo { fill: var(--dk-green); opacity: 0; transition: opacity .2s; }
.h-pin__dot { fill: var(--dk-green); stroke: #0b1a28; stroke-width: 1; transition: fill .2s; }
.h-pin text { fill: #fff; font: 700 8px var(--dk-font); paint-order: stroke; stroke: #0b1a28; stroke-width: 2px; pointer-events: none; transition: opacity .4s, fill .2s; }
.h-pin:hover .h-pin__halo, .h-pin:focus-visible .h-pin__halo, .h-pin.dk-on .h-pin__halo { opacity: .45; }
.h-pin.dk-on .h-pin__dot { fill: #fff; }
.h-pin.dk-on text, .h-pin:hover text, .h-pin:focus-visible text { fill: var(--dk-green-2); }
.dk-map__key { margin: 0; padding: 0 18px 16px; color: var(--dk-soft); font-size: 13px; }
.dk-areas__h { font-size: clamp(1.8rem, 1.3rem + 1.6vw, 2.6rem); }
.dk-areas__copy > p { margin: 14px 0 0; color: var(--dk-soft); }
.dk-towns__title { font-size: 12px !important; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--dk-green-2) !important; margin-top: 22px !important; }
.dk-towns { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.dk-towns button { min-height: 36px; padding: 0 13px; border: 0; border-radius: 99px; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 1px var(--dk-edge-2); font-size: 13px; font-weight: 700; cursor: pointer; transition: background .2s, box-shadow .2s, color .2s; }
.dk-towns button:hover { box-shadow: inset 0 0 0 1px var(--dk-green); }
.dk-towns button[aria-pressed="true"] { background: rgba(37,208,58,.16); box-shadow: inset 0 0 0 1px var(--dk-green); color: var(--dk-green-2); }
.dk-map__result:empty { display: none; }
.dk-map__result { padding: 12px 14px; border-radius: 12px; background: rgba(37,208,58,.08); box-shadow: inset 0 0 0 1px rgba(37,208,58,.3); color: var(--dk-text) !important; font-size: 14px; }
.dk-areas .dk-areas__note { font-size: 14px; color: #8fa3b1; }
.dk-areas .dk-link { margin-top: 18px; }
@media (max-width: 960px) { .dk-areas { grid-template-columns: 1fr; } }
@media (max-width: 960px) { .dk-local { grid-template-columns: 1fr; } }

/* Google reviews in the dark style: navy glass cards, light text, green accents */
.dk-rev .ti-widget .ti-widget-container .ti-widget-header { background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.025)) !important; box-shadow: inset 0 0 0 1px var(--dk-edge) !important; }
.dk-rev .ti-widget .ti-widget-container .ti-header-content { background: none !important; box-shadow: none !important; border: 0 !important; }
.dk-rev .ti-widget .ti-widget-container .ti-review-item > .ti-inner { background: linear-gradient(180deg, #132538, #0e1d2c) !important; box-shadow: inset 0 0 0 1px var(--dk-edge), 0 24px 50px -28px rgba(0,0,0,.9) !important; transition: box-shadow .3s, transform .3s var(--dk-ease); }
.dk-rev .ti-widget .ti-widget-container .ti-review-item > .ti-inner:hover { transform: translateY(-4px); box-shadow: inset 0 0 0 1px rgba(37,208,58,.5), 0 30px 60px -28px rgba(0,0,0,.9) !important; }
.dk-rev .ti-widget .ti-widget-container .ti-name, .dk-rev .ti-widget .ti-widget-container .ti-header-rating-text, .dk-rev .ti-widget .ti-widget-container .ti-header-rating-text * , .dk-rev .ti-widget .ti-widget-container .ti-rating-text { color: var(--dk-text) !important; }
.dk-rev .ti-widget .ti-widget-container .ti-review-content, .dk-rev .ti-widget .ti-widget-container .ti-review-text-container, .dk-rev .ti-widget .ti-widget-container .ti-review-text-container * { color: var(--dk-soft-2) !important; }
.dk-rev .ti-widget .ti-widget-container .ti-date, .dk-rev .ti-widget .ti-widget-container .ti-read-more, .dk-rev .ti-widget .ti-widget-container .ti-read-more span { color: #8fa3b1 !important; }
.dk-rev .ti-widget .ti-widget-container .ti-header-logo-img { filter: brightness(0) invert(1); opacity: .95; }
/* ---------- End homepage sections ---------- */

.dk-skip { position: absolute; left: 12px; top: -60px; z-index: 100; padding: 12px 18px; border-radius: 10px; background: var(--dk-green); color: #06120b; font-weight: 700; text-decoration: none; transition: top .2s; }
.dk-skip:focus { top: 12px; }
.dk-hdr__tel b { font-weight: 400; }
.dk-mega__foot a { text-decoration: none; }
.dk-mega small { margin-top: 2px; }
.dk-faq details p a { color: var(--dk-green-2); }
.dk-rev .ti-widget { color: initial; }
/* Gutenberg blocks inside a dark page (paragraphs added by editors) stay readable */
.tlc-dark .dk-canvas > p, .tlc-dark .dk-canvas > h2, .tlc-dark .dk-canvas > ul { max-width: var(--dk-max); margin-inline: auto; padding-inline: var(--dk-gut); }
/* Editor: each dark section previews on its own navy ground */
.editor-styles-wrapper .dk-root { background: var(--dk-bg); color: var(--dk-text); font-family: var(--dk-font); }
.editor-styles-wrapper .dk-reveal, .editor-styles-wrapper .dk-rise { opacity: 1; transform: none; filter: none; }

/* Logged-in editors: the header and phone menu sit below the WordPress toolbar */
.admin-bar .dk-hdr { top: 32px; }
@media (max-width: 782px) { .admin-bar .dk-hdr { top: 46px; } }
@media (max-width: 600px) { .admin-bar .dk-hdr { top: 0; } }

/* Steps with a landscape frame: for smaller photographs, so they are not enlarged past their resolution */
@media (min-width: 901px) {
  .dk-visit--wide .dk-visit__grid { grid-template-columns: 1fr 1.05fr; align-items: start; }
  .dk-visit--wide .dk-visit__stage { aspect-ratio: 4 / 3; top: 110px; max-width: 560px; }
}
.dk-visit--wide .dk-visit__stage img.dk-on { animation: none; }

/* Google reviews: cards fit their text (about four lines) instead of Trustindex's fixed eight-line box; Read more opens the rest */
.dk-rev .ti-widget[data-layout-id][data-set-id] .ti-review-item .ti-review-content { height: auto !important; max-height: none; -webkit-line-clamp: 4; }
.dk-rev .ti-widget[data-layout-id][data-set-id] .ti-review-item > .ti-inner { height: 100% !important; }
.dk-rev .ti-widget[data-layout-id][data-set-id] .ti-review-item.dk-open .ti-review-content { -webkit-line-clamp: unset; display: block; }

/* Step photographs on tablets and phones stay a sensible size */
@media (max-width: 900px) { .dk-visit__thumb { width: 100%; max-width: 460px; height: auto; } }

/* A secondary button that still stands out: green edge and glow (business signpost) */
.dk-btn.dk-btn--outline { background: rgba(37,208,58,.12); color: var(--dk-text); box-shadow: inset 0 0 0 1.5px var(--dk-green), 0 0 28px -8px rgba(37,208,58,.7); }
.dk-btn.dk-btn--outline::after { display: none; }
.dk-btn.dk-btn--outline svg { color: var(--dk-green); }
.dk-btn.dk-btn--outline:hover { background: var(--dk-green); color: #06120b; box-shadow: 0 18px 40px -12px rgba(37,208,58,.9); }
.dk-btn.dk-btn--outline:hover svg { color: #06120b; }

/* Before and after with only one or two jobs: thumbnails stay landscape instead of stretching */
.dk-ba__thumbs:not(:has(> :nth-child(3))) { grid-template-columns: 1fr 1fr; flex: none; }
.dk-ba__thumbs:not(:has(> :nth-child(3))) button { min-height: 0; aspect-ratio: 4 / 3; }

/* Before and after with a single job: the photograph takes the full width and the caption sits beneath it as a slim line */
.dk-ba-wrap:not(:has(.dk-ba__thumbs)) { grid-template-columns: 1fr; max-width: 980px; margin-inline: auto; }
.dk-ba-wrap:not(:has(.dk-ba__thumbs)) .dk-ba { aspect-ratio: 16 / 10; }
.dk-ba-wrap:not(:has(.dk-ba__thumbs)) .dk-ba__side { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 24px; padding: 16px 22px; border-radius: 14px; }
.dk-ba-wrap:not(:has(.dk-ba__thumbs)) .dk-ba__caption { max-width: 80ch; line-height: 1.6; }
.dk-ba-wrap:not(:has(.dk-ba__thumbs)) .dk-ba__caption b { display: inline; margin-right: 6px; font-size: 1.05rem; }

/* Editors' review notes (signed-in only) on dark pages */
.tlc-dark .tlc-review-note { max-width: var(--dk-max); margin: 0 auto 24px; padding: 18px 22px; border-radius: 12px; background: rgba(246,176,44,.1); box-shadow: inset 0 0 0 1px rgba(246,176,44,.5); color: #f6dca0; font-size: 14px; }
.tlc-dark .tlc-review-note strong { display: block; margin-bottom: 4px; color: #f6b02c; }
.tlc-dark .tlc-review-note p { margin: 0; }

/* ---------- Areas we cover: map with homes and businesses views ---------- */
.dk-h3 { margin: 0; font-weight: 700; letter-spacing: -.025em; line-height: 1.1; font-size: clamp(1.5rem, 1.15rem + 1.3vw, 2.2rem); }
.dk-cover__tabs { display: inline-flex; gap: 6px; padding: 6px; margin: 0 0 28px; border-radius: 14px; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 1px var(--dk-edge); }
.dk-cover__tabs button { display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 20px; border: 0; border-radius: 10px; background: transparent; color: var(--dk-soft-2); font: inherit; font-weight: 700; font-size: 15px; cursor: pointer; transition: background .3s var(--dk-ease), color .3s var(--dk-ease); }
.dk-cover__tabs button svg { width: 20px; height: 20px; }
.dk-cover__tabs button[aria-selected="true"] { background: var(--dk-green); color: #06120b; box-shadow: 0 10px 30px -12px rgba(37,208,58,.8); }
.dk-cover__tabs button:not([aria-selected="true"]):hover { background: rgba(255,255,255,.06); color: #fff; }
.dk-cover__tabs button:focus-visible { outline: 2px solid var(--dk-green-2); outline-offset: 2px; }
.dk-cover__panel[hidden] { display: none; }
.dk-cover__panel + .dk-cover__panel { margin-top: 48px; }
.dk-js .dk-cover__panel + .dk-cover__panel { margin-top: 0; }
.dk-js .dk-cover__panel:not([hidden]) { animation: dk-panel-in .6s var(--dk-ease); }
@keyframes dk-panel-in { from { opacity: 0; transform: translateY(14px); } }
.dk-cover__grid { display: grid; grid-template-columns: 1.08fr 1fr; gap: clamp(28px, 4.5vw, 72px); align-items: center; }
.dk-cover__map { position: relative; overflow: hidden; padding: clamp(14px, 2vw, 26px); border-radius: 24px; background: radial-gradient(120% 90% at 70% 40%, rgba(37,208,58,.10), transparent 60%), linear-gradient(180deg, #0f2031, #0b1724); box-shadow: inset 0 0 0 1px var(--dk-edge), 0 40px 80px -40px rgba(0,0,0,.85); }
.dk-cmap { display: block; width: 100%; height: auto; overflow: visible; }
.dk-cmap--uk { max-height: 620px; margin-inline: auto; }
/* Counties */
.dk-cty { stroke: rgba(255,255,255,.18); stroke-width: 1; vector-effect: non-scaling-stroke; transition: fill .4s; }
.dk-cty--home { fill: rgba(37,208,58,.16); stroke: rgba(37,208,58,.7); stroke-width: 1.6; }
.dk-cty--grow { fill: url(#dk-hatch); stroke-dasharray: 4 3; }
.dk-cty__name { font: 700 7.5px var(--dk-font); letter-spacing: .14em; text-transform: uppercase; fill: rgba(199,212,220,.55); }
.dk-cty__name--home { fill: rgba(127,240,139,.55); }
/* Pins */
.dk-pin { cursor: pointer; outline: none; }
.dk-pin__hit { fill: transparent; }
.dk-pin__dot { fill: var(--dk-green); stroke: #0a1520; stroke-width: 1.2; transition: transform .3s var(--dk-ease); transform-box: fill-box; transform-origin: center; }
.dk-pin text { font: 700 7px var(--dk-font); fill: #e7eef2; paint-order: stroke; stroke: #0b1724; stroke-width: 2.4px; stroke-linejoin: round; transition: fill .3s; pointer-events: none; }
.dk-pin--base text { font-size: 8.5px; fill: #fff; }
.dk-pin__pulse { fill: none; stroke: var(--dk-green); stroke-width: 1.4; transform-box: fill-box; transform-origin: center; animation: dk-ping 2.4s ease-out infinite; }
@keyframes dk-ping { from { transform: scale(.6); opacity: .9; } to { transform: scale(3.2); opacity: 0; } }
.dk-pin:hover .dk-pin__dot, .dk-pin:focus-visible .dk-pin__dot, .dk-pin.dk-on .dk-pin__dot { transform: scale(1.7); fill: var(--dk-green-2); }
.dk-pin:hover text, .dk-pin:focus-visible text, .dk-pin.dk-on text { fill: var(--dk-green-2); }
.dk-js .dk-cover__map .dk-pin { opacity: 0; transition: opacity .5s var(--dk-ease); transition-delay: var(--dk-d, 0s); }
.dk-js .dk-cover__map.dk-in .dk-pin { opacity: 1; }
/* Key */
.dk-cover__key { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 12px 4px 0; padding: 0; list-style: none; font-size: 13px; color: var(--dk-soft); }
.dk-cover__key li { display: inline-flex; align-items: center; gap: 8px; }
.dk-cover__key i { width: 14px; height: 14px; border-radius: 4px; }
.dk-cover__key .dk-key--rounds { width: 10px; height: 10px; border-radius: 50%; background: var(--dk-green); box-shadow: 0 0 0 3px rgba(37,208,58,.25); }
.dk-key--home { background: rgba(37,208,58,.25); box-shadow: inset 0 0 0 1.5px rgba(37,208,58,.8); }
.dk-key--grow { background: repeating-linear-gradient(45deg, #13263a 0 3px, rgba(37,208,58,.35) 3px 5px); box-shadow: inset 0 0 0 1px rgba(255,255,255,.25); }
/* Copy, finder and town groups */
.dk-cover__text { margin: 14px 0 0; line-height: 1.6; color: var(--dk-soft); }
.dk-finder { margin: 24px 0 0; }
.dk-finder label { display: block; margin: 0 0 8px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--dk-green-2); }
.dk-finder__box { position: relative; }
.dk-finder__box svg { position: absolute; left: 16px; top: 50%; width: 20px; height: 20px; transform: translateY(-50%); color: var(--dk-green); pointer-events: none; }
.dk-finder input { width: 100%; min-height: 56px; padding: 0 18px 0 46px; border: 0; border-radius: 12px; background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 1px var(--dk-edge-2); color: #fff; font: inherit; font-size: 16px; transition: box-shadow .25s; }
.dk-finder input::placeholder { color: rgba(199,212,220,.6); }
.dk-finder input:focus { outline: none; box-shadow: inset 0 0 0 2px var(--dk-green), 0 0 0 4px rgba(37,208,58,.15); }
.dk-finder__result { min-height: 1.5em; margin: 10px 0 0; font-size: 15px; line-height: 1.5; color: var(--dk-soft-2); }
.dk-finder__result.dk-yes { color: var(--dk-green-2); }
.dk-cover__group { margin: 18px 0 0; }
.dk-cover__group p { margin: 0 0 8px; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--dk-soft); }
.dk-cover__group > div { display: flex; flex-wrap: wrap; gap: 8px; }
.dk-town { min-height: 38px; padding: 0 14px; border: 0; border-radius: 99px; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 1px var(--dk-edge-2); color: var(--dk-text); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; transition: background .25s, box-shadow .25s, color .25s, transform .25s var(--dk-ease); }
.dk-town:hover, .dk-town:focus-visible, .dk-town.dk-on { outline: none; background: rgba(37,208,58,.14); box-shadow: inset 0 0 0 1px rgba(37,208,58,.7); color: var(--dk-green-2); transform: translateY(-2px); }
.dk-town[disabled] { opacity: .5; cursor: default; }
.dk-cover__note { display: flex; gap: 12px; margin: 24px 0 0; padding: 14px 16px; border-radius: 12px; background: rgba(37,208,58,.07); box-shadow: inset 0 0 0 1px rgba(37,208,58,.25); font-size: 15px; line-height: 1.55; color: var(--dk-soft-2); }
.dk-cover__note svg { flex: none; width: 20px; height: 20px; margin-top: 2px; color: var(--dk-green); }
.dk-cover__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 26px; margin-top: 28px; }
/* UK map */
.dk-uk__ie { fill: rgba(255,255,255,.035); stroke: rgba(255,255,255,.1); stroke-width: .6; }
.dk-uk__gb { fill: #13263a; }
.dk-uk__edge { fill: none; stroke: rgba(37,208,58,.55); stroke-width: .9; }
.dk-uk__ring { fill: none; stroke: rgba(127,240,139,.6); stroke-width: 1.5; vector-effect: non-scaling-stroke; transform-box: fill-box; transform-origin: center; animation: dk-wave 5.6s cubic-bezier(.2,.6,.3,1) infinite; opacity: 0; }
@keyframes dk-wave { 0% { transform: scale(.2); opacity: .9; } 100% { transform: scale(13); opacity: 0; } }
.dk-uk__base { fill: var(--dk-green-2); stroke: #0a1520; stroke-width: 1.2; }
.dk-uk__pulse { fill: none; stroke: var(--dk-green); stroke-width: 1.4; transform-box: fill-box; transform-origin: center; animation: dk-ping 2.4s ease-out infinite; }
.dk-uk__label { font: 700 10px var(--dk-font); fill: #fff; paint-order: stroke; stroke: #0b1724; stroke-width: 3px; }
.dk-cover__chip { position: absolute; left: 22px; top: 22px; display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px 10px 12px; border-radius: 99px; background: rgba(10,21,32,.75); backdrop-filter: blur(10px); box-shadow: inset 0 0 0 1px rgba(37,208,58,.4); font-size: 14px; font-weight: 700; animation: dk-bob 6s ease-in-out infinite; }
.dk-cover__chip svg { width: 18px; height: 18px; color: var(--dk-green); }
@media (max-width: 900px) {
  .dk-cover__grid { grid-template-columns: 1fr; }
  .dk-cover__tabs { display: flex; }
  .dk-cover__tabs button { flex: 1; justify-content: center; padding: 0 12px; }
  .dk-cmap--uk { max-height: 460px; }
}
@media (prefers-reduced-motion: reduce) { .dk-uk__ring, .dk-uk__pulse, .dk-pin__pulse, .dk-cover__chip { animation: none; } .dk-uk__ring { display: none; } }

/* Sections that follow the coverage map's homes or businesses tab */
[data-dk-audience][hidden] { display: none; }
/* Closing block without related links: the quote card spans the full width */
.dk-bento--solo { grid-template-columns: 1fr; }

/* ---------- Legal pages: privacy policy and terms of business ---------- */
.dk-legal { padding-top: calc(var(--dk-sec) + 90px); background: radial-gradient(70% 50% at 85% 0%, rgba(37,208,58,.10), transparent 70%); }
.dk-h1 { margin: 0; font-weight: 700; letter-spacing: -.04em; line-height: 1.02; font-size: clamp(2.4rem, 1.5rem + 3.6vw, 4.4rem); }
.dk-legal__head { max-width: 820px; margin-bottom: clamp(36px, 5vw, 64px); }
.dk-legal__updated { display: inline-flex; align-items: center; gap: 8px; margin: 18px 0 0; padding: 6px 12px; border-radius: 99px; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 1px var(--dk-edge); font-size: 14px; color: var(--dk-soft-2); }
.dk-legal__updated svg { width: 16px; height: 16px; color: var(--dk-green); }
.dk-legal__intro { margin-top: 22px; font-size: clamp(1.02rem, .97rem + .25vw, 1.15rem); line-height: 1.65; color: var(--dk-soft); }
.dk-legal__intro p { margin: 0 0 12px; }
.dk-legal__grid { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.dk-legal__toc { position: sticky; top: 104px; padding: 20px; border-radius: 18px; background: rgba(255,255,255,.03); box-shadow: inset 0 0 0 1px var(--dk-edge); max-height: calc(100vh - 130px); overflow: auto; }
.dk-legal__toc > p { margin: 0 0 12px; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--dk-green-2); }
.dk-legal__toc ol { margin: 0; padding: 0; list-style: none; display: grid; gap: 2px; }
.dk-legal__toc a { display: flex; gap: 10px; padding: 8px 10px; border-radius: 10px; color: var(--dk-soft-2); font-size: 14px; line-height: 1.35; text-decoration: none; transition: background .2s, color .2s; }
.dk-legal__toc a span { flex: none; min-width: 20px; color: var(--dk-green); font-weight: 700; font-variant-numeric: tabular-nums; }
.dk-legal__toc a:hover, .dk-legal__toc a:focus-visible, .dk-legal__toc a.dk-on { outline: none; background: rgba(37,208,58,.10); color: #fff; }
.dk-legal__body { max-width: 760px; }
.dk-legal__sec { padding: 0 0 34px; margin: 0 0 34px; border-bottom: 1px solid var(--dk-edge); }
.dk-legal__sec h2 { display: flex; align-items: baseline; gap: 14px; margin: 0 0 16px; font-size: clamp(1.3rem, 1.1rem + .7vw, 1.65rem); letter-spacing: -.02em; line-height: 1.2; }
.dk-legal__sec h2 span { flex: none; display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: rgba(37,208,58,.12); box-shadow: inset 0 0 0 1px rgba(37,208,58,.4); color: var(--dk-green-2); font-size: 15px; font-variant-numeric: tabular-nums; transform: translateY(-3px); }
.dk-legal__text { color: var(--dk-soft-2); font-size: 16px; line-height: 1.7; }
.dk-legal__text p { margin: 0 0 14px; }
.dk-legal__text ul, .dk-legal__text ol { margin: 0 0 16px; padding-left: 0; list-style: none; display: grid; gap: 6px; }
.dk-legal__text li { position: relative; padding-left: 22px; }
.dk-legal__text ul li::before { content: ""; position: absolute; left: 4px; top: .7em; width: 7px; height: 7px; border-radius: 50%; background: var(--dk-green); }
.dk-legal__text ol { counter-reset: dk-li; }
.dk-legal__text ol li::before { counter-increment: dk-li; content: counter(dk-li) "."; position: absolute; left: 0; color: var(--dk-green); font-weight: 700; }
.dk-legal__text a, .dk-legal__intro a, .dk-legal__outro a { color: var(--dk-green-2); text-decoration: underline; text-underline-offset: 3px; }
.dk-legal__text strong, .dk-legal__intro strong { color: #fff; }
.dk-legal__outro { display: flex; gap: 16px; padding: 22px 24px; border-radius: 16px; background: linear-gradient(160deg, rgba(37,208,58,.12), rgba(255,255,255,.02) 60%); box-shadow: inset 0 0 0 1px rgba(37,208,58,.35); color: var(--dk-soft-2); line-height: 1.6; }
.dk-legal__outro > svg { flex: none; width: 24px; height: 24px; margin-top: 2px; color: var(--dk-green); }
.dk-legal__outro p { margin: 0; }
.dk-legal__outro .dk-legal__call { margin-top: 10px; font-weight: 700; }
@media (max-width: 900px) {
  .dk-legal__grid { grid-template-columns: 1fr; }
  .dk-legal__toc { position: static; max-height: none; }
  .dk-legal__toc ol { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) { .dk-legal__toc ol { grid-template-columns: 1fr; } }
@media print {
  .dk-hdr, .dk-ftr, .dk-legal__toc { display: none !important; }
  .dk-legal, .dk-legal * { color: #000 !important; background: none !important; box-shadow: none !important; }
  .dk-legal { padding-top: 0; }
  .dk-legal__grid { display: block; }
}

/* Legal pages as expandable panels (the outro and intro styles above still apply) */
.dk-legal--panels .dk-legal__head, .dk-legal--panels .dk-legal__panels, .dk-legal--panels .dk-legal__outro { max-width: 900px; }
.dk-legal__bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 12px; }
.dk-legal__bar p { margin: 0; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--dk-green-2); }
.dk-legal__all { min-height: 40px; padding: 0 16px; border: 0; border-radius: 99px; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 1px var(--dk-edge-2); color: #fff; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; transition: background .2s, box-shadow .2s; }
.dk-legal__all:hover, .dk-legal__all:focus-visible { outline: none; background: rgba(37,208,58,.12); box-shadow: inset 0 0 0 1px rgba(37,208,58,.6); }
.dk-legal__item { margin: 0 0 10px; border-radius: 16px; background: rgba(255,255,255,.03); box-shadow: inset 0 0 0 1px var(--dk-edge); transition: background .3s, box-shadow .3s; scroll-margin-top: 110px; }
.dk-legal__item:hover { background: rgba(255,255,255,.045); }
.dk-legal__item[open] { background: linear-gradient(160deg, rgba(37,208,58,.07), rgba(255,255,255,.03) 50%); box-shadow: inset 0 0 0 1px rgba(37,208,58,.35); }
.dk-legal__item summary { display: flex; align-items: center; gap: 14px; padding: 16px 18px; cursor: pointer; list-style: none; border-radius: 16px; }
.dk-legal__item summary::-webkit-details-marker { display: none; }
.dk-legal__item summary:focus-visible { outline: 2px solid var(--dk-green-2); outline-offset: 2px; }
.dk-legal__item summary h2 { flex: 1; margin: 0; font-size: clamp(1.05rem, 1rem + .35vw, 1.25rem); letter-spacing: -.01em; line-height: 1.3; color: #fff; }
.dk-legal__num { flex: none; display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: rgba(37,208,58,.12); box-shadow: inset 0 0 0 1px rgba(37,208,58,.4); color: var(--dk-green-2); font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; }
.dk-legal__chev { flex: none; width: 22px; height: 22px; fill: none; stroke: var(--dk-green-2); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .3s var(--dk-ease); }
.dk-legal__item[open] .dk-legal__chev { transform: rotate(180deg); }
.dk-legal__item .dk-legal__text { padding: 2px 22px 20px 66px; }
.dk-legal__item[open] .dk-legal__text { animation: dk-panel-in .45s var(--dk-ease); }
.dk-legal--panels .dk-legal__outro { margin-top: 24px; }
@media (max-width: 600px) { .dk-legal__item .dk-legal__text { padding: 0 18px 18px; } .dk-legal__item summary { padding: 14px; gap: 12px; } }
@media print { .dk-legal__bar { display: none !important; } .dk-legal__item .dk-legal__text { padding: 0 0 12px; } .dk-legal__chev { display: none; } }

/* ---------- Cookie banner (Complianz) on the dark design ----------
   Look only: colours, corners and shadows. Wording, buttons, categories and consent behaviour all stay
   as configured in Complianz. Complianz styles its banner through these variables, so overriding them on
   the banner itself (dark pages only) reskins it without touching its settings. */
body.tlc-dark .cmplz-cookiebanner {
  --cmplz_banner_background_color: #0f2031;
  --cmplz_banner_border_color: rgba(255,255,255,.12);
  --cmplz_banner_border_width: 1px 1px 1px 1px;
  --cmplz_banner_border_radius: 18px 18px 18px 18px;
  --cmplz_text_color: #dbe6ec;
  --cmplz_hyperlink_color: #7ff08b;
  --cmplz_button_border_radius: 10px 10px 10px 10px;
  --cmplz_button_accept_background_color: #25d03a;
  --cmplz_button_accept_border_color: #25d03a;
  --cmplz_button_accept_text_color: #06120b;
  --cmplz_button_deny_background_color: rgba(255,255,255,.06);
  --cmplz_button_deny_border_color: rgba(255,255,255,.22);
  --cmplz_button_deny_text_color: #f2f6f8;
  --cmplz_button_settings_background_color: rgba(255,255,255,.06);
  --cmplz_button_settings_border_color: rgba(255,255,255,.22);
  --cmplz_button_settings_text_color: #f2f6f8;
  --cmplz_slider_active_color: #25d03a;
  --cmplz_slider_inactive_color: #5a7488;
  --cmplz_slider_bullet_color: #ffffff;
  --cmplz_category_header_always_active_color: #7ff08b;
  background-image: radial-gradient(120% 80% at 100% 0%, rgba(37,208,58,.10), transparent 60%);
  box-shadow: 0 30px 70px -20px rgba(0,0,0,.85), 0 0 0 1px rgba(37,208,58,.18) !important;
  font-family: var(--dk-font);
}
body.tlc-dark .cmplz-cookiebanner.cmplz-show:hover { box-shadow: 0 34px 80px -20px rgba(0,0,0,.9), 0 0 0 1px rgba(37,208,58,.3) !important; }
body.tlc-dark .cmplz-cookiebanner .cmplz-title { color: #fff; font-weight: 700; }
body.tlc-dark .cmplz-cookiebanner .cmplz-btn { font-weight: 700; transition: transform .2s, background-color .2s, border-color .2s; }
body.tlc-dark .cmplz-cookiebanner .cmplz-btn:hover { transform: translateY(-1px); }
body.tlc-dark .cmplz-cookiebanner .cmplz-btn.cmplz-accept { box-shadow: 0 10px 26px -12px rgba(37,208,58,.9); }
body.tlc-dark .cmplz-cookiebanner .cmplz-btn.cmplz-deny:hover,
body.tlc-dark .cmplz-cookiebanner .cmplz-btn.cmplz-view-preferences:hover,
body.tlc-dark .cmplz-cookiebanner .cmplz-btn.cmplz-save-preferences:hover { border-color: rgba(37,208,58,.6); }
body.tlc-dark .cmplz-cookiebanner .cmplz-btn:focus-visible,
body.tlc-dark .cmplz-cookiebanner .cmplz-close:focus-visible,
body.tlc-dark .cmplz-cookiebanner a:focus-visible { outline: 2px solid #7ff08b; outline-offset: 2px; }
body.tlc-dark .cmplz-cookiebanner .cmplz-categories .cmplz-category { background-color: rgba(255,255,255,.05); box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); }
body.tlc-dark .cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-category-title { color: #fff; }
body.tlc-dark .cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-description { color: #b8c8d2; }
body.tlc-dark .cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-icon.cmplz-open { filter: invert(1); }
body.tlc-dark .cmplz-cookiebanner .cmplz-links .cmplz-link { text-underline-offset: 3px; }
body.tlc-dark .cmplz-cookiebanner .cmplz-body::-webkit-scrollbar-thumb { background-color: rgba(255,255,255,.2); }

/* ---------- Plain pages on the dark design (for example the Complianz Cookie Policy) ----------
   index.php wraps their content in the legal layout; the document itself is generated by Complianz and
   only restyled here. */
.dk-doc .dk-legal__head { margin-bottom: clamp(24px, 3vw, 40px); }
.dk-doc__body { max-width: 860px; }
.dk-doc__body h2 { margin: 40px 0 14px; padding-top: 28px; border-top: 1px solid var(--dk-edge); color: #fff; font-size: clamp(1.3rem, 1.1rem + .7vw, 1.65rem); letter-spacing: -.02em; line-height: 1.2; }
.dk-doc__body h2:first-child, .dk-doc__body .cmplz-document > h2:first-of-type { margin-top: 24px; }
.dk-doc__body h3 { margin: 26px 0 10px; color: #fff; font-size: 1.15rem; }
.dk-doc__body h4, .dk-doc__body h5 { margin: 18px 0 8px; color: var(--dk-green-2); font-size: 1rem; }
.dk-doc__body p, .dk-doc__body li, .dk-doc__body div, .dk-doc__body span { color: inherit; }
.dk-doc__body .cmplz-document { color: var(--dk-soft-2); font-size: 16px; line-height: 1.7; }
.dk-doc__body .cmplz-document p { margin: 0 0 14px; }
.dk-doc__body .cmplz-document a { color: var(--dk-green-2); text-decoration: underline; text-underline-offset: 3px; }
/* Expandable cookie lists */
.dk-doc__body .cmplz-dropdown { margin: 0 0 10px; border: 0; border-radius: 14px; background: rgba(255,255,255,.035) !important; box-shadow: inset 0 0 0 1px var(--dk-edge); overflow: hidden; }
.dk-doc__body .cmplz-dropdown summary { padding: 14px 18px !important; background: transparent !important; color: #fff; cursor: pointer; list-style-position: inside; }
.dk-doc__body .cmplz-dropdown summary:hover { background: rgba(37,208,58,.08) !important; }
.dk-doc__body .cmplz-dropdown[open] summary { border-bottom: 1px solid var(--dk-edge); }
.dk-doc__body .cmplz-dropdown summary h3, .dk-doc__body .cmplz-dropdown summary p { margin: 0; color: #fff !important; }
.dk-doc__body .cmplz-dropdown > div, .dk-doc__body .cmplz-service-description, .dk-doc__body .cmplz-sharing-data { padding: 4px 18px 14px; }
.dk-doc__body .cookies-per-purpose { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 10px 0 0; border-radius: 10px; overflow: hidden; box-shadow: inset 0 0 0 1px var(--dk-edge); background: transparent !important; }
.dk-doc__body .cookies-per-purpose div { padding: 8px 10px; border-bottom: 1px solid var(--dk-edge); background: transparent !important; color: var(--dk-soft-2) !important; font-size: 14px; word-break: break-word; }
.dk-doc__body .cookies-per-purpose .purpose h4, .dk-doc__body .cookies-per-purpose div:nth-child(-n+4) { color: #fff !important; }
.dk-doc__body .cmplz-service-header { color: #fff; }
/* Consent settings that Complianz fills in on this page */
.dk-doc__body .cmplz-manage-consent-container { margin: 10px 0 20px; padding: 18px; border-radius: 16px; background: rgba(255,255,255,.035); box-shadow: inset 0 0 0 1px rgba(37,208,58,.3); }
.dk-doc__body .cmplz-manage-consent-container:empty { display: none; }
.dk-doc__body .cmplz-manage-consent-container .cmplz-categories .cmplz-category { background: rgba(255,255,255,.05) !important; }
.dk-doc__body .cmplz-manage-consent-container .cmplz-btn.cmplz-accept { background: var(--dk-green) !important; border-color: var(--dk-green) !important; color: #06120b !important; }
.dk-doc__body .cmplz-manage-consent-container .cmplz-btn:not(.cmplz-accept) { background: rgba(255,255,255,.06) !important; border-color: rgba(255,255,255,.22) !important; color: #fff !important; }
#cmplz-manage-consent-container-nojavascript { display: none; }
@media (max-width: 700px) { .dk-doc__body .cookies-per-purpose { grid-template-columns: 1fr 1fr; } }

/* ---------- Copia Leads quote pop-up on the dark design ----------
   Look only: Copia styles its form through colour variables, so these overrides (dark pages only)
   reskin it without changing its questions, steps, fields or how it sends leads. The brand variables are
   set inline by Copia, hence !important on those four. */
body.tlc-dark .cl {
  --paper: #0b1724; --surface: #10202f; --ink: #f2f6f8; --muted: #a9bac6; --field: #0d1b29;
  --line: rgba(255,255,255,.12); --line-strong: rgba(255,255,255,.24);
  --warn: #f6c46a; --warn-soft: rgba(246,196,106,.12); --bad: #ff8a80; --bad-soft: rgba(255,138,128,.12);
  --brand: #25d03a !important; --brand-soft: rgba(37,208,58,.14);
  --btn-bg: #25d03a !important; --btn-text: #06120b !important; --on-brand: #06120b;
  --font-body: var(--dk-font) !important; --font-display: var(--dk-font) !important;
  color: var(--ink);
}
body.tlc-dark .copia-leads-dialog { background: #0b1724; color: #f2f6f8; border-radius: 22px; box-shadow: 0 40px 100px -30px rgba(0,0,0,.9), 0 0 0 1px rgba(37,208,58,.25); background-image: radial-gradient(90% 60% at 100% 0%, rgba(37,208,58,.10), transparent 60%); }
body.tlc-dark .copia-leads-dialog::backdrop { background: rgba(4,10,16,.72); backdrop-filter: blur(6px); }
body.tlc-dark .copia-leads-dialog__bar { background: transparent; border-bottom-color: rgba(255,255,255,.1); padding: 12px 12px 12px 22px; }
body.tlc-dark .copia-leads-dialog__title { color: #fff; font-family: var(--dk-font); font-weight: 700; font-size: 16px; }
body.tlc-dark .copia-leads-dialog__close { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.2); color: #fff; font-family: var(--dk-font); font-weight: 700; transition: background .2s, border-color .2s; }
body.tlc-dark .copia-leads-dialog__close:hover { background: rgba(255,255,255,.1); border-color: rgba(37,208,58,.6); }
body.tlc-dark .copia-leads-dialog__close:focus-visible { outline-color: #7ff08b; }
body.tlc-dark .copia-leads-dialog__body::-webkit-scrollbar { width: 10px; }
body.tlc-dark .copia-leads-dialog__body::-webkit-scrollbar-thumb { background: rgba(255,255,255,.18); border-radius: 10px; border: 3px solid #0b1724; }
/* Card, brand bar and progress */
body.tlc-dark .cl .card { background: var(--surface); border-color: var(--line); box-shadow: inset 0 0 0 1px rgba(255,255,255,.04); }
body.tlc-dark .cl .brandbar { border-bottom-color: var(--line); }
body.tlc-dark .cl .brandbar .right { color: var(--muted); }
body.tlc-dark .cl .prog li { background: rgba(255,255,255,.12); }
body.tlc-dark .cl .prog li.now, body.tlc-dark .cl .prog li.done { background: #25d03a; }
/* Inputs and choices */
body.tlc-dark .cl input, body.tlc-dark .cl textarea, body.tlc-dark .cl select { background: var(--field); color: var(--ink); border-color: var(--line-strong); }
body.tlc-dark .cl input::placeholder, body.tlc-dark .cl textarea::placeholder { color: rgba(169,186,198,.7); }
body.tlc-dark .cl input:focus, body.tlc-dark .cl textarea:focus, body.tlc-dark .cl select:focus { border-color: #25d03a; box-shadow: 0 0 0 3px rgba(37,208,58,.2); outline: none; }
body.tlc-dark .cl .svc, body.tlc-dark .cl .opt, body.tlc-dark .cl .chip { background: rgba(255,255,255,.03); border-color: var(--line-strong); color: var(--ink); }
body.tlc-dark .cl .svc:hover, body.tlc-dark .cl .opt:hover { border-color: rgba(37,208,58,.6); }
body.tlc-dark .cl .svc[aria-pressed="true"], body.tlc-dark .cl .opt[aria-pressed="true"] { background: rgba(37,208,58,.10); border-color: #25d03a; }
body.tlc-dark .cl .svc-ic { background: rgba(37,208,58,.12); color: #7ff08b; }
body.tlc-dark .cl .box { border-color: var(--line-strong); background: transparent; }
/* Question titles in TLC green and bold so they stand apart from the white answers on long commercial
   steps (owner, 9 November 2026). Colour and font only: Copia's layout is untouched. */
body.tlc-dark .cl .q-label { color: #7ff08b; font-weight: 700; font-size: 16px; }
body.tlc-dark .cl [aria-pressed="true"] .box { background: #25d03a; border-color: #25d03a; color: #06120b; }
/* Buttons */
body.tlc-dark .cl button.primary { font-weight: 700; box-shadow: 0 10px 28px -12px rgba(37,208,58,.85); }
body.tlc-dark .cl button.primary:disabled { opacity: .5; box-shadow: none; }
body.tlc-dark .cl button.secondary, body.tlc-dark .cl button.ghost { background: rgba(255,255,255,.06); color: #fff; border-color: rgba(255,255,255,.2); }
body.tlc-dark .cl a { color: #7ff08b; }

/* ---------- Contact page and Gravity Forms on the dark design ---------- */
.dk-contact { padding-top: calc(var(--dk-sec) + 90px); background: radial-gradient(70% 50% at 85% 0%, rgba(37,208,58,.10), transparent 70%); }
.dk-contact__head { max-width: 760px; margin-bottom: clamp(32px, 4vw, 52px); }
.dk-contact__grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
.dk-contact__form { padding: clamp(22px, 3vw, 36px); border-radius: 22px; background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02)); box-shadow: inset 0 0 0 1px var(--dk-edge), 0 40px 80px -40px rgba(0,0,0,.8); }
.dk-contact__note { margin: 8px 0 20px; color: var(--dk-soft); line-height: 1.6; }
.dk-contact__side { display: grid; gap: 16px; position: sticky; top: 104px; }
.dk-contact__card, .dk-contact__quote { padding: 24px; border-radius: 20px; background: rgba(255,255,255,.035); box-shadow: inset 0 0 0 1px var(--dk-edge); }
.dk-contact__card h2, .dk-contact__quote h2 { margin: 0 0 14px; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--dk-green-2); }
.dk-contact__tel { display: flex; align-items: center; gap: 14px; margin: 0 0 18px; color: #fff; text-decoration: none; }
.dk-contact__tel svg { flex: none; width: 46px; height: 46px; padding: 12px; border-radius: 12px; background: rgba(37,208,58,.12); box-shadow: inset 0 0 0 1px rgba(37,208,58,.4); color: var(--dk-green); }
.dk-contact__tel span { display: grid; font-size: 1.6rem; font-weight: 700; letter-spacing: -.01em; line-height: 1.1; }
.dk-contact__tel small { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--dk-soft); }
.dk-contact__card dl { display: grid; gap: 14px; margin: 0; padding-top: 16px; border-top: 1px solid var(--dk-edge); }
.dk-contact__card dt { font-size: 13px; font-weight: 700; color: var(--dk-soft); }
.dk-contact__card dd { margin: 2px 0 0; color: #e8eff3; line-height: 1.55; }
.dk-contact__card address { font-style: normal; }
.dk-contact__card a { color: var(--dk-green-2); }
.dk-contact__quote { background: linear-gradient(160deg, rgba(37,208,58,.14), rgba(255,255,255,.03) 60%); box-shadow: inset 0 0 0 1px rgba(37,208,58,.35); }
.dk-contact__quote p { margin: 0 0 18px; color: var(--dk-soft-2); line-height: 1.6; }
@media (max-width: 900px) { .dk-contact__grid { grid-template-columns: 1fr; } .dk-contact__side { position: static; } }
/* Gravity Forms on dark pages: labels, fields, errors and the button in the site's style */
body.tlc-dark .gform_wrapper { --gf-color-primary: #25d03a; --gf-color-primary-rgb: 37, 208, 58; --gf-color-primary-contrast: #06120b; --gf-ctrl-bg-color: #0d1b29; --gf-ctrl-border-color: rgba(255,255,255,.24); --gf-ctrl-color: #f2f6f8; --gf-ctrl-label-color-primary: #f2f6f8; --gf-ctrl-label-color-secondary: #a9bac6; --gf-ctrl-desc-color: #a9bac6; --gf-ctrl-placeholder-color: rgba(169,186,198,.7); --gf-color-danger: #ff8a80; --gf-ctrl-border-color-focus: #25d03a; --gf-ctrl-radius: 10px; --gf-font-family-base: var(--dk-font); color: #f2f6f8; font-family: var(--dk-font); }
body.tlc-dark .gform_wrapper .gfield_label, body.tlc-dark .gform_wrapper legend.gfield_label { color: #f2f6f8 !important; font-weight: 700; font-size: 15px; }
body.tlc-dark .gform_wrapper .gfield_required { color: var(--dk-green-2) !important; }
body.tlc-dark .gform_wrapper .gfield_description, body.tlc-dark .gform_wrapper .gfield_consent_description { color: var(--dk-soft) !important; }
body.tlc-dark .gform_wrapper .gfield_description a { color: var(--dk-green-2); }
body.tlc-dark .gform_wrapper input[type=text], body.tlc-dark .gform_wrapper input[type=email], body.tlc-dark .gform_wrapper input[type=tel], body.tlc-dark .gform_wrapper select, body.tlc-dark .gform_wrapper textarea { min-height: 52px; padding: 12px 14px !important; border: 0 !important; border-radius: 10px !important; background-color: #0d1b29 !important; box-shadow: inset 0 0 0 1px rgba(255,255,255,.24) !important; color: #f2f6f8 !important; font: inherit; font-size: 16px !important; }
body.tlc-dark .gform_wrapper select { background-image: linear-gradient(45deg, transparent 50%, #7ff08b 50%), linear-gradient(135deg, #7ff08b 50%, transparent 50%) !important; background-position: calc(100% - 20px) 50%, calc(100% - 14px) 50% !important; background-size: 6px 6px !important; background-repeat: no-repeat !important; appearance: none; padding-right: 40px !important; }
body.tlc-dark .gform_wrapper select option { background: #0d1b29; color: #f2f6f8; }
body.tlc-dark .gform_wrapper textarea { min-height: 150px; }
body.tlc-dark .gform_wrapper input:focus, body.tlc-dark .gform_wrapper select:focus, body.tlc-dark .gform_wrapper textarea:focus { outline: none !important; box-shadow: inset 0 0 0 2px #25d03a, 0 0 0 4px rgba(37,208,58,.15) !important; }
body.tlc-dark .gform_wrapper input::placeholder, body.tlc-dark .gform_wrapper textarea::placeholder { color: rgba(169,186,198,.7); }
body.tlc-dark .gform_wrapper .gfield--type-consent label, body.tlc-dark .gform_wrapper .gfield_consent_label { color: var(--dk-soft-2) !important; font-size: 14px; line-height: 1.5; }
body.tlc-dark .gform_wrapper input[type=checkbox] { accent-color: #25d03a; width: 18px; height: 18px; }
body.tlc-dark .gform_wrapper .gform_footer { margin-top: 8px; padding: 0; }
body.tlc-dark .gform_wrapper .gform_button, body.tlc-dark .gform_wrapper input[type=submit] { min-height: 54px; padding: 0 28px !important; border: 0 !important; border-radius: 10px !important; background: var(--dk-green) !important; color: #06120b !important; font: 700 16px var(--dk-font) !important; cursor: pointer; box-shadow: 0 10px 30px -10px rgba(37,208,58,.7); transition: transform .2s; }
body.tlc-dark .gform_wrapper .gform_button:hover { transform: translateY(-1px); }
body.tlc-dark .gform_wrapper .gfield_error input, body.tlc-dark .gform_wrapper .gfield_error select, body.tlc-dark .gform_wrapper .gfield_error textarea { box-shadow: inset 0 0 0 2px #ff8a80 !important; }
body.tlc-dark .gform_wrapper .validation_message, body.tlc-dark .gform_wrapper .gfield_validation_message { background: transparent !important; border: 0 !important; padding: 6px 0 0 !important; color: #ff8a80 !important; font-size: 14px; }
body.tlc-dark .gform_wrapper .gform_validation_errors { border-radius: 12px; background: rgba(255,138,128,.1) !important; border: 1px solid rgba(255,138,128,.5) !important; box-shadow: none !important; }
body.tlc-dark .gform_wrapper .gform_validation_errors h2, body.tlc-dark .gform_wrapper .gform_validation_errors li, body.tlc-dark .gform_wrapper .gform_validation_errors a { color: #ffd2cd !important; }
body.tlc-dark .gform_confirmation_message { padding: 20px 22px; border-radius: 14px; background: rgba(37,208,58,.1); box-shadow: inset 0 0 0 1px rgba(37,208,58,.45); color: #e8f7ea; line-height: 1.6; }

/* ---------- Ad landing page: hero with the quote form open beside it ---------- */
.dk-lp { position: relative; overflow: hidden; }
.dk-lp__in { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 560px); gap: clamp(28px, 4vw, 64px); align-items: start; padding-top: 128px; padding-bottom: clamp(48px, 6vw, 88px); }
.dk-lp h1 { margin: 0; font-weight: 700; font-size: clamp(2.5rem, 1.5rem + 3.6vw, 4.6rem); letter-spacing: -.045em; line-height: .98; max-width: 12ch; }
.dk-lead .dk-lp { margin: 22px 0 0; max-width: 48ch; color: var(--dk-soft-2); }
.dk-lp__ticks { display: grid; gap: 10px; margin: 26px 0 0; padding: 0; list-style: none; }
.dk-lp__ticks li { display: flex; align-items: center; gap: 12px; color: #fff; font-weight: 700; }
.dk-lp__ticks svg { flex: none; width: 22px; height: 22px; padding: 3px; border-radius: 50%; background: rgba(37,208,58,.15); color: var(--dk-green); }
.dk-lp__proof { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-top: 30px; }
.dk-lp__rate { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px 9px 10px; border-radius: 12px; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 1px var(--dk-edge); font-size: 14px; color: var(--dk-soft-2); }
.dk-lp__rate .dk-g { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 6px; background: #fff; color: #4285f4; font-weight: 700; font-size: 14px; }
.dk-lp__rate b { color: #fff; font-size: 16px; }
.dk-lp__rate .dk-stars { color: #f6b02c; letter-spacing: 1px; }
.dk-lp__tel { display: inline-flex; align-items: center; gap: 12px; color: #fff; text-decoration: none; }
.dk-lp__tel svg { width: 42px; height: 42px; padding: 11px; border-radius: 12px; background: rgba(37,208,58,.12); box-shadow: inset 0 0 0 1px rgba(37,208,58,.4); color: var(--dk-green); }
.dk-lp__tel span { display: grid; font-size: 1.35rem; font-weight: 700; line-height: 1.15; }
.dk-lp__tel small { font-size: 12px; color: var(--dk-soft); font-weight: 700; }
.dk-lp__form { scroll-margin-top: 100px; padding: clamp(14px, 1.8vw, 20px); border-radius: 24px; background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)); box-shadow: inset 0 0 0 1px rgba(37,208,58,.35), 0 40px 90px -40px rgba(0,0,0,.9), 0 0 60px -20px rgba(37,208,58,.35); }
.dk-lp__formhead { margin: 4px 6px 12px; font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--dk-green-2); }
.dk-lp__form .copia-leads { scroll-margin-top: 100px; }
#get-quote { scroll-margin-top: 100px; }
@media (max-width: 999px) {
  .dk-lp__in { grid-template-columns: 1fr; padding-top: 104px; gap: 18px; }
  /* Phones: heading, then the form straight away; the rest of the copy follows */
  .dk-lp__copy { display: contents; }
  .dk-lp__copy > .dk-eyebrow { order: 1; margin-bottom: 0; }
  .dk-lp__copy > h1 { order: 2; font-size: clamp(2.1rem, 1.6rem + 3vw, 2.8rem); }
  .dk-lp__copy > .dk-lead { order: 3; margin-top: 0; font-size: 1rem; }
  .dk-lp__ticks { order: 4; margin-top: 0; gap: 8px; }
  .dk-lp__ticks li { font-size: 15px; }
  .dk-lp__form { order: 5; margin-top: 6px; }
  .dk-lp__proof { order: 6; margin-top: 4px; }
  .dk-lp h1 { max-width: none; }
  .dk-lp__ticks { grid-template-columns: 1fr; }
}
/* Landing header: the service menus, phone and quote button; on phones the quote button stays beside the menu */
@media (max-width: 640px) { body.tlc-landing .dk-hdr .dk-hdr__quote { display: inline-flex; min-height: 40px; padding: 0 14px; font-size: 14px; } }

/* Phone menu: groups such as Roof and Driveways open on tap */
.dk-drawer__grp { display: none; }
@media (max-width: 1180px) {
  .dk-drawer .dk-drawer__grp { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 52px; padding: 0; border: 0; border-bottom: 1px solid var(--dk-edge); background: none; color: #fff; font: inherit; font-weight: 700; font-size: 17px; text-align: left; cursor: pointer; }
  .dk-drawer .dk-drawer__grp > svg { width: 14px; height: 10px; color: var(--dk-green); transition: transform .3s var(--dk-ease); }
  .dk-drawer .dk-drawer__grp[aria-expanded="true"] > svg { transform: rotate(180deg); }
  .dk-drawer .dk-drawer__grp:focus-visible { outline: 2px solid var(--dk-green); outline-offset: 2px; }
  .dk-drawer__list[hidden] { display: none; }
  .dk-drawer .dk-drawer__sub[aria-current="page"] { color: var(--dk-green-2); }
}

/* Phones: a call and quote bar fixed to the bottom of the screen */
.dk-mbar { display: none; }
@media (max-width: 640px) {
  .dk-mbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 48; display: grid; grid-template-columns: auto 1fr; gap: 10px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: rgba(10,21,32,.94); backdrop-filter: blur(14px); box-shadow: 0 -1px 0 var(--dk-edge), 0 -12px 30px -12px rgba(0,0,0,.6); transition: transform .3s var(--dk-ease), visibility .3s; }
  .dk-mbar.dk-mbar--off, .dk-menu-open .dk-mbar { transform: translateY(110%); visibility: hidden; }
  .dk-mbar__call { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 16px; border-radius: 10px; background: rgba(255,255,255,.07); box-shadow: inset 0 0 0 1px var(--dk-edge-2); color: #fff; font-weight: 700; font-size: 15px; text-decoration: none; }
  .dk-mbar__call svg { width: 18px; height: 18px; color: var(--dk-green); }
  .dk-mbar .dk-mbar__quote { min-height: 48px; padding: 0 16px; font-size: 16px; }
  body.tlc-dark { padding-bottom: calc(68px + env(safe-area-inset-bottom)); }
  /* the landing header button would repeat the bar's */
  body.tlc-landing .dk-hdr .dk-hdr__quote { display: none; }
}

/* Quote form on phones: square service tiles now come from Copia Leads 0.13.0 (Settings → Service tiles), so the
   theme no longer restyles the tiles (10 November 2026). */

/* Footer: Contact us on its own beneath About TLC, in the heading style */
.dk-ftr__col .dk-ftr__headlink { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 56px; border-top: 1px solid var(--dk-edge); background: none; color: var(--dk-green-2); font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.dk-ftr__col .dk-ftr__headlink svg { width: 16px; height: 16px; margin-right: 2px; color: var(--dk-green-2); transition: transform .25s var(--dk-ease); }
.dk-ftr__col .dk-ftr__headlink:hover, .dk-ftr__col .dk-ftr__headlink:focus-visible { color: #fff; background: none; }
.dk-ftr__col .dk-ftr__headlink:hover svg, .dk-ftr__col .dk-ftr__headlink:focus-visible svg { transform: translateX(3px); }
@media (min-width: 1101px) {
  .dk-ftr__col .dk-ftr__headlink { min-height: 0; margin-top: 22px; padding: 0 0 12px; border-top: 0; border-bottom: 1px solid var(--dk-edge); }
}

/* Up and down buttons: step through the page a section at a time */
.dk-pgnav { position: fixed; right: 14px; bottom: 24px; z-index: 47; display: grid; gap: 6px; opacity: 0; visibility: hidden; transform: translateY(8px); transition: opacity .3s, transform .3s var(--dk-ease), visibility .3s; }
.dk-pgnav.dk-on { opacity: 1; visibility: visible; transform: none; }
.dk-pgnav button { display: grid; place-items: center; width: 42px; height: 42px; padding: 0; border: 0; border-radius: 12px; background: rgba(10,21,32,.86); backdrop-filter: blur(10px); box-shadow: inset 0 0 0 1px var(--dk-edge-2), 0 8px 20px -8px rgba(0,0,0,.7); color: var(--dk-green-2); cursor: pointer; transition: background .2s, color .2s, opacity .2s; }
.dk-pgnav button svg { width: 14px; height: 10px; }
.dk-pgnav button:hover, .dk-pgnav button:focus-visible { background: rgba(37,208,58,.16); color: #fff; outline: none; }
.dk-pgnav button:focus-visible { box-shadow: 0 0 0 2px var(--dk-green); }
.dk-pgnav button[disabled] { opacity: .35; cursor: default; }
.dk-menu-open .dk-pgnav { opacity: 0; visibility: hidden; }
@media (max-width: 640px) {
  .dk-pgnav { right: 12px; bottom: calc(80px + env(safe-area-inset-bottom)); }
  .dk-pgnav button { width: 38px; height: 38px; }
}
/* Complianz's floating "Manage consent" tab covered the sticky quote button on phones. The footer's
   "Cookie preferences" link does the same job on every page (dark.js presses this hidden tab), so the tab is
   hidden (owner, 10 November 2026). Complianz's settings and consent handling are unchanged. */
body.tlc-dark #cmplz-manage-consent .cmplz-manage-consent { display: none !important; }
/* A closing box with no related-services list runs straight into the footer's "Call TLC free" card, so its own
   "Prefer to talk?" number would show twice in a row (owner, 9 November 2026). */
.dk-bento--solo .dk-cta__tel { display: none; }
@media print { .dk-pgnav, .dk-mbar { display: none !important; } }

/* Phone and tablet menu: Residential and Commercial open on tap, with Roof and Driveways nested inside */
.dk-drawer__sec { display: none; }
@media (max-width: 1180px) {
  .dk-drawer .dk-drawer__sec { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 56px; padding: 0; border: 0; border-bottom: 1px solid var(--dk-edge); background: none; color: #fff; font: inherit; font-weight: 700; font-size: 18px; text-align: left; cursor: pointer; }
  .dk-drawer .dk-drawer__sec > svg { width: 14px; height: 10px; color: var(--dk-green); transition: transform .3s var(--dk-ease); }
  .dk-drawer .dk-drawer__sec[aria-expanded="true"] { color: var(--dk-green-2); }
  .dk-drawer .dk-drawer__sec[aria-expanded="true"] > svg { transform: rotate(180deg); }
  .dk-drawer .dk-drawer__sec:focus-visible { outline: 2px solid var(--dk-green); outline-offset: 2px; }
  .dk-drawer__secbody { margin: 0 0 8px; padding-left: 14px; border-left: 2px solid rgba(37,208,58,.35); }
  .dk-drawer__secbody[hidden] { display: none; }
  .dk-drawer__secbody > a, .dk-drawer__secbody .dk-drawer__grp { font-size: 16px; min-height: 50px; }
  .dk-drawer__secbody > a[aria-current="page"] { color: var(--dk-green-2); }
  .dk-drawer__secbody .dk-drawer__list { padding-left: 4px; }
  .dk-drawer__secbody .dk-drawer__sub { font-size: 15px; min-height: 46px; }
}

/* Phone and tablet menu: the desktop dropdown's icons beside each service */
@media (max-width: 1180px) {
  .dk-drawer .dk-drawer__lbl { display: inline-flex; align-items: center; gap: 12px; min-width: 0; }
  .dk-drawer .dk-drawer__ic { display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 9px; background: rgba(37,208,58,.12); box-shadow: inset 0 0 0 1px rgba(37,208,58,.25); color: #7ff08b; }
  .dk-drawer .dk-drawer__ic svg { width: 18px; height: 18px; color: inherit; transform: none; }
  .dk-drawer__secbody .dk-drawer__ic { width: 30px; height: 30px; border-radius: 8px; }
  .dk-drawer__secbody .dk-drawer__ic svg { width: 16px; height: 16px; }
  .dk-drawer__secbody .dk-drawer__sub .dk-drawer__ic { width: 26px; height: 26px; border-radius: 7px; background: rgba(37,208,58,.07); }
  .dk-drawer__secbody .dk-drawer__sub .dk-drawer__ic svg { width: 14px; height: 14px; }
}

/* Hero trust badges on phones: a tidy two-by-two grid (owner, 9 November 2026) */
@media (max-width: 560px) {
  .dk-trust { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .dk-trust li { justify-content: flex-start; min-height: 48px; padding: 8px 12px 8px 10px; border-radius: 14px; font-size: 13px; line-height: 1.25; }
  .dk-trust .dk-stars { display: none; }
  .dk-trust li:only-child, .dk-trust li:last-child:nth-child(odd) { grid-column: 1 / -1; }
}

/* Service tiles: with six services the last one runs the full width, so no tile sits on its own */
.dk-tiles:has(> .dk-tile:nth-child(6):last-child) { grid-template-rows: repeat(2, minmax(250px, 1fr)) minmax(230px, auto); }
.dk-tiles > .dk-tile:nth-child(6):last-child { grid-column: 1 / -1; }
@media (max-width: 560px) { .dk-tiles > .dk-tile:nth-child(6):last-child { grid-column: auto; } }

/* Home "Areas we cover": a little more room under the label */
.dk-company .dk-eyebrow + .dk-areas__h, .dk-areas .dk-eyebrow + .dk-areas__h { margin-top: 12px; }

/* Ad landing page on phones and tablets (owner, 9 November 2026): a real photograph at the top, the promise,
   proof, then one clear button that opens the form, which starts on the advertised service */
.dk-lp__media, .dk-lp__open { display: none; }
@media (max-width: 999px) {
  .dk-lp__media { display: block; position: relative; height: clamp(220px, 58vw, 360px); margin-top: 72px; }
  .dk-lp__media img { width: 100%; height: 100%; object-fit: cover; }
  .dk-lp__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,21,32,0) 45%, rgba(10,21,32,.95)); }
  .dk-lp:has(.dk-lp__media) .dk-lp__in { padding-top: 0; margin-top: -34px; }
  .dk-lp__proof { order: 5; margin-top: 2px; }
  .dk-lp__open { display: inline-flex; order: 6; width: 100%; margin-top: 4px; }
  .dk-lp__form { order: 7; margin-top: 4px; }
  .dk-lp--shut .dk-lp__form { display: none; }
  .dk-lp:not(.dk-lp--shut) .dk-lp__open { display: none; }
  .dk-lp { padding-bottom: 36px; }
}
@media (max-width: 999px) {
  /* The button within the first screen: promise, button, proof, then the reassurances */
  .dk-lp__media { height: clamp(190px, 46vw, 320px); }
  .dk-lp__open { order: 4; }
  .dk-lp__proof { order: 5; }
  .dk-lp__ticks { order: 6; margin-top: 6px; }
  .dk-lp__form { order: 7; }
  .dk-lp:not(.dk-lp--shut) .dk-lp__form { order: 4; }
}

/* Service tiles: with seven services the last two share the bottom row */
.dk-tiles:has(> .dk-tile:nth-child(7):last-child) { grid-template-rows: repeat(2, minmax(250px, 1fr)) minmax(230px, auto); }
.dk-tiles > .dk-tile:nth-child(6):nth-last-child(2), .dk-tiles > .dk-tile:nth-child(7):last-child { grid-column: span 2; }
@media (max-width: 1000px) { .dk-tiles > .dk-tile:nth-child(6):nth-last-child(2), .dk-tiles > .dk-tile:nth-child(7):last-child { grid-column: auto; } }