:root {
  --yellow: #ffeb00;
  --ink: #171617;      /* titles */
  --body-text: #3d3e40; /* running text */
  --nav-ink: #161a03;   /* nav text, border, footer bg */
  --white: #ffffff;
  --border-w: 20px;
  --content-w: 820px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--white);
  color: var(--body-text);
  font-family: 'Roboto', Helvetica, Arial, sans-serif;
  font-weight: 300;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  border: var(--border-w) solid var(--nav-ink);
  min-height: 100vh;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Oswald', Helvetica, Arial, sans-serif;
  font-weight: 400;
  color: var(--ink);
  line-height: 1.25;
  text-transform: uppercase;
}
a { color: var(--nav-ink); }
a:hover { color: var(--yellow-hover, #d9cb00); }
.content a, .entry-content a { color: var(--nav-ink); text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 2px; }
.content a:hover { background: var(--yellow); text-decoration: none; }

img { max-width: 100%; height: auto; }

/* ---------- layout shell ---------- */
.site-shell {
  display: flex;
  align-items: flex-start;
  min-height: calc(100vh - #{var(--border-w)} * 2);
}
@media (max-width: 900px) {
  .site-shell { flex-direction: column; }
}

/* ---------- sidebar ---------- */
.site-sidebar {
  flex: 0 0 260px;
  width: 260px;
  padding: 40px 24px 30px;
  position: sticky;
  top: 0;
  align-self: flex-start;
}
@media (max-width: 900px) {
  .site-sidebar { position: static; width: 100%; flex: none; padding: 24px; }
}

.site-logo { display: block; margin-bottom: 34px; }
.site-logo img { width: 172px; height: 172px; border-radius: 50%; display: block; }

.nav-burger {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: 6px;
  position: absolute;
  top: 28px;
  right: 24px;
}
.nav-burger span { display: block; width: 26px; height: 2px; background: var(--nav-ink); margin: 6px 0; }

.main-navigation ul {
  list-style: none;
  margin: 0 0 28px;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
}
.main-navigation > ul > li { flex: 0 0 auto; }
.main-navigation a {
  display: inline-block;
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  font-size: 1.35rem;
  text-transform: uppercase;
  color: var(--nav-ink);
  text-decoration: none;
  padding: 2px 6px;
}
.main-navigation li.current > a,
.main-navigation a:hover,
.main-navigation a:focus { background: var(--yellow); color: var(--nav-ink); }

.main-navigation .has-dropdown { position: relative; }
.main-navigation .dropdown-toggle::after { content: "+"; margin-left: 2px; }
.main-navigation .dropdown {
  list-style: none;
  margin: 6px 0 0;
  padding: 0 0 0 4px;
  display: none;
  flex-direction: column;
  gap: 4px;
}
.main-navigation .has-dropdown:hover .dropdown,
.main-navigation .has-dropdown:focus-within .dropdown,
.main-navigation .has-dropdown.open .dropdown { display: flex; }
.main-navigation .dropdown a { font-size: 1.1rem; }

.site-social {
  display: flex;
  align-items: center;
  gap: 18px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.site-social a {
  color: var(--nav-ink);
  font-size: 0.95rem;
  text-decoration: none;
}
.site-social svg { width: 18px; height: 18px; fill: var(--nav-ink); display: block; }
.site-social a:hover svg { fill: var(--yellow); }
.search-toggle { border: none; background: none; cursor: pointer; padding: 0; }

/* ---------- main content ---------- */
.site-main { flex: 1 1 auto; min-width: 0; padding: 0 0 60px; }
.page-wrap { max-width: var(--content-w); margin: 0 auto; padding: 40px 32px; }
.page-wrap.wide { max-width: 1080px; }

.entry-header { margin-bottom: 30px; }
.entry-category {
  display: inline-block;
  font-family: 'Oswald', sans-serif;
  font-size: 0.85rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: var(--yellow);
  color: var(--nav-ink);
  padding: 3px 10px;
  text-decoration: none;
  margin-bottom: 10px;
}
.entry-meta { display: block; font-size: 0.85rem; color: #8a8a8a; margin-bottom: 10px; }
.entry-meta a { color: #8a8a8a; text-decoration: underline; }
.entry-title {
  font-size: 2.1rem;
  margin: 0 0 24px;
}
.page-title { font-size: 2.1rem; margin: 0 0 30px; }
.entry-thumb { margin: 0 0 30px; }
.entry-thumb img { display: block; width: 100%; height: auto; }

.content, .entry-content { font-size: 1.02rem; }
.content p { margin: 0 0 1.2em; }
.content h1, .content h2, .content h3, .content h4 { margin-top: 1.5em; margin-bottom: 0.6em; }
.content > *:first-child { margin-top: 0; }
.content ul, .content ol { padding-left: 1.4em; }
.content figure { margin: 0 0 1.5em; }
.content img { display: block; margin: 0 auto; }
.content figcaption { text-align: center; font-size: 0.85rem; color: #8a8a8a; margin-top: 8px; font-style: italic; }
.content .has-text-align-center { text-align: center; }
.content .has-text-align-left { text-align: left; }
.content .has-text-align-right { text-align: right; }
.content .has-drop-cap:first-letter {
  float: left;
  font-family: 'Oswald', sans-serif;
  font-size: 4.6rem;
  line-height: 0.8;
  padding: 6px 10px 0 0;
  color: var(--ink);
}
.content .has-medium-font-size { font-size: 1.15rem; }
.content .has-large-font-size { font-size: 1.5rem; }
.content .has-huge-font-size { font-size: 2rem; }
.content blockquote {
  border-left: 4px solid var(--yellow);
  margin: 1.6em 0;
  padding: 0.3em 1.4em;
  font-style: italic;
  color: var(--ink);
}
.content hr.wp-block-separator { border: none; border-top: 2px solid #eee; margin: 2.4em 0; }

.wp-block-columns { display: flex; gap: 32px; flex-wrap: wrap; margin: 1.6em 0; }
.wp-block-column { flex: 1 1 240px; min-width: 0; }

.wp-block-media-text {
  display: flex;
  gap: 28px;
  align-items: center;
  margin: 2.2em 0;
  flex-wrap: wrap;
}
.wp-block-media-text.has-media-on-the-right { flex-direction: row; }
.wp-block-media-text__media { flex: 1 1 280px; margin: 0; }
.wp-block-media-text__media img { width: 100%; display: block; }
.wp-block-media-text__content { flex: 1 1 280px; padding: 0 8px; }
.wp-block-media-text__content > *:first-child { margin-top: 0; }
@media (max-width: 640px) {
  .wp-block-media-text { flex-direction: column !important; }
}

/* "Découvrez notre site partenaire" — keep it a discreet mention, not a
   second logo competing with the site's own: text and logo side by side,
   left-aligned under the hero photo above. */
.wp-block-media-text:has(img[src*="une-logo-marges-fond-b"]) {
  max-width: 757px; /* matches the hero photo's width so both share the same centered left edge */
  gap: 18px;
  margin: 1.6em auto 0.4em;
  flex-wrap: nowrap;
}
.wp-block-media-text:has(img[src*="une-logo-marges-fond-b"]) + .wp-block-spacer {
  height: 8px !important;
}
.wp-block-media-text:has(img[src*="une-logo-marges-fond-b"]) .wp-block-media-text__content,
.wp-block-media-text:has(img[src*="une-logo-marges-fond-b"]) .wp-block-media-text__media {
  flex: 0 0 auto;
}
.wp-block-media-text:has(img[src*="une-logo-marges-fond-b"]) .wp-block-heading {
  font-size: 1.1rem;
  text-align: left;
}
.wp-block-media-text__media img[src*="une-logo-marges-fond-b"] {
  max-width: 190px;
  width: 100%;
}
@media (max-width: 640px) {
  .wp-block-media-text:has(img[src*="une-logo-marges-fond-b"]) { flex-wrap: wrap; }
}

.wp-block-buttons { list-style: none; padding: 0; margin: 1.4em 0; display: flex; gap: 12px; flex-wrap: wrap; }
.wp-block-buttons.aligncenter { justify-content: center; }
.wp-block-button__link {
  display: inline-block;
  background: var(--nav-ink);
  color: #fff !important;
  padding: 12px 26px;
  font-family: 'Oswald', sans-serif;
  text-transform: uppercase;
  font-size: 0.9rem;
  text-decoration: none !important;
  transition: background 0.15s;
}
.wp-block-button__link:hover { background: var(--yellow); color: var(--nav-ink) !important; }

.wp-block-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
  margin: 1.6em 0;
  padding: 0;
  list-style: none;
}
.wp-block-gallery figure.wp-block-image { margin: 0; }
.wp-block-gallery img { width: 100%; height: 220px; object-fit: cover; cursor: zoom-in; }

.wp-block-embed { margin: 1.6em 0; }
.wp-block-embed__wrapper { position: relative; padding-top: 56.25%; }
.wp-block-embed__wrapper iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.wp-block-group { margin: 1em 0; }
.wp-block-spacer { }
.content audio { display: block; width: 100%; max-width: 480px; margin: 1em 0; }
.content .wp-block-list { margin: 0 0 1.2em; }

/* drop cap heading blocks with black/inline colors: keep readable */
.has-black-color { color: var(--ink); }
.has-white-color { color: #fff; }
.has-black-background-color { background: var(--nav-ink); padding: 24px; }

/* ---------- lightbox ---------- */
.lightbox-overlay {
  position: fixed; inset: 0;
  background: rgba(22, 26, 3, 0.94);
  display: flex; align-items: center; justify-content: center;
  z-index: 1000;
  padding: 40px;
  cursor: zoom-out;
}
.lightbox-overlay[hidden] { display: none; }
.lightbox-overlay img { max-width: 100%; max-height: 100%; box-shadow: 0 10px 40px rgba(0,0,0,0.5); }
.lightbox-close {
  position: absolute; top: 20px; right: 28px;
  color: #fff; font-size: 2.2rem; line-height: 1;
  background: none; border: none; cursor: pointer;
}

/* ---------- home ---------- */
.home-hero { margin-bottom: 10px; }
.home-hero img { display: block; width: 100%; }
.partner-callout {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
  padding: 24px 32px;
  margin: 0 0 10px;
}
.partner-callout h2 {
  background: var(--yellow);
  display: inline-block;
  padding: 6px 14px;
  font-size: 1.1rem;
  margin: 0;
}
.partner-callout img { max-width: 260px; }
.home-categories {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
  padding: 10px 32px 50px;
}
@media (max-width: 760px) {
  .home-categories { grid-template-columns: 1fr; }
}
.home-cat h2 { text-align: center; font-size: 1.7rem; margin-bottom: 20px; }
.home-cat h2 a { color: var(--ink); text-decoration: none; }
.home-cat img { width: 100%; height: 200px; object-fit: cover; margin-bottom: 16px; }
.home-cat p { font-size: 0.95rem; }

/* ---------- category / archive listing ---------- */
.archive-title {
  font-size: 1.6rem;
  padding: 40px 32px 0;
  margin: 0 0 20px;
}
.post-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 30px;
  padding: 0 32px 60px;
}
.post-card { display: block; text-decoration: none; color: inherit; }
.post-card-thumb { display: block; width: 100%; height: 190px; object-fit: cover; background: #eee; margin-bottom: 14px; }
.post-card-cat {
  display: inline-block;
  font-family: 'Oswald', sans-serif;
  font-size: 0.75rem;
  text-transform: uppercase;
  background: var(--yellow);
  padding: 2px 8px;
  margin-bottom: 8px;
}
.post-card-title {
  font-size: 1.1rem;
  margin: 0 0 8px;
  color: var(--ink);
  line-height: 1.3;
}
.post-card-excerpt { font-size: 0.9rem; color: var(--body-text); opacity: 0.85; }
.post-card-date { display: block; font-size: 0.78rem; color: #9a9a9a; margin-top: 8px; }

/* ---------- team page ---------- */
/* Portraits come from the source site at wildly different aspect ratios
   (square, tall, landscape) and varying bio lengths made each row's spacing
   look inconsistent even though the underlying margins were even. Force a
   uniform photo size and top-align each row so the rhythm reads as constant
   regardless of how long a given bio is. */
.page-team .wp-block-media-text { align-items: flex-start; }
.page-team .wp-block-media-text__media { flex: 0 0 170px; }
.page-team .wp-block-media-text__media img {
  width: 170px;
  height: 170px;
  object-fit: cover;
  display: block;
}
.page-team .wp-block-media-text__content { padding-top: 4px; }

/* ---------- footer ---------- */
.site-footer {
  background: var(--nav-ink);
  color: #fff;
  padding: 28px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  font-size: 0.85rem;
}
.site-footer a { color: #fff; }
.back-to-top { color: #fff; text-decoration: none; font-size: 1.2rem; }

/* ---------- search page ---------- */
#site-search-input {
  display: block;
  width: 100%;
  max-width: 480px;
  margin: 10px 0 30px;
  padding: 12px 16px;
  border: 1px solid #ddd;
  font-family: 'Roboto', sans-serif;
  font-size: 1rem;
}
#search-results-count { font-size: 0.9rem; color: #8a8a8a; margin-bottom: 20px; }
