/* Exact card 4 structure with clearer mobile hierarchy; all existing service routes retained. */
body{font-family:Inter,Arial,sans-serif}.hero h1,.brand-txt,.sec-head h2,.steps strong,.card h3{font-family:Inter,Arial,sans-serif}.top .phone{display:none}.top .brand-txt{font-size:28px}.top>.wrap{min-height:76px}.hero-grid{min-height:420px;grid-template-columns:1.08fr .92fr}.hero-copy{padding:40px 15px 36px 0}.hero h1{font-size:clamp(38px,3.65vw,56px);line-height:1.12;max-width:20ch}.hero .lede{font-size:23px;line-height:1.4}.hero-side>img{object-position:60% center}.hero-copy::after{display:none}.hero-copy .referral-note{font-size:14px}.section{padding:32px 0}.cards.n4{grid-template-columns:repeat(4,minmax(0,1fr))}.card{padding:24px 20px;border:0;box-shadow:none;border-radius:10px}.card h3{margin:0;font-weight:700}.card h3 a{align-items:center}.tile{flex-basis:65px;width:65px;height:65px;background:transparent;border-radius:0}.glyph{width:52px;height:52px}.card p{display:none}.steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:36px}.steps strong{font-weight:700}.steps li:after{height:0;border-top:1px solid #345d80}.steps span{font-size:15px}.hero .btn{font-size:18px;min-height:60px;padding:17px 25px}.top nav .cta{max-width:340px;white-space:normal;line-height:1.3}
@media(max-width:1000px){.hero h1{font-size:40px}.hero .lede{font-size:18px}.top .brand-txt{font-size:23px}.top>.wrap{flex-wrap:wrap;padding-block:14px;gap:15px}.top nav{flex-wrap:wrap}.cards.n4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.hero-grid{display:flex}.hero-copy{padding:32px 0}.hero h1{font-size:clamp(34px,9.2vw,49px)}.hero .lede{font-size:18px}.hero .btn{font-size:16px}.steps{grid-template-columns:1fr}.top nav .cta{max-width:100%}.hero-side{min-height:285px}.cards.n4{grid-template-columns:repeat(2,minmax(0,1fr))}.card{padding:20px 14px}.card h3 a{display:block}.tile{margin-bottom:12px}.card h3{font-size:16px}}
@media(max-width:390px){.cards.n4{grid-template-columns:1fr}.card h3 a{display:flex}.tile{margin:0}.top .brand-txt{font-size:23px}}

/* Card 4 refinement: preserve its navy/ochre room world and all enquiry copy. */
@media(min-width:1001px){.hero-side{margin-left:-110px;width:calc(100% + 110px);mask-image:linear-gradient(to right,transparent,#000 110px)}.hero-copy{padding-right:12px}.hero h1{max-width:22ch}.hero-grid{min-height:414px}}
#services .card{transition:background-color .18s ease,transform .18s ease,box-shadow .18s ease}
#services .card:hover{background:#fffaf0;box-shadow:0 8px 20px rgb(16 52 95 / .10)}
#services .glyph{width:58px;height:58px;color:#235b81}
#services .card h3 a:focus-visible{outline:3px solid #10345f;outline-offset:8px;border-radius:3px}
@media(max-width:700px){.top>.wrap{gap:12px}.top nav{display:grid;grid-template-columns:repeat(3,1fr);gap:4px 12px}.top nav .cta{grid-column:1/-1;justify-self:start}.hero h1{max-width:18ch;font-size:clamp(32px,8.9vw,42px);line-height:1.12}.hero-side{min-height:250px}.cards.n4{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}#services .card{padding:18px 12px}#services .card h3 a{display:flex;flex-direction:column;align-items:flex-start;gap:8px}#services .tile{height:54px;width:54px;flex-basis:54px;margin:0}#services .glyph{height:50px;width:50px}#services .card h3{font-size:16px;line-height:1.35}.steps{gap:26px}.hero .btn{width:100%;justify-content:space-between}.hero .referral-note{line-height:1.6}}
@media(prefers-reduced-motion:reduce){#services .card{transition:none}}

/* Card 4 proportional finish: original words, current clean room plate and self-hosted type. */
@media(min-width:1101px){.top .wrap,.hero .wrap,#services .wrap,#how-it-works .wrap{width:min(1320px,88%)}.top>.wrap{min-height:70px}.top .brand-txt{font-size:32px;letter-spacing:-.03em}.top nav a{font-size:15px}.hero-grid{grid-template-columns:1.2fr .8fr;min-height:414px}.hero h1{font-size:clamp(48px,3.65vw,56px);line-height:1.12;max-width:none;letter-spacing:-.035em}.headline-opening{display:block}.hero-copy{padding:34px 10px 32px 0}.hero .lede{font-size:24px;line-height:1.4}.hero .btn{font-size:19px;padding:17px 26px;min-height:60px}.hero-side{margin-left:-160px;width:calc(100% + 160px);mask-image:linear-gradient(to right,transparent 0,transparent 120px,#000 220px)}.hero-side>img{object-position:58% center}#services{padding:24px 0}#services .sec-head{margin-bottom:16px}#services .sec-head p{font-size:14px;margin-top:6px}#services .card{min-height:120px;padding:24px 18px}#services .card h3{font-size:18px}#services .tile{flex-basis:60px;width:60px;height:60px}#how-it-works{padding:26px 0 34px}#how-it-works .steps{margin-top:24px}}
@media(max-width:1100px){.headline-opening{display:inline}}

/* F5: restore the selected foreground plant and full right-edge room framing.
   Existing room bytes, copy, typeface and narrow/mobile rules remain intact. */
@media(min-width:1101px){
 .hero h1{font-size:clamp(48px,3.4vw,52px)}
 .hero-side{margin-left:-139px;width:calc(100% + 139px + (100vw - min(1320px,88vw))/2);mask-image:linear-gradient(to right,transparent,#000 48px);background:#fff}
 .hero-side>img{object-fit:contain;object-position:right center}
}

/* F7: keep the existing room and plant clear of live copy in the intermediate desktop band. */
@media(min-width:1101px) and (max-width:1400px){
 .hero .lede{max-width:calc(100% - 149px)}
}