/* =========================================================
   GUTENBERG — SCOPE & WRAPPERS
   ========================================================= */

/* Empêche le débordement horizontal quand le body Gutenberg est présent */
html:has(:is(.page-node-type-page, .page-node-type-article) .node__content .fieldname--body) {
  overflow-x: hidden;
}

/* Largeur par défaut des blocs de contenu */
:is(.page-node-type-page, .page-node-type-article) .node__content .fieldname--body > * {
  width: 100%;
  max-width: 850px;
  margin-inline: auto;
  padding-inline: 1rem;
}

/* Variantes d’alignement */
:is(.page-node-type-page, .page-node-type-article) .node__content .fieldname--body > .alignwide {
  max-width: 1180px;
  width: 100% !important;
}
:is(.page-node-type-page, .page-node-type-article) .node__content .fieldname--body > .alignfull {
  max-width: 100%;
}

/* Retire le padding interne au-dessus de 608px */
@media screen and (min-width: 608px) {
  :is(.page-node-type-page, .page-node-type-article) .node__content .fieldname--body > * {
    padding-inline: 0;
  }
}

/* Espacement vertical global du corps Gutenberg */
:is(.page-node-type-page, .page-node-type-article) .node__content .fieldname--body {
  margin-block: 2rem;
}


/* =========================================================
   BLOCS — CODE
   ========================================================= */

.wp-block-code {
  background-color: var(--light-grey);
  padding: 0.5rem;
  border-radius: 0.3rem;
}
.wp-block-code code {
  color: var(--dark-blue);
  background-color: transparent;
  padding: 1rem;
  border-radius: 0;
}


/* =========================================================
   LAYOUT HELPERS
   ========================================================= */

:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .is-layout-flex {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}


/* =========================================================
   TITRES (H1–H6) & HEADING BLOCK
   ========================================================= */

:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-heading {
  margin-block: 2rem 1rem;
  line-height: 1.2;
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) h1.wp-block-heading { font-size: 2.5rem; }
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) h2.wp-block-heading { font-size: 2rem; }
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) h3.wp-block-heading { font-size: 1.75rem; }
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) h4.wp-block-heading { font-size: 1.5rem; }
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) h5.wp-block-heading { font-size: 1.25rem; }
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) h6.wp-block-heading { font-size: 1rem; }


/* =========================================================
   SÉPARATEUR
   ========================================================= */

:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-separator {
  border: none;
  border-bottom: 2px solid #e5e7eb;
  margin-block: 2rem;
}


/* =========================================================
   VARIANTS DE TAILLES DE TEXTE (UTILITAIRES)
   ========================================================= */

:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .has-small-font-size {
  font-size: 0.875rem;
  line-height: 1.5;
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .has-regular-font-size {
  font-size: 1rem;
  line-height: 1.6;
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .has-large-font-size {
  font-size: 1.25rem;
  line-height: 1.4;
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .has-larger-font-size {
  font-size: 1.5rem;
  line-height: 1.3;
}

/* Fond pour les blocs avec .has-background */
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .has-background {
  padding: 1.25rem;
  border-radius: 1rem;
}


/* =========================================================
   IMAGES & CAPTIONS
   ========================================================= */

:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-image {
  margin: 2rem auto;
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-group figure.wp-block-image {
  margin: 0;
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-image img {
  max-width: 100%;
  height: auto;
  display: block;
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-element-caption {
  margin-top: 0.5rem;
  font-size: 0.875rem;
  color: #6b7280;
  text-align: center;
}


/* =========================================================
   GALERIES
   ========================================================= */

/* Conteneur (dupliqué dans la source, conservé une seule fois) */
.wp-block-gallery {
  display: flex;
  flex-wrap: wrap;
  list-style-type: none;
  padding: 0;
  gap: 0.5rem;
}

/* Alignement */
.wp-block-gallery.aligncenter { justify-content: center; }

/* Grille “nested images” */
.wp-block-gallery.has-nested-images { display: flex; flex-wrap: wrap; }
.wp-block-gallery.has-nested-images figure.wp-block-image {
  width: calc(33.33% - 16px); /* Default 3 columns */
  margin: 8px;
  display: flex;
  flex-direction: column;
}

/* Variantes colonnes */
.wp-block-gallery.columns-1 figure.wp-block-image { width: calc(100% - 16px); }
.wp-block-gallery.columns-2 figure.wp-block-image { width: calc(50% - 16px); }
.wp-block-gallery.columns-3 figure.wp-block-image { width: calc(33.33% - 16px); }
.wp-block-gallery.columns-4 figure.wp-block-image { width: calc(25% - 16px); }
.wp-block-gallery.columns-5 figure.wp-block-image { width: calc(20% - 16px); }
.wp-block-gallery.columns-6 figure.wp-block-image { width: calc(16.66% - 16px); }
.wp-block-gallery.columns-7 figure.wp-block-image { width: calc(14.28% - 16px); }
.wp-block-gallery.columns-8 figure.wp-block-image { width: calc(12.5% - 16px); }

/* Image & légende des items */
.wp-block-gallery .wp-block-image { margin: 0; position: relative; }
.wp-block-gallery .wp-block-image img {
  display: block;
  height: auto;
  max-width: 100%;
  width: 100%;
  object-fit: cover;
}
.wp-block-gallery .wp-block-image figcaption {
  background: linear-gradient(0deg, rgba(0,0,0,0.7), rgba(0,0,0,0.3) 70%, transparent);
  bottom: 0;
  color: #fff;
  font-size: 13px;
  margin: 0;
  padding: 40px 10px 10px;
  position: absolute;
  text-align: center;
  width: 100%;
}

/* Mode “cropped” */
.wp-block-gallery.is-cropped .wp-block-image { aspect-ratio: 1; }
.wp-block-gallery.is-cropped .wp-block-image img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}


/* =========================================================
   LISTES
   ========================================================= */

:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) ul,
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) ol {
  margin-block: 1.5rem;
  padding-left: 2rem;
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) ul {
  list-style-type: disc;
  list-style-position: inside;
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) ol {
  list-style-type: decimal;
  list-style-position: inside;
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) ul ul,
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) ol ul {
  list-style-type: circle;
  list-style-position: inside;
  margin-left: 15px;
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) ol ol,
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) ul ol {
  list-style-type: lower-latin;
  list-style-position: inside;
  margin-left: 15px;
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) ul li,
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) ol li {
  margin-bottom: 0.5rem;
}


/* =========================================================
   BOUTONS
   ========================================================= */

:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-button {
  margin-block: 1.5rem;
  width: fit-content;
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-button__link,
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-element-button {
  border-radius: 2rem;
  padding: 0.5rem 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  color: white;
  background-color: var(--medium-blue);
  font-weight: 600;
  transition: background-color 0.2s;
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-button__link:hover,
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-element-button:hover {
  background-color: var(--dark-red);
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-button.is-style-outline .wp-block-button__link {
  background-color: transparent;
  border: 2px solid var(--medium-blue);
  color: var(--medium-blue);
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-button.is-style-outline .wp-block-button__link:hover {
  background-color: var(--medium-blue);
  color: white;
}


/* =========================================================
   BLOCKQUOTE
   ========================================================= */

:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-quote {
  border-left: 4px solid var(--red);
  margin: 2rem auto;
  padding-left: 1.5rem;
  font-style: italic;
  width: auto;
  border-radius: 1rem;
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-quote cite {
  display: block;
  margin-top: 1rem;
  font-style: normal;
  font-size: 0.875rem;
  color: #6b7280;
}


/* =========================================================
   AUDIO / VIDÉO / TEXTE PRÉFORMATÉ / VERSE
   ========================================================= */

:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-audio { margin-block: 1.5rem; }
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-audio audio { width: 100%; }

:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-video { margin-block: 1.5rem; }
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-video video {
  width: 100%;
  height: auto;
}

:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-preformatted,
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-verse {
  background-color: #f3f4f6;
  padding: 1.5rem;
  border-radius: 0.25rem;
  overflow-x: auto;
  font-family: monospace;
  margin-block: 1.5rem;
}


/* =========================================================
   EMBEDS (Twitter / YouTube / Facebook) & ASPECT RATIO
   ========================================================= */

:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-embed { margin-block: 1.5rem; }
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-embed.is-type-rich { position: relative; }

/* Twitter */
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-embed.is-provider-twitter {
  max-width: 550px;
  margin-left: auto;
  margin-right: auto;
}

/* YouTube */
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-embed.is-provider-youtube { position: relative; }

/* Facebook */
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-embed.is-provider-facebook {
  max-width: 552px;
  margin-left: auto;
  margin-right: auto;
}

/* Iframe plein conteneur quand Gutenberg ajoute .wp-has-aspect-ratio */
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-has-aspect-ratio iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}


/* =========================================================
   FILE BLOCK
   ========================================================= */

:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-file {
  margin-block: 1.5rem;
  padding: 1rem;
  background-color: #f3f4f6;
  border-radius: 0.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: fit-content;
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-file a:not(.wp-block-file__button) {
  text-decoration: none;
  color: var(--medium-blue);
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-file__button {
  display: inline-block;
  padding: 0.5rem 1rem;
  background-color: var(--medium-blue);
  color: white;
  border-radius: 0.25rem;
  text-decoration: none;
  transition: background-color 0.2s;
}
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-file__button:hover {
  background-color: var(--blue);
}


/* =========================================================
   TABLES
   ========================================================= */

.wp-block-table {
  width: 100%;
  border-collapse: collapse;
  margin: 20px 0;
  font-size: 16px;
  font-family: Arial, sans-serif;
}
.wp-block-table th,
.wp-block-table td {
  border: 1px solid #ddd;
  padding: 8px;
  text-align: left;
}
.wp-block-table th {
  background-color: #f2f2f2;
  font-weight: bold;
}
.wp-block-table tr:nth-child(even) { background-color: #f9f9f9; }
.wp-block-table tr:hover { background-color: #f1f1f1; }
.wp-block-table th,
.wp-block-table td strong { font-weight: bold; }
.wp-block-table p { margin: 0; }
.wp-block-table a { color: #0073aa; text-decoration: none; }
.wp-block-table a:hover { text-decoration: underline; }
:is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) tfoot td { padding: 1rem; }


/* =========================================================
   MEDIA QUERIES — 768px
   ========================================================= */

@media (max-width: 768px) {

  /* H2 dans le hero (spécifique) */
  #hero .region--hero .cnam-hero h2.wp-block-heading {
    font-size: 3rem !important;
    font-style: normal;
    text-align: left !important;
    font-weight: 700 !important;
  }
  .wp-block-spacer{height: unset!important;}
  /* Galerie 2 colonnes en mobile */
  .wp-block-gallery.has-nested-images figure.wp-block-image { width: calc(50% - 16px); }

  /* Media & Text — retire le padding par défaut du content (déjà présent dans la source) */
  .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content { padding: unset; }

  /* H3 mobile (déjà présent dans la source) */
  :is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) h3.wp-block-heading {
    font-size: 1.5rem;
    /* color: var(--blue); */
  }

  /* Divers vues (source) */
  .views-element-container .inner-list:is(.view-diplomes, .view-formations, .view-unites) .item-list { padding: 0.5rem !important; }
  .views-element-container .inner-list:is(.view-diplomes, .view-formations, .view-unites) .item-list > ul > li {
    padding-block: 1rem !important;
    padding-inline: 1rem !important;
  }

  /* Aligne à gauche les blocs forcés à droite */
  .has-text-align-right { text-align: left !important; }

  /* Blockquote : taille de texte (source) */
  blockquote.wp-block-quote { font-size: 1.5rem !important; }

  /* Blockquote — overrides mobile */
  :is(.page-node-type-page, .page-node-type-article) :is(.fieldname--body) .wp-block-quote {
    /* border-left: none; */
    margin: 1rem;
    padding-left: 2rem;
    font-size: 1rem;
  }

  /* Overrides généraux titres Gutenberg en mobile (H2/H3/H4) */
  :is(.page-node-type-page, .page-node-type-article) .fieldname--body h2.wp-block-heading {
    font-size: clamp(2.5rem, 3.5vw, 2.5rem) !important;
    font-weight: 500 !important;
    line-height: 1.15;
    text-align: left !important;
    margin-block: 1em !important;
  }
  :is(.page-node-type-page, .page-node-type-article) .fieldname--body h3.wp-block-heading {
    font-size: clamp(1.75rem, 3vw, 2rem) !important;
    font-weight: 500 !important;
    line-height: 1.2;
    text-align: left;
  }
  :is(.page-node-type-page, .page-node-type-article) .fieldname--body h4.wp-block-heading {
    font-size: clamp(1.5rem, 3vw, 2rem) !important;
    font-weight: 500 !important;
    text-align: left;
    line-height: 1;
  }

  /* Media & Text — forcer contenu avant image + une colonne */
  .wp-block-media-text.is-stacked-on-mobile {
    display: grid;
    grid-template-columns: 1fr !important; /* override du inline grid-template-columns */
    grid-auto-rows: auto;
  }
  .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content {
    grid-column: 1 !important;
    grid-row: 1 !important;
    /* padding: 1rem; confort de lecture */
  }
  .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media {
    grid-column: 1 !important;
    grid-row: 2 !important;
  }
  .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media img {
    width: 100%;
    height: auto;
    display: block;
  }
  .wp-block-media-text.is-stacked-on-mobile.is-image-fill .wp-block-media-text__media {
    min-height: 220px;
    background-size: cover;
    background-position: center;
  }

  /* Blockquote : force la taille des <p> à 1.5rem (source fournie) */
  :is(.page-node-type-page, .page-node-type-article) .fieldname--body .wp-block-quote p {
    font-size: 1.3rem !important;
    line-height: 1.6;
    margin: 0;
    text-align: left;
  }
}


/* =========================================================
   MEDIA QUERIES — 480px
   ========================================================= */

@media (max-width: 480px) {
  /* Galerie 1 colonne en very-small */
  .wp-block-gallery.has-nested-images figure.wp-block-image { width: calc(100% - 16px); }
  .wp-block-gallery.columns-2 figure.wp-block-image,
  .wp-block-gallery.columns-3 figure.wp-block-image,
  .wp-block-gallery.columns-4 figure.wp-block-image,
  .wp-block-gallery.columns-5 figure.wp-block-image,
  .wp-block-gallery.columns-6 figure.wp-block-image,
  .wp-block-gallery.columns-7 figure.wp-block-image,
  .wp-block-gallery.columns-8 figure.wp-block-image {
    width: calc(100% - 16px);
  }
}

/* =========================================================
   RÈGLES HORS MQ MAIS LIÉES AUX GALERIES (conservées)
   ========================================================= */

/* À garder tel quel (présent dans la source après la MQ 768) */
.wp-block-gallery.columns-4 figure.wp-block-image,
.wp-block-gallery.columns-5 figure.wp-block-image,
.wp-block-gallery.columns-6 figure.wp-block-image,
.wp-block-gallery.columns-7 figure.wp-block-image,
.wp-block-gallery.columns-8 figure.wp-block-image {
  width: calc(33.33% - 16px);
}
