:root{
  --or:#caa03f;
  --brun:#4a381f;
  --creme:#fffaf0;
  --vert:#698354;
  --violet:#7b3b85;
  --rose:#c95b83;
  --orange:#d8752c;
  --bleu:#302e68;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}

body{
  margin:0;
  background:#eee8dc;
  color:#35291e;
  font:300 14px/1.75 Montserrat,Arial,sans-serif;
}

header,main,footer{
  width:100%;
  max-width:1024px;
  margin:auto;
}

header{
  height:76px;
  padding:0 5%;
  display:flex;
  align-items:center;
  gap:28px;
  background:linear-gradient(90deg,#4d421f,#29331b);
  color:#fff;
}

.brand{
  margin-right:auto;
  color:white;
  text-decoration:none;
  font:italic 31px 'Cormorant Garamond',serif;
}

.brand span{color:#e0b94e}

nav{display:flex;gap:22px}

nav a{
  color:white;
  text-decoration:none;
  font-size:10px;
}

nav a.active{
  border-bottom:1px solid #e0b94e;
}

.rdv{
  color:#33270e;
  text-decoration:none;
  background:linear-gradient(#f0d06d,#c89b32);
  padding:10px 18px;
  border-radius:24px;
  font-size:10px;
  font-weight:600;
}

.hero{
  padding:80px 8%;
  text-align:center;
  background:
    radial-gradient(circle at 72% 25%,#ffe7a0aa,transparent 24%),
    linear-gradient(120deg,#fffdf7,#eee1bb,#879660);
}

.eyebrow{
  font-size:9px;
  letter-spacing:3px;
  font-weight:600;
  color:#8f702e;
}

.hero h1{
  margin:12px 0;
  color:var(--brun);
  font:600 68px/.95 'Cormorant Garamond',serif;
}

.hero .lead{
  max-width:720px;
  margin:15px auto;
  font:italic 24px/1.4 'Cormorant Garamond',serif;
}

.content{
  padding:70px 8%;
  background:white;
}

.content h2{
  color:var(--bleu);
  font:600 44px/1.05 'Cormorant Garamond',serif;
}

.content h2 em{
  color:var(--or);
  font-weight:500;
}

.big{
  color:#59442a;
  font:25px/1.4 'Cormorant Garamond',serif;
}

.button{
  display:inline-block;
  margin-top:18px;
  padding:13px 22px;
  border-radius:24px;
  background:linear-gradient(120deg,#76511a,#d4a943);
  color:white;
  text-decoration:none;
  font-size:10px;
  font-weight:600;
}

.quote{
  margin:30px 0;
  padding:28px;
  background:linear-gradient(120deg,#e7edd5,#fff9ec);
  border-left:4px solid var(--or);
  font:italic 20px/1.5 'Cormorant Garamond',serif;
}

.grid3{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin:35px 0;
}

.card{
  padding:28px;
  background:var(--creme);
  border:1px solid #e8dcc2;
}

.card .num{
  color:var(--or);
  font-size:11px;
  font-weight:600;
}

.card h3{
  margin:6px 0;
  font:27px 'Cormorant Garamond',serif;
}

.price{
  margin:0 0 35px;
  text-align:center;
}

.price strong{
  display:block;
  color:var(--or);
  font:600 70px/1 'Cormorant Garamond',serif;
}

.price span{
  font-size:9px;
  letter-spacing:2px;
}

.phone{
  display:block;
  margin:20px 0;
  color:var(--brun);
  text-decoration:none;
  font:600 46px 'Cormorant Garamond',serif;
}

.nature{
  padding:70px 9%;
  text-align:center;
  color:white;
  background:linear-gradient(145deg,#829064,#4c553b);
}

.nature h2{
  margin:10px auto 20px;
  max-width:760px;
  color:white;
  font:600 45px/1.05 'Cormorant Garamond',serif;
}

.nature p{
  max-width:760px;
  margin:0 auto;
}

footer{
  padding:35px 6%;
  text-align:center;
  color:white;
  background:linear-gradient(#79506e,#422a49);
}

footer b{
  display:block;
  font:italic 28px 'Cormorant Garamond',serif;
}

footer span{
  display:block;
  margin-top:5px;
  font-size:10px;
}

@media(max-width:760px){
  nav{display:none}
  header{height:66px;padding:0 20px}
  .hero{padding:55px 7%}
  .hero h1{font-size:52px}
  .content{padding:55px 7%}
  .content h2,.nature h2{font-size:38px}
  .grid3{grid-template-columns:1fr}
  .phone{font-size:34px}
}

/* ==========================================
   MENU MAITRE — MEMES DIMENSIONS QUE L'ACCUEIL
   ========================================== */

body > header{
  width:100% !important;
  max-width:1300px !important;
  height:78px !important;
  margin:0 auto !important;
  padding:0 5% !important;

  display:flex !important;
  align-items:center !important;

  background:
    linear-gradient(
      90deg,
      #596a39,
      #35451f
    ) !important;
}

body > header .brand{
  margin-right:auto !important;

  font:
    italic 31px
    'Cormorant Garamond',
    Georgia,
    serif !important;

  line-height:1 !important;
}

body > header nav{
  display:flex !important;
  align-items:center !important;
  gap:25px !important;
}

body > header nav a{
  padding:7px 0 !important;

  font-family:
    Montserrat,
    Arial,
    sans-serif !important;

  font-size:10px !important;
  font-weight:400 !important;

  line-height:1 !important;
  letter-spacing:.15px !important;
}

body > header nav a.active{
  border-bottom:
    1px solid #d9ad3e !important;
}

body > header .rdv{
  margin-left:28px !important;

  padding:10px 19px !important;

  border-radius:22px !important;

  font-family:
    Montserrat,
    Arial,
    sans-serif !important;

  font-size:10px !important;
  font-weight:600 !important;

  line-height:1 !important;
}

/* Mobile */

@media(max-width:760px){

  body > header{
    height:68px !important;
    padding:0 20px !important;
  }

  body > header .brand{
    font-size:27px !important;
  }

  body > header nav{
    display:none !important;
  }

  body > header .rdv{
    margin-left:15px !important;
  }
}

/* ===== MENU INTERNE — TYPOGRAPHIE PLUS GRANDE ===== */

body > header .brand{
  font-size:36px !important;
}

body > header nav{
  gap:24px !important;
}

body > header nav a{
  font-size:14px !important;
  font-weight:500 !important;
  letter-spacing:.1px !important;
}

body > header .rdv{
  padding:11px 21px !important;
  font-size:13px !important;
  font-weight:600 !important;
}

@media(max-width:1000px){

  body > header nav{
    gap:16px !important;
  }

  body > header nav a{
    font-size:12px !important;
  }

  body > header .brand{
    font-size:32px !important;
  }

  body > header .rdv{
    margin-left:18px !important;
    font-size:12px !important;
  }
}

@media(max-width:760px){

  body > header .brand{
    font-size:30px !important;
  }

  body > header .rdv{
    font-size:12px !important;
  }
}

/* ===== MENU PRINCIPAL — TAILLE DEFINITIVE PLUS LISIBLE ===== */

body > header nav a{
  font-size:17px !important;
  font-weight:500 !important;
  letter-spacing:0 !important;
}

body > header nav{
  gap:22px !important;
}

body > header .brand{
  font-size:38px !important;
}

body > header .rdv{
  font-size:15px !important;
  padding:12px 22px !important;
}

/* Adaptation écrans intermédiaires */
@media(max-width:1100px){

  body > header nav{
    gap:15px !important;
  }

  body > header nav a{
    font-size:15px !important;
  }

  body > header .brand{
    font-size:34px !important;
  }

  body > header .rdv{
    font-size:13px !important;
    padding:10px 17px !important;
    margin-left:15px !important;
  }
}

/* ===== CORRECTION FINALE LISIBILITE MENU ===== */

body > header nav a{
  font-size:20px !important;
  font-weight:500 !important;
  line-height:1.2 !important;
  letter-spacing:0 !important;
}

body > header nav{
  gap:30px !important;
}

body > header .rdv{
  font-size:17px !important;
  padding:13px 25px !important;
}

/* Écrans un peu moins larges */
@media(max-width:1200px){

  body > header nav{
    gap:20px !important;
  }

  body > header nav a{
    font-size:17px !important;
  }

  body > header .rdv{
    font-size:15px !important;
  }
}

/* ===== MENU GRAND FORMAT — PRIORITE ABSOLUE ===== */

@media(min-width:901px){

  body > header{
    height:100px !important;
    padding:0 4% !important;
  }

  body > header .brand{
    font-size:44px !important;
  }

  body > header nav{
    gap:28px !important;
  }

  body > header nav a{
    font-size:24px !important;
    font-weight:500 !important;
    line-height:1.2 !important;
    letter-spacing:0 !important;
  }

  body > header .rdv{
    margin-left:30px !important;
    padding:14px 28px !important;
    font-size:19px !important;
  }

}