
:root{
  --rose:#DB6F89;
  --roseclair:#FFF1F4;
  --creme:#FFF8F5;
  --dore:#C7A46A;
  --texte:#4A2C2A;
}
*{box-sizing:border-box}
body{margin:0;font-family:Arial,sans-serif;background:var(--creme);color:var(--texte);line-height:1.6}
.topbar{background:var(--rose);color:white;text-align:center;padding:13px;font-weight:700}
header{background:white;padding:18px 7%;display:flex;align-items:center;justify-content:space-between;box-shadow:0 4px 18px #0001;position:sticky;top:0;z-index:5}
.logo{height:90px}
nav a{margin:0 10px;color:var(--texte);text-decoration:none;font-weight:700}
.hero{padding:70px 8%;text-align:center;background:linear-gradient(120deg,#fff,#ffe6ec)}
h1{font-size:64px;color:var(--rose);margin:0}
.slogan{font-size:30px;font-style:italic;color:var(--rose)}
.btn{display:inline-block;background:var(--rose);color:white;text-decoration:none;padding:15px 28px;border-radius:35px;font-weight:700;margin:8px}
.btn.alt{background:white;color:var(--rose);border:1px solid var(--rose)}
.section{padding:45px 8%}
.card{background:white;border:1px solid #f2cbd5;border-radius:22px;padding:28px;margin:18px 0;box-shadow:0 8px 22px #0000000a}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.notice{background:var(--roseclair);border:1px solid #f2cbd5;border-radius:24px;padding:28px;text-align:center}
.price{font-size:42px;color:var(--rose);font-weight:900}
.photo{height:230px;border:2px dashed #e8a7b8;border-radius:22px;background:white;display:flex;align-items:center;justify-content:center;color:#b56b7e;font-weight:700;text-align:center;padding:20px}
footer{background:var(--rose);color:white;text-align:center;padding:35px}
footer a{color:white}
@media(max-width:850px){
  header{display:block;text-align:center}
  nav a{display:inline-block;margin:7px}
  .grid,.grid4{grid-template-columns:1fr}
  h1{font-size:42px}
}
