/* Palette “planète & RSE” — inspirée de tes couleurs préférées */
:root{
  --c1:#F6BD60; /* miel doré */
  --c2:#F7EDE2; /* sable */
  --c3:#F5CAC3; /* rosé */
  --c4:#84A59D; /* sauge */
  --c5:#F28482; /* corail */
  --ink:#1b1b1b;
  --muted:#5e5e5e;
  --bg:#ffffff;
  --tint:#faf7f4;
  --radius:16px;
  --shadow:0 10px 30px rgba(0,0,0,.06);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.6;
}

img{max-width:100%;height:auto;display:block}

.container{
  width:min(1120px, calc(100% - 2rem));
  margin-inline:auto;
}

.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.9);
  backdrop-filter:saturate(120%) blur(6px);
  border-bottom:1px solid #eee;
}
.site-header .container{
  display:flex; align-items:center; justify-content:space-between;
  padding:.75rem 0;
}

.brand{display:flex;align-items:center;gap:.6rem;color:var(--ink);text-decoration:none;font-weight:800;letter-spacing:.2px}
.brand-mark{color:var(--c4)}
.brand-text{font-size:1.05rem}

.site-nav{display:flex;gap:1rem;align-items:center}
.site-nav a{color:var(--ink);text-decoration:none;padding:.5rem .6rem;border-radius:10px}
.site-nav a:hover{background:var(--c2)}

.btn{
  display:inline-block;padding:.75rem 1rem;border-radius:999px;
  text-decoration:none;font-weight:600;border:1.5px solid transparent;
  box-shadow:var(--shadow);
}
.btn--primary{background:var(--c4);color:#fff}
.btn--primary:hover{filter:brightness(0.95)}
.btn--ghost{background:transparent;border-color:var(--ink);color:var(--ink)}
.btn--ghost:hover{background:#fff}

.nav-toggle{display:none}
.nav-burger{display:none;cursor:pointer;padding:.25rem}
.nav-burger span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0;border-radius:2px}

/* Hero */
.hero{
  padding:clamp(2rem, 6vw, 5rem) 0;
  background:
    radial-gradient(1200px 400px at 80% 0%, rgba(132,165,157,.12), transparent),
    radial-gradient(800px 300px at 0% 20%, rgba(242,132,130,.10), transparent);
}
.hero .container{
  display:grid;grid-template-columns:1.2fr .8fr;gap:2rem;align-items:center;
}
.hero h1{font-size:clamp(1.8rem, 2.6vw, 3rem);line-height:1.2;margin:0 0 .75rem}
.hero .accent{color:var(--c5)}
.lead{font-size:1.1rem;color:var(--muted);max-width:60ch}
.cta-row{display:flex;gap:.75rem;margin:1rem 0 1.25rem;flex-wrap:wrap}
.stats{list-style:none;padding:0;margin:1rem 0 0;display:flex;gap:1rem;flex-wrap:wrap}
.stats li{background:#fff;border:1px solid #eee;border-radius:12px;padding:.75rem 1rem;min-width:220px;box-shadow:var(--shadow)}
.stats strong{font-size:1.1rem;display:block}

/* Sections */
.section{padding:clamp(2rem, 6vw, 4rem) 0}
.section--tint{background:var(--tint)}
.grid-2{display:grid;grid-template-columns:1.2fr .8fr;gap:2rem}

h2{font-size:clamp(1.4rem, 2vw, 2rem);margin:0 0 1rem}
h3{margin:.3rem 0 0.6rem}

.bullets{padding-left:1rem;margin:.5rem 0}
.bullets li{margin:.25rem 0}

.card{
  background:#fff;border:1px solid #eee;border-radius:var(--radius);
  padding:1rem; box-shadow:var(--shadow);
}
.highlight{border-left:6px solid var(--c1)}

.kv{margin:0;padding:0;list-style:none}
.kv li,.kv dt,.kv dd{margin:.25rem 0}
.kv dt{font-weight:600}

.cards{
  display:grid;grid-template-columns:repeat(3, 1fr);gap:1rem
}
.cards--wide{grid-template-columns:repeat(2, 1fr)}
.service ul{margin:.25rem 0 0}

.timeline{position:relative;margin-left:.5rem}
.timeline:before{content:"";position:absolute;left:8px;top:0;bottom:0;width:2px;background:linear-gradient(var(--c4), var(--c5))}
.tl-item{position:relative;padding-left:2rem;margin:1rem 0}
.tl-dot{position:absolute;left:0;top:.4rem;width:16px;height:16px;border-radius:50%;background:var(--c4);box-shadow:0 0 0 3px #fff, var(--shadow)}
.tl-content .meta{color:var(--muted)}

/* Marquee logos */
.marquee-wrap{
  overflow:hidden;border:1px solid #eee;border-radius:var(--radius);
  padding: .75rem;background:#fff;box-shadow:var(--shadow)
}
.marquee{
  display:flex;align-items:center;gap:2.5rem;
  animation:scroll 28s linear infinite;
}
.marquee img{height:44px;width:auto;opacity:.9;filter:grayscale(100%);transition:opacity .2s, filter .2s}
.marquee img:hover{opacity:1;filter:none}
.marquee-wrap:hover .marquee{animation-play-state:paused}
.marquee-note{color:var(--muted);font-size:.9rem;margin-top:.5rem}

@keyframes scroll{
  0%{transform:translateX(0)}
  100%{transform:translateX(-50%)}
}
@media (prefers-reduced-motion: reduce){
  .marquee{animation:none}
}

/* Quotes */
.quotes{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.quote{background:#fff;border-left:6px solid var(--c5);padding:1rem;border-radius:var(--radius);box-shadow:var(--shadow)}
.quote blockquote{margin:0 0 .5rem}

/* Form */
.form label{display:block;font-weight:600;margin:.5rem 0}
.form input,.form textarea{
  width:100%;padding:.75rem;border:1px solid #ddd;border-radius:12px;
  font:inherit
}
.form input:focus,.form textarea:focus{outline:2px solid var(--c4);border-color:var(--c4)}
.form-note{color:var(--muted);font-size:.9rem;margin:.5rem 0 0}

/* Footer */
.site-footer{background:linear-gradient(180deg, #fff, var(--tint));border-top:1px solid #eee}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:1rem;padding:2rem 0;align-items:start}
.site-footer nav a{display:block;color:var(--ink);text-decoration:none;margin:.25rem 0}
.site-footer nav a:hover{text-decoration:underline}
.copyright{grid-column:1/-1;color:var(--muted);margin:0}

/* Responsive */
@media (max-width: 980px){
  .hero .container{grid-template-columns:1fr}
  .hero-visual{order:-1;max-width:520px;margin-inline:auto}
  .grid-2{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr 1fr}
  .quotes{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width: 720px){
  .cards,.cards--wide{grid-template-columns:1fr}
  .site-nav{
    position:absolute;inset:60px 0 auto 0;background:#fff;border-bottom:1px solid #eee;
    display:none;flex-direction:column;gap:0;padding:.5rem
  }
  .site-nav a{padding:.9rem 1rem;border-radius:0}
  .nav-burger{display:block}
  .nav-toggle:checked ~ .nav-burger + .site-nav{display:flex}
}

/* Impression */
@media print{
  .site-header,.hero-visual,.cta-row,.marquee-wrap,.quotes,.form,.site-footer{display:none !important}
  body{font-size:11pt}
  .card,.highlight{border:none;box-shadow:none}
}