/* Much Cleaner — layout for the segment landing pages
   (/letting-agents, /landlords, /tenants, /airbnb-cleaning, /offices).
   Tokens and components come from site.css; this file is layout only, so the
   five pages stay identical to each other and to the rest of the site. */
.hero{padding:var(--s-6) 0 var(--s-6);}
@media(min-width:900px){.hero{padding:var(--s-8) 0 var(--s-7);}}
.hero-grid{display:grid;gap:var(--s-6);align-items:start;}
@media(min-width:940px){.hero-grid{grid-template-columns:1fr 460px;gap:var(--s-8);}}
.hero h1{margin-bottom:var(--s-4);max-width:20ch;}
.hero .lead{font-size:var(--fs-3);color:var(--muted);}
.points{list-style:none;padding:0;display:grid;gap:var(--s-4);margin-top:var(--s-5);}
.points li{padding-left:var(--s-4);border-left:2px solid var(--blue);}
.points b{display:block;font-family:var(--serif);font-weight:600;font-size:var(--fs-3);color:var(--navy);margin-bottom:2px;}
.points span{color:var(--muted);font-size:var(--fs-1);}
.book-card{background:var(--white);border:1px solid var(--rule);border-radius:var(--r-lg);padding:var(--s-5);}
@media(max-width:480px){.book-card{padding:var(--s-4);}}
.book-card h2{font-size:22px;margin-bottom:var(--s-1);}
.book-card .lead{color:var(--muted);font-size:var(--fs-1);margin-bottom:var(--s-4);}
.rates{list-style:none;padding:0;display:grid;gap:6px;font-size:var(--fs-1);color:var(--muted);margin-top:var(--s-3);}
.rates li{display:flex;justify-content:space-between;gap:var(--s-3);border-bottom:1px solid var(--rule);padding:6px 0;}
.rates li b{font-family:var(--serif);color:var(--navy);font-weight:600;white-space:nowrap;}