/* Page d'attente de LégiKoz : couche web du Koz Design System (tokens site-*, Roboto Condensed hébergée localement). */
@font-face { font-family: "Roboto Condensed"; src: url("fonts/roboto-condensed-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Roboto Condensed"; src: url("fonts/roboto-condensed-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
:root {
  --site-blue: #0f2293; --site-blue-link: #0b098c; --site-text: #2d2d2d; --site-bg: #f4f4f4;
  --site-header-bg: #e8e8e7; --site-footer-bg: #efefef; --site-footer-bar-bg: #e8e8e7;
  --site-footer-text: #868686; --site-footer-bar-text: #3a3a3a; --site-hero-title: #f7f7f7;
  --koz-azure: #0686f3; --site-wrap: 1280px; --site-gutter: 40px; --site-section-y: 90px; --site-col-gap: 60px;
  --font-site: "Roboto Condensed", "Open Sans", Arial, sans-serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body { background: #ffffff; color: var(--site-text); font: 400 16px/22px var(--font-site); }
a { color: var(--site-blue-link); }
a:hover { color: var(--koz-azure); }
a:focus-visible { outline: 2px solid var(--koz-azure); outline-offset: 2px; }
h1, h2, p { margin: 0; }
.entete { background: var(--site-header-bg); padding: 20px 14px 20px 44px; }
.logo { display: inline-block; border: 0; }
.logo img { display: block; width: 157px; height: auto; }
.hero { position: relative; overflow: hidden; background: var(--site-blue); color: #ffffff; text-align: center;
  min-height: clamp(440px, 35.5vw, 720px); display: flex; align-items: center; justify-content: center; padding: 90px 13%; }
.decoupe { position: absolute; top: 0; height: 100%; width: auto; pointer-events: none; }
.decoupe.gauche { left: 0; max-width: 21.5%; object-fit: cover; object-position: left center; }
.decoupe.droite { right: 0; max-width: 28%; object-fit: cover; object-position: right center; }
.hero-texte { position: relative; max-width: 1000px; display: flex; flex-direction: column; gap: 22px; }
.hero h1 { font: 700 42px/63px var(--font-site); color: var(--site-hero-title); }
.hero .sous-titre { font: 400 22px/30px var(--font-site); }
.hero .annonce { font: 700 16px/22px var(--font-site); }
.fonctions { background: var(--site-bg); padding: var(--site-section-y) var(--site-gutter); }
.colonnes { max-width: var(--site-wrap); margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--site-col-gap); }
.fonction h2 { font: 700 22px/32px var(--font-site); color: var(--site-blue); margin-bottom: 12px; }
.fonction p { max-width: 68ch; }
.contact { max-width: var(--site-wrap); margin: 60px auto 0; text-align: center; }
.contact a { white-space: nowrap; }
.pied { background: var(--site-footer-bg); padding: 50px var(--site-gutter) 40px; color: var(--site-footer-text);
  font: 400 15px/26px var(--font-site); text-align: center; display: flex; flex-direction: column; gap: 6px; }
.pied a, .barre a { color: inherit; }
.pied a:hover, .barre a:hover { color: var(--site-blue-link); }
.barre { background: var(--site-footer-bar-bg); padding: 7px var(--site-gutter); color: var(--site-footer-bar-text);
  font: 400 12px/24px var(--font-site); text-align: center; }
@media (max-width: 1024px) { .entete { padding: 20px; } }
@media (max-width: 600px) {
  :root { --site-gutter: 20px; --site-section-y: 60px; }
  .hero h1 { font-size: 34px; line-height: 44px; }
  .hero .sous-titre { font-size: 19px; line-height: 26px; }
  .hero { min-height: 0; padding: 60px var(--site-gutter); }
  .decoupe { display: none; }
}