/* typographie, couleurs globales, variables CSS, styles généraux des balises 
(body, h1, h2, p, a, ul…) */

/* Accessibilité & utilitaires */
.skip-link{
  position:absolute;
  left:-9999px;
  top:auto;
  width:1px;
  height:1px;
  overflow:hidden;
}
.skip-link:focus{

  position: static;
  width: auto;
  height: auto;
  padding: 0.5rem 0.75rem;
  margin: 0.5rem;
  background: #000;
  color: #fff;
  border-radius: 8px;
  outline: 2px solid currentColor;   
  outline-offset: 2px;
  z-index: 1000;
}

/* cache visuel conservant l’accessibilité une seule règle pour 2 classes */
.visually-hidden,
.sr-only{
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}

/*  Variables inchangées, décimales normalisées  */
:root{
  --activites-title-font: "Merriweather", serif;
  --activites-text-font: "Open Sans", system-ui, -apple-system, sans-serif;
  --activites-btn-font: "Merriweather", serif;

  --activites-accent: #cc9d82;   /* couleur du titre + bouton */
  --activites-btn-text: #fffafe; /* couleur du texte du bouton */

  --brand: #d8942d;        /* bandeau header + boutons */
  --brand-dark:#b3741e;
  --cream: #f4ece2;        /* sections alternées */
  --paper: #fff;           /* cartes */
  --ink: #2b2b2b;
  --muted:#7a6f63;

  --radius-lg: 18px;
  --radius-md: 12px;
  --shadow: 0 8px 24px rgba(0,0,0,0.08);

  --space-1: 0.5rem;
  --space-2: 0.875rem;
  --space-3: 1.25rem;
  --space-4: 2rem;
  --space-5: 3rem;
  --max: 1200px;
}

:root{
  --lodgings-title-font: "Merriweather", serif;
  --lodgings-text-font: "Open Sans", system-ui, -apple-system, sans-serif;
  --lodgings-accent: #cc9d82;
  --lodgings-btn-text: #fffafe;
}

:root{
  --animals-title-font: "Merriweather", serif;
  --animals-text-font: "Open Sans", system-ui, -apple-system, sans-serif;
  --animals-accent: #cc9d82;
  --animals-btn-text: #fffafe;
  --animals-card-bg: #FFFBF6;
}

/* newsletter */
:root{
  --nl-overlay: rgba(0,0,0,0.35);
}

/* footer */
:root{
  --footer-bg: #d8942d;          /* orangé du footer */
  --footer-text: #fffafe;
  --footer-muted: rgba(255,255,255,0.85);
  --footer-link: #fffafe;
  --footer-link-hover: #ffffff;
  --footer-heading: #fff;
}


/*  Contact — Variables */
:root {
    --contact-bg: #FDF7F6;
    --contact-title: #5A4633;
    --contact-accent: #CC9D82;
}



/*  Base typographie et layout */
*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }

body{
  margin: 0;
  font-family: "Open Sans", system-ui, -apple-system, sans-serif;
  color: #615C3F;
  line-height: 1.6;
  background: #fff;
}

.container{
  width: min(100% - 2rem, var(--max));
  margin-inline: auto;
}

/* Titres globaux */

h1, h2, h3, h4, h5, h6 {
  font-family: "Merriweather", serif;
  font-weight: 400;
  line-height: 1.2;
  margin: 0 0 0.6rem;
  color: #CC9D82; 
}

/* Tailles responsive */
h1 {
  font-size: clamp(1,9rem, 1.2rem + 2vw, 2,6rem);
}

h2 {
  font-size: clamp(1.3rem, 1.1rem + 1vw, 1,8rem);
}

h3 {
  font-size: 1.25rem;
}

h4 {
  font-size: 1.1rem;
}

.small{
  color: var(--muted);
  font-size: 0.95rem;
}

/* Texte global */
p {
  font-family: "Open Sans", system-ui, -apple-system, sans-serif;
  font-size: 1rem;        /* 16px */
  line-height: 1.8;
  color: #615C3F;
  margin: 0 0 1rem;
}