/* cleaners section — scoped under .cleaners-wrap (desktop) / .cleaners-wrap-m (mobile).
   Skipped: *, html/body resets, img{display:block} — already in tokens.css / hero.css. */

/* ── desktop ─────────────────────────────────────────────────────────── */
.cleaners-wrap{width:100%;background:var(--surface);overflow-x:clip}
.cleaners-wrap-m{display:none}

/* ── shared: cleaner card ──────────────────────────────────────────────── */
.cleaners-wrap .cl-card,.cleaners-wrap-m .cl-card{
  position:relative;background:var(--white);border-radius:var(--r-card);flex:none}
.cleaners-wrap .cl-card .photo,.cleaners-wrap-m .cl-card .photo{
  position:absolute;overflow:hidden;border-radius:98px;background:#D9D9D9}
.cleaners-wrap .cl-card .photo img,.cleaners-wrap-m .cl-card .photo img{
  width:100%;height:100%;object-fit:cover}
.cleaners-wrap .cl-name,.cleaners-wrap-m .cl-name{
  position:absolute;font-size:var(--fs-lead);line-height:var(--lh-lead);color:var(--ink)}
.cleaners-wrap .cl-desc,.cleaners-wrap-m .cl-desc{
  position:absolute;font-size:var(--fs-nav);line-height:var(--lh-nav);color:var(--ink)}
.cleaners-wrap .cl-stat,.cleaners-wrap-m .cl-stat{
  position:absolute;font-size:var(--fs-nav);line-height:var(--lh-nav);color:var(--ink)}
.cleaners-wrap .cl-rating,.cleaners-wrap-m .cl-rating{
  position:absolute;display:flex;align-items:center;justify-content:center;
  font-size:var(--fs-nav);line-height:var(--lh-nav);color:var(--ink)}
.cleaners-wrap .cl-rating .sub,.cleaners-wrap-m .cl-rating .sub{color:var(--muted)}
.cleaners-wrap .cl-form,.cleaners-wrap-m .cl-form{
  position:absolute;font-size:var(--fs-micro);line-height:var(--lh-micro);color:var(--muted)}
.cleaners-wrap .cl-badges,.cleaners-wrap-m .cl-badges{
  position:absolute;display:flex;gap:8px}
.cleaners-wrap .cl-badges span,.cleaners-wrap-m .cl-badges span{
  background:var(--surface);border-radius:var(--r-card);
  font-size:var(--fs-micro);line-height:var(--lh-micro);color:var(--ink);white-space:nowrap}
.cleaners-wrap .cl-btn,.cleaners-wrap-m .cl-btn{
  position:absolute;display:flex;align-items:center;justify-content:center;gap:8px;
  background:var(--ink);border-radius:var(--r-pill)}
.cleaners-wrap .cl-btn span,.cleaners-wrap-m .cl-btn span{
  font-size:var(--fs-btn);line-height:var(--lh-btn);color:var(--white)}
.cleaners-wrap .cl-btn img,.cleaners-wrap-m .cl-btn img{width:16px;height:16px}

/* ── shared: benefit card ─────────────────────────────────────────────── */
.cleaners-wrap .bn-card,.cleaners-wrap-m .bn-card{
  flex:none;width:267px;height:374px;background:var(--white);border-radius:var(--r-card);
  padding:20px;display:flex;flex-direction:column}
.cleaners-wrap .bn-card .img,.cleaners-wrap-m .bn-card .img{
  width:227px;height:160px;border-radius:var(--r-card);background:#D9D9D9;overflow:hidden}
.cleaners-wrap .bn-card .img img,.cleaners-wrap-m .bn-card .img img{
  width:100%;height:100%;object-fit:cover}
.cleaners-wrap .bn-title,.cleaners-wrap-m .bn-title{
  margin-top:20px;max-width:204px;font-size:var(--fs-body);line-height:var(--lh-body);color:var(--ink)}
.cleaners-wrap .bn-card:nth-child(4) .bn-title{max-width:181px}
.cleaners-wrap .bn-desc,.cleaners-wrap-m .bn-desc{
  margin-top:8px;font-size:var(--fs-body-sm);line-height:var(--lh-body-sm);color:var(--muted)}

/* ── shared: interview card ───────────────────────────────────────────── */
.cleaners-wrap .iv-card,.cleaners-wrap-m .iv-card{
  position:relative;flex:none;background:var(--white);border:1px solid var(--border);border-radius:var(--r-card)}
.cleaners-wrap .iv-av,.cleaners-wrap-m .iv-av{
  border-radius:50%;background:#D9D9D9;border:1px solid var(--border);overflow:hidden}
.cleaners-wrap .iv-av img,.cleaners-wrap-m .iv-av img{
  width:100%;height:100%;object-fit:cover;object-position:50% 14%}
.cleaners-wrap .iv-name,.cleaners-wrap-m .iv-name{
  font-size:var(--fs-lead);line-height:var(--lh-lead);color:var(--ink)}
.cleaners-wrap .iv-div,.cleaners-wrap-m .iv-div{height:1px;background:var(--border)}
.cleaners-wrap .iv-quote,.cleaners-wrap-m .iv-quote{
  font-size:var(--fs-para);line-height:var(--lh-para);color:var(--ink)}
.cleaners-wrap .fw-med,.cleaners-wrap-m .fw-med{font-weight:500}
.cleaners-wrap .link,.cleaners-wrap-m .link{color:var(--link);text-decoration:underline}

/* ── desktop inner layout ─────────────────────────────────────────────── */
.cleaners-wrap .d-inner{max-width:1440px;margin-inline:auto;padding:110px 140px}
.cleaners-wrap .d-h2{max-width:640px;font-size:var(--fs-h2);line-height:var(--lh-h2)}
.cleaners-wrap .d-lead{margin-top:24px;max-width:900px;font-size:var(--fs-body);line-height:var(--lh-body)}
.cleaners-wrap .d-tags{margin-top:28px;display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.cleaners-wrap .d-tags span{background:var(--white);border-radius:var(--r-card);padding:8px 12px;
  font-size:var(--fs-caption);line-height:var(--lh-caption);color:var(--ink);white-space:nowrap}
.cleaners-wrap .d-tags img{width:16px;height:16px}
.cleaners-wrap .d-note{margin-top:24px;max-width:990px;font-size:var(--fs-para);line-height:var(--lh-para);color:var(--ink)}
.cleaners-wrap .d-arrows{margin-top:32px;display:flex;justify-content:flex-end;gap:30px}
.cleaners-wrap .d-arrows img{width:25px;height:20px;cursor:pointer}

.cleaners-wrap .d-carousel{margin-top:20px;
  margin-inline:calc(50% - 50vw);padding-left:calc(50vw - 50%);
  display:flex;gap:30px;overflow-x:auto;scrollbar-width:none}
.cleaners-wrap .d-carousel::-webkit-scrollbar{display:none}
.cleaners-wrap .d-carousel .cl-card{width:367px;height:468px}
.cleaners-wrap .d-carousel .photo{left:198px;top:123px;width:168px;height:231px}
.cleaners-wrap .d-carousel .cl-name{left:28px;top:85px;max-width:140px}
.cleaners-wrap .d-carousel .cl-desc{left:28px;top:129px;width:168px}
.cleaners-wrap .d-carousel .cl-stat{left:28px;top:259px}
.cleaners-wrap .d-carousel .cl-rating{left:253px;top:81px;width:87px;height:38px}
.cleaners-wrap .d-carousel .cl-form{left:28px;top:320px;width:170px}
.cleaners-wrap .d-carousel .cl-badges{left:28px;top:32px}
.cleaners-wrap .d-carousel .cl-badges span{padding:8px 12px}
.cleaners-wrap .d-carousel .cl-btn{left:28px;top:386px;width:311px;height:50px}

.cleaners-wrap .d-listate{margin:40px auto 0;max-width:880px;text-align:center;
  font-size:var(--fs-btn);line-height:var(--lh-btn);color:var(--muted)}
.cleaners-wrap .d-cta{margin:24px auto 0;width:368px;height:50px;
  background:var(--accent);border-radius:var(--r-pill);text-decoration:none;
  display:flex;align-items:center;justify-content:center}
.cleaners-wrap .d-cta span{font-size:var(--fs-btn);line-height:var(--lh-btn);color:var(--ink)}

.cleaners-wrap .d-benefits{margin-top:60px;display:flex;gap:30px}
.cleaners-wrap .d-more{margin-top:40px;max-width:990px;font-size:var(--fs-para);line-height:var(--lh-para);color:var(--ink)}
.cleaners-wrap .d-bring{margin-top:16px;max-width:1158px;font-size:var(--fs-btn);line-height:var(--lh-btn);color:var(--muted)}

.cleaners-wrap .d-ivhead{margin-top:60px;font-size:32px;line-height:38.4px;color:var(--ink)}
.cleaners-wrap .d-interviews{margin-top:32px;display:flex;gap:30px}
.cleaners-wrap .d-interviews .iv-card{width:565px;height:477px}
.cleaners-wrap .d-interviews .iv-av{position:absolute;left:28px;top:32px;width:60px;height:60px}
.cleaners-wrap .d-interviews .iv-name{position:absolute;left:100px;top:48px}
.cleaners-wrap .d-interviews .iv-div{position:absolute;left:28px;top:108px;width:276px}
.cleaners-wrap .d-interviews .iv-quote{position:absolute;left:28px;top:133px;width:493px}

.cleaners-wrap .d-quotes{margin-top:40px;display:flex;gap:30px}
.cleaners-wrap .d-quotes .q{width:565px;background:var(--white);border:1px solid var(--border);
  border-radius:var(--r-card);padding:20px}
.cleaners-wrap .qt-title{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--ink)}
.cleaners-wrap .qt-text{margin-top:8px;font-size:var(--fs-body-sm);line-height:var(--lh-body-sm);color:var(--muted)}
.cleaners-wrap .d-tail{margin-top:40px;max-width:1161px;font-size:var(--fs-btn);line-height:var(--lh-btn);color:var(--muted)}

/* ── mobile ───────────────────────────────────────────────────────────── */
@media(max-width:767px){
  .cleaners-wrap{display:none}
  .cleaners-wrap-m{display:block;background:var(--surface);padding:64px 0}
}
.cleaners-wrap-m .m-pad{padding:0 28px}
.cleaners-wrap-m .m-h2{max-width:319px;font-size:24px;line-height:26.4px}
.cleaners-wrap-m .m-lead{margin-top:24px;max-width:319px;font-size:16px;line-height:20.8px}
.cleaners-wrap-m .m-tags{margin-top:28px;display:flex;flex-wrap:wrap;align-items:center;gap:8px;max-width:319px}
.cleaners-wrap-m .m-tags span{background:var(--white);border-radius:var(--r-card);padding:8px 12px;
  font-size:var(--fs-caption);line-height:var(--lh-caption);color:var(--ink);white-space:nowrap}
.cleaners-wrap-m .m-tags img{width:16px;height:16px}
.cleaners-wrap-m .m-note{margin-top:24px;max-width:319px;font-size:14px;line-height:20.72px;color:var(--ink)}

.cleaners-wrap-m .m-carousel{margin-top:36px;display:flex;gap:20px;padding:0 28px;scroll-padding:0 28px;
  overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none}
.cleaners-wrap-m .m-carousel::-webkit-scrollbar{display:none}
.cleaners-wrap-m .m-carousel .cl-card{width:304px;height:441px;scroll-snap-align:start}
.cleaners-wrap-m .m-carousel .photo{left:167px;top:108px;width:137px;height:231px}
.cleaners-wrap-m .m-carousel .cl-name{left:16px;top:70px;max-width:140px}
.cleaners-wrap-m .m-carousel .cl-desc{left:16px;top:114px;width:168px}
.cleaners-wrap-m .m-carousel .cl-stat{left:16px;top:244px}
.cleaners-wrap-m .m-carousel .cl-rating{left:205px;top:66px;width:87px;height:38px}
.cleaners-wrap-m .m-carousel .cl-form{left:16px;top:305px;width:170px}
.cleaners-wrap-m .m-carousel .cl-badges{left:16px;top:20px}
.cleaners-wrap-m .m-carousel .cl-badges span{padding:7px 10px;font-size:10px;line-height:14px}
.cleaners-wrap-m .m-carousel .cl-btn{left:16px;top:371px;width:272px;height:50px}

.cleaners-wrap-m .m-listate{margin-top:24px;max-width:319px;text-align:center;
  font-size:var(--fs-micro);line-height:var(--lh-micro);color:var(--muted)}
.cleaners-wrap-m .m-cta{margin-top:24px;width:319px;height:50px;background:var(--accent);border-radius:var(--r-pill);text-decoration:none;
  display:flex;align-items:center;justify-content:center}
.cleaners-wrap-m .m-cta span{font-size:var(--fs-btn);line-height:var(--lh-btn);color:var(--ink)}

.cleaners-wrap-m .m-benefits{margin-top:36px;display:flex;gap:20px;padding:0 28px;scroll-padding:0 28px;
  overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none}
.cleaners-wrap-m .m-benefits::-webkit-scrollbar{display:none}
.cleaners-wrap-m .m-benefits .bn-card{scroll-snap-align:start}

.cleaners-wrap-m .m-more{margin-top:24px;max-width:319px;font-size:var(--fs-para);line-height:var(--lh-para);color:var(--ink)}
.cleaners-wrap-m .m-bring{margin-top:16px;max-width:319px;font-size:var(--fs-micro);line-height:var(--lh-micro);color:var(--muted)}
.cleaners-wrap-m .m-ivhead{margin-top:36px;max-width:292px;font-size:20px;line-height:24px;color:var(--ink)}
.cleaners-wrap-m .m-iv{margin-top:20px;width:319px;padding:32px 20px}
.cleaners-wrap-m .m-iv .iv-av{width:60px;height:60px;display:inline-block;vertical-align:middle}
.cleaners-wrap-m .m-iv .iv-name{display:inline-block;vertical-align:middle;margin-left:12px}
.cleaners-wrap-m .m-iv .iv-div{display:block;margin:16px 0;width:276px}
.cleaners-wrap-m .m-quotes{margin-top:24px;display:flex;flex-direction:column;gap:20px;max-width:319px}
.cleaners-wrap-m .m-quotes .q{background:var(--white);border:1px solid var(--border);border-radius:var(--r-card);padding:20px}
.cleaners-wrap-m .qt-title{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--ink)}
.cleaners-wrap-m .qt-text{margin-top:8px;font-size:var(--fs-body-sm);line-height:var(--lh-body-sm);color:var(--muted)}
.cleaners-wrap-m .m-tail{margin-top:24px;max-width:319px;font-size:var(--fs-micro);line-height:var(--lh-micro);color:var(--muted)}
.cleaners-wrap-m .m-link{margin-top:16px;max-width:319px;font-size:var(--fs-para);line-height:var(--lh-para);color:var(--ink)}