.boite1 {
/* --- BOÎTES DU HAUT --- */

.top-box {
  width: 100%;
  height: 180px;          /* grosse case du haut */
  border: 2px solid pink;
  margin-bottom: 15px;
}

.sub-box {
  width: 100%;
  height: 40px;           /* barre fine sous la grande */
  border: 2px solid pink;
  margin-bottom: 20px;
}


/* --- BLOC PRINCIPAL (3 colonnes) --- */

.main-row {
  display: flex;          /* aligne les 3 colonnes sur une ligne */
  gap: 15px;              /* espace entre les colonnes */
  margin-bottom: 20px;
}

/* colonne gauche = grande case unique */

.left-big {
  width: 200px;
  height: 450px;          /* grande haute à gauche */
  border: 2px solid pink;
}

/* colonne centrale (3 boîtes empilées) */

.center-column {
  display: flex;
  flex-direction: column; /* les boîtes se superposent */
  gap: 15px;
  flex: 1;                /* prend l’espace restant */
}

.center-box {
  height: 130px;
  border: 2px solid pink;
}


/* colonne droite (3 petites boîtes empilées) */

.right-column {
  display: flex;
  flex-direction: column;
  gap: 15px;
  width: 200px;           /* colonne plus étroite */
}

.right-box {
  height: 80px;
  border: 2px solid pink;
}


/* --- BAS (3 cases en ligne) --- */

.bottom-row {
  display: flex;
  gap: 15px;
}

.bottom-box {
  flex: 1;                /* toutes même largeur */
  height: 120px;
  border: 2px solid pink;
}