/* ============================================================
   Beneva Handyman Services — Section Library
   New modular sections added for launch. Uses the existing v4h
   palette only: navy-900 #33101a · navy-800 #4a1622 ·
   brand-700 #7e1b2a · brand-600 #9e2233 · brand-500 #b32738 ·
   navy-50 #f7eef0 · card #fffdfe · ink-700 #4a3238
   Loaded after layout-fix.css.
   ============================================================ */

:root{
  --shw-navy:#33101a;
  --shw-navy-800:#4a1622;
  --shw-burg:#7e1b2a;
  --shw-red:#9e2233;
  --shw-red-500:#b32738;
  --shw-cream:#f7eef0;
  --shw-card:#fffdfe;
  --shw-ink:#4a3238;
  --shw-ink-2:#6b4a52;
  --shw-line:#e3cbd1;
  --shw-line-2:#d3b6bd;
  --shw-gold:#c9973f;
  --shw-ok:#1c6b3f;
  --shw-ok-bg:#e9f6ee;
  --shw-serif:inherit;
}

/* ---------- shared shell ---------- */
.shw{font-family:inherit;color:var(--shw-ink)}
.shw-wrap{max-width:1180px;margin:0 auto;padding:0 1.25rem}
@media(min-width:768px){.shw-wrap{padding:0 2rem}}
.shw-sec{padding:3.4rem 0}
@media(min-width:768px){.shw-sec{padding:4.6rem 0}}
.shw-sec--tint{background:var(--shw-cream)}
.shw-sec--dark{background:var(--shw-navy);color:var(--shw-cream)}
.shw-sec--line{border-top:1px solid var(--shw-line)}

.shw-eyebrow{
  display:inline-flex;align-items:center;gap:.5rem;
  font-size:.72rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;
  color:var(--shw-red);margin:0 0 .7rem
}
.shw-eyebrow::before{content:"";width:1.4rem;height:2px;background:currentColor;display:block}
.shw-sec--dark .shw-eyebrow{color:#ee8a94}

.shw-h2{
  font-size:clamp(1.6rem,2.6vw,2.15rem);line-height:1.14;letter-spacing:-.018em;
  font-weight:800;color:var(--shw-navy);margin:0 0 .6rem;max-width:26ch
}
.shw-sec--dark .shw-h2{color:var(--shw-cream)}
.shw-lede{font-size:1.05rem;line-height:1.6;color:var(--shw-ink-2);max-width:64ch;margin:0}
.shw-sec--dark .shw-lede{color:#e4ccd2}

/* ---------- buttons ---------- */
.shw-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  min-height:3.1rem;padding:.75rem 1.35rem;border-radius:.6rem;
  font-weight:700;font-size:.98rem;line-height:1.2;text-decoration:none;
  border:2px solid transparent;transition:transform .15s ease,background .15s ease,box-shadow .15s ease;
  white-space:nowrap;cursor:pointer
}
.shw-btn:active{transform:translateY(1px)}
.shw-btn--primary{background:var(--shw-red);color:#fff;border-color:var(--shw-red)}
.shw-btn--primary:hover{background:var(--shw-burg);border-color:var(--shw-burg);box-shadow:0 6px 18px rgba(51,16,26,.22)}
.shw-btn--ghost{background:transparent;color:var(--shw-navy);border-color:var(--shw-line-2)}
.shw-btn--ghost:hover{border-color:var(--shw-navy);background:rgba(51,16,26,.04)}
.shw-sec--dark .shw-btn--ghost{color:var(--shw-cream);border-color:#7a4450}
.shw-sec--dark .shw-btn--ghost:hover{border-color:#e4ccd2;background:rgba(255,255,255,.06)}
.shw-btn--light{background:var(--shw-cream);color:var(--shw-navy);border-color:var(--shw-cream)}
.shw-btn--light:hover{background:#fff;border-color:#fff}
.shw-btn--sm{min-height:2.7rem;padding:.55rem 1rem;font-size:.9rem}
.shw-cta-row{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.5rem}
@media(max-width:520px){.shw-cta-row{flex-direction:column}.shw-cta-row .shw-btn{width:100%}}

/* ---------- 1. trust strip ---------- */
.shw-trust{
  background:var(--shw-card);border-bottom:1px solid var(--shw-line);
  padding:1.05rem 0
}
.shw-trust__grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:.85rem 1.25rem
}
@media(min-width:860px){.shw-trust__grid{grid-template-columns:repeat(4,1fr)}}
.shw-trust__item{display:flex;align-items:center;gap:.7rem;min-width:0}
.shw-trust__ico{
  flex:0 0 auto;width:2.35rem;height:2.35rem;border-radius:.55rem;
  background:var(--shw-cream);color:var(--shw-red);
  display:flex;align-items:center;justify-content:center
}
.shw-trust__ico svg{width:1.15rem;height:1.15rem}
.shw-trust__t{font-weight:800;font-size:.92rem;color:var(--shw-navy);line-height:1.25;margin:0}
.shw-trust__s{font-size:.79rem;color:var(--shw-ink-2);line-height:1.35;margin:.1rem 0 0}

/* ---------- 2. service families ---------- */
.shw-fams{display:grid;grid-template-columns:1fr;gap:1.15rem;margin-top:2.2rem}
@media(min-width:700px){.shw-fams{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1060px){.shw-fams{grid-template-columns:repeat(3,1fr)}}
.shw-fam{
  background:var(--shw-card);border:1px solid var(--shw-line);border-radius:.9rem;
  padding:1.5rem 1.45rem 1.35rem;display:flex;flex-direction:column;
  transition:box-shadow .18s ease,transform .18s ease,border-color .18s ease
}
.shw-fam:hover{box-shadow:0 10px 28px rgba(51,16,26,.10);transform:translateY(-2px);border-color:var(--shw-line-2)}
.shw-fam__ico{
  width:2.7rem;height:2.7rem;border-radius:.6rem;background:var(--shw-navy);color:var(--shw-cream);
  display:flex;align-items:center;justify-content:center;margin-bottom:.95rem
}
.shw-fam__ico svg{width:1.3rem;height:1.3rem}
.shw-fam h3{font-size:1.16rem;font-weight:800;color:var(--shw-navy);margin:0 0 .4rem;line-height:1.28}
.shw-fam p{font-size:.94rem;line-height:1.55;color:var(--shw-ink-2);margin:0 0 .9rem}
.shw-fam ul{list-style:none;margin:0 0 1rem;padding:0;display:flex;flex-direction:column;gap:.34rem}
.shw-fam li{
  font-size:.9rem;line-height:1.4;color:var(--shw-ink);padding-left:1.15rem;position:relative
}
.shw-fam li::before{
  content:"";position:absolute;left:0;top:.5em;width:.42rem;height:.42rem;
  border-radius:50%;background:var(--shw-red);opacity:.75
}
.shw-fam__foot{
  margin-top:auto;padding-top:.9rem;border-top:1px solid var(--shw-line);
  display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap
}
.shw-price{font-weight:800;color:var(--shw-navy);font-size:.98rem}
.shw-price span{display:block;font-weight:600;font-size:.7rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--shw-ink-2);margin-bottom:.1rem}
.shw-link{
  font-weight:700;font-size:.9rem;color:var(--shw-red);text-decoration:none;
  display:inline-flex;align-items:center;gap:.3rem;border-bottom:2px solid transparent;
  transition:border-color .15s ease
}
.shw-link:hover{border-bottom-color:var(--shw-red)}
.shw-link svg{width:.85rem;height:.85rem}

/* ---------- 3. proof numbers ---------- */
.shw-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:2rem}
@media(min-width:860px){.shw-stats{grid-template-columns:repeat(4,1fr)}}
.shw-stat{
  background:rgba(255,255,255,.05);border:1px solid rgba(247,238,240,.16);
  border-radius:.8rem;padding:1.15rem 1.2rem
}
.shw-stat__n{font-size:1.85rem;font-weight:800;color:#ee8a94;line-height:1;margin:0 0 .35rem;
  letter-spacing:-.02em}
.shw-stat__l{font-size:.84rem;line-height:1.4;color:#e4ccd2;margin:0}

/* ---------- 4. process ---------- */
.shw-steps{display:grid;grid-template-columns:1fr;gap:1.1rem;margin-top:2.2rem;counter-reset:step}
@media(min-width:760px){.shw-steps{grid-template-columns:repeat(4,1fr)}}
.shw-step{
  position:relative;background:var(--shw-card);border:1px solid var(--shw-line);
  border-radius:.9rem;padding:1.45rem 1.3rem
}
.shw-step__n{
  width:2.1rem;height:2.1rem;border-radius:50%;background:var(--shw-red);color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.9rem;
  margin-bottom:.8rem
}
.shw-step h3{font-size:1.02rem;font-weight:800;color:var(--shw-navy);margin:0 0 .35rem}
.shw-step p{font-size:.9rem;line-height:1.55;color:var(--shw-ink-2);margin:0}

/* ---------- 5. guarantee / promise ---------- */
.shw-promise{
  display:grid;grid-template-columns:1fr;gap:1.2rem;margin-top:2rem
}
@media(min-width:820px){.shw-promise{grid-template-columns:repeat(3,1fr)}}
.shw-promise__card{
  background:var(--shw-card);border:1px solid var(--shw-line);border-top:4px solid var(--shw-red);
  border-radius:.8rem;padding:1.4rem 1.35rem
}
.shw-promise__card h3{font-size:1.05rem;font-weight:800;color:var(--shw-navy);margin:0 0 .4rem}
.shw-promise__card p{font-size:.93rem;line-height:1.55;color:var(--shw-ink-2);margin:0}

/* ---------- 6. testimonials / reviews ---------- */
.shw-rev{display:grid;grid-template-columns:1fr;gap:1.1rem;margin-top:2rem}
@media(min-width:760px){.shw-rev{grid-template-columns:repeat(3,1fr)}}
.shw-rev__card{
  background:var(--shw-card);border:1px solid var(--shw-line);border-radius:.85rem;
  padding:1.4rem 1.35rem;display:flex;flex-direction:column
}
.shw-stars{display:flex;gap:.12rem;color:var(--shw-gold);margin-bottom:.7rem}
.shw-stars svg{width:.95rem;height:.95rem}
.shw-rev__q{font-size:.97rem;line-height:1.6;color:var(--shw-ink);margin:0;flex:1}
.shw-rev__by{
  margin-top:1rem;padding-top:.8rem;border-top:1px solid var(--shw-line);
  font-weight:800;font-size:.9rem;color:var(--shw-navy)
}
.shw-rev__by span{font-weight:600;color:var(--shw-ink-2)}
.shw-rev__tag{
  display:inline-block;margin-top:.55rem;font-size:.7rem;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;background:var(--shw-cream);color:var(--shw-burg);
  padding:.2rem .55rem;border-radius:1rem
}

/* notice banner (honest placeholder state) */
.shw-notice{
  border:2px dashed var(--shw-line-2);background:var(--shw-card);border-radius:.85rem;
  padding:1.15rem 1.35rem;margin-top:1.6rem;text-align:center
}
.shw-notice strong{color:var(--shw-navy);display:block;margin-bottom:.25rem;font-size:1rem}
.shw-notice p{margin:0;font-size:.92rem;line-height:1.55;color:var(--shw-ink-2)}

/* ---------- 7. articles / blog ---------- */
.shw-arts{display:grid;grid-template-columns:1fr;gap:1.25rem;margin-top:2.2rem}
@media(min-width:680px){.shw-arts{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1040px){.shw-arts{grid-template-columns:repeat(3,1fr)}}
.shw-art{
  background:var(--shw-card);border:1px solid var(--shw-line);border-radius:.9rem;
  overflow:hidden;display:flex;flex-direction:column;text-decoration:none;
  transition:box-shadow .18s ease,transform .18s ease
}
.shw-art:hover{box-shadow:0 12px 30px rgba(51,16,26,.12);transform:translateY(-2px)}
.shw-art__img{aspect-ratio:16/10;overflow:hidden;background:var(--shw-cream)}
.shw-art__img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}
.shw-art:hover .shw-art__img img{transform:scale(1.04)}
.shw-art__body{padding:1.25rem 1.3rem 1.35rem;display:flex;flex-direction:column;flex:1}
.shw-art__meta{
  font-size:.7rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  color:var(--shw-red);margin:0 0 .5rem
}
.shw-art h3{font-size:1.08rem;font-weight:800;color:var(--shw-navy);line-height:1.32;margin:0 0 .5rem}
.shw-art p{font-size:.91rem;line-height:1.55;color:var(--shw-ink-2);margin:0 0 .9rem}
.shw-art__more{
  margin-top:auto;font-weight:700;font-size:.88rem;color:var(--shw-red);
  display:inline-flex;align-items:center;gap:.3rem
}

/* ---------- 8. FAQ ---------- */
.shw-faq{max-width:800px;margin:2rem auto 0}
.shw-faq details{
  background:var(--shw-card);border:1px solid var(--shw-line);border-radius:.7rem;
  margin-bottom:.7rem;overflow:hidden
}
.shw-faq summary{
  list-style:none;cursor:pointer;padding:1.05rem 3rem 1.05rem 1.25rem;position:relative;
  font-weight:800;font-size:1rem;color:var(--shw-navy);line-height:1.4
}
.shw-faq summary::-webkit-details-marker{display:none}
.shw-faq summary::after{
  content:"+";position:absolute;right:1.15rem;top:50%;transform:translateY(-50%);
  font-size:1.5rem;font-weight:400;color:var(--shw-red);line-height:1
}
.shw-faq details[open] summary::after{content:"–"}
.shw-faq .shw-a{padding:0 1.25rem 1.1rem;font-size:.96rem;line-height:1.62;color:var(--shw-ink-2)}
.shw-faq .shw-a p{margin:0 0 .6rem}
.shw-faq .shw-a p:last-child{margin:0}

/* ---------- 9. dark CTA band ---------- */
.shw-band{
  background:var(--shw-navy);color:var(--shw-cream);border-radius:1rem;
  padding:2.4rem 1.6rem;text-align:center;position:relative;overflow:hidden
}
@media(min-width:768px){.shw-band{padding:3.2rem 2.5rem}}
.shw-band::after{
  content:"";position:absolute;inset:auto -20% -60% -20%;height:70%;
  background:radial-gradient(ellipse at center,rgba(158,34,51,.45),transparent 70%);
  pointer-events:none
}
.shw-band > *{position:relative;z-index:1}
.shw-band h2{
  font-size:clamp(1.6rem,2.8vw,2.3rem);line-height:1.14;font-weight:800;
  color:#fff;margin:0 0 .6rem;letter-spacing:-.018em
}
.shw-band p{font-size:1.02rem;line-height:1.6;color:#e4ccd2;margin:0 auto;max-width:52ch}
.shw-band .shw-cta-row{justify-content:center}
.shw-band__reassure{
  margin:1.25rem 0 0;font-size:.86rem;color:#cdb0b7;letter-spacing:.01em
}

/* ---------- 10. service catalogue (services page) ---------- */
.shw-cat{display:flex;flex-direction:column;gap:1.1rem;margin-top:2rem}
.shw-cat__item{
  background:var(--shw-card);border:1px solid var(--shw-line);border-radius:.9rem;
  padding:1.5rem 1.45rem;display:grid;grid-template-columns:1fr;gap:1.1rem
}
@media(min-width:840px){.shw-cat__item{grid-template-columns:1.05fr 1fr;gap:2rem;align-items:start}}
.shw-cat__ico{
  width:2.8rem;height:2.8rem;border-radius:.6rem;background:var(--shw-navy);color:var(--shw-cream);
  display:flex;align-items:center;justify-content:center;margin-bottom:.9rem
}
.shw-cat__ico svg{width:1.35rem;height:1.35rem}
.shw-cat h3{font-size:1.3rem;font-weight:800;color:var(--shw-navy);margin:0 0 .45rem;line-height:1.25}
.shw-cat p{font-size:.97rem;line-height:1.6;color:var(--shw-ink-2);margin:0 0 .9rem}
.shw-sub{list-style:none;margin:0;padding:0;display:grid;gap:.4rem}
@media(min-width:560px){.shw-sub{grid-template-columns:repeat(2,1fr)}}
.shw-sub li{
  font-size:.9rem;line-height:1.45;color:var(--shw-ink);
  padding-left:1.3rem;position:relative
}
.shw-sub li::before{
  content:"";position:absolute;left:0;top:.42em;width:.5rem;height:.5rem;
  border:2px solid var(--shw-red);border-radius:1px
}
.shw-cat__side{
  background:var(--shw-cream);border-radius:.7rem;padding:1.15rem 1.2rem
}
.shw-cat__price{
  font-size:1.5rem;font-weight:800;color:var(--shw-navy);margin:0 0 .15rem;letter-spacing:-.02em
}
.shw-cat__pricel{font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;
  color:var(--shw-ink-2);font-weight:700;margin:0 0 .9rem}
.shw-cat__note{font-size:.86rem;line-height:1.5;color:var(--shw-ink-2);margin:0 0 1rem}
.shw-cat__side .shw-btn{width:100%}

/* ---------- 11. article page ---------- */
.shw-article{max-width:730px;margin:0 auto;padding:2.6rem 1.25rem 3.4rem}
.shw-article h1{
  font-size:clamp(1.85rem,3.6vw,2.7rem);line-height:1.12;letter-spacing:-.022em;
  font-weight:800;color:var(--shw-navy);margin:0 0 1rem
}
.shw-article .shw-artmeta{
  font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--shw-red);margin:0 0 1.4rem
}
.shw-article h2{
  font-size:1.4rem;line-height:1.25;font-weight:800;color:var(--shw-navy);
  margin:2.2rem 0 .7rem;letter-spacing:-.01em
}
.shw-article h3{font-size:1.1rem;font-weight:800;color:var(--shw-navy);margin:1.6rem 0 .5rem}
.shw-article p{font-size:1.04rem;line-height:1.72;color:var(--shw-ink);margin:0 0 1.05rem}
.shw-article ul,.shw-article ol{padding-left:1.35rem;margin:0 0 1.15rem}
.shw-article li{font-size:1.02rem;line-height:1.7;color:var(--shw-ink);margin-bottom:.45rem}
.shw-article strong{color:var(--shw-navy);font-weight:700}
.shw-article a{color:var(--shw-red);text-decoration:underline;text-underline-offset:2px}
.shw-article figure{margin:1.8rem 0}
.shw-article figure img{width:100%;border-radius:.8rem;display:block}
.shw-article figcaption{font-size:.84rem;color:var(--shw-ink-2);margin-top:.55rem;line-height:1.5}
.shw-article .shw-callout{
  background:var(--shw-cream);border-left:4px solid var(--shw-red);border-radius:0 .6rem .6rem 0;
  padding:1.15rem 1.3rem;margin:1.6rem 0
}
.shw-article .shw-callout p{margin:0;font-size:.98rem;line-height:1.65}
.shw-back{
  display:inline-flex;align-items:center;gap:.4rem;font-weight:700;font-size:.9rem;
  color:var(--shw-red);text-decoration:none;margin-bottom:1.4rem
}

/* ---------- 12. breadcrumb ---------- */
.shw-crumb{font-size:.84rem;color:var(--shw-ink-2);padding:1rem 0 0}
.shw-crumb a{color:var(--shw-ink-2);text-decoration:none}
.shw-crumb a:hover{color:var(--shw-red);text-decoration:underline}
.shw-crumb span{margin:0 .4rem;opacity:.5}

/* ---------- 13. area chips ---------- */
.shw-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.2rem}
.shw-chip{
  font-size:.88rem;font-weight:700;color:var(--shw-navy);background:var(--shw-card);
  border:1px solid var(--shw-line-2);border-radius:2rem;padding:.45rem 1rem;text-decoration:none;
  transition:background .15s ease,border-color .15s ease
}
.shw-chip:hover{background:var(--shw-red);border-color:var(--shw-red);color:#fff}

/* ---------- 14. comparison / do-dont ---------- */
.shw-two{display:grid;grid-template-columns:1fr;gap:1.1rem;margin-top:1.8rem}
@media(min-width:720px){.shw-two{grid-template-columns:1fr 1fr}}
.shw-two__col{border-radius:.85rem;padding:1.4rem 1.35rem;border:1px solid var(--shw-line)}
.shw-two__col--yes{background:var(--shw-ok-bg);border-color:#c4e3d1}
.shw-two__col--no{background:#fdf1f3;border-color:#f0ccd3}
.shw-two__col h3{font-size:1rem;font-weight:800;margin:0 0 .7rem;color:var(--shw-navy)}
.shw-two__col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem}
.shw-two__col li{font-size:.92rem;line-height:1.5;color:var(--shw-ink);padding-left:1.55rem;position:relative}
.shw-two__col--yes li::before{content:"✓";position:absolute;left:0;color:var(--shw-ok);font-weight:800}
.shw-two__col--no li::before{content:"✕";position:absolute;left:0;color:#b32738;font-weight:800}

/* ---------- utility ---------- */
.shw-mt0{margin-top:0!important}
.shw-mt2{margin-top:2rem}
.shw-center{text-align:center}
.shw-center .shw-h2,.shw-center .shw-lede{margin-left:auto;margin-right:auto}
.shw-center .shw-eyebrow{justify-content:center}

/* tablet: keep anything from colliding */
@media(max-width:767px){
  .shw-fam__foot{flex-direction:column;align-items:flex-start}
  .shw-band{border-radius:.8rem}
}

/* ---------- 15. mobile menu panel (vanilla) ---------- */
#shw-mobile-nav{
  position:fixed;inset:0;z-index:60;background:rgba(51,16,26,.55);
  backdrop-filter:blur(2px);display:flex;justify-content:flex-end
}
#shw-mobile-nav[hidden]{display:none}
.shw-mnav__inner{
  width:min(22rem,88vw);height:100%;background:var(--shw-card);
  padding:1.4rem 1.15rem;display:flex;flex-direction:column;gap:.2rem;
  overflow-y:auto;box-shadow:-12px 0 40px rgba(51,16,26,.28)
}
.shw-mnav__link{
  display:block;padding:.95rem .9rem;border-radius:.55rem;font-weight:700;
  font-size:1.05rem;color:var(--shw-navy);text-decoration:none;min-height:48px
}
.shw-mnav__link:hover,.shw-mnav__link:focus{background:var(--shw-cream)}
.shw-mnav__link.is-current{background:var(--shw-navy);color:var(--shw-cream)}
.shw-mnav__cta{
  display:flex;align-items:center;justify-content:center;margin-top:.6rem;
  min-height:3.1rem;border-radius:.6rem;background:var(--shw-red);color:#fff;
  font-weight:800;text-decoration:none;font-size:1rem
}
.shw-mnav__cta--ghost{
  background:transparent;color:var(--shw-navy);border:2px solid var(--shw-line-2)
}

/* ---------- 16. sticky mobile call bar ---------- */
.shw-callbar{display:none}
@media(max-width:640px){
  .shw-callbar{
    display:grid;grid-template-columns:1fr 1fr;gap:.5rem;
    position:fixed;left:0;right:0;bottom:0;z-index:50;
    padding:.55rem .6rem calc(.55rem + env(safe-area-inset-bottom));
    background:var(--shw-navy);border-top:1px solid #4a1622
  }
  .shw-callbar a{
    display:flex;align-items:center;justify-content:center;gap:.4rem;
    min-height:3rem;border-radius:.5rem;font-weight:800;font-size:.92rem;
    text-decoration:none
  }
  .shw-callbar svg{width:1rem;height:1rem}
  .shw-callbar__call{background:var(--shw-red);color:#fff}
  .shw-callbar__quote{background:transparent;color:#f7eef0;border:2px solid #7a4450}
  body{padding-bottom:4.6rem}
}

/* ---------- 17. icon sizing guard (SVGs inside new components) ---------- */
.shw svg{flex:0 0 auto}
.shw-btn svg{width:1.05rem;height:1.05rem;flex:0 0 auto}
.shw-link svg{width:.85rem;height:.85rem}
.shw-fam__ico svg{width:1.3rem;height:1.3rem}
.shw-cat__ico svg{width:1.35rem;height:1.35rem}
.shw-trust__ico svg{width:1.15rem;height:1.15rem}
.shw-stars svg{width:.95rem;height:.95rem}
.shw-art__more svg{width:.85rem;height:.85rem}
/* keep catalogue left column from stretching to the height of the price box */
.shw-cat__item > div{min-width:0}
@media(min-width:840px){
  .shw-cat__side{align-self:start}
}

/* ---------- 18. restore the 18px root ----------
   The v4h build set its root to 18px at runtime. Removing the Next.js
   runtime dropped it to the 16px browser default, shrinking every rem
   value by 11%. Set it in CSS so it holds without JS.               */
html{font-size:112.5%}   /* 18px */

/* ---------- 19. article H1: keep it to two lines at desktop ---------- */
.shw-article h1{
  font-size:clamp(1.7rem,3.05vw,2.35rem) !important;
  max-width:none !important;
  text-wrap:balance;
  line-height:1.1 !important;
}

/* ---------- 20. header height: one value everywhere ----------
   Pages without the inline min-height utility were rendering 96px
   while the homepage rendered 77px. Let content decide.        */
header .wrap{
  min-height:0 !important;
}
header > .wrap{
  padding-top:.6rem !important;
  padding-bottom:.6rem !important;
}

/* ---------- 21. brand lock ----------
   layout-fix set white-space:normal on the wordmark so the logo block
   wrapped to 2 lines on pages where the nav was a few px wider,
   pushing the header from 72px to 99px. Never let it wrap.        */
header a[aria-label^="Beneva"]{
  flex:0 0 auto !important;
  min-width:0;
}
header a[aria-label^="Beneva"] > span:last-child{
  min-width:0;
}
header a[aria-label^="Beneva"] > span:last-child > span{
  white-space:nowrap !important;
  display:block !important;
}
@media(min-width:1280px) and (max-width:1420px){
  header a[aria-label^="Beneva"] > span:last-child > span:first-child{
    font-size:.95rem !important;
  }
  header a[aria-label^="Beneva"] > span:last-child > span:last-child{
    font-size:.62rem !important;
  }
}


/* ---------- 22. quote form selects ----------
   Two selects sat side by side in a narrow grid cell, so the closed
   state clipped its own placeholder ("Choose your town, if you li").
   Give them the full width and let the text breathe.              */
select.input{
  width:100% !important;
  max-width:100% !important;
  text-overflow:ellipsis;
  padding-right:2.4rem !important;
  background-position:right .85rem center !important;
  appearance:none;
  -webkit-appearance:none;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237e1b2a' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-size:1rem;
}
/* the two selects share a row on desktop; stack them when cramped */
@media(max-width:540px){
  select.input{font-size:1rem !important}
}

/* ---------- 23. CTA band inside an article ----------
   .shw-article h2/p are defined after .shw-band h2/p at equal
   specificity, so the band inherited article's dark text on a dark
   background and its heading vanished.                  */
.shw-article .shw-band h2{
  color:#ffffff !important;
  font-size:clamp(1.35rem,2.4vw,1.75rem) !important;
  margin:0 0 .6rem !important;
  line-height:1.2 !important;
}
.shw-article .shw-band p{
  color:#e4ccd2 !important;
  font-size:1rem !important;
  line-height:1.6 !important;
  margin:0 0 1.2rem !important;
  max-width:52ch !important;
}
.shw-article .shw-band .shw-cta-row{margin-top:0}
.shw-article .shw-band .shw-btn--light{color:var(--shw-navy) !important}
.shw-article .shw-band .shw-btn--ghost{color:#f7eef0 !important}

/* ---------- 24. article top clearance ----------
   The sticky header was covering the back link on article pages. */
.shw-article{
  padding-top:1.4rem;
}
.shw-article .shw-back{
  display:inline-flex;
  margin-top:.6rem;
}
@media(max-width:640px){
  .shw-article{padding-top:1rem}
}

/* ---------- 25. article band paragraph on narrow screens ----------
   The fixed max-width from the desktop rule was narrower than the
   available space at 390px, so the text clipped instead of wrapping. */
@media(max-width:640px){
  .shw-article .shw-band p{
    max-width:100% !important;
    overflow-wrap:break-word;
    word-break:normal;
    hyphens:none;
  }
  .shw-article .shw-band{padding:1.8rem 1.15rem}
}

/* ---------- 26. global nowrap escape hatch ----------
   layout-fix sets white-space:nowrap on several containers to stop
   buttons breaking. Prose inside them must still wrap.          */
.shw p, .shw li, .shw summary, .shw blockquote, .shw h1, .shw h2, .shw h3{
  white-space:normal !important;
}
/* re-assert nowrap only where it is genuinely needed */
.shw .shw-btn, .shw-btn{white-space:nowrap !important}
.shw-callbar a{white-space:nowrap !important}
.shw-mnav__cta{white-space:nowrap !important}
.shw-price, .shw-chip{white-space:nowrap !important}

/* ---------- 27. article band: force prose to wrap ----------
   .shw-band sits outside any .shw wrapper on article pages, so the
   scoped rule above never reached it.                            */
.shw-band p, .shw-band h2, .shw-band .shw-band__reassure{
  white-space:normal !important;
  max-width:100% !important;
  overflow-wrap:break-word;
}
.shw-band .shw-cta-row{flex-wrap:wrap !important}

/* ---------- 28. ordered / unordered lists in articles ----------
   Tailwind preflight sets list-style:none, so the 12-point checklist
   rendered as unnumbered paragraphs and the grab-bar questions lost
   their 1-2-3-4. Restore real markers.                          */
.shw-article ol{
  list-style:decimal outside !important;
  padding-left:1.6rem !important;
  margin:0 0 1.2rem !important;
}
.shw-article ul{
  list-style:disc outside !important;
  padding-left:1.5rem !important;
  margin:0 0 1.2rem !important;
}
.shw-article ol > li, .shw-article ul > li{
  display:list-item !important;
  padding-left:.15rem;
  margin-bottom:.5rem !important;
}
.shw-article ol > li::marker{
  color:var(--shw-red);
  font-weight:800;
  font-size:.95em;
}
.shw-article ul > li::marker{
  color:var(--shw-red);
}

/* ============================================================
   29. Reference-mapped sections
   Structure borrowed from the two reference sites (top bar,
   price transparency, found/did/result, local housing, seasons,
   drive times, credentials, owner replies, materials, honesty
   box). All copy is Beneva Handyman Services' own.
   ============================================================ */

/* ---- 29.1 utility bar -------------------------------------- */
.shw-topbar{
  background:var(--shw-navy);
  color:#eddde2;
  font-size:.82rem;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.shw-topbar .shw-wrap{
  display:flex;flex-wrap:wrap;align-items:center;
  justify-content:center;gap:.35rem 1.5rem;
  padding-top:.5rem;padding-bottom:.5rem;
}
.shw-topbar__i{display:inline-flex;align-items:center;gap:.45rem;white-space:nowrap}
.shw-topbar__i svg{width:15px;height:15px;flex:0 0 auto;color:#ee8a94}
.shw-topbar a{color:#fff;font-weight:800;text-decoration:none}
.shw-topbar a:hover{text-decoration:underline}
.shw-topbar__sep{color:rgba(255,255,255,.22)}
@media (max-width:760px){
  .shw-topbar{font-size:.76rem}
  .shw-topbar .shw-wrap{gap:.2rem .9rem}
  .shw-topbar__i--desk{display:none}
}

/* ---- 29.2 two-field quick quote ---------------------------- */
.shw-quick{
  background:var(--shw-cream);
  border:1px solid var(--shw-line);
  border-radius:16px;
  padding:1.5rem 1.6rem;
}
.shw-quick h2{margin:0;font-size:1.35rem;font-weight:900;color:var(--shw-navy);line-height:1.2}
.shw-quick p{margin:.4rem 0 0;color:var(--shw-ink);font-size:.98rem;line-height:1.5}
.shw-quick form{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.1rem}
.shw-quick label{
  display:block;font-size:.72rem;font-weight:800;letter-spacing:.09em;
  text-transform:uppercase;color:var(--shw-ink-2);margin-bottom:.3rem;
}
.shw-quick .f{flex:1 1 190px;min-width:0}
.shw-quick input{
  width:100%;padding:.8rem .9rem;border:1.5px solid var(--shw-line-2);
  border-radius:9px;background:#fff;font-size:1rem;color:var(--shw-navy);
  font-family:inherit;
}
.shw-quick input:focus{outline:3px solid rgba(158,34,51,.25);outline-offset:1px;border-color:var(--shw-red)}
.shw-quick button{flex:0 0 auto;align-self:flex-end}
.shw-quick__note{
  margin-top:.85rem;font-size:.86rem;color:var(--shw-ink-2);
  display:flex;flex-wrap:wrap;gap:.3rem 1.2rem;
}
.shw-quick__note span{display:inline-flex;align-items:center;gap:.4rem}
.shw-quick__note svg{width:14px;height:14px;color:var(--shw-ok)}

/* ---- 29.3 found / did / result job walkthrough -------------- */
.shw-anat{display:grid;gap:1.1rem}
@media (min-width:900px){.shw-anat{grid-template-columns:repeat(3,1fr)}}
.shw-anat__card{
  background:var(--shw-card);border:1px solid var(--shw-line);
  border-radius:14px;overflow:hidden;display:flex;flex-direction:column;
  box-shadow:0 1px 2px rgba(36,19,24,.04);
}
.shw-anat__head{
  padding:.85rem 1.1rem;background:var(--shw-navy);color:#f7eef0;
  display:flex;flex-wrap:wrap;align-items:baseline;gap:.15rem .6rem;
}
.shw-anat__head b{font-size:.95rem;font-weight:800}
.shw-anat__head span{font-size:.76rem;color:#d9bfc6;letter-spacing:.03em}
.shw-anat__body{padding:1.05rem 1.1rem 1.15rem;display:flex;flex-direction:column;gap:.85rem;flex:1}
.shw-anat__row{display:grid;grid-template-columns:auto 1fr;gap:.6rem}
.shw-anat__tag{
  font-size:.66rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;
  color:var(--shw-red);padding-top:.2rem;min-width:3.9rem;
}
.shw-anat__row p{margin:0;font-size:.95rem;line-height:1.5;color:var(--shw-ink)}
.shw-anat__res{
  margin-top:auto;padding-top:.85rem;border-top:1px dashed var(--shw-line-2);
  font-size:.92rem;line-height:1.5;color:var(--shw-navy);font-weight:700;
  display:flex;gap:.5rem;align-items:flex-start;
}
.shw-anat__res svg{width:16px;height:16px;flex:0 0 auto;margin-top:.15rem;color:var(--shw-ok)}

/* ---- 29.4 local housing archetypes ------------------------- */
.shw-arche{display:grid;gap:1rem}
@media (min-width:760px){.shw-arche{grid-template-columns:repeat(2,1fr)}}
.shw-arche__c{
  background:var(--shw-card);border:1px solid var(--shw-line);border-radius:14px;
  padding:1.15rem 1.2rem;
}
.shw-arche__c h3{margin:0 0 .2rem;font-size:1.05rem;font-weight:900;color:var(--shw-navy);line-height:1.25}
.shw-arche__era{
  font-size:.72rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;
  color:var(--shw-red);margin-bottom:.55rem;display:block;
}
.shw-arche__c p{margin:0;font-size:.95rem;line-height:1.55;color:var(--shw-ink)}
.shw-arche__c ul{margin:.6rem 0 0;padding-left:1.1rem;list-style:disc outside}
.shw-arche__c li{font-size:.9rem;line-height:1.45;color:var(--shw-ink-2);margin-bottom:.25rem}
.shw-arche__c li::marker{color:var(--shw-red)}

/* ---- 29.5 seasonal grid ------------------------------------ */
.shw-season{display:grid;gap:0;border:1px solid var(--shw-line);border-radius:14px;overflow:hidden;background:var(--shw-card)}
@media (min-width:820px){.shw-season{grid-template-columns:repeat(4,1fr)}}
.shw-season__c{padding:1.15rem 1.15rem;border-bottom:1px solid var(--shw-line)}
@media (min-width:820px){
  .shw-season__c{border-bottom:0;border-right:1px solid var(--shw-line)}
  .shw-season__c:last-child{border-right:0}
}
.shw-season__c:last-child{border-bottom:0}
.shw-season__h{
  display:flex;align-items:center;gap:.5rem;font-size:.72rem;font-weight:900;
  letter-spacing:.09em;text-transform:uppercase;color:var(--shw-red);margin-bottom:.55rem;
}
.shw-season__h svg{width:16px;height:16px}
.shw-season__c p{margin:0;font-size:.93rem;line-height:1.55;color:var(--shw-ink)}
.shw-season__c b{color:var(--shw-navy)}

/* ---- 29.6 quote inclusions / exclusions -------------------- */
.shw-inc{display:grid;gap:1rem}
@media (min-width:820px){.shw-inc{grid-template-columns:1fr 1fr}}
.shw-inc__c{border-radius:14px;padding:1.2rem 1.25rem;border:1px solid var(--shw-line);background:var(--shw-card)}
.shw-inc__c--no{background:#fdf6f7}
.shw-inc__c h3{
  margin:0 0 .7rem;font-size:.78rem;font-weight:900;letter-spacing:.09em;
  text-transform:uppercase;color:var(--shw-navy);display:flex;align-items:center;gap:.5rem;
}
.shw-inc__c h3 svg{width:17px;height:17px}
.shw-inc__c--yes h3 svg{color:var(--shw-ok)}
.shw-inc__c--no h3 svg{color:var(--shw-red)}
.shw-inc__c ul{margin:0;padding:0;list-style:none}
.shw-inc__c li{
  position:relative;padding-left:1.35rem;font-size:.95rem;line-height:1.5;
  color:var(--shw-ink);margin-bottom:.55rem;
}
.shw-inc__c li:last-child{margin-bottom:0}
.shw-inc__c li::before{
  content:"";position:absolute;left:0;top:.5em;width:.55rem;height:.55rem;
  border-radius:2px;background:var(--shw-ok);
}
.shw-inc__c--no li::before{background:var(--shw-red);border-radius:50%}

/* ---- 29.7 credentials row ---------------------------------- */
.shw-cred{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.1rem;padding:0;list-style:none}
.shw-cred li{
  display:inline-flex;align-items:center;gap:.4rem;
  border:1px solid var(--shw-line-2);background:var(--shw-cream);
  border-radius:999px;padding:.34rem .8rem;
  font-size:.8rem;font-weight:800;color:var(--shw-navy);white-space:nowrap;
}
.shw-cred svg{width:14px;height:14px;color:var(--shw-red);flex:0 0 auto}

/* ---- 29.8 owner reply inside a review ---------------------- */
.shw-reply{
  margin-top:.85rem;padding:.7rem .85rem;border-left:3px solid var(--shw-red);
  background:var(--shw-cream);border-radius:0 8px 8px 0;
  font-size:.88rem;line-height:1.5;color:var(--shw-ink);
}
.shw-reply b{display:block;font-size:.72rem;letter-spacing:.07em;text-transform:uppercase;color:var(--shw-red);margin-bottom:.2rem}
.shw-rev-meta{
  display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .7rem;
  font-size:.78rem;color:var(--shw-ink-2);margin-top:.3rem;
}
.shw-rev-meta .src{display:inline-flex;align-items:center;gap:.3rem;font-weight:700;color:var(--shw-ink-2)}
.shw-rev-meta .src svg{width:12px;height:12px}

/* ---- 29.9 materials / quality ------------------------------ */
.shw-mat{display:grid;gap:1rem}
@media (min-width:760px){.shw-mat{grid-template-columns:repeat(2,1fr)}}
.shw-mat__c{display:grid;grid-template-columns:auto 1fr;gap:.9rem;align-items:start;
  background:var(--shw-card);border:1px solid var(--shw-line);border-radius:14px;padding:1.1rem}
.shw-mat__ic{
  width:2.4rem;height:2.4rem;border-radius:10px;background:var(--shw-navy);
  display:flex;align-items:center;justify-content:center;color:#f7eef0;flex:0 0 auto;
}
.shw-mat__ic svg{width:1.15rem;height:1.15rem}
.shw-mat__c h3{margin:0 0 .3rem;font-size:1.02rem;font-weight:900;color:var(--shw-navy);line-height:1.25}
.shw-mat__c p{margin:0;font-size:.93rem;line-height:1.55;color:var(--shw-ink)}
.shw-mat__c em{font-style:normal;font-weight:800;color:var(--shw-red)}

/* ---- 29.10 honesty callout --------------------------------- */
.shw-honest{
  border:2px solid var(--shw-navy);border-radius:14px;background:#fff;
  padding:1.2rem 1.3rem;display:grid;grid-template-columns:auto 1fr;gap:.9rem;align-items:start;
}
.shw-honest__ic{
  width:2.6rem;height:2.6rem;border-radius:999px;background:var(--shw-navy);
  display:flex;align-items:center;justify-content:center;color:#f7eef0;flex:0 0 auto;
}
.shw-honest__ic svg{width:1.3rem;height:1.3rem}
.shw-honest h3{margin:0 0 .3rem;font-size:1.08rem;font-weight:900;color:var(--shw-navy)}
.shw-honest p{margin:0;font-size:.97rem;line-height:1.55;color:var(--shw-ink)}

/* ---- 29.11 areas marquee ----------------------------------- */
.shw-marquee{
  overflow:hidden;background:var(--shw-navy);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
}
.shw-marquee__track{
  display:flex;gap:0;width:max-content;
  animation:shw-mq 46s linear infinite;
}
.shw-marquee:hover .shw-marquee__track{animation-play-state:paused}
.shw-marquee__track span{
  display:inline-flex;align-items:center;gap:.75rem;
  padding:.85rem 1.1rem;color:#f7eef0;font-weight:800;font-size:.92rem;
  letter-spacing:.02em;white-space:nowrap;
}
.shw-marquee__track span::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--shw-red-500);flex:0 0 auto}
@keyframes shw-mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.shw-marquee__track{animation:none}}

/* ---- 29.12 drive-time table -------------------------------- */
.shw-drive{
  width:100%;border-collapse:collapse;background:var(--shw-card);
  border:1px solid var(--shw-line);border-radius:12px;overflow:hidden;font-size:.95rem;
}
.shw-drive th,.shw-drive td{padding:.6rem .85rem;text-align:left;border-bottom:1px solid var(--shw-line)}
.shw-drive thead th{
  background:var(--shw-navy);color:#f7eef0;font-size:.7rem;letter-spacing:.08em;
  text-transform:uppercase;font-weight:900;
}
.shw-drive tbody tr:last-child td{border-bottom:0}
.shw-drive tbody tr:nth-child(even){background:var(--shw-cream)}
.shw-drive td:last-child{text-align:right;font-weight:800;color:var(--shw-navy);white-space:nowrap}
.shw-drive td a{color:var(--shw-red);font-weight:800;text-decoration:none}
.shw-drive td a:hover{text-decoration:underline}

/* ---- 29.13 small print under a section -------------------- */
.shw-fine{margin-top:.9rem;font-size:.84rem;line-height:1.5;color:var(--shw-ink-2)}

/* ---------- 30. §29 headings vs the global clamp ----------
   layout-fix.css sets h2/h3 sizes with !important, which outranks
   the component rules above. Re-assert only inside the new
   components so the page-wide heading scale is untouched.        */
.shw-quick h2{
  font-size:1.45rem !important;
  line-height:1.25 !important;
  letter-spacing:-0.01em !important;
  text-wrap:pretty;
}
.shw-arche__c h3{
  font-size:1.1rem !important;
  line-height:1.3 !important;
  letter-spacing:0 !important;
}
.shw-mat__c h3, .shw-honest h3{
  font-size:1.06rem !important;
  line-height:1.3 !important;
  letter-spacing:0 !important;
}
.shw-inc__c h3{
  font-size:0.8rem !important;
  line-height:1.4 !important;
  letter-spacing:0.09em !important;
}
.shw-anat__head b{font-size:0.95rem !important;line-height:1.3 !important}
@media (max-width:640px){
  .shw-quick h2{font-size:1.25rem !important}
  .shw-quick{padding:1.15rem 1.1rem}
  .shw-quick button{width:100%;justify-content:center}
}

/* ---------- 31. per-family scope boundary on the services page ---------- */
.shw-cat__scope{
  margin:.85rem 0 1rem;
  padding:.6rem .7rem;
  border-left:3px solid var(--shw-red);
  background:#fdf6f7;
  border-radius:0 6px 6px 0;
  font-size:.86rem !important;
  line-height:1.45 !important;
  color:var(--shw-ink-2);
}
.shw-cat__scope b{
  display:block;
  font-size:.68rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--shw-red);
  margin-bottom:.15rem;
}

/* ---------- 32. opening hours in the utility bar ----------
   The compiled Tailwind build only ships sm:/md: variants, so
   xl:inline-flex silently disappeared. Own the breakpoint here. */
.shw-hours{
  display:none;
  align-items:center;
  gap:.5rem;
  font-size:.95rem;
  font-weight:700;
  color:#d9bfc6;
  white-space:nowrap;
}
.shw-hours svg{width:1rem;height:1rem;color:#ee8a94;flex:0 0 auto}
@media (min-width:1300px){ .shw-hours{display:inline-flex} }

/* ---------- 33. rating stars must read as filled ----------
   The star SVG is drawn with fill="none" stroke, which renders as
   five hollow outlines — it reads as zero stars next to a 5.0.   */
.shw-stars svg{
  fill:currentColor !important;
  stroke:none !important;
}
.shw-stars{
  color:#c9973f;
  gap:.16rem;
}