/* ? Style global */
body {
    margin: 0;
    font-family: Arial, sans-serif;
    background: rgba(235,235,255,1);
}

/* ============================================================
   🎯 TITRES H2
   ============================================================ */
:root {
    --h2-font-size: 22px;
    --h2-font-weight: 600;
    --h2-line-height: 1.15;
    --h2-height: 32px;
    --h2-margin: 0;
    --h2-padding: 0;

    /* Variantes */
    --h2-font-size-compact: 20px;
    --h2-height-compact: 28px;

    --h2-font-size-large: 26px;
    --h2-height-large: 38px;
}

/* Style principal */
h2 {
    margin: var(--h2-margin) !important;
    padding: var(--h2-padding) !important;
    font-size: var(--h2-font-size);
    font-weight: var(--h2-font-weight);
    line-height: var(--h2-line-height);
    height: var(--h2-height);
    display: flex;
    align-items: center;
    overflow: hidden;
}

/* Variantes */
h2.compact {
    font-size: var(--h2-font-size-compact);
    height: var(--h2-height-compact);
}

h2.large {
    font-size: var(--h2-font-size-large);
    height: var(--h2-height-large);
}


#content {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;

  border: 1px solid rgba(43,36,255,1);
  border-radius: 8px;

  grid-auto-rows: min-content;

  margin: 10px;
  padding: 15px;

  box-sizing: border-box;
}

#content h2 {
  grid-column: 1 / -1;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
}


/* Blocs info */
.info-block {
  margin-bottom: 15px;
  padding: 12px;
  background: #fff;
  border: 1px solid #3498db;
  border-left: 6px solid #3498db;
  border-radius: 4px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
  margin: 0px 5pxpx 0px 5px;
}

.info-block strong {
  font-size: 16px;
}

.info-block small {
  display: block;
  color: #7f8c8d;
  margin-top: 2px;
  margin-bottom: 6px;
}


/* ===============================
   HEADER PRINCIPAL
================================ */

/* RESET IMPORTANT */
body {
    margin: 0;
}

/* HEADER */
.main-header {
    width: 100%;
    background-color: #2f3fa3;
    color: white;
}

/* CONTENEUR INTERNE */
.header-container {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px;
    box-sizing: border-box;
}

/* NAV */
.header-nav {
    display: flex;
    align-items: center;
    gap: 25px;
}

.header-nav a {
    color: white;
    text-decoration: none;
    font-weight: 500;
}

.header-nav a:hover {
    opacity: 0.8;
}