/* =========================================================
   Clear Link v1.11.1 — section structure & TOP reasons repair
   Policy:
   1) section heading first
   2) centered heading / lead
   3) one line on desktop only when it genuinely fits
   4) content / media / CTA follow the heading
   ========================================================= */

/* ---------- Site-wide section heading system ---------- */
main section :where(
  .section-title,
  .sf-heading,
  .pf-heading,
  .cf-heading,
  .af-heading,
  .ftc-heading,
  .fq-group__heading,
  .bp-section__heading,
  .cl-common-faq__heading,
  .ft-section-head,
  .ft-consult__head,
  .ft-promise__heading
){
  width:100%!important;
  max-width:none!important;
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:center!important;
}

main section :where(
  .section-title,
  .sf-heading,
  .pf-heading,
  .cf-heading,
  .af-heading,
  .ftc-heading,
  .fq-group__heading,
  .bp-section__heading,
  .cl-common-faq__heading,
  .ft-section-head,
  .ft-consult__head,
  .ft-promise__heading
) :where(h2,p){
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:center!important;
}

main section :where(
  .section-title__lead,
  .sf-heading>p:last-child,
  .pf-heading>p:last-child,
  .cf-heading>p:last-child,
  .af-heading>p:last-child,
  .ftc-heading>p:last-child,
  .ft-section-head>p:last-child,
  .ft-consult__head>p:last-child,
  .cl-common-faq__heading>p:last-child
){
  max-width:780px!important;
}

/* Any remaining heading + CTA rows become heading-first stacks. */
main .section-heading-row{
  display:grid!important;
  grid-template-columns:1fr!important;
  justify-items:center!important;
  align-items:start!important;
  gap:24px!important;
  text-align:center!important;
}
main .section-heading-row>.section-title{grid-column:1!important;grid-row:1!important}
main .section-heading-row>.arrow-link{grid-column:1!important;grid-row:2!important;justify-self:center!important}

/* Intro layouts that previously placed title and lead side-by-side. */
main :where(.sf-heading-grid,.pf-heading-grid,.cf-intro__grid,.af-intro__grid,.ftc-intro__grid,.bp-profile__intro){
  grid-template-columns:1fr!important;
  gap:clamp(18px,3vw,30px)!important;
  align-items:start!important;
}
main :where(.sf-heading-grid,.pf-heading-grid,.cf-intro__grid,.af-intro__grid,.ftc-intro__grid,.bp-profile__intro)>:first-child{
  width:100%!important;
  max-width:none!important;
  text-align:center!important;
}
main :where(.sf-heading-grid,.pf-heading-grid,.cf-intro__grid,.af-intro__grid,.ftc-intro__grid,.bp-profile__intro)>p{
  width:min(100%,780px)!important;
  max-width:780px!important;
  margin:0 auto!important;
  text-align:center!important;
}

/* About/cost CTA story sections: title first, copy and CTA beneath. */
main :where(.af-company-area-link,.af-warranty-long,.af-area-inquiry) .af-position__grid,
main .cf-note__grid{
  grid-template-columns:1fr!important;
  gap:24px!important;
  align-items:start!important;
  text-align:center!important;
}
main :where(.af-company-area-link,.af-warranty-long,.af-area-inquiry) .af-position__grid>div:first-child,
main .cf-note__grid>div:first-child{width:100%!important;text-align:center!important}
main :where(.af-company-area-link,.af-warranty-long,.af-area-inquiry) .af-position__grid>div:last-child,
main .cf-note__grid>p{width:min(100%,800px)!important;margin-inline:auto!important;text-align:center!important}

/* Heading line policy. JS applies this only when the natural text width fits. */
main h2.cl-fit-singleline{
  white-space:nowrap!important;
  text-wrap:nowrap!important;
  max-width:none!important;
  width:auto!important;
}

/* ---------- TOP: heading must be the first visual element ---------- */
.home-main--future .home-section-head{
  display:block!important;
  width:100%!important;
  margin:0 auto clamp(34px,4.8vw,64px)!important;
  text-align:center!important;
}
.home-main--future .home-section-head .section-title{margin-bottom:0!important}
.home-main--future .home-section-head .section-title h2{
  max-width:1180px!important;
  margin-inline:auto!important;
}
.home-main--future .find-section>.container>.section-title,
.home-main--future .voice-home>.container>.section-title{
  margin-bottom:clamp(34px,4.8vw,64px)!important;
}
.home-main--future .home-section-action{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  width:100%!important;
  margin-top:clamp(30px,4vw,48px)!important;
  text-align:center!important;
}

/* Shared content rhythm after the heading. */
.home-main--future .home-section-content{
  margin-top:0!important;
}
.home-main--future .home-section-content--text-media,
.home-main--future .home-section-content--media-text{
  display:grid!important;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr)!important;
  gap:clamp(30px,5vw,72px)!important;
  align-items:center!important;
}
.home-main--future .home-section-copy{
  max-width:680px!important;
  margin-inline:auto!important;
  text-align:center!important;
}
.home-main--future .home-section-copy>p{
  margin-left:auto!important;
  margin-right:auto!important;
}
.home-main--future .home-section-copy>.arrow-link{margin-top:18px!important}

/* Future intro: remove old 3-column rule completely. */
.home-main--future .future-intro__content{width:100%!important}
.home-main--future .future-intro__visual{
  width:100%!important;
  margin:0!important;
  transform:none!important;
  aspect-ratio:16/9!important;
  max-height:none!important;
  overflow:hidden!important;
  border-radius:24px!important;
  box-shadow:0 20px 48px rgba(23,61,52,.11)!important;
}
.home-main--future .future-intro__visual img{width:100%!important;height:100%!important;object-fit:cover!important}

/* Problem section: stable media/text structure. */
.home-main--future .problem-highlight__grid{
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)!important;
  gap:clamp(30px,5vw,68px)!important;
  align-items:center!important;
}
.home-main--future .problem-highlight__copy{padding:0!important;text-align:center!important}
.home-main--future .problem-highlight__list{margin-inline:auto!important}

/* Reform menu title now stands above the cards; CTA is below. */
.home-main--future .reform-menu .home-section-head{max-width:1180px!important}
.home-main--future .reform-menu__grid--future{margin-top:0!important}

/* Future banner: heading first, points beneath. */
.home-main--future .future-banner__points{
  margin-top:0!important;
  width:100%!important;
}

/* ---------- TOP reasons: hard reset of the broken area ---------- */
.home-main--future .reasons--compact .container{
  display:block!important;
}
.home-main--future .reason-support--stable{
  display:grid!important;
  grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)!important;
  gap:0!important;
  align-items:stretch!important;
  width:min(100%,1080px)!important;
  margin:0 auto clamp(34px,4vw,52px)!important;
  padding:0!important;
  overflow:hidden!important;
  border:1px solid rgba(23,61,52,.10)!important;
  border-radius:28px!important;
  background:#f7f8f5!important;
  box-shadow:0 18px 50px rgba(23,61,52,.075)!important;
}
.home-main--future .reason-support--stable figure{
  margin:0!important;
  min-width:0!important;
  min-height:0!important;
  aspect-ratio:16/9!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
.home-main--future .reason-support--stable figure img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  object-fit:cover!important;
}
.home-main--future .reason-support--stable .reason-support__copy{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  min-width:0!important;
  padding:clamp(28px,4vw,50px)!important;
  text-align:center!important;
}
.home-main--future .reason-support--stable .section-kicker{margin-inline:auto!important;text-align:center!important}
.home-main--future .reason-support--stable h3{
  width:100%!important;
  margin:0 0 14px!important;
  font-size:clamp(28px,3vw,42px)!important;
  line-height:1.4!important;
  text-align:center!important;
}
.home-main--future .reason-support--stable p:last-child{
  max-width:560px!important;
  margin:0 auto!important;
  line-height:1.95!important;
}

.home-main--future .reason-cards--stable{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:22px!important;
  width:100%!important;
  margin:0!important;
  padding:0!important;
  align-items:stretch!important;
}
.home-main--future .reason-cards--stable>article:nth-child(n){
  grid-column:auto!important;
  margin:0!important;
  min-width:0!important;
  min-height:0!important;
}
.home-main--future .reason-cards--stable>article:not(.reason-cards__stat){
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  border-radius:22px!important;
}
.home-main--future .reason-cards--stable>article:not(.reason-cards__stat) figure{
  flex:0 0 auto!important;
  width:100%!important;
  aspect-ratio:16/9!important;
  margin:0!important;
}
.home-main--future .reason-cards--stable>article:not(.reason-cards__stat)>div{
  display:flex!important;
  flex-direction:column!important;
  flex:1!important;
  padding:24px 22px 28px!important;
  text-align:center!important;
}
.home-main--future .reason-cards--stable>article:not(.reason-cards__stat)>div>span{margin-inline:auto!important}
.home-main--future .reason-cards--stable h3{text-align:center!important;margin:0 0 12px!important;font-size:clamp(21px,2vw,27px)!important;line-height:1.55!important}
.home-main--future .reason-cards--stable p{margin:0!important;text-align:center!important;line-height:1.85!important}
.home-main--future .reason-cards--stable .reason-cards__stat{
  grid-column:1/-1!important;
  display:grid!important;
  grid-template-columns:1fr auto auto 1fr!important;
  align-items:center!important;
  justify-items:center!important;
  gap:12px 18px!important;
  min-height:160px!important;
  margin-top:4px!important;
  padding:30px 38px!important;
  border-radius:22px!important;
  background:linear-gradient(120deg,#183d33,#2f5d4f)!important;
  color:#fff!important;
}
.home-main--future .reason-cards--stable .reason-cards__stat small{grid-column:1/-1!important;text-align:center!important}
.home-main--future .reason-cards--stable .reason-cards__stat strong{grid-column:2!important;font-size:clamp(46px,5vw,72px)!important;line-height:1!important;white-space:nowrap!important}
.home-main--future .reason-cards--stable .reason-cards__stat b{grid-column:3!important;align-self:end!important;padding-bottom:7px!important;white-space:nowrap!important}
.home-main--future .reason-cards--stable .reason-cards__stat p{grid-column:1/-1!important;max-width:700px!important;color:rgba(255,255,255,.82)!important}

/* Works / journal CTAs stay below cards. */
.home-main--future :where(.works,.journal) .home-section-action{margin-top:40px!important}

/* Maintenance heading first; content becomes a controlled three-part row. */
.home-main--future .maintenance__grid--with-visual{
  display:grid!important;
  grid-template-columns:minmax(170px,.35fr) minmax(280px,.75fr) minmax(0,1.1fr)!important;
  gap:clamp(24px,4vw,50px)!important;
  align-items:center!important;
}
.home-main--future .maintenance__copy{max-width:620px!important;text-align:center!important}
.home-main--future .maintenance__visual{grid-column:auto!important;width:100%!important;aspect-ratio:16/9!important;max-height:none!important}
.home-main--future .maintenance__visual img{width:100%!important;height:100%!important;min-height:0!important;object-fit:cover!important}

/* Cost support: title is no longer trapped inside the image row. */
.home-main--future .support-links__lead--future{
  margin-top:0!important;
}
.home-main--future .support-links__lead-copy{padding-top:0!important;text-align:center!important}
.home-main--future .support-links__grid--future h3{text-align:center!important}

/* First-time / About / FAQ on TOP. */
.home-main--future .first-guide__grid,
.home-main--future .about-split__grid{
  margin-top:0!important;
  align-items:center!important;
}
.home-main--future .first-guide__intro>p,
.home-main--future .about-split__grid .home-section-copy>p{text-align:center!important}
.home-main--future .faq-home__body{width:min(100%,900px)!important;margin:0 auto!important}
.home-main--future .faq-accordion{width:100%!important}

/* First-time landing page headings: no side-by-side title architecture. */
.ft-page .ft-section-head,
.ft-page .ft-consult__head,
.ft-page .ft-promise__heading{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  margin:0 auto clamp(30px,4vw,48px)!important;
  text-align:center!important;
}
.ft-page .ft-section-head .ft-kicker,
.ft-page .ft-consult__head .ft-kicker,
.ft-page .ft-promise__heading .ft-kicker{margin-bottom:14px!important;text-align:center!important}
.ft-page .ft-section-head h2,
.ft-page .ft-consult__head h2,
.ft-page .ft-promise__heading h2{max-width:1100px!important;margin:0 auto 16px!important;text-align:center!important}
.ft-page .ft-section-head>p:last-child,
.ft-page .ft-consult__head>p:last-child{max-width:780px!important;margin:0 auto!important;text-align:center!important}
.ft-page .ft-cases__head{
  display:grid!important;
  grid-template-columns:1fr!important;
  justify-items:center!important;
  gap:22px!important;
  margin-bottom:36px!important;
  text-align:center!important;
}
.ft-page .ft-cases__head>div{text-align:center!important}
.ft-page .ft-cases__head a{justify-self:center!important}

/* ---------- Responsive ---------- */
@media(max-width:1100px){
  .home-main--future .reason-cards--stable{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .home-main--future .reason-cards--stable>article:nth-child(3){grid-column:1/-1!important;width:min(100%,620px)!important;justify-self:center!important}
  .home-main--future .maintenance__grid--with-visual{grid-template-columns:minmax(160px,.4fr) minmax(0,1fr)!important}
  .home-main--future .maintenance__visual{grid-column:1/-1!important;width:min(100%,820px)!important;justify-self:center!important}
}

@media(max-width:820px){
  main h2.cl-fit-singleline{white-space:normal!important;text-wrap:balance!important;width:100%!important}
  .home-main--future .home-section-head{margin-bottom:32px!important}
  .home-main--future .home-section-content--text-media,
  .home-main--future .home-section-content--media-text,
  .home-main--future .problem-highlight__grid{
    grid-template-columns:1fr!important;
    gap:24px!important;
  }
  .home-main--future .future-intro__copy{order:1!important}
  .home-main--future .future-intro__visual{order:2!important}
  .home-main--future .problem-highlight__visual{order:2!important}
  .home-main--future .problem-highlight__copy{order:1!important}
  .home-main--future .reason-support--stable{grid-template-columns:1fr!important;border-radius:22px!important}
  .home-main--future .reason-support--stable figure{aspect-ratio:16/9!important}
  .home-main--future .reason-support--stable .reason-support__copy{padding:26px 20px 30px!important}
  .home-main--future .reason-cards--stable{grid-template-columns:1fr!important;gap:18px!important}
  .home-main--future .reason-cards--stable>article:nth-child(n){grid-column:auto!important;width:100%!important}
  .home-main--future .reason-cards--stable .reason-cards__stat{
    grid-column:auto!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    gap:8px!important;
    padding:28px 20px!important;
    text-align:center!important;
  }
  .home-main--future .reason-cards--stable .reason-cards__stat strong,
  .home-main--future .reason-cards--stable .reason-cards__stat b,
  .home-main--future .reason-cards--stable .reason-cards__stat p,
  .home-main--future .reason-cards--stable .reason-cards__stat small{grid-column:auto!important;padding:0!important}
  .home-main--future .maintenance__grid--with-visual{grid-template-columns:1fr!important;gap:22px!important}
  .home-main--future .maintenance__experience{order:1!important}
  .home-main--future .maintenance__copy{order:2!important}
  .home-main--future .maintenance__visual{order:3!important;grid-column:auto!important;width:100%!important}
  .home-main--future .home-section-action{margin-top:30px!important}
}

/* TOP title typography wins over older section-specific h2 rules. */
.home-main--future .home-section-head .section-title h2,
.home-main--future .find-section>.container>.section-title h2,
.home-main--future .voice-home>.container>.section-title h2{
  width:100%!important;
  max-width:1180px!important;
  margin:0 auto 14px!important;
  padding:0!important;
  font-size:clamp(34px,4vw,52px)!important;
  line-height:1.35!important;
  letter-spacing:.015em!important;
  text-align:center!important;
}
.home-main--future .home-section-head .section-title__en,
.home-main--future .find-section>.container>.section-title .section-title__en,
.home-main--future .voice-home>.container>.section-title .section-title__en{
  margin:0 auto 12px!important;
  font-size:12px!important;
  line-height:1.4!important;
  text-align:center!important;
}
.home-main--future .home-section-head .section-title__lead,
.home-main--future .find-section>.container>.section-title .section-title__lead,
.home-main--future .voice-home>.container>.section-title .section-title__lead{
  margin:0 auto!important;
  max-width:760px!important;
  font-size:14px!important;
  line-height:1.9!important;
  text-align:center!important;
}

/* Support cards use h3 so the section's h2 is reserved for the section title. */
.home-main--future .support-links__grid--future h3{
  margin:38px 0 13px!important;
  font-family:var(--cl-font-serif)!important;
  font-size:30px!important;
  font-weight:500!important;
  line-height:1.5!important;
  color:inherit!important;
}

@media(max-width:820px){
  .home-main--future .home-section-head .section-title h2,
  .home-main--future .find-section>.container>.section-title h2,
  .home-main--future .voice-home>.container>.section-title h2{
    font-size:clamp(27px,7.2vw,34px)!important;
    line-height:1.42!important;
  }
  .home-main--future .home-section-head .section-title__lead,
  .home-main--future .find-section>.container>.section-title .section-title__lead,
  .home-main--future .voice-home>.container>.section-title .section-title__lead{
    font-size:13px!important;
  }
  .home-main--future .support-links__grid--future h3{margin-top:28px!important;font-size:26px!important}
}