
:root{--or:#FE904D;--noir:#000;--encre:#1a1a1a;--gris:#5a5a5a;--creme:#f8f5ef}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;font-family:'DM Sans',Arial,sans-serif;font-weight:300;font-size:16px;line-height:1.6;color:var(--encre);background:#fff}
h1,h2,h3,h4{font-family:'Alice',Georgia,serif;font-weight:400;margin:0;color:#000}
a{color:inherit}
.bouton{display:inline-block;background:var(--or);color:#fff;text-decoration:none;font-size:14px;font-weight:400;padding:15px 38px;border:0;cursor:pointer;transition:filter .2s}
.bouton:hover{filter:brightness(.93)}
.bouton.blanc{background:#fff;color:#000}
.centre{text-align:center}
header{position:sticky;top:0;z-index:50;background:#000;color:#fff}
header .in{max-width:1180px;margin:0 auto;padding:10px 24px;display:flex;align-items:center;gap:24px}
header .logo img{display:block;height:50px;width:auto}
header nav{flex:1;display:flex;justify-content:center;gap:34px}
header nav a{color:#fff;text-decoration:none;font-size:14px;font-weight:400;padding:4px 0;border-bottom:2px solid transparent}
header nav a:hover,header nav a.actif{border-bottom-color:#fff}
header .bouton{background:#fff;color:#000;padding:14px 34px}
#burger{display:none;background:none;border:0;color:#fff;font-size:30px;line-height:1;cursor:pointer;margin-left:auto;padding:4px 8px}
.hero{max-width:1180px;margin:0 auto;padding:70px 24px 64px;text-align:center}
.hero h1{font-size:clamp(34px,4.6vw,58px);line-height:1.18;max-width:960px;margin:0 auto 22px}
.hero p{font-size:18px;color:#444;max-width:1080px;margin:0 auto 34px}
.bande{background-size:cover;background-repeat:no-repeat}
.bande.a{height:270px;background-image:url(../img/equipe.jpg);background-position:50% 100%}
.bande.b{height:760px;background-image:url(../img/equipe.jpg);background-position:50% 30%}
.attentes{max-width:1180px;margin:0 auto;padding:84px 24px 80px;text-align:center}
.attentes h2{font-size:clamp(32px,4vw,48px);margin-bottom:56px}
.cols{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;text-align:left;max-width:920px;margin:0 auto 52px}
.cols h4{font-family:'Alice',Georgia,serif;font-size:17px;margin-bottom:14px}
.cols p{margin:0;font-size:14px;line-height:2;color:#333}
.orange{background:var(--or);color:#fff;text-align:center;padding:90px 24px 100px}
.orange h2{color:#fff;font-size:clamp(28px,3.9vw,50px);line-height:1.25;max-width:1000px;margin:0 auto 44px}
.citation{max-width:1180px;margin:0 auto;padding:60px 24px 70px}
.citation .photo{background:url(../img/clavier.jpg) center 35%/cover;padding:64px 20px;display:flex;justify-content:center}
.citation .carte{background:#fff;max-width:620px;width:100%;padding:52px 40px 44px;text-align:center;box-shadow:0 4px 20px rgba(0,0,0,.18)}
.citation h2{font-size:clamp(26px,3.2vw,38px);line-height:1.4;margin-bottom:22px}
.citation h2 em{font-style:normal;color:var(--or)}
.citation .signe{font-size:14px;margin:0 0 26px;color:#333}
footer{background:#000;color:#fff;padding:44px 24px 40px}
footer .in{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1.2fr 1fr 1.2fr 1fr;gap:30px;align-items:start}
footer img{height:56px;width:auto;display:block;margin-bottom:12px}
footer .copie{font-size:14px;font-weight:700}
footer nav a{display:block;color:#fff;text-decoration:none;font-size:14px;font-weight:400;line-height:2}
footer .coord{font-size:14px;line-height:2}
footer .coord a{text-decoration:none}
footer .bouton{display:block;text-align:center;background:#fff;color:#000}
@media (max-width:900px){
header nav,header .bouton{display:none}
#burger{display:block}
header.ouvert .in{flex-wrap:wrap}
header.ouvert nav{display:flex;flex-direction:column;align-items:flex-start;gap:14px;flex-basis:100%;padding:10px 0 18px}
header.ouvert .bouton{display:inline-block;flex-basis:auto}
.hero{padding:44px 20px 44px}
.hero p{font-size:16px}
.bande.a{height:170px}.bande.b{height:420px}
.cols{grid-template-columns:1fr;gap:30px}
.attentes{padding:56px 20px}
.orange{padding:60px 20px 68px}
.citation{padding:36px 16px 44px}
.citation .photo{padding:36px 12px}
.citation .carte{padding:34px 22px}
footer .in{grid-template-columns:1fr;gap:22px}
}
