/* Variables couleurs */
:root{
  --primary: #cdae96;
  --secondary: #b8b393;
  --third: #000000;
  --font-title: 'Calistoga', serif;
  --font-body: 'Open Sans', sans-serif;
}

html{scroll-behavior:smooth}
body{font-family:var(--font-body);color:#222}

/* Carousel full height */
header .carousel-item img{object-fit:cover}
.carousel-caption{top:0;bottom:0}
.logo-wrap img{max-width:100%;height:auto;max-height:300px}
#logo{min-width:300px}
@media(max-width:576px){#logo{min-width:150px}}

/* Sections */
.section-white{background:#fff;padding:50px 0}
@media(max-width:768px){.section-white{padding:15px 0}}

h1 {
  font-weight: bold;
  color:var(--primary);
}

h2 {
  color:var(--secondary);
}

h3 {
  font-size: 1em;
  font-weight: bold;
}

/* CTA PARALLAX – VERSION ACCENTUÉE */
.cta-section,
.cta-section-2 {
  position: relative;
  overflow: hidden;
  min-height: 480px;
}

#salon, #pricing, #working-time {
  background-image: url("./images/Fond_feuilles.webp");
  background-size: cover;
  background-position: top;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

/* ==================================================
CTA PARALLAX – VERSION ACCENTUÉE (STABLE)
================================================== */
.cta-section,
.cta-section-2{
position: relative;
overflow: hidden;
min-height: 480px;
display: flex;
align-items: center;
}


.cta-section::before,
.cta-section-2::before{
content: "";
position: absolute;
inset: -15%;
background-size: cover;
background-position: top;
background-repeat: no-repeat;
/*background-attachment: fixed;*/
transform: scale(1.25);
z-index: 0;
filter: brightness(0.5);
}


.cta-section::before{
background-image: url("./images/Parallaxe_01.webp");
}


.cta-section-2::before{
background-image: url("./images/Parallaxe_02.webp");
background-position: center;
}


.cta-section .container,
.cta-section-2 .container{
position: relative;
z-index: 1;
}


/* Désactivation du fixed sur mobile & accessibilité */
@media (max-width: 991px), (prefers-reduced-motion: reduce){
.cta-section::before,
.cta-section-2::before{
background-attachment: scroll;
transform: scale(1.15);
}
}

.cta-btn{background:var(--secondary);color:var(--third);border:none;padding:0.75rem 1.5rem;transition:all .4s ease}
.cta-btn:hover{background:#fff;color:var(--third);opacity:0.95}

/* Cards */
.card-img-top{height:220px;object-fit:cover}

/* Pricing */
.price{color:var(--third)}

/* Back to top */
#backToTop{position:fixed;right:20px;bottom:20px;display:inline-flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .4s ease, visibility .4s ease;z-index:1050}
#backToTop.show{opacity:1;visibility:visible}

/* Fade-up animations */
[data-anim]{opacity:0;transform:translateY(20px);transition:opacity .6s ease, transform .6s ease}
[data-anim].in-view{opacity:1;transform:none}

/* Parallax behaviour fallback */
@media (prefers-reduced-motion: reduce){.parallax-bg, .parallax-bg-2{background-attachment:scroll}}
@media (max-width: 991px), (prefers-reduced-motion: reduce) {
  .cta-section::before,
  .cta-section-2::before {
    background-attachment: scroll;
  }
}

/* Accessibility focus outlines */
a:focus, button:focus{outline:3px solid var(--primary);outline-offset:3px}

/* Footer */
footer img{max-width:200px}

/* Modal body max height */
.modal-body{max-height:60vh;overflow:auto}