/* =========================================================
   Clear Link v1.11.12 — structural / readability audit
   - 3-way desktop header CTA including urgent phone
   - centered heading + centered left-aligned explanatory block
   - card overflow guards and responsive type
   - water-area card spacing rebuild
   - process flow single-source layout after duplicate cards removal
   ========================================================= */

:root{
  --cl-copy-max: 860px;
  --cl-card-copy: #58665f;
}

/* ---------- Header: consultation / estimate / urgent phone ---------- */
@media (min-width:1121px){
  html body.has-overlay-header .header-actions{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    width:min(510px,43vw)!important;
    height:46px!important;
    gap:1px!important;
    margin-left:auto!important;
  }
  html body.has-overlay-header .header-action{
    width:auto!important;
    min-width:0!important;
    height:46px!important;
    min-height:46px!important;
    padding:0 12px!important;
    overflow:hidden!important;
  }
  html body.has-overlay-header .header-action small{
    font-size:8px!important;
    letter-spacing:.14em!important;
  }
  html body.has-overlay-header .header-action span{
    font-size:13px!important;
    line-height:1.2!important;
    white-space:nowrap!important;
  }
  html body.has-overlay-header .header-action--phone{
    background:#203c34!important;
    color:#fff!important;
  }
  html body.has-overlay-header .header-action--phone:hover{
    background:#173129!important;
  }
  html body.has-overlay-header .header-action--phone.is-unconfigured{
    background:#40554d!important;
  }
}

/* ---------- Heading axis + centered left-aligned lead/body ---------- */
.site-unified-hero .home-hero__lead,
main section :where(
  .section-title__lead,.bp-gallery__lead,.cf-heading__lead,.cl-final-cta__lead,
  .support-links__lead,.sf-heading>p:not(:first-child),.sf-heading-grid>p,
  .pf-heading>p:not(:first-child),.pf-heading-grid>p,
  .cf-heading>p:not(:first-child),.cf-intro__grid>p,.cf-note__grid>p,
  .af-heading>p:not(:first-child),.af-intro__grid>p,.af-area-lead,
  .ftc-heading>p:not(:first-child),.ftc-intro__grid>p,
  .ft-section-head>p:not(:first-child),.ft-consult__head>p:not(:first-child),
  .ft-promise__heading>p:not(:first-child),.bp-section__heading>p:not(:first-child),
  .bp-page-title__main>p,.fq-intro__grid>div:last-child>p,
  .fq-contact__grid>div:last-child>p,.column-focus__intro>p,.column-category-heading>p
){
  width:min(100%,var(--cl-copy-max))!important;
  max-width:var(--cl-copy-max)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:left!important;
  text-wrap:pretty!important;
}

/* When a centered title sits above ordinary copy, center the copy block itself
   while preserving left alignment for comfortable reading. */
main section :where(.sf-shell,.pf-shell,.cf-shell,.af-shell,.ftc-shell,.container) > :where(.sf-heading,.pf-heading,.cf-heading,.af-heading,.ftc-heading,.section-title,.bp-section__heading) + p{
  width:min(100%,var(--cl-copy-max))!important;
  max-width:var(--cl-copy-max)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:left!important;
}

/* ---------- Universal structural safety for cards ---------- */
main :where(article,a,li,details,div){min-width:0}
main :where(article,a,li) :where(h2,h3,p,span,strong,small){max-width:100%}
main :where(article,a,li) :where(h2,h3,p){overflow:visible!important}
main :where(
  .sf-card,.pf-card,.cf-card,.af-card,.bp-card,.voice-card,
  .ftc-three>article,.ftc-four>article,.ftc-checklist>article,
  .sf-water-menu>a,.sf-kitchen-flow>article,.sf-bath-grid>article,
  .sf-washroom-flow>article,.sf-plan-grid>article,.sf-door-grid>article,
  .sf-transform-grid>article,.sf-heating-grid>article,.sf-store-flow>article,
  .sf-custom-day>article,.af-process-list>li,.ftc-timeline>li
){
  box-sizing:border-box!important;
  height:auto!important;
  overflow:visible;
}

/* Keep media clipping inside the image, not on the entire card. */
main :where(.sf-water-menu>a,.voice-card) > figure,
main :where(.sf-dual-visuals,.sf-single-visual) figure{
  overflow:hidden!important;
}

/* ---------- Process page: one clear 8-step sequence ---------- */
.ftc-flow .ftc-timeline{
  gap:22px!important;
}
.ftc-flow .ftc-timeline li{
  min-height:0!important;
  padding:18px!important;
  align-items:center!important;
}
.ftc-flow .ftc-timeline li>div{
  align-self:center!important;
}
.ftc-flow .ftc-timeline li h3{
  font-size:24px!important;
  line-height:1.45!important;
  margin:0 0 8px!important;
}
.ftc-flow .ftc-timeline li p{
  font-size:15px!important;
  line-height:1.8!important;
  margin:0!important;
  color:var(--cl-card-copy)!important;
}
.ftc-process-highlights{display:none!important}

/* ---------- Water area: rebuild four cards with real breathing room ---------- */
.sf-special--waterhub .sf-water-menu{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:28px!important;
  margin-top:34px!important;
}
.sf-special--waterhub .sf-water-menu>a{
  display:grid!important;
  grid-template-columns:1fr!important;
  align-content:start!important;
  min-height:0!important;
  border-radius:24px!important;
  overflow:hidden!important;
}
.sf-special--waterhub .sf-water-menu figure{
  aspect-ratio:16/9!important;
  min-height:0!important;
}
.sf-special--waterhub .sf-water-menu img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}
.sf-special--waterhub .sf-water-menu>a>div{
  min-height:230px!important;
  padding:28px 30px 30px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:0!important;
}
.sf-special--waterhub .sf-water-menu small{
  font-size:10px!important;
  line-height:1.4!important;
}
.sf-special--waterhub .sf-water-menu h3{
  font-size:28px!important;
  line-height:1.4!important;
  margin:14px 0 12px!important;
}
.sf-special--waterhub .sf-water-menu p{
  font-size:15px!important;
  line-height:1.8!important;
  margin:0!important;
}
.sf-special--waterhub .sf-water-menu .cl-card-action{
  margin-top:auto!important;
  padding-top:22px!important;
  font-size:13px!important;
}

/* ---------- Desktop reading scale ---------- */
@media (min-width:821px){
  main :where(
    .sf-card,.pf-card,.cf-card,.af-card,.bp-card,
    .ftc-three>article,.ftc-four>article,.ftc-checklist>article,
    .sf-kitchen-flow>article,.sf-bath-grid>article,.sf-washroom-flow>article,
    .sf-plan-grid>article,.sf-door-grid>article,.sf-transform-grid>article,
    .sf-heating-grid>article,.sf-store-flow>article,.sf-custom-day>article,
    .af-process-list>li
  ) h3{
    font-size:clamp(22px,1.55vw,28px)!important;
    line-height:1.45!important;
  }
  main :where(
    .sf-card,.pf-card,.cf-card,.af-card,.bp-card,
    .ftc-three>article,.ftc-four>article,.ftc-checklist>article,
    .sf-kitchen-flow>article,.sf-bath-grid>article,.sf-washroom-flow>article,
    .sf-plan-grid>article,.sf-door-grid>article,.sf-transform-grid>article,
    .sf-heating-grid>article,.sf-store-flow>article,.sf-custom-day>article,
    .af-process-list>li,.sf-dual-visuals>article>div,.sf-single-visual>div
  ) p{
    font-size:15px!important;
    line-height:1.85!important;
  }
}

/* ---------- Mobile reading scale ---------- */
@media (max-width:820px){
  :root{--cl-copy-max:34em}
  .site-unified-hero .home-hero__lead,
  main section :where(
    .section-title__lead,.bp-gallery__lead,.cf-heading__lead,.cl-final-cta__lead,
    .support-links__lead,.sf-heading>p:not(:first-child),.sf-heading-grid>p,
    .pf-heading>p:not(:first-child),.pf-heading-grid>p,
    .cf-heading>p:not(:first-child),.cf-intro__grid>p,.cf-note__grid>p,
    .af-heading>p:not(:first-child),.af-intro__grid>p,.af-area-lead,
    .ftc-heading>p:not(:first-child),.ftc-intro__grid>p,
    .ft-section-head>p:not(:first-child),.ft-consult__head>p:not(:first-child),
    .ft-promise__heading>p:not(:first-child),.bp-section__heading>p:not(:first-child),
    .bp-page-title__main>p,.fq-intro__grid>div:last-child>p,
    .fq-contact__grid>div:last-child>p,.column-focus__intro>p,.column-category-heading>p
  ){
    font-size:14.5px!important;
    line-height:1.8!important;
  }
  .sf-special--waterhub .sf-water-menu{
    grid-template-columns:1fr!important;
    gap:18px!important;
    margin-top:24px!important;
  }
  .sf-special--waterhub .sf-water-menu>a>div{
    min-height:0!important;
    padding:22px 20px 24px!important;
  }
  .sf-special--waterhub .sf-water-menu h3{
    font-size:23px!important;
    margin:10px 0 10px!important;
  }
  .sf-special--waterhub .sf-water-menu p{
    font-size:14.5px!important;
    line-height:1.78!important;
  }
  .sf-special--waterhub .sf-water-menu .cl-card-action{
    font-size:13px!important;
    padding-top:18px!important;
  }
  .ftc-flow .ftc-timeline{
    grid-template-columns:1fr!important;
    gap:14px!important;
  }
  .ftc-flow .ftc-timeline li{
    grid-template-columns:76px 34px minmax(0,1fr)!important;
    gap:10px!important;
    padding:12px!important;
  }
  .ftc-flow .ftc-timeline li figure{
    width:76px!important;
    aspect-ratio:1/1!important;
  }
  .ftc-flow .ftc-timeline li h3{
    font-size:21px!important;
    line-height:1.42!important;
  }
  .ftc-flow .ftc-timeline li p{
    font-size:14px!important;
    line-height:1.72!important;
  }
  main :where(
    .sf-card,.pf-card,.cf-card,.af-card,.bp-card,
    .ftc-three>article,.ftc-four>article,.ftc-checklist>article,
    .sf-kitchen-flow>article,.sf-bath-grid>article,.sf-washroom-flow>article,
    .sf-plan-grid>article,.sf-door-grid>article,.sf-transform-grid>article,
    .sf-heating-grid>article,.sf-store-flow>article,.sf-custom-day>article,
    .af-process-list>li
  ) h3{
    font-size:21px!important;
    line-height:1.45!important;
  }
  main :where(
    .sf-card,.pf-card,.cf-card,.af-card,.bp-card,
    .ftc-three>article,.ftc-four>article,.ftc-checklist>article,
    .sf-kitchen-flow>article,.sf-bath-grid>article,.sf-washroom-flow>article,
    .sf-plan-grid>article,.sf-door-grid>article,.sf-transform-grid>article,
    .sf-heating-grid>article,.sf-store-flow>article,.sf-custom-day>article,
    .af-process-list>li,.sf-dual-visuals>article>div,.sf-single-visual>div
  ) p{
    font-size:14px!important;
    line-height:1.78!important;
  }
}

/* ---------- Title clipping guard ---------- */
main :where(.sf-heading,.pf-heading,.cf-heading,.af-heading,.ftc-heading,.section-title,.bp-section__heading,.cl-common-faq__heading),
main :where(.sf-heading,.pf-heading,.cf-heading,.af-heading,.ftc-heading,.section-title,.bp-section__heading,.cl-common-faq__heading) :where(h1,h2,h3){
  height:auto!important;
  max-height:none!important;
  overflow:visible!important;
}

/* ---------- Extended card audit coverage ---------- */
main :where(
  .find-grid>a,.support-links__grid>a,.service-reasons article,.related-menu__grid a,
  .bp-service-grid>a,.bp-problem-grid>a,.reform-menu-card,.work-card,.journal-card,
  .first-guide__links a,.home-main--future .reason-cards--visual>article,.voice-card
){
  box-sizing:border-box!important;
  min-width:0!important;
  height:auto!important;
  max-height:none!important;
}
main :where(
  .find-grid>a,.support-links__grid>a,.service-reasons article,.related-menu__grid a,
  .bp-service-grid>a,.bp-problem-grid>a,.reform-menu-card,.work-card,.journal-card,
  .first-guide__links a,.home-main--future .reason-cards--visual>article,.voice-card
) :where(h2,h3,p){
  max-width:100%!important;
  overflow:visible!important;
}
main h3.cl-semantic-card-wrap{
  white-space:normal!important;
  overflow-wrap:normal!important;
  line-break:strict!important;
  text-wrap:pretty!important;
}
@supports (word-break:auto-phrase){
  main h3.cl-semantic-card-wrap{word-break:auto-phrase!important}
}

@media (min-width:821px){
  main :where(
    .find-grid>a,.support-links__grid>a,.service-reasons article,.related-menu__grid a,
    .bp-service-grid>a,.bp-problem-grid>a,.reform-menu-card,.work-card,.journal-card,
    .first-guide__links a,.home-main--future .reason-cards--visual>article,.voice-card
  ) p{font-size:15px!important;line-height:1.82!important}
  main :where(.bp-service-grid>a,.bp-problem-grid>a,.work-card,.journal-card,.voice-card) h3{
    font-size:clamp(20px,1.35vw,24px)!important;line-height:1.45!important
  }
}
@media (max-width:820px){
  main :where(
    .find-grid>a,.support-links__grid>a,.service-reasons article,.related-menu__grid a,
    .bp-service-grid>a,.bp-problem-grid>a,.reform-menu-card,.work-card,.journal-card,
    .first-guide__links a,.home-main--future .reason-cards--visual>article,.voice-card
  ) p{font-size:14px!important;line-height:1.75!important}
  main :where(.bp-service-grid>a,.bp-problem-grid>a,.work-card,.journal-card,.voice-card) h3{
    font-size:20px!important;line-height:1.45!important
  }
}
