/* ===== RESET ===== */
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  background:#402e16; color:#ffffff;
  font-family:"Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial;
  overflow-x:hidden; transition:background .3s ease;
}
#site { transition:opacity .3s ease; }
body.menu-open #site { pointer-events:none; user-select:none; }

/* ===== HEADER ===== */
#mainHeader {
  position:fixed; top:0; left:0; right:0; height:92px; z-index:100;
  background:#ffffff; border-bottom:1px solid #eee;
  transition:height .4s ease, box-shadow .3s ease, opacity .3s ease;
}
.header-inner {
  max-width:1200px; margin:0 auto; height:100%;
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; padding:0 28px;
}
.logo-header {
  content:url("assets/logo_text.svg");
  width:240px; transition:width .3s ease; cursor:pointer;
}
.scrolled#mainHeader { height:70px; box-shadow:0 8px 24px rgba(0,0,0,.06); }
.scrolled .logo-header { width:200px; }

/* NAV / MENU */
.nav-links,.menu-btn{
  transition:opacity .25s ease, visibility .25s ease; will-change:opacity;
}
body.nav-home .nav-links{
  opacity:1; visibility:visible; pointer-events:auto;
}
body.nav-home .menu-btn{
  opacity:0; visibility:hidden; pointer-events:none;
}
body.nav-compact .nav-links{
  opacity:0; visibility:hidden; pointer-events:none;
}
body.nav-compact .menu-btn{
  display:flex; opacity:1; visibility:visible; pointer-events:auto;
}

.nav-links{
  display:flex; gap:28px; align-items:center;
}
.nav-links a{
  text-decoration:none;
  font-family:"Libre Baskerville", serif;
  font-weight:600; color:#223A77; font-size:16px;
  position:relative; padding:6px 2px;
}
.nav-links a::after{
  content:"";
  position:absolute; bottom:-4px; left:0; width:0%; height:2px;
  background:#D9B97A;
  transition:width .35s cubic-bezier(.4,0,.2,1);
}
.nav-links a:hover::after{ width:100%; }

.menu-btn{
  width:44px; height:36px; flex-direction:column; justify-content:space-between;
  background:transparent; border:none; cursor:pointer; padding:6px 2px;
  opacity:0; visibility:hidden;
}
.menu-btn span{
  display:block; height:2px; border-radius:2px;
  background:linear-gradient(180deg,#F6E7B0 0%,#D9B97A 50%,#B57F43 100%);
  transition:transform .3s ease, opacity .3s ease;
}
.menu-btn[aria-expanded="true"] span:nth-child(1){
  transform:translateY(7px) rotate(45deg);
}
.menu-btn[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.menu-btn[aria-expanded="true"] span:nth-child(3){
  transform:translateY(-7px) rotate(-45deg);
}

.menu-overlay{
  position:fixed; inset:0; background:#402e16;
  display:grid; place-items:center;
  opacity:0; pointer-events:none;
  transition:opacity .3s ease; z-index:200;
}
.menu-overlay.open{
  opacity:1; pointer-events:auto;
}
.menu-close{
  position:absolute; top:18px; right:22px;
  font-size:42px; line-height:1;
  background:none; border:none; cursor:pointer; color:#fff;
}
.menu-overlay-nav{
  display:flex; flex-direction:column; gap:18px; text-align:center;
}
.menu-overlay-nav a{
  font-family:"Playfair Display", serif; font-weight:700;
  font-size:clamp(30px,4vw,48px);
  letter-spacing:.4px;
  color:#ffffff; text-decoration:none; padding:6px 8px;
  transition:transform .2s ease, color .2s ease;
}
.menu-overlay-nav a:hover{
  background:linear-gradient(180deg,#F6E7B0 0%,#D9B97A 50%,#B57F43 100%);
  -webkit-background-clip:text; color:transparent;
  transform:translateY(-2px);
}

/* ===== HERO ===== */
.hero{
  position:relative; min-height:100vh;
  display:flex; align-items:center; justify-content:center; text-align:center;
  padding-top:110px;
  background:url("assets/hero.jpg") center/cover no-repeat;
  isolation:isolate;
}
.hero::before{
  content:""; position:absolute; inset:0;
  background:rgba(0,0,0,0.35); z-index:0;
}

.hero-content{
  position:relative; z-index:1;
}
.title-gold{
  font-family:"Playfair Display", serif;
  font-weight:700;
  font-size:clamp(30px,4.4vw,58px);
  line-height:1.1; margin-bottom:28px;
  background:linear-gradient(180deg,#F6E7B0 0%,#D9B97A 50%,#B57F43 100%);
  -webkit-background-clip:text; color:transparent;
}

.btn-gold{
  background:linear-gradient(180deg,#F6E7B0 0%,#D9B97A 50%,#B57F43 100%);
  color:#402e16; border:none; border-radius:14px;
  padding:16px 34px; font-size:18px; font-weight:700; cursor:pointer;
  transition:transform .2s ease, filter .2s ease, box-shadow .2s ease;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  box-shadow:0 10px 30px rgba(0,0,0,.08);
}
.btn-gold:hover{
  transform:translateY(-2px); filter:brightness(1.05);
  box-shadow:0 14px 36px rgba(0,0,0,.12);
}

/* ===== HISTOIRE ===== */
.histoire {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: stretch;
  justify-content: center;
  overflow: hidden;
  background: #402e16;
}
.histoire-left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center; 
  padding: 80px;
  text-align: center;
}
.histoire-left h2 {
  font-family: "Playfair Display", serif;
  font-size: clamp(40px, 4vw, 56px);
  margin-bottom: 30px;
  background: linear-gradient(180deg, #F6E7B0 0%, #D9B97A 50%, #B57F43 100%);
  -webkit-background-clip: text;
  color: transparent;
}
.histoire-left p {
  font-family: "Libre Baskerville", serif;
  color: #ffffff;
  font-size: 18px;
  line-height: 1.8;
  max-width: 600px;
  margin: 0 auto;
  text-align: center;
}

/* ===== SERVICES ===== */
.services-intro{
  padding:140px 24px 120px; max-width:1200px; margin:0 auto; text-align:center;
  background:#402e16;
}
.intro-sub{
  margin:10px auto 28px; color:#ffffff;
  font-family:"Libre Baskerville", serif;
}
.services-grid{
  margin-top:26px;
  display:grid; gap:22px;
  grid-template-columns:repeat(2, minmax(0,1fr));
}

.service-card{
  border:1px solid rgba(255,255,255,0.12);
  border-radius:16px;
  padding:28px 22px;
  text-decoration:none;
  color:#ffffff;
  background:#4e3a1c;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.service-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 40px rgba(0,0,0,.06);
  border-color:#d9b97a;
}
.service-card h3{
  font-family:"Playfair Display", serif;
  font-size:26px; margin:4px 0 8px;
}
.service-card p{
  font-family:"Libre Baskerville", serif;
  font-size:15px; line-height:1.5; margin-bottom:12px;
}
.service-illu{
  font-size:30px; margin-bottom:8px;
}

.cta-mini{
  display:inline-block; padding:8px 14px; border-radius:999px;
  font-weight:600; font-size:13px;
  background:linear-gradient(180deg,#F6E7B0 0%,#D9B97A 50%,#B57F43 100%);
  color:#111;
}

/* ===== SERVICE PAGES ===== */
.service-page{
  padding:140px 24px 120px; max-width:1200px; margin:0 auto;
  background:#402e16;
}
.service-wrap{
  display:grid; grid-template-columns:1fr 1.2fr;
  gap:34px; align-items:center;
}
.service-text{ color:#ffffff; }
.service-text .service-desc{
  margin-top:14px;
  font-family:"Libre Baskerville", serif;
  line-height:1.7;
}

/* Sliders non modifiés */
.ba-slider{
  position:relative; width:100%; aspect-ratio:16/9;
  border-radius:16px; overflow:hidden; background:#f3f3f3;
  box-shadow:0 10px 30px rgba(0,0,0,.06);
}
.ba-before,.ba-after{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; user-select:none; pointer-events:none;
}
.ba-after-wrap{
  position:absolute; inset:0; width:50%; overflow:hidden;
}
.ba-handle{
  position:absolute; top:0; bottom:0; left:50%; width:2px;
  transform:translateX(-50%);
  background:linear-gradient(180deg,#F6E7B0 0%,#D9B97A 50%,#B57F43 100%);
  cursor:ew-resize;
}
.ba-dot{
  position:absolute; top:50%; left:50%;
  transform:translate(-50%,-50%);
  width:28px; height:28px; border-radius:50%;
  background:linear-gradient(180deg,#F6E7B0 0%,#D9B97A 50%,#B57F43 100%);
  box-shadow:0 6px 18px rgba(0,0,0,.18);
}

/* ===== PHOTOS ===== */
.photos-page{
  padding:140px 24px 120px;
  max-width:1200px; margin:0 auto;
  text-align:center; background:#402e16;
}
.photos-grid{
  margin-top:24px;
  display:grid; gap:20px;
  grid-template-columns:repeat(3, minmax(0,1fr));
}
.photo-desc {
  color:#F6E7B0;
  font-weight:600;
  margin-top:10px;
}

/* ===== CONTACT ===== */
.contact{
  padding:140px 20px 160px;
  text-align:center;
  background:#402e16;
  border-top:1px solid rgba(255,255,255,0.1);
}
.contact h2{
  font-family:"Playfair Display", serif;
  font-size:clamp(38px,4vw,54px);
  background:linear-gradient(180deg,#F6E7B0 0%,#D9B97A 50%,#B57F43 100%);
  -webkit-background-clip:text; color:transparent;
  margin-bottom:12px;
}
.contact-sub{
  color:#ffffff;
  font-family:"Libre Baskerville", serif;
  margin-bottom:40px; font-size:18px;
}
.contact-grid{
  display:grid; gap:16px;
  grid-template-columns:repeat(2, minmax(0,360px));
  justify-content:center;
}
.contact-card{
  background:#4e3a1c;
  border:1px solid rgba(255,255,255,0.12);
  border-radius:14px;
  padding:16px 18px;
  display:flex; justify-content:center; align-items:center;
  text-decoration:none; color:#ffffff;
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.contact-card:hover{
  transform:translateY(-2px);
  border-color:#223A77;
  box-shadow:0 10px 26px rgba(0,0,0,.06);
}

/* ===== FOOTER ===== */
.footer{
  background:#402e16;
  border-top:3px solid #D9B97A;
}
.footer-inner{
  max-width:1200px; margin:0 auto;
  padding:28px 24px;
  display:flex; align-items:center;
  justify-content:space-between;
  gap:20px; flex-wrap:wrap;
  color:#ffffff;
}
.footer-left{ color:#ffffff; }
.bni-line{
  display:flex; align-items:center; gap:10px;
  font-family:"Libre Baskerville", serif; color:#ffffff;
}
.bni-logo{
  height:18px; width:auto; display:inline-block;
  transform:translateY(1px);
}
.copy{
  margin-top:6px; font-size:13px; color:#ffffff;
}
.mentions{
  margin-top:4px; font-size:13px; color:#ffffff;
}
.mentions a{
  color:#F6E7B0; text-decoration:none;
}
.mentions a:hover{ text-decoration:underline; }

.footer-socials {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}
.footer-socials .social{
  width:28px; height:28px;
  display:inline-flex;
  justify-content:center; align-items:center;
  border-radius:80px;
  background:#4e3a1c;
  border:1px solid rgba(255,255,255,0.12);
}
.footer-socials .social img{
  width:34px; height:34px;
  display:block; object-fit:contain;
}

/* ===== RESPONSIVE ===== */
@media (max-width:1024px){
  .service-wrap{ grid-template-columns:1fr; }
}

@media (max-width:900px){
  .histoire-container{
    grid-template-columns:1fr;
  }
  .histoire-left,
  .histoire-right{
    padding:60px 40px;
    text-align:center;
  }
  .histoire-right img{
    width:100%; height:auto;
  }

  .services-grid{
    grid-template-columns:1fr;
    gap:24px;
  }
  .service-card{
    padding:22px 18px;
  }
  .service-card h3{ font-size:22px; }
  .service-card p{ font-size:14px; }

  .service-wrap{
    grid-template-columns:1fr;
  }
  .service-text{
    text-align:center; color:#ffffff;
  }
  .service-text .service-desc{
    margin-top:12px; font-size:15px; color:#ffffff;
  }

  .photos-grid{
    grid-template-columns:1fr; gap:16px;
  }

  .contact-grid{
    grid-template-columns:1fr; gap:20px;
  }
  .contact h2{
    font-size:clamp(30px, 6vw, 42px);
  }
  .contact-sub{ font-size:16px; }
  .footer-inner{
    flex-direction:column;
    align-items:center;
    text-align:center;
  }
}

/* HEADER + MENU MOBILE */
@media (max-width:900px){
  #mainHeader{
    height:78px;
    padding:0 18px;
    background:#fff;
    display:flex;
    align-items:center;
    justify-content:space-between;
  }
  .header-inner{
    width:100%;
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:0;
  }
  .logo-header{
    width:160px;
    content:url("assets/logo_text.svg");
    cursor:pointer;
  }
  .menu-btn{
    display:flex !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    width:44px; height:36px;
    flex-direction:column; justify-content:space-between;
    background:transparent; border:none; cursor:pointer;
    padding:6px 2px;
  }
  .nav-links{
    display:none !important;
  }
  .hero{
    padding-top:100px;
  }
  .title-gold{
    font-size:clamp(26px,6vw,42px);
    margin-bottom:18px;
  }
  .btn-gold{
    font-size:16px; padding:14px 26px;
  }
  .menu-overlay{
    background:#402e16;
    backdrop-filter:blur(8px);
  }
  .menu-overlay-nav a{
    font-size:clamp(28px,5vw,40px);
    font-family:"Playfair Display", serif;
    letter-spacing:0.4px;
  }
  .menu-overlay-nav a:hover{
    background:linear-gradient(180deg,#F6E7B0 0%,#D9B97A 50%,#B57F43 100%);
    -webkit-background-clip:text; color:transparent;
  }
}

@media (max-width:768px){
  .socials-inline .social{
    width:32px; height:32px;
  }
  .socials-inline .social img{
    width:20px; height:20px;
  }
}

@media (max-width:680px){
  .logo-header{ width:190px; }
}

@media (max-width:600px){
  .footer-socials .social{
    width:24px; height:24px;
  }
  .footer-socials .social img{
    width:14px; height:14px;
  }
}

.ba-wrapper {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.photos-grid > div {
  display: flex;
  flex-direction: column;
}
.photos-grid > div .photo-desc {
  margin-top: 10px;
}
.contact-card {
  pointer-events: auto !important;
}

/* Texte légèrement plus haut (réduction marge bas en mobile) */
@media (max-width:900px){
  p {
    margin-bottom: 5px; /* réduit l'espace → remonte visuellement le bloc */
  }
}

/* Ligne dorée entre sections */
.section-gold-line {
  width: 100%;
  height: 0.5px;
  background: linear-gradient(90deg, #F6E7B0, #D9B97A, #B57F43);
  margin: 80px 0;
}
/* ===== TEXTES GROS & IMPORTANTS → STYLE FIN, RAFFINÉ ===== */

.histoire-left p,
.service-text .service-desc,
.intro-sub,
.contact-sub,
.service-page p,
.photos-page p,
p {
  font-family: "Cormorant Garamond", serif !important;
  font-weight: 400 !important;  /* finesse élégante */
  letter-spacing: 0.2px;
  line-height: 1.55;
  font-size: 20px;
  color: #ffffff !important;
}

/* Sous-blocs plus petits mais élégants */
.service-card p,
.contact-card span,
.photo-desc {
  font-family: "Cormorant Garamond", serif !important;
  font-weight: 400;
  font-size: 17px;
  letter-spacing: 0.15px;
}

/* Harmonisation pour sections texte */
.service-text {
  font-family: "Cormorant Garamond", serif !important;
  font-weight: 400 !important;
}
