
:root{
  --creme:#fbf5ed;
  --creme-carte:#f7eee3;
  --bleu:#0d447d;
  --bleu-clair:#d7e1ed;
  --bleu-moyen:#9fb3cc;
  --texte:#202936;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;overflow-x:hidden;background:var(--creme);color:var(--texte);font-family:Arial,Helvetica,sans-serif;line-height:1.55}
img{display:block;max-width:100%}
a{color:inherit}
.conteneur{width:min(1180px,calc(100% - 40px));margin-inline:auto}
.navigation{display:flex;justify-content:center;gap:42px;padding:22px 18px;color:var(--bleu);text-transform:uppercase;letter-spacing:.06em;font-size:.9rem}
.navigation a{text-decoration:none}
.navigation-masquee{display:none}

.hero{position:relative;min-height:475px;display:grid;place-items:center;overflow:visible;padding:74px 20px 46px}
.hero-contenu{position:relative;z-index:4;text-align:center}
.hero h1{margin:0;color:var(--bleu);font:400 clamp(4rem,9vw,7.25rem)/.95 Georgia,"Times New Roman",serif}
.profession{margin:25px 0 0;color:var(--bleu);font-size:clamp(1.15rem,2vw,1.65rem);letter-spacing:.28em;text-transform:uppercase}
.accroche{margin:22px 0 0;font-size:clamp(1.05rem,1.8vw,1.35rem)}
.separateur,.separateur-gauche{display:flex;align-items:center;gap:10px;width:110px;margin:22px auto 0}
.separateur:before,.separateur:after,.separateur-gauche:before,.separateur-gauche:after{content:"";height:1px;flex:1;background:#8fa9c8}
.separateur span,.separateur-gauche span{width:7px;height:7px;border-radius:50%;background:#8fa9c8}
.logo-tete{position:absolute;z-index:5;top:24px;left:max(30px,calc((100vw - 1180px)/2));width:142px}
.botanique-droite{position:absolute;z-index:4;right:18px;top:255px;width:180px;opacity:.78}
.decor{position:absolute;z-index:1;pointer-events:none}
.decor-top{top:0;right:0;width:520px;height:470px}
.decor-left{left:0;bottom:-190px;width:340px;height:620px}

.specialites{position:relative;z-index:2;display:grid;grid-template-columns:repeat(3,1fr);padding:6px 0 66px}
.specialite{text-align:center;padding:0 52px}
.specialite+.specialite{border-left:1px solid rgba(40,50,60,.2)}
.specialite>img{width:132px;height:132px;object-fit:cover;border-radius:50%;margin:0 auto 18px}
.specialite h2{margin:0;color:var(--bleu);font-size:1.2rem;line-height:1.45}
.specialite ul{width:max-content;margin:18px auto 0;padding-left:20px;text-align:left;font-size:1.05rem}
.specialite p{margin-top:18px;font-size:1.05rem}
.mini-separateur{position:relative;width:76px;height:1px;background:#8fa9c8;margin:22px auto}
.mini-separateur:after{content:"";position:absolute;left:calc(50% - 3px);top:-3px;width:7px;height:7px;border-radius:50%;background:#6f90b6}

.presentation{display:grid;grid-template-columns:1.08fr .92fr;gap:65px;align-items:center;padding:20px 0 55px}
.photo-cabinet{width:100%;aspect-ratio:1.45;object-fit:cover;border-radius:22px}
.presentation h2,.ouverture h2{margin:0;color:var(--bleu);font:400 clamp(2rem,3vw,3rem) Georgia,"Times New Roman",serif}
.separateur-gauche{margin-left:0}
.presentation-texte>p{margin-top:24px;font-size:1.08rem}
.valeurs{display:flex;align-items:center;gap:14px;margin-top:28px;color:var(--bleu);font-weight:600}
.valeurs img{width:45px;height:45px;object-fit:contain}
.valeurs p{margin:0}

.ouverture{display:grid;grid-template-columns:82px 1fr 280px;gap:28px;align-items:center;margin-bottom:28px;padding:24px 28px;border:1px solid #8fa9c8;border-radius:18px;background:rgba(255,255,255,.26)}
.ouverture h2{font-size:clamp(1.6rem,2.3vw,2.2rem)}
.ouverture p{margin:8px 0 0}
.icone-cercle{display:grid;place-items:center;width:58px;height:58px;flex:0 0 58px;border-radius:50%;background:#e3ebf4;overflow:hidden}
.icone-cercle.grande{width:76px;height:76px}
.icone-cercle img{width:100%;height:100%;object-fit:contain}
.bouton-indisponible{display:flex;flex-direction:column;gap:10px;padding:18px 22px;color:white;background:linear-gradient(135deg,#174f88,#315f94);border-radius:14px;text-decoration:none}
.bouton-indisponible strong{font-size:1.18rem}
.bouton-indisponible span{font-size:.92rem}

.informations{display:grid;grid-template-columns:repeat(3,1fr);margin-bottom:28px;border-radius:16px;background:rgba(244,234,222,.72)}
.information{display:flex;align-items:center;gap:18px;padding:22px 28px}
.information+.information{border-left:1px solid rgba(30,50,70,.18)}
.information p{margin:0}

footer{display:flex;justify-content:center;gap:32px;padding:25px 20px;color:white;background:linear-gradient(90deg,#194d82,#315f94)}
footer a{text-decoration:none}
footer a:hover{text-decoration:underline}

.page-simple{min-height:calc(100vh - 74px);display:grid;place-items:center;padding:50px 20px}
.carte-simple{width:min(760px,100%);padding:46px;border:1px solid rgba(13,68,125,.28);border-radius:22px;background:rgba(255,255,255,.38);text-align:center}
.carte-simple h1{color:var(--bleu);font:400 clamp(2.2rem,6vw,4rem) Georgia,"Times New Roman",serif}

@media(max-width:900px){
  .specialites{grid-template-columns:1fr;gap:36px}
  .specialite{padding:0 20px 34px}
  .specialite+.specialite{border-left:0;border-top:1px solid rgba(40,50,60,.15);padding-top:36px}
  .presentation{grid-template-columns:1fr;gap:35px}
  .ouverture{grid-template-columns:72px 1fr}
  .bouton-indisponible{grid-column:1/-1}
  .informations{grid-template-columns:1fr}
  .information+.information{border-left:0;border-top:1px solid rgba(30,50,70,.15)}
}
@media(max-width:600px){
  .hero{min-height:430px;padding:84px 20px 50px}
  .hero h1{font-size:3.7rem}
  .profession{letter-spacing:.16em}
  .accroche br{display:none}
  .logo-tete{top:20px;left:16px;width:88px}
  .botanique-droite{display:none}
  .decor-top{width:330px;height:360px}
  .decor-left{width:260px;height:470px;bottom:-150px}
  .ouverture{grid-template-columns:1fr;text-align:center;padding:22px}
  .icone-cercle.grande{margin:auto}
  footer{flex-direction:column;align-items:center;gap:6px}
  footer span{display:none}
}
