/*
Theme Name: Abakal Mahamat Blocks
Theme URI: https://abakalmahamat.com/
Author: Studio AM
Description: Thème WordPress natif en blocs, entièrement éditable avec l’Éditeur de site.
Version: 2.1.1
Requires at least: 6.5
Requires PHP: 7.4
Text Domain: abakal-blocks
*/

:root {
  --am-navy: #031d38;
  --am-blue: #082c50;
  --am-blue-soft: #164468;
  --am-gold: #d6a14f;
  --am-cream: #f6f5f1;
  --am-ink: #071b32;
  --am-line: rgba(255,255,255,.18);
}

html { scroll-behavior: smooth; }
body { margin: 0; }
.wp-site-blocks { overflow: hidden; }

/* Header */
.am-header {
  position: relative;
  z-index: 30;
  min-height: 66px;
  padding: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.11);
  box-shadow: 0 10px 28px rgba(0,0,0,.06);
}
.am-header-inner {
  min-height: 66px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 0 28px;
}
.am-brand { min-width: 330px; gap: 15px !important; }
.am-brand-mark {
  margin: 0 !important;
  color: var(--am-gold);
  font: 600 35px/1 "Cormorant Garamond", Georgia, serif;
  letter-spacing: -.06em;
}
.am-brand-copy { gap: 0 !important; }
.am-brand-name {
  margin: 0 !important;
  color: #fff;
  font: 600 22px/1.05 "Cormorant Garamond", Georgia, serif !important;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.am-brand-name a { color: inherit; }
.am-brand-tag {
  margin: 3px 0 0 !important;
  color: var(--am-gold);
  font-size: 8px !important;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  white-space: nowrap;
}
.am-main-nav { flex: 1; }
.am-main-nav .wp-block-navigation__container { gap: 27px; }
.am-main-nav .wp-block-navigation-item__content {
  position: relative;
  padding: 25px 0 22px;
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.am-main-nav .wp-block-navigation-item__content::after {
  content: "";
  position: absolute;
  right: 50%;
  bottom: 14px;
  left: 50%;
  height: 2px;
  background: var(--am-gold);
  transition: .2s ease;
}
.am-main-nav .wp-block-navigation-item__content:hover { color: var(--am-gold); }
.am-main-nav .wp-block-navigation-item__content:hover::after { right: 0; left: 0; }
.am-header-tools { gap: 15px !important; }
.am-header-social { gap: 9px; }
.am-header-social .wp-social-link { background: transparent !important; color: #fff !important; }
.am-language {
  margin: 0 !important;
  padding-left: 15px;
  border-left: 1px solid var(--am-line);
  color: #fff;
  font-size: 10px !important;
  font-weight: 600;
  white-space: nowrap;
}

/* Native WordPress navigation overlay — mobile and tablet */
body .wp-block-navigation__responsive-container.is-menu-open {
  position: fixed;
  z-index: 100000;
  inset: 0;
  width: 100vw;
  height: 100dvh;
  box-sizing: border-box;
  overflow-y: auto;
  padding: 24px !important;
  background: var(--am-navy) !important;
}
body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
  top: 22px;
  right: 22px;
  color: #fff;
}
body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
  width: min(100%, 540px);
  margin: 0 auto;
  padding-top: 72px;
  align-items: stretch !important;
  justify-content: flex-start !important;
}
body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
  width: 100%;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 0 !important;
}
body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
  width: 100%;
  border-bottom: 1px solid rgba(255,255,255,.14);
}
body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 17px 2px !important;
  color: #fff;
  font-size: 17px !important;
  line-height: 1.2 !important;
  text-align: left !important;
}
body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content::after {
  display: none;
}

/* Hero */
.am-hero {
  position: relative;
  height: 475px;
  min-height: 475px;
  overflow: hidden;
  isolation: isolate;
  background:
    radial-gradient(circle at 75% 34%, rgba(206,222,232,.58) 0, rgba(107,149,178,.18) 27%, transparent 49%),
    linear-gradient(102deg, #031d38 0%, #072c4d 48%, #31516c 100%);
}
.am-hero::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 21% 0 0 34%;
  opacity: .18;
  background:
    linear-gradient(to top, rgba(1,17,32,.8) 0 28%, transparent 28%),
    linear-gradient(90deg, transparent 0 5%, #071c2f 5% 10%, transparent 10% 15%, #06192a 15% 23%, transparent 23% 30%, #082139 30% 35%, transparent 35% 42%, #061a2b 42% 53%, transparent 53% 60%, #082139 60% 67%, transparent 67% 74%, #06192a 74% 83%, transparent 83%);
  filter: blur(1px);
  pointer-events: none;
}
.am-hero::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(90deg, rgba(3,29,56,.28) 0, transparent 62%, rgba(255,255,255,.05));
  pointer-events: none;
}
.am-hero > .wp-block-group { position: relative; z-index: 2; }
.am-hero > .wp-block-group > .wp-block-columns { min-height: 475px; margin-bottom: 0; }
.am-hero-copy {
  align-self: center !important;
  padding: 45px 20px 46px 20px !important;
}
.am-hero h1 {
  margin: 0 0 17px;
  font-size: clamp(62px, 6.3vw, 92px) !important;
  line-height: .83 !important;
  letter-spacing: -.035em;
}
.am-hero h1 mark { display: block; }
.am-hero-role {
  margin: 0;
  font: 600 21px/1.25 "Cormorant Garamond", Georgia, serif !important;
}
.am-hero .wp-block-separator {
  width: 56px !important;
  height: 2px;
  margin: 19px 0 !important;
  border: 0;
}
.am-hero-intro {
  max-width: 515px;
  margin-bottom: 25px;
  font: 500 17px/1.45 "Cormorant Garamond", Georgia, serif;
}
.am-hero .wp-block-buttons { gap: 24px; }
.am-hero .wp-block-button__link { min-width: 180px; padding: 15px 22px; }
.am-outline .wp-block-button__link {
  color: #fff !important;
  border: 1px solid var(--am-gold) !important;
  background: transparent !important;
}
.am-hero-photo {
  position: relative;
  z-index: 3;
  height: 475px;
  align-self: end;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}
.am-hero-photo figure {
  position: relative;
  display: block !important;
  width: 100% !important;
  height: 475px !important;
  margin: 0;
  overflow: visible;
}
.am-hero-photo img {
  position: absolute;
  top: -28px;
  left: 50%;
  display: block;
  width: auto !important;
  max-width: none !important;
  height: clamp(620px, 45.5vw, 690px) !important;
  max-height: none;
  margin: 0;
  object-fit: contain;
  object-position: top center;
  transform: translateX(-50%);
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}

/* Home sections */
.wp-block-button__link { transition: transform .2s, filter .2s; }
.wp-block-button__link:hover { filter: brightness(1.1); transform: translateY(-1px); }
.am-pillars { padding: 0 30px; }
.am-pillars .wp-block-columns { gap: 0 !important; margin: 0; }
.am-pillar {
  min-height: 74px;
  display: grid !important;
  grid-template-columns: 54px 1fr;
  grid-template-rows: auto auto;
  align-content: center;
  padding: 18px 25px;
  border-left: 1px solid rgba(255,255,255,.27);
}
.am-pillar:first-child { border-left: 0; }
.am-pillar .am-icon {
  grid-row: 1 / 3;
  margin: 0;
  color: var(--am-gold);
  line-height: 1;
}
.am-pillar .am-icon svg {
  display: block;
  width: 46px;
  height: 46px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}
.am-pillar h3 {
  margin: 0 0 6px;
  font: 600 11px/1.15 Inter, Arial, sans-serif !important;
  text-transform: uppercase;
}
.am-pillar > p:not(.am-icon) {
  margin: 0;
  color: #d7e0e9;
  font: 500 12px/1.25 "Cormorant Garamond", Georgia, serif;
}
.am-content { padding: 42px 30px; }
.am-eyebrow {
  color: var(--am-gold);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.am-about { padding-right: 30px; border-right: 1px solid #d1d5d7; }
.am-about h2 { font-size: 29px !important; line-height: 1.05; }
.am-about p:not(.am-eyebrow) { font: 500 13px/1.5 "Cormorant Garamond", Georgia, serif; }
.am-news .wp-block-post-template { gap: 18px; }
.am-news .wp-block-post-featured-image img { aspect-ratio: 16/9; object-fit: cover; }
.am-news .wp-block-post-date { color: #747d85; font-size: 9px; text-transform: uppercase; }
.am-news .wp-block-post-title { margin: 6px 0; font-size: 16px !important; line-height: 1.2; }
.am-news .wp-block-post-excerpt { font: 500 12px/1.4 "Cormorant Garamond", Georgia, serif; }
.am-quote { padding: 26px !important; border-radius: 3px; }
.am-quote .wp-block-quote { margin: 8px 0 22px; padding: 0; border: 0; font: 500 19px/1.28 "Cormorant Garamond", Georgia, serif; }
.am-quote-mark { margin: 0; font: 700 52px/.7 Georgia, serif; }
.am-cta { padding: 48px 30px; }
.am-cta h2 { margin: 0; font-size: 40px !important; line-height: 1.05; }

/* Footer */
.am-footer { padding: 26px 30px 18px; }
.am-footer-values { gap: 22px; margin-bottom: 20px; }
.am-footer-value {
  display: grid !important;
  grid-template-columns: 38px 1fr;
  grid-template-rows: auto auto;
  align-content: start;
}
.am-footer-icon { grid-row: 1 / 3; margin: 0; color: var(--am-gold); font-size: 28px; }
.am-footer h3 { margin: 1px 0 5px; font: 600 10px/1.2 Inter, Arial, sans-serif !important; text-transform: uppercase; }
.am-footer p:not(.am-footer-icon) { margin: 0; color: #d7e0e9; font: 500 11px/1.35 "Cormorant Garamond", Georgia, serif; }
.am-newsletter { padding-left: 22px; border-left: 1px solid var(--am-line); }
.am-newsletter .wp-block-button__link { padding: 10px 23px; }
.am-footer .wp-social-link { color: var(--am-gold) !important; border: 1px solid var(--am-gold); background: transparent !important; }
.am-footer-bottom { padding-top: 15px; border-top: 1px solid rgba(255,255,255,.12); }

/* Secondary pages */
.am-page-hero {
  position: relative;
  padding: 82px 30px 74px;
  background: linear-gradient(110deg, #031d38, #0a3b65);
  overflow: hidden;
}
.am-page-hero::after {
  content: "AM";
  position: absolute;
  top: -55px;
  right: 6vw;
  color: rgba(255,255,255,.045);
  font: 700 250px/1 "Cormorant Garamond", Georgia, serif;
}
.am-page-hero .wp-block-post-title { position: relative; z-index: 1; margin: 0; font-size: clamp(48px,6vw,76px) !important; }
.am-page-content { padding: 58px 30px 82px; }
.am-page-content > * { max-width: 1050px; }
.am-page-content .am-lead { max-width: 820px; font: 500 24px/1.45 "Cormorant Garamond", Georgia, serif; color: #30465a; }
.am-section { margin-top: 52px !important; }
.am-section-title { margin-bottom: 22px; font-size: 40px !important; line-height: 1.08; }

/* Article */
.am-article {
  padding: clamp(58px, 7vw, 92px) 30px 100px;
  background: #fff;
}
.am-article-shell { max-width: 920px !important; }
.am-article-date {
  margin: 0 0 14px !important;
  color: var(--am-gold);
  font-size: 12px !important;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.am-article-title {
  max-width: 830px;
  margin: 0 0 34px !important;
  color: var(--am-ink);
  font-size: clamp(46px, 5.2vw, 68px) !important;
  line-height: 1 !important;
  letter-spacing: -.025em;
}
.am-article-image {
  margin: 0 0 36px !important;
  overflow: hidden;
  background: var(--am-cream);
  box-shadow: 0 18px 45px rgba(3,29,56,.11);
}
.am-article-image img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
.am-article-body {
  max-width: 760px !important;
  margin-right: auto !important;
  margin-left: auto !important;
  color: #263d52;
  font-size: 18px;
  line-height: 1.75;
}
.am-article-body > :first-child { margin-top: 0; }
.am-article-body > :last-child { margin-bottom: 0; }
.am-article-body p { margin-top: 0; margin-bottom: 1.35em; }
.am-article-category {
  max-width: 760px !important;
  margin: 34px auto 0 !important;
  padding-top: 18px;
  border-top: 1px solid #d9dee2;
  color: #71808d;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.am-article-category a { color: var(--am-gold); }
.am-cards { gap: 22px !important; }
.am-card { padding: 28px !important; border-top: 3px solid var(--am-gold); background: #f7f5f0; box-shadow: 0 12px 30px rgba(5,30,52,.07); }
.am-card h3 { margin-top: 0; font-size: 26px; }
.am-card p { line-height: 1.65; }
.am-stat { padding: 25px; border: 1px solid #d8dde0; }
.am-stat strong { display: block; margin-bottom: 7px; color: var(--am-gold); font: 600 42px/1 "Cormorant Garamond", Georgia, serif; }
.am-contact-grid { gap: 35px !important; padding: 35px; background: var(--am-cream); }
.am-contact-grid a { color: var(--am-blue); }
.am-media-card .wp-block-image img { aspect-ratio: 16/10; object-fit: cover; }
.am-timeline { padding: 65px 30px; }
.am-timeline-item { position: relative; margin-left: 130px; padding: 5px 0 35px 35px; border-left: 2px solid var(--am-gold); }
.am-timeline-item::before { content: ""; position: absolute; top: 10px; left: -7px; width: 12px; height: 12px; border-radius: 50%; background: var(--am-gold); }
.am-timeline-item h3 { margin: 5px 0; font-size: 28px; }
.am-timeline-item p { margin: 5px 0; line-height: 1.65; }

@media (max-width: 1180px) {
  .am-header-tools { display: none !important; }
  .am-main-nav .wp-block-navigation__container { gap: 18px; }
  .am-brand { min-width: 280px; }
}

@media (max-width: 900px) {
  .am-header-inner { min-height: 72px; padding: 0 20px; }
  .am-brand { min-width: 0; }
  .am-brand-tag { display: none; }
  .am-main-nav { flex: 0; }
  /* WordPress ne replie nativement le bloc Navigation qu'à 600 px.
     On étend ce comportement aux tablettes pour éviter l'empilement des liens. */
  .am-main-nav .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: none !important;
  }
  .am-main-nav .wp-block-navigation__responsive-container-open {
    display: flex !important;
    color: #fff;
  }
  .am-main-nav .wp-block-navigation__responsive-container.is-menu-open {
    display: flex !important;
  }
  .am-hero { height: auto; }
  .am-hero > .wp-block-group > .wp-block-columns { flex-wrap: wrap !important; min-height: auto; }
  .am-hero-copy, .am-hero-photo { flex-basis: 100% !important; }
  .am-hero-photo { display: none; }
  .am-pillars .wp-block-columns { flex-wrap: wrap !important; }
  .am-pillar { flex-basis: 50% !important; border-top: 1px solid rgba(255,255,255,.18); }
  .am-content > .wp-block-columns { flex-wrap: wrap !important; }
  .am-content > .wp-block-columns > .wp-block-column { flex-basis: 100% !important; }
  .am-about { padding: 0 0 30px; border-right: 0; border-bottom: 1px solid #d1d5d7; }
  .am-footer-values { flex-wrap: wrap !important; }
  .am-footer-values > .wp-block-column { flex-basis: 45% !important; }
  .am-newsletter { padding-left: 0; border-left: 0; }
  .am-timeline-item { margin-left: 20px; }
}

@media (max-width: 600px) {
  .am-brand-name { font-size: 19px !important; }
  .am-hero { min-height: 560px; }
  .am-hero-copy { padding: 58px 22px !important; }
  .am-hero h1 { font-size: 61px !important; }
  .am-hero-role { font-size: 19px !important; }
  .am-hero .wp-block-buttons { display: grid; }
  .am-hero .wp-block-button, .am-hero .wp-block-button__link { width: 100%; box-sizing: border-box; }
  .am-pillar { flex-basis: 100% !important; border-left: 0; }
  .am-content, .am-cta, .am-timeline, .am-page-content { padding-right: 20px; padding-left: 20px; }
  .am-news .wp-block-post-template { grid-template-columns: 1fr !important; }
  .am-footer-values > .wp-block-column { flex-basis: 100% !important; }
  .am-cta > .wp-block-columns { flex-wrap: wrap !important; }
  .am-cta > .wp-block-columns > .wp-block-column { flex-basis: 100% !important; }
  .am-page-hero { padding: 62px 20px 56px; }
  .am-page-hero .wp-block-post-title { font-size: 46px !important; }
  .am-article { padding: 48px 20px 72px; }
  .am-article-date { margin-bottom: 11px !important; font-size: 11px !important; }
  .am-article-title { margin-bottom: 25px !important; font-size: 40px !important; line-height: 1.02 !important; }
  .am-article-image { margin-bottom: 28px !important; box-shadow: 0 12px 30px rgba(3,29,56,.1); }
  .am-article-body { font-size: 17px; line-height: 1.68; }
  .am-article-category { margin-top: 28px !important; }
  .am-section-title { font-size: 34px !important; }
  .am-timeline-item { margin-left: 5px; padding-left: 25px; }
}