/* =========================================================
   Imea — charte graphique du site
   Reprend la maquette : papier creme, encre, accent terracotta,
   Fraunces pour les titres, Inter pour le corps.
   ========================================================= */

:root{
  --imea-paper:#FAF7F2;
  --imea-paper-deep:#F2EDE4;
  --imea-ink:#191614;
  --imea-ink-soft:#4A443D;
  --imea-muted:#6E655C;
  --imea-line:#E2DACD;
  --imea-accent:#9C4A2F;
  --imea-accent-deep:#7E3A24;
  --imea-serif:'Fraunces',Constantia,'Iowan Old Style',Georgia,serif;
  --imea-sans:'Inter','Segoe UI',-apple-system,'Helvetica Neue',Arial,sans-serif;
}

/* =========================================================
   1. LARGEUR : suppression de la colonne laterale vide
   Le theme reservait 30 % de l'ecran a une colonne inutilisee.
   ========================================================= */
#right-sidebar, #left-sidebar{ display:none !important; }
.site-content .content-area{ width:100% !important; float:none !important; }
.grid-container, .site.grid-container, .inside-header.grid-container{ max-width:1280px !important; }
.inside-article, .site-content .content-area .inside-article{ padding-left:0; padding-right:0; }
.separate-containers .inside-article{ padding:48px 56px; }
@media (max-width:768px){ .separate-containers .inside-article{ padding:28px 22px; } }

/* =========================================================
   2. EN-TETE : le logo suffit, le titre en double est masque
   ========================================================= */
.site-branding .main-title,
.site-header .main-title,
.site-branding .site-description{ display:none !important; }
.site-logo{ margin-right:0; }

/* ---------- base ---------- */
body,
button, input, select, textarea{
  font-family:var(--imea-sans);
}
body{
  background-color:var(--imea-paper);
  color:var(--imea-ink);
  font-size:17px;
  line-height:1.68;
  -webkit-font-smoothing:antialiased;
}
.site-content, .site.grid-container{ background-color:var(--imea-paper); }

a{ color:var(--imea-accent); text-decoration:none; }
a:hover, a:focus{ color:var(--imea-accent-deep); text-decoration:underline; text-underline-offset:3px; }

/* ---------- titres ---------- */
h1,h2,h3,h4,h5,h6,
.entry-title, .page-title{
  font-family:var(--imea-serif);
  font-weight:400;
  color:var(--imea-ink);
  letter-spacing:-0.012em;
  text-wrap:balance;
}
h1, .entry-title, .page-title{
  font-size:clamp(32px,4.4vw,54px);
  line-height:1.08;
  margin:0 0 26px;
}
h2{ font-size:clamp(25px,2.9vw,35px); line-height:1.18; margin:64px 0 18px; }
h3{ font-size:21px; line-height:1.3; margin:36px 0 10px; }
p{ margin:0 0 18px; }
strong{ font-weight:600; }

/* premiere phrase mise en avant */
.entry-content > p.lead,
.entry-content > p:first-of-type{
  font-size:20px;
  line-height:1.6;
  color:var(--imea-ink-soft);
}

/* le sur-titre de la maquette */
.entry-content p.kicker{
  font-size:11px;
  letter-spacing:.26em;
  text-transform:uppercase;
  color:var(--imea-accent);
  margin-bottom:18px;
}

/* ---------- largeur de lecture ---------- */
.entry-content{ max-width:none; }
.entry-content > p,
.entry-content > ul,
.entry-content > ol,
.entry-content > h2,
.entry-content > h3{
  max-width:74ch;
}

/* ---------- alternance de fond entre les sections ----------
   La maquette alternait papier et papier fonce.
   Les sections sont delimitees par les filets : on colore
   une bande sur deux en s'appuyant sur les separateurs. */
.entry-content{ position:relative; }
.entry-content > hr.wp-block-separator{
  margin-left:calc(-1 * var(--imea-gutter,56px));
  margin-right:calc(-1 * var(--imea-gutter,56px));
  width:calc(100% + 2 * var(--imea-gutter,56px));
}
@media (max-width:768px){ .entry-content{ --imea-gutter:22px; } }
.entry-content > .wp-block-columns,
.entry-content > .wp-block-image,
.entry-content > .wp-block-gallery,
.entry-content > .wp-block-table,
.entry-content > .wp-block-buttons,
.entry-content > hr{
  max-width:none;
}

/* ---------- en-tete ---------- */
.site-header{
  background-color:rgba(250,247,242,.96);
  border-bottom:1px solid var(--imea-line);
  backdrop-filter:blur(8px);
}
.site-header .inside-header{ padding-top:18px; padding-bottom:18px; }

/* taille du logo dans l'en-tete */
.site-logo img,
.site-header img{
  max-height:74px !important;
  width:auto !important;
  height:auto;
}
@media (max-width:768px){
  .site-logo img, .site-header img{ max-height:54px !important; }
}

.main-navigation, .main-navigation .main-nav ul li a{
  background-color:transparent;
  color:var(--imea-ink-soft);
  font-family:var(--imea-sans);
  font-size:14px;
  letter-spacing:.01em;
  font-weight:400;
  white-space:nowrap;
}
.main-navigation .main-nav ul li a{ padding-left:13px; padding-right:13px; line-height:56px; }
.main-navigation .main-nav > ul{ flex-wrap:nowrap; }
@media (min-width:769px){
  .site-header .inside-header{ display:flex; align-items:center; flex-wrap:nowrap; gap:18px; }
  .site-header .site-branding{ flex:0 0 auto; }
  .site-header .main-navigation{ margin-left:auto; flex:0 1 auto; }
}
.main-navigation .main-nav ul li:hover > a,
.main-navigation .main-nav ul li.current-menu-item > a{
  background-color:transparent;
  color:var(--imea-accent);
  box-shadow:inset 0 -1px 0 var(--imea-accent);
}
/* derniere entree du menu en bouton */
.main-navigation .main-nav > ul > li:last-child > a{
  background-color:var(--imea-accent);
  color:#fff;
  margin-left:14px;
  padding-left:22px; padding-right:22px;
  font-size:12.5px; letter-spacing:.07em; text-transform:uppercase;
}
.main-navigation .main-nav > ul > li:last-child > a:hover{
  background-color:var(--imea-accent-deep); color:#fff; box-shadow:none;
}

/* ---------- boutons ---------- */
.entry-content .wp-block-button .wp-block-button__link,
.wp-block-button__link, .wp-element-button, button, input[type="submit"], .button{
  font-family:var(--imea-sans) !important;
  background-color:var(--imea-accent) !important;
  color:#fff !important;
  border:1px solid var(--imea-accent) !important;
  border-radius:0 !important;
  padding:14px 26px;
  font-size:12.5px;
  letter-spacing:.07em;
  text-transform:uppercase;
  font-weight:500;
  transition:background-color .2s,border-color .2s,color .2s;
}
.entry-content .wp-block-button .wp-block-button__link:hover,
.wp-block-button__link:hover, .wp-element-button:hover, button:hover, input[type="submit"]:hover{
  background-color:var(--imea-accent-deep) !important;
  border-color:var(--imea-accent-deep) !important;
  color:#fff !important;
  text-decoration:none;
}
.entry-content .wp-block-button.is-style-outline .wp-block-button__link,
.wp-block-button.is-style-outline .wp-block-button__link{
  background-color:transparent !important;
  color:var(--imea-ink) !important;
  border-color:var(--imea-ink) !important;
}
.entry-content .wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:hover{
  background-color:var(--imea-ink) !important; color:var(--imea-paper) !important;
}
.wp-block-buttons{ margin:32px 0 44px; gap:14px; }

/* ---------- filets ---------- */
hr.wp-block-separator{
  border:0;
  border-top:1px solid var(--imea-line);
  margin:64px 0;
  max-width:none;
  opacity:1;
}

/* ---------- listes ---------- */
.entry-content ul{ list-style:none; padding-left:0; }
.entry-content ul li{
  position:relative;
  padding:11px 0 11px 26px;
  border-bottom:1px solid var(--imea-line);
}
.entry-content ul li::before{
  content:'';
  position:absolute; left:4px; top:21px;
  width:6px; height:1px; background:var(--imea-accent);
}
.entry-content ol{ padding-left:22px; }
.entry-content ol li{ padding:8px 0; }

/* ---------- colonnes ---------- */
.wp-block-columns{ gap:44px; margin:34px 0 44px; }
.wp-block-column > h3:first-child{ margin-top:0; }

/* ---------- images ----------
   Les images occupent toute la largeur de la colonne de contenu.
   Sans cela elles s'affichent a leur taille naturelle et laissent
   un grand vide a droite. */
.entry-content figure.wp-block-image{ width:100%; max-width:100%; }
.entry-content figure.wp-block-image > img,
.entry-content figure.wp-block-image > a > img{
  width:100%; height:auto; display:block;
}
.wp-block-image img, .wp-block-gallery img{ display:block; }
figure.wp-block-image{ margin:40px 0; }

/* galeries : hauteur uniforme, recadrage centre.
   Le carre menage aussi bien les photos verticales qu'horizontales,
   le portrait strict amputait les paysages. */
.wp-block-gallery.has-nested-images figure.wp-block-image > img{
  aspect-ratio:1/1; object-fit:cover; object-position:center;
}
.wp-block-gallery.columns-2.has-nested-images figure.wp-block-image > img{ aspect-ratio:4/3; }
@media (max-width:768px){
  .wp-block-gallery.has-nested-images figure.wp-block-image > img{ aspect-ratio:4/3; }
}

/* curseur explicite quand l'image s'agrandit au clic */
.wp-lightbox-container img{ cursor:zoom-in; }
figure.wp-block-image figcaption,
.wp-block-gallery figcaption{
  font-size:12px;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--imea-muted);
  text-align:left;
  margin-top:10px;
}
.wp-block-gallery.has-nested-images{ gap:16px; }
.wp-block-gallery.has-nested-images figure.wp-block-image{ margin:0; }

/* ---------- tableaux ---------- */
.wp-block-table table{ border-collapse:collapse; width:100%; font-size:15.5px; }
.wp-block-table th{
  text-align:left; font-family:var(--imea-sans); font-weight:600;
  font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--imea-muted);
  border-bottom:1px solid var(--imea-ink); padding:12px 14px 12px 0;
}
.wp-block-table td{ border-bottom:1px solid var(--imea-line); padding:14px 14px 14px 0; vertical-align:top; }
.wp-block-table tr:hover td{ background-color:var(--imea-paper-deep); }

/* ---------- citations ---------- */
.wp-block-quote{
  border-left:2px solid var(--imea-accent);
  padding-left:24px; margin:34px 0;
  font-family:var(--imea-serif); font-size:22px; line-height:1.5; font-style:normal;
}
.wp-block-quote p{ margin-bottom:0; }

/* ---------- pied de page ---------- */
.site-footer, .site-info{
  background-color:var(--imea-ink);
  color:#b8afa5;
  font-size:14px;
}
.site-footer a, .site-info a{ color:#b8afa5; }
.site-footer a:hover, .site-info a:hover{ color:var(--imea-paper); }

/* ---------- espacements generaux ---------- */
.site-content .content-area{ padding-top:26px; padding-bottom:56px; }
.entry-header{ margin-bottom:8px; }
.page .entry-content > *:first-child{ margin-top:0; }

/* ---------- lisibilite mobile ---------- */
@media (max-width:768px){
  body{ font-size:16.5px; }
  h2{ margin-top:48px; }
  hr.wp-block-separator{ margin:44px 0; }
  .wp-block-columns{ gap:0; }
  .wp-block-table table{ font-size:14px; }
}
