/* RESET + VARIABLES */
:root{
  /* Polices */
  --font-title: "Montserrat", sans-serif;
  --font-body:  "Calibri", sans-serif;

  /* Couleurs */
  --color-primary: #dbb83b;
  --color-secondary: #2d9345;
  --color-dark: #1a1a1a;
  --color-light: #f7f7f7;
  --color-line:#eeeeee;
  --color-bg:#ffffff;
  --color-g:#666766;

  /* Layout */
  --container: 1320px;
  --gutter: 16px;

  /* Z-index */
  --z-header: 1000;
  --z-overlay: 1100;

  /* Logo */
  --hpad: 20px;          
  --hpad-shrink: 6px;     
  --logo-h: 90px;         
  --logo-h-shrink: 63px;  

  --header-offset: 96px;
}

[id] {
  scroll-margin-top: 120px;
}

/* Reset simple */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
html.no-scroll, html.no-scroll body{overflow:hidden}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--color-text);
  background:var(--color-bg);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
a:hover{opacity:.9; color:var(--color-secondary)}
ul,ol{margin:0;padding:0}

/* Titres */
h1,h2,h3,h4,h5{
  font-family:var(--font-title);
  margin:0 0 .5em;
  line-height:1.2;
}

/* Conteneur utilitaire */
.container{max-width:var(--container);margin:0 auto;padding:0 var(--gutter)}
.wrap{max-width:var(--container);margin:0 auto;padding:0 var(--gutter)}

/* Accessibilité */
.sr-only{
  position:absolute!important; width:1px;height:1px; padding:0;margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}



/* Boutons de base */
.btn{display:inline-flex; align-items:center; gap:8px; padding:10px 22px; border-radius:10px;
     font-weight:800; text-transform:uppercase; transition:transform .08s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease}
.btn--primary{background:var(--color-secondary); color: #fff}
.btn--primary:hover{background:#2e9e58; color:#fff}
.btn--ghost{background:#fff; border: 1px solid var(--color-secondary); color: var(--color-secondary);}
.btn--ghost:hover{background:#2e9e58; color:#fff}


/* Utilitaires divers */
.text-center{text-align:center}
.mt-1{margin-top:.5rem} .mt-2{margin-top:1rem} .mt-3{margin-top:1.5rem}
.mb-1{margin-bottom:.5rem} .mb-2{margin-bottom:1rem} .mb-3{margin-bottom:1.5rem}
.p-1{padding:.5rem} .p-2{padding:1rem}

/* Lien souligné propre */
.link-underline{
  background:linear-gradient(transparent calc(100% - 2px), currentColor 0) no-repeat;
  background-size:0 100%; transition:background-size .25s ease;
}
.link-underline:hover{background-size:100% 100%}

/* Petites grilles */
.grid{display:grid; gap:1rem}
@media (min-width:768px){ .grid--2{grid-template-columns:repeat(2,1fr)} }
@media (min-width:992px){ .grid--3{grid-template-columns:repeat(3,1fr)} }

/* Classe utilitaire pour la <span class="trait"> */
.trait{
  background: linear-gradient(transparent 60%, #dbb83b 0); padding: 0 .08em; font-weight: 700; border-bottom: none !important; 
  text-decoration: none; -webkit-box-decoration-break: clone; box-decoration-break: clone;
}
