/* L'enfant dans la nature — reconstruction statique (origine : Strikingly) */
@import url('https://fonts.googleapis.com/css2?family=Istok+Web:ital,wght@0,400;0,700;1,400;1,700&family=Montserrat:ital,wght@0,400;0,700;1,400&display=swap');

:root{
  --f-title:"Istok Web", Helvetica, sans-serif;
  --f-body:Montserrat, Helvetica, sans-serif;
  --text:#1d2023;
  --accent:#8acd7b;
  --link:#2aabd9;
  --sidebar:229px;
  --container:1053px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--f-body);color:var(--text);background:#fff;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--link)}
p,h1,h2,h3,h4,h5,h6{margin:0 0 .35em}
h1,h2,h3,h4,h5,h6{font-weight:400}
ul,ol{margin:0 0 1em;padding-left:1.4em}
blockquote{margin:0 0 1em;padding-left:1em;border-left:3px solid var(--accent)}

/* ---------- Navigation latérale ---------- */
.sidebar{position:fixed;top:0;left:0;bottom:0;width:var(--sidebar);background:#fff;z-index:50;
  display:flex;flex-direction:column;align-items:center;overflow-y:auto;padding:123px 22px 40px;text-align:center}
.sidebar .logo img{width:169px;height:auto;margin:0 auto 40px}
.sidebar nav ul{list-style:none;margin:0 auto;padding:0;width:169px}
.sidebar nav li{margin:0 0 15px}
.sidebar nav a{font-family:var(--f-body);font-size:16px;color:#000;text-decoration:none;line-height:1;
  padding-bottom:2px;border-bottom:1px solid transparent;transition:border-color .2s}
.sidebar nav a:hover,.sidebar nav a.active{border-bottom-color:#000}
.burger{display:none}

/* ---------- Contenu ---------- */
main{margin-left:var(--sidebar)}
.section{position:relative;background-size:cover;background-position:50% 50%;background-repeat:no-repeat}
.section.overlay::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.35)}
.section > .inner{position:relative;z-index:1}
.container{max-width:var(--container);margin:0 auto;padding:0 10px;display:flex;flex-wrap:wrap}
.container > *{width:100%}
.col{padding:0 11px;min-width:0}
.c1{width:6.25%}.c2{width:12.5%}.c3{width:18.75%}.c4{width:25%}.c5{width:31.25%}.c6{width:37.5%}
.c7{width:43.75%}.c8{width:50%}.c9{width:56.25%}.c10{width:62.5%}.c11{width:68.75%}.c12{width:75%}
.c13{width:81.25%}.c14{width:87.5%}.c15{width:93.75%}.c16{width:100%}
.row{display:flex;flex-wrap:wrap;width:100%;align-items:flex-start}
.rep-item{margin-bottom:35px;width:100%}
.rep-item:last-child{margin-bottom:0}
.title-group{margin-bottom:30px}
.item-title,.item-subtitle{margin-bottom:5px}
.txt{overflow-wrap:break-word}
.txt img{margin:0 auto}
.section.light .txt a{color:#fff}

/* Galeries (logos partenaires / presse) */
.gallery{display:flex;flex-wrap:wrap;justify-content:center;gap:20px;margin:0 auto;padding:0 11px}
.gallery.g2{max-width:calc(2*165px + 1*20px + 22px)}
.gallery.g3{max-width:calc(3*165px + 2*20px + 22px)}
.gallery.g4{max-width:calc(4*165px + 3*20px + 22px)}
.gallery.g5{max-width:calc(5*165px + 4*20px + 22px)}
.g-item{width:165px}
.g-item img{width:165px;height:165px;object-fit:cover}
.g-item a{display:block}

/* Boutons */
.btn{display:inline-block;padding:12px 26px;border:1px solid currentColor;border-radius:3px;text-decoration:none;font-family:var(--f-body);font-size:15px;margin:10px 0}
.btn:hover{opacity:.85}

/* Médias intégrés */
iframe.embed{width:100%;aspect-ratio:16/9;border:0}

/* Formulaire de contact */
.contact-form{max-width:640px;margin:30px auto 0;padding:0 11px;text-align:left}
.contact-form label{display:block;font-size:15px;margin:14px 0 6px}
.contact-form input,.contact-form textarea{width:100%;padding:12px;font:inherit;font-size:15px;border:1px solid #ccc;border-radius:3px;background:rgba(255,255,255,.95);color:#1d2023}
.contact-form textarea{min-height:140px;resize:vertical}
.contact-form button{margin-top:16px;padding:12px 30px;font:inherit;font-size:15px;background:#8acd7b;color:#fff;border:0;border-radius:3px;cursor:pointer}
.contact-form .hp{position:absolute;left:-9999px}
.contact-form button:disabled{opacity:.6;cursor:default}
.contact-form .form-status{margin:14px 0 0;font-size:15px;color:#fff}
.section.light .contact-form label{color:#fff}

/* Pied de page */
.site-footer{margin-left:var(--sidebar);padding:30px 20px;text-align:center;font-size:13px;color:#777;border-top:1px solid #eee}
.site-footer a{color:#777}

/* ---------- Mobile ---------- */
@media (max-width:767px){
  .sidebar{position:sticky;top:0;bottom:auto;width:100%;height:auto;flex-direction:row;justify-content:space-between;
    padding:10px 16px;box-shadow:0 1px 4px rgba(0,0,0,.08);overflow:visible}
  .sidebar .logo img{width:120px;margin:0}
  .burger{display:block;background:none;border:0;font-size:26px;line-height:1;cursor:pointer;padding:6px}
  .sidebar nav{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;padding:20px 0;box-shadow:0 4px 8px rgba(0,0,0,.08)}
  .sidebar nav.open{display:block}
  main,.site-footer{margin-left:0}
  .section{padding-top:50px!important;padding-bottom:50px!important;min-height:0!important}
  .container{padding:0 16px}
  .col{width:100%!important;padding:0;margin-bottom:16px;order:0!important}
  .sidebar nav ul{width:auto}
  .gallery{padding:0;gap:14px}
  .g-item,.g-item img{width:140px;height:140px}
  .txt h1{font-size:28px!important;line-height:1.2!important}
  .txt h2{font-size:24px!important;line-height:1.25!important}
  .txt p,.txt h3,.txt h4,.txt h6,.txt li{font-size:16px!important;line-height:1.5!important}
}
