/* ============================================================
   MAINE STAYS — rebrand layer over the cloned REMUX styles.
   Loaded AFTER styles.css; overrides only what differs.
   Light editorial body + dark cinematic teal bands · teal-led.
   ============================================================ */
:root{
  /* ── CLONED FROM MAINE STAYS 2026-08-31. Structure, layout, motion and every
     class name are the source's, unchanged. ONLY the brand hues move.

     ⛔ DBS Cleaning' semantic colour law is NOT Maine Stays'. Maine Stays uses teal
        as a decorative accent everywhere. DBS Cleaning may not: green means
        VERIFIED and nothing else, and CTAs are black pills. So the source's
        accent role maps to INK here, and green is held back for ticks and
        vetting marks only. Mapping teal->green directly would have made the
        verified colour decorative, which is the one thing it must never be. */
  --teal:#16181a; --teal-deep:#0f1113; --teal-glow:#1f5fd0; --gold:#8A8071;
  --green:#1c9d57;        /* VERIFIED / COMPLETE ONLY — never a CTA, never decorative */
  --green-ink:#167e46;    /* green AS WORDS on a light face (5.11:1) */
  --green-soft:#e7f4ec;
  --blue:#1f5fd0;         /* links + focus ring only */
  --refuse:#b3261e;
  --ink-deep:#0f1419;
  --font-ui:'Poppins',sans-serif;
  --font-head:'Playfair Display',Georgia,'Times New Roman',serif;
}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* fonts: big display = serif; nav/kickers/buttons/labels stay Poppins, body Barlow */
.display,.hero-title{font-family:var(--font-head);font-weight:600;letter-spacing:-.01em;}
.nav-brand{font-family:var(--font-head);font-weight:600;font-size:1.3rem;letter-spacing:.01em;}
.proof-num{font-family:var(--font-ui);}            /* stats stay sans + tabular */

/* accent: teal-led */
::selection{background:var(--teal);color:#fff;}
:focus-visible{outline:2px solid var(--teal);}
.btn-pill{background:var(--teal);color:#fff;}
.btn-pill:hover{box-shadow:0 14px 30px -12px rgba(22,24,26,.45);}  /* was a teal glow */
.btn-pill-light{background:#fff;color:var(--ink);}
.btn-pill-light:hover{box-shadow:0 14px 30px -12px rgba(255,255,255,.4);}
/* ⛔ KICKERS. Was #0b7a85 (Maine Stays teal) on light and --teal-glow (blue) on dark —
   both off the DBS colour law (blue = links and focus only, green = verified only).
   Light faces: ink-60 (4.96:1 on fog). Dark faces: base.css .kicker.on-dark supplies
   white at 55%; nothing here overrides it any more. */
.kicker{color:var(--ink-60);}
.service-link{color:var(--teal);}
.faq-list summary::after{color:var(--teal);}
.faq-sub a,.quote-phone a{color:var(--teal);text-decoration-color:var(--teal);}
.check-points li::before{background:var(--teal);}
/* .check-points--dark ticks: base.css:379 supplies #fff; the blue override is gone */
.fleet-badge{background:var(--teal);color:#fff;}
.fleet-card--popular{background:var(--ink-deep);}
.fleet-card--popular .fleet-badge{background:var(--teal);}

/* nav: white over the dark hero, frosted-light once scrolled past */
.nav-mark{width:26px;height:24px;flex:none;}
.nav--scrolled{background:rgba(244,243,240,.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 1px 0 rgba(22,24,26,.06);}

/* ---- static image hero (video-ready: swap .hero-media img for a <video> later) ---- */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;background:#0a0c10;}
.hero-media{position:absolute;inset:0;}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:center;}
.hero-scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,15,19,.92),rgba(10,15,19,.72) 36%,rgba(10,15,19,.3) 62%,rgba(10,15,19,.08) 100%);}
.hero-inner{position:relative;z-index:2;width:100%;max-width:1760px;margin:0 auto;padding:7rem var(--pad-x) 5rem;}
.hero-eyebrow{display:inline-block;font-family:var(--font-ui);font-weight:600;font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;color:var(--teal-glow);}
.hero-title{color:#fff;font-size:clamp(2.6rem,6vw,5rem);line-height:1.04;margin-top:1.1rem;text-shadow:0 2px 30px rgba(0,0,0,.35);}
.hero-sub{margin-top:1.4rem;max-width:34rem;color:rgba(255,255,255,.86);font-size:clamp(1rem,1.4vw,1.15rem);line-height:1.55;}
.hero-cta{margin-top:2rem;display:flex;gap:1rem;flex-wrap:wrap;}
.hero-cta .btn-pill{font-size:.92rem;padding:.95rem 1.7rem;}

/* homes: 2-up property cards + spec line */
.homes .service-cards{grid-template-columns:repeat(2,1fr);}
.service-spec{font-family:var(--font-ui);font-weight:600;font-size:.8rem;letter-spacing:.02em;color:var(--teal);margin-top:.35rem;}
.quote-card select{background:var(--fog);border:1px solid transparent;border-radius:.8rem;padding:.8rem 1rem;color:var(--ink);font-family:var(--font-body);font-size:.95rem;transition:border-color .25s,background .25s;}
.quote-card select:focus{outline:none;border-color:var(--teal);background:#fff;}

@media (max-width:1023px){ .homes .service-cards{grid-template-columns:1fr 1fr;} }
@media (max-width:767px){
  .hero{align-items:flex-start;}
  .hero-inner{padding-top:6.5rem;}
  .hero-scrim{background:linear-gradient(180deg,rgba(10,15,19,.82),rgba(10,15,19,.3) 42%,rgba(10,15,19,.72) 100%);}
  .hero-title{font-size:clamp(2.3rem,9vw,3rem);}
  .homes .service-cards{grid-template-columns:1fr;}
}

/* ================= v2 homepage additions ================= */
.hero-slides{position:absolute;inset:0;}
.hero-slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transition:opacity 1.4s ease;will-change:opacity;}
.hero-slide.is-active{opacity:1;}
/* ⛔ REMOVED 5 Sept 2026: a Maine Stays rule pointed slide 1 at hero-living-mobile.webp on
   every phone — a file this site never had (404 on every mobile load). */

.trust{background:var(--white);border-bottom:1px solid rgba(22,24,26,.06);padding:2.2rem 0;}
.trust-label{font-family:var(--font-ui);font-size:.78rem;letter-spacing:.06em;color:var(--ink-60);text-align:center;text-transform:uppercase;}
.trust-row{display:flex;flex-wrap:wrap;justify-content:center;gap:.9rem 2.2rem;margin-top:1.1rem;}
.trust-row span{font-family:var(--font-ui);font-weight:600;font-size:.95rem;color:var(--ink);opacity:.5;transition:opacity .2s;}
.trust-row span:hover{opacity:1;}
.industry-chips span a{color:inherit;text-decoration:none;}

.bookdirect{position:relative;overflow:hidden;padding:clamp(4.5rem,11vh,7.5rem) 0;background:var(--ink-deep);}
.bookdirect .band-bg::after{background:linear-gradient(110deg,rgba(13,18,22,.95) 0%,rgba(13,18,22,.72) 52%,rgba(11,127,138,.5) 100%);}
.bookdirect::before{content:"";position:absolute;width:560px;height:560px;right:-130px;top:-130px;border-radius:50%;background:radial-gradient(circle,rgba(43,212,212,.22),transparent 70%);pointer-events:none;}
.bookdirect .split-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(2rem,5vw,4.5rem);align-items:center;}
.bookdirect .split-img{border-radius:var(--radius-card);overflow:hidden;box-shadow:0 30px 70px -25px rgba(0,0,0,.7),0 0 0 1px rgba(43,212,212,.18);}
.bookdirect .split-img img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3;}
@media (max-width:1023px){ .bookdirect .split-grid{grid-template-columns:1fr;} }

.reviews{background:var(--fog-deep);}
.reviews-track{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;margin-top:clamp(2rem,4vh,3rem);}
.review-card{background:var(--white);border-radius:var(--radius-card);padding:1.6rem 1.5rem;box-shadow:var(--shadow-soft);display:flex;flex-direction:column;gap:.85rem;}
.review-stars{color:var(--gold);letter-spacing:.12em;font-size:.95rem;}
.review-card blockquote{font-size:.95rem;line-height:1.6;color:var(--ink);}
.review-card figcaption{display:flex;flex-direction:column;gap:.15rem;margin-top:auto;}
.review-name{font-family:var(--font-ui);font-weight:600;font-size:.95rem;}
.review-prop{font-size:.78rem;color:var(--teal);}
@media (max-width:1023px){ .reviews-track{grid-template-columns:1fr 1fr;} }
@media (max-width:640px){ .reviews-track{grid-template-columns:1fr;} }

.homes .service-cards{max-width:920px;margin-left:auto;margin-right:auto;}

/* ===== per-slide hero captions + scrims ===== */
.hero-slide{overflow:hidden;}
.hero-slide::after{content:"";position:absolute;inset:0;z-index:1;}
.hero-slide.scrim-left::after{background:linear-gradient(90deg,rgba(10,15,19,.92),rgba(10,15,19,.55) 42%,rgba(10,15,19,.12) 72%,transparent);}
.hero-slide.scrim-right::after{background:linear-gradient(270deg,rgba(10,15,19,.92),rgba(10,15,19,.55) 42%,rgba(10,15,19,.12) 72%,transparent);}
.hero-slide.scrim-center::after{background:radial-gradient(130% 120% at 50% 42%,rgba(10,15,19,.42),rgba(10,15,19,.85));}
.hero-cap{position:absolute;z-index:2;display:flex;flex-direction:column;width:min(640px,86%);}
.hero-cap--left{left:var(--pad-x);top:50%;transform:translateY(-50%);align-items:flex-start;text-align:left;}
.hero-cap--right{right:var(--pad-x);top:50%;transform:translateY(-50%);align-items:flex-end;text-align:right;}
.hero-cap--center{left:50%;top:46%;transform:translate(-50%,-50%);align-items:center;text-align:center;width:min(820px,90%);}
.hero-cap--right .hero-sub{margin-left:auto;}
.hero-cap--center .hero-sub{margin-left:auto;margin-right:auto;}
.hero-cap--right .hero-cta{justify-content:flex-end;}
.hero-cap--center .hero-cta{justify-content:center;}

/* ===== lodgify availability search (compact + narrow, centred) ===== */
.lodgify-search{background:var(--fog);padding:clamp(2rem,4.5vh,3.2rem) 0;}
.lodgify-search .section-inner{text-align:center;}
.lodgify-wrap{margin:clamp(1.1rem,2.5vh,1.7rem) auto 0;max-width:680px;background:var(--white);border-radius:16px;box-shadow:var(--shadow-soft);padding:.6rem .65rem;}
#lodgify-search-bar{min-height:54px;}

@media (max-width:767px){
  .hero-cap,.hero-cap--left,.hero-cap--right,.hero-cap--center{left:var(--pad-x);right:var(--pad-x);top:auto;bottom:14vh;transform:none;width:auto;align-items:flex-start;text-align:left;}
  .hero-cap--right .hero-sub,.hero-cap--center .hero-sub{margin-left:0;margin-right:0;}
  .hero-cap--right .hero-cta,.hero-cap--center .hero-cta{justify-content:flex-start;}
  .hero-slide::after{background:linear-gradient(180deg,rgba(10,15,19,.45),rgba(10,15,19,.2) 38%,rgba(10,15,19,.85)) !important;}
}

/* ===== tagline blockquote ===== */
.ms-tagline{background:var(--white);}
.ms-tagline blockquote{max-width:60rem;margin:0 auto;text-align:center;font-family:var(--font-head);font-weight:500;font-style:italic;font-size:clamp(1.3rem,2.4vw,2rem);line-height:1.42;color:var(--ink);}
.ms-tagline blockquote::before{content:"";display:block;width:44px;height:3px;background:var(--teal);margin:0 auto 1.4rem;border-radius:2px;}

/* ===== 365 locations ===== */
.ms-locations{background:var(--fog-deep);text-align:center;}
.ms-loc-sub{max-width:46rem;margin:1.1rem auto 0;color:var(--ink-60);line-height:1.55;}
.ms-loc-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem;margin-top:1.8rem;}
.ms-loc-chips a{font-family:var(--font-ui);font-weight:500;font-size:.88rem;color:var(--ink);border:1px solid rgba(22,24,26,.16);border-radius:var(--radius-pill);padding:.5rem 1.05rem;transition:border-color .2s,color .2s;}
.ms-loc-chips a:hover{border-color:var(--teal);color:var(--teal);}
.ms-loc-all{margin-top:1.6rem;}
.ms-loc-all a{font-family:var(--font-ui);font-weight:600;color:var(--teal);}

/* ===================== 18 Jun 2026 — homepage overhaul ===================== */

/* ---- hero: a looping video per slide (desktop only; the still stays as poster + mobile/reduced fallback) ---- */
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:0;opacity:0;transition:opacity .7s ease;pointer-events:none;}
.hero-slide.is-active .hero-video.is-playing{opacity:1;}
/* hero video plays on mobile too now (Jermaine, 2026-06-20) — gated only by reduced-motion */
@media (prefers-reduced-motion:reduce){ .hero-video{display:none!important;} }

/* ---- homes + availability merged (light premium) ---- */
.homes--merged{position:relative;overflow:hidden;background:linear-gradient(180deg,rgba(244,243,240,.9),rgba(236,234,229,.94)),url('../images/bg-homes-light.webp') center/cover no-repeat;}
.homes--merged::before{content:"";position:absolute;width:520px;height:520px;right:-150px;top:-120px;border-radius:50%;background:radial-gradient(circle,rgba(43,212,212,.16),transparent 70%);pointer-events:none;}
.homes--merged .section-inner{position:relative;z-index:1;}
.homes-sub{max-width:46rem;margin-top:1rem;color:var(--ink-60);line-height:1.55;}
.homes-search{margin:clamp(1.5rem,3.5vh,2.4rem) 0 clamp(2.2rem,5vh,3.4rem);}
.homes-search .lodgify-wrap{margin:0 auto;max-width:780px;background:#fff;border-radius:16px;box-shadow:var(--shadow-lift);padding:.6rem .65rem;}

/* ⛔ THE LODGIFY SEARCH-BAR CSS WAS REMOVED HERE, 31 Aug 2026.
   Maine Stays books room-nights through Lodgify. DBS Cleaning sells cleaning
   contracts and has no booking engine, so neither the widget nor its styling
   was carried over. The clone checklist warns that embedded widgets are the
   thing most often SILENTLY dropped — so this one is dropped loudly. */
/* ---- reviews: dark cinematic teal band + carousel ---- */
.reviews--band{position:relative;overflow:hidden;padding:clamp(4.5rem,11vh,7.5rem) 0;background:var(--ink-deep);}
.reviews--band .band-bg::after{background:linear-gradient(120deg,rgba(13,18,22,.95) 0%,rgba(13,18,22,.8) 55%,rgba(11,127,138,.55) 100%);}
.reviews-carousel{position:relative;margin-top:clamp(2rem,4vh,3rem);}
.reviews-viewport{overflow:hidden;}
.reviews--band .reviews-track{display:flex;grid-template-columns:none;gap:1.25rem;margin-top:0;transition:transform .55s cubic-bezier(.22,1,.36,1);will-change:transform;}
.reviews--band .review-card{flex:0 0 calc((100% - 2 * 1.25rem) / 3);}
.reviews--band .review-prop{color:var(--teal-deep);}
.rev-arrow{position:absolute;top:42%;transform:translateY(-50%);z-index:3;width:46px;height:46px;border-radius:50%;border:0;cursor:pointer;background:rgba(255,255,255,.94);color:var(--ink-deep);font-size:1.7rem;line-height:1;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-soft);transition:transform .2s,background .2s;}
.rev-arrow:hover{transform:translateY(-50%) scale(1.07);background:#fff;}
.rev-prev{left:-6px;} .rev-next{right:-6px;}
.rev-arrow[disabled]{opacity:.32;cursor:default;}
.reviews-dots{display:flex;gap:.5rem;justify-content:center;margin-top:1.7rem;}
.reviews-dots button{width:9px;height:9px;border-radius:50%;border:0;padding:0;cursor:pointer;background:rgba(255,255,255,.34);transition:background .2s,transform .2s;}
.reviews-dots button[aria-selected="true"]{background:var(--teal-glow);transform:scale(1.25);}
@media (max-width:1023px){ .reviews--band .review-card{flex-basis:calc((100% - 1.25rem) / 2);} }
@media (max-width:640px){ .reviews--band .review-card{flex-basis:100%;} }
@media (prefers-reduced-motion:reduce){
  .reviews-viewport{overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;}
  .reviews--band .reviews-track{transition:none;}
  .reviews--band .review-card{scroll-snap-align:start;}
  .rev-arrow,.reviews-dots{display:none;}
}
@media (max-width:560px){ .rev-prev{left:0;} .rev-next{right:0;} }

/* ---- guidebook feature (real screenshot in a phone frame) ---- */
.guidebook{background:var(--white);}
.guidebook .split-grid{align-items:center;}
.guidebook-media{display:flex;justify-content:center;}
.phone-frame{position:relative;width:min(300px,78%);aspect-ratio:9 / 19;background:#0f1419;border-radius:38px;padding:11px;box-shadow:0 30px 70px -25px rgba(15,20,25,.55),0 0 0 1px rgba(15,20,25,.08);}
.phone-frame::before{content:"";position:absolute;top:13px;left:50%;transform:translateX(-50%);width:42%;height:19px;background:#0f1419;border-radius:0 0 14px 14px;z-index:2;}
.phone-frame img{width:100%;height:100%;object-fit:cover;border-radius:28px;display:block;}
@media (max-width:1023px){ .guidebook-media{margin-bottom:2rem;} }

/* ===== real logo mark in nav + footer (2026-06-20) — replaces the old drawn SVG ===== */
.nav-brand .nav-logo{height:30px;width:auto;flex:none;display:none;}
.nav--on-video .nav-logo--cream{display:block;}      /* over the dark hero */
.nav--scrolled .nav-logo--colour{display:block;}     /* frosted-light nav */
.footer .nav-logo--colour{display:block;}            /* light footer */
.footer .nav-logo{height:34px;}
@media (max-width:767px){ .nav-brand .nav-logo{height:26px;} }

/* ===== mobile menu (hamburger) — button injected by site.js; works on every assets-v2 page ===== */
.nav-toggle{display:none;}
@media (max-width:1023px){
  .nav-toggle{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;padding:0;border:0;background:transparent;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;}
  .nav-toggle svg{width:27px;height:27px;}
  .nav .btn-pill{display:none;}   /* declutter the mobile bar — CTAs live in the menu, hero & sticky bar */
  .nav-links{display:flex!important;flex-direction:column;align-items:stretch;gap:0;position:absolute;top:100%;left:0;right:0;background:rgba(244,243,240,.98);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 22px 44px -18px rgba(0,0,0,.32);border-top:1px solid rgba(22,24,26,.08);padding:.3rem 0;max-height:0;overflow:hidden;opacity:0;visibility:hidden;transition:max-height .32s ease,opacity .25s ease,visibility .25s;}
  .nav.nav-open .nav-links{max-height:85vh;overflow:auto;opacity:1;visibility:visible;}
  .nav-links a{padding:.95rem var(--pad-x);font-size:1.02rem;color:var(--ink);opacity:1;border-bottom:1px solid rgba(22,24,26,.06);}
  .nav-links .nav-social{padding:.9rem var(--pad-x);justify-content:flex-start;gap:1.1rem;border-bottom:0;}
  .nav-links .nav-social svg{width:22px;height:22px;}
}

/* ── Inside our homes gallery (ms-gallery-v1, 2026-07-01) ── */
.gallery{padding:5.5rem 0 5rem;background:#fff;}
.gallery .section-inner{padding-bottom:0;}
.gallery-sub{color:#5a6772;max-width:560px;margin-top:.9rem;font-size:1.02rem;line-height:1.6;}
.gallery-strip{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
  padding:2.4rem max(24px,calc((100vw - 1180px)/2)) .6rem;scrollbar-width:none;}
.gallery-strip::-webkit-scrollbar{display:none;}
/* portrait cards — these are the branded 4:5 marketing posts, shown WHOLE (a landscape
   crop sliced off the logo + headline baked into them) */
.gallery-strip figure{flex:0 0 auto;width:min(300px,66vw);margin:0;scroll-snap-align:start;}
.gallery-strip img{width:100%;aspect-ratio:4/5;height:auto;object-fit:cover;border-radius:16px;display:block;
  box-shadow:0 18px 40px -22px rgba(15,20,25,.35);}
.gallery-strip figcaption{font-size:.82rem;color:#5a6772;margin-top:9px;letter-spacing:.01em;}
@media (max-width:640px){.gallery{padding:4rem 0 3.4rem;}}

/* ===== sector showcase band (cloned: was "Our Coventry homes") ===== */
.homes--showcase{position:relative;overflow:hidden;padding:clamp(3.6rem,7.5vh,5.4rem) 0;background:var(--ink-deep);}
.homes--showcase .band-bg{position:absolute;inset:0;}
.homes--showcase .band-bg img{width:100%;height:100%;object-fit:cover;}
.homes--showcase .band-bg::after{content:"";position:absolute;inset:0;
  background:
    radial-gradient(85% 65% at 88% -6%, rgba(43,212,212,.22), transparent 58%),
    linear-gradient(180deg, rgba(9,13,17,.93) 0%, rgba(9,13,17,.84) 50%, rgba(11,127,138,.52) 100%);}
.homes--showcase .section-inner{position:relative;z-index:1;}

/* header: copy left, luminous availability search right */
.homes-head{display:grid;grid-template-columns:1fr;gap:clamp(1.3rem,3vw,2rem);align-items:end;
  max-width:1120px;margin:0 auto;}
@media(min-width:920px){.homes-head{grid-template-columns:1fr 1.02fr;}}
.homes--showcase .homes-sub{max-width:34rem;margin-top:.65rem;color:rgba(255,255,255,.66);line-height:1.5;font-size:.95rem;}
.homes-search{margin:0;display:flex;flex-direction:column;gap:.55rem;}
.homes-search-label{font-family:var(--font-ui);font-weight:600;font-size:.72rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--teal-glow);}
.homes-search .lodgify-wrap{margin:0;max-width:none;background:#fff;border-radius:16px;padding:.5rem .55rem;
  box-shadow:0 26px 60px -22px rgba(0,0,0,.7), 0 0 0 1px rgba(43,212,212,.30), 0 0 46px -12px rgba(43,212,212,.38);}

/* luminous glass property cards */
.home-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(1.1rem,2.2vw,1.7rem);
  max-width:1120px;margin:clamp(1.6rem,3.2vh,2.4rem) auto 0;}
.home-card{position:relative;display:flex;flex-direction:column;
  background:rgba(255,255,255,.055);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-radius:var(--radius-card);overflow:hidden;border:1px solid rgba(255,255,255,.13);
  box-shadow:0 30px 70px -30px rgba(0,0,0,.75);
  transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s,border-color .4s;}
.home-card:hover{transform:translateY(-6px);border-color:rgba(255,255,255,.28);
  box-shadow:0 44px 92px -32px rgba(0,0,0,.85), 0 0 0 1px rgba(255,255,255,.14);}  /* was a cyan glow */

.home-card-media{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;}
.home-card-media img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1);}
.home-card:hover .home-card-media img{transform:scale(1.05);}
.home-card-media::after{content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(9,13,17,.92) 0%,rgba(9,13,17,.34) 42%,transparent 68%);}

.home-badge{position:absolute;top:.8rem;left:.8rem;z-index:2;font-family:var(--font-ui);font-weight:600;
  font-size:.7rem;letter-spacing:.05em;text-transform:uppercase;color:#fff;
  background:rgba(22,24,26,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.35);padding:.4rem .78rem;border-radius:var(--radius-pill);}

.home-card-overlay{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:1rem 1.2rem;}
.home-card-overlay h3{font-family:var(--font-head);font-weight:600;font-size:1.55rem;
  letter-spacing:-.01em;line-height:1.06;color:#fff;}
.home-card-overlay .home-spec{margin-top:.22rem;font-family:var(--font-ui);font-weight:600;
  font-size:.78rem;letter-spacing:.02em;color:rgba(255,255,255,.62);}

.home-card-body{display:flex;flex-direction:column;gap:.85rem;flex:1;padding:1rem 1.2rem 1.15rem;}
.home-desc{margin:0;font-size:.88rem;line-height:1.5;color:rgba(255,255,255,.66);}
.home-cta{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;gap:.5rem;
  font-family:var(--font-ui);font-weight:600;font-size:.88rem;color:#fff;background:var(--ink);
  padding:.62rem 1.2rem;border-radius:var(--radius-pill);text-decoration:none;
  box-shadow:0 14px 30px -12px rgba(22,24,26,.45);
  transition:background .25s,transform .25s,box-shadow .25s;}
.home-cta span{transition:transform .25s;}
.home-cta:hover{background:var(--ink-deep);transform:translateY(-2px);box-shadow:0 18px 34px -12px rgba(22,24,26,.5);}
.home-cta:hover span{transform:translateX(4px);}

@media(max-width:640px){
  .home-cards{grid-template-columns:1fr;max-width:460px;}
  .home-card-overlay h3{font-size:1.4rem;}
}

/* ===== ms-invoicing-v1 — "Can you invoice our company?" section ===== */
.invoicing{padding:6.5rem 0;background:linear-gradient(180deg,var(--white) 0%,var(--fog) 100%);}
.invoicing-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2.5rem,6vw,6rem);align-items:center;}
.invoicing-copy .display{font-size:clamp(2rem,3.6vw,3rem);line-height:1.08;margin-top:.9rem;}
.invoicing-sub{margin-top:1.1rem;max-width:34rem;font-size:1.02rem;line-height:1.6;color:var(--ink-60);}
.invoicing-ctas{margin-top:2rem;display:flex;align-items:center;flex-wrap:wrap;gap:1.4rem;}
.invoicing-link{font-family:var(--font-ui);font-weight:600;font-size:.92rem;color:#0b7a85;text-decoration:none;}
.invoicing-link:hover{text-decoration:underline;text-decoration-color:var(--teal);}

.invoicing-visual{position:relative;max-width:440px;width:100%;justify-self:center;}
.inv-doc-back{position:absolute;inset:20px -14px -14px 14px;background:var(--fog-deep);border-radius:14px;transform:rotate(2.5deg);}
.inv-doc{position:relative;background:var(--white);border:1px solid rgba(22,24,26,.08);border-radius:14px;overflow:hidden;box-shadow:var(--shadow-lift);}
.inv-head{display:flex;align-items:center;justify-content:space-between;gap:.8rem;padding:1.15rem 1.4rem;background:linear-gradient(135deg,var(--ink-deep) 0%,#123a40 100%);color:#fff;}
.inv-brand{font-family:var(--font-head);font-weight:600;font-size:1.05rem;letter-spacing:.01em;}
.inv-ref{font-size:.68rem;opacity:.72;margin-top:.15rem;font-family:var(--font-ui);}
.inv-chip{background:rgba(43,212,212,.16);border:1px solid rgba(43,212,212,.45);color:var(--teal-glow);border-radius:var(--radius-pill);padding:.28rem .8rem;font-family:var(--font-ui);font-weight:600;font-size:.66rem;letter-spacing:.09em;}
.inv-meta{display:flex;justify-content:space-between;gap:1rem;padding:1.05rem 1.4rem;border-bottom:1px solid rgba(22,24,26,.07);}
.inv-meta span{display:block;font-family:var(--font-ui);font-size:.6rem;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-40);}
.inv-meta strong{display:block;margin-top:.2rem;font-size:.84rem;color:var(--ink);}
.inv-meta div:last-child{text-align:right;}
.inv-lines{padding:.3rem 1.4rem;}
.inv-line{display:flex;justify-content:space-between;gap:.8rem;padding:.72rem 0;border-bottom:1px solid rgba(22,24,26,.05);}
.inv-line:last-child{border-bottom:0;}
.inv-line span{font-size:.8rem;color:var(--ink-60);}
.inv-line strong{font-size:.8rem;color:var(--ink);white-space:nowrap;}
.inv-inc{color:var(--teal-deep) !important;}
.inv-total{margin:0 1.4rem;padding:.85rem 0 1.05rem;border-top:2px solid var(--ink);display:flex;justify-content:space-between;align-items:baseline;gap:.8rem;}
.inv-total span{font-family:var(--font-ui);font-size:.64rem;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-40);}
.inv-total strong{font-family:var(--font-head);font-size:1.45rem;color:var(--ink);}
.inv-foot{background:var(--fog);border-top:1px solid rgba(22,24,26,.06);padding:.75rem 1.4rem;font-size:.68rem;color:var(--ink-40);}
.inv-stamp{position:absolute;top:-16px;right:-8px;background:var(--teal);color:#fff;border-radius:var(--radius-pill);padding:.5rem 1.05rem;font-family:var(--font-ui);font-weight:600;font-size:.74rem;transform:rotate(3deg);box-shadow:0 14px 30px -12px rgba(14,154,167,.6);}

@media(max-width:1023px){
  .invoicing{padding:5rem 0;}
  .invoicing-grid{grid-template-columns:1fr;}
  .invoicing-visual{justify-self:flex-start;margin-top:.5rem;}
}
@media(max-width:640px){
  .invoicing{padding:4rem 0;}
  .inv-stamp{right:0;}
}

/* ===== centred showcase head (cloned: was "Our Coventry homes") ===== */
.homes-head--center{grid-template-columns:1fr;justify-items:center;text-align:center;
  gap:clamp(1.6rem,3.5vh,2.4rem);align-items:center;}
@media(min-width:920px){.homes-head--center{grid-template-columns:1fr;}}
.homes-head--center .homes-head-copy{display:flex;flex-direction:column;align-items:center;}
.homes-head--center .display{font-size:clamp(2.2rem,4vw,3.4rem);}
.homes-head--center .homes-search{width:min(720px,100%);}
.homes-head--center .homes-search-label{text-align:center;}
.homes--showcase .homes-head--center{margin-bottom:clamp(2.2rem,5vh,3.2rem);}

/* ===== ms-footer-trust-v1 — footer credential badges ===== */
.footer-trust{display:flex;flex-wrap:wrap;justify-content:center;gap:.9rem;
  padding:1.6rem var(--pad-x) 0;max-width:1180px;margin:0 auto;}
.ft-badge{display:inline-flex;align-items:center;gap:.7rem;
  background:rgba(22,24,26,.035);border:1px solid rgba(22,24,26,.12);
  border-radius:12px;padding:.7rem 1.05rem;}
.ft-badge svg{width:26px;height:26px;flex-shrink:0;color:var(--teal);}
.ft-badge span{display:flex;flex-direction:column;font-family:var(--font-ui);
  font-size:.68rem;line-height:1.35;color:var(--ink-60);}
.ft-badge strong{font-size:.78rem;font-weight:600;color:var(--ink);letter-spacing:.02em;}
@media(max-width:640px){.footer-trust{gap:.6rem;}.ft-badge{padding:.55rem .8rem;}}

/* ============ FEATURED HOMES — 3-up variant. Added 2026-08-30. ============================
   ⛔ DO NOT change the `.home-cards` rule further up this file. It is hard-coded to two columns
      and ~1,700 generated lane pages share it — editing it is a site-wide layout change.
   This modifier is additive and applied ONLY to the homepage Featured Homes band. `auto-fit`
   means it still lays out correctly when a fourth home is added, so the CSS never needs
   revisiting for that. Declared last so it wins on source order (same specificity as
   `.home-cards`, which the element also carries). */
.home-cards--trio{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));max-width:1320px;}
@media(max-width:1023px){.home-cards--trio{grid-template-columns:repeat(2,1fr);max-width:820px;}}
@media(max-width:640px){.home-cards--trio{grid-template-columns:1fr;max-width:460px;}}

/* ═══ SAFEHANDS ADDITIONS TO THE CLONED THEME ═══════════════════════════════
   Everything above this line is Maine Stays', unchanged but for the brand hues.
   Below: the components DBS Cleaning has and Maine Stays does not — the vetting
   rail, the gate, and the form state machine. Written in the source's idiom
   (same radius, shadow and pill vocabulary) so they read as one system. */
.ruled{font-family:var(--font-head);font-weight:600;font-size:clamp(1.3rem,2.4vw,2rem);
  line-height:1.34;max-width:32ch;margin:0 0 1.2rem}
.opt{display:flex;align-items:center;gap:.7rem;min-height:44px;cursor:pointer;font-size:1rem}
.opt input{width:20px;height:20px;margin:0;accent-color:var(--ink)}  /* black controls match black pills; blue is links and focus only */
fieldset{border:0;margin:0 0 1.3rem;padding:0}
legend{font-family:var(--font-display);font-weight:600;font-size:.8rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-60);padding:0 0 .6rem}
/* ⛔ .sh-field, NOT the source's .field-row. In Maine Stays .field-row is a
   TWO-COLUMN grid for two fields side by side; used for a stacked label+input
   it put the label in column 1 and the control in column 2, ~260px apart.
   A DBS Cleaning-owned name, so no source rule can reach it. */
.sh-field{margin:0 0 1rem;display:block}
.sh-field label{display:block;font-weight:500;font-size:.9rem;margin:0 0 .4rem}
.sh-field input,.sh-field select,.sh-field textarea{width:100%;min-height:48px;padding:.75rem .9rem;
  border:1px solid rgba(22,24,26,.24);border-radius:.7rem;background:var(--white);color:var(--ink);
  font:400 1rem/1.4 var(--font-body);appearance:none}
.sh-field textarea{min-height:110px;resize:vertical}
.sh-field [aria-invalid="true"]{border-color:var(--refuse)}
.field__err{color:var(--refuse);font-size:.85rem;margin:.4rem 0 0}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.formpanel{background:var(--white);border-radius:var(--radius-card);padding:clamp(1.4rem,3vw,2.6rem);
  box-shadow:var(--shadow-soft);max-width:44rem;margin-inline:auto}
#gate-out{display:grid;gap:clamp(1.2rem,3vw,2.6rem);grid-template-columns:1fr 1fr;align-items:start;
  text-align:left;background:var(--white);border-radius:var(--radius-card);
  padding:clamp(1.4rem,3vw,2.6rem);box-shadow:var(--shadow-soft)}
@media(max-width:899px){#gate-out{grid-template-columns:1fr}}
#gate-out>*{min-width:0}
.verdict{border:1px solid rgba(22,24,26,.2);border-radius:var(--radius-card);padding:clamp(1.1rem,2.4vw,1.8rem)}
[data-verdict="allow"] .verdict{border-color:rgba(28,157,87,.5);background:var(--green-soft)}
[data-verdict="refuse"] .verdict{border-color:rgba(179,38,30,.45);background:rgba(179,38,30,.05)}
.verdict__head{display:flex;align-items:center;gap:.7rem;margin-bottom:.7rem}
.gate-mark{width:32px;height:32px;flex:none;border-radius:50%;display:grid;place-items:center;
  color:#fff;background:var(--ink-60);font-size:1rem}
[data-verdict="allow"] .gate-mark{background:var(--green-ink)}
[data-verdict="refuse"] .gate-mark{background:var(--refuse)}
.gate-word{font-family:var(--font-head);font-weight:600;font-size:clamp(1.25rem,2vw,1.6rem)}
.gate-why{color:var(--ink-60);margin:0 0 .7rem}
.gate-missing{margin:0 0 .7rem}
.gate-code{font:400 .8rem/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--ink-60);margin:0}  /* ink-40 was 2.68:1 */
[data-slot="summary"]{border:1px solid rgba(179,38,30,.4);border-radius:.7rem;padding:.9rem 1rem;
  margin:0 0 1.1rem;background:rgba(179,38,30,.05)}
[data-slot="summary"] a{color:var(--refuse)}
[data-slot="ok"]{border:1px solid rgba(28,157,87,.45);border-radius:.7rem;padding:1.1rem;background:var(--green-soft)}
[data-slot="error"]{border:1px solid rgba(179,38,30,.4);border-radius:.7rem;padding:1.1rem;background:rgba(179,38,30,.05)}
.hero-plate{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1}
/* the wordmark. ⛔ NOT .ms-tagline — that is a Maine Stays highlight class with a
   white background block, and reusing it here put a white box behind "DBS Cleaning".
   A cloned class name that sounds right is not the same as one that does the job. */
.brandmark{font-family:var(--font-head);font-weight:600;letter-spacing:.005em;
  font-size:clamp(1rem,1.5vw,1.2rem);color:inherit;background:none}
.brandmark b{font-weight:700}
/* the hero eyebrow. ⛔ Blue is LINKS AND FOCUS ONLY under the DBS Cleaning colour law,
   so the source's accent-coloured eyebrow cannot stay blue here. Over a photographic
   hero it takes the cream that the rest of the caption uses. */
.hero-cap .hero-eyebrow{color:rgba(255,255,255,.86)}
.nav:not(.nav--on-video) .brandmark{color:var(--ink)}
/* ⛔ TOUCH TARGETS. The cloned link styles inherit Maine Stays' desktop-first
   sizing and measured 20–22px at 390px — 40 failures on the homepage alone.
   The source is not wrong for its own site; a clone still has to meet the bar
   on the device it is judged on. Measured on the EFFECTIVE target (the anchor
   or its wrapping label), not the icon inside it. */
@media (max-width:899px){
  .nav-links a,.footer-col a,.footer-inner a,.industry-chips a,.home-cta,
  .msgrh__btn,.btn-pill,.footer-legal a,.faq-list a,.check-points a{
    min-height:44px;display:inline-flex;align-items:center}
  .footer-col a,.footer-inner a{width:100%}
  .industry-chips span{display:inline-flex}
}
/* and on desktop the footer/nav links are equally small — the bar is not a
   mobile-only courtesy */
.footer-col a,.footer-inner a{min-height:44px;display:flex;align-items:center}
.nav-links a{min-height:44px;display:inline-flex;align-items:center}
.home-cta{min-height:44px;display:inline-flex;align-items:center}
/* the last ten: the brand anchor, the chip links inside .industry-chips
   (the <a> sits inside a <span>, so the rule above hit the span not the link),
   and the source's own slide/close buttons. Measured again after each pass —
   "fixed the CSS" is not the same as "measured 0". */
.nav-brand,.footer-brand .nav-brand{min-height:44px;display:inline-flex;align-items:center}
.industry-chips span>a,.industry-chips>span>a{min-height:44px;display:inline-flex;align-items:center;padding:0 .2rem}
button:not(.btn-pill):not(.btn-submit){min-height:44px}
/* the final eight: the sector-card HEADING links. Same visible text as the chips,
   which is exactly why the first fix looked like it had worked — two different
   elements, one label. Measure by element, never by the words on it. */
.home-card-body h3 a,.home-card-body h3{min-height:44px;display:flex;align-items:center}
/* ⛔ THE SECOND CLONE MISTAKE OF THIS KIND. .gallery-strip is a HORIZONTAL
   SCROLLER in Maine Stays; used for a single full-bleed image it rendered
   768px wide inside a 390px viewport and broke the page. Like .ms-tagline
   before it, the class name sounded right and did a different job.
   ⛔ A CLONED CLASS NAME IS NOT A CONTRACT. Read what it does, not what it
      is called. Both were caught by MEASURING, not by reading the CSS. */
.pageplate{margin:0;width:100%;overflow:hidden}
.pageplate-img{width:100%;height:clamp(38svh,26svh + 18vw,62svh);object-fit:cover;display:block}

/* ═══ DARK BANDS: THE TEXT MUST BE LIGHT ═══════════════════════════════════
   ⛔ THE BUG THIS FIXES, RECORDED BECAUSE IT WAS INVISIBLE TO EVERY GATE.
      .proof and .homes--showcase are DELIBERATE dark bands in the source —
      .proof-label is rgba(255,255,255,.55), so the source expects white text
      and supplies it through .on-dark on ITS OWN markup. My components
      (.ruled, .check-points, .fleet-note, the gate copy) carry no such class,
      so they inherited --ink and rendered INK TEXT ON AN INK BACKGROUND.
      The page measured 9,186px tall with every section present and every
      claims gate green — and a human saw black voids. A clone inherits the
      source's ASSUMPTIONS about its own markup, not just its CSS. */
.proof, .homes--showcase{color:var(--white)}
.proof h2,.proof h3,.proof p,.proof li,.proof b,.proof strong,.proof .display,
.homes--showcase h2,.homes--showcase h3,.homes--showcase p,.homes--showcase .display{color:var(--white)}
.proof .kicker,.homes--showcase .kicker{color:rgba(255,255,255,.62)}
.proof .band-sub,.proof .fleet-note,.homes--showcase .band-sub,
.homes--showcase .fleet-note,.homes--showcase .home-desc{color:rgba(255,255,255,.78)}
.proof .ruled{color:var(--white)}
.proof .check-points li span{color:rgba(255,255,255,.78)}
.proof .check-points li b{color:var(--white)}
.homes--showcase .home-card-body h3 a{color:var(--white)}
/* ⛔ was color:var(--teal-glow) on a --teal-glow background: blue text on a blue pill, invisible on
   every sector card (5 Sept 2026). On the ink showcase the pill is PAPER: white on ink text. */
.homes--showcase .home-cta{background:#fff;color:var(--ink)}
.homes--showcase .home-cta:hover{background:var(--fog)}
/* the gate sits on the dark band as a WHITE CARD — so its own text stays ink,
   and must be protected from the sweep above */
.proof #gate-out,.proof #gate-out *{color:var(--ink)}
.proof #gate-out .gate-why,.proof #gate-out legend{color:var(--ink-60)}
.proof #gate-out .gate-code{color:var(--ink-60)}
.proof #gate-out [data-gate-word]{color:var(--ink)}
.proof .formpanel,.proof .formpanel *{color:var(--ink)}
/* ⛔ THE GATE'S GHOST BUTTON. theme.css:36 .btn-pill{background:var(--teal)} (ink) beats
   base.css:87 .btn-pill-ghost{background:transparent} at equal specificity, and the
   white-card protection above forces its text to ink: "Clear the file" was an ink pill
   with ink text on every page that renders the gate (5 Sept 2026). (1,2,0) beats both. */
.proof #gate-out .btn-pill-ghost{background:transparent;color:var(--ink);
  box-shadow:inset 0 0 0 1.5px rgba(22,24,26,.35)}
.proof #gate-out .btn-pill-ghost:hover{background:rgba(22,24,26,.06);transform:translateY(-1px)}
/* ⛔ forms.js injects <button class="btn btn--ghost"> into the ok and error states.
   .btn--ghost was styled nowhere; .btn only by the corpus pages.css, which 18 of the 19
   public pages do not load — a browser-default button in the success state. */
.formpanel .btn{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;
  padding:.72rem 1.35rem;border-radius:var(--radius-pill);border:0;cursor:pointer;
  font:600 .84rem/1 var(--font-ui);background:var(--ink);color:#fff;text-decoration:none}
.formpanel .btn--ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px rgba(22,24,26,.35)}
.formpanel .btn--ghost:hover{background:rgba(22,24,26,.06)}

/* ═══ .msgrh — THE PAGE HERO ═══════════════════════════════════════════════
   ⛔ THIS CSS WAS MISSING ENTIRELY AND IT IS THE ALIGNMENT BUG JERMAINE SAW.
      In the source these 22 rules live in an INLINE <style> block inside
      index.html, not in any external stylesheet. I copied base.css, theme.css
      and page.css and never brought the inline block — so every page using
      .msgrh__* rendered with NO styling at all: no max-width, no gutter, no
      button shapes. The headline sat flush at x=0 and the CTAs rendered as
      bare text.
      This is the THIRD time this session I have used a source class without
      its CSS contract (.ms-tagline, .gallery-strip, now .msgrh). The lesson is
      the same each time and it is worth stating once: A CLONE IS THE SOURCE'S
      MARKUP *AND* ITS STYLE RULES. Copying the stylesheets is not copying the
      styles when some of them are inline.
   Rebranded: the source's teal/gold gradient becomes DBS Cleaning ink; the
   primary button becomes a paper pill on ink (the black-pill law inverted for
   a dark ground); green stays out of it entirely — it means VERIFIED. */
.msgrh{position:relative;overflow:hidden;color:#fff;padding:clamp(3rem,7vw,4.75rem) 0;
  background:linear-gradient(115deg,#0f1113 0%,#16181a 52%,#1d2124 100%)}
.msgrh::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.20;
  background:radial-gradient(circle at 14% 80%,#3a3f45 0%,transparent 45%),
             radial-gradient(circle at 88% 15%,#2b3138 0%,transparent 50%)}
/* ⛔ THE ALIGNMENT BUG, MEASURED NOT GUESSED. This had max-width:1160px and
   margin:0 auto, which centres it — so at 1440px the hero copy started at
   212px while EVERY other section on the page started at 72px. A 140px step,
   on all seven sub-pages.
   The site's convention is .section-inner: `padding: 0 var(--pad-x); width:100%`
   with NO max-width — the full-width rule this brand has used since its first
   prototype. The hero was the outlier, so the hero moves, not the convention. */
.msgrh__inner{position:relative;z-index:2;width:100%;
  padding:0 var(--pad-x);display:grid;gap:28px;align-items:center}
.msgrh__eyebrow{font-family:var(--font-ui);font-size:.8rem;letter-spacing:.16em;
  text-transform:uppercase;color:rgba(255,255,255,.62);margin:0 0 10px}
.msgrh__h{font-family:var(--font-head);font-weight:600;
  font-size:clamp(2rem,4.6vw,3.4rem);line-height:1.12;margin:0 0 16px;color:#fff}
.msgrh__lead{color:rgba(255,255,255,.85);max-width:38rem;margin:0 0 22px;font-size:1.02rem;line-height:1.6}
.msgrh__cta{display:flex;flex-wrap:wrap;gap:12px}
.msgrh__btn{display:inline-flex;align-items:center;gap:8px;min-height:var(--tap,44px);
  padding:13px 26px;border-radius:999px;font-family:var(--font-ui);font-weight:600;
  font-size:.94rem;text-decoration:none;transition:transform .2s ease,background .2s ease}
.msgrh__btn--primary{background:#fff;color:var(--ink);
  box-shadow:0 12px 30px rgba(0,0,0,.28)}
.msgrh__btn--primary:hover{transform:translateY(-2px)}
.msgrh__btn--ghost{border:1.5px solid rgba(255,255,255,.5);color:#fff}
.msgrh__btn--ghost:hover{background:rgba(255,255,255,.08)}
@media (max-width:899px){ .msgrh__inner{gap:20px} }
/* the form section: heading and panel share an axis. The panel is centred
   (max-width 44rem, margin-inline auto) so the heading above it is centred too
   — left heading over a centred card reads as a mistake, because it is one. */
.finalcta:not(.dbs-quote) .section-inner{text-align:center}
.finalcta:not(.dbs-quote) .formpanel{text-align:left;margin-inline:auto}
.finalcta:not(.dbs-quote) .kicker{margin-inline:auto}
/* breathing room between the section heading and the form card — they were
   touching, which reads as an overlap rather than a stack */
.finalcta:not(.dbs-quote) .display{margin-bottom:clamp(1.6rem,3vw,2.6rem)}
.finalcta:not(.dbs-quote) .formpanel{margin-top:0}

/* ═══ DBS — THE RECORD. Homepage sections below the hero, and the shared blocks the inner
   pages reuse. 5 September 2026. MORRIS direction · VESPER frame · PAXTON build.
   ⛔ EVERY CLASS HERE IS PREFIXED dbs- so no cloned Maine Stays selector and no corpus
      selector (shell.mjs, build-pages.mjs) can reach it. theme.css is loaded by all
      10,581 generated pages; safety is by class, not by file.
   Light is the record, ink is the weight. ONE rhythm (--dbs-section-pad, which is the
   injected coverage strip's own clamp, so the strip joins it untouched). ONE left edge
   (var(--pad-x) via .section-inner; nothing in scope centres a max-width). ══════════ */
:root{
  --dbs-section-pad: clamp(3rem, 7vw, 5rem);   /* 80px at 1440, 48 at 390 — the strip's value */
  --dbs-ease: cubic-bezier(.22,1,.36,1);        /* the clone's reveal curve, published once */
  --dbs-settle: cubic-bezier(.16,.84,.24,1);
  --dbs-hair: rgba(22,24,26,.10);
  --dbs-hair-ink: rgba(244,243,240,.14);
}
/* ── bands and faces ─────────────────────────────────────────────────────── */
.dbs-band{position:relative;overflow:clip;padding:var(--dbs-section-pad) 0}  /* clip, never hidden: sticky must work inside */
.dbs-band--paper{background:var(--white)}
.dbs-band--fog{background:var(--fog)}
.dbs-band--fogdeep{background:var(--fog-deep)}
.dbs-band--ink{background:var(--ink-deep);color:#fff}
.dbs-band--paper + .dbs-band--fog,.dbs-band--fog + .dbs-band--paper,
.dbs-band--fogdeep + .dbs-band--paper,.dbs-band--paper + .dbs-band--fogdeep{box-shadow:inset 0 1px 0 var(--dbs-hair)}
.dbs-band--ink .kicker{color:rgba(255,255,255,.62)}
.dbs-band--ink .display,.dbs-band--ink h3,.dbs-band--ink p,.dbs-band--ink li,.dbs-band--ink b{color:#fff}
.dbs-band--ink .band-sub{color:rgba(255,255,255,.78)}
/* ⛔ .band-sub is white at 72% in base.css — it was WHITE ON WHITE on every light band
   ("Nothing here is counted, averaged or rounded up." was invisible on #hold, 5 Sept 2026) */
.dbs-band--paper .band-sub,.dbs-band--fog .band-sub,.dbs-band--fogdeep .band-sub{color:var(--ink-60)}
.dbs-band--ink :focus-visible{outline-color:var(--fog)}
.dbs-band--ink .dbs-card :focus-visible,.dbs-band--ink .formpanel :focus-visible{outline-color:var(--ink)}
/* plates: a <picture> with the 9:16 twin on phones; the parallax hook in site.js binds .band-bg img */
.dbs-band .band-bg{position:absolute;inset:0}
.dbs-band .band-bg picture,.dbs-band .band-bg img{display:block;width:100%;height:100%;object-fit:cover}
.dbs-gate .band-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,20,25,.94) 0%,rgba(15,20,25,.88) 55%,rgba(15,20,25,.76) 100%)}
.dbs-quote .band-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,20,25,.93) 0%,rgba(15,20,25,.80) 50%,rgba(15,20,25,.58) 100%)}
@media(max-width:767px){
  .dbs-band .band-bg::after,.coverage--band .band-bg::after{background:linear-gradient(180deg,rgba(13,15,18,.88) 0%,rgba(13,15,18,.66) 55%,rgba(13,15,18,.88) 100%)}
}
/* ── the settings band: eight numbered chips in a 4×2 grid (2×4 on phones) ──────── */
.dbs-chips{list-style:none;margin:clamp(1.4rem,3vh,2.2rem) 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6rem;max-width:64rem}
.dbs-chip{display:flex;align-items:center;gap:.7rem;min-height:48px;padding:0 1rem;border-radius:var(--radius-pill);
  background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  color:#fff;font-family:var(--font-ui);font-weight:600;font-size:.88rem;line-height:1.2;text-decoration:none;
  transition:background .25s var(--dbs-ease),border-color .25s var(--dbs-ease),transform .25s var(--dbs-ease)}
.dbs-chip:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.55);transform:translateY(-1px)}
.dbs-chip__n{font-variant-numeric:tabular-nums;font-size:.72rem;letter-spacing:.08em;opacity:.62}
@media(max-width:1023px){.dbs-chips{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* ── the rule: the law left, the rail right ──────────────────────────────── */
.dbs-rule__grid{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(2rem,5vw,4.5rem);align-items:start}
.dbs-law{font-family:var(--font-head);font-weight:600;font-size:clamp(1.35rem,2.1vw,1.85rem);line-height:1.34;max-width:30ch;
  margin:clamp(1.2rem,2.5vh,1.8rem) 0 0;padding:1.1rem 0;border-top:1px solid var(--ink);border-bottom:1px solid rgba(22,24,26,.16);color:var(--ink)}
.dbs-note{margin:clamp(1.8rem,4vh,2.6rem) 0 0;padding-top:1.1rem;border-top:1px solid var(--dbs-hair);max-width:62ch;font-size:.95rem;line-height:1.55;color:var(--ink-60)}
.dbs-note b{color:var(--ink)}
@media(max-width:1023px){.dbs-rule__grid{grid-template-columns:1fr}}
/* the rail — sh-vetting-rail.js writes --vrail-fill and --vrail-tab and the is-* classes;
   this CSS is ported from the proven prototype (design/safehands-prototype/css/styles.css)
   in its vertical form. The recorded state changes SHAPE as well as colour (dashed ring →
   solid disc, numeral → tick) so meaning is never carried by colour alone, and the state
   WORD beneath each node is ink. Green = a check RECORDED on a demonstration file — the
   one meaning the colour law allows. The lapse is not an alarm: no red, no shake. */
.dbs-rail{position:relative}
.dbs-rule__grid{--vrail-fill:0;--vrail-tab:0}
.dbs-rail__tab{display:inline-flex;align-items:center;gap:.7rem;margin:0 0 1.1rem;padding:.45rem .95rem .45rem .85rem;border-radius:var(--radius-pill);
  background:var(--fog);border:1px solid var(--dbs-hair);font-family:var(--font-ui);font-weight:600;font-size:.66rem;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-60)}
.dbs-rail__tablabel{color:var(--ink-60)}
.vrail__tabwin{display:block;position:relative;height:22px;width:var(--tabw,200px);overflow:hidden;perspective:420px;transition:width .4s var(--dbs-settle)}
.dbs-rail__tab[data-state="pending"]{--tabw:62px}
.dbs-rail__tab[data-state="file-complete"]{--tabw:112px}
.dbs-rail__tab[data-state="not-available"]{--tabw:224px}
.vrail__tabdrum{display:block;position:relative;height:100%;width:100%;transform-style:preserve-3d;
  transform:rotateX(calc(var(--vrail-tab,0) * -120deg));transition:transform .62s var(--dbs-settle)}
.vrail__tabface{position:absolute;inset:0;display:flex;align-items:center;white-space:nowrap;backface-visibility:hidden;-webkit-backface-visibility:hidden;color:var(--ink-60)}
.vrail__tabface:nth-child(1){transform:rotateX(0deg) translateZ(6.35px)}
.vrail__tabface:nth-child(2){transform:rotateX(120deg) translateZ(6.35px);color:var(--green-ink)}
.vrail__tabface:nth-child(3){transform:rotateX(240deg) translateZ(6.35px);color:var(--ink)}
.dbs-rail__steps-wrap{position:relative}
.dbs-rail__steps{list-style:none;margin:0;padding:0;position:relative}
.dbs-rail .vrail__thread{position:absolute;left:19px;top:22px;bottom:22px;width:2px;background:rgba(22,24,26,.14);border-radius:2px;z-index:0}
.dbs-rail .vrail__fill{position:absolute;inset:0;transform-origin:50% 0;transform:scaleY(var(--vrail-fill));background:var(--green);border-radius:inherit;transition:transform .42s var(--dbs-ease)}
.dbs-rail .vrail__seal{position:absolute;inset:0;opacity:0;background:var(--green);border-radius:inherit}
.dbs-rule__grid.is-sealed .vrail__seal{opacity:1;transition:opacity .62s var(--dbs-ease)}
.dbs-rail .vrail__gap{position:absolute;bottom:9%;left:-4px;width:10px;height:2px;background:var(--ink-40);opacity:0;transition:opacity .5s var(--dbs-ease)}
.dbs-rule__grid.is-broken .vrail__gap{opacity:1}
.dbs-rail__step{position:relative;z-index:1;display:grid;grid-template-columns:40px minmax(0,1fr);gap:1rem;align-items:start;padding:.9rem 0;border-bottom:1px solid var(--dbs-hair)}
.dbs-rail__step:first-child{border-top:1px solid var(--dbs-hair)}
.vstep__node{position:relative;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;border:2px dashed rgba(22,24,26,.28);background:var(--white);color:var(--ink-60);
  transition:border-color .34s var(--dbs-ease),background .34s var(--dbs-ease),color .34s var(--dbs-ease),transform .34s var(--dbs-ease)}
.vstep__num{font-family:var(--font-ui);font-weight:600;font-size:.82rem;font-variant-numeric:tabular-nums;transition:opacity .18s var(--dbs-ease)}
.vstep__tick{position:absolute;width:20px;height:20px;color:#fff;opacity:0;transform:scale(.6);transition:opacity .18s var(--dbs-ease),transform .3s var(--dbs-settle)}
.dbs-rail__step.is-done .vstep__node{border-style:solid;border-color:var(--green);background:var(--green);color:#fff}
.dbs-rail__step.is-done .vstep__num{opacity:0}
.dbs-rail__step.is-done .vstep__tick{opacity:1;transform:scale(1)}
.dbs-rail__step.is-broken .vstep__node{border-style:dashed;border-color:var(--ink-40);background:var(--white);color:var(--ink-40);transform:translateX(3px)}
.dbs-rail__body{display:grid;gap:.15rem;min-width:0}
.dbs-rail__head{display:flex;align-items:baseline;gap:.7rem;flex-wrap:wrap}
.dbs-rail__body b{font-family:var(--font-ui);font-weight:600;font-size:1rem;color:var(--ink)}
.dbs-rail__state{font-family:var(--font-ui);font-weight:600;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-60)}
.dbs-rail__state.is-recorded{color:var(--green-ink)}   /* green lands WITH the word, not with the disc (final scorer) */
.dbs-rail__step.is-broken .dbs-rail__state{color:var(--ink)}
.dbs-rail__note{font-size:.95rem;line-height:1.5;color:var(--ink-60);max-width:52ch}
html.dbs-nomotion .vrail__tabdrum,html.dbs-nomotion .vrail__fill,html.dbs-nomotion .vstep__node,html.dbs-nomotion .vstep__tick{transition:none}
/* ── where we clean: eight numbered tiles, 4 → 2 → compact 2 ─────────────── */
.dbs-sectors__head{margin:0 0 clamp(1.6rem,3vh,2.4rem)}
.dbs-tiles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1rem,1.6vw,1.4rem)}
.dbs-tile{position:relative;display:flex;flex-direction:column;background:var(--white);border-radius:var(--radius-card);overflow:hidden;
  border:1px solid rgba(22,24,26,.06);box-shadow:var(--shadow-soft);
  transition:transform .4s var(--dbs-ease),box-shadow .4s var(--dbs-ease),border-color .4s var(--dbs-ease)}
.dbs-tile__media{margin:0;aspect-ratio:4/3;overflow:hidden;background:var(--fog-deep)}
.dbs-tile__media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--dbs-ease)}
.dbs-tile__body{display:flex;flex-direction:column;gap:.45rem;padding:1.05rem 1.2rem 1.25rem;flex:1}
.dbs-tile__n{font-family:var(--font-ui);font-weight:600;font-size:.72rem;letter-spacing:.1em;color:var(--ink-60);font-variant-numeric:tabular-nums}
.dbs-tile__name{margin:0;font-family:var(--font-head);font-weight:600;font-size:1.3rem;line-height:1.15;letter-spacing:-.01em}
.dbs-tile__name a{color:var(--ink);text-decoration:none;display:flex;align-items:center;min-height:44px}
.dbs-tile__name a::after{content:"";position:absolute;inset:0}   /* one link per tile; the whole tile is the target */
.dbs-tile__name a:focus-visible{outline:none}
.dbs-tile:focus-within{box-shadow:var(--shadow-lift),0 0 0 2px var(--ink)}
.dbs-tile__desc{margin:0;font-size:.9rem;line-height:1.5;color:var(--ink-60)}
.dbs-tile__cta{margin-top:auto;padding-top:.5rem;font-family:var(--font-ui);font-weight:600;font-size:.84rem;color:var(--ink);display:inline-flex;gap:.4rem;align-items:center}
.dbs-tile__cta span{transition:transform .25s var(--dbs-ease)}
@media(hover:hover) and (pointer:fine){
  .dbs-tile:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift),0 0 0 1px rgba(22,24,26,.12)}
  .dbs-tile:hover .dbs-tile__media img{transform:scale(1.04)}
  .dbs-tile:hover .dbs-tile__cta span{transform:translateX(4px)}
  .dbs-tile.r-shown:hover{transition-duration:.4s;transition-delay:0s}
}
@media(max-width:1199px){.dbs-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){
  .dbs-tiles{gap:.75rem}
  .dbs-tile{display:grid;border-radius:1rem}
  .dbs-tile__media,.dbs-tile__body{grid-area:1/1}
  .dbs-tile__media{aspect-ratio:4/5}
  .dbs-tile__body{align-self:end;padding:2.4rem .9rem .85rem;gap:.15rem;background:linear-gradient(to top,rgba(9,13,17,.90),rgba(9,13,17,.55) 60%,transparent)}
  .dbs-tile__n{color:rgba(255,255,255,.72)}
  .dbs-tile__name{font-size:1.05rem}
  .dbs-tile__name a{color:#fff}
  .dbs-tile__desc,.dbs-tile__cta{display:none}   /* the one deliberate hide: the sector page carries it */
}
/* ── the gate: the only lit object on the ink plate, verdict pinned ──────── */
.dbs-gate .band-sub{max-width:38rem}
.dbs-gate #gate-out{margin-top:clamp(1.6rem,3vh,2.4rem)}
.dbs-card{box-shadow:0 44px 90px -34px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.06)}
.dbs-gate .verdict{position:sticky;top:96px;align-self:start}
@media(max-width:899px){.dbs-gate .verdict{order:-1;top:72px;z-index:2;background:var(--white)}}
.dbs-verdict{position:relative;overflow:hidden}
.dbs-verdict::before{content:"";position:absolute;left:0;top:0;height:3px;width:100%;transform:scaleX(0);transform-origin:left;background:var(--ink-40)}
[data-verdict="allow"] .dbs-verdict::before{background:var(--green);animation:dbs-rule-a .42s var(--dbs-ease) forwards}
[data-verdict="refuse"] .dbs-verdict::before{background:var(--refuse);animation:dbs-rule-r .42s var(--dbs-ease) forwards}
@keyframes dbs-rule-a{to{transform:scaleX(1)}}
@keyframes dbs-rule-r{to{transform:scaleX(1)}}
[data-verdict="allow"] .gate-mark{animation:dbs-mark-a .32s var(--dbs-settle) both}
[data-verdict="refuse"] .gate-mark{animation:dbs-mark-r .32s var(--dbs-settle) both}
@keyframes dbs-mark-a{from{transform:rotate(-90deg) scale(.6);opacity:0}to{transform:none;opacity:1}}
@keyframes dbs-mark-r{from{transform:rotate(-90deg) scale(.6);opacity:0}to{transform:none;opacity:1}}
[data-verdict="allow"] .dbs-verdict{animation:dbs-press-a .26s var(--dbs-ease)}
[data-verdict="refuse"] .dbs-verdict{animation:dbs-press-r .26s var(--dbs-ease)}
@keyframes dbs-press-a{from{transform:scale(.985)}to{transform:none}}
@keyframes dbs-press-r{from{transform:scale(.985)}to{transform:none}}
/* ── changing provider: sticky plate left, lede and steps right ──────────── */
.dbs-tupe__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,5vw,4.5rem);align-items:start;margin-top:clamp(1.2rem,2.5vh,1.8rem)}
.dbs-tupe__media{margin:0;position:sticky;top:96px;border-radius:var(--radius-card);overflow:hidden;box-shadow:var(--shadow-soft);background:var(--fog)}
.dbs-tupe__media picture,.dbs-tupe__media img{display:block;width:100%}
.dbs-tupe__media img{height:auto;aspect-ratio:4/5;object-fit:cover}
.dbs-lede{margin-top:0;max-width:38rem;font-size:1.02rem;line-height:1.6;color:var(--ink-60)}
.dbs-lede b{color:var(--ink)}
.dbs-tupe .check-points{margin-top:1.2rem}
@media(max-width:1023px){.dbs-tupe__grid{grid-template-columns:1fr}.dbs-tupe__media{position:static}.dbs-tupe__media img{aspect-ratio:16/10}}
/* ── what we hold: the ledger — empty on the left and dated, the letter on the right ── */
.dbs-ledger{display:grid;grid-template-columns:1fr 1fr;margin-top:clamp(1.6rem,3vh,2.4rem)}
.dbs-ledger__col{padding-right:clamp(2rem,5vw,4.5rem)}
.dbs-ledger__col + .dbs-ledger__col{padding-right:0;padding-left:clamp(2rem,5vw,4.5rem);border-left:1px solid var(--dbs-hair)}
.dbs-ledger__label{margin:0 0 1rem;padding-bottom:.6rem;border-bottom:1px solid var(--ink);font-family:var(--font-ui);font-weight:600;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-60)}
.dbs-ledger__rows{list-style:none;margin:0;padding:0}
.dbs-ledger__rows li{height:44px;border-bottom:1px dashed rgba(22,24,26,.18)}   /* lines waiting to be written on; they never move */
.dbs-ledger__stamp{margin:.8rem 0 1rem;font-family:var(--font-ui);font-weight:600;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-60)}
.dbs-ledger__col > p:not([class]){max-width:62ch;font-size:.98rem;line-height:1.6;color:var(--ink-60)}
.dbs-ledger__col > p:not([class]) b{color:var(--ink)}
.dbs-sheet{background:var(--fog);border:1px solid var(--dbs-hair);border-radius:var(--radius-card);padding:clamp(1.2rem,2.5vw,1.8rem)}
.dbs-sheet__title{margin:0 0 .6rem;font-family:var(--font-head);font-weight:600;font-size:1.25rem;color:var(--ink)}
.dbs-sheet p:not(.dbs-sheet__title){margin:0;font-size:.98rem;line-height:1.6;color:var(--ink-60)}
@media(max-width:899px){
  .dbs-ledger{grid-template-columns:1fr}
  .dbs-ledger__col{padding-right:0}
  .dbs-ledger__col + .dbs-ledger__col{padding-left:0;border-left:0;margin-top:1.6rem;padding-top:1.6rem;border-top:1px solid var(--dbs-hair)}
  .dbs-ledger__rows li:nth-child(3){display:none}
}
/* ── get a quote: trust beside the form, on an ink plate ─────────────────── */
.dbs-quote__grid{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(2rem,5vw,4.5rem);align-items:start}
.dbs-quote .band-sub{max-width:34rem}
.dbs-assure{list-style:none;margin:clamp(1.4rem,3vh,2rem) 0 0;padding:0;max-width:34rem}
.dbs-assure li{position:relative;padding:.9rem 0 .9rem 2rem;border-top:1px solid var(--dbs-hair-ink);font-size:.95rem;line-height:1.5;color:rgba(255,255,255,.82)}
.dbs-assure li:last-child{border-bottom:1px solid var(--dbs-hair-ink)}
.dbs-assure li::before{content:"";position:absolute;left:0;top:1.55rem;width:18px;height:1px;background:rgba(255,255,255,.55)}  /* a dash, not a tick: nothing here is verified */
.dbs-assure a{color:#fff;text-decoration:underline;text-decoration-color:rgba(255,255,255,.5);text-underline-offset:3px}
.dbs-quote .formpanel{max-width:none;margin:0;box-shadow:0 44px 90px -34px rgba(0,0,0,.7)}
.dbs-band--ink .formpanel{color:var(--ink)}
.dbs-band--ink .formpanel :is(label,legend,p,h3,input,select,textarea){color:var(--ink)}
.dbs-band--ink .formpanel .field__err,.dbs-band--ink .formpanel [data-slot="summary"] a{color:var(--refuse)}
@media(max-width:1023px){.dbs-quote__grid{grid-template-columns:1fr}}
/* the inner pages' form band keeps its centred panel on a fog face */
.dbs-form .formpanel{box-shadow:var(--shadow-lift)}
/* structural names — declared so the unstyled-class sweep reads them as intended, not forgotten */
.dbs-settings,.dbs-rule,.dbs-sectors,.dbs-hold{isolation:isolate}
.dbs-rule__law,.dbs-tupe__copy,.dbs-quote__copy{min-width:0}
/* the engine's own state classes: the withdraw is a 520ms transition the engine waits for */
.dbs-rule__grid.is-breaking .vrail__fill{transition:transform .52s var(--dbs-ease)}
.dbs-rule__grid.is-static .vrail__fill,.dbs-rule__grid.is-static .vrail__tabdrum,.dbs-rule__grid.is-static .vstep__node,.dbs-rule__grid.is-static .vstep__tick{transition:none}
/* the TUPE steps: the labels share one column so five rows read as a table, not a rag */
.dbs-tupe .check-points li{display:grid;grid-template-columns:auto minmax(9rem,12rem) minmax(0,1fr);column-gap:.9rem;align-items:start;padding:.55rem 0;border-bottom:1px solid var(--dbs-hair)}
.dbs-tupe .check-points li:first-child{border-top:1px solid var(--dbs-hair)}
.dbs-tupe .check-points li b{line-height:1.35}
.dbs-tupe .check-points li span{line-height:1.5}
@media(max-width:640px){
  .dbs-tupe .check-points li{grid-template-columns:auto minmax(0,1fr);row-gap:.15rem}
  .dbs-tupe .check-points li span{grid-column:2}
}
.dbs-rail__demo{margin:1rem 0 0;font-size:.9rem;line-height:1.5;color:var(--ink-60);max-width:52ch}
/* audit, 5 Sept: the settings band keeps a face of its own under the plate; the pinned verdict clears
   the 79px nav; the inline link on the quote plate is a 44px target without moving the text */
.dbs-settings{background:var(--ink-deep)}
.dbs-assure a{display:inline-block;padding:.72rem 0;margin:-.72rem 0}
/* CADENCE review, 5 Sept: (1) the tab drum rides with the rail, so both beats are on screen when
   they happen — before this the drum had scrolled under the nav at every width by the time the
   renewal lapsed, and NOT AVAILABLE was never readable while it was true. section.dbs-rule is
   overflow:clip, which is not a scroll container, so sticky holds. (2) the pinned verdict clears
   the 79px nav. (3) the clone reserved 74px under the body for a sticky bar this site does not
   have. (4) real paragraphs are 16px on a phone. */
:root{--nav-h:79px}
.dbs-rail__tabbar{position:sticky;top:var(--nav-h);z-index:3;background:var(--white);padding:.5rem 0 .6rem;margin:0 0 .5rem;box-shadow:0 1px 0 var(--dbs-hair)}   /* the pill has a lane: rows scroll under a clean edge */
.dbs-rail__tab{position:static;width:max-content;margin:0}
@media(max-width:899px){.dbs-gate .verdict{top:calc(var(--nav-h) + 8px)}}
@media(max-width:768px){body{padding-bottom:0}}
@media(max-width:767px){.dbs-note,.dbs-assure li,.dbs-ledger__col > p:not([class]),.dbs-sheet p:not(.dbs-sheet__title),.dbs-rail__note,.dbs-lede{font-size:1rem}}
/* MORRIS judge, 5 Sept (80/100 before these): the fix list */
.sh-field[hidden]{display:none}                        /* the level select rendered at idle: display:block beat [hidden] */
.display{text-wrap:balance}
.dbs-law{text-wrap:pretty}
@media(max-width:639px){.dbs-br{display:none}}         /* the gate heading's hard break stranded "it." on a phone */
b,strong{font-weight:600}                              /* Barlow 600 is now requested, so bold is no longer synthetic */
#coverage h2{font-size:clamp(1.9rem,4vw,3.1rem);letter-spacing:-.025em;line-height:1.12}   /* one display scale; the strip's markup is untouched */
[data-slot="summary"] ul{list-style:none;margin:.3rem 0 0;padding:0}
.formpanel[data-state="sending"] .btn-submit{opacity:.6;pointer-events:none}
@media(max-width:899px){.dbs-gate .verdict{max-height:42svh;overflow:auto}}   /* a pinned card, not half the phone */
.dbs-chip{padding:.55rem 1rem;line-height:1.25}        /* wrapped chip labels breathe */
@media(max-width:560px){.btn-pill{font-size:.9rem}}
@media(max-width:1023px){.dbs-tupe__media img{object-position:50% 20%}}   /* keep the head in the 16:10 crop */
@media(max-width:640px){.dbs-rail__tablabel{display:none}}
/* Re-judge, 5 Sept (83/100): the second fix list */
.dbs-rail__stick{position:relative}                    /* the sticky tab's containing block ends before the disclaimer */
@media(max-width:899px){#nav .btn-pill{display:inline-flex;padding:.55rem 1rem;font-size:.8rem;margin-left:auto;margin-right:.5rem}}   /* the primary action stays in the header on a phone */
@media(max-width:899px){.dbs-gate .verdict{max-height:34svh}}
.dbs-note,.dbs-lede{font-size:1rem;line-height:1.55}
#coverage h2{letter-spacing:-.01em}
#coverage .pg-kicker{font-size:.8rem}
/* one chip language: the strip's pills take the settings chips' geometry (CSS only; the strip's markup is shared with 10,581 pages) */
#coverage .pg-chip{min-height:48px;padding:0 1rem;border:1px solid rgba(22,24,26,.18);background:#fff;font-family:var(--font-ui);font-weight:600;font-size:.88rem;border-radius:var(--radius-pill);transition:border-color .25s var(--dbs-ease),transform .25s var(--dbs-ease)}
#coverage .pg-chip:hover{border-color:var(--ink);transform:translateY(-1px)}
/* TUPE steps are the outgoing provider's duties, not recorded checks: a dot, not a tick */
.dbs-tupe .check-points li::before{-webkit-mask:none;mask:none;width:6px;height:6px;margin-top:.55rem;border-radius:50%}
.nav-toggle{width:44px}
/* Third judge, 5 Sept (87/100): the fix list */
.proof #gate-out .gate-mark{color:#fff}                /* .proof #gate-out * forced the ✓ and ✕ to ink on the coloured disc (2.72:1) */
.formpanel :is(input,select,textarea):disabled{background:var(--fog);color:var(--ink-60);border-style:dashed;cursor:not-allowed}
.formpanel .btn-submit:disabled{opacity:.5;cursor:not-allowed}
@media(max-width:640px){.gate-code__note{display:none}.gate-why{font-size:.92rem}}   /* every refusal shows its code inside the 34svh cap */
/* Fourth judge, 5 Sept (84/100): the lane, the pill, the level */
.dbs-rail__tab{font-size:.72rem}                        /* the ONE moment's readout was the smallest type on the page (10.56px); now 11.52px, the state words' size */
.dbs-rail__tab[data-state="pending"]{--tabw:70px}
.dbs-rail__tab[data-state="file-complete"]{--tabw:114px}
.dbs-rail__tab[data-state="not-available"]{--tabw:236px}
.vrail__tabface{inset:0 3px}                             /* perspective scales a face by 1.5%, so the N of NOT AVAILABLE lost its stem at the window's edge */
/* (the lane spacer now runs at every width — see the final scorer's block) */   /* the lane runs 96px past the demonstration sentence: room to read the refusal before the pill leaves */
@media(max-width:767px){.dbs-gate .band-bg::after{background:linear-gradient(180deg,rgba(15,20,25,.97) 0%,rgba(15,20,25,.93) 45%,rgba(15,20,25,.84) 100%)}}   /* the gate heading's worst pixel over the doorframe was 2.05:1 on a phone */
.dbs-hold p,.dbs-sheet p{text-wrap:pretty}              /* "check." alone on the last line at 390 */
/* Fourth judge, items 6 and 7: the verdict panel is a page, not a note */
@media(min-width:900px){
  .dbs-gate .verdict{position:relative;top:auto;align-self:stretch;display:flex;flex-direction:column}   /* the card's right page: as tall as the form, the word at the head, the code at the foot — not a note above 450px of white */
  .dbs-gate .verdict .gate-code{margin-top:auto;padding-top:1.4rem}
}
@media(max-width:899px){
  .dbs-gate .verdict{order:0;top:auto;bottom:0;box-shadow:0 -10px 28px rgba(0,0,0,.14)}   /* a sheet at the foot of the phone: it covers nothing the reader has reached, and the verdict changes beside the thumb */
}
/* Re-check judge, 5 Sept (85/100): the orphans, the lane's foot, the drum window, the ladder */
.dbs-band p,.dbs-band li,.band-sub,.dbs-note,.dbs-lede,.gate-why,.dbs-rail__demo{text-wrap:pretty}   /* "method." and "placed." alone on a last line */
/* (superseded below) */   /* the lane still runs 80px past the sentence, but inside the section's own padding: no slack at the foot */
.vrail__tabwin{transition-duration:.3s}                 /* the window reaches its width before the third face turns to the front: no "PLACEMEN" frame */
.dbs-ladder{font-size:.9rem;line-height:1.5}
.proof #gate-out .dbs-ladder,.proof #gate-out .dbs-ladder span,.proof #gate-out .dbs-ladder__title,.proof #gate-out .dbs-ladder__sub{color:var(--ink-60)}
.dbs-ladder__title{margin:0;font-family:var(--font-ui);font-weight:600;font-size:.72rem;letter-spacing:.13em;text-transform:uppercase}
.dbs-ladder__sub{margin:.35rem 0 .9rem}
.dbs-ladder__list{list-style:none;margin:0;padding:0}
#gate-out .dbs-ladder__list li{display:grid;grid-template-columns:minmax(0,11.5rem) minmax(0,1fr);gap:.8rem;align-items:baseline;padding:.5rem 0;border-top:1px solid var(--dbs-hair);font-size:.9rem}
#gate-out .dbs-ladder__list li::before{content:none}   /* the card is a .check-points list: its 18px tick was becoming a third grid item and every description wrapped into the code column (908px of ladder) */
.dbs-ladder__list code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8rem;letter-spacing:0}
@media(min-width:900px){
  #gate-out{grid-template-rows:auto 1fr}
  .dbs-gate #gate-out form{grid-row:1/3}
  .dbs-gate .verdict{align-self:start;display:block}    /* the verdict is a note again — with the ladder beneath it the column is a page of content, not a plate */
  .dbs-gate .verdict .gate-code{margin-top:0;padding-top:0}
  .dbs-ladder{grid-column:2;grid-row:2;align-self:end}
}
@media(max-width:899px){.dbs-ladder{padding-top:1.2rem;border-top:1px solid var(--dbs-hair)}}
@media(max-width:640px){#gate-out .dbs-ladder__list li{grid-template-columns:1fr;gap:.15rem}}
/* Sign-off judge, 5 Sept (87/100, no band under the floor): the last five */
.dbs-settings :focus-visible{outline-color:var(--fog)}                          /* the chips are the first controls below the hero and their ring was ink on ink-deep (1.03:1) */
.formpanel [data-slot="ok"]:not([hidden]),.formpanel [data-slot="error"]:not([hidden]){margin-top:1rem}   /* the honest state sat 0px under the button */
.dbs-rail__tab[data-state="not-available"] .vrail__tabdrum{transition-delay:.3s}   /* the window widens BEFORE the third face turns to the front: no clipped "PLACEMEN" frame */
#gate-out .dbs-ladder__list li.is-fired{box-shadow:inset 3px 0 0 var(--ink);padding-left:.8rem}   /* the ladder marks where the gate stopped */
.proof #gate-out .dbs-ladder__list li.is-fired span{color:var(--ink)}
#gate-out[data-verdict="allow"] .dbs-ladder__list li.is-fired{box-shadow:inset 3px 0 0 var(--green)}
#gate-out[data-verdict="refuse"] .dbs-ladder__list li.is-fired{box-shadow:inset 3px 0 0 var(--refuse)}
.dbs-chip__n{white-space:nowrap}
@media(max-width:400px){.dbs-chip{padding:.55rem .8rem;font-size:.86rem;gap:.55rem}}   /* "05 Serviced accommodation" touched the pill's curve at 390 */
@media(max-width:899px){.dbs-gate .verdict{max-height:30svh}}                  /* the sheet takes less of the phone while the form is in view; the longest verdict is 235px */
/* Final scorer, 5 Sept (85/100): the chip digits, two labels, the lane's foot on a phone, the crop, the ring */
.dbs-rail__stick::after{content:"";display:block;height:3.5rem}   /* a bar-height spacer ends the lane: the pill rests on it, above the disclaimer, and the disclaimer never passes under the bar */
.dbs-rail__demo{margin-top:.25rem}
.dbs-settings .kicker{color:rgba(255,255,255,.78)}      /* worst pixel over the plate was 4.0:1 at 12.8px */
@media(max-width:640px){.dbs-tile__n{color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.6)}}   /* worst pixel over the photo was 3.21:1 at 11.5px */
.dbs-tupe__media img{object-position:50% 20%}           /* the 4:5 crop at 1440 was cutting the head; the phone rule was the only one */
.opt input[type="radio"]{appearance:none;-webkit-appearance:none;width:20px;height:20px;margin:0;border:1.5px solid var(--ink);border-radius:50%;background:var(--white);display:grid;place-content:center;cursor:pointer}   /* a native radio ignores border-radius, so its ring was square: now an ink control whose ring follows its shape */
.opt input[type="radio"]::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--ink);transform:scale(0);transition:transform .12s var(--dbs-ease)}
.opt input[type="radio"]:checked::before{transform:scale(1)}