/* CARVAJAL EXPERTISES — V1.5.10 | Invisible raccords / compositing.
   Applies over v1.5.9; preserve original panorama and interior, content and links.
   A true two-way photographic cross-fade replaces white seams and opaque bands. */

/* 1. Scenic panorama -> photographic quote section. Keep the hero dark and
   transparent at its lower edge; allow the photo below to progressively emerge. */
.hero{z-index:1}
.hero::after{
  height:clamp(56px,6.6vw,96px);
  background:linear-gradient(180deg,
    rgba(18,43,30,0) 0%,
    rgba(18,43,30,.025) 42%,
    rgba(18,43,30,.15) 100%);
}
#devis.quote-premium{
  z-index:2;
  margin-top:clamp(-80px,-5.8vw,-54px);
  padding-top:clamp(138px,12vw,175px);
  background-color:#e8e2d7;
  /* The top transparent part reveals the actual panorama: no opaque strip. */
  -webkit-mask-image:linear-gradient(180deg,transparent 0px,rgba(0,0,0,.35) 24px,
    rgba(0,0,0,.74) 56px,#000 78px,#000 calc(100% - 132px),
    rgba(0,0,0,.88) calc(100% - 102px),rgba(0,0,0,.25) calc(100% - 33px),
    transparent 100%);
  mask-image:linear-gradient(180deg,transparent 0px,rgba(0,0,0,.35) 24px,
    rgba(0,0,0,.74) 56px,#000 78px,#000 calc(100% - 132px),
    rgba(0,0,0,.88) calc(100% - 102px),rgba(0,0,0,.25) calc(100% - 33px),
    transparent 100%);
}
#devis.quote-premium::before{
  background:linear-gradient(90deg,
    rgba(249,247,240,.57) 0%,rgba(249,247,241,.43) 38%,
    rgba(249,247,241,.13) 72%,rgba(255,255,255,.035) 100%);
}

/* 2. Quote -> Cabinet. The cabinet begins underneath the transparent last
   132 pixels of the quote image, avoiding a harsh straight photographic edge. */
#devis.quote-premium{padding-bottom:clamp(108px,9.2vw,132px)}
#devis.quote-premium::after{content:none}
#devis + #cabinet.cabinet-v13{
  z-index:1;
  margin-top:clamp(-124px,-8.7vw,-96px);
  padding-top:clamp(132px,12vw,164px);
  padding-bottom:clamp(64px,5.9vw,84px);
  background:linear-gradient(180deg,#efede6 0%,#f2f1e9 20%,#f7f7f2 58%,#fafaf6 100%);
}
#devis + #cabinet.cabinet-v13::before{content:none}
#cabinet .cabinet-v13-intro::before{content:none}

/* 3. Rest of the journey: harmonized rhythm, without changing content. */
#prestations.services-section-premium{
  padding-top:clamp(46px,4.6vw,64px);
  padding-bottom:clamp(38px,3.9vw,54px);
}
#prestations + #dpe-audit.energy-decision{
  margin-top:-8px;
  padding-top:clamp(39px,3.7vw,52px);
}
#dpe-audit + #implantations.address-section,
#implantations + #temoignages.trust-section{border-top:0}

/* Make the transition length appropriate for tablet and handheld screens. */
@media(max-width:860px){
  #devis.quote-premium{
    margin-top:-62px;
    padding-top:132px;
    padding-bottom:112px;
    -webkit-mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.52) 30px,
       #000 60px,#000 calc(100% - 120px),rgba(0,0,0,.82) calc(100% - 90px),
       transparent 100%);
    mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.52) 30px,
       #000 60px,#000 calc(100% - 120px),rgba(0,0,0,.82) calc(100% - 90px),
       transparent 100%);
  }
  #devis + #cabinet.cabinet-v13{margin-top:-105px;padding-top:132px;padding-bottom:64px}
}
@media(max-width:560px){
  .hero::after{height:62px;background:linear-gradient(180deg,transparent,rgba(18,43,30,.10))}
  #devis.quote-premium{
    margin-top:-48px;
    padding-top:108px;
    padding-bottom:102px;
    -webkit-mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.50) 24px,
       #000 46px,#000 calc(100% - 108px),rgba(0,0,0,.85) calc(100% - 82px),
       transparent 100%);
    mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.50) 24px,
       #000 46px,#000 calc(100% - 108px),rgba(0,0,0,.85) calc(100% - 82px),
       transparent 100%);
  }
  #devis + #cabinet.cabinet-v13{margin-top:-99px;padding-top:121px;padding-bottom:52px}
  #prestations.services-section-premium{padding-top:38px;padding-bottom:39px}
  #prestations + #dpe-audit.energy-decision{margin-top:-8px;padding-top:32px}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}