/* ==========================================================================
   AOC — CSS PAGE ACCUEIL
   ========================================================================== */

.aoc-page{

  /* COULEURS PRINCIPALES */
  --purple:#7500CA;
  --purple-deep:#33066B;
  --yellow:#FFFF5D;

  /* COULEURS SECONDAIRES */
  --gray:#C9C8BF;
  --gray-dark:#8B8A80;
  --peach:#FFB894;
  --orange:#FF8B5E;
  --pink:#FF8FE3;
  --brown:#4A3524;
  --mint:#8EEFC4;
  --teal:#4FA69C;
  --blue:#3B9CFF;

  /* NEUTRES */
  --ink:#15120B;
  --paper:#FFFFFF;
  --paper-2:#F3F1E6;

  /* FORME ROUAGE */
  --gear:polygon(
    88.00% 50.00%, 87.41% 56.65%, 98.27% 63.04%, 96.72% 67.82%,
    84.18% 66.61%, 80.74% 72.34%, 76.36% 77.37%, 81.38% 88.92%,
    77.32% 91.88%, 67.89% 83.53%, 61.74% 86.14%, 55.24% 87.64%,
    52.51% 99.94%, 47.49% 99.94%, 44.76% 87.64%, 38.26% 86.14%,
    32.11% 83.53%, 22.68% 91.88%, 18.62% 88.92%, 23.64% 77.37%,
    19.26% 72.34%, 15.82% 66.61%, 3.28% 67.82%, 1.73% 63.04%,
    12.59% 56.65%, 12.00% 50.00%, 12.59% 43.35%, 1.73% 36.96%,
    3.28% 32.18%, 15.82% 33.39%, 19.26% 27.66%, 23.64% 22.63%,
    18.62% 11.08%, 22.68% 8.12%, 32.11% 16.47%, 38.26% 13.86%,
    44.76% 12.36%, 47.49% 0.06%, 52.51% 0.06%, 55.24% 12.36%,
    61.74% 13.86%, 67.89% 16.47%, 77.32% 8.12%, 81.38% 11.08%,
    76.36% 22.63%, 80.74% 27.66%, 84.18% 33.39%, 96.72% 32.18%,
    98.27% 36.96%, 87.41% 43.35%
  );

  /* FORME ÉTIQUETTES */
  --tag:polygon(
    0 0,
    calc(100% - 16px) 0,
    100% 50%,
    calc(100% - 16px) 100%,
    0 100%,
    16px 50%
  );

  background:var(--paper);
  color:var(--ink);

  font-family:'Archivo', sans-serif;
  font-size:16px;
  font-weight:400;
  line-height:1.5;

  -webkit-font-smoothing:antialiased;
}


/* ==========================================================================
   BASE
   ========================================================================== */

.aoc-page *{
  box-sizing:border-box;
}

.aoc-page a{
  color:inherit;
  text-decoration:none;
}

.aoc-page img{
  max-width:100%;
  display:block;
}

.aoc-page h1,
.aoc-page h2,
.aoc-page h3{
  font-family:'Archivo', sans-serif;
  font-weight:800;
  letter-spacing:-0.02em;
  margin:0;
}

.aoc-page ul{
  list-style:none;
  margin:0;
  padding:0;
}

.aoc-page .wrap{
  max-width:1280px;
  margin:0 auto;
  padding:0 32px;
}

.aoc-page .mono{
  font-family:'Chivo Mono', monospace;
}

.aoc-page .eyebrow{
  font-family:'Chivo Mono', monospace;
  font-size:12px;
  font-weight:500;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--purple);
}

.aoc-page .gear{
  clip-path:var(--gear);
  -webkit-clip-path:var(--gear);
}


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

.aoc-page .btn{
  font-family:'Chivo Mono', monospace;
  font-size:13px;
  font-weight:500;
  letter-spacing:.03em;
  text-transform:uppercase;

  padding:15px 28px;

  display:inline-flex;
  align-items:center;
  gap:10px;

  border:2px solid var(--ink);

  transition:
    transform .2s ease,
    background .2s ease,
    color .2s ease,
    border-color .2s ease;
}

.aoc-page .btn-solid{
  background:var(--ink);
  color:var(--yellow);
  border-color:var(--ink);
}

.aoc-page .btn-ghost{
  background:transparent;
  color:var(--ink);
}

.aoc-page .btn-invert{
  border-color:var(--yellow);
  color:var(--yellow);
}

.aoc-page .btn-invert:hover{
  background:var(--yellow);
  color:var(--purple);
  transform:translateY(-3px);
}


/* ==========================================================================
   TAGS
   ========================================================================== */

.aoc-page .tag{
  clip-path:var(--tag);
  -webkit-clip-path:var(--tag);

  font-family:'Chivo Mono', monospace;
  font-size:12px;
  font-weight:500;
  letter-spacing:.06em;
  text-transform:uppercase;

  padding:9px 22px 9px 18px;

  display:inline-block;
}


/* ==========================================================================
   HEADER
   ========================================================================== */

.aoc-page .aoc-header{
  position:sticky;
  top:0;
  z-index:100;

  background:rgba(253,252,246,.94);

  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);

  border-bottom:1px solid var(--gray);
}

.aoc-page .nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 32px;
}

.aoc-page .brand{
  display:flex;
  align-items:center;
  gap:12px;
}

.aoc-page .logo{
  font-family:'Archivo', sans-serif;
  font-weight:800;
  font-size:17px;
  letter-spacing:-.01em;
  line-height:1.1;
}

.aoc-page .logo small{
  display:block;

  font-family:'Chivo Mono', monospace;
  font-weight:400;
  font-size:11px;

  letter-spacing:.1em;
  color:var(--gray-dark);
  text-transform:uppercase;

  margin-top:2px;
}

.aoc-page .nav-links{
  display:flex;
  gap:30px;

  font-family:'Archivo', sans-serif;
  font-size:14px;
  font-weight:500;
}

.aoc-page .nav-links a{
  position:relative;
  padding-bottom:3px;
}

.aoc-page .nav-links a::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;

  width:0;
  height:2px;

  background:var(--purple);

  transition:width .2s ease;
}

.aoc-page .nav-links a:hover::after{
  width:100%;
}


/* ==========================================================================
   LOGO HEADER
   ========================================================================== */

.aoc-page .aoc-header-logo{
  width:60px;
  height:60px;
  display:block;
  object-fit:cover;
  border-radius:50%;
  flex-shrink:0;
}

.aoc-page .aoc-logo-link{
  display:block;
  flex-shrink:0;
}


/* ==========================================================================
   BOUTON CONTACT HEADER
   ========================================================================== */

.aoc-page .aoc-header .btn-solid{
  background:var(--yellow);
  color:var(--purple);
  border-color:var(--yellow);
}

.aoc-page .aoc-header .btn-solid:hover,
.aoc-page .aoc-header .btn-solid:focus{
  background:var(--purple);
  color:var(--yellow);
  border-color:var(--purple);
}


/* ==========================================================================
   HERO
   ========================================================================== */

.aoc-page .hero{
  padding:80px 32px 0;
  position:relative;
  overflow:hidden;
}

.aoc-page .hero-grid{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:40px;
  align-items:center;

  max-width:1280px;
  margin:0 auto;

  position:relative;
}

.aoc-page .hero h1{
  font-size:clamp(40px,5.6vw,78px);
  font-weight:800;
  line-height:.98;
  margin-top:16px;
}

.aoc-page .hero h1 .hl{
  background:var(--yellow);
  padding:0 8px;

  box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
}

.aoc-page .hero-sub{
  font-size:17px;
  font-weight:400;
  color:#4a4738;

  max-width:440px;
  margin-top:26px;

  line-height:1.6;
}

.aoc-page .hero-actions{
  display:flex;
  gap:14px;
  margin-top:34px;
  flex-wrap:wrap;
}


/* DISCUTONS DE VOS PROJETS */

.aoc-page .hero .btn-solid{
  background:var(--purple);
  border-color:var(--purple);
  color:var(--yellow);
}

.aoc-page .hero .btn-solid:hover{
  background:var(--orange);
  border-color:var(--orange);
  color:var(--purple);

  transform:translateY(-3px);
}


/* NOS EXPERTISES */

.aoc-page .hero .btn-ghost{
  background:var(--yellow);
  border-color:var(--purple);
  color:var(--purple);
}

.aoc-page .hero .btn-ghost:hover{
  background:var(--peach);
  border-color:var(--purple);
  color:var(--purple);

  transform:translateY(-3px);
}


/* VISUEL HERO */

.aoc-page .hero-visual{
  position:relative;

  aspect-ratio:1/1;

  display:flex;
  align-items:center;
  justify-content:center;

  min-height:420px;
}

.aoc-page .aoc-hero-logo{
  width:min(520px,90%);
  height:auto;
  display:block;
  margin:0 auto;
  transform-origin:center center;
}

.aoc-page .aoc-hero-logo.spin{
  animation:aoc-logo-float 6s ease-in-out infinite;
}

@keyframes aoc-logo-float{

  0%{
    transform:rotate(-2deg) translateY(0);
  }

  50%{
    transform:rotate(2deg) translateY(-10px);
  }

  100%{
    transform:rotate(-2deg) translateY(0);
  }

}


/* ==========================================================================
   CHIFFRES HERO
   ========================================================================== */

.aoc-page .stat-strip{
  display:flex;
  justify-content:space-between;
  gap:24px;

  border-top:2px solid var(--ink);

  margin-top:64px;
  padding:22px 0;

  flex-wrap:wrap;
}

.aoc-page .stat-strip div{
  flex:1;
  min-width:140px;
}

.aoc-page .stat-num{
  font-family:'Archivo', sans-serif;
  font-size:32px;
  font-weight:900;
  color:var(--purple);
  line-height:1;
}

.aoc-page .stat-label{
  font-family:'Chivo Mono', monospace;
  font-size:11px;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--gray-dark);
  margin-top:6px;
}


/* ==========================================================================
   BANDEAU CLIENTS
   ========================================================================== */

.aoc-page .marquee-band{
  background:var(--pink);
  border-bottom:1px solid var(--gray);

  padding:34px 0;

  overflow:hidden;
  white-space:nowrap;
}

.aoc-page .marquee-track{
  display:inline-flex;
  align-items:center;
  gap:48px;

  animation:aoc-scroll 32s linear infinite;
}

.aoc-page .marquee-track a{
  font-family:'Chivo Mono', monospace;
  font-size:13px;
  font-weight:500;

  text-transform:uppercase;
  letter-spacing:.05em;

  color:var(--purple-deep);
  text-decoration:none;

  white-space:nowrap;

  padding:5px 8px;

  transition:
    background .2s ease,
    color .2s ease;
}

.aoc-page .marquee-track a:hover{
  background:var(--yellow);
  color:var(--purple);
}

@keyframes aoc-scroll{

  from{
    transform:translateX(0);
  }

  to{
    transform:translateX(-50%);
  }

}


/* ==========================================================================
   SECTIONS GÉNÉRIQUES
   ========================================================================== */

.aoc-page .sec{
  padding:75px 32px;
}

.aoc-page .sec-head{
  max-width:680px;
  margin-bottom:48px;
}

.aoc-page .sec-head h2{
  font-size:clamp(28px,3.2vw,44px);
  font-weight:800;
  line-height:1.08;

  margin-top:14px;
}

.aoc-page .sec-head p{
  color:#4a4738;

  margin-top:16px;

  font-size:16px;
  font-weight:400;
  line-height:1.6;

  max-width:560px;
}


/* ==========================================================================
   EXPERTISES
   ========================================================================== */

.aoc-page .exp-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);

  gap:1px;

  background:var(--gray);
  border:1px solid var(--gray);
}

.aoc-page .exp-card{
  background:var(--paper);

  padding:28px 24px;
  min-height:275px;

  display:flex;
  flex-direction:column;
  align-items:flex-start;

  transition:
    background .25s ease,
    color .25s ease;
}

.aoc-page .exp-card:hover{
  background:var(--yellow);
}

.aoc-page .exp-top{
  display:flex;
  align-items:center;
  gap:14px;

  width:100%;
  margin-bottom:34px;
}

.aoc-page .exp-icon{
  width:68px;
  height:68px;
  flex:0 0 68px;

  display:block;
  object-fit:cover;

  border-radius:50%;
}

.aoc-page .exp-card .tag{
  margin:0;
}

.aoc-page .exp-content{
  margin-top:auto;
}

.aoc-page .exp-card h3{
  font-size:19px;
  font-weight:800;
  line-height:1.2;
  margin:0;
}

.aoc-page .exp-card p{
  font-size:14px;
  font-weight:400;
  color:#4a4738;

  margin:8px 0 0;

  line-height:1.5;
}


/* COULEURS ÉTIQUETTES */

.aoc-page .exp-c1 .tag{
  background:var(--purple);
  color:#fff;
}

.aoc-page .exp-c2 .tag{
  background:var(--pink);
  color:var(--purple-deep);
}

.aoc-page .exp-c3 .tag{
  background:var(--peach);
  color:var(--brown);
}

.aoc-page .exp-c4 .tag{
  background:var(--mint);
  color:var(--brown);
}

.aoc-page .exp-c5 .tag{
  background:var(--teal);
  color:#fff;
}

.aoc-page .exp-c6 .tag{
  background:var(--orange);
  color:#fff;
}

.aoc-page .exp-c7 .tag{
  background:var(--blue);
  color:#fff;
}

.aoc-page .exp-c8 .tag{
  background:var(--gray);
  color:var(--ink);
}


/* ==========================================================================
   MÉTHODE
   ========================================================================== */

.aoc-page .method-row{
  display:grid;
  grid-template-columns:repeat(3,1fr);

  gap:2px;

  background:var(--ink);
  border:2px solid var(--ink);
}

.aoc-page .method-step{
  padding:38px 30px;
}

.aoc-page .method-step:nth-child(1){
  background:var(--purple);
  color:#fff;
}

.aoc-page .method-step:nth-child(2){
  background:var(--yellow);
  color:var(--brown);
}

.aoc-page .method-step:nth-child(3){
  background:var(--pink);
  color:var(--purple-deep);
}

.aoc-page .method-num{
  font-family:'Chivo Mono', monospace;
  font-size:12px;
  font-weight:500;
  letter-spacing:.1em;
  text-transform:uppercase;
  opacity:.75;
}

.aoc-page .method-step h3{
  font-size:26px;
  font-weight:800;
  margin-top:14px;
}

.aoc-page .method-step ul{
  margin-top:16px;
}

.aoc-page .method-step li{
  font-size:14px;
  font-weight:500;

  padding:6px 0;

  border-top:1px solid rgba(0,0,0,.12);
}

.aoc-page .method-step:nth-child(1) li{
  border-top:1px solid rgba(255,255,255,.25);
}


/* ==========================================================================
   CAS CLIENT — VERSION PEACH
   ========================================================================== */

.aoc-page .case{
  background:var(--peach);
  color:var(--brown);

  padding:80px 32px;
}

.aoc-page .case-grid{
  display:grid;
  grid-template-columns:1fr 1fr;

  gap:56px;

  max-width:1280px;
  margin:0 auto;

  align-items:center;
}

.aoc-page .case .eyebrow{
  color:var(--purple) !important;
}

.aoc-page .case h2{
  color:var(--brown);

  font-size:clamp(28px,3.6vw,46px);
  font-weight:800;
  line-height:1.05;
}

.aoc-page .case h2 .hl{
  color:var(--purple);
}

.aoc-page .case-stats{
  display:grid;
  grid-template-columns:1fr 1fr;

  gap:24px;

  margin-top:36px;
}

.aoc-page .case-stat-num{
  font-family:'Archivo', sans-serif;
  font-weight:900;
  font-size:30px;

  color:var(--purple);
}

.aoc-page .case-stat-label{
  font-family:'Chivo Mono', monospace;

  font-size:11px;
  font-weight:400;

  text-transform:uppercase;
  letter-spacing:.06em;

  color:var(--brown);

  margin-top:4px;
  opacity:.75;
}

.aoc-page .case-takeaways{
  display:flex;
  flex-direction:column;
  gap:14px;
}

/* CARTOUCHES VIOLETS + TEXTE JAUNE */

.aoc-page .case-takeaway{
  background:var(--purple);
  color:var(--yellow);

  padding:20px 22px;

  font-family:'Archivo', sans-serif;
  font-weight:700;
  font-size:15px;

  border-left:4px solid var(--purple-deep);
}


/* ==========================================================================
   RÉFÉRENCES
   ========================================================================== */

.aoc-page .ref-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);

  gap:2px;

  background:var(--ink);
  border:2px solid var(--ink);
}

.aoc-page .ref-item{
  position:relative;
  aspect-ratio:4/3;
  overflow:hidden;
  background:var(--purple);
}

.aoc-page .ref-item img{
  width:100%;
  height:100%;
  object-fit:cover;

  transition:transform .5s ease;

  mix-blend-mode:luminosity;
  opacity:.9;
}

.aoc-page .ref-item:hover img{
  transform:scale(1.06);
  mix-blend-mode:normal;
  opacity:1;
}

.aoc-page .ref-item::after{
  content:"";

  position:absolute;
  inset:0;

  background:var(--purple);

  mix-blend-mode:color;
  opacity:.55;

  transition:opacity .35s ease;
}

.aoc-page .ref-item:hover::after{
  opacity:0;
}

.aoc-page .ref-overlay{
  position:absolute;
  inset:0;
  z-index:2;

  background:linear-gradient(
    0deg,
    rgba(21,18,11,.88) 0%,
    rgba(21,18,11,0) 55%
  );

  display:flex;
  align-items:flex-end;

  padding:18px;
}

.aoc-page .ref-overlay span{
  font-family:'Chivo Mono', monospace;
  font-size:13px;
  font-weight:500;

  letter-spacing:.04em;
  color:var(--yellow);
}


/* ==========================================================================
   ACTUALITÉS
   ========================================================================== */

.aoc-page .actu-list{
  border-top:2px solid var(--ink);
}

.aoc-page .actu-row{
  display:grid;
  grid-template-columns:190px 1fr 50px;

  gap:30px;
  align-items:center;

  padding:24px 0;

  border-bottom:1px solid var(--gray);

  color:var(--ink);

  transition:
    background .2s ease,
    padding-left .2s ease,
    padding-right .2s ease;
}

.aoc-page .actu-date{
  font-family:'Chivo Mono', monospace;
  font-size:11px;
  font-weight:500;

  text-transform:uppercase;
  letter-spacing:.06em;

  color:var(--purple);
}

.aoc-page .actu-row h3{
  font-family:'Archivo', sans-serif;
  font-size:20px;
  font-weight:800;
  line-height:1.2;
  color:var(--ink);
}

.aoc-page .actu-row .loc{
  font-family:'Chivo Mono', monospace;
  font-size:11px;
  font-weight:400;

  text-transform:uppercase;
  letter-spacing:.05em;

  color:var(--gray-dark);

  margin-top:6px;
}

.aoc-page .actu-arrow{
  font-family:'Archivo', sans-serif;
  font-size:28px;
  font-weight:500;

  text-align:right;
  color:var(--purple);

  transition:transform .2s ease;
}

.aoc-page .actu-row:hover{
  background:var(--yellow);

  padding-left:18px;
  padding-right:18px;
}

.aoc-page .actu-row:hover .actu-arrow{
  transform:translateX(5px);
}


/* ==========================================================================
   AVIS CLIENTS
   ========================================================================== */

.aoc-page .testi{
  padding:75px 32px;

  background:var(--peach);

  overflow:hidden;
}

.aoc-page .testi-inner{
  max-width:900px;

  margin:0 auto;

  text-align:center;
}

.aoc-page .testi .eyebrow{
  margin-bottom:34px;
}

.aoc-page .testi-slider{
  position:relative;

  min-height:230px;

  display:flex;
  align-items:center;
}

.aoc-page .testi-slide{
  display:none;
  width:100%;
  opacity:0;
}

.aoc-page .testi-slide.active{
  display:block;
  opacity:1;

  animation:aoc-testimonial-in .45s ease;
}

.aoc-page .testi blockquote{
  font-family:'Archivo', sans-serif;

  font-weight:700;
  font-size:clamp(22px,3vw,34px);
  line-height:1.3;

  color:var(--brown);

  margin:0;
}

.aoc-page .testi cite{
  display:block;

  margin-top:26px;

  font-family:'Chivo Mono', monospace;

  font-style:normal;
  font-size:12px;
  font-weight:500;

  text-transform:uppercase;
  letter-spacing:.08em;

  color:var(--purple-deep);
}

.aoc-page .testi-controls{
  display:flex;
  align-items:center;
  justify-content:center;

  gap:24px;

  margin-top:34px;
}

.aoc-page .testi-prev,
.aoc-page .testi-next{
  width:48px;
  height:48px;

  border:1px solid var(--purple);
  border-radius:50%;

  background:transparent;
  color:var(--purple);

  font-family:'Archivo', sans-serif;
  font-size:22px;

  cursor:pointer;

  display:flex;
  align-items:center;
  justify-content:center;

  transition:
    background .2s ease,
    transform .2s ease;
}

.aoc-page .testi-prev:hover,
.aoc-page .testi-next:hover{
  background:var(--yellow);
  transform:scale(1.06);
}

.aoc-page .testi-dots{
  display:flex;
  align-items:center;
  gap:9px;
}

.aoc-page .testi-dot{
  width:9px;
  height:9px;

  padding:0;
  border:0;
  border-radius:50%;

  background:rgba(51,6,107,.25);

  cursor:pointer;

  transition:
    width .2s ease,
    background .2s ease;
}

.aoc-page .testi-dot.active{
  width:25px;

  border-radius:10px;

  background:var(--purple);
}

@keyframes aoc-testimonial-in{

  from{
    opacity:0;
    transform:translateX(20px);
  }

  to{
    opacity:1;
    transform:translateX(0);
  }

}


/* ==========================================================================
   CTA CONTACT
   ========================================================================== */

.aoc-page .cta{
  background:var(--purple);
  color:#fff;

  padding:120px 32px;

  text-align:center;

  position:relative;
  overflow:hidden;
}

.aoc-page .cta h2{
  font-size:clamp(32px,5vw,60px);
  font-weight:800;
  line-height:1.06;

  max-width:820px;

  margin:0 auto;

  position:relative;
  z-index:2;
}

.aoc-page .cta h2 .hl{
  color:var(--yellow);
}

.aoc-page .cta-actions{
  display:flex;
  gap:16px;

  justify-content:center;

  margin-top:40px;

  flex-wrap:wrap;

  position:relative;
  z-index:2;
}


/* ==========================================================================
   PICTO JAUNE CTA — ARRIVÉE DEPUIS LA DROITE + ROULEMENT
   ========================================================================== */

.aoc-page .cta-picto{
  position:absolute;

  width:390px;
  max-width:none;
  height:auto;

  top:50%;
  right:-90px;

  pointer-events:none;
  z-index:1;

  opacity:0;

  transform:
    translateX(120vw)
    translateY(-50%)
    rotate(720deg);

  transition:
    transform 2s cubic-bezier(.22,.65,.35,1),
    opacity .25s ease;
}

.aoc-page .cta-picto.is-visible{
  opacity:1;

  transform:
    translateX(0)
    translateY(-50%)
    rotate(0deg);
}

.aoc-page .cta .eyebrow,
.aoc-page .cta h2,
.aoc-page .cta-actions{
  position:relative;
  z-index:2;
}


/* ==========================================================================
   FOOTER CLAIR ET COMPACT
   ========================================================================== */

.aoc-page .aoc-footer{
  background:var(--paper-2);
  color:var(--purple-deep);

  padding:40px 32px 22px;
}


/* ==========================================================================
   NEWSLETTER FOOTER
   ========================================================================== */

.aoc-page .footer-newsletter{
  max-width:1280px;

  margin:0 auto 35px;
  padding-bottom:35px;

  border-bottom:1px solid var(--gray);

  display:grid;
  grid-template-columns:1fr 1fr;

  gap:50px;
  align-items:end;
}

.aoc-page .footer-newsletter h4{
  font-family:'Chivo Mono', monospace;
  font-size:11px;
  font-weight:500;

  text-transform:uppercase;
  letter-spacing:.1em;

  color:var(--purple);

  margin:0 0 15px;
}

.aoc-page .footer-newsletter h3{
  font-family:'Archivo', sans-serif;
  font-size:clamp(28px,3vw,42px);
  font-weight:800;
  line-height:1.05;

  color:var(--purple-deep);

  margin:0;
}

.aoc-page .footer-newsletter-text p{
  color:var(--purple-deep);

  font-size:14px;
  font-weight:400;

  margin:16px 0 0;

  max-width:430px;
}

.aoc-page .aoc-newsletter-form label{
  display:block;

  font-family:'Chivo Mono', monospace;
  font-size:11px;
  font-weight:500;

  color:var(--purple);

  text-transform:uppercase;
  letter-spacing:.06em;

  margin-bottom:10px;
}

.aoc-page .newsletter-fields{
  display:flex;
  width:100%;
}

.aoc-page .newsletter-fields input{
  flex:1;
  min-width:0;

  padding:16px 18px;

  border:2px solid var(--purple);

  background:#fff;
  color:var(--purple-deep);

  font-family:'Archivo', sans-serif;
  font-size:15px;
  font-weight:400;

  border-radius:0;
  outline:none;
}

.aoc-page .newsletter-fields input::placeholder{
  color:var(--gray-dark);
}

.aoc-page .newsletter-fields input:focus{
  border-color:var(--purple-deep);
}

.aoc-page .newsletter-fields button{
  border:2px solid var(--yellow);

  background:var(--yellow);
  color:var(--purple) !important;

  padding:16px 24px;

  font-family:'Chivo Mono', monospace;
  font-size:12px;
  font-weight:500;

  text-transform:uppercase;
  letter-spacing:.05em;

  cursor:pointer;
  border-radius:0;

  transition:
    background .2s ease,
    color .2s ease,
    border-color .2s ease;
}

.aoc-page .newsletter-fields button:hover{
  background:var(--purple);
  border-color:var(--purple);
  color:var(--yellow) !important;
}

.aoc-page .newsletter-legal{
  color:var(--purple-deep) !important;

  font-family:'Chivo Mono', monospace;
  font-size:10px !important;
  font-weight:400;
  line-height:1.5;

  margin:10px 0 0 !important;
}


/* ==========================================================================
   COLONNES FOOTER
   ========================================================================== */

.aoc-page .footer-grid{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1fr;

  gap:30px;

  padding-bottom:30px;

  border-bottom:1px solid var(--gray);
}

.aoc-page .footer-grid h4{
  font-family:'Chivo Mono', monospace;
  font-size:11px;
  font-weight:500;

  text-transform:uppercase;
  letter-spacing:.1em;

  color:var(--purple);

  margin-bottom:16px;
}

.aoc-page .footer-grid a,
.aoc-page .footer-grid p{
  font-family:'Archivo', sans-serif;
  font-size:14px;
  font-weight:400;

  color:var(--purple-deep);

  display:block;

  margin-bottom:10px;
}

.aoc-page .footer-grid a{
  transition:color .2s ease;
}

.aoc-page .footer-grid a:hover{
  color:var(--purple);
}

.aoc-page .footer-bottom{
  display:flex;
  justify-content:space-between;

  padding-top:18px;

  font-family:'Chivo Mono', monospace;
  font-size:11px;
  font-weight:400;

  color:var(--purple-deep);

  flex-wrap:wrap;
  gap:10px;
}


/* ==========================================================================
   PLEINE LARGEUR ACCUEIL26
   ========================================================================== */

.aoc-page{
  width:100vw;
  max-width:none;

  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
}

body.page .site-content{
  padding-left:0;
  padding-right:0;
}

body.page .content-area,
body.page .site-main,
body.page article,
body.page .inside-article,
body.page .entry-content{
  width:100%;
  max-width:none;
}

body.page .inside-article{
  padding-left:0;
  padding-right:0;
}

.entry-content > .wp-block-html{
  margin:0;
}

body.page-id-7690 .grid-container,
body.page-id-7690 .site-grid,
body.page-id-7690 .container,
body.page-id-7690 .site-content,
body.page-id-7690 .content-area,
body.page-id-7690 .site-main,
body.page-id-7690 article,
body.page-id-7690 .inside-article,
body.page-id-7690 .entry-content{
  max-width:none !important;
  width:100% !important;

  margin-left:0 !important;
  margin-right:0 !important;

  padding-left:0 !important;
  padding-right:0 !important;
}

body.page-id-7690 #page{
  max-width:none !important;
  width:100% !important;

  margin:0 !important;
  padding-top:0 !important;
}

body.page-id-7690 #content{
  padding:0 !important;
  margin:0 !important;
}

body.page-id-7690 #primary,
body.page-id-7690 #main{
  width:100% !important;
  max-width:none !important;

  margin:0 !important;
  padding:0 !important;
}

body.page-id-7690 .aoc-page{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
}


/* ==========================================================================
   MASQUER HEADER GENERATEPRESS
   ========================================================================== */

body.page-id-7690 #masthead{
  display:none !important;
}


/* ==========================================================================
   RESPONSIVE — TABLETTE
   ========================================================================== */

@media (max-width:900px){

  .aoc-page .nav-links{
    display:none;
  }

  .aoc-page .hero-grid{
    grid-template-columns:1fr;
  }

  .aoc-page .hero-visual{
    max-width:280px;
    margin:40px auto 0;
    min-height:260px;
  }

  .aoc-page .aoc-hero-logo{
    width:min(300px,85%);
  }

  .aoc-page .exp-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .aoc-page .method-row{
    grid-template-columns:1fr;
  }

  .aoc-page .ref-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .aoc-page .case-grid{
    grid-template-columns:1fr;
  }

  .aoc-page .footer-grid{
    grid-template-columns:1fr 1fr;
  }

  .aoc-page .footer-newsletter{
    grid-template-columns:1fr;
    gap:35px;
  }

  .aoc-page .newsletter-fields{
    flex-direction:column;
  }

  .aoc-page .newsletter-fields button{
    width:100%;
  }

  .aoc-page .cta-picto{
    width:340px;
    right:-100px;
  }

}


/* ==========================================================================
   RESPONSIVE — MOBILE
   ========================================================================== */

@media (max-width:700px){

  .aoc-page .nav{
    padding:12px 18px;
  }

  .aoc-page .logo{
    display:none;
  }

  .aoc-page .aoc-header-logo{
    width:50px;
    height:50px;
  }

  .aoc-page .hero{
    padding:55px 22px 0;
  }

  .aoc-page .sec{
    padding:60px 22px;
  }

  .aoc-page .actu-row{
    grid-template-columns:1fr 35px;
    gap:10px 15px;
    padding:20px 0;
  }

  .aoc-page .actu-date{
    grid-column:1 / -1;
  }

  .aoc-page .testi{
    padding:60px 24px;
  }

  .aoc-page .testi-slider{
    min-height:300px;
  }

  .aoc-page .case{
    padding:65px 22px;
  }

  .aoc-page .cta{
    padding:90px 22px;
  }

  .aoc-page .cta-picto{
    width:280px;
    right:-110px;
    opacity:.8;
  }

}


/* ==========================================================================
   RESPONSIVE — PETIT MOBILE
   ========================================================================== */

@media (max-width:600px){

  .aoc-page .exp-grid{
    grid-template-columns:1fr;
  }

  .aoc-page .exp-card{
    min-height:230px;
  }

  .aoc-page .exp-icon{
    width:60px;
    height:60px;
    flex-basis:60px;
  }

  .aoc-page .ref-grid{
    grid-template-columns:1fr;
  }

  .aoc-page .footer-grid{
    grid-template-columns:1fr;
  }

}


/* ==========================================================================
   ACCESSIBILITÉ — MOUVEMENTS RÉDUITS
   ========================================================================== */

@media (prefers-reduced-motion:reduce){

  .aoc-page .marquee-track,
  .aoc-page .aoc-hero-logo.spin{
    animation:none;
  }

  .aoc-page *{
    transition:none !important;
  }

  .aoc-page .cta-picto{
    opacity:1;

    transform:
      translateX(0)
      translateY(-50%)
      rotate(0deg);

    right:-90px;
  }

}
/* ==========================================================================
   AOC — PAGE RÉFÉRENCES 26
   ========================================================================== */

.aoc-ref-page{
  --purple:#7500CA;
  --purple-deep:#33066B;
  --yellow:#FFFF5D;
  --pink:#FF8FE3;
  --peach:#FFB894;
  --brown:#4A3524;
  --gray:#C9C8BF;
  --gray-dark:#8B8A80;
  --paper:#FFFFFF;
  --paper-2:#F3F1E6;
  --ink:#15120B;

  width:100%;
  max-width:none;
  margin:0;
  padding:0;

  background:var(--paper);
  color:var(--ink);

  font-family:'Archivo', sans-serif;
  font-size:16px;
  font-weight:400;
  line-height:1.5;

  -webkit-font-smoothing:antialiased;
}


/* ==========================================================================
   BASE
   ========================================================================== */

.aoc-ref-page *{
  box-sizing:border-box;
}

.aoc-ref-page a{
  color:inherit;
  text-decoration:none;
}

.aoc-ref-page button{
  font:inherit;
}

.aoc-ref-page img{
  display:block;
  max-width:100%;
}

.aoc-ref-wrap{
  width:100%;
  max-width:1120px;

  margin-left:auto;
  margin-right:auto;

  padding-left:32px;
  padding-right:32px;
}


/* ==========================================================================
   HEADER
   ========================================================================== */

.aoc-ref-header{
  position:sticky;
  top:0;
  z-index:100;

  width:100%;

  margin:0;

  background:rgba(253,252,246,.95);

  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);

  border-bottom:1px solid var(--gray);
}

.aoc-ref-nav{
  display:flex;
  align-items:center;
  justify-content:space-between;

  width:100%;

  padding:16px 32px;
}

.aoc-ref-brand{
  display:flex;
  align-items:center;
  gap:12px;
}

.aoc-ref-logo-link{
  display:block;
  flex-shrink:0;
}

.aoc-ref-logo{
  width:60px;
  height:60px;

  object-fit:cover;
  border-radius:50%;
}

.aoc-ref-brand-text{
  font-family:'Archivo', sans-serif;
  font-size:17px;
  font-weight:800;
  line-height:1.1;
}

.aoc-ref-brand-text small{
  display:block;

  margin-top:3px;

  font-family:'Chivo Mono', monospace;
  font-size:11px;
  font-weight:400;

  color:var(--gray-dark);

  text-transform:uppercase;
  letter-spacing:.08em;
}

.aoc-ref-nav-links{
  display:flex;
  gap:30px;

  font-family:'Archivo', sans-serif;
  font-size:14px;
  font-weight:500;
}

.aoc-ref-nav-links a{
  position:relative;
  padding-bottom:3px;
}

.aoc-ref-nav-links a::after{
  content:"";

  position:absolute;
  left:0;
  bottom:0;

  width:0;
  height:2px;

  background:var(--purple);

  transition:width .2s ease;
}

.aoc-ref-nav-links a:hover::after{
  width:100%;
}

.aoc-ref-contact{
  display:inline-flex;
  align-items:center;

  padding:15px 28px;

  background:var(--yellow);
  color:var(--purple);

  border:2px solid var(--yellow);

  font-family:'Chivo Mono', monospace;
  font-size:13px;
  font-weight:500;

  text-transform:uppercase;
  letter-spacing:.03em;

  transition:
    background .2s ease,
    color .2s ease,
    border-color .2s ease,
    transform .2s ease;
}

.aoc-ref-contact:hover{
  background:var(--purple);
  border-color:var(--purple);
  color:var(--yellow);

  transform:translateY(-2px);
}


/* ==========================================================================
   INTRO
   ========================================================================== */

.aoc-ref-intro{
  padding:60px 0 28px;
}

.aoc-ref-intro .aoc-ref-wrap{
  max-width:1120px;
}

.aoc-ref-breadcrumb{
  display:flex;
  gap:8px;

  margin-bottom:32px;

  font-family:'Chivo Mono', monospace;
  font-size:11px;
  font-weight:400;

  color:var(--gray-dark);

  text-transform:uppercase;
  letter-spacing:.06em;
}

.aoc-ref-breadcrumb a:hover{
  color:var(--purple);
}

.aoc-ref-eyebrow{
  font-family:'Chivo Mono', monospace;

  font-size:12px;
  font-weight:500;

  color:var(--purple);

  text-transform:uppercase;
  letter-spacing:.12em;
}

.aoc-ref-intro h1{
  margin:10px 0 0;

  font-family:'Archivo', sans-serif;

  font-size:clamp(46px,7vw,88px);
  font-weight:800;

  line-height:.96;
  letter-spacing:-.035em;
}

.aoc-ref-intro p{
  max-width:610px;

  margin:22px 0 0;

  color:#4A4738;

  font-size:17px;
  font-weight:400;

  line-height:1.6;
}


/* ==================================================
   FILTRES — VERSION FINALE
================================================== */

.aoc-ref-filters-section{
  padding:18px 0 32px;
}

.aoc-ref-filters{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  width:100%;
}

.aoc-ref-filter-row{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px;
}

.aoc-ref-filter{
  padding:9px 14px;

  background:transparent;
  color:var(--purple);

  border:1px solid var(--purple);

  cursor:pointer;

  font-family:'Chivo Mono', monospace;
  font-size:10.5px;
  font-weight:500;

  text-transform:uppercase;
  letter-spacing:.03em;

  white-space:nowrap;

  transition:
    background .2s ease,
    color .2s ease,
    transform .2s ease;
}

.aoc-ref-filter:hover{
  background:var(--yellow);
  color:var(--purple);
  transform:translateY(-2px);
}

.aoc-ref-filter.active{
  background:var(--yellow);
  color:var(--purple);
  border-color:var(--yellow);
}


/* ==================================================
   PAGE ACTIVE DANS LE MENU
================================================== */

.aoc-ref-nav-links a.active::after{
  width:100%;
  background:var(--purple);
}
/* ==========================================================================
   MOSAÏQUE
   ========================================================================== */

.aoc-ref-mosaic-section{
  width:100%;

  padding:0 0 70px;

  background:var(--paper);

  overflow:hidden;
}

.aoc-ref-mosaic-section .aoc-ref-wrap{
  width:100%;
  max-width:1120px;

  margin-left:auto;
  margin-right:auto;

  padding-left:32px;
  padding-right:32px;
}

.aoc-ref-mosaic{
  display:grid;

  grid-template-columns:repeat(4,1fr);

  gap:10px;

  width:100%;
  max-width:1000px;

  margin-left:auto;
  margin-right:auto;

  align-items:center;
}


/* ==========================================================================
   CARTES
   ========================================================================== */

.aoc-ref-card{
  display:block;

  position:relative;

  width:100%;
  margin:0;

  opacity:0;

  transition:none;
}

.aoc-ref-card.is-hidden{
  display:none;
}


/* ==========================================================================
   ENGRENAGE ORIGINAL AOC
   ========================================================================== */

.aoc-ref-shape{
  position:relative;

  width:100%;

  aspect-ratio:211 / 253;

  display:flex;
  align-items:center;
  justify-content:center;

  clip-path:url(#rouage);
  -webkit-clip-path:url(#rouage);

  transition:
    background .28s ease,
    transform .35s cubic-bezier(.22,.75,.25,1);
}


/* ==========================================================================
   TEXTE DANS LES ENGRENAGES
   ========================================================================== */

.aoc-ref-content{
  position:relative;
  z-index:2;

  display:flex;

  width:74%;

  flex-direction:column;
  align-items:center;
  justify-content:center;

  text-align:center;
}

.aoc-ref-content h2{
  margin:0;

  font-family:'Archivo', sans-serif;

  font-size:clamp(16px,1.35vw,21px);
  font-weight:800;

  line-height:1.15;
  letter-spacing:-.015em;
}

.aoc-ref-content span{
  margin-top:11px;

  font-family:'Chivo Mono', monospace;

  font-size:10px;
  font-weight:500;

  line-height:1.4;

  text-transform:uppercase;
  letter-spacing:.04em;

  opacity:0;

  transform:translateY(8px);

  transition:
    opacity .3s ease,
    transform .3s ease;
}


/* ==========================================================================
   ANIMATION — ASSEMBLAGE
   ========================================================================== */

.aoc-ref-card:nth-child(4n+1){
  transform:
    translate(-110px,25px)
    rotate(-20deg);
}

.aoc-ref-card:nth-child(4n+2){
  transform:
    translate(15px,-100px)
    rotate(16deg);
}

.aoc-ref-card:nth-child(4n+3){
  transform:
    translate(-15px,100px)
    rotate(-16deg);
}

.aoc-ref-card:nth-child(4n+4){
  transform:
    translate(110px,-25px)
    rotate(20deg);
}

.aoc-ref-mosaic.is-assembled .aoc-ref-card{
  opacity:1;

  transform:
    translate(0,0)
    rotate(0deg);

  transition:
    transform 1.6s cubic-bezier(.22,.75,.25,1),
    opacity .8s ease;
}


/* ==========================================================================
   CASCADE
   ========================================================================== */

.aoc-ref-mosaic.is-assembled .aoc-ref-card:nth-child(1){
  transition-delay:.05s;
}

.aoc-ref-mosaic.is-assembled .aoc-ref-card:nth-child(2){
  transition-delay:.16s;
}

.aoc-ref-mosaic.is-assembled .aoc-ref-card:nth-child(3){
  transition-delay:.27s;
}

.aoc-ref-mosaic.is-assembled .aoc-ref-card:nth-child(4){
  transition-delay:.38s;
}

.aoc-ref-mosaic.is-assembled .aoc-ref-card:nth-child(5){
  transition-delay:.49s;
}

.aoc-ref-mosaic.is-assembled .aoc-ref-card:nth-child(6){
  transition-delay:.60s;
}

.aoc-ref-mosaic.is-assembled .aoc-ref-card:nth-child(7){
  transition-delay:.71s;
}

.aoc-ref-mosaic.is-assembled .aoc-ref-card:nth-child(8){
  transition-delay:.82s;
}


/* ==========================================================================
   HOVER
   ========================================================================== */

.aoc-ref-card:hover{
  z-index:4;
}

.aoc-ref-card:hover .aoc-ref-shape{
  transform:
    translateY(-5px)
    rotate(1deg);
}

.aoc-ref-card:hover .aoc-ref-content span{
  opacity:1;
  transform:translateY(0);
}


/* ==========================================================================
   COULEURS
   ========================================================================== */

.aoc-ref-card.ref-purple .aoc-ref-shape{
  background:var(--purple);
}

.aoc-ref-card.ref-purple .aoc-ref-content{
  color:var(--yellow);
}

.aoc-ref-card.ref-purple:hover .aoc-ref-shape{
  background:var(--yellow);
}

.aoc-ref-card.ref-purple:hover .aoc-ref-content{
  color:var(--purple);
}


.aoc-ref-card.ref-yellow .aoc-ref-shape{
  background:var(--yellow);
}

.aoc-ref-card.ref-yellow .aoc-ref-content{
  color:var(--purple);
}

.aoc-ref-card.ref-yellow:hover .aoc-ref-shape{
  background:var(--purple);
}

.aoc-ref-card.ref-yellow:hover .aoc-ref-content{
  color:var(--yellow);
}


.aoc-ref-card.ref-pink .aoc-ref-shape{
  background:var(--pink);
}

.aoc-ref-card.ref-pink .aoc-ref-content{
  color:var(--purple-deep);
}

.aoc-ref-card.ref-pink:hover .aoc-ref-shape{
  background:var(--purple);
}

.aoc-ref-card.ref-pink:hover .aoc-ref-content{
  color:var(--yellow);
}


.aoc-ref-card.ref-brown .aoc-ref-shape{
  background:var(--brown);
}

.aoc-ref-card.ref-brown .aoc-ref-content{
  color:var(--yellow);
}

.aoc-ref-card.ref-brown:hover .aoc-ref-shape{
  background:var(--peach);
}

.aoc-ref-card.ref-brown:hover .aoc-ref-content{
  color:var(--brown);
}


.aoc-ref-card.ref-peach .aoc-ref-shape{
  background:var(--peach);
}

.aoc-ref-card.ref-peach .aoc-ref-content{
  color:var(--brown);
}

.aoc-ref-card.ref-peach:hover .aoc-ref-shape{
  background:var(--pink);
}

.aoc-ref-card.ref-peach:hover .aoc-ref-content{
  color:var(--purple-deep);
}


/* ==========================================================================
   CTA
   ========================================================================== */

.aoc-ref-cta{
  width:100%;

  padding:90px 32px;

  background:var(--purple);

  text-align:center;
}

.aoc-ref-cta .aoc-ref-eyebrow{
  color:var(--yellow);
}

.aoc-ref-cta h2{
  max-width:760px;

  margin:14px auto 32px;

  color:#fff;

  font-family:'Archivo', sans-serif;

  font-size:clamp(34px,5vw,58px);
  font-weight:800;

  line-height:1.04;
}

.aoc-ref-cta > a{
  display:inline-block;

  padding:15px 25px;

  border:2px solid var(--yellow);

  color:var(--yellow);

  font-family:'Chivo Mono', monospace;

  font-size:12px;
  font-weight:500;

  text-transform:uppercase;

  transition:
    background .2s ease,
    color .2s ease;
}

.aoc-ref-cta > a:hover{
  background:var(--yellow);
  color:var(--purple);
}


/* ==========================================================================
   FOOTER
   ========================================================================== */

.aoc-ref-footer{
  width:100%;

  padding:40px 32px 22px;

  background:var(--paper-2);

  color:var(--purple-deep);
}

.aoc-ref-footer-grid{
  display:grid;

  grid-template-columns:1.5fr 1fr 1fr;

  gap:40px;

  width:100%;
  max-width:1120px;

  margin:0 auto;

  padding-bottom:30px;

  border-bottom:1px solid var(--gray);
}

.aoc-ref-footer h4{
  margin:0 0 14px;

  color:var(--purple);

  font-family:'Chivo Mono', monospace;

  font-size:11px;
  font-weight:500;

  text-transform:uppercase;
  letter-spacing:.08em;
}

.aoc-ref-footer p,
.aoc-ref-footer a{
  display:block;

  margin:0 0 8px;

  font-family:'Archivo', sans-serif;

  font-size:14px;
  font-weight:400;
}

.aoc-ref-footer a:hover{
  color:var(--purple);
}

.aoc-ref-footer-bottom{
  display:flex;

  justify-content:space-between;

  width:100%;
  max-width:1120px;

  margin:0 auto;

  padding-top:18px;

  gap:10px;

  flex-wrap:wrap;

  font-family:'Chivo Mono', monospace;

  font-size:11px;
  font-weight:400;
}


/* ==========================================================================
   WORDPRESS / GENERATEPRESS — PAGE 7770
   ========================================================================== */

body.page-id-7770 #masthead{
  display:none !important;
}

body.page-id-7770 .entry-title,
body.page-id-7770 header.entry-header,
body.page-id-7770 .wp-block-post-title,
body.page-id-7770 .page-header,
body.page-id-7770 .page-title,
body.page-id-7770 .wp-block-query-title{
  display:none !important;

  height:0 !important;

  margin:0 !important;
  padding:0 !important;
}

body.page-id-7770 main > h1:first-child,
body.page-id-7770 .site-main > h1:first-child,
body.page-id-7770 .inside-article > h1:first-child{
  display:none !important;

  height:0 !important;

  margin:0 !important;
  padding:0 !important;
}


/* ==========================================================================
   FOND ÉCRU PLEINE LARGEUR
   ========================================================================== */

html,
body.page-id-7770{
  width:100% !important;
  max-width:none !important;
}

body.page-id-7770{
  margin:0 !important;
  padding:0 !important;

  background:#FFFFFF !important;
}

body.page-id-7770 #page,
body.page-id-7770 #content,
body.page-id-7770 #primary,
body.page-id-7770 #main,
body.page-id-7770 article,
body.page-id-7770 .inside-article,
body.page-id-7770 .entry-content{
  width:100% !important;
  max-width:none !important;

  margin:0 !important;
  padding:0 !important;

  background:#FFFFFF !important;
}

body.page-id-7770 .grid-container,
body.page-id-7770 .site-grid,
body.page-id-7770 .container,
body.page-id-7770 .site-content,
body.page-id-7770 .content-area,
body.page-id-7770 .site-main{
  width:100% !important;
  max-width:none !important;

  margin-left:0 !important;
  margin-right:0 !important;

  padding-left:0 !important;
  padding-right:0 !important;
}

body.page-id-7770 .aoc-ref-page{
  width:100% !important;
  max-width:none !important;

  margin:0 !important;
  padding:0 !important;

  min-height:100vh;

  background:#FFFFFF !important;
}


/* ==========================================================================
   TABLETTE
   ========================================================================== */

@media (max-width:950px){

  .aoc-ref-nav-links{
    display:none;
  }

  .aoc-ref-wrap,
  .aoc-ref-mosaic-section .aoc-ref-wrap{
    max-width:760px;

    padding-left:30px;
    padding-right:30px;
  }

  .aoc-ref-mosaic{
    grid-template-columns:repeat(2,1fr);

    max-width:650px;

    gap:10px;
  }

  .aoc-ref-footer-grid{
    grid-template-columns:1fr 1fr;
  }

}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width:600px){

  .aoc-ref-nav{
    padding:12px 20px;
  }

  .aoc-ref-brand-text{
    display:none;
  }

  .aoc-ref-logo{
    width:50px;
    height:50px;
  }

  .aoc-ref-contact{
    padding:12px 16px;
  }

  .aoc-ref-wrap,
  .aoc-ref-mosaic-section .aoc-ref-wrap{
    padding-left:20px;
    padding-right:20px;
  }

  .aoc-ref-intro{
    padding-top:40px;
  }

  .aoc-ref-intro h1{
    font-size:48px;
  }

  .aoc-ref-filters{
    justify-content:flex-start;
  }

  .aoc-ref-mosaic{
    grid-template-columns:1fr;

    max-width:300px;

    gap:10px;
  }

  .aoc-ref-content{
    width:70%;
  }

  .aoc-ref-content h2{
    font-size:20px;
  }

  .aoc-ref-content span{
    opacity:1;
    transform:none;
  }

  .aoc-ref-cta{
    padding:75px 20px;
  }

  .aoc-ref-footer{
    padding-left:20px;
    padding-right:20px;
  }

  .aoc-ref-footer-grid{
    grid-template-columns:1fr;

    gap:25px;
  }

}


/* ==========================================================================
   ACCESSIBILITÉ
   ========================================================================== */

@media (prefers-reduced-motion:reduce){

  .aoc-ref-page *{
    transition:none !important;
    animation:none !important;
  }

  .aoc-ref-card{
    opacity:1 !important;
    transform:none !important;
  }

}
/* ==========================================================================
   REFERENCES26 — VRAIE PLEINE LARGEUR WORDPRESS
   ========================================================================== */

/* Le site WordPress doit occuper tout l'écran */
body.page-id-7770 .wp-site-blocks{
  width:100vw !important;
  max-width:none !important;

  margin:0 !important;
  padding:0 !important;

  background:#FFFFFF !important;
}


/* Supprime la contrainte du thème Twenty Twenty-Three */
body.page-id-7770 .is-layout-constrained,
body.page-id-7770 .wp-block-post-content,
body.page-id-7770 main.wp-block-group{
  width:100% !important;
  max-width:none !important;

  margin-left:0 !important;
  margin-right:0 !important;

  padding-left:0 !important;
  padding-right:0 !important;
}


/* WordPress impose parfois une largeur maximale aux enfants */
body.page-id-7770 .is-layout-constrained > *,
body.page-id-7770 .wp-block-post-content > *{
  max-width:none !important;
}


/* Notre page AOC prend réellement toute la fenêtre */
body.page-id-7770 .aoc-ref-page{
  width:100vw !important;
  max-width:none !important;

  margin:0 !important;
  padding:0 !important;

  background:#FFFFFF !important;
}


/* ==========================================================================
   CONTENU RÉFÉRENCES — CENTRAGE
   ========================================================================== */

/* Titre + introduction */
body.page-id-7770 .aoc-ref-intro .aoc-ref-wrap{
  width:100% !important;
  max-width:1050px !important;

  margin-left:auto !important;
  margin-right:auto !important;

  padding-left:25px !important;
  padding-right:25px !important;
}


/* Filtres */
body.page-id-7770 .aoc-ref-filters-section .aoc-ref-wrap{
  width:100% !important;
  max-width:1050px !important;

  margin-left:auto !important;
  margin-right:auto !important;

  padding-left:25px !important;
  padding-right:25px !important;
}

body.page-id-7770 .aoc-ref-filters{
  justify-content:center !important;
}


/* Mosaïque */
body.page-id-7770 .aoc-ref-mosaic-section .aoc-ref-wrap{
  width:100% !important;
  max-width:none !important;

  margin:0 !important;
  padding:0 25px !important;
}

body.page-id-7770 .aoc-ref-mosaic{
  width:100% !important;
  max-width:1000px !important;

  margin-left:auto !important;
  margin-right:auto !important;

  grid-template-columns:repeat(4,1fr);
  gap:10px;
}


/* CTA vraiment bord à bord */
body.page-id-7770 .aoc-ref-cta{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
}


/* Footer vraiment bord à bord */
body.page-id-7770 .aoc-ref-footer{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
}
/* PAGE ACTIVE DANS LE MENU */

.aoc-ref-nav-links a.active{
  position:relative;
}

.aoc-ref-nav-links a.active::after{
  width:100%;
  background:var(--purple);
}
/* ==========================================================================
   BOUTON — VOIR TOUTES LES RÉFÉRENCES
   ========================================================================== */

.aoc-ref-more-wrap{
  display:flex;
  justify-content:center;

  margin-top:38px;
}

.aoc-ref-more{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  padding:14px 24px;

  border:2px solid var(--purple);

  background:var(--purple);
  color:var(--yellow);

  font-family:'Chivo Mono', monospace;
  font-size:12px;
  font-weight:500;

  text-transform:uppercase;
  letter-spacing:.04em;

  cursor:pointer;

  transition:
    background .2s ease,
    color .2s ease,
    transform .2s ease;
}

.aoc-ref-more:hover{
  background:var(--yellow);
  color:var(--purple);

  transform:translateY(-3px);
}


/* PAGE ACTIVE DANS LE MENU */

.aoc-ref-nav-links a.active::after{
  width:100%;
  background:var(--purple);
}
/* ==========================================================================
   AOC — FICHE RÉFÉRENCE / SINGLE — V2
   ========================================================================== */

.aoc-single-reference{
  --purple:#7500CA;
  --purple-deep:#33066B;
  --yellow:#FFFF5D;
  --pink:#FF8FE3;
  --peach:#FFB894;
  --brown:#4A3524;
  --paper:#FFFFFF;
  --paper-2:#F3F1E6;
  --gray:#C9C8BF;
  --gray-dark:#8B8A80;
  --ink:#15120B;

  width:100%;
  max-width:none;
  margin:0;
  padding:0;

  background:var(--paper);
  color:var(--ink);

  font-family:'Archivo',sans-serif;
}


/* ==========================================================================
   RESET LOCAL
   ========================================================================== */

.aoc-single-reference *{
  box-sizing:border-box;
}

.aoc-single-reference a{
  color:inherit;
  text-decoration:none;
}

.aoc-single-reference img{
  display:block;
  max-width:100%;
}


/* ==========================================================================
   SUPPRESSION ANCIEN HABILLAGE GENERATEPRESS
   ========================================================================== */

body:has(.aoc-single-reference) #masthead{
  display:none !important;
}

body:has(.aoc-single-reference) .site-info{
  display:none !important;
}

body:has(.aoc-single-reference) #page,
body:has(.aoc-single-reference) #content,
body:has(.aoc-single-reference) #primary,
body:has(.aoc-single-reference) #main,
body:has(.aoc-single-reference) .site-content,
body:has(.aoc-single-reference) .content-area,
body:has(.aoc-single-reference) .site-main{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
}

body:has(.aoc-single-reference){
  background:var(--paper) !important;
}


/* ==========================================================================
   HEADER
   ========================================================================== */

.aoc-ref-header{
  position:sticky;
  top:0;
  z-index:100;

  width:100%;

  background:rgba(253,252,246,.96);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);

  border-bottom:1px solid var(--gray);
}

.admin-bar .aoc-ref-header{
  top:32px;
}

.aoc-ref-header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;

  width:100%;
  max-width:1320px;

  margin:0 auto;
  padding:14px 28px;
}

.aoc-ref-brand{
  display:flex;
  align-items:center;
  gap:12px;
}

.aoc-ref-logo{
  width:56px;
  height:56px;
  object-fit:cover;
  border-radius:50%;
}

.aoc-ref-brand-text{
  display:flex;
  flex-direction:column;
  line-height:1.1;
}

.aoc-ref-brand-text strong{
  font-size:16px;
  font-weight:800;
}

.aoc-ref-brand-text small{
  margin-top:3px;

  font-family:'Chivo Mono',monospace;
  font-size:10px;

  color:var(--gray-dark);

  text-transform:uppercase;
  letter-spacing:.08em;
}

.aoc-ref-nav{
  display:flex;
  gap:28px;

  font-size:14px;
  font-weight:500;
}

.aoc-ref-nav a{
  position:relative;
  padding-bottom:3px;
}

.aoc-ref-nav a::after{
  content:"";

  position:absolute;
  left:0;
  bottom:0;

  width:0;
  height:2px;

  background:var(--purple);

  transition:width .2s ease;
}

.aoc-ref-nav a:hover::after,
.aoc-ref-nav a.is-current::after{
  width:100%;
}

.aoc-ref-contact{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  padding:14px 24px;

  background:var(--yellow);
  color:var(--purple);

  border:2px solid var(--yellow);

  font-family:'Chivo Mono',monospace;
  font-size:11px;
  font-weight:500;

  text-transform:uppercase;
  letter-spacing:.04em;

  transition:
    background .2s ease,
    color .2s ease,
    transform .2s ease;
}

.aoc-ref-contact:hover{
  background:var(--purple);
  color:var(--yellow);

  border-color:var(--purple);

  transform:translateY(-2px);
}


/* ==========================================================================
   LAYOUT GÉNÉRAL
   ========================================================================== */

.aoc-ref-page{
  width:100%;

  background:var(--paper);
}

.aoc-ref-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 300px;

  gap:56px;

  width:100%;
  max-width:1320px;

  margin:0 auto;
  padding:44px 28px 80px;
}

.aoc-ref-main{
  min-width:0;
}


/* ==========================================================================
   HERO
   ========================================================================== */

.aoc-ref-hero{
  padding-bottom:38px;
}

.aoc-ref-breadcrumb{
  display:flex;
  flex-wrap:wrap;

  gap:7px;

  margin-bottom:28px;

  font-family:'Chivo Mono',monospace;
  font-size:10px;

  color:var(--gray-dark);

  text-transform:uppercase;
  letter-spacing:.05em;
}

.aoc-ref-tags{
  display:flex;
  flex-wrap:wrap;

  gap:8px;

  margin-bottom:18px;
}

.aoc-ref-tag{
  display:inline-flex;

  padding:8px 12px;

  background:var(--purple);
  color:var(--yellow);

  font-family:'Chivo Mono',monospace;
  font-size:10px;
  font-weight:500;

  text-transform:uppercase;
  letter-spacing:.04em;
}

.aoc-ref-title{
  margin:0;

  max-width:900px;

  font-family:'Archivo',sans-serif;
  font-size:clamp(52px,6vw,88px);
  font-weight:800;

  line-height:.94;
  letter-spacing:-.045em;
}


/* ==========================================================================
   GALERIE
   ========================================================================== */

.aoc-ref-gallery{
  display:grid;

  grid-template-columns:repeat(3,1fr);

  gap:14px;

  margin-top:8px;
}

.aoc-ref-gallery-single{
  grid-template-columns:1fr;
}

.aoc-ref-gallery-image{
  width:100%;
  height:420px;

  object-fit:cover;

  background:var(--paper-2);
}


/* ==========================================================================
   LE PROJET
   ========================================================================== */

.aoc-ref-project{
  display:grid;

  grid-template-columns:180px minmax(0,1fr);

  gap:48px;

  margin-top:70px;
  padding:60px 0;

  border-top:1px solid var(--gray);
}

.aoc-ref-project-label{
  font-family:'Chivo Mono',monospace;
  font-size:11px;
  font-weight:500;

  color:var(--purple);

  text-transform:uppercase;
  letter-spacing:.1em;
}

.aoc-ref-content{
  max-width:720px;

  color:#343126;

  font-size:17px;
  line-height:1.65;
}

.aoc-ref-content p{
  margin:0 0 18px;
}

.aoc-ref-content p:first-child{
  font-size:20px;
  line-height:1.5;
}

.aoc-ref-content a{
  color:var(--purple);

  text-decoration:underline;
  text-underline-offset:4px;
}


/* ==========================================================================
   ACTU / PRESSE LIÉES
   ========================================================================== */

.aoc-ref-related,
.aoc-ref-press{
  margin-top:40px;
  padding-top:35px;

  border-top:1px solid var(--gray);
}

.aoc-ref-related-label{
  margin-bottom:14px;

  font-family:'Chivo Mono',monospace;
  font-size:11px;
  font-weight:500;

  color:var(--purple);

  text-transform:uppercase;
  letter-spacing:.08em;
}

.aoc-ref-related-card{
  display:grid;

  grid-template-columns:180px 1fr;

  gap:22px;

  align-items:center;

  padding:18px;

  background:var(--paper-2);

  transition:background .2s ease;
}

.aoc-ref-related-card:hover{
  background:var(--yellow);
}

.aoc-ref-related-image{
  width:100%;
  height:120px;

  object-fit:cover;
}

.aoc-ref-related-copy h2{
  margin:0;

  font-size:22px;
  line-height:1.15;
}

.aoc-ref-related-copy span{
  display:block;

  margin-top:10px;

  font-family:'Chivo Mono',monospace;
  font-size:10px;

  text-transform:uppercase;

  color:var(--purple);
}

.aoc-ref-press-link{
  display:flex;
  justify-content:space-between;
  align-items:center;

  padding:16px 18px;

  border:1px solid var(--ink);

  font-weight:700;
}


/* ==========================================================================
   SIDEBAR
   ========================================================================== */

.aoc-ref-sidebar{
  min-width:0;
}

.aoc-ref-sidebar-sticky{
  position:sticky;
  top:105px;

  max-height:calc(100vh - 130px);

  display:flex;
  flex-direction:column;

  border-left:1px solid var(--gray);

  padding-left:22px;
}

.admin-bar .aoc-ref-sidebar-sticky{
  top:137px;
}

.aoc-ref-sidebar-heading{
  margin-bottom:14px;

  font-family:'Chivo Mono',monospace;
  font-size:10px;
  font-weight:500;

  color:var(--gray-dark);

  text-transform:uppercase;
  letter-spacing:.08em;
}

.aoc-ref-sidebar-list{
  overflow-y:auto;

  padding-right:6px;
}

.aoc-ref-sidebar-list::-webkit-scrollbar{
  width:5px;
}

.aoc-ref-sidebar-list::-webkit-scrollbar-thumb{
  background:var(--gray);
  border-radius:10px;
}

.aoc-ref-sidebar-item{
  display:grid;

  grid-template-columns:54px 1fr;

  gap:12px;

  align-items:center;

  padding:8px;

  margin-bottom:3px;

  transition:background .15s ease;
}

.aoc-ref-sidebar-item:hover{
  background:var(--paper-2);
}

.aoc-ref-sidebar-item.is-active{
  background:var(--purple);
  color:#fff;
}

.aoc-ref-sidebar-thumb{
  width:54px;
  height:54px;

  overflow:hidden;
}

.aoc-ref-sidebar-thumb img{
  width:100%;
  height:100%;

  object-fit:cover;
}

.aoc-ref-sidebar-placeholder{
  display:flex;

  align-items:center;
  justify-content:center;

  width:100%;
  height:100%;

  background:var(--yellow);
  color:var(--purple);

  font-weight:800;
}

.aoc-ref-sidebar-name{
  font-size:13px;
  font-weight:700;

  line-height:1.25;
}


/* ==========================================================================
   NAVIGATION PRÉCÉDENTE / SUIVANTE
   ========================================================================== */

.aoc-ref-pagination{
  width:100%;

  background:var(--paper-2);

  border-top:1px solid var(--gray);
  border-bottom:1px solid var(--gray);
}

.aoc-ref-pagination-inner{
  display:grid;

  grid-template-columns:1fr 1fr;

  gap:50px;

  max-width:1320px;

  margin:0 auto;
  padding:46px 28px;
}

.aoc-ref-pagination-item{
  display:flex;

  flex-direction:column;

  gap:10px;
}

.aoc-ref-pagination-next{
  text-align:right;
}

.aoc-ref-pagination-item small{
  font-family:'Chivo Mono',monospace;
  font-size:10px;

  color:var(--purple);

  text-transform:uppercase;
  letter-spacing:.08em;
}

.aoc-ref-pagination-item strong{
  font-size:28px;
  line-height:1.05;
}


/* ==========================================================================
   CTA
   ========================================================================== */

.aoc-ref-cta{
  width:100%;

  background:var(--purple);
  color:#fff;
}

.aoc-ref-cta-inner{
  max-width:900px;

  margin:0 auto;
  padding:90px 28px;

  text-align:center;
}

.aoc-ref-cta-kicker{
  font-family:'Chivo Mono',monospace;
  font-size:10px;

  color:var(--yellow);

  text-transform:uppercase;
  letter-spacing:.1em;
}

.aoc-ref-cta h2{
  margin:14px auto 30px;

  font-size:clamp(38px,5vw,60px);
  font-weight:800;

  line-height:1.03;
}

.aoc-ref-cta a{
  display:inline-flex;

  padding:14px 22px;

  border:2px solid var(--yellow);

  color:var(--yellow);

  font-family:'Chivo Mono',monospace;
  font-size:10px;

  text-transform:uppercase;
}

.aoc-ref-cta a:hover{
  background:var(--yellow);
  color:var(--purple);
}


/* ==========================================================================
   FOOTER — NEWSLETTER
   ========================================================================== */

.aoc-ref-footer{
  width:100%;

  background:var(--paper-2);

  color:var(--purple-deep);
}

.aoc-footer-newsletter{
  border-bottom:1px solid var(--gray);
}

.aoc-footer-newsletter-inner{
  display:grid;

  grid-template-columns:220px 1fr;

  gap:50px;

  max-width:1320px;

  margin:0 auto;
  padding:55px 28px;
}

.aoc-footer-newsletter-label{
  font-family:'Chivo Mono',monospace;
  font-size:10px;

  color:var(--purple);

  text-transform:uppercase;
  letter-spacing:.1em;
}

.aoc-footer-newsletter-content h2{
  margin:0;

  font-size:clamp(30px,3.5vw,46px);
  font-weight:800;

  line-height:1.05;
}

.aoc-footer-newsletter-content p{
  max-width:500px;

  margin:16px 0 22px;

  font-size:14px;
  line-height:1.5;
}

.aoc-footer-newsletter-button{
  display:inline-flex;

  padding:12px 18px;

  background:var(--yellow);
  color:var(--purple);

  font-family:'Chivo Mono',monospace;
  font-size:10px;

  text-transform:uppercase;
}


/* ==========================================================================
   FOOTER PRINCIPAL
   ========================================================================== */

.aoc-footer-main-inner{
  display:grid;

  grid-template-columns:1.5fr 1fr 1fr 1fr;

  gap:35px;

  max-width:1320px;

  margin:0 auto;
  padding:42px 28px 32px;
}

.aoc-footer-column{
  display:flex;

  flex-direction:column;

  gap:8px;
}

.aoc-footer-title{
  font-size:16px;
}

.aoc-footer-about p{
  max-width:300px;

  margin:8px 0 0;

  font-size:13px;
  line-height:1.5;
}

.aoc-footer-eyebrow{
  margin-bottom:8px;

  font-family:'Chivo Mono',monospace;
  font-size:10px;

  color:var(--purple);

  text-transform:uppercase;
  letter-spacing:.08em;
}

.aoc-footer-column a{
  font-size:13px;
}

.aoc-footer-column a:hover{
  color:var(--purple);
}

.aoc-footer-bottom{
  display:flex;
  justify-content:space-between;

  gap:15px;

  max-width:1320px;

  margin:0 auto;
  padding:18px 28px;

  border-top:1px solid var(--gray);

  font-family:'Chivo Mono',monospace;
  font-size:10px;

  flex-wrap:wrap;
}


/* ==========================================================================
   TABLETTE
   ========================================================================== */

@media (max-width:980px){

  .aoc-ref-nav{
    display:none;
  }

  .aoc-ref-layout{
    grid-template-columns:1fr;

    max-width:820px;
  }

  .aoc-ref-sidebar{
    order:2;
  }

  .aoc-ref-sidebar-sticky{
    position:static;

    max-height:none;

    border-left:0;
    border-top:1px solid var(--gray);

    padding-left:0;
    padding-top:30px;
  }

  .aoc-ref-sidebar-list{
    display:flex;

    gap:10px;

    overflow-x:auto;
    overflow-y:hidden;
  }

  .aoc-ref-sidebar-item{
    display:flex;
    flex-direction:column;

    width:100px;
    flex:0 0 100px;

    text-align:center;
  }

  .aoc-ref-sidebar-thumb{
    width:72px;
    height:72px;
  }

  .aoc-ref-gallery{
    grid-template-columns:repeat(2,1fr);
  }

  .aoc-ref-project{
    grid-template-columns:1fr;
    gap:20px;
  }

  .aoc-footer-main-inner{
    grid-template-columns:1fr 1fr;
  }

}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width:600px){

  .admin-bar .aoc-ref-header{
    top:46px;
  }

  .aoc-ref-header-inner{
    padding:12px 18px;
  }

  .aoc-ref-brand-text{
    display:none;
  }

  .aoc-ref-logo{
    width:50px;
    height:50px;
  }

  .aoc-ref-contact{
    padding:11px 15px;
  }

  .aoc-ref-layout{
    padding:35px 20px 55px;
  }

  .aoc-ref-title{
    font-size:46px;
  }

  .aoc-ref-gallery{
    grid-template-columns:1fr;
  }

  .aoc-ref-gallery-image{
    height:auto;
  }

  .aoc-ref-project{
    margin-top:50px;
    padding:45px 0;
  }

  .aoc-ref-content{
    font-size:16px;
  }

  .aoc-ref-pagination-inner{
    grid-template-columns:1fr;

    gap:30px;

    padding:35px 20px;
  }

  .aoc-ref-pagination-next{
    text-align:left;
  }

  .aoc-footer-newsletter-inner{
    grid-template-columns:1fr;

    gap:20px;

    padding:45px 20px;
  }

  .aoc-footer-main-inner{
    grid-template-columns:1fr;

    padding:35px 20px;
  }

  .aoc-footer-bottom{
    padding:18px 20px;
  }

}
/* TEXTE DES FICHES RÉFÉRENCES */

.aoc-ref-project-content,
.aoc-ref-content,
.aoc-ref-content p{
  text-align:left !important;
}

.aoc-ref-content{
  max-width:680px;
  font-family:'Archivo', sans-serif;
  font-size:16px;
  line-height:1.65;
}

.aoc-ref-content p:first-child{
  font-size:18px;
  line-height:1.6;
}
/* ==========================================================================
   FICHE RÉFÉRENCE — HEADER IDENTIQUE À LA HOME
   ========================================================================== */

.aoc-single-reference .aoc-header{
  position:sticky;
  top:0;
  z-index:100;

  width:100%;

  background:rgba(253,252,246,.94);

  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);

  border-bottom:1px solid #C9C8BF;
}

.admin-bar .aoc-single-reference .aoc-header{
  top:32px;
}

.aoc-single-reference .nav{
  display:flex;
  align-items:center;
  justify-content:space-between;

  width:100%;

  padding:16px 32px;
}

.aoc-single-reference .brand{
  display:flex;
  align-items:center;
  gap:12px;
}

.aoc-single-reference .aoc-logo-link{
  display:block;
  flex-shrink:0;
}

.aoc-single-reference .aoc-header-logo{
  width:60px;
  height:60px;

  display:block;

  object-fit:cover;

  border-radius:50%;

  flex-shrink:0;
}

.aoc-single-reference .logo{
  font-family:'Archivo', sans-serif;
  font-weight:800;
  font-size:17px;

  letter-spacing:-.01em;
  line-height:1.1;
}

.aoc-single-reference .logo small{
  display:block;

  margin-top:2px;

  font-family:'Chivo Mono', monospace;
  font-weight:400;
  font-size:11px;

  letter-spacing:.1em;

  color:#8B8A80;

  text-transform:uppercase;
}

.aoc-single-reference .nav-links{
  display:flex;
  align-items:center;

  gap:30px;

  font-family:'Archivo', sans-serif;
  font-size:14px;
  font-weight:500;
}

.aoc-single-reference .nav-links a{
  position:relative;

  padding-bottom:3px;

  text-decoration:none;
}

.aoc-single-reference .nav-links a::after{
  content:"";

  position:absolute;

  left:0;
  bottom:0;

  width:0;
  height:2px;

  background:#7500CA;

  transition:width .2s ease;
}

.aoc-single-reference .nav-links a:hover::after,
.aoc-single-reference .nav-links a.active::after{
  width:100%;
}

.aoc-single-reference .btn{
  display:inline-flex;

  align-items:center;
  justify-content:center;

  padding:15px 28px;

  font-family:'Chivo Mono', monospace;
  font-size:13px;
  font-weight:500;

  letter-spacing:.03em;

  text-transform:uppercase;

  border:2px solid #FFFF5D;

  transition:
    transform .2s ease,
    background .2s ease,
    color .2s ease,
    border-color .2s ease;
}

.aoc-single-reference .btn-solid{
  background:#FFFF5D;
  color:#7500CA;

  border-color:#FFFF5D;
}

.aoc-single-reference .btn-solid:hover{
  background:#7500CA;
  color:#FFFF5D;

  border-color:#7500CA;

  transform:translateY(-2px);
}


/* ==========================================================================
   MOBILE HEADER
   ========================================================================== */

@media (max-width:900px){

  .aoc-single-reference .nav-links{
    display:none;
  }

}

@media (max-width:600px){

  .admin-bar .aoc-single-reference .aoc-header{
    top:46px;
  }

  .aoc-single-reference .nav{
    padding:12px 18px;
  }

  .aoc-single-reference .logo{
    display:none;
  }

  .aoc-single-reference .aoc-header-logo{
    width:50px;
    height:50px;
  }

  .aoc-single-reference .btn{
    padding:12px 16px;
  }

}
/* ==========================================================================
   GALERIE RÉFÉRENCES — ADAPTATIVE SELON LE NOMBRE D'IMAGES
   ========================================================================== */

.aoc-single-reference .aoc-ref-gallery{
  display:grid;
  gap:16px;
  align-items:start;

  width:100%;
  margin:0;
}


/* ----------------------------------------------------------
   1 IMAGE
   Grande image sur toute la largeur du contenu
   ---------------------------------------------------------- */

.aoc-single-reference .aoc-ref-gallery-count-1{
  grid-template-columns:1fr;
}

.aoc-single-reference .aoc-ref-gallery-count-1 .aoc-ref-gallery-image{
  width:100%;
  max-width:none;
  height:auto;
}


/* ----------------------------------------------------------
   2 IMAGES
   ---------------------------------------------------------- */

.aoc-single-reference .aoc-ref-gallery-count-2{
  grid-template-columns:repeat(2,minmax(0,1fr));
}


/* ----------------------------------------------------------
   3 IMAGES
   ---------------------------------------------------------- */

.aoc-single-reference .aoc-ref-gallery-count-3{
  grid-template-columns:repeat(3,minmax(0,1fr));
}


/* ----------------------------------------------------------
   4 IMAGES ET PLUS
   ---------------------------------------------------------- */

.aoc-single-reference .aoc-ref-gallery:not(.aoc-ref-gallery-count-1):not(.aoc-ref-gallery-count-2):not(.aoc-ref-gallery-count-3){
  grid-template-columns:repeat(3,minmax(0,1fr));
}


/* ----------------------------------------------------------
   FORMAT NATUREL DE TOUTES LES IMAGES
   ---------------------------------------------------------- */

.aoc-single-reference .aoc-ref-gallery-image{
  display:block;

  width:100%;
  height:auto !important;

  min-height:0 !important;
  max-height:none !important;

  object-fit:contain !important;
}


/* ----------------------------------------------------------
   TABLETTE
   ---------------------------------------------------------- */

@media (max-width:900px){

  .aoc-single-reference .aoc-ref-gallery-count-3,
  .aoc-single-reference .aoc-ref-gallery:not(.aoc-ref-gallery-count-1):not(.aoc-ref-gallery-count-2):not(.aoc-ref-gallery-count-3){
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

}


/* ----------------------------------------------------------
   MOBILE
   ---------------------------------------------------------- */

@media (max-width:600px){

  .aoc-single-reference .aoc-ref-gallery{
    grid-template-columns:1fr !important;
  }

}
/* =========================================================
   AOC — HEADER COMMUN
   Accueil + Références + Actus
   ========================================================= */

/* Header */
#masthead {
    background: #FFFFFF;
    border-bottom: 1px solid rgba(20, 17, 10, 0.18);
}

#masthead .inside-header {
    max-width: 1400px;
    margin: 0 auto;
    padding: 16px 32px;
    min-height: 88px;
    display: flex;
    align-items: center;
}

/* Zone logo + nom */
.site-branding-container {
    display: flex;
    align-items: center;
    gap: 14px;
}

/* Logo rond */
.site-logo img.header-image {
    width: 58px !important;
    height: 58px !important;
    max-width: 58px !important;
    object-fit: contain;
}

/* Nom */
.site-branding .main-title,
.site-branding .site-title {
    font-family: "Archivo", sans-serif;
    font-size: 19px;
    line-height: 1.05;
    font-weight: 700;
    margin: 0;
}

/* Baseline */
.site-description {
    font-family: "Chivo Mono", monospace;
    font-size: 9px;
    line-height: 1.25;
    letter-spacing: .12em;
    text-transform: uppercase;
    margin-top: 4px;
}

/* Menu */
.main-navigation {
    margin-left: auto;
    background: transparent;
}

.main-navigation .main-nav > ul {
    display: flex;
    align-items: center;
    gap: 38px;
}

.main-navigation .main-nav ul li a {
    font-family: "Archivo", sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    padding: 12px 0;
    color: #15120d;
    background: transparent;
}

/* Page active */
.main-navigation .main-nav ul li.current-menu-item > a,
.main-navigation .main-nav ul li.current-menu-ancestor > a {
    color: #15120d;
    border-bottom: 2px solid #7900df;
}

/* Contact */
.main-navigation .main-nav ul li:last-child > a {
    background: #ffff5d;
    padding: 17px 28px;
    border-bottom: 0;
    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
}

/* Contact au survol */
.main-navigation .main-nav ul li:last-child > a:hover {
    background: #7900df;
    color: #ffff5d;
}

/* Tablette/mobile */
@media (max-width: 900px) {
    #masthead .inside-header {
        padding: 12px 20px;
        min-height: 72px;
    }

    .site-logo img.header-image {
        width: 48px !important;
        height: 48px !important;
        max-width: 48px !important;
    }

    .main-navigation .main-nav > ul {
        gap: 18px;
    }
}
/* ==========================================================================
   FICHE RÉFÉRENCE — BOUTON SITE
   ========================================================================== */

.aoc-ref-site{
  margin-top:10px;
  margin-bottom:58px;
}

.aoc-ref-site-button{
  display:inline-flex;
  align-items:center;
  gap:12px;

  padding:14px 20px;

  background:var(--yellow);
  color:var(--purple);

  border:2px solid var(--purple);

  font-family:'Chivo Mono', monospace;
  font-size:11px;
  font-weight:500;

  text-transform:uppercase;
  letter-spacing:.05em;

  transition:
    background .2s ease,
    color .2s ease,
    transform .2s ease;
}

.aoc-ref-site-button:hover{
  background:var(--purple);
  color:var(--yellow);

  transform:translateY(-2px);
}

.aoc-ref-site-button span{
  font-size:15px;
}


/* ==========================================================================
   FICHE RÉFÉRENCE — BLOCS LIÉS
   ========================================================================== */

.aoc-ref-related,
.aoc-ref-press{
  margin-top:54px;
  padding-top:42px;

  border-top:1px solid var(--gray);
}

.aoc-ref-related-label{
  margin-bottom:22px;

  font-family:'Chivo Mono', monospace;
  font-size:11px;
  font-weight:500;

  color:var(--purple);

  text-transform:uppercase;
  letter-spacing:.1em;
}


/* ==========================================================================
   ACTUALITÉS LIÉES
   ========================================================================== */

.aoc-ref-related-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}

.aoc-ref-related-card{
  display:grid;
  grid-template-columns:150px minmax(0,1fr);
  gap:18px;

  align-items:stretch;

  padding:16px;

  background:var(--paper-2);

  border:1px solid transparent;

  transition:
    background .2s ease,
    border-color .2s ease,
    transform .2s ease;
}

.aoc-ref-related-card:hover{
  background:var(--yellow);
  border-color:var(--purple);

  transform:translateY(-3px);
}

.aoc-ref-related-image{
  width:150px;
  height:120px;

  object-fit:cover;
}

.aoc-ref-related-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.aoc-ref-related-date{
  display:block;

  margin-bottom:8px;

  font-family:'Chivo Mono', monospace;
  font-size:9px;

  color:var(--gray-dark);

  text-transform:uppercase;
  letter-spacing:.06em;
}

.aoc-ref-related-copy h2{
  margin:0;

  font-family:'Archivo', sans-serif;
  font-size:19px;
  font-weight:800;

  line-height:1.15;
}

.aoc-ref-related-copy > span:last-child{
  display:block;

  margin-top:12px;

  font-family:'Chivo Mono', monospace;
  font-size:10px;
  font-weight:500;

  color:var(--purple);

  text-transform:uppercase;
  letter-spacing:.04em;
}


/* ==========================================================================
   DOCUMENTS PRESSE
   ========================================================================== */

.aoc-ref-press{
  margin-bottom:30px;
}

.aoc-ref-press-link{
  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:25px;

  width:100%;

  padding:18px 20px;

  border-top:1px solid var(--gray);

  font-family:'Archivo', sans-serif;
  font-size:15px;
  font-weight:700;

  transition:
    background .2s ease,
    padding-left .2s ease,
    padding-right .2s ease;
}

.aoc-ref-press-link:last-child{
  border-bottom:1px solid var(--gray);
}

.aoc-ref-press-link:hover{
  background:var(--yellow);

  padding-left:26px;
  padding-right:26px;
}

.aoc-ref-press-link span:last-child{
  flex-shrink:0;

  color:var(--purple);

  font-family:'Chivo Mono', monospace;
  font-size:16px;
}


/* ==========================================================================
   RESPONSIVE — TABLETTE
   ========================================================================== */

@media (max-width:900px){

  .aoc-ref-related-list{
    grid-template-columns:1fr;
  }

}


/* ==========================================================================
   RESPONSIVE — MOBILE
   ========================================================================== */

@media (max-width:600px){

  .aoc-ref-site{
    margin-bottom:45px;
  }

  .aoc-ref-site-button{
    width:100%;
    justify-content:space-between;
  }

  .aoc-ref-related,
  .aoc-ref-press{
    margin-top:42px;
    padding-top:32px;
  }

  .aoc-ref-related-card{
    grid-template-columns:1fr;
  }

  .aoc-ref-related-image{
    width:100%;
    height:auto;
    max-height:220px;
  }

  .aoc-ref-press-link{
    align-items:flex-start;

    font-size:14px;
  }

}
/* =========================================================
   FINITIONS — SITE / ACTUS / PRESSE
   ========================================================= */

.aoc-ref-site{
  margin-top:-20px;
  margin-bottom:46px;
}

.aoc-ref-related,
.aoc-ref-press{
  margin-top:42px;
  padding-top:34px;
}

/* carte actu un peu plus généreuse */
.aoc-ref-related-card{
  max-width:620px;
}

/* documents presse */
.aoc-ref-press-link{
  min-height:58px;
}

/* bouton */
.aoc-ref-site-button{
  padding:13px 18px;
}
/* ==========================================================================
   FICHE RÉFÉRENCE — FOOTER CALÉ COMME LA HOME
   ========================================================================== */

.aoc-ref-footer{
  width:100%;
  background:var(--paper-2);
  color:var(--purple-deep);
}

/* NEWSLETTER */

.aoc-footer-newsletter{
  width:100%;
  border-bottom:1px solid var(--gray);
}

.aoc-footer-newsletter-inner{
  width:100%;
  max-width:1280px;

  margin:0 auto;
  padding:48px 32px;

  display:grid;
  grid-template-columns:1fr 1fr;

  gap:50px;
  align-items:end;
}

.aoc-footer-newsletter-label{
  align-self:start;

  font-family:'Chivo Mono', monospace;
  font-size:11px;
  font-weight:500;

  color:var(--purple);

  text-transform:uppercase;
  letter-spacing:.1em;
}

.aoc-footer-newsletter-content h2{
  margin:0;

  font-family:'Archivo', sans-serif;
  font-size:clamp(28px,3vw,42px);
  font-weight:800;

  line-height:1.05;

  color:var(--purple-deep);
}

.aoc-footer-newsletter-content p{
  max-width:430px;

  margin:16px 0 22px;

  color:var(--purple-deep);

  font-size:14px;
  line-height:1.5;
}

.aoc-footer-newsletter-button{
  display:inline-flex;

  padding:14px 18px;

  background:var(--yellow);
  color:var(--purple);

  font-family:'Chivo Mono', monospace;
  font-size:11px;
  font-weight:500;

  text-transform:uppercase;
  letter-spacing:.04em;
}

.aoc-footer-newsletter-button:hover{
  background:var(--purple);
  color:var(--yellow);
}


/* FOOTER PRINCIPAL */

.aoc-footer-main{
  width:100%;
}

.aoc-footer-main-inner{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1fr;

  gap:30px;

  width:100%;
  max-width:1280px;

  margin:0 auto;
  padding:40px 32px 30px;
}

.aoc-footer-column{
  display:flex;
  flex-direction:column;
  align-items:flex-start;

  gap:9px;
}

.aoc-footer-title{
  font-family:'Archivo', sans-serif;
  font-size:15px;
  font-weight:800;
}

.aoc-footer-about p{
  max-width:300px;

  margin:5px 0 0;

  font-size:14px;
  line-height:1.5;
}

.aoc-footer-eyebrow{
  margin-bottom:7px;

  font-family:'Chivo Mono', monospace;
  font-size:11px;
  font-weight:500;

  color:var(--purple);

  text-transform:uppercase;
  letter-spacing:.1em;
}

.aoc-footer-column a{
  font-family:'Archivo', sans-serif;
  font-size:14px;
  font-weight:400;
}

.aoc-footer-column a:hover{
  color:var(--purple);
}


/* LIGNE TOUT EN BAS */

.aoc-footer-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:20px;

  width:calc(100% - 64px);
  max-width:1216px;

  margin:0 auto;

  padding:18px 0 22px;

  border-top:1px solid var(--gray);

  font-family:'Chivo Mono', monospace;
  font-size:11px;
  font-weight:400;

  color:var(--purple-deep);

  flex-wrap:wrap;
}


/* TABLETTE */

@media (max-width:900px){

  .aoc-footer-newsletter-inner{
    grid-template-columns:1fr;
    gap:25px;
  }

  .aoc-footer-main-inner{
    grid-template-columns:1fr 1fr;
  }

}


/* MOBILE */

@media (max-width:600px){

  .aoc-footer-newsletter-inner{
    padding:40px 20px;
  }

  .aoc-footer-main-inner{
    grid-template-columns:1fr;

    gap:28px;

    padding:35px 20px 28px;
  }

  .aoc-footer-bottom{
    width:calc(100% - 40px);

    align-items:flex-start;
    flex-direction:column;
  }

}
/* ==========================================================================
   FICHE RÉFÉRENCE — HEADER STRICTEMENT IDENTIQUE À LA HOME
   ========================================================================== */

.aoc-single-reference .aoc-header{
  position:sticky;
  top:0;
  z-index:100;

  width:100%;

  background:#FFFFFF !important;

  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;

  border-bottom:1px solid #C9C8BF;
}


/* ==========================================================================
   BARRE DE NAVIGATION
   Même comportement que .aoc-page .nav sur la home
   ========================================================================== */

.aoc-single-reference .nav{
  display:flex;
  align-items:center;
  justify-content:space-between;

  width:100%;
  max-width:none;

  margin:0;

  padding:16px 32px;
}


/* ==========================================================================
   MARQUE / LOGO
   ========================================================================== */

.aoc-single-reference .brand{
  display:flex;
  align-items:center;
  gap:12px;
}

.aoc-single-reference .aoc-logo-link{
  display:block;
  flex-shrink:0;
}

.aoc-single-reference .aoc-header-logo{
  width:60px !important;
  height:60px !important;
  max-width:60px !important;

  display:block;

  object-fit:cover;

  border-radius:50%;

  flex-shrink:0;
}


/* ==========================================================================
   NOM DE L'AGENCE
   ========================================================================== */

.aoc-single-reference .logo{
  font-family:'Archivo', sans-serif;

  font-weight:800;
  font-size:17px;

  letter-spacing:-.01em;
  line-height:1.1;

  color:#15120B;
}

.aoc-single-reference .logo small{
  display:block;

  font-family:'Chivo Mono', monospace;

  font-weight:400;
  font-size:11px;

  letter-spacing:.1em;

  color:#8B8A80;

  text-transform:uppercase;

  margin-top:2px;
}


/* ==========================================================================
   NAVIGATION
   ========================================================================== */

.aoc-single-reference .nav-links{
  display:flex;

  gap:30px;

  margin:0;

  font-family:'Archivo', sans-serif;

  font-size:14px;
  font-weight:500;
}

.aoc-single-reference .nav-links a{
  position:relative;

  padding-bottom:3px;

  color:#15120B;

  text-decoration:none;
}

.aoc-single-reference .nav-links a::after{
  content:"";

  position:absolute;

  left:0;
  bottom:0;

  width:0;
  height:2px;

  background:#7500CA;

  transition:width .2s ease;
}

.aoc-single-reference .nav-links a:hover::after,
.aoc-single-reference .nav-links a.active::after{
  width:100%;
}


/* ==========================================================================
   BOUTON CONTACT
   Même comportement que sur Accueil26
   ========================================================================== */

.aoc-single-reference .btn{
  font-family:'Chivo Mono', monospace;

  font-size:13px;
  font-weight:500;

  letter-spacing:.03em;

  text-transform:uppercase;

  padding:15px 28px;

  display:inline-flex;
  align-items:center;
  gap:10px;

  border:2px solid #FFFF5D;

  transition:
    transform .2s ease,
    background .2s ease,
    color .2s ease,
    border-color .2s ease;
}

.aoc-single-reference .btn-solid{
  background:#FFFF5D;
  color:#7500CA;

  border-color:#FFFF5D;
}

.aoc-single-reference .btn-solid:hover,
.aoc-single-reference .btn-solid:focus{
  background:#7500CA;
  color:#FFFF5D;

  border-color:#7500CA;
}


/* ==========================================================================
   ADMIN BAR WORDPRESS
   ========================================================================== */

.admin-bar .aoc-single-reference .aoc-header{
  top:32px;
}


/* ==========================================================================
   TABLETTE
   Même logique responsive que la home
   ========================================================================== */

@media (max-width:900px){

  .aoc-single-reference .nav-links{
    display:none;
  }

}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width:700px){

  .aoc-single-reference .nav{
    padding:12px 18px;
  }

  .aoc-single-reference .logo{
    display:none;
  }

  .aoc-single-reference .aoc-header-logo{
    width:50px !important;
    height:50px !important;
    max-width:50px !important;
  }

}


@media (max-width:600px){

  .admin-bar .aoc-single-reference .aoc-header{
    top:46px;
  }

}
/* =========================================================
   AOC — FOOTER
   ========================================================= */

.aoc-footer {
    background: #f2f0e5;
    color: var(--purple);
    width: 100%;
    font-family: "Archivo", sans-serif;
}


/* NEWSLETTER
--------------------------------------------------------- */

.footer-newsletter {
    max-width: 1180px;
    margin: 0 auto;
    padding: 70px 40px 60px;

    display: grid;
    grid-template-columns: 1fr 1.5fr;
    gap: 80px;
    align-items: end;
}

.footer-newsletter h4 {
    margin: 0 0 14px;
    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.footer-newsletter h3 {
    margin: 0 0 14px;
    font-family: "Archivo", sans-serif;
    font-size: clamp(28px, 2.5vw, 42px);
    line-height: 1;
    font-weight: 700;
    color: var(--purple);
}

.footer-newsletter p {
    margin: 0;
}


/* FORMULAIRE */

.aoc-newsletter-form label {
    display: block;
    margin-bottom: 10px;
    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.newsletter-fields {
    display: flex;
    width: 100%;
}

.newsletter-fields input {
    flex: 1;
    min-width: 0;
    padding: 16px 18px;
    border: 1px solid var(--purple);
    border-radius: 0;
    background: transparent;
    color: var(--purple);
    font: inherit;
}

.newsletter-fields button {
    padding: 16px 25px;
    border: 1px solid var(--purple);
    border-left: 0;
    border-radius: 0;
    background: #ffff5d;
    color: var(--purple);
    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    cursor: pointer;
}

.aoc-newsletter-form .newsletter-legal {
    margin-top: 10px;
    font-size: 11px;
    line-height: 1.45;
}


/* COLONNES
--------------------------------------------------------- */

.footer-grid {
    max-width: 1180px;
    margin: 0 auto;
    padding: 45px 40px;

    border-top: 1px solid rgba(70, 0, 130, .2);

    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr 1fr;
    gap: 60px;
}

.footer-grid h4 {
    margin: 0 0 18px;
    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.footer-grid p {
    margin: 0;
    max-width: 260px;
    font-size: 14px;
    line-height: 1.5;
}

.footer-grid a {
    display: block;
    width: fit-content;
    margin-bottom: 10px;

    color: var(--purple);
    font-size: 14px;
    text-decoration: none;
}

.footer-grid a:hover {
    text-decoration: underline;
}


/* BAS DU FOOTER
--------------------------------------------------------- */

.footer-bottom {
    max-width: 1180px;
    margin: 0 auto;
    padding: 20px 40px 28px;

    border-top: 1px solid rgba(70, 0, 130, .2);

    display: flex;
    justify-content: space-between;
    gap: 30px;

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: .04em;
}


/* MOBILE
--------------------------------------------------------- */

@media (max-width: 768px) {

    .footer-newsletter {
        grid-template-columns: 1fr;
        gap: 35px;
        padding: 50px 24px;
    }

    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 40px 25px;
        padding: 40px 24px;
    }

    .footer-bottom {
        padding: 20px 24px 25px;
        flex-direction: column;
        gap: 8px;
    }

}


@media (max-width: 520px) {

    .footer-grid {
        grid-template-columns: 1fr;
    }

    .newsletter-fields {
        flex-direction: column;
    }

    .newsletter-fields button {
        border-left: 1px solid var(--purple);
        border-top: 0;
    }

}
/* ==========================================================================
   FICHE RÉFÉRENCE — CTA FINAL
   ========================================================================== */

.aoc-single-reference .aoc-ref-cta{
  width:100%;
  min-height:0 !important;

  margin:0;
  padding:0;

  background:#7500CA;

  color:#FFFFFF;

  overflow:hidden;
}

.aoc-single-reference .aoc-ref-cta-inner{
  width:100%;
  max-width:900px;

  margin:0 auto;
  padding:80px 28px;

  text-align:center;
}

.aoc-single-reference .aoc-ref-cta-kicker{
  display:block;

  margin-bottom:14px;

  font-family:'Chivo Mono', monospace;
  font-size:10px;
  font-weight:500;

  color:#FFFF5D !important;

  text-transform:uppercase;
  letter-spacing:.1em;
}

.aoc-single-reference .aoc-ref-cta h2{
  display:block;

  margin:0 auto 30px;

  font-family:'Archivo', sans-serif;
  font-size:clamp(38px, 5vw, 60px);
  font-weight:800;

  line-height:1.03;

  color:#FFFFFF !important;
}

.aoc-single-reference .aoc-ref-cta a{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  padding:14px 22px;

  border:2px solid #FFFF5D;

  color:#FFFF5D !important;
  background:transparent;

  font-family:'Chivo Mono', monospace;
  font-size:10px;
  font-weight:500;

  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.05em;

  transition:
    background .2s ease,
    color .2s ease,
    transform .2s ease;
}

.aoc-single-reference .aoc-ref-cta a:hover{
  background:#FFFF5D;
  color:#7500CA !important;

  transform:translateY(-2px);
}


/* MOBILE */

@media (max-width:600px){

  .aoc-single-reference .aoc-ref-cta-inner{
    padding:60px 20px;
  }

  .aoc-single-reference .aoc-ref-cta h2{
    font-size:38px;
  }

}
/* Un peu plus de respiration entre CTA et footer */
.aoc-single-reference .aoc-ref-cta-inner{
  padding:72px 28px;
}

/* Footer : contenu légèrement plus large */
.aoc-single-reference .footer-newsletter,
.aoc-single-reference .footer-grid,
.aoc-single-reference .footer-bottom{
  max-width:1280px;
}
/* =========================================================
   RÉFÉRENCES — SUPPRESSION DES FILETS DANS LE CONTENU
   ========================================================= */

.aoc-single-reference .aoc-ref-content hr,
.aoc-single-reference .aoc-ref-content .wp-block-separator {
    display: none !important;
    border: 0 !important;
    margin: 0 !important;
}
/* =========================================================
   RÉFÉRENCES — ESPACEMENT FINAL TEXTE / BOUTON
   ========================================================= */

.aoc-single-reference .aoc-ref-project,
.aoc-single-reference .aoc-ref-project-content,
.aoc-single-reference .aoc-ref-content {
    min-height: 0 !important;
    height: auto !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* Supprime les espaces/blocs vides hérités des anciennes références */
.aoc-single-reference .aoc-ref-content p:empty,
.aoc-single-reference .aoc-ref-content .wp-block-spacer {
    display: none !important;
}

/* Supprime la marge après le dernier paragraphe */
.aoc-single-reference .aoc-ref-content > *:last-child,
.aoc-single-reference .aoc-ref-content p:last-child {
    margin-bottom: 0 !important;
}

/* Bouton site aligné avec le début du texte "Le client" */
.aoc-single-reference .aoc-ref-site {
    width: 75% !important;
    margin-left: 25% !important;
    margin-top: 20px !important;
    margin-bottom: 45px !important;
    padding-top: 0 !important;
    min-height: 0 !important;
}
/* =========================================================
   AOC — ARCHIVE ACTUS
   VERSION CONSOLIDÉE
   ========================================================= */


/* =========================================================
   VARIABLES
   ========================================================= */

.aoc-actus-archive {
    --purple: #7500CA;
    --purple-deep: #33066B;
    --yellow: #FFFF5D;
    --pink: #FF8FE3;
    --peach: #FFB894;
    --mint: #8EEFC4;
    --gray: #C9C8BF;
    --gray-dark: #8B8A80;
    --paper: #FFFFFF;
    --paper-2: #F3F1E6;
    --ink: #15120B;

    width: 100%;
    background: var(--paper);
    color: var(--ink);
}

.aoc-actus-archive * {
    box-sizing: border-box;
}


/* =========================================================
   FOND ÉCRU — TOUTE LA LARGEUR
   ========================================================= */

body.category-actus,
body.category-actus #page,
body.category-actus #page.site,
body.category-actus #content,
body.category-actus #primary,
body.category-actus #main,
body.category-actus .site-content,
body.category-actus .content-area,
body.category-actus .site-main,
body.category-actus article,
body.category-actus .inside-article {
    background: #FFFFFF !important;
}


/* Retire les limitations GeneratePress */

body.category-actus #page,
body.category-actus #page.site {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

body.category-actus #content,
body.category-actus .site-content,
body.category-actus #primary,
body.category-actus .content-area,
body.category-actus #main,
body.category-actus .site-main,
body.category-actus article,
body.category-actus .inside-article {
    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    padding-left: 0 !important;
    padding-right: 0 !important;
}


/* =========================================================
   SUPPRESSION HEADER / FOOTER GENERATEPRESS
   ========================================================= */

body.category-actus #masthead,
body.category-actus .site-header:not(.aoc-header),
body.category-actus #site-navigation,
body.category-actus .main-navigation {
    display: none !important;
}

body.category-actus .site-footer {
    display: none !important;
}


/* =========================================================
   HEADER AOC
   MÊME CALAGE QUE RÉFÉRENCES
   ========================================================= */

.aoc-actus-archive .aoc-header {
    position: sticky;
    top: 0;
    z-index: 100;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;

    background: var(--paper) !important;

    border-bottom: 1px solid var(--gray);
}


/* Même logique que Références :
   pleine largeur + 32 px de respiration */

.aoc-actus-archive .aoc-header .nav {
    display: flex;
    align-items: center;
    justify-content: space-between;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;

    padding: 16px 32px !important;
}


/* =========================================================
   IDENTITÉ
   ========================================================= */

.aoc-actus-archive .brand {
    display: flex;
    align-items: center;
    gap: 12px;
}

.aoc-actus-archive .aoc-logo-link {
    display: block;
    flex: 0 0 auto;
}

.aoc-actus-archive .aoc-header-logo {
    display: block;

    width: 60px !important;
    height: 60px !important;
    max-width: 60px !important;

    object-fit: cover;

    border-radius: 50%;
}

.aoc-actus-archive .logo {
    font-family: 'Archivo', sans-serif;

    font-size: 17px;
    font-weight: 800;

    line-height: 1.1;
    letter-spacing: -.01em;

    color: var(--ink);
}

.aoc-actus-archive .logo small {
    display: block;

    margin-top: 2px;

    font-family: 'Chivo Mono', monospace;

    font-size: 11px;
    font-weight: 400;

    line-height: 1.2;

    letter-spacing: .1em;
    text-transform: uppercase;

    color: var(--gray-dark);
}


/* =========================================================
   NAVIGATION HEADER
   ========================================================= */

.aoc-actus-archive .nav-links {
    display: flex;
    align-items: center;

    gap: 30px;

    margin: 0;
}

.aoc-actus-archive .nav-links a {
    position: relative;

    padding-bottom: 3px;

    font-family: 'Archivo', sans-serif;
    font-size: 14px;
    font-weight: 500;

    color: var(--ink);

    text-decoration: none;
}

.aoc-actus-archive .nav-links a::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 0;
    height: 2px;

    background: var(--purple);

    transition: width .2s ease;
}

.aoc-actus-archive .nav-links a:hover::after,
.aoc-actus-archive .nav-links a.active::after {
    width: 100%;
}


/* =========================================================
   BOUTON CONTACT HEADER
   ========================================================= */

.aoc-actus-archive .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 58px;

    padding: 0 28px;

    border: 0;
    border-radius: 0 !important;

    font-family: 'Chivo Mono', monospace;

    font-size: 11px;
    font-weight: 600;

    text-transform: uppercase;
    letter-spacing: .03em;

    text-decoration: none;

    transition:
        background .2s ease,
        color .2s ease;
}

.aoc-actus-archive .btn-solid {
    background: var(--yellow);
    color: var(--purple);
}

.aoc-actus-archive .btn-solid:hover {
    background: var(--purple);
    color: var(--yellow);
}


/* =========================================================
   CONTENEUR PRINCIPAL
   ========================================================= */

/*
 * 1050 px total :
 * 25 px + 1000 px + 25 px
 *
 * La grille fait donc exactement 1000 px.
 */

.aoc-actus-wrap {
    width: 100% !important;
    max-width: 1050px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    padding-left: 25px !important;
    padding-right: 25px !important;
}


/* =========================================================
   INTRO
   ========================================================= */

.aoc-actus-intro {
    padding-top: 40px;
    padding-bottom: 28px;
}

.aoc-actus-breadcrumb {
    margin: 0 0 24px;

    font-family: 'Chivo Mono', monospace;

    font-size: 11px;
    font-weight: 400;

    text-transform: uppercase;
    letter-spacing: .05em;

    color: var(--gray-dark);
}

.aoc-actus-breadcrumb a {
    color: inherit;
    text-decoration: none;
}

.aoc-actus-breadcrumb a:hover {
    color: var(--purple);
}

.aoc-actus-eyebrow {
    margin: 0 0 10px;

    font-family: 'Chivo Mono', monospace;

    font-size: 11px;
    font-weight: 500;

    text-transform: uppercase;
    letter-spacing: .08em;

    color: var(--purple);
}

.aoc-actus-intro h1 {
    margin: 0;

    font-family: 'Archivo', sans-serif;

    font-size: clamp(46px, 5.5vw, 74px);
    font-weight: 800;

    line-height: .95;
    letter-spacing: -.04em;

    color: var(--ink);
}

.aoc-actus-intro p {
    max-width: 680px;

    margin: 22px 0 0;

    font-family: 'Archivo', sans-serif;

    font-size: 17px;
    line-height: 1.55;

    color: #4A4738;
}


/* =========================================================
   FILTRES
   ========================================================= */

.aoc-actus-filters {
    margin-top: 6px;
    margin-bottom: 46px;
}

.aoc-actus-filter-list {
    display: flex;
    flex-wrap: wrap;

    gap: 10px;
}

.aoc-actus-filter {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 46px;

    padding: 0 22px;

    border: 1px solid var(--ink);
    border-radius: 0 !important;

    background: transparent;
    color: var(--ink);

    font-family: 'Chivo Mono', monospace;

    font-size: 11px;
    font-weight: 600;

    text-transform: uppercase;
    text-decoration: none;

    transition:
        background .2s ease,
        color .2s ease,
        border-color .2s ease;
}

.aoc-actus-filter:hover {
    background: var(--yellow);

    border-color: var(--yellow);

    color: var(--purple);
}

.aoc-actus-filter.is-active {
    background: var(--purple);

    border-color: var(--purple);

    color: var(--yellow);
}


/* =========================================================
   GRILLE ACTUS
   MÊME LARGEUR QUE LES ROUAGES RÉFÉRENCES
   ========================================================= */

.aoc-actus-grid-section {
    width: 100%;

    padding: 0 !important;
}

.aoc-actus-grid {
    display: grid;

    width: 100% !important;
    max-width: 1000px !important;

    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 80px !important;

    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 28px;
}


/* =========================================================
   CARTES
   ========================================================= */

.aoc-actu-card {
    display: flex;
    flex-direction: column;

    width: 100%;
    min-width: 0;

    overflow: hidden;

    background: var(--paper);
    color: var(--ink);

    border: 1px solid var(--gray);

    text-decoration: none;

    box-shadow: none !important;

    transition: transform .25s ease;
}

.aoc-actu-card:hover {
    transform: translateY(-4px);

    border-color: var(--gray) !important;

    box-shadow: none !important;
}


/* =========================================================
   IMAGE
   ========================================================= */

.aoc-actu-card-image {
    position: relative;

    width: 100%;

    aspect-ratio: 4 / 3;

    overflow: hidden;

    background: var(--paper-2);
}

.aoc-actu-card-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform .4s ease;
}

.aoc-actu-card:hover .aoc-actu-card-image img {
    transform: scale(1.035);
}

.aoc-actu-card-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    height: 100%;

    background: var(--yellow);
    color: var(--purple);

    font-family: 'Archivo', sans-serif;

    font-size: 40px;
    font-weight: 800;
}


/* =========================================================
   BADGES STATUT
   ========================================================= */

.aoc-actu-status {
    position: absolute;

    top: 14px;
    left: 14px;

    z-index: 2;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 9px 13px !important;

    border-radius: 0 !important;

    font-family: 'Chivo Mono', monospace;

    font-size: 10px;
    font-weight: 600;

    text-transform: uppercase;
    letter-spacing: .05em;
}

.aoc-actu-status-now {
    background: var(--mint);
    color: #4A3524;
}

.aoc-actu-status-soon {
    background: var(--yellow);
    color: var(--purple-deep);
}

.aoc-actu-status-past {
    background: var(--gray);
    color: var(--ink);
}


/* =========================================================
   CONTENU CARTES
   ========================================================= */

.aoc-actu-card-body {
    display: flex;
    flex-direction: column;

    flex: 1;

    padding: 20px 20px 22px;

    background: var(--paper);

    transition:
        background-color .25s ease,
        color .25s ease;
}

.aoc-actu-card-body h2 {
    margin: 0;

    font-family: 'Archivo', sans-serif;

    font-size: 20px;
    font-weight: 800;

    line-height: 1.18;
    letter-spacing: -.02em;

    color: var(--ink);
}

.aoc-actu-location {
    margin-top: 10px !important;

    font-family: 'Archivo', sans-serif !important;

    font-size: 13px !important;
    font-weight: 600 !important;

    line-height: 1.35 !important;

    color: #4A4738 !important;
}

.aoc-actu-dates {
    margin-top: auto !important;

    padding-top: 18px !important;

    font-family: 'Chivo Mono', monospace !important;

    font-size: 10.5px !important;
    font-weight: 500 !important;

    line-height: 1.4 !important;

    text-transform: uppercase !important;
    letter-spacing: .035em !important;

    color: var(--purple) !important;
}


/* =========================================================
   HOVERS — PALETTE AOC
   ========================================================= */


/* CARTE 1 — VIOLET */

.aoc-actu-card:nth-child(5n+1):hover .aoc-actu-card-body {
    background: var(--purple) !important;
}

.aoc-actu-card:nth-child(5n+1):hover h2,
.aoc-actu-card:nth-child(5n+1):hover .aoc-actu-location {
    color: #FFFFFF !important;
}

.aoc-actu-card:nth-child(5n+1):hover .aoc-actu-dates {
    color: var(--yellow) !important;
}


/* CARTE 2 — ROSE */

.aoc-actu-card:nth-child(5n+2):hover .aoc-actu-card-body {
    background: var(--pink) !important;
}


/* CARTE 3 — PÊCHE */

.aoc-actu-card:nth-child(5n+3):hover .aoc-actu-card-body {
    background: var(--peach) !important;
}


/* CARTE 4 — MENTHE */

.aoc-actu-card:nth-child(5n+4):hover .aoc-actu-card-body {
    background: var(--mint) !important;
}


/* CARTE 5 — JAUNE */

.aoc-actu-card:nth-child(5n+5):hover .aoc-actu-card-body {
    background: var(--yellow) !important;
}


/* TEXTE SUR COULEURS CLAIRES */

.aoc-actu-card:nth-child(5n+2):hover h2,
.aoc-actu-card:nth-child(5n+2):hover .aoc-actu-location,
.aoc-actu-card:nth-child(5n+2):hover .aoc-actu-dates,

.aoc-actu-card:nth-child(5n+3):hover h2,
.aoc-actu-card:nth-child(5n+3):hover .aoc-actu-location,
.aoc-actu-card:nth-child(5n+3):hover .aoc-actu-dates,

.aoc-actu-card:nth-child(5n+4):hover h2,
.aoc-actu-card:nth-child(5n+4):hover .aoc-actu-location,
.aoc-actu-card:nth-child(5n+4):hover .aoc-actu-dates,

.aoc-actu-card:nth-child(5n+5):hover h2,
.aoc-actu-card:nth-child(5n+5):hover .aoc-actu-location,
.aoc-actu-card:nth-child(5n+5):hover .aoc-actu-dates {
    color: var(--purple-deep) !important;
}


/* =========================================================
   PAGINATION
   ========================================================= */

.aoc-actus-pagination {
    display: flex !important;
    align-items: center;
    justify-content: center;

    flex-wrap: wrap;

    gap: 8px;

    width: 100%;
    max-width: 1000px;

    margin: 0 auto;

    padding: 0 0 55px !important;
}

.aoc-actus-pagination a {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    min-width: 38px;
    height: 38px;

    margin: 0 !important;

    padding: 0 11px !important;

    border: 1px solid var(--purple);
    border-radius: 0 !important;

    background: var(--paper);

    color: var(--purple) !important;

    font-family: 'Chivo Mono', monospace;

    font-size: 10px;
    font-weight: 500;

    text-decoration: none !important;

    transition:
        background .2s ease,
        color .2s ease;
}

.aoc-actus-pagination a:hover {
    background: var(--yellow);

    color: var(--purple) !important;
}

.aoc-actus-pagination a.is-active {
    background: var(--purple);

    color: var(--yellow) !important;
}


/* =========================================================
   ÉTAT VIDE
   ========================================================= */

.aoc-actus-empty {
    padding: 50px 0 80px;

    font-family: 'Chivo Mono', monospace;

    font-size: 12px;

    text-transform: uppercase;

    color: var(--gray-dark);
}


/* =========================================================
   CTA VIOLET — PLEINE LARGEUR
   ========================================================= */

.aoc-actus-archive .aoc-ref-cta {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    background: var(--purple);
}

.aoc-actus-archive .aoc-ref-cta-inner {
    width: 100%;
    max-width: 900px;

    margin: 0 auto;

    padding: 65px 28px !important;

    text-align: center;
}

.aoc-actus-archive .aoc-ref-cta-kicker {
    display: block;

    margin-bottom: 12px;

    color: var(--yellow) !important;

    font-family: 'Chivo Mono', monospace;

    font-size: 10px;
    font-weight: 500;

    text-transform: uppercase;
    letter-spacing: .1em;
}

.aoc-actus-archive .aoc-ref-cta h2 {
    margin: 0 auto 26px !important;

    color: #FFFFFF !important;

    font-family: 'Archivo', sans-serif;

    font-size: clamp(36px, 4.5vw, 56px);
    font-weight: 800;

    line-height: 1.03;
}


/* =========================================================
   BOUTON CTA
   ========================================================= */

.aoc-actus-archive .aoc-ref-cta a {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 14px 22px;

    border: 2px solid var(--yellow);
    border-radius: 0 !important;

    background: var(--yellow);

    color: var(--purple) !important;

    font-family: 'Chivo Mono', monospace;

    font-size: 10px;
    font-weight: 600;

    text-transform: uppercase;
    letter-spacing: .05em;

    text-decoration: none;

    transition:
        background .2s ease,
        color .2s ease;
}

.aoc-actus-archive .aoc-ref-cta a:hover {
    background: var(--purple);

    color: var(--yellow) !important;
}


/* =========================================================
   ADMIN WORDPRESS
   ========================================================= */

.admin-bar .aoc-actus-archive .aoc-header {
    top: 32px;
}


/* =========================================================
   TABLETTE
   ========================================================= */

@media (max-width: 980px) {

    .aoc-actus-wrap {
        padding-left: 24px !important;
        padding-right: 24px !important;
    }

    .aoc-actus-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .aoc-actus-archive .nav-links {
        display: none;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 640px) {

    .aoc-actus-wrap {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    .aoc-actus-grid {
        grid-template-columns: 1fr;

        gap: 22px;

        margin-bottom: 55px !important;
    }

    .aoc-actus-intro {
        padding-top: 30px;
    }

    .aoc-actus-intro h1 {
        font-size: 46px;
    }

    .aoc-actus-archive .aoc-header .nav {
        padding: 12px 18px !important;
    }

    .aoc-actus-archive .logo {
        display: none;
    }

    .aoc-actus-archive .aoc-header-logo {
        width: 50px !important;
        height: 50px !important;
        max-width: 50px !important;
    }

    .aoc-actus-archive .btn {
        min-height: 50px;

        padding: 0 18px;

        font-size: 10px;
    }

    .aoc-actus-filter {
        min-height: 42px;

        padding: 0 15px;

        font-size: 10px;
    }

    .aoc-actus-pagination {
        padding-bottom: 40px !important;
    }

    .aoc-actus-archive .aoc-ref-cta-inner {
        padding: 52px 20px !important;
    }
}

/* =========================================================
   AOC — SINGLE ACTU — VERSION PROPRE / CALAGE CORRIGÉ
   ========================================================= */

.aoc-single-actu {
    --purple: #7500CA;
    --purple-deep: #33066B;
    --yellow: #FFFF5D;
    --pink: #FF8FE3;
    --peach: #FFB894;
    --mint: #8EEFC4;
    --gray: #C9C8BF;
    --gray-dark: #8B8A80;
    --paper: #FFFFFF;
    --paper-2: #F3F1E6;
    --ink: #15120B;
    --brown: #4A3524;

    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    background: var(--paper);
    color: var(--ink);
    font-family: 'Archivo', sans-serif;
}

.aoc-single-actu *,
.aoc-single-actu *::before,
.aoc-single-actu *::after {
    box-sizing: border-box;
}

.aoc-single-actu img {
    display: block;
    max-width: 100%;
}

.aoc-single-actu a {
    color: inherit;
}

/* WordPress / GeneratePress */
body:has(.aoc-single-actu),
body:has(.aoc-single-actu) #page,
body:has(.aoc-single-actu) #content,
body:has(.aoc-single-actu) #primary,
body:has(.aoc-single-actu) #main,
body:has(.aoc-single-actu) .site-content,
body:has(.aoc-single-actu) .content-area,
body:has(.aoc-single-actu) .site-main,
body:has(.aoc-single-actu) article,
body:has(.aoc-single-actu) .inside-article,
body:has(.aoc-single-actu) .entry-content {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: var(--paper) !important;
}

body:has(.aoc-single-actu) #masthead,
body:has(.aoc-single-actu) .site-header:not(.aoc-header),
body:has(.aoc-single-actu) #site-navigation,
body:has(.aoc-single-actu) .main-navigation,
body:has(.aoc-single-actu) .site-footer {
    display: none !important;
}

/* Header */
.aoc-single-actu .aoc-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    width: 100%;
    margin: 0;
    background: var(--paper);
    border-bottom: 1px solid var(--gray);
}

.admin-bar .aoc-single-actu .aoc-header {
    top: 32px;
}

.aoc-single-actu .aoc-header .nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin: 0;
    padding: 16px 32px;
}

.aoc-single-actu .brand {
    display: flex;
    align-items: center;
    gap: 12px;
}

.aoc-single-actu .aoc-logo-link {
    display: block;
    flex-shrink: 0;
}

.aoc-single-actu .aoc-header-logo {
    width: 60px !important;
    height: 60px !important;
    max-width: 60px !important;
    object-fit: cover;
    border-radius: 50%;
}

.aoc-single-actu .logo {
    font-size: 17px;
    font-weight: 800;
    line-height: 1.1;
    color: var(--ink);
}

.aoc-single-actu .logo small {
    display: block;
    margin-top: 2px;
    font-family: 'Chivo Mono', monospace;
    font-size: 11px;
    font-weight: 400;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--gray-dark);
}

.aoc-single-actu .nav-links {
    display: flex;
    align-items: center;
    gap: 30px;
}

.aoc-single-actu .nav-links a {
    position: relative;
    padding-bottom: 3px;
    font-size: 14px;
    font-weight: 500;
    color: var(--ink);
    text-decoration: none;
}

.aoc-single-actu .nav-links a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 2px;
    background: var(--purple);
    transition: width .2s ease;
}

.aoc-single-actu .nav-links a:hover::after,
.aoc-single-actu .nav-links a.active::after {
    width: 100%;
}

.aoc-single-actu .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 58px;
    padding: 0 28px;
    border: 0;
    border-radius: 0;
    font-family: 'Chivo Mono', monospace;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    text-decoration: none;
}

.aoc-single-actu .btn-solid {
    background: var(--yellow);
    color: var(--purple);
}

.aoc-single-actu .btn-solid:hover {
    background: var(--purple);
    color: var(--yellow);
}

/* Page et layout — le PHP utilise directement .aoc-actu-page > .aoc-actu-layout */
.aoc-single-actu .aoc-actu-page {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    background: var(--paper);
}

.aoc-single-actu .aoc-actu-layout {
    display: grid;
    grid-template-columns: minmax(0, 700px) 280px;
    gap: 60px;
    width: 100%;
    max-width: 1040px;
    margin: 0 auto;
    padding: 44px 20px 80px;
    align-items: start;
}

.aoc-single-actu .aoc-actu-main {
    width: 100%;
    max-width: 700px;
    min-width: 0;
}

/* Fil d'Ariane */
.aoc-single-actu .aoc-actu-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 24px;
    font-family: 'Chivo Mono', monospace;
    font-size: 10px;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--gray-dark);
}

.aoc-single-actu .aoc-actu-breadcrumb a {
    color: inherit;
    text-decoration: none;
}

.aoc-single-actu .aoc-actu-breadcrumb a:hover {
    color: var(--purple);
}

/* Statut */
.aoc-single-actu .aoc-actu-status,
.aoc-single-actu .aoc-actu-single-status {
    display: inline-flex;
    align-items: center;
    margin-bottom: 16px;
    padding: 8px 13px;
    border-radius: 0;
    font-family: 'Chivo Mono', monospace;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.aoc-single-actu .aoc-actu-status-now,
.aoc-single-actu .aoc-actu-single-status-now {
    background: var(--mint);
    color: var(--brown);
}

.aoc-single-actu .aoc-actu-status-soon,
.aoc-single-actu .aoc-actu-single-status-soon {
    background: var(--yellow);
    color: var(--purple-deep);
}

.aoc-single-actu .aoc-actu-status-past,
.aoc-single-actu .aoc-actu-single-status-past {
    background: var(--gray);
    color: var(--ink);
}

/* Titre */
.aoc-single-actu .aoc-actu-title {
    display: block;
    width: 100%;
    max-width: 700px;
    min-width: 0;
    margin: 0;
    overflow: visible;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    font-family: 'Archivo', sans-serif;
    font-size: clamp(38px, 4.2vw, 56px);
    font-weight: 800;
    line-height: 1.02;
    letter-spacing: -.035em;
    color: var(--ink);
}

.aoc-single-actu .aoc-actu-title.is-long-title {
    font-size: clamp(36px, 3.8vw, 52px);
}

.aoc-single-actu .aoc-actu-place,
.aoc-single-actu .aoc-actu-subtitle {
    margin-top: 14px;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
    color: #4A4738;
}

/* Galerie */
.aoc-single-actu .aoc-actu-hero {
    width: 100%;
    margin: 32px 0 38px;
}

.aoc-single-actu .aoc-actu-image,
.aoc-single-actu .aoc-actu-gallery-image,
.aoc-single-actu .aoc-actu-gallery img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto !important;
    object-fit: contain !important;
    border: 0;
}

.aoc-single-actu .aoc-actu-gallery {
    display: grid;
    width: 100%;
    gap: 14px;
    margin: 38px 0 42px;
    align-items: start;
}

.aoc-single-actu .aoc-actu-gallery-count-1 { grid-template-columns: 1fr; }
.aoc-single-actu .aoc-actu-gallery-count-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.aoc-single-actu .aoc-actu-gallery-count-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.aoc-single-actu .aoc-actu-gallery-count-4,
.aoc-single-actu .aoc-actu-gallery-count-5,
.aoc-single-actu .aoc-actu-gallery-count-6,
.aoc-single-actu .aoc-actu-gallery-count-7,
.aoc-single-actu .aoc-actu-gallery-count-8,
.aoc-single-actu .aoc-actu-gallery-count-9,
.aoc-single-actu .aoc-actu-gallery-count-10 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* Contenu éditorial */
.aoc-single-actu .aoc-actu-content {
    max-width: 680px;
    margin-top: 24px;
    margin-bottom: 0;
}

.aoc-single-actu .aoc-actu-content > *:first-child { margin-top: 0; }

.aoc-single-actu .aoc-actu-content p {
    margin: 0 0 18px;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.72;
    color: #3A382C;
}

.aoc-single-actu .aoc-actu-content h2,
.aoc-single-actu .aoc-actu-content h3,
.aoc-single-actu .aoc-actu-content h4 {
    margin-top: 34px;
    margin-bottom: 12px;
    font-weight: 800;
    line-height: 1.2;
    color: var(--ink);
}

.aoc-single-actu .aoc-actu-content h2 { font-size: 25px; }
.aoc-single-actu .aoc-actu-content h3 { font-size: 18px; }
.aoc-single-actu .aoc-actu-content h4 { font-size: 16px; }

.aoc-single-actu .aoc-actu-content ul,
.aoc-single-actu .aoc-actu-content ol {
    margin: 18px 0 22px 22px;
}

.aoc-single-actu .aoc-actu-content li {
    margin-bottom: 8px;
    font-size: 16px;
    line-height: 1.6;
}

.aoc-single-actu .aoc-actu-content a {
    color: var(--purple);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.aoc-single-actu .aoc-actu-content hr,
.aoc-single-actu .aoc-actu-content .wp-block-separator {
    display: none !important;
}

/* Liens */
.aoc-single-actu .aoc-actu-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}

.aoc-single-actu .aoc-actu-link-button,
.aoc-single-actu .aoc-actu-site-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 50px;
    padding: 0 18px;
    border-radius: 0;
    font-family: 'Chivo Mono', monospace;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    text-decoration: none;
}

.aoc-single-actu .aoc-actu-link-primary,
.aoc-single-actu .aoc-actu-site-button {
    border: 1px solid var(--purple);
    background: var(--yellow);
    color: var(--purple);
}

.aoc-single-actu .aoc-actu-link-primary:hover,
.aoc-single-actu .aoc-actu-site-button:hover {
    background: var(--purple);
    color: var(--yellow);
}

.aoc-single-actu .aoc-actu-link-secondary {
    border: 1px solid var(--purple);
    background: var(--paper);
    color: var(--purple);
}

.aoc-single-actu .aoc-actu-link-secondary:hover {
    background: var(--peach);
    color: var(--purple-deep);
}

/* Sidebar */
.aoc-single-actu .aoc-actu-sidebar {
    position: sticky;
    top: 105px;
    width: 280px;
    min-width: 0;
    align-self: start;
    margin: 0;
    padding: 0;
}

.aoc-single-actu .aoc-actu-info-card {
    margin: 0;
    padding: 30px 28px;
    background: var(--peach);
    color: var(--purple-deep);
}

.aoc-single-actu .aoc-actu-info-eyebrow {
    margin-bottom: 24px;
    font-family: 'Chivo Mono', monospace;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--purple);
}

.aoc-single-actu .aoc-actu-info-item + .aoc-actu-info-item,
.aoc-single-actu .aoc-actu-info-row + .aoc-actu-info-row {
    margin-top: 22px;
}

.aoc-single-actu .aoc-actu-info-label {
    margin-bottom: 5px;
    font-family: 'Chivo Mono', monospace;
    font-size: 10px;
    font-weight: 500;
    line-height: 1.3;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--purple);
    opacity: .75;
}

.aoc-single-actu .aoc-actu-info-value {
    font-size: 15px;
    font-weight: 650;
    line-height: 1.4;
    color: var(--purple-deep);
}

.aoc-single-actu .aoc-actu-other {
    margin-top: 18px;
    padding-left: 20px;
    border-left: 1px solid var(--ink);
}

.aoc-single-actu .aoc-actu-other-heading {
    margin-bottom: 18px;
    font-family: 'Chivo Mono', monospace;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--gray-dark);
}

.aoc-single-actu .aoc-actu-other-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 0;
    color: var(--ink);
    text-decoration: none;
}

.aoc-single-actu .aoc-actu-other-thumb {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 62px;
    height: 62px;
    flex: 0 0 62px;
    overflow: hidden;
    background: var(--yellow);
    color: var(--purple);
    font-size: 10px;
    font-weight: 800;
}

.aoc-single-actu .aoc-actu-other-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.aoc-single-actu .aoc-actu-other-copy { min-width: 0; }

.aoc-single-actu .aoc-actu-other-copy strong {
    display: block;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.28;
}

.aoc-single-actu .aoc-actu-other-copy span {
    display: block;
    margin-top: 5px;
    font-family: 'Chivo Mono', monospace;
    font-size: 10.5px;
    line-height: 1.3;
    color: var(--gray-dark);
}

.aoc-single-actu .aoc-actu-other-item:hover strong { color: var(--purple); }

.aoc-single-actu .aoc-actu-other-all {
    display: inline-block;
    margin-top: 16px;
    font-family: 'Chivo Mono', monospace;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.3;
    text-transform: uppercase;
    color: var(--purple);
    text-decoration: none;
}

/* CTA */
.aoc-single-actu .aoc-ref-cta,
.aoc-single-actu .aoc-project-cta {
    width: 100%;
    margin: 0;
    padding: 0;
    background: var(--purple);
}

.aoc-single-actu .aoc-ref-cta-inner,
.aoc-single-actu .aoc-project-cta-inner {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    padding: 65px 28px;
    text-align: center;
}

.aoc-single-actu .aoc-ref-cta-kicker,
.aoc-single-actu .aoc-project-eyebrow {
    display: block;
    margin-bottom: 12px;
    font-family: 'Chivo Mono', monospace;
    font-size: 10px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--yellow);
}

.aoc-single-actu .aoc-ref-cta h2,
.aoc-single-actu .aoc-project-cta h2 {
    margin: 0 0 26px;
    font-size: clamp(36px, 4.5vw, 56px);
    font-weight: 800;
    line-height: 1.03;
    color: #FFF;
}

.aoc-single-actu .aoc-ref-cta a,
.aoc-single-actu .aoc-project-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 20px;
    border: 2px solid var(--yellow);
    background: var(--yellow);
    color: var(--purple);
    font-family: 'Chivo Mono', monospace;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    text-decoration: none;
}

.aoc-single-actu .aoc-ref-cta a:hover,
.aoc-single-actu .aoc-project-button:hover {
    background: var(--purple);
    color: var(--yellow);
}

/* Tablette */
@media (min-width: 641px) and (max-width: 980px) {
    .aoc-single-actu .nav-links { display: none; }

    .aoc-single-actu .aoc-actu-layout {
        display: block;
        width: 100%;
        max-width: 780px;
        margin: 0 auto;
        padding: 36px 24px 65px;
    }

    .aoc-single-actu .aoc-actu-main {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .aoc-single-actu .aoc-actu-title,
    .aoc-single-actu .aoc-actu-title.is-long-title {
        width: 100%;
        max-width: 100%;
        font-size: 42px;
        line-height: 1.03;
    }

    .aoc-single-actu .aoc-actu-sidebar {
        position: static;
        width: 100%;
        margin-top: 45px;
    }

    .aoc-single-actu .aoc-actu-gallery-count-3,
    .aoc-single-actu .aoc-actu-gallery-count-4,
    .aoc-single-actu .aoc-actu-gallery-count-5,
    .aoc-single-actu .aoc-actu-gallery-count-6,
    .aoc-single-actu .aoc-actu-gallery-count-7,
    .aoc-single-actu .aoc-actu-gallery-count-8,
    .aoc-single-actu .aoc-actu-gallery-count-9,
    .aoc-single-actu .aoc-actu-gallery-count-10 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Mobile */
@media (max-width: 640px) {
    .aoc-single-actu .aoc-header .nav { padding: 12px 18px !important; }
    .aoc-single-actu .logo { display: none; }
    .aoc-single-actu .nav-links { display: none; }

    .aoc-single-actu .aoc-header-logo {
        width: 50px !important;
        height: 50px !important;
        max-width: 50px !important;
    }

    .aoc-single-actu .btn {
        min-height: 50px;
        padding: 0 17px;
        font-size: 10px;
    }

    .aoc-single-actu .aoc-actu-layout {
        display: block;
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 30px 20px 55px;
        overflow: visible;
    }

    .aoc-single-actu .aoc-actu-main {
        display: block;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow: visible;
    }

    .aoc-single-actu .aoc-actu-title {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        font-size: 32px !important;
        line-height: 1.06 !important;
        letter-spacing: -.025em !important;
    }

    .aoc-single-actu .aoc-actu-title.is-long-title {
        font-size: 27px !important;
        line-height: 1.08 !important;
    }

    .aoc-single-actu .aoc-actu-gallery,
    .aoc-single-actu .aoc-actu-gallery-count-2,
    .aoc-single-actu .aoc-actu-gallery-count-3,
    .aoc-single-actu .aoc-actu-gallery-count-4,
    .aoc-single-actu .aoc-actu-gallery-count-5,
    .aoc-single-actu .aoc-actu-gallery-count-6,
    .aoc-single-actu .aoc-actu-gallery-count-7,
    .aoc-single-actu .aoc-actu-gallery-count-8,
    .aoc-single-actu .aoc-actu-gallery-count-9,
    .aoc-single-actu .aoc-actu-gallery-count-10 {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .aoc-single-actu .aoc-actu-content p { font-size: 15px; }

    .aoc-single-actu .aoc-actu-links {
        flex-direction: column;
        align-items: stretch;
    }

    .aoc-single-actu .aoc-actu-link-button,
    .aoc-single-actu .aoc-actu-site-button { width: 100%; }

    .aoc-single-actu .aoc-actu-sidebar {
        position: static;
        width: 100%;
        margin-top: 42px;
    }

    .aoc-single-actu .aoc-ref-cta-inner,
    .aoc-single-actu .aoc-project-cta-inner { padding: 52px 20px; }
}

@media (max-width: 782px) {
    .admin-bar .aoc-single-actu .aoc-header { top: 46px; }
}


/* =========================================================
   AOC — PAGE CONTACT
   ========================================================= */

.aoc-contact-page {
    --purple: #7500CA;
    --purple-deep: #33066B;
    --yellow: #FFFF5D;
    --pink: #FF8FE3;
    --peach: #FFB894;
    --mint: #8EEFC4;
    --gray: #C9C8BF;
    --gray-dark: #8B8A80;
    --paper: #FFFFFF;
    --paper-2: #F3F1E6;
    --ink: #15120B;

    width: 100%;
    max-width: none;

    background: var(--paper);
    color: var(--ink);
}

.aoc-contact-page * {
    box-sizing: border-box;
}


/* =========================================================
   FOND ÉCRU PLEINE LARGEUR + RESET GENERATEPRESS
   ========================================================= */

body.page-template-page-contact,
body.page-template-page-contact #page,
body.page-template-page-contact #content,
body.page-template-page-contact #primary,
body.page-template-page-contact #main,
body.page-template-page-contact .site-content,
body.page-template-page-contact .content-area,
body.page-template-page-contact .site-main,
body.page-template-page-contact .inside-article {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;

    padding-left: 0 !important;
    padding-right: 0 !important;

    background: var(--paper) !important;
}


/* =========================================================
   MASQUE HEADER / FOOTER GENERATEPRESS NATIFS
   ========================================================= */

body.page-template-page-contact #masthead,
body.page-template-page-contact .site-header:not(.aoc-header),
body.page-template-page-contact #site-navigation,
body.page-template-page-contact .main-navigation,
body.page-template-page-contact .site-footer {
    display: none !important;
}


/* =========================================================
   HEADER AOC — MÊME LOGIQUE QUE RÉFÉRENCES / ACTUS
   ========================================================= */

.aoc-contact-page .aoc-header {
    position: sticky;
    top: 0;
    z-index: 1000;

    width: 100%;

    background: var(--paper);

    border-bottom: 1px solid var(--gray);
}

.aoc-contact-page .aoc-header .nav {
    display: flex;
    align-items: center;
    justify-content: space-between;

    width: 100%;
    max-width: none;

    margin: 0;

    padding: 16px 32px;
}

.aoc-contact-page .brand {
    display: flex;
    align-items: center;

    gap: 12px;
}

.aoc-contact-page .aoc-logo-link {
    display: block;
    flex-shrink: 0;
}

.aoc-contact-page .aoc-header-logo {
    display: block;

    width: 60px !important;
    height: 60px !important;
    max-width: 60px !important;

    object-fit: cover;

    border-radius: 50%;
}

.aoc-contact-page .logo {
    font-family: 'Archivo', sans-serif;

    font-size: 17px;
    font-weight: 800;

    line-height: 1.1;

    color: var(--ink);
}

.aoc-contact-page .logo small {
    display: block;

    margin-top: 2px;

    font-family: 'Chivo Mono', monospace;

    font-size: 11px;
    font-weight: 400;

    letter-spacing: .1em;
    text-transform: uppercase;

    color: var(--gray-dark);
}


/* =========================================================
   NAVIGATION
   ========================================================= */

.aoc-contact-page .nav-links {
    display: flex;
    align-items: center;

    gap: 30px;
}

.aoc-contact-page .nav-links a {
    position: relative;

    padding-bottom: 3px;

    font-family: 'Archivo', sans-serif;

    font-size: 14px;
    font-weight: 500;

    color: var(--ink);

    text-decoration: none;
}

.aoc-contact-page .nav-links a::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 0;
    height: 2px;

    background: var(--purple);

    transition: width .2s ease;
}

.aoc-contact-page .nav-links a:hover::after {
    width: 100%;
}


/* =========================================================
   BOUTON CONTACT HEADER
   ========================================================= */

.aoc-contact-page .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 58px;

    padding: 0 28px;

    border: 0;
    border-radius: 0;

    font-family: 'Chivo Mono', monospace;

    font-size: 11px;
    font-weight: 600;

    text-transform: uppercase;

    text-decoration: none;
}

.aoc-contact-page .btn-solid {
    background: var(--purple);
    color: var(--yellow);
}

.aoc-contact-page .btn-solid:hover {
    background: var(--yellow);
    color: var(--purple);
}


/* =========================================================
   CONTENU PRINCIPAL
   ========================================================= */

.aoc-contact-main {
    width: 100%;

    padding: 70px 0 90px;

    background: var(--paper);
}

.aoc-contact-grid {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(420px, 520px);

    gap: 70px;

    width: 100%;
    max-width: 1050px;

    margin: 0 auto;

    padding: 0 25px;

    align-items: start;
}


/* =========================================================
   COLONNE GAUCHE
   ========================================================= */

.aoc-contact-intro {
    min-width: 0;
}

.aoc-contact-eyebrow {
    margin-bottom: 14px;

    font-family: 'Chivo Mono', monospace;

    font-size: 11px;
    font-weight: 600;

    text-transform: uppercase;
    letter-spacing: .08em;

    color: var(--purple);
}

.aoc-contact-intro h1 {
    max-width: 520px;

    margin: 0;

    font-family: 'Archivo', sans-serif;

    font-size: clamp(42px, 5vw, 64px);
    font-weight: 800;

    line-height: 1.02;
    letter-spacing: -.035em;

    color: var(--ink);
}

.aoc-contact-lead {
    max-width: 480px;

    margin: 22px 0 0;

    font-family: 'Archivo', sans-serif;

    font-size: 17px;
    font-weight: 500;

    line-height: 1.6;

    color: #4A4738;
}


/* =========================================================
   COORDONNÉES
   ========================================================= */

.aoc-contact-info-list {
    display: flex;
    flex-direction: column;

    gap: 24px;

    margin-top: 46px;
}

.aoc-contact-info-label {
    margin-bottom: 4px;

    font-family: 'Chivo Mono', monospace;

    font-size: 10px;
    font-weight: 500;

    text-transform: uppercase;
    letter-spacing: .07em;

    color: var(--gray-dark);
}

.aoc-contact-info-value {
    font-family: 'Archivo', sans-serif;

    font-size: 18px;
    font-weight: 700;

    line-height: 1.35;

    color: var(--ink);
}

.aoc-contact-info-value a {
    color: inherit;

    text-decoration: none;
}

.aoc-contact-info-value a:hover {
    color: var(--purple);
}


/* =========================================================
   RÉSEAUX SOCIAUX
   ========================================================= */

.aoc-contact-socials {
    display: flex;
    flex-wrap: wrap;

    gap: 10px;

    margin-top: 38px;
}

.aoc-contact-socials a {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 40px;

    padding: 0 14px;

    border: 1px solid var(--ink);
    border-radius: 0;

    background: transparent;

    font-family: 'Chivo Mono', monospace;

    font-size: 10px;
    font-weight: 600;

    text-transform: uppercase;

    color: var(--ink);

    text-decoration: none;

    transition:
        background .2s ease,
        color .2s ease,
        border-color .2s ease;
}

.aoc-contact-socials a:hover {
    background: var(--yellow);

    border-color: var(--purple);

    color: var(--purple);
}


/* =========================================================
   CARTE FORMULAIRE
   ========================================================= */

.aoc-contact-form-card {
    padding: 38px;

    background: var(--purple-deep);

    color: #FFFFFF;
}

.aoc-contact-form-eyebrow {
    margin-bottom: 10px;

    font-family: 'Chivo Mono', monospace;

    font-size: 10px;
    font-weight: 600;

    text-transform: uppercase;
    letter-spacing: .08em;

    color: var(--yellow);
}

.aoc-contact-form-card h2 {
    margin: 0 0 28px;

    font-family: 'Archivo', sans-serif;

    font-size: 28px;
    font-weight: 800;

    line-height: 1.15;

    color: #FFFFFF;
}


/* =========================================================
   CONTACT FORM 7
   ========================================================= */

.aoc-contact-form-wrapper .wpcf7 {
    margin: 0;
}

.aoc-contact-form-wrapper .wpcf7-form {
    margin: 0;
}

.aoc-contact-form-wrapper p {
    margin: 0 0 20px;
}

.aoc-contact-form-wrapper label {
    display: block;

    margin-bottom: 7px;

    font-family: 'Chivo Mono', monospace;

    font-size: 10px;
    font-weight: 500;

    text-transform: uppercase;
    letter-spacing: .06em;

    color: #C8BCE6;
}


/* =========================================================
   CHAMPS CF7
   ========================================================= */

.aoc-contact-form-wrapper input[type="text"],
.aoc-contact-form-wrapper input[type="email"],
.aoc-contact-form-wrapper input[type="tel"],
.aoc-contact-form-wrapper input[type="url"],
.aoc-contact-form-wrapper select,
.aoc-contact-form-wrapper textarea {
    width: 100%;

    min-height: 48px;

    padding: 12px 14px;

    border: 1px solid #5E3A92;
    border-radius: 0;

    outline: none;

    background: #4A167E;

    color: #FFFFFF;

    font-family: 'Archivo', sans-serif;

    font-size: 14px;
    font-weight: 500;

    line-height: 1.4;

    transition:
        border-color .2s ease,
        background .2s ease;
}

.aoc-contact-form-wrapper textarea {
    min-height: 130px;

    resize: vertical;
}

.aoc-contact-form-wrapper select {
    cursor: pointer;
}

.aoc-contact-form-wrapper input::placeholder,
.aoc-contact-form-wrapper textarea::placeholder {
    color: #C9BEE2;

    opacity: .8;
}


/* Focus accessible */

.aoc-contact-form-wrapper input:focus,
.aoc-contact-form-wrapper select:focus,
.aoc-contact-form-wrapper textarea:focus {
    border-color: var(--yellow);

    background: #3F0F6E;
}


/* =========================================================
   BOUTON ENVOYER CF7
   ========================================================= */

.aoc-contact-form-wrapper input[type="submit"],
.aoc-contact-form-wrapper button[type="submit"] {
    width: 100%;

    min-height: 52px;

    margin-top: 6px;

    padding: 0 18px;

    border: 0;
    border-radius: 0;

    background: var(--yellow);

    color: var(--purple-deep);

    font-family: 'Chivo Mono', monospace;

    font-size: 11px;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: .04em;

    cursor: pointer;

    transition:
        background .2s ease,
        color .2s ease;
}

.aoc-contact-form-wrapper input[type="submit"]:hover,
.aoc-contact-form-wrapper button[type="submit"]:hover {
    background: #FFFFFF;

    color: var(--purple);
}


/* =========================================================
   CONTACT FORM 7 — MESSAGES / ERREURS
   ========================================================= */

.aoc-contact-form-wrapper .wpcf7-not-valid-tip {
    margin-top: 5px;

    font-family: 'Chivo Mono', monospace;

    font-size: 9px;

    color: var(--yellow);
}

.aoc-contact-form-wrapper .wpcf7-response-output {
    margin: 18px 0 0 !important;

    padding: 12px 14px !important;

    border: 1px solid var(--yellow) !important;

    font-family: 'Chivo Mono', monospace;

    font-size: 10px;
    line-height: 1.45;

    color: #FFFFFF;
}

.aoc-contact-form-wrapper .wpcf7-spinner {
    margin-top: 10px;
}


/* =========================================================
   FOOTER COMMUN
   ========================================================= */

.aoc-contact-page .aoc-footer {
    width: 100%;

    margin: 0;

    background: var(--paper-2);

    color: var(--purple);
}


/* =========================================================
   NEWSLETTER FOOTER
   ========================================================= */

.aoc-contact-page .footer-newsletter {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1.15fr);

    gap: 70px;

    width: calc(100% - 56px);
    max-width: 1040px;

    margin: 0 auto;

    padding: 58px 0 52px;

    border-bottom: 1px solid var(--gray);
}

.aoc-contact-page .footer-newsletter-text h4 {
    margin: 0 0 9px;

    font-family: 'Chivo Mono', monospace;

    font-size: 10px;
    font-weight: 600;

    text-transform: uppercase;
    letter-spacing: .08em;

    color: var(--purple);
}

.aoc-contact-page .footer-newsletter-text h3 {
    max-width: 430px;

    margin: 0;

    font-family: 'Archivo', sans-serif;

    font-size: clamp(30px, 3.3vw, 42px);
    font-weight: 800;

    line-height: 1.02;

    color: var(--purple);
}

.aoc-contact-page .footer-newsletter-text p {
    max-width: 430px;

    margin: 18px 0 0;

    font-size: 14px;
    line-height: 1.5;

    color: var(--purple);
}


/* =========================================================
   FORM NEWSLETTER
   ========================================================= */

.aoc-contact-page .footer-newsletter-form {
    align-self: center;
}

.aoc-contact-page .footer-newsletter-form label {
    display: block;

    margin-bottom: 8px;

    font-family: 'Chivo Mono', monospace;

    font-size: 10px;
    font-weight: 600;

    text-transform: uppercase;
    letter-spacing: .06em;

    color: var(--purple);
}

.aoc-contact-page .newsletter-fields {
    display: grid;

    grid-template-columns: 1fr auto;
}

.aoc-contact-page .newsletter-fields input {
    min-height: 48px;

    padding: 0 14px;

    border: 1px solid var(--purple);
    border-radius: 0;

    background: #FFFFFF;

    font-family: 'Archivo', sans-serif;

    font-size: 14px;
}

.aoc-contact-page .newsletter-fields button {
    min-height: 48px;

    padding: 0 20px;

    border: 1px solid var(--purple);
    border-left: 0;
    border-radius: 0;

    background: var(--yellow);

    color: var(--purple);

    font-family: 'Chivo Mono', monospace;

    font-size: 10px;
    font-weight: 600;

    text-transform: uppercase;
}

.aoc-contact-page .newsletter-legal {
    margin: 9px 0 0;

    font-family: 'Chivo Mono', monospace;

    font-size: 8.5px;
    line-height: 1.45;

    color: var(--purple);
}


/* =========================================================
   FOOTER COLONNES
   ========================================================= */

.aoc-contact-page .footer-grid {
    display: grid;

    grid-template-columns:
        1.4fr
        .8fr
        .8fr
        .8fr;

    gap: 50px;

    width: calc(100% - 56px);
    max-width: 1040px;

    margin: 0 auto;

    padding: 38px 0 44px;
}

.aoc-contact-page .footer-grid h4 {
    margin: 0 0 15px;

    font-family: 'Chivo Mono', monospace;

    font-size: 10px;
    font-weight: 600;

    text-transform: uppercase;
    letter-spacing: .07em;

    color: var(--purple);
}

.aoc-contact-page .footer-grid p {
    max-width: 270px;

    margin: 0;

    font-size: 13px;
    line-height: 1.5;

    color: var(--purple);
}

.aoc-contact-page .footer-grid a {
    display: block;

    margin-bottom: 8px;

    font-size: 13px;

    color: var(--purple);

    text-decoration: none;
}

.aoc-contact-page .footer-grid a:hover {
    text-decoration: underline;
}


/* =========================================================
   BAS FOOTER
   ========================================================= */

.aoc-contact-page .footer-bottom {
    display: flex;
    justify-content: space-between;

    gap: 20px;

    width: calc(100% - 56px);
    max-width: 1040px;

    margin: 0 auto;

    padding: 14px 0 18px;

    border-top: 1px solid var(--gray);

    font-family: 'Chivo Mono', monospace;

    font-size: 8.5px;

    text-transform: uppercase;

    color: var(--purple);
}


/* =========================================================
   ADMIN BAR
   ========================================================= */

.admin-bar .aoc-contact-page .aoc-header {
    top: 32px;
}


/* =========================================================
   TABLETTE
   ========================================================= */

@media (max-width: 900px) {

    .aoc-contact-grid {
        grid-template-columns: 1fr;

        max-width: 760px;

        gap: 50px;
    }

    .aoc-contact-page .nav-links {
        display: none;
    }

    .aoc-contact-page .footer-newsletter {
        grid-template-columns: 1fr;

        gap: 35px;
    }

    .aoc-contact-page .footer-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 640px) {

    .aoc-contact-page .aoc-header .nav {
        padding: 12px 18px;
    }

    .aoc-contact-page .logo {
        display: none;
    }

    .aoc-contact-page .aoc-header-logo {
        width: 50px !important;
        height: 50px !important;
        max-width: 50px !important;
    }

    .aoc-contact-page .btn {
        min-height: 50px;

        padding: 0 17px;

        font-size: 10px;
    }

    .aoc-contact-main {
        padding: 45px 0 60px;
    }

    .aoc-contact-grid {
        padding: 0 20px;
    }

    .aoc-contact-intro h1 {
        font-size: 42px;
    }

    .aoc-contact-form-card {
        padding: 28px 22px;
    }

    .aoc-contact-page .footer-newsletter,
    .aoc-contact-page .footer-grid,
    .aoc-contact-page .footer-bottom {
        width: calc(100% - 40px);
    }

    .aoc-contact-page .footer-grid {
        grid-template-columns: 1fr;

        gap: 30px;
    }

    .aoc-contact-page .newsletter-fields {
        grid-template-columns: 1fr;
    }

    .aoc-contact-page .newsletter-fields button {
        border-left: 1px solid var(--purple);
        border-top: 0;
    }

    .aoc-contact-page .footer-bottom {
        flex-direction: column;
    }
}
body.page-template-page-contact-php #masthead,
body.page-template-page-contact-php #site-navigation,
body.page-template-page-contact-php .main-navigation {
    display: none !important;
}
/* =========================================================
   CONTACT — CORRECTIONS STRUCTURELLES
   ========================================================= */


/* =========================================================
   1. SUPPRIMER LE HEADER + FOOTER NATIFS GENERATEPRESS
   ========================================================= */

body:has(.aoc-contact-page) #masthead,
body:has(.aoc-contact-page) .site-header:not(.aoc-header),
body:has(.aoc-contact-page) #site-navigation,
body:has(.aoc-contact-page) .main-navigation,
body:has(.aoc-contact-page) .site-footer {
    display: none !important;
}


/* =========================================================
   2. LIBÉRER LA PAGE DU CONTENEUR GENERATEPRESS
   ========================================================= */

body:has(.aoc-contact-page) #page,
body:has(.aoc-contact-page) #content,
body:has(.aoc-contact-page) #primary,
body:has(.aoc-contact-page) #main,
body:has(.aoc-contact-page) .site-content,
body:has(.aoc-contact-page) .content-area,
body:has(.aoc-contact-page) .site-main,
body:has(.aoc-contact-page) article,
body:has(.aoc-contact-page) .inside-article {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    background: #FFFFFF !important;
}


/* =========================================================
   3. CONTACT EN PLEINE LARGEUR ÉCRAN
   ========================================================= */

.aoc-contact-page {
    position: relative;

    left: 50%;
    transform: translateX(-50%);

    width: 100vw !important;
    max-width: 100vw !important;

    margin: 0 !important;

    background: #FFFFFF !important;
}


/* =========================================================
   4. HEADER CONTACT = PLEINE LARGEUR
   ========================================================= */

.aoc-contact-page .aoc-header {
    width: 100vw !important;
    max-width: none !important;

    margin: 0 !important;

    background: #FFFFFF !important;
}

.aoc-contact-page .aoc-header .nav {
    width: 100% !important;
    max-width: none !important;

    padding: 16px 32px !important;
}


/* =========================================================
   5. CONTENU CONTACT
   ========================================================= */

.aoc-contact-main {
    width: 100% !important;

    background: #FFFFFF !important;
}

.aoc-contact-grid {
    width: 100% !important;
    max-width: 1050px !important;

    margin: 0 auto !important;

    padding-left: 25px !important;
    padding-right: 25px !important;
}


/* =========================================================
   6. FOOTER — MÊME LARGEUR QUE ACTUS / RÉFÉRENCES
   ========================================================= */

.aoc-contact-page .aoc-footer {
    width: 100vw !important;
    max-width: none !important;

    margin: 0 !important;

    background: #F3F1E6 !important;
}


/* Newsletter */

.aoc-contact-page .footer-newsletter {
    width: calc(100% - 56px) !important;
    max-width: 1040px !important;

    margin: 0 auto !important;

    padding: 58px 0 52px !important;

    display: grid !important;
    grid-template-columns: 1fr 1.15fr !important;
    gap: 70px !important;

    border-bottom: 1px solid #C9C8BF !important;
}


/* Colonnes */

.aoc-contact-page .footer-grid {
    width: calc(100% - 56px) !important;
    max-width: 1040px !important;

    margin: 0 auto !important;

    padding: 38px 0 44px !important;

    display: grid !important;
    grid-template-columns: 1.4fr .8fr .8fr .8fr !important;
    gap: 50px !important;
}


/* Bas footer */

.aoc-contact-page .footer-bottom {
    width: calc(100% - 56px) !important;
    max-width: 1040px !important;

    margin: 0 auto !important;

    padding: 14px 0 18px !important;
}


/* =========================================================
   TABLETTE
   ========================================================= */

@media (max-width: 900px) {

    .aoc-contact-page .footer-newsletter {
        grid-template-columns: 1fr !important;
        gap: 35px !important;
    }

    .aoc-contact-page .footer-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 640px) {

    .aoc-contact-page .footer-newsletter,
    .aoc-contact-page .footer-grid,
    .aoc-contact-page .footer-bottom {
        width: calc(100% - 40px) !important;
    }

    .aoc-contact-page .footer-grid {
        grid-template-columns: 1fr !important;
    }

}
/* =========================================================
   CONTACT — FINITIONS
   ========================================================= */

/* Bouton Contact du header */
.aoc-contact-page .aoc-header .contact-btn,
.aoc-contact-page .aoc-header .nav-contact {
    background: #FFFF5D !important;
    color: #7600D9 !important;
}

/* Un peu moins d'espace sous le header */
.aoc-contact-main {
    padding-top: 48px !important;
}

/* Bloc formulaire : un peu plus compact */
.aoc-contact-form-wrap {
    padding-bottom: 38px !important;
}

/* Réseaux sociaux plus présents */
.aoc-contact-socials {
    gap: 10px !important;
}

.aoc-contact-socials a {
    min-height: 36px !important;
    padding: 0 15px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 10px !important;
}
/* =========================================================
   PAGE CONTACT AOC
   ========================================================= */

.aoc-contact-page {
    background: #fffdf7;
}


/* =========================================================
   ZONE PRINCIPALE
   ========================================================= */

.aoc-contact-main {
    width: 100%;
    padding: 80px 24px 90px;
    box-sizing: border-box;
}

.aoc-contact-inner {
    width: min(1120px, calc(100% - 48px));
    margin: 0 auto;

    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(420px, 0.9fr);
    gap: 100px;

    align-items: start;
}


/* =========================================================
   COLONNE GAUCHE
   ========================================================= */

.aoc-contact-intro {
    padding-top: 6px;
}

.aoc-contact-intro .eyebrow {
    font-family: "Chivo Mono", monospace;
    font-size: 12px;
    line-height: 1.2;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--purple);
    margin-bottom: 22px;
}

.aoc-contact-intro h1 {
    margin: 0 0 30px;

    font-family: "Archivo", sans-serif;
    font-size: clamp(48px, 4vw, 68px);
    line-height: 0.96;
    letter-spacing: -0.045em;
    font-weight: 800;

    color: #111;
}

.aoc-contact-lead {
    margin: 0 0 42px;

    font-family: "Archivo", sans-serif;
    font-size: 16px;
    line-height: 1.55;
    color: #333;
}


/* =========================================================
   COORDONNÉES
   ========================================================= */

.aoc-contact-details {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 34px;
}

.aoc-contact-detail {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.aoc-contact-label {
    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #8b887f;
}

.aoc-contact-detail a,
.aoc-contact-detail strong {
    font-family: "Archivo", sans-serif;
    font-size: 16px;
    line-height: 1.35;
    font-weight: 700;
    color: #111;
    text-decoration: none;
}

.aoc-contact-detail a:hover {
    color: var(--purple);
}


/* =========================================================
   RÉSEAUX SOCIAUX
   ========================================================= */

.aoc-contact-socials {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.aoc-contact-socials a {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 42px;
    padding: 0 16px;

    border: 1px solid #111;

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    text-decoration: none;

    color: #111;
    background: transparent;

    transition: 0.2s ease;
}

.aoc-contact-socials a:hover {
    background: var(--yellow);
    border-color: var(--purple);
    color: var(--purple);
}


/* =========================================================
   BLOC FORMULAIRE
   ========================================================= */

.aoc-contact-form-wrap {
    background: #31006f;
    padding: 42px 42px 46px;
    box-sizing: border-box;
    color: #fff;
}

.aoc-contact-form-eyebrow {
    margin-bottom: 12px;

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    line-height: 1.2;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;

    color: var(--yellow);
}

.aoc-contact-form-wrap h2 {
    margin: 0 0 30px;

    font-family: "Archivo", sans-serif;
    font-size: 30px;
    line-height: 1.05;
    font-weight: 700;
    letter-spacing: -0.02em;

    color: #fff;
}


/* =========================================================
   CONTACT FORM 7
   ========================================================= */

.aoc-contact-cf7 .wpcf7 {
    margin: 0;
}

.aoc-contact-cf7 p {
    margin: 0 0 20px;
}

.aoc-contact-cf7 label {
    display: block;

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    line-height: 1.3;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;

    color: #c7a9e9;
}

.aoc-contact-cf7 input[type="text"],
.aoc-contact-cf7 input[type="email"],
.aoc-contact-cf7 input[type="tel"],
.aoc-contact-cf7 input[type="url"],
.aoc-contact-cf7 textarea,
.aoc-contact-cf7 select {

    display: block;
    width: 100%;

    margin-top: 8px;
    padding: 14px 16px;

    box-sizing: border-box;

    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 0;

    background: rgba(255,255,255,0.10);
    color: #fff;

    font-family: "Archivo", sans-serif;
    font-size: 15px;

    outline: none;
}

.aoc-contact-cf7 input[type="text"],
.aoc-contact-cf7 input[type="email"],
.aoc-contact-cf7 input[type="tel"],
.aoc-contact-cf7 input[type="url"] {
    height: 52px;
}

.aoc-contact-cf7 textarea {
    min-height: 190px;
    resize: vertical;
}

.aoc-contact-cf7 input:focus,
.aoc-contact-cf7 textarea:focus,
.aoc-contact-cf7 select:focus {
    border-color: var(--yellow);
    background: rgba(255,255,255,0.14);
}


/* =========================================================
   BOUTON ENVOYER
   ========================================================= */

.aoc-contact-cf7 input[type="submit"] {
    display: block;

    width: 100%;
    min-height: 54px;

    margin-top: 10px;
    padding: 15px 20px;

    border: 1px solid var(--yellow);
    border-radius: 0;

    background: var(--yellow);
    color: var(--purple);

    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;

    cursor: pointer;

    transition: 0.2s ease;
}

.aoc-contact-cf7 input[type="submit"]:hover {
    background: #fff;
    border-color: #fff;
    color: var(--purple);
}


/* =========================================================
   MESSAGES CONTACT FORM 7
   ========================================================= */

.aoc-contact-cf7 .wpcf7-response-output {
    margin: 20px 0 0;
    padding: 12px 14px;

    border: 1px solid var(--yellow);

    font-family: "Archivo", sans-serif;
    font-size: 13px;
    line-height: 1.4;

    color: #fff;
}

.aoc-contact-cf7 .wpcf7-not-valid-tip {
    margin-top: 5px;

    font-family: "Archivo", sans-serif;
    font-size: 12px;

    color: var(--yellow);
}

.aoc-contact-cf7 .wpcf7-spinner {
    margin: 10px 0 0;
}


/* =========================================================
   TABLETTE
   ========================================================= */

@media (max-width: 1000px) {

    .aoc-contact-main {
        padding: 60px 24px 70px;
    }

    .aoc-contact-inner {
        width: min(760px, 100%);
        grid-template-columns: 1fr;
        gap: 55px;
    }

    .aoc-contact-intro h1 {
        font-size: clamp(46px, 8vw, 64px);
    }

    .aoc-contact-form-wrap {
        width: 100%;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

    .aoc-contact-main {
        padding: 45px 18px 60px;
    }

    .aoc-contact-inner {
        width: 100%;
        gap: 45px;
    }

    .aoc-contact-intro h1 {
        font-size: 43px;
        line-height: 0.98;
    }

    .aoc-contact-lead {
        font-size: 15px;
    }

    .aoc-contact-form-wrap {
        padding: 30px 22px 34px;
    }

    .aoc-contact-form-wrap h2 {
        font-size: 26px;
    }

    .aoc-contact-socials {
        gap: 7px;
    }

    .aoc-contact-socials a {
        padding: 0 12px;
        font-size: 9px;
    }
}

/* =========================================================
   AOC — PAGE MÉTHODE
   VERSION CONSOLIDÉE
   ========================================================= */

.aoc-methode-page {
    --purple: #7500CA;
    --purple-deep: #33066B;
    --yellow: #FFFF5D;
    --peach: #FFB894;
    --pink: #FF8FE3;
    --mint: #8EEFC4;
    --paper: #FFFFFF;
    --paper-2: #F3F1E6;
    --ink: #15120B;
    --gray: #C9C8BF;
    --gray-dark: #77746C;

    position: relative;
    left: 50%;
    transform: translateX(-50%);

    width: 100vw !important;
    max-width: 100vw !important;
    margin: 0 !important;

    background: var(--paper);
    color: var(--ink);

    font-family: "Archivo", sans-serif;
}

.aoc-methode-page *,
.aoc-methode-page *::before,
.aoc-methode-page *::after {
    box-sizing: border-box;
}

.aoc-methode-page a {
    color: inherit;
    text-decoration: none;
}

.aoc-methode-page img {
    display: block;
    max-width: 100%;
}


/* =========================================================
   GENERATEPRESS — PLEINE LARGEUR
   ========================================================= */

body:has(.aoc-methode-page),
body:has(.aoc-methode-page) #page,
body:has(.aoc-methode-page) #content,
body:has(.aoc-methode-page) #primary,
body:has(.aoc-methode-page) #main,
body:has(.aoc-methode-page) .site-content,
body:has(.aoc-methode-page) .content-area,
body:has(.aoc-methode-page) .site-main,
body:has(.aoc-methode-page) .inside-article,
body:has(.aoc-methode-page) .entry-content {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    background: var(--paper) !important;
}


/* Masque uniquement le header/footer GeneratePress natifs */

body:has(.aoc-methode-page) #masthead,
body:has(.aoc-methode-page) #site-navigation,
body:has(.aoc-methode-page) .main-navigation,
body:has(.aoc-methode-page) .site-footer {
    display: none !important;
}


/* =========================================================
   CONTENEURS
   ========================================================= */

.aoc-methode-wrap {
    width: min(1280px, calc(100% - 120px));
    margin: 0 auto;
}

.aoc-methode-page .eyebrow {
    margin-bottom: 14px;

    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;

    letter-spacing: .07em;
    text-transform: uppercase;

    color: var(--purple);
}


/* =========================================================
   HEADER MÉTHODE
   ========================================================= */

.aoc-methode-page .aoc-header {
    position: sticky;
    top: 0;
    z-index: 1000;

    width: 100%;
    max-width: none;
    margin: 0;

    background: var(--paper);

    border-bottom: 1px solid var(--gray);
}

.aoc-methode-page .aoc-header .nav {
    display: flex;
    align-items: center;
    justify-content: space-between;

    width: 100%;
    max-width: none;

    margin: 0;
    padding: 16px 32px;
}

.aoc-methode-page .brand {
    display: flex;
    align-items: center;
    gap: 12px;
}

.aoc-methode-page .aoc-logo-link {
    display: block;
    flex-shrink: 0;
}

.aoc-methode-page .aoc-header-logo {
    width: 60px !important;
    height: 60px !important;
    max-width: 60px !important;

    object-fit: cover;
    border-radius: 50%;
}

.aoc-methode-page .logo {
    font-family: "Archivo", sans-serif;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.1;

    color: var(--ink);
}

.aoc-methode-page .logo small {
    display: block;

    margin-top: 2px;

    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    font-weight: 400;

    letter-spacing: .1em;
    text-transform: uppercase;

    color: var(--gray-dark);
}

.aoc-methode-page .nav-links {
    display: flex;
    align-items: center;
    gap: 30px;
}

.aoc-methode-page .nav-links a {
    position: relative;

    padding-bottom: 3px;

    font-family: "Archivo", sans-serif;
    font-size: 14px;
    font-weight: 500;

    color: var(--ink);

    text-decoration: none;
}

.aoc-methode-page .nav-links a::after {
    content: "";

    position: absolute;
    left: 0;
    bottom: 0;

    width: 0;
    height: 2px;

    background: var(--purple);

    transition: width .2s ease;
}

.aoc-methode-page .nav-links a:hover::after,
.aoc-methode-page .nav-links a.active::after {
    width: 100%;
}


/* Bouton Contact */

.aoc-methode-page .aoc-header .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 58px;
    padding: 0 28px;

    border: 0;
    border-radius: 0;

    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    font-weight: 600;

    text-transform: uppercase;

    transition:
        background .2s ease,
        color .2s ease;
}

.aoc-methode-page .aoc-header .btn-solid {
    background: var(--yellow);
    color: var(--purple);
}

.aoc-methode-page .aoc-header .btn-solid:hover {
    background: var(--purple);
    color: var(--yellow);
}


/* =========================================================
   HERO
   ========================================================= */

.aoc-methode-hero {
    width: 100%;
    padding: 90px 0 110px;

    background: var(--paper);
}

.aoc-methode-hero-inner {
    display: grid;
    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(420px, .85fr);

    gap: 90px;

    width: min(1280px, calc(100% - 120px));
    margin: 0 auto;

    align-items: center;
}

.aoc-methode-hero-copy h1 {
    max-width: 760px;

    margin: 0;

    font-family: "Archivo", sans-serif;
    font-size: clamp(68px, 5vw, 92px);
    font-weight: 800;
    line-height: .94;

    letter-spacing: -.055em;

    color: var(--ink);
}

.aoc-methode-hero-copy h1 span {
    display: block;
    color: var(--purple);
}

.aoc-methode-hero-copy > p {
    max-width: 650px;

    margin: 28px 0 32px;

    font-family: "Archivo", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.55;

    color: #48453D;
}

.aoc-methode-hero-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    min-height: 52px;
    padding: 0 22px !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: var(--purple) !important;
    color: var(--yellow) !important;

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 700;

    text-transform: uppercase;
}

.aoc-methode-hero-btn:hover {
    background: var(--yellow) !important;
    color: var(--purple) !important;
}


/* =========================================================
   HERO — PORTRAIT
   ========================================================= */

.aoc-methode-hero-visual {
    position: relative;

    width: 100%;
    max-width: 500px;
}

.aoc-methode-portrait,
.aoc-methode-portrait-placeholder {
    display: block;

    width: 100%;
    aspect-ratio: 4 / 5;
}

.aoc-methode-portrait {
    height: auto;
    object-fit: cover;
}

.aoc-methode-portrait-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;

    background: var(--peach);

    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    font-weight: 700;

    text-transform: uppercase;

    color: var(--purple);
}

.aoc-methode-hero-visual::after {
    content: "";

    position: absolute;
    right: -14px;
    bottom: -14px;

    width: 78%;
    height: 78%;

    background: var(--yellow);

    z-index: -1;
}


/* =========================================================
   PROCESS — INTRO
   ========================================================= */

.aoc-methode-process {
    padding: 110px 0 120px;
    background: #FFFFFF;
}

.aoc-methode-section-head {
    max-width: 900px;

    margin: 0 auto 65px;

    text-align: center;
}

.aoc-methode-section-head h2 {
    margin: 0;

    font-family: "Archivo", sans-serif;
    font-size: clamp(44px, 4.8vw, 68px);
    font-weight: 800;
    line-height: .98;

    letter-spacing: -.045em;

    color: var(--ink);
}

.aoc-methode-section-head > p {
    max-width: 720px;

    margin: 20px auto 0;

    font-family: "Archivo", sans-serif;
    font-size: 17px;
    line-height: 1.55;

    color: #555148;
}


/* =========================================================
   01 / 02 / 03 — APLATS
   ========================================================= */

.aoc-methode-step {
    display: grid;

    grid-template-columns:
        110px
        minmax(250px, .65fr)
        minmax(0, 1.35fr);

    gap: 45px;

    align-items: start;

    margin: 0;
    padding: 52px 55px;
}


/* Penser */

.aoc-methode-step-1 {
    background: var(--yellow) !important;
    color: var(--ink) !important;
}


/* Faire */

.aoc-methode-step-2 {
    background: var(--peach) !important;
    color: var(--ink) !important;
}


/* Transmettre */

.aoc-methode-step-3 {
    background: var(--purple) !important;
    color: #FFFFFF !important;
}


/* Numéros */

.aoc-methode-step-number {
    font-family: "Chivo Mono", monospace;
    font-size: 16px;
    font-weight: 700;

    color: var(--purple) !important;
}

.aoc-methode-step-3 .aoc-methode-step-number {
    color: var(--yellow) !important;
}


/* Labels */

.aoc-methode-step-label {
    margin-bottom: 7px;

    font-family: "Chivo Mono", monospace;
    font-size: 9px;
    font-weight: 700;

    letter-spacing: .07em;
    text-transform: uppercase;

    color: var(--purple) !important;
}

.aoc-methode-step-3 .aoc-methode-step-label {
    color: var(--yellow) !important;
}


/* Titres */

.aoc-methode-step-title h3 {
    margin: 0;

    font-family: "Archivo", sans-serif;
    font-size: clamp(38px, 3.5vw, 52px);
    font-weight: 800;
    line-height: 1;

    letter-spacing: -.04em;

    color: var(--purple) !important;
}

.aoc-methode-step-3 .aoc-methode-step-title h3 {
    color: #FFFFFF !important;
}


/* Paragraphes */

.aoc-methode-step-content p {
    max-width: 650px;

    margin: 0 0 22px;

    font-family: "Archivo", sans-serif;
    font-size: 17px;
    font-weight: 500;
    line-height: 1.55;

    color: var(--ink) !important;
}

.aoc-methode-step-3 .aoc-methode-step-content p {
    color: #FFFFFF !important;
}


/* Listes */

.aoc-methode-step-content ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px 24px;

    margin: 0;
    padding: 0;

    list-style: none;
}

.aoc-methode-step-content li {
    position: relative;

    padding-left: 17px;

    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.45;

    text-transform: uppercase;

    color: var(--ink) !important;
}

.aoc-methode-step-content li::before {
    content: "→";

    position: absolute;
    left: 0;
    top: 0;

    color: var(--purple) !important;
}

.aoc-methode-step-3 .aoc-methode-step-content li {
    color: #FFFFFF !important;
}

.aoc-methode-step-3 .aoc-methode-step-content li::before {
    color: var(--yellow) !important;
}
/* =========================================================
   MÉTHODE — FIL D'ARIANE
   ========================================================= */

.aoc-methode-page .aoc-breadcrumb {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 14px 32px;
    box-sizing: border-box;

    display: flex;
    align-items: center;
    gap: 8px;

    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    line-height: 1.4;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.aoc-methode-page .aoc-breadcrumb a {
    color: inherit;
    text-decoration: none;
}

.aoc-methode-page .aoc-breadcrumb a:hover {
    text-decoration: underline;
}

.aoc-methode-page .aoc-breadcrumb span[aria-current="page"] {
    opacity: .55;
}

@media (max-width: 700px) {
    .aoc-methode-page .aoc-breadcrumb {
        padding: 14px 20px;
    }
}
/* =========================================================
   TERRAIN / VIDÉO
   ========================================================= */

.aoc-methode-story {
    padding: 120px 0;

    background: var(--paper);
}

.aoc-methode-story-inner {
    display: grid;

    grid-template-columns:
        minmax(380px, .8fr)
        minmax(0, 1.2fr);

    gap: 100px;

    width: min(1180px, calc(100% - 120px));
    margin: 0 auto;

    align-items: center;
}

.aoc-methode-video-placeholder {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;

    width: min(100%, 420px);
    aspect-ratio: 9 / 14;

    padding: 30px;

    background: var(--purple);
    color: #FFFFFF;
}

.aoc-methode-video-label {
    margin-bottom: auto;

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 700;

    text-transform: uppercase;

    color: var(--yellow);
}

.aoc-methode-video-placeholder strong {
    display: block;

    max-width: 280px;

    font-family: "Archivo", sans-serif;
    font-size: 31px;
    font-weight: 800;
    line-height: 1.02;

    letter-spacing: -.035em;
}

.aoc-methode-video-placeholder small {
    display: block;

    margin-top: 15px;

    font-family: "Chivo Mono", monospace;
    font-size: 9px;
    line-height: 1.4;

    color: #D7C6E9;
}

.aoc-methode-story-copy h2 {
    max-width: 650px;

    margin: 0 0 28px;

    font-family: "Archivo", sans-serif;
    font-size: clamp(42px, 4vw, 60px);
    font-weight: 800;
    line-height: 1;

    letter-spacing: -.045em;

    color: var(--ink);
}

.aoc-methode-story-copy p {
    max-width: 610px;

    margin: 0 0 18px;

    font-family: "Archivo", sans-serif;
    font-size: 17px;
    line-height: 1.6;

    color: #4B4840;
}


/* =========================================================
   MANIFESTE PÊCHE
   ========================================================= */

.aoc-methode-manifesto {
    width: 100%;
    padding: 100px 0;
    background: #FFB894 !important;
}

.aoc-methode-manifesto-inner {
    width: min(1180px, calc(100% - 120px));
    margin: 0 auto;
}

.aoc-methode-manifesto .eyebrow {
    color: var(--purple);
}

.aoc-methode-manifesto p {
    max-width: 1100px;
    margin: 0;

    font-family: "Archivo", sans-serif;
    font-size: clamp(36px, 3.3vw, 50px);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -.04em;

    color: var(--purple);
}

/* =========================================================
   PARCOURS
   ========================================================= */

.aoc-methode-parcours {
    padding: 120px 0;

    background: #FFFFFF;
}

.aoc-methode-section-head-left {
    max-width: 800px;

    margin-left: 0;
    margin-right: 0;

    text-align: left;
}

.aoc-methode-section-head-left > p {
    margin-left: 0;
}

.aoc-methode-parcours-grid {
    display: grid;

    grid-template-columns:
        minmax(350px, .72fr)
        minmax(0, 1.28fr);

    gap: 90px;

    align-items: start;
}

.aoc-methode-parcours-img,
.aoc-methode-parcours-placeholder {
    display: block;

    width: 100%;
    aspect-ratio: 4 / 5;
}

.aoc-methode-parcours-img {
    height: auto;
    object-fit: cover;
}

.aoc-methode-parcours-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;

    background: var(--yellow);

    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    font-weight: 700;

    text-transform: uppercase;

    color: var(--purple);
}


/* =========================================================
   TIMELINE
   ========================================================= */

.aoc-methode-timeline {
    border-top: 1px solid var(--gray);
}

.aoc-methode-timeline-item {
    display: grid;

    grid-template-columns: 170px minmax(0, 1fr);

    gap: 30px;

    padding: 34px 0;

    border-bottom: 1px solid var(--gray);
}

.aoc-methode-timeline-date {
    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 700;

    text-transform: uppercase;

    color: var(--purple);
}

.aoc-methode-timeline-copy strong {
    display: block;

    margin-bottom: 8px;

    font-family: "Archivo", sans-serif;
    font-size: 24px;
    font-weight: 800;
    line-height: 1.15;

    color: var(--ink);
}

.aoc-methode-timeline-copy p {
    max-width: 570px;

    margin: 0;

    font-family: "Archivo", sans-serif;
    font-size: 16px;
    line-height: 1.55;

    color: #555148;
}


/* =========================================================
   COLLABORATIONS
   Compatible avec les cartes dynamiques WordPress
   ========================================================= */

.aoc-methode-collab {
    padding: 110px 0 120px;

    background: var(--paper);
}

.aoc-methode-collab-grid {
    display: grid;

    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 20px;
}

.aoc-methode-collab-card {
    min-width: 0;
    min-height: 0;

    padding: 0;

    border: 1px solid var(--gray);

    background: #FFFFFF;

    overflow: hidden;
}

.aoc-methode-collab-link {
    display: flex;
    flex-direction: column;

    height: 100%;

    color: inherit;
    text-decoration: none;
}


/* Image */

.aoc-methode-collab-image {
    width: 100%;
    aspect-ratio: 16 / 10;

    overflow: hidden;

    background: var(--paper-2);
}

.aoc-methode-collab-img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform .35s ease;
}

.aoc-methode-collab-card:hover .aoc-methode-collab-img {
    transform: scale(1.025);
}


/* Contenu */

.aoc-methode-collab-content {
    display: flex;
    flex-direction: column;

    flex: 1;

    min-height: 265px;

    padding: 28px;
}

.aoc-methode-collab-number {
    margin: 0 0 45px;

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 700;

    color: var(--purple);
}

.aoc-methode-collab-card h3 {
    margin: 0 0 12px;

    font-family: "Archivo", sans-serif;
    font-size: 28px;
    font-weight: 800;
    line-height: 1.06;

    letter-spacing: -.025em;

    color: var(--ink);
}

.aoc-methode-collab-card p {
    margin: 0 0 24px;

    font-family: "Archivo", sans-serif;
    font-size: 15px;
    line-height: 1.5;

    color: #555148;
}

.aoc-methode-collab-more {
    margin-top: auto;

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 700;

    text-transform: uppercase;

    color: var(--purple);
}


/* Si le PHP actuel est encore en cartes statiques */

.aoc-methode-collab-card:not(:has(.aoc-methode-collab-link)) {
    min-height: 300px;
    padding: 30px;
}

.aoc-methode-collab-card:not(:has(.aoc-methode-collab-link))
.aoc-methode-collab-number {
    margin-bottom: 70px;
}


/* Lien vers toutes les collaborations */

.aoc-methode-collab-all {
    margin-top: 28px;

    text-align: right;
}

.aoc-methode-collab-all a {
    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 700;

    text-transform: uppercase;

    color: var(--purple);

    text-decoration: none;
}

.aoc-methode-collab-all a:hover {
    text-decoration: underline;
}


/* =========================================================
   CTA FINAL
   ========================================================= */

.aoc-methode-cta {
    width: 100%;

    padding: 100px 30px;

    text-align: center;

    background: var(--purple);
}

.aoc-methode-cta h2 {
    max-width: 800px;

    margin: 0 auto;

    font-family: "Archivo", sans-serif;
    font-size: clamp(48px, 5.5vw, 72px);
    font-weight: 800;
    line-height: .98;

    letter-spacing: -.045em;

    color: #FFFFFF;
}

.aoc-methode-cta .cta-actions {
    margin-top: 30px;
}

.aoc-methode-cta .btn-invert {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 52px;
    padding: 0 24px;

    border: 1px solid var(--yellow);
    border-radius: 0;

    background: var(--yellow);
    color: var(--purple);

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 700;

    text-transform: uppercase;
}

.aoc-methode-cta .btn-invert:hover {
    background: #FFFFFF;
    border-color: #FFFFFF;
}


/* =========================================================
   FOOTER
   On garde les classes communes du site.
   ========================================================= */

.aoc-methode-page .aoc-footer {
    width: 100%;
    max-width: none;
    margin: 0;

    background: var(--paper-2);
}


/* =========================================================
   ADMIN BAR
   ========================================================= */

.admin-bar .aoc-methode-page .aoc-header {
    top: 32px;
}


/* =========================================================
   TABLETTE
   ========================================================= */

@media (max-width: 1099px) {

    .aoc-methode-wrap,
    .aoc-methode-hero-inner {
        width: min(920px, calc(100% - 56px));
    }

    .aoc-methode-hero {
        padding: 72px 0 82px;
    }

    .aoc-methode-hero-inner {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .aoc-methode-hero-copy {
        max-width: 760px;
    }

    .aoc-methode-hero-copy h1 {
        font-size: clamp(56px, 8vw, 78px);
    }

    .aoc-methode-hero-visual {
        max-width: 520px;
    }

    .aoc-methode-process {
        padding: 90px 0 100px;
    }

    .aoc-methode-step {
        grid-template-columns:
            70px
            180px
            minmax(0, 1fr);

        gap: 25px;

        padding: 36px 30px;
    }

    .aoc-methode-story {
        padding: 90px 0;
    }

    .aoc-methode-story-inner {
        width: min(900px, calc(100% - 56px));

        grid-template-columns: .8fr 1.2fr;
        gap: 50px;
    }

    .aoc-methode-manifesto {
        padding: 80px 0;
    }

    .aoc-methode-manifesto-inner {
        width: min(900px, calc(100% - 56px));
    }

    .aoc-methode-parcours {
        padding: 90px 0;
    }

    .aoc-methode-parcours-grid {
        grid-template-columns:
            minmax(280px, .72fr)
            minmax(0, 1.28fr);

        gap: 45px;
    }

    .aoc-methode-timeline-item {
        grid-template-columns: 145px minmax(0, 1fr);

        padding: 28px 0;
    }

    .aoc-methode-timeline-copy strong {
        font-size: 21px;
    }

    .aoc-methode-timeline-copy p {
        font-size: 14px;
    }

    .aoc-methode-collab {
        padding: 90px 0 100px;
    }

    .aoc-methode-collab-grid {
        grid-template-columns: 1fr;
    }

    .aoc-methode-collab-content {
        min-height: 0;
    }

    .aoc-methode-page .nav-links {
        display: none;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    .aoc-methode-wrap,
    .aoc-methode-hero-inner,
    .aoc-methode-story-inner,
    .aoc-methode-manifesto-inner {
        width: calc(100% - 40px);
    }

    .aoc-methode-page .aoc-header .nav {
        padding: 12px 18px;
    }

    .aoc-methode-page .logo {
        display: none;
    }

    .aoc-methode-page .aoc-header-logo {
        width: 50px !important;
        height: 50px !important;
        max-width: 50px !important;
    }

    .aoc-methode-page .aoc-header .btn {
        min-height: 50px;

        padding: 0 17px;

        font-size: 10px;
    }

    .aoc-methode-hero {
        padding: 48px 0 62px;
    }

    .aoc-methode-hero-copy h1 {
        font-size: 48px;
        line-height: .96;
    }

    .aoc-methode-hero-copy > p {
        font-size: 15px;
    }

    .aoc-methode-hero-visual {
        width: calc(100% - 10px);
    }

    .aoc-methode-process {
        padding: 65px 0 75px;
    }

    .aoc-methode-section-head {
        margin-bottom: 38px;
    }

    .aoc-methode-section-head h2 {
        font-size: 40px;
    }

    .aoc-methode-step {
        display: block;

        padding: 30px 24px;
    }

    .aoc-methode-step-number {
        margin-bottom: 28px;
    }

    .aoc-methode-step-title {
        margin-bottom: 24px;
    }

    .aoc-methode-step-content ul {
        grid-template-columns: 1fr;
    }

    .aoc-methode-story {
        padding: 70px 0;
    }

    .aoc-methode-story-inner {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .aoc-methode-video-placeholder {
        width: min(100%, 360px);
    }

    .aoc-methode-manifesto {
        padding: 60px 0;
    }

    .aoc-methode-manifesto p {
        font-size: 35px;
    }

    .aoc-methode-parcours {
        padding: 70px 0;
    }

    .aoc-methode-parcours-grid {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .aoc-methode-parcours-photo {
        max-width: 390px;
    }

    .aoc-methode-timeline-item {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .aoc-methode-collab {
        padding: 70px 0;
    }

    .aoc-methode-collab-card h3 {
        font-size: 24px;
    }

    .aoc-methode-collab-all {
        text-align: left;
    }

    .aoc-methode-cta {
        padding: 65px 20px;
    }

    .aoc-methode-cta h2 {
        font-size: 43px;
    }

}

@media (max-width: 600px) {

    .admin-bar .aoc-methode-page .aoc-header {
        top: 46px;
    }

}
/* =========================================================
   AOC — MÉTHODE — CORRECTIONS DESKTOP / HARMONISATION
   À conserver tout en bas du CSS
   ========================================================= */


/* ---------------------------------------------------------
   HEADER — verrouillage identique à EXPERTISES
   --------------------------------------------------------- */

.aoc-methode-page .aoc-header {
    background: #FFFFFF !important;
    color: #15120B !important;
    border-bottom: 1px solid #C9C8BF !important;
}

.aoc-methode-page .aoc-header .logo,
.aoc-methode-page .aoc-header .nav-links a {
    color: #15120B !important;
}

.aoc-methode-page .aoc-header .logo small {
    color: #77746C !important;
}

.aoc-methode-page .aoc-header .nav-links a::after {
    background: #7500CA !important;
}

.aoc-methode-page .aoc-header .btn-solid {
    background: #FFFF5D !important;
    color: #7500CA !important;
}

.aoc-methode-page .aoc-header .btn-solid:hover {
    background: #7500CA !important;
    color: #FFFF5D !important;
}


/* ---------------------------------------------------------
   HERO — éviter la cassure "accompagneme / nt"
   --------------------------------------------------------- */

@media (min-width: 1100px) {

    .aoc-methode-hero-inner {
        grid-template-columns:
            minmax(0, 1.35fr)
            minmax(360px, .65fr);

        gap: 70px;
    }

    .aoc-methode-hero-copy h1 {
        max-width: 820px;

        font-size: clamp(62px, 4.4vw, 82px);

        overflow-wrap: normal;
        word-break: normal;
        hyphens: none;
    }

    .aoc-methode-hero-visual {
        max-width: 460px;
        justify-self: end;
    }

}


/* ---------------------------------------------------------
   PROCESS — PENSER / FAIRE / TRANSMETTRE
   --------------------------------------------------------- */

@media (min-width: 1100px) {

    .aoc-methode-step {
        grid-template-columns:
            70px
            minmax(210px, .55fr)
            minmax(0, 1.45fr);

        gap: 35px;

        padding: 48px 50px;
    }

    .aoc-methode-step-content ul {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 11px 30px;
    }

    .aoc-methode-step-content li {
        padding-left: 16px;

        font-size: 10px;
        line-height: 1.5;

        overflow-wrap: normal;
        word-break: normal;
    }

}


/* ---------------------------------------------------------
   COLLABORATIONS — cartes moins vides
   --------------------------------------------------------- */

.aoc-methode-collab-content {
    min-height: 230px;
    padding: 26px;
}

.aoc-methode-collab-number {
    margin-bottom: 28px;
}

.aoc-methode-collab-card h3 {
    margin-bottom: 10px;
}


/* ---------------------------------------------------------
   CTA FINAL — cohérence graphique avec EXPERTISES
   --------------------------------------------------------- */

.aoc-methode-cta {
    padding: 90px 30px;
}

.aoc-methode-cta h2 {
    max-width: 780px;

    font-size: clamp(45px, 5vw, 68px);
    line-height: .98;
}


/* =========================================================
   TABLETTE
   ========================================================= */

@media (max-width: 1099px) {

    .aoc-methode-step {
        grid-template-columns:
            60px
            170px
            minmax(0, 1fr);

        gap: 22px;
    }

    .aoc-methode-step-content ul {
        grid-template-columns: 1fr;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    .aoc-methode-hero {
        padding: 42px 0 52px;
    }

    .aoc-methode-hero-inner {
        gap: 38px;
    }

    .aoc-methode-hero-copy h1 {
        font-size: 41px;
        line-height: .98;
        letter-spacing: -.045em;

        overflow-wrap: normal;
        word-break: normal;
        hyphens: none;
    }

    .aoc-methode-hero-copy > p {
        margin: 20px 0 26px;

        font-size: 15px;
        line-height: 1.5;
    }

    .aoc-methode-step {
        padding: 30px 24px;
    }

    .aoc-methode-step-title h3 {
        font-size: 36px;
    }

    .aoc-methode-step-content p {
        font-size: 15px;
    }

    .aoc-methode-step-content li {
        font-size: 10px;
        line-height: 1.5;
    }

    .aoc-methode-collab-content {
        min-height: 0;
    }

    .aoc-methode-collab-number {
        margin-bottom: 25px;
    }

    .aoc-methode-cta {
        padding: 60px 20px;
    }

    .aoc-methode-cta h2 {
        font-size: 38px;
        line-height: 1;
        letter-spacing: -.04em;
    }

}
/* =========================================================
   MÉTHODE — FIX PROCESS DESKTOP
   ========================================================= */

@media (min-width: 1100px) {

    .aoc-methode-step {
        grid-template-columns:
            55px
            230px
            minmax(0, 1fr) !important;

        gap: 35px !important;
        padding: 48px 45px !important;
    }

    .aoc-methode-step-title {
        min-width: 0;
    }

    .aoc-methode-step-title h3 {
        font-size: 42px !important;
        line-height: .95 !important;
        letter-spacing: -.04em !important;

        white-space: nowrap;
        word-break: normal !important;
        overflow-wrap: normal !important;
        hyphens: none !important;
    }

    .aoc-methode-step-content {
        min-width: 0;
    }

    .aoc-methode-step-content > p {
        max-width: 650px;
        margin-top: 0;
    }

    .aoc-methode-step-content ul {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;

        column-gap: 40px !important;
        row-gap: 10px !important;

        margin-top: 20px !important;
    }

    .aoc-methode-step-content li {
        position: relative;

        min-width: 0;

        padding-left: 15px !important;

        font-size: 9px !important;
        line-height: 1.4 !important;

        white-space: normal !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
    }

}
/* =========================================================
   AOC — PAGE EXPERTISES
   ========================================================= */

.aoc-expertises-page {
    --purple: #7500CA;
    --purple-deep: #33066B;
    --yellow: #FFFF5D;
    --peach: #FFB894;
    --pink: #FF8FE3;
    --paper: #FFFFFF;
    --paper-2: #F3F1E6;
    --ink: #15120B;
    --gray: #C9C8BF;
    --gray-dark: #77746C;

    position: relative;
    left: 50%;
    transform: translateX(-50%);

    width: 100vw !important;
    max-width: 100vw !important;
    margin: 0 !important;

    background: var(--paper);
    color: var(--ink);

    font-family: "Archivo", sans-serif;
}

.aoc-expertises-page *,
.aoc-expertises-page *::before,
.aoc-expertises-page *::after {
    box-sizing: border-box;
}

.aoc-expertises-page a {
    color: inherit;
    text-decoration: none;
}

.aoc-expertises-page img {
    display: block;
    max-width: 100%;
}


/* =========================================================
   GENERATEPRESS — PLEINE LARGEUR
   IMPORTANT : on ne cible PAS "article"
   ========================================================= */

body:has(.aoc-expertises-page),
body:has(.aoc-expertises-page) #page,
body:has(.aoc-expertises-page) #content,
body:has(.aoc-expertises-page) #primary,
body:has(.aoc-expertises-page) #main,
body:has(.aoc-expertises-page) .site-content,
body:has(.aoc-expertises-page) .content-area,
body:has(.aoc-expertises-page) .site-main,
body:has(.aoc-expertises-page) .inside-article,
body:has(.aoc-expertises-page) .entry-content {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;

    padding-left: 0 !important;
    padding-right: 0 !important;

    background: var(--paper) !important;
}


/* Masque uniquement le header/footer GeneratePress natifs */

body:has(.aoc-expertises-page) #masthead,
body:has(.aoc-expertises-page) #site-navigation,
body:has(.aoc-expertises-page) .main-navigation,
body:has(.aoc-expertises-page) .site-footer {
    display: none !important;
}


/* =========================================================
   ÉLÉMENTS COMMUNS
   ========================================================= */

.aoc-expertises-page .eyebrow {
    margin: 0 0 13px;

    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;

    letter-spacing: .07em;
    text-transform: uppercase;

    color: var(--purple);
}


/* =========================================================
   HEADER
   ========================================================= */

.aoc-expertises-page .aoc-header {
    position: sticky;
    top: 0;
    z-index: 1000;

    width: 100%;

    margin: 0;

    background: var(--paper);

    border-bottom: 1px solid var(--gray);
}

.aoc-expertises-page .aoc-header .nav {
    display: flex;

    align-items: center;
    justify-content: space-between;

    width: 100%;
    max-width: none;

    margin: 0;
    padding: 16px 32px;
}

.aoc-expertises-page .brand {
    display: flex;
    align-items: center;
    gap: 12px;
}

.aoc-expertises-page .aoc-logo-link {
    display: block;
    flex-shrink: 0;
}

.aoc-expertises-page .aoc-header-logo {
    width: 60px !important;
    height: 60px !important;
    max-width: 60px !important;

    object-fit: cover;

    border-radius: 50%;
}

.aoc-expertises-page .logo {
    font-family: "Archivo", sans-serif;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.1;

    color: var(--ink);
}

.aoc-expertises-page .logo small {
    display: block;

    margin-top: 2px;

    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    font-weight: 400;

    letter-spacing: .1em;
    text-transform: uppercase;

    color: var(--gray-dark);
}


/* Navigation */

.aoc-expertises-page .nav-links {
    display: flex;

    align-items: center;

    gap: 30px;
}

.aoc-expertises-page .nav-links a {
    position: relative;

    padding-bottom: 3px;

    font-family: "Archivo", sans-serif;
    font-size: 14px;
    font-weight: 500;

    color: var(--ink);
}

.aoc-expertises-page .nav-links a::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 0;
    height: 2px;

    background: var(--purple);

    transition: width .2s ease;
}

.aoc-expertises-page .nav-links a:hover::after,
.aoc-expertises-page .nav-links a.active::after {
    width: 100%;
}


/* Bouton contact */

.aoc-expertises-page .aoc-header .btn {
    display: inline-flex;

    min-height: 58px;

    padding: 0 28px;

    align-items: center;
    justify-content: center;

    border: 0;
    border-radius: 0;

    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    font-weight: 600;

    text-transform: uppercase;

    transition:
        background .2s ease,
        color .2s ease;
}

.aoc-expertises-page .aoc-header .btn-solid {
    background: var(--yellow);
    color: var(--purple);
}

.aoc-expertises-page .aoc-header .btn-solid:hover {
    background: var(--purple);
    color: var(--yellow);
}


/* =========================================================
   HERO
   ========================================================= */

.aoc-expertises-hero {
    width: 100%;

    padding: 72px 30px 78px;

    text-align: center;

    background: var(--purple);
    color: #FFFFFF;
}

.aoc-expertises-hero-inner {
    width: min(1050px, 100%);
    margin: 0 auto;
}

.aoc-expertises-hero .eyebrow {
    color: var(--yellow);
}


/* Petit logo */

.aoc-expertises-hero-icon {
    width: 66px;
    height: 66px;

    margin: 16px auto 20px;

    object-fit: cover;

    border-radius: 50%;
}


/* Titre */

.aoc-expertises-hero h1 {
    max-width: 900px;

    margin: 0 auto;

    font-family: "Archivo", sans-serif;
    font-size: clamp(54px, 5.5vw, 78px);
    font-weight: 800;
    line-height: .95;

    letter-spacing: -.05em;

    color: #FFFFFF;
}

.aoc-expertises-hero p {
    max-width: 620px;

    margin: 24px auto 0;

    font-family: "Archivo", sans-serif;
    font-size: 17px;
    font-weight: 500;
    line-height: 1.55;

    color: #DDD0EE;
}


/* =========================================================
   CONTENU PRINCIPAL
   ========================================================= */

.aoc-expertises-main {
    padding: 90px 0 100px;

    background: var(--paper);
}

.aoc-expertises-layout {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        390px;

    gap: 75px;

    width: min(1280px, calc(100% - 120px));

    margin: 0 auto;

    align-items: start;
}


/* =========================================================
   EXPERTISES
   ========================================================= */

.aoc-expertises-content {
    min-width: 0;
}

.aoc-expertise-item {
    display: grid;

    grid-template-columns: 80px minmax(0, 1fr);

    gap: 28px;

    padding: 38px 0;

    border-bottom: 1px solid var(--gray);

    background: transparent;
}

.aoc-expertise-item:first-child {
    padding-top: 0;
}


/* Numéro */

.aoc-expertise-number {
    padding-top: 4px;

    font-family: "Archivo", sans-serif;
    font-size: 38px;
    font-weight: 800;
    line-height: 1;

    letter-spacing: -.04em;

    color: #C9C8BF;
}


/* Titre */

.aoc-expertise-copy h2 {
    margin: 0;

    font-family: "Archivo", sans-serif;
    font-size: clamp(28px, 2.5vw, 38px);
    font-weight: 800;
    line-height: 1.04;

    letter-spacing: -.035em;

    color: var(--ink);
}


/* Texte */

.aoc-expertise-copy > p {
    max-width: 670px;

    margin: 13px 0 0;

    font-family: "Archivo", sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.6;

    color: #514E45;
}


/* =========================================================
   MOTS-CLÉS
   ========================================================= */

.aoc-expertise-keywords {
    display: flex;
    flex-wrap: wrap;

    gap: 7px;

    margin-top: 18px;
}

.aoc-expertise-keywords span {
    display: inline-flex;

    align-items: center;

    min-height: 29px;

    padding: 5px 11px;

    border: 1px solid var(--gray);
    border-radius: 50px;

    background: transparent;

    font-family: "Chivo Mono", monospace;
    font-size: 9px;
    font-weight: 600;
    line-height: 1.2;

    letter-spacing: .02em;
    text-transform: uppercase;

    color: var(--purple-deep);
}


/* Petite variation graphique au hover */

.aoc-expertise-item:hover .aoc-expertise-number {
    color: var(--purple);
}


/* =========================================================
   ENGAGEMENTS
   ========================================================= */

.aoc-expertises-engagements {
    margin-top: 62px;
}

.aoc-expertises-chips {
    display: flex;
    flex-wrap: wrap;

    gap: 9px;

    margin-top: 18px;
}

.aoc-expertises-chips span {
    display: inline-flex;

    min-height: 36px;

    padding: 7px 15px;

    align-items: center;

    border: 1px solid var(--ink);
    border-radius: 50px;

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 600;

    letter-spacing: .025em;
    text-transform: uppercase;

    color: var(--ink);
}


/* Quelques touches de couleur */

.aoc-expertises-chips span:nth-child(2),
.aoc-expertises-chips span:nth-child(6) {
    background: var(--yellow);
}

.aoc-expertises-chips span:nth-child(4),
.aoc-expertises-chips span:nth-child(8) {
    background: var(--peach);
}


/* =========================================================
   ET AUSSI
   ========================================================= */

.aoc-expertises-also {
    margin-top: 46px;

    padding: 25px 28px;

    background: var(--paper-2);
}

.aoc-expertises-also .eyebrow {
    margin-bottom: 9px;
}

.aoc-expertises-also p {
    margin: 0;

    font-family: "Archivo", sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.6;

    color: #4A473E;
}

.aoc-expertises-also p span {
    display: inline-block;

    padding: 0 8px;

    color: var(--purple);
}


/* =========================================================
   ÉTUDES DE CAS — COLONNE DROITE
   ========================================================= */

.aoc-expertises-cases {
    position: sticky;

    top: 112px;

    display: flex;
    flex-direction: column;

    gap: 20px;
}

.aoc-expertises-cases-heading {
    margin-bottom: 2px;

    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    font-weight: 700;

    letter-spacing: .07em;
    text-transform: uppercase;

    color: var(--purple);
}


/* =========================================================
   CARTE ÉTUDE DE CAS
   ========================================================= */

.aoc-expertises-case-card {
    position: relative;

    display: flex;

    width: 100%;
    aspect-ratio: 4 / 4.4;

    align-items: flex-end;

    overflow: hidden;

    background: var(--ink);

    color: #FFFFFF;
}

.aoc-expertises-case-image {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;
}

.aoc-expertises-case-image img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform .4s ease;
}

.aoc-expertises-case-overlay {
    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            0deg,
            rgba(21,18,11,.94) 0%,
            rgba(21,18,11,.58) 38%,
            rgba(21,18,11,.12) 75%,
            rgba(21,18,11,.03) 100%
        );
}

.aoc-expertises-case-content {
    position: relative;

    z-index: 2;

    width: 100%;

    padding: 28px;
}

.aoc-expertises-case-eyebrow {
    margin-bottom: 10px;

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 700;

    letter-spacing: .06em;
    text-transform: uppercase;

    color: var(--yellow);
}

.aoc-expertises-case-number {
    margin-bottom: 5px;

    font-family: "Archivo", sans-serif;
    font-size: clamp(42px, 4vw, 58px);
    font-weight: 800;
    line-height: .95;

    letter-spacing: -.05em;

    color: #FFFFFF;
}

.aoc-expertises-case-content p {
    max-width: 300px;

    margin: 0;

    font-family: "Archivo", sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.45;

    color: #FFFFFF;
}

.aoc-expertises-case-link {
    display: inline-block;

    margin-top: 18px;
    padding-bottom: 3px;

    border-bottom: 1px solid var(--yellow);

    font-family: "Chivo Mono", monospace;
    font-size: 9px;
    font-weight: 700;

    text-transform: uppercase;

    color: var(--yellow);
}

.aoc-expertises-case-card:hover
.aoc-expertises-case-image img {
    transform: scale(1.035);
}


/* =========================================================
   MINI CTA DROITE
   ========================================================= */

.aoc-expertises-case-cta {
    display: flex;

    min-height: 285px;

    padding: 34px;

    align-items: center;

    background: var(--purple);

    color: #FFFFFF;
}

.aoc-expertises-case-cta .eyebrow {
    color: var(--yellow);
}

.aoc-expertises-case-cta h3 {
    max-width: 300px;

    margin: 0;

    font-family: "Archivo", sans-serif;
    font-size: 28px;
    font-weight: 800;
    line-height: 1.04;

    letter-spacing: -.035em;

    color: #FFFFFF;
}

.aoc-expertises-case-cta p {
    max-width: 290px;

    margin: 15px 0 0;

    font-family: "Archivo", sans-serif;
    font-size: 13px;
    line-height: 1.5;

    color: #DDD0EE;
}

.aoc-expertises-case-button {
    display: inline-flex;

    margin-top: 22px;
    padding-bottom: 4px;

    border-bottom: 1px solid var(--yellow);

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 700;

    text-transform: uppercase;

    color: var(--yellow) !important;
}


/* =========================================================
   CTA FINAL
   ========================================================= */

.aoc-expertises-cta {
    width: 100%;

    padding: 90px 30px;

    text-align: center;

    background: var(--ink);

    color: #FFFFFF;
}

.aoc-expertises-cta .eyebrow {
    color: var(--yellow);
}

.aoc-expertises-cta h2 {
    max-width: 780px;

    margin: 0 auto;

    font-family: "Archivo", sans-serif;
    font-size: clamp(45px, 5vw, 68px);
    font-weight: 800;
    line-height: .98;

    letter-spacing: -.045em;

    color: #FFFFFF;
}

.aoc-expertises-cta h2 span {
    color: var(--yellow);
}

.aoc-expertises-cta-button {
    display: inline-flex;

    min-height: 52px;

    margin-top: 30px;
    padding: 0 24px;

    align-items: center;
    justify-content: center;

    background: var(--yellow);

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 700;

    text-transform: uppercase;

    color: var(--purple-deep) !important;

    transition:
        background .2s ease,
        color .2s ease;
}

.aoc-expertises-cta-button:hover {
    background: var(--purple);
    color: #FFFFFF !important;
}


/* =========================================================
   FOOTER
   ========================================================= */

.aoc-expertises-page .aoc-footer {
    width: 100%;
    max-width: none;

    margin: 0;

    background: var(--paper-2);
}


/* =========================================================
   ADMIN BAR
   ========================================================= */

.admin-bar .aoc-expertises-page .aoc-header {
    top: 32px;
}


/* =========================================================
   TABLETTE
   ========================================================= */

@media (max-width: 1050px) {

    .aoc-expertises-layout {
        grid-template-columns: minmax(0, 1fr) 320px;

        gap: 45px;

        width: calc(100% - 56px);
    }

    .aoc-expertises-case-content {
        padding: 22px;
    }

    .aoc-expertises-case-cta {
        padding: 25px;
    }

    .aoc-expertises-case-cta h3 {
        font-size: 24px;
    }

}


/* =========================================================
   TABLETTE / PETIT ÉCRAN
   ========================================================= */

@media (max-width: 900px) {

    .aoc-expertises-page .nav-links {
        display: none;
    }

    .aoc-expertises-hero {
        padding: 60px 24px 66px;
    }

    .aoc-expertises-hero h1 {
        font-size: clamp(48px, 8vw, 68px);
    }

    .aoc-expertises-layout {
        grid-template-columns: 1fr;

        gap: 65px;
    }

    .aoc-expertises-cases {
        position: static;

        display: grid;

        grid-template-columns: repeat(2, minmax(0, 1fr));

        gap: 18px;
    }

    .aoc-expertises-cases-heading {
        grid-column: 1 / -1;
    }

    .aoc-expertises-case-cta {
        min-height: auto;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    .aoc-expertises-page .aoc-header .nav {
        padding: 12px 18px;
    }

    .aoc-expertises-page .logo {
        display: none;
    }

    .aoc-expertises-page .aoc-header-logo {
        width: 50px !important;
        height: 50px !important;
        max-width: 50px !important;
    }

    .aoc-expertises-page .aoc-header .btn {
        min-height: 50px;

        padding: 0 17px;

        font-size: 10px;
    }


    /* HERO */

    .aoc-expertises-hero {
        padding: 48px 20px 54px;
    }

    .aoc-expertises-hero-icon {
        width: 54px;
        height: 54px;
    }

    .aoc-expertises-hero h1 {
        font-size: 46px;
    }

    .aoc-expertises-hero p {
        font-size: 15px;
    }


    /* MAIN */

    .aoc-expertises-main {
        padding: 62px 0 70px;
    }

    .aoc-expertises-layout {
        width: calc(100% - 40px);

        gap: 55px;
    }


    /* EXPERTISE */

    .aoc-expertise-item {
        grid-template-columns: 1fr;

        gap: 14px;

        padding: 30px 0;
    }

    .aoc-expertise-number {
        font-size: 26px;
    }

    .aoc-expertise-copy h2 {
        font-size: 30px;
    }

    .aoc-expertise-copy > p {
        font-size: 14px;
    }


    /* ENGAGEMENTS */

    .aoc-expertises-engagements {
        margin-top: 50px;
    }


    /* ET AUSSI */

    .aoc-expertises-also {
        margin-top: 38px;

        padding: 22px;
    }

    .aoc-expertises-also p span {
        padding: 0 4px;
    }


    /* CASES */

    .aoc-expertises-cases {
        grid-template-columns: 1fr;
    }

    .aoc-expertises-case-card {
        aspect-ratio: 4 / 4.6;
    }

    .aoc-expertises-case-content {
        padding: 25px;
    }

    .aoc-expertises-case-number {
        font-size: 48px;
    }

    .aoc-expertises-case-cta {
        min-height: 280px;

        padding: 28px;
    }


    /* CTA */

    .aoc-expertises-cta {
        padding: 65px 20px;
    }

    .aoc-expertises-cta h2 {
        font-size: 43px;
    }

}


/* =========================================================
   PETIT MOBILE / ADMIN BAR
   ========================================================= */

@media (max-width: 600px) {

    .admin-bar .aoc-expertises-page .aoc-header {
        top: 46px;
    }

}
/* =========================================================
   EXPERTISES — FINITIONS MOBILE
   ========================================================= */

@media (max-width: 700px) {

    /* HERO — un peu plus compact */

    .aoc-expertises-hero {
        padding: 42px 20px 48px;
    }

    .aoc-expertises-hero-icon {
        width: 50px;
        height: 50px;
        margin: 14px auto 18px;
    }

    .aoc-expertises-hero h1 {
        font-size: 41px;
        line-height: .98;
        letter-spacing: -.045em;
    }

    .aoc-expertises-hero p {
        margin-top: 20px;
        font-size: 15px;
        line-height: 1.5;
    }


    /* ENGAGEMENTS — chips légèrement plus compactes */

    .aoc-expertises-chips {
        gap: 7px;
    }

    .aoc-expertises-chips span {
        min-height: 32px;
        padding: 6px 11px;
        font-size: 9px;
    }


    /* CTA FINAL — titre moins massif */

    .aoc-expertises-cta {
        padding: 60px 20px;
    }

    .aoc-expertises-cta h2 {
        font-size: 38px;
        line-height: 1;
        letter-spacing: -.04em;
    }

}
/* =========================================================
   AOC — SINGLE COLLABORATION
   ========================================================= */

.aoc-single-collaboration {
    --purple: #7500CA;
    --purple-deep: #33066B;
    --yellow: #FFFF5D;
    --peach: #FFB894;
    --pink: #FF8FE3;
    --paper: #FFFFFF;
    --paper-2: #F3F1E6;
    --ink: #15120B;
    --gray: #C9C8BF;
    --gray-dark: #77746C;

    position: relative;
    left: 50%;
    transform: translateX(-50%);

    width: 100vw !important;
    max-width: 100vw !important;
    margin: 0 !important;

    background: var(--paper);
    color: var(--ink);

    font-family: "Archivo", sans-serif;
}

.aoc-single-collaboration *,
.aoc-single-collaboration *::before,
.aoc-single-collaboration *::after {
    box-sizing: border-box;
}

.aoc-single-collaboration a {
    color: inherit;
    text-decoration: none;
}

.aoc-single-collaboration img {
    display: block;
    max-width: 100%;
}


/* =========================================================
   GENERATEPRESS — PLEINE LARGEUR
   ========================================================= */

body:has(.aoc-single-collaboration),
body:has(.aoc-single-collaboration) #page,
body:has(.aoc-single-collaboration) #content,
body:has(.aoc-single-collaboration) #primary,
body:has(.aoc-single-collaboration) #main,
body:has(.aoc-single-collaboration) .site-content,
body:has(.aoc-single-collaboration) .content-area,
body:has(.aoc-single-collaboration) .site-main,
body:has(.aoc-single-collaboration) .inside-article,
body:has(.aoc-single-collaboration) .entry-content {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;

    padding-left: 0 !important;
    padding-right: 0 !important;

    background: var(--paper) !important;
}


/* Masque header + footer GeneratePress natifs */

body:has(.aoc-single-collaboration) #masthead,
body:has(.aoc-single-collaboration) #site-navigation,
body:has(.aoc-single-collaboration) .main-navigation,
body:has(.aoc-single-collaboration) .site-footer {
    display: none !important;
}


/* =========================================================
   HEADER
   ========================================================= */

.aoc-single-collaboration .aoc-header {
    position: sticky;
    top: 0;
    z-index: 1000;

    width: 100%;

    background: var(--paper);

    border-bottom: 1px solid var(--gray);
}

.aoc-single-collaboration .aoc-header .nav {
    display: flex;
    align-items: center;
    justify-content: space-between;

    width: 100%;

    padding: 16px 32px;
}

.aoc-single-collaboration .brand {
    display: flex;
    align-items: center;
    gap: 12px;
}

.aoc-single-collaboration .aoc-logo-link {
    display: block;
    flex-shrink: 0;
}

.aoc-single-collaboration .aoc-header-logo {
    width: 60px !important;
    height: 60px !important;
    max-width: 60px !important;

    object-fit: cover;
    border-radius: 50%;
}

.aoc-single-collaboration .logo {
    font-family: "Archivo", sans-serif;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.1;

    color: var(--ink);
}

.aoc-single-collaboration .logo small {
    display: block;

    margin-top: 2px;

    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    font-weight: 400;

    letter-spacing: .1em;
    text-transform: uppercase;

    color: var(--gray-dark);
}


/* Navigation */

.aoc-single-collaboration .nav-links {
    display: flex;
    align-items: center;
    gap: 30px;
}

.aoc-single-collaboration .nav-links a {
    position: relative;

    padding-bottom: 3px;

    font-family: "Archivo", sans-serif;
    font-size: 14px;
    font-weight: 500;

    color: var(--ink);
}

.aoc-single-collaboration .nav-links a::after {
    content: "";

    position: absolute;
    left: 0;
    bottom: 0;

    width: 0;
    height: 2px;

    background: var(--purple);

    transition: width .2s ease;
}

.aoc-single-collaboration .nav-links a:hover::after {
    width: 100%;
}


/* Contact */

.aoc-single-collaboration .aoc-header .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 58px;
    padding: 0 28px;

    border: 0;
    border-radius: 0;

    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    font-weight: 600;

    text-transform: uppercase;
}

.aoc-single-collaboration .aoc-header .btn-solid {
    background: var(--yellow);
    color: var(--purple);
}

.aoc-single-collaboration .aoc-header .btn-solid:hover {
    background: var(--purple);
    color: var(--yellow);
}


/* =========================================================
   PAGE / GRILLE
   ========================================================= */

.aoc-collab-page {
    width: 100%;

    padding: 62px 0 90px;

    background: var(--paper);
}

.aoc-collab-layout {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        310px;

    gap: 72px;

    width: min(1280px, calc(100% - 120px));
    margin: 0 auto;

    align-items: start;
}

.aoc-collab-main {
    min-width: 0;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
}


/* =========================================================
   FIL D’ARIANE
   ========================================================= */

.aoc-collab-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;

    gap: 8px;

    margin-bottom: 34px;

    font-family: "Chivo Mono", monospace;
    font-size: 9px;
    font-weight: 600;

    letter-spacing: .04em;
    text-transform: uppercase;

    color: var(--gray-dark);
}

.aoc-collab-breadcrumb a:hover {
    color: var(--purple);
}

.aoc-collab-breadcrumb span:last-child {
    color: var(--purple);
}


/* =========================================================
   HERO
   ========================================================= */

.aoc-collab-hero {
    margin-bottom: 46px;
}

.aoc-collab-tags {
    display: flex;
    flex-wrap: wrap;

    gap: 7px;

    margin-bottom: 16px;
}

.aoc-collab-tag {
    display: inline-flex;
    align-items: center;

    min-height: 30px;
    padding: 5px 11px;

    border: 1px solid var(--purple);
    border-radius: 50px;

    font-family: "Chivo Mono", monospace;
    font-size: 9px;
    font-weight: 700;

    letter-spacing: .04em;
    text-transform: uppercase;

    color: var(--purple);
}

.aoc-collab-title {
    max-width: 900px;

    margin: 0 !important;

    font-family: "Archivo", sans-serif !important;
    font-size: clamp(60px, 6vw, 88px) !important;
    font-weight: 800 !important;
    line-height: .94 !important;

    letter-spacing: -.055em !important;

    color: var(--ink) !important;
}


/* =========================================================
   GALERIE
   ========================================================= */

.aoc-collab-gallery {
    display: grid;

    gap: 12px;

    width: 100%;

    margin: 0 0 56px;
}


/* 1 image */

.aoc-collab-gallery-count-1 {
    grid-template-columns: 1fr;
}

.aoc-collab-gallery-count-1 .aoc-collab-gallery-image {
    width: 100%;
    max-height: 680px;

    object-fit: cover;
}


/* 2 images */

.aoc-collab-gallery-count-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.aoc-collab-gallery-count-2 .aoc-collab-gallery-image {
    width: 100%;
    height: 520px;

    object-fit: cover;
}


/* 3 images */

.aoc-collab-gallery-count-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.aoc-collab-gallery-count-3 .aoc-collab-gallery-image {
    width: 100%;
    height: 390px;

    object-fit: cover;
}


/* 4 images et plus */

.aoc-collab-gallery:not(.aoc-collab-gallery-count-1):not(.aoc-collab-gallery-count-2):not(.aoc-collab-gallery-count-3) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.aoc-collab-gallery:not(.aoc-collab-gallery-count-1):not(.aoc-collab-gallery-count-2):not(.aoc-collab-gallery-count-3)
.aoc-collab-gallery-image {
    width: 100%;
    height: 420px;

    object-fit: cover;
}


/* =========================================================
   TEXTE / PRÉSENTATION
   ========================================================= */

.aoc-collab-project {
    display: grid;

    grid-template-columns: 160px minmax(0, 1fr);

    gap: 48px;

    padding-top: 42px;

    border-top: 1px solid var(--gray);
}

.aoc-collab-project-label {
    padding-top: 4px;

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 700;

    letter-spacing: .06em;
    text-transform: uppercase;

    color: var(--purple);
}

.aoc-collab-project-content {
    max-width: 720px;
}

.aoc-collab-content {
    font-family: "Archivo", sans-serif;
    font-size: 17px;
    line-height: 1.65;

    color: #47443C;
}

.aoc-collab-content p {
    margin: 0 0 20px;
}

.aoc-collab-content p:last-child {
    margin-bottom: 0;
}

.aoc-collab-content h2,
.aoc-collab-content h3 {
    margin: 40px 0 16px;

    font-family: "Archivo", sans-serif;
    font-weight: 800;
    line-height: 1.05;

    letter-spacing: -.035em;

    color: var(--ink);
}

.aoc-collab-content h2 {
    font-size: 36px;
}

.aoc-collab-content h3 {
    font-size: 27px;
}

.aoc-collab-content a {
    color: var(--purple);

    text-decoration: underline;
    text-underline-offset: 3px;
}


/* =========================================================
   BOUTON SITE / INSTAGRAM
   ========================================================= */

.aoc-collab-site {
    margin-top: 32px;
}

.aoc-collab-site-button {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;

    gap: 30px;

    min-height: 52px;
    padding: 0 20px;

    background: var(--yellow);

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 700;

    letter-spacing: .03em;
    text-transform: uppercase;

    color: var(--purple) !important;

    transition:
        background .2s ease,
        color .2s ease;
}

.aoc-collab-site-button:hover {
    background: var(--purple);

    color: var(--yellow) !important;
}


/* =========================================================
   SIDEBAR
   ========================================================= */

.aoc-collab-sidebar {
    min-width: 0;
}

.aoc-collab-sidebar-sticky {
    position: sticky;
    top: 120px;
}

.aoc-collab-sidebar-heading {
    display: flex;
    align-items: baseline;
    justify-content: space-between;

    gap: 10px;

    margin-bottom: 18px;

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 700;

    letter-spacing: .05em;
    text-transform: uppercase;

    color: var(--purple);
}

.aoc-collab-sidebar-heading span {
    color: var(--gray-dark);
}

.aoc-collab-sidebar-list {
    border-top: 1px solid var(--gray);
}


/* Élément */

.aoc-collab-sidebar-item {
    display: grid;

    grid-template-columns: 62px minmax(0, 1fr);

    gap: 15px;

    align-items: center;

    padding: 13px 0;

    border-bottom: 1px solid var(--gray);

    transition:
        padding-left .2s ease,
        color .2s ease;
}

.aoc-collab-sidebar-thumb {
    width: 62px;
    height: 62px;

    overflow: hidden;

    background: var(--paper-2);
}

.aoc-collab-sidebar-thumb img {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.aoc-collab-sidebar-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    height: 100%;

    background: var(--purple);

    font-family: "Archivo", sans-serif;
    font-size: 13px;
    font-weight: 800;

    color: var(--yellow);
}

.aoc-collab-sidebar-name {
    font-family: "Archivo", sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;

    color: var(--ink);
}

.aoc-collab-sidebar-item:hover {
    padding-left: 5px;
}

.aoc-collab-sidebar-item:hover
.aoc-collab-sidebar-name {
    color: var(--purple);
}


/* Collaboration courante */

.aoc-collab-sidebar-item.is-active {
    background: var(--yellow);

    margin-left: -10px;
    margin-right: -10px;

    padding-left: 10px;
    padding-right: 10px;
}

.aoc-collab-sidebar-item.is-active
.aoc-collab-sidebar-name {
    color: var(--purple);
}


/* Voir toutes */

.aoc-collab-sidebar-all {
    margin-top: 20px;

    text-align: right;
}

.aoc-collab-sidebar-all a {
    padding-bottom: 3px;

    border-bottom: 1px solid var(--purple);

    font-family: "Chivo Mono", monospace;
    font-size: 9px;
    font-weight: 700;

    text-transform: uppercase;

    color: var(--purple);
}


/* =========================================================
   NAVIGATION PRÉCÉDENTE / SUIVANTE
   ========================================================= */

.aoc-collab-pagination {
    width: 100%;

    background: var(--paper-2);

    border-top: 1px solid var(--gray);
    border-bottom: 1px solid var(--gray);
}

.aoc-collab-pagination-inner {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    width: min(1280px, calc(100% - 120px));
    margin: 0 auto;
}

.aoc-collab-pagination-item {
    display: flex;
    flex-direction: column;
    justify-content: center;

    min-height: 145px;

    padding: 28px 0;
}

.aoc-collab-pagination-prev {
    padding-right: 35px;
}

.aoc-collab-pagination-next {
    padding-left: 35px;

    text-align: right;

    border-left: 1px solid var(--gray);
}

.aoc-collab-pagination-item small {
    display: block;

    margin-bottom: 8px;

    font-family: "Chivo Mono", monospace;
    font-size: 9px;
    font-weight: 700;

    text-transform: uppercase;

    color: var(--purple);
}

.aoc-collab-pagination-item strong {
    display: block;

    font-family: "Archivo", sans-serif;
    font-size: 24px;
    font-weight: 800;
    line-height: 1.1;

    color: var(--ink);
}

.aoc-collab-pagination-item:hover strong {
    color: var(--purple);
}


/* =========================================================
   CTA FINAL
   ========================================================= */

.aoc-collab-cta {
    width: 100%;

    padding: 82px 30px;

    text-align: center;

    background: var(--purple);
}

.aoc-collab-cta-inner {
    max-width: 850px;
    margin: 0 auto;
}

.aoc-collab-cta-kicker {
    display: block;

    margin-bottom: 16px;

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 700;

    letter-spacing: .06em;
    text-transform: uppercase;

    color: var(--yellow);
}

.aoc-collab-cta h2 {
    margin: 0;

    font-family: "Archivo", sans-serif;
    font-size: clamp(46px, 5vw, 68px);
    font-weight: 800;
    line-height: .98;

    letter-spacing: -.045em;

    color: #FFFFFF;
}

.aoc-collab-cta a {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 52px;

    margin-top: 28px;
    padding: 0 24px;

    background: var(--yellow);

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 700;

    text-transform: uppercase;

    color: var(--purple) !important;
}

.aoc-collab-cta a:hover {
    background: #FFFFFF;
}


/* =========================================================
   FOOTER
   ========================================================= */

.aoc-single-collaboration .aoc-footer {
    width: 100%;
    max-width: none;

    margin: 0;

    background: var(--paper-2);
}


/* =========================================================
   ADMIN BAR
   ========================================================= */

.admin-bar .aoc-single-collaboration .aoc-header {
    top: 32px;
}


/* =========================================================
   TABLETTE
   ========================================================= */

@media (max-width: 1050px) {

    .aoc-collab-layout {
        grid-template-columns:
            minmax(0, 1fr)
            270px;

        gap: 45px;

        width: calc(100% - 56px);
    }

    .aoc-collab-pagination-inner {
        width: calc(100% - 56px);
    }

    .aoc-collab-project {
        grid-template-columns: 120px minmax(0, 1fr);

        gap: 30px;
    }

}


/* =========================================================
   PETITE TABLETTE
   ========================================================= */

@media (max-width: 850px) {

    .aoc-single-collaboration .nav-links {
        display: none;
    }

    .aoc-collab-page {
        padding-top: 48px;
    }

    .aoc-collab-layout {
        grid-template-columns: 1fr;

        gap: 65px;
    }

    .aoc-collab-sidebar-sticky {
        position: static;
    }

    .aoc-collab-sidebar-list {
        display: grid;

        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 0 20px;
    }

    .aoc-collab-sidebar-all {
        text-align: left;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    .aoc-single-collaboration .aoc-header .nav {
        padding: 12px 18px;
    }

    .aoc-single-collaboration .logo {
        display: none;
    }

    .aoc-single-collaboration .aoc-header-logo {
        width: 50px !important;
        height: 50px !important;
        max-width: 50px !important;
    }

    .aoc-single-collaboration .aoc-header .btn {
        min-height: 50px;

        padding: 0 17px;

        font-size: 10px;
    }


    /* PAGE */

    .aoc-collab-page {
        padding: 38px 0 58px;
    }

    .aoc-collab-layout {
        width: calc(100% - 40px);

        gap: 50px;
    }


    /* HERO */

    .aoc-collab-breadcrumb {
        margin-bottom: 25px;
    }

    .aoc-collab-hero {
        margin-bottom: 32px;
    }

    .aoc-collab-title {
        font-size: 50px !important;
    }


    /* GALERIE */

    .aoc-collab-gallery {
        margin-bottom: 42px;
    }

    .aoc-collab-gallery-count-2,
    .aoc-collab-gallery-count-3,
    .aoc-collab-gallery:not(.aoc-collab-gallery-count-1):not(.aoc-collab-gallery-count-2):not(.aoc-collab-gallery-count-3) {
        grid-template-columns: 1fr;
    }

    .aoc-collab-gallery-count-1 .aoc-collab-gallery-image,
    .aoc-collab-gallery-count-2 .aoc-collab-gallery-image,
    .aoc-collab-gallery-count-3 .aoc-collab-gallery-image,
    .aoc-collab-gallery:not(.aoc-collab-gallery-count-1):not(.aoc-collab-gallery-count-2):not(.aoc-collab-gallery-count-3)
    .aoc-collab-gallery-image {
        width: 100%;
        height: auto;
        max-height: none;

        object-fit: cover;
    }


    /* PRÉSENTATION */

    .aoc-collab-project {
        grid-template-columns: 1fr;

        gap: 20px;

        padding-top: 30px;
    }

    .aoc-collab-content {
        font-size: 15px;
    }


    /* SIDEBAR */

    .aoc-collab-sidebar-list {
        grid-template-columns: 1fr;
    }


    /* PAGINATION */

    .aoc-collab-pagination-inner {
        grid-template-columns: 1fr;

        width: calc(100% - 40px);
    }

    .aoc-collab-pagination-item {
        min-height: 110px;

        padding: 24px 0;
    }

    .aoc-collab-pagination-prev {
        padding-right: 0;
    }

    .aoc-collab-pagination-next {
        padding-left: 0;

        text-align: left;

        border-left: 0;
        border-top: 1px solid var(--gray);
    }

    .aoc-collab-pagination-item strong {
        font-size: 20px;
    }


    /* CTA */

    .aoc-collab-cta {
        padding: 60px 20px;
    }

    .aoc-collab-cta h2 {
        font-size: 42px;
    }

}


/* =========================================================
   PETIT MOBILE / ADMIN BAR
   ========================================================= */

@media (max-width: 600px) {

    .admin-bar .aoc-single-collaboration .aoc-header {
        top: 46px;
    }

}
/* =========================================================
   COLLABORATIONS — LIENS SITE / INSTAGRAM
   ========================================================= */

.aoc-collab-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 32px;
}

.aoc-collab-link-button {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;

    gap: 18px;

    min-height: 52px;
    padding: 0 20px;

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: .03em;

    transition:
        background .2s ease,
        color .2s ease;
}


/* SITE */

.aoc-collab-link-site {
    background: var(--yellow);
    color: var(--purple) !important;
}

.aoc-collab-link-site:hover {
    background: var(--purple);
    color: var(--yellow) !important;
}


/* INSTAGRAM */

.aoc-collab-link-instagram {
    border: 1px solid var(--purple);

    background: var(--paper);
    color: var(--purple) !important;
}

.aoc-collab-link-instagram:hover {
    background: var(--pink);
    color: var(--purple-deep) !important;
}
/* =========================================================
   SINGLE COLLABORATION — AJUSTEMENTS FINAUX
   ========================================================= */

/* 1. Resserre l'espace après la galerie */

.aoc-collab-gallery {
    margin-bottom: 34px;
}


/* 2. Aligne le bloc "Collaboration / contenu" sur la galerie */

.aoc-collab-project {
    grid-template-columns: 1fr;
    gap: 14px;

    padding-top: 28px;

    border-top: 1px solid var(--gray);
}

.aoc-collab-project-label {
    padding-top: 0;
}


/* 3. Le contenu reprend toute la largeur utile de la colonne */

.aoc-collab-project-content {
    max-width: none;
}

.aoc-collab-content {
    max-width: 760px;
}


/* 4. Titre de contenu un peu plus affirmé */

.aoc-collab-content h2 {
    margin-top: 8px;
    margin-bottom: 18px;

    font-size: 34px;
    line-height: 1.05;
}


/* 5. Bouton un peu mieux intégré sous le texte */

.aoc-collab-links,
.aoc-collab-site {
    margin-top: 26px;
}


/* 6. Évite un grand blanc inutile avant la pagination */

.aoc-collab-page {
    padding-bottom: 68px;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    .aoc-collab-gallery {
        margin-bottom: 30px;
    }

    .aoc-collab-project {
        padding-top: 24px;
    }

    .aoc-collab-content {
        max-width: none;
    }

    .aoc-collab-content h2 {
        font-size: 30px;
    }

}
/* =========================================================
   AOC — ESPACE PRESSE
   ========================================================= */

/* ---------- VARIABLES ---------- */

:root {
    --aoc-purple: #5B0AC4;
    --aoc-purple-deep: #33066B;
    --aoc-yellow: #ffff5d;

    --aoc-gray: #C9C8BF;
    --aoc-gray-dark: #8B8A80;

    --aoc-ink: #15120B;
    --aoc-paper: #FFFFFF;
    --aoc-paper-2: #F3F1E6;

    --aoc-peach: #FFB894;
    --aoc-mint: #8EEFC4;
    --aoc-brown: #4A3524;
}


/* =========================================================
   CONTENEUR GÉNÉRAL
   ========================================================= */

.aoc-press-page {
    width: 100%;
    max-width: 980px;
    margin: 0 auto;
    padding: 0 28px 70px;
}


/* =========================================================
   FIL D'ARIANE
   ========================================================= */

.aoc-press-breadcrumb {
    margin: 0 0 30px;

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 500;
    line-height: 1.4;

    text-transform: uppercase;
    letter-spacing: .04em;

    color: var(--aoc-gray-dark);
}

.aoc-press-breadcrumb a {
    color: inherit;
    text-decoration: none;
}

.aoc-press-breadcrumb a:hover {
    color: var(--aoc-purple);
}


/* =========================================================
   EN-TÊTE
   ========================================================= */

.aoc-press-header {
    margin-bottom: 30px;
}

.aoc-press-eyebrow {
    margin-bottom: 8px;

    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.3;

    text-transform: uppercase;
    letter-spacing: .08em;

    color: var(--aoc-purple);
}


/* TITRE ESPACE PRESSE */

.aoc-press-header h1 {
    margin: 0 !important;

    font-family: "Archivo", sans-serif !important;
    font-size: clamp(36px, 4.6vw, 52px) !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: -0.035em !important;

    color: var(--aoc-ink) !important;
}


/* INTRODUCTION */

.aoc-press-intro {
    max-width: 600px;
    margin: 16px 0 0;

    font-family: "Archivo", sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;

    color: #4a4738;
}


/* =========================================================
   FILTRES
   ========================================================= */

.aoc-press-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;

    margin: 0;
    padding: 0 0 34px;

    border-bottom: 1px solid var(--aoc-gray);
}


/* BOUTONS FILTRES */

.aoc-press-filter {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 34px;
    padding: 8px 15px;

    border: 1.5px solid var(--aoc-ink);
    border-radius: 999px;

    background: transparent;
    color: var(--aoc-ink);

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 600;
    line-height: 1;

    text-transform: uppercase;
    letter-spacing: .03em;

    text-decoration: none;

    cursor: pointer;

    transition:
        background .15s ease,
        color .15s ease;
}


.aoc-press-filter:hover,
.aoc-press-filter.is-active {
    background: var(--aoc-ink);
    color: var(--aoc-yellow);
}


/* =========================================================
   LISTE DES DOCUMENTS
   ========================================================= */

.aoc-press-list {
    display: flex;
    flex-direction: column;

    gap: 0;

    margin: 0;
    padding: 0 0 70px;
}


/* =========================================================
   UNE LIGNE / UN DOCUMENT
   ========================================================= */

.aoc-press-document {
    display: grid;

    grid-template-columns:
        90px
        minmax(0, 1fr)
        auto;

    column-gap: 20px;

    align-items: center;

    width: 100%;

    margin: 0;
    padding: 20px 16px;

    border-bottom: 1px solid var(--aoc-gray);

    background: transparent;

    transition: background .15s ease;
}


.aoc-press-document:hover {
    background: var(--aoc-paper-2);
}


/* =========================================================
   TYPE : CP / DP / REVUE
   ========================================================= */

.aoc-press-document-type {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;

    padding: 6px 8px;

    border-radius: 6px;

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;

    text-align: center;
    text-transform: uppercase;
    letter-spacing: .04em;

    white-space: nowrap;
}


/* CP */

.aoc-press-document[data-type="cp"]
.aoc-press-document-type {
    background: var(--aoc-purple);
    color: #fff;
}


/* DP */

.aoc-press-document[data-type="dp"]
.aoc-press-document-type {
    background: var(--aoc-peach);
    color: var(--aoc-brown);
}


/* REVUE DE PRESSE */

.aoc-press-document[data-type="revue"]
.aoc-press-document-type {
    background: var(--aoc-mint);
    color: var(--aoc-brown);
}


/* =========================================================
   PARTIE CENTRALE DU DOCUMENT
   ========================================================= */

.aoc-press-document-main {
    min-width: 0;

    margin: 0 !important;
    padding: 0 !important;

    max-width: none !important;
}


/* =========================================================
   TITRE DU DOCUMENT
   ========================================================= */

.aoc-press-document-main h2,
.aoc-press-document-title {
    margin: 0 !important;
    padding: 0 !important;

    max-width: 650px;

    font-family: "Archivo", sans-serif !important;
    font-size: 15.5px !important;
    font-weight: 700 !important;
    line-height: 1.28 !important;
    letter-spacing: 0 !important;

    color: var(--aoc-ink) !important;
}


/* =========================================================
   MÉTADONNÉES
   Facultatif si nous décidons de ne pas afficher les dates
   ========================================================= */

.aoc-press-meta {
    margin-top: 4px;

    font-family: "Chivo Mono", monospace;
    font-size: 10.5px;
    font-weight: 400;
    line-height: 1.4;

    text-transform: uppercase;
    letter-spacing: .03em;

    color: var(--aoc-gray-dark);
}


/* =========================================================
   LIENS ASSOCIÉS
   Référence / actualité
   ========================================================= */

.aoc-press-links {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;

    margin-top: 8px;
}


/* LIEN GÉNÉRAL */

.aoc-press-related {
    display: inline-flex;
    align-items: center;

    padding: 5px 10px;

    border-radius: 999px;

    font-family: "Chivo Mono", monospace;
    font-size: 9.5px;
    font-weight: 600;
    line-height: 1;

    letter-spacing: .02em;

    text-decoration: none;

    transition:
        background .15s ease,
        color .15s ease;
}


/* RÉFÉRENCE */

.aoc-press-related.reference {
    border: 1px solid var(--aoc-purple);

    background: var(--aoc-paper-2);
    color: var(--aoc-purple);
}

.aoc-press-related.reference:hover {
    background: var(--aoc-purple);
    color: #fff;
}


/* ACTUALITÉ */

.aoc-press-related.actualite {
    border: 1px solid var(--aoc-peach);

    background: var(--aoc-paper-2);
    color: var(--aoc-brown);
}

.aoc-press-related.actualite:hover {
    background: var(--aoc-peach);
}


/* =========================================================
   ZONE TÉLÉCHARGEMENT
   ========================================================= */

.aoc-press-document-download {
    display: flex;
    align-items: center;
    justify-content: flex-end;

    margin: 0 !important;
    padding: 0 !important;
}


/* =========================================================
   BOUTON TÉLÉCHARGER
   ========================================================= */

.aoc-press-download {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    width: auto !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 9px 14px !important;

    border: 1.5px solid var(--aoc-ink) !important;
    border-radius: 8px !important;

    background: transparent !important;
    color: var(--aoc-ink) !important;

    font-family: "Chivo Mono", monospace !important;
    font-size: 10.5px !important;
    font-weight: 600 !important;
    line-height: 1 !important;

    text-transform: uppercase;
    letter-spacing: .02em;

    white-space: nowrap;

    text-decoration: none !important;

    box-shadow: none !important;

    transition:
        background .15s ease,
        color .15s ease;
}


/* FLÈCHE */

.aoc-press-download::before {
    content: "↓";

    display: inline-block;

    margin-right: 7px;

    font-size: 13px;
    line-height: 1;
}


/* HOVER */

.aoc-press-download:hover {
    background: var(--aoc-ink) !important;
    color: var(--aoc-yellow) !important;

    text-decoration: none !important;
}


/* =========================================================
   CORRECTIONS DOWNLOAD MONITOR / EMAIL BEFORE DOWNLOAD
   ========================================================= */

/*
 * Évite que les styles des extensions recréent
 * de gros blocs ou boutons autour du lien.
 */

.aoc-press-document-download
.annabelle_download_wrapper,

.aoc-press-document-download
.wp-block-cover,

.aoc-press-document-download
.wp-block-cover__inner-container {

    width: auto !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    background: none !important;

    display: block !important;
}


.aoc-press-document-download p {
    margin: 0 !important;
    padding: 0 !important;

    font-size: inherit !important;
    line-height: inherit !important;
}


/* =========================================================
   SUPPRESSION DES IMAGES DE FOND DU VIEUX SHORTCODE
   ========================================================= */

.aoc-press-document
.annabelle_download_wrapper {

    background-image: none !important;
}


/* =========================================================
   TABLETTE
   ========================================================= */

@media (max-width: 900px) {

    .aoc-press-page {
        padding-left: 24px;
        padding-right: 24px;
    }


    .aoc-press-document {
        grid-template-columns:
            70px
            minmax(0, 1fr)
            auto;

        column-gap: 15px;

        padding-left: 10px;
        padding-right: 10px;
    }


    .aoc-press-document-main h2,
    .aoc-press-document-title {
        font-size: 15px !important;
    }


    .aoc-press-download {
        padding: 8px 11px !important;

        font-size: 9.5px !important;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 760px) {

    .aoc-press-page {
        padding-left: 20px;
        padding-right: 20px;
    }


    /* HEADER */

    .aoc-press-header h1 {
        font-size: 38px !important;
    }


    .aoc-press-intro {
        font-size: 13px;
    }


    /* FILTRES */

    .aoc-press-filters {
        gap: 7px;

        padding-bottom: 26px;
    }


    .aoc-press-filter {
        padding: 8px 12px;

        font-size: 9px;
    }


    /* DOCUMENT */

    .aoc-press-document {
        grid-template-columns:
            58px
            minmax(0, 1fr);

        grid-template-rows:
            auto
            auto;

        column-gap: 14px;
        row-gap: 10px;

        align-items: start;

        padding: 18px 4px;
    }


    /* TYPE */

    .aoc-press-document-type {
        padding: 6px 5px;

        font-size: 9px;
    }


    /* TITRE */

    .aoc-press-document-main h2,
    .aoc-press-document-title {
        font-size: 15px !important;
        line-height: 1.3 !important;
    }


    /* TÉLÉCHARGEMENT */

    .aoc-press-document-download {
        grid-column: 2;

        justify-content: flex-start;

        margin-top: 2px !important;
    }


    .aoc-press-download {
        padding: 8px 12px !important;

        font-size: 9.5px !important;
    }
}


/* =========================================================
   TRÈS PETIT MOBILE
   ========================================================= */

@media (max-width: 430px) {

    .aoc-press-page {
        padding-left: 16px;
        padding-right: 16px;
    }


    .aoc-press-header h1 {
        font-size: 34px !important;
    }


    .aoc-press-document {
        grid-template-columns:
            50px
            minmax(0, 1fr);

        column-gap: 12px;
    }


    .aoc-press-document-main h2,
    .aoc-press-document-title {
        font-size: 14px !important;
    }
}
/* =========================================================
   ESPACE PRESSE — FINITIONS
   ========================================================= */

/* Titres documents plus fins */
.aoc-press-document-main h2,
.aoc-press-document-title {
    font-size: 15.5px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
}

/* Un peu plus d'air dans chaque ligne */
.aoc-press-document {
    padding-top: 22px !important;
    padding-bottom: 22px !important;
}

/* Bouton un peu plus confortable */
.aoc-press-download {
    padding: 10px 16px !important;
    font-size: 10px !important;
}

/* Plus d'espace entre titre et bouton */
.aoc-press-document {
    column-gap: 28px !important;
}
/* =========================================================
   ESPACE PRESSE — SORTIE DU GABARIT GENERATEPRESS
   ========================================================= */

body:has(.aoc-press-page) #page,
body:has(.aoc-press-page) #content,
body:has(.aoc-press-page) #primary,
body:has(.aoc-press-page) #main,
body:has(.aoc-press-page) .site-content,
body:has(.aoc-press-page) .content-area,
body:has(.aoc-press-page) .site-main,
body:has(.aoc-press-page) .inside-article,
body:has(.aoc-press-page) .entry-content {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* notre page doit prendre toute la largeur */
.aoc-press-page {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* contenu interne centré */
.aoc-press-wrap {
    width: min(1080px, calc(100% - 80px)) !important;
    max-width: none !important;
    margin: 0 auto !important;
    padding: 32px 0 70px !important;
}

/* contact et footer sur toute la largeur */
.aoc-press-contact,
.aoc-footer {
    width: 100% !important;
    max-width: none !important;
}
/* ==========================================================================
   ESPACE PRESSE — HEADER STRICTEMENT IDENTIQUE À ACCUEIL26
   ========================================================================== */

.aoc-press-page .aoc-header{
    position:sticky;
    top:0;
    z-index:100;

    width:100%;

    background:rgba(253,252,246,.94);

    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);

    border-bottom:1px solid #C9C8BF;
}


/* NAV — EXACTEMENT HOME */

.aoc-press-page .aoc-header .nav{
    display:flex;
    align-items:center;
    justify-content:space-between;

    width:100%;
    max-width:none;

    margin:0;

    padding:16px 32px;
}


/* MARQUE */

.aoc-press-page .brand{
    display:flex;
    align-items:center;
    gap:12px;
}

.aoc-press-page .aoc-logo-link{
    display:block;
    flex-shrink:0;
}

.aoc-press-page .aoc-header-logo{
    width:60px !important;
    height:60px !important;
    max-width:60px !important;

    display:block;

    object-fit:cover;
    border-radius:50%;

    flex-shrink:0;
}


/* NOM */

.aoc-press-page .logo{
    font-family:'Archivo',sans-serif;

    font-weight:800;
    font-size:17px;

    letter-spacing:-.01em;
    line-height:1.1;

    color:#15120B;
}

.aoc-press-page .logo small{
    display:block;

    margin-top:2px;

    font-family:'Chivo Mono',monospace;
    font-weight:400;
    font-size:11px;

    letter-spacing:.1em;

    color:#8B8A80;

    text-transform:uppercase;
}


/* MENU CENTRAL */

.aoc-press-page .nav-links{
    display:flex;
    align-items:center;

    gap:30px;

    margin:0;

    font-family:'Archivo',sans-serif;
    font-size:14px;
    font-weight:500;
}

.aoc-press-page .nav-links a{
    position:relative;

    padding-bottom:3px;

    color:#15120B;
    text-decoration:none;
}

.aoc-press-page .nav-links a::after{
    content:"";

    position:absolute;
    left:0;
    bottom:0;

    width:0;
    height:2px;

    background:#7500CA;

    transition:width .2s ease;
}

.aoc-press-page .nav-links a:hover::after{
    width:100%;
}


/* CONTACT — EXACTEMENT HOME */

.aoc-press-page .aoc-header .btn{
    font-family:'Chivo Mono',monospace;

    font-size:13px;
    font-weight:500;

    letter-spacing:.03em;
    text-transform:uppercase;

    padding:15px 28px;

    display:inline-flex;
    align-items:center;
    gap:10px;

    border:2px solid #FFFF5D;

    min-height:0;

    transition:
        background .2s ease,
        color .2s ease,
        border-color .2s ease;
}

.aoc-press-page .aoc-header .btn-solid{
    background:#FFFF5D;
    color:#7500CA;

    border-color:#FFFF5D;
}

.aoc-press-page .aoc-header .btn-solid:hover{
    background:#7500CA;
    color:#FFFF5D;

    border-color:#7500CA;
}


/* ADMIN WORDPRESS */

.admin-bar .aoc-press-page .aoc-header{
    top:32px;
}


/* TABLETTE */

@media (max-width:900px){

    .aoc-press-page .nav-links{
        display:none;
    }
}


/* MOBILE */

@media (max-width:700px){

    .aoc-press-page .aoc-header .nav{
        padding:12px 18px;
    }

    .aoc-press-page .logo{
        display:none;
    }

    .aoc-press-page .aoc-header-logo{
        width:50px !important;
        height:50px !important;
        max-width:50px !important;
    }
}
/* =========================================================
   SÉCURITÉ : EMPÊCHE LE LOGO WORDPRESS DE DEVENIR GÉANT
   ========================================================= */

.aoc-press-standalone .aoc-header img.custom-logo,
.aoc-press-standalone .aoc-header .custom-logo {
    width: 46px !important;
    height: 46px !important;
    max-width: 46px !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 900px) {

    .aoc-press-standalone .aoc-header {
        padding: 0 18px;
    }

    .aoc-press-standalone .aoc-header .nav {
        height: 68px;
    }

    .aoc-press-standalone .nav-links {
        display: none;
    }

    .aoc-press-standalone .aoc-logo-link,
    .aoc-press-standalone .aoc-header-logo,
    .aoc-press-standalone .aoc-header img.custom-logo {
        width: 40px !important;
        height: 40px !important;
        max-width: 40px !important;
    }

    .aoc-press-standalone .aoc-header .logo {
        font-size: 13px;
    }

    .aoc-press-standalone .aoc-header .btn {
        min-height: 40px;
        padding: 0 15px;
        font-size: 9px;
    }
}
/* =========================================================
   ESPACE PRESSE — FOND + CONTACT + FOOTER
   ========================================================= */


/* ---------------------------------------------------------
   FOND GLOBAL ÉCRU
   --------------------------------------------------------- */

html,
body.aoc-press-standalone {
    background: #FFFFFF !important;
}

body.aoc-press-standalone,
body.aoc-press-standalone .aoc-press-page,
body.aoc-press-standalone main {
    background: #FFFFFF !important;
}


/* La zone principale ne doit jamais reprendre le gris GeneratePress */

.aoc-press-standalone .aoc-press-wrap,
.aoc-press-standalone .aoc-press-content,
.aoc-press-standalone .aoc-press-list {
    background: #FFFFFF !important;
}


/* =========================================================
   CONTACT PRESSE
   ========================================================= */

.aoc-press-standalone .aoc-press-contact {
    width: 100%;
    margin: 0;
    padding: 58px 0;

    background: #FFB894;
}

.aoc-press-standalone .aoc-press-contact-inner {
    width: min(1080px, calc(100% - 80px));
    margin: 0 auto;

    display: grid;
    grid-template-columns: 1.4fr .7fr;
    gap: 70px;
    align-items: end;
}

.aoc-press-standalone .aoc-press-contact-eyebrow {
    margin-bottom: 10px;

    font-family: "Chivo Mono", monospace;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .07em;

    color: #5B0AC4;
}

.aoc-press-standalone .aoc-press-contact h2 {
    margin: 0 !important;

    max-width: 650px;

    font-family: "Archivo", sans-serif !important;
    font-size: clamp(30px, 3vw, 44px) !important;
    font-weight: 700 !important;
    line-height: 1.02 !important;
    letter-spacing: -.035em !important;

    color: #15120B !important;
}

.aoc-press-standalone .aoc-press-contact-details {
    display: flex;
    flex-direction: column;
    gap: 7px;

    font-family: "Archivo", sans-serif;
    font-size: 13px;
    line-height: 1.4;
}

.aoc-press-standalone .aoc-press-contact-details strong {
    font-size: 15px;
}

.aoc-press-standalone .aoc-press-contact-details a {
    color: #5B0AC4;
    text-decoration: none;
}

.aoc-press-standalone .aoc-press-contact-details a:hover {
    text-decoration: underline;
}


/* ==========================================================================
   ESPACE PRESSE — ALIGNEMENT STRICT SUR ACCUEIL26
   ========================================================================== */

/* VARIABLES DE LA HOME */

.aoc-press-page {
    --purple:#7500CA;
    --purple-deep:#33066B;
    --yellow:#FFFF5D;
    --gray:#C9C8BF;
    --gray-dark:#8B8A80;
    --paper: #FFFFFF;
    --paper-2:#F3F1E6;
    --ink:#15120B;

    width:100%;
    min-height:100vh;

    background:var(--paper);
    color:var(--ink);
}


/* FOND CRÈME PARTOUT */

html,
body.aoc-press-standalone {
    background:#FFFFFF !important;
}

body.aoc-press-standalone .aoc-press-page,
body.aoc-press-standalone .aoc-press-wrap,
body.aoc-press-standalone .aoc-press-content,
body.aoc-press-standalone .aoc-press-list {
    background:#FFFFFF !important;
}


/* ==========================================================================
   FOOTER — COPIE DES VALEURS ACCUEIL26
   ========================================================================== */

.aoc-press-page .aoc-footer {
    width:100%;

    background:var(--paper-2);
    color:var(--purple-deep);

    padding:40px 32px 22px;
}


/* NEWSLETTER */

.aoc-press-page .footer-newsletter {
    max-width:1280px;

    margin:0 auto 35px;
    padding-bottom:35px;

    border-bottom:1px solid var(--gray);

    display:grid;
    grid-template-columns:1fr 1fr;

    gap:50px;
    align-items:end;
}

.aoc-press-page .footer-newsletter h4 {
    font-family:'Chivo Mono', monospace;
    font-size:11px;
    font-weight:500;

    text-transform:uppercase;
    letter-spacing:.1em;

    color:var(--purple);

    margin:0 0 15px;
}

.aoc-press-page .footer-newsletter h3 {
    font-family:'Archivo', sans-serif;

    font-size:clamp(28px,3vw,42px);
    font-weight:800;
    line-height:1.05;

    color:var(--purple-deep);

    margin:0;
}

.aoc-press-page .footer-newsletter-text p {
    color:var(--purple-deep);

    font-size:14px;
    font-weight:400;

    margin:16px 0 0;

    max-width:430px;
}


/* FORMULAIRE */

.aoc-press-page .aoc-newsletter-form label {
    display:block;

    font-family:'Chivo Mono', monospace;
    font-size:11px;
    font-weight:500;

    color:var(--purple);

    text-transform:uppercase;
    letter-spacing:.06em;

    margin-bottom:10px;
}

.aoc-press-page .newsletter-fields {
    display:flex;
    width:100%;
}

.aoc-press-page .newsletter-fields input {
    flex:1;
    min-width:0;

    padding:16px 18px;

    border:2px solid var(--purple);

    background:#fff;
    color:var(--purple-deep);

    font-family:'Archivo', sans-serif;
    font-size:15px;

    border-radius:0;
}

.aoc-press-page .newsletter-fields button {
    border:2px solid var(--yellow);

    background:var(--yellow);
    color:var(--purple);

    padding:16px 24px;

    font-family:'Chivo Mono', monospace;
    font-size:12px;
    font-weight:500;

    text-transform:uppercase;
    letter-spacing:.05em;

    border-radius:0;
}

.aoc-press-page .newsletter-fields button:hover {
    background:var(--purple);
    border-color:var(--purple);
    color:var(--yellow);
}

.aoc-press-page .newsletter-legal {
    color:var(--purple-deep);

    font-family:'Chivo Mono', monospace;
    font-size:10px;
    line-height:1.5;

    margin:10px 0 0;
}


/* ==========================================================================
   COLONNES FOOTER
   ========================================================================== */

.aoc-press-page .footer-grid {
    display:grid;
    grid-template-columns:1.4fr 1fr 1fr 1fr;

    gap:30px;

    max-width:1280px;
    margin:0 auto;

    padding-bottom:30px;

    border-bottom:1px solid var(--gray);
}

.aoc-press-page .footer-grid h4 {
    font-family:'Chivo Mono', monospace;
    font-size:11px;
    font-weight:500;

    text-transform:uppercase;
    letter-spacing:.1em;

    color:var(--purple);

    margin-bottom:16px;
}

.aoc-press-page .footer-grid p,
.aoc-press-page .footer-grid a {
    font-family:'Archivo', sans-serif;

    font-size:14px;
    font-weight:400;

    color:var(--purple-deep);

    display:block;

    margin-bottom:10px;
}

.aoc-press-page .footer-grid a:hover {
    color:var(--purple);
}


/* ==========================================================================
   BAS FOOTER
   ========================================================================== */

.aoc-press-page .footer-bottom {
    display:flex;
    justify-content:space-between;

    max-width:1280px;

    margin:0 auto;

    padding-top:18px;

    font-family:'Chivo Mono', monospace;
    font-size:11px;

    color:var(--purple-deep);

    flex-wrap:wrap;
    gap:10px;
}


/* ==========================================================================
   RESPONSIVE — IDENTIQUE HOME
   ========================================================================== */

@media (max-width:900px) {

    .aoc-press-page .footer-grid {
        grid-template-columns:1fr 1fr;
    }

    .aoc-press-page .footer-newsletter {
        grid-template-columns:1fr;
        gap:35px;
    }

    .aoc-press-page .newsletter-fields {
        flex-direction:column;
    }

    .aoc-press-page .newsletter-fields button {
        width:100%;
    }
}

@media (max-width:600px) {

    .aoc-press-page .footer-grid {
        grid-template-columns:1fr;
    }
}
/* =========================================================
   AOC — RETOUR AU FOND CRÈME
   ========================================================= */

html,
body.aoc-press-standalone,
.aoc-press-page,
.aoc-press-wrap,
.aoc-press-content,
.aoc-press-list {
    background: #FFFFFF !important;
}

.aoc-press-contact {
    background: #FFB894 !important;
}

/* Ne pas appliquer le gris GeneratePress autour de la page */
body.aoc-press-standalone {
    background-color: #FFFFFF !important;
}
/* ==========================================================================
   AOC — FOND CRÈME GLOBAL
   ========================================================================== */

html,
body,
body.aoc-press-standalone,
.aoc-press-page,
.aoc-press-wrap,
.aoc-press-content,
.aoc-press-list,
.aoc-press-document {
    background-color: #FFFFFF !important;
}


/* Neutralise les fonds GeneratePress */
body.aoc-press-standalone #page,
body.aoc-press-standalone #content,
body.aoc-press-standalone #primary,
body.aoc-press-standalone #main,
body.aoc-press-standalone .site-content,
body.aoc-press-standalone .content-area,
body.aoc-press-standalone .site-main,
body.aoc-press-standalone .inside-article,
body.aoc-press-standalone .entry-content {
    background: #FFFFFF !important;
}


/* Le hover des documents reste légèrement plus soutenu */
.aoc-press-document:hover {
    background: #F3F1E6 !important;
}


/* CONTACT PRESSE : on garde le pêche */
.aoc-press-contact {
    background: #FFB894 !important;
}


/* FOOTER : crème légèrement plus foncé comme sur l'accueil */
.aoc-footer {
    background: #F3F1E6 !important;
}
@media (max-width: 900px) {
    .aoc-actus-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .aoc-actus-grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }
}
/* ==================================================
   PAGE MENTIONS LÉGALES
================================================== */

.aoc-legal-page-template ~ * {
}

/* Masquer le header natif GeneratePress sur la page */
body.page-template-page-mentions-legales #masthead,
body.page-template-page-mentions-legales .site-header,
body.page-template-page-mentions-legales #site-navigation {
    display: none !important;
}

/* Supprimer les marges GeneratePress */
body.page-template-page-mentions-legales #page,
body.page-template-page-mentions-legales .site-content,
body.page-template-page-mentions-legales .content-area,
body.page-template-page-mentions-legales main.site-main {
    margin: 0 !important;
    padding: 0 !important;
    max-width: none !important;
}

/* Fond général */
body.page-template-page-mentions-legales {
    background: #f7f5ed;
}

/* Zone principale */
.aoc-legal-main {
    background: #f7f5ed;
    padding: 70px 24px 100px;
}

.aoc-legal-page {
    width: min(1100px, calc(100% - 48px));
    margin: 0 auto;
}

/* Fil d'Ariane */
.aoc-legal-breadcrumb {
    display: flex;
    gap: 8px;
    margin-bottom: 35px;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .06em;
    opacity: .6;
}

.aoc-legal-breadcrumb a {
    color: inherit;
    text-decoration: none;
}

/* Intro */
.aoc-legal-head {
    margin-bottom: 65px;
}

.aoc-legal-eyebrow {
    margin-bottom: 14px;
    color: var(--purple);
    font-family: "Chivo Mono", monospace;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.aoc-legal-head h1 {
    margin: 0;
    font-size: clamp(48px, 6vw, 82px);
    line-height: .95;
    letter-spacing: -.04em;
}

/* Contenu */
.aoc-legal-content {
    max-width: 820px;
}

.aoc-legal-content section {
    padding: 35px 0;
    border-top: 1px solid rgba(0,0,0,.18);
}

.aoc-legal-content section:last-child {
    border-bottom: 1px solid rgba(0,0,0,.18);
}

.aoc-legal-content h2 {
    margin: 0 0 20px;
    font-size: 28px;
    line-height: 1.1;
}

.aoc-legal-content p {
    margin: 0 0 18px;
    font-size: 16px;
    line-height: 1.65;
}

.aoc-legal-content p:last-child {
    margin-bottom: 0;
}

.aoc-legal-content a {
    color: var(--purple);
    text-decoration: none;
}

.aoc-legal-content a:hover {
    text-decoration: underline;
}

@media (max-width: 768px) {

    .aoc-legal-main {
        padding: 45px 20px 70px;
    }

    .aoc-legal-page {
        width: 100%;
    }

    .aoc-legal-head {
        margin-bottom: 40px;
    }

    .aoc-legal-content h2 {
        font-size: 23px;
    }

}
/* ==================================================
   MENTIONS LÉGALES — MASQUER HEADER/FOOTER GENERATEPRESS
================================================== */

body.page-template-page-mentions-legales #masthead,
body.page-template-page-mentions-legales .site-header,
body.page-template-page-mentions-legales .site-footer,
body.page-template-page-mentions-legales .site-info {
    display: none !important;
}
/* =========================================================
   AOC — DOCUMENT PRESSE DANS UNE ACTU
   ========================================================= */

.aoc-actu-press {
    margin: 36px 0 30px;
    padding-top: 22px;
    border-top: 1px solid rgba(21, 18, 11, .18);
}

.aoc-actu-press-label {
    margin-bottom: 12px;

    font-family: 'Chivo Mono', monospace;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .08em;

    color: #7500CA;
}

.aoc-actu-press-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Carte document */
.aoc-actu-press-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;

    padding: 14px 16px;

    border: 1px solid #7500CA;
}

/* Titre du document */
.aoc-actu-press-title {
    font-family: 'Archivo', sans-serif;
    font-size: 14px;
    line-height: 1.35;
    font-weight: 600;

    color: #15120B;
}

/* Bouton Download Monitor */
.aoc-actu-press .download-link,
.aoc-actu-press .download-button,
.aoc-actu-press a {
    font-family: 'Chivo Mono', monospace;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;

    color: #7500CA;
    text-decoration: none;
}

/* Hover */
.aoc-actu-press a:hover {
    text-decoration: underline;
}

/* Mobile */
@media (max-width: 700px) {

    .aoc-actu-press-item {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
    }

}
/* =========================================================
   ACTU — DOCUMENT PRESSE
   ========================================================= */

.aoc-actu-press {
    margin: 36px 0 30px;
    padding-top: 22px;
    border-top: 1px solid rgba(21, 18, 11, .18);
}

.aoc-actu-press-label {
    margin-bottom: 12px;
    font-family: 'Chivo Mono', monospace;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #7500CA;
}

.aoc-actu-press-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.aoc-actu-press-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 30px;

    padding: 18px 20px;
    border: 1px solid #7500CA;
}

.aoc-actu-press-title {
    font-family: 'Archivo', sans-serif;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 600;
    color: #15120B;
}


/* ---------------------------------------------------------
   DOWNLOAD MONITOR
   Cache son titre répété et affiche notre propre libellé
   --------------------------------------------------------- */

.aoc-actu-press-download a {
    font-family: 'Chivo Mono', monospace;
    font-size: 10.5px !important;
    font-weight: 600;
    line-height: 1;
    letter-spacing: .04em;
    text-transform: uppercase;

    color: #7500CA !important;
    text-decoration: none !important;
    white-space: nowrap;
}

.aoc-actu-press-download a:hover {
    text-decoration: underline !important;
}


/* MOBILE */

@media (max-width: 700px) {

    .aoc-actu-press-item {
        grid-template-columns: 1fr;
        gap: 12px;
    }

}
/* =========================================================
   ACTUS — LÉGENDES DES IMAGES
   ========================================================= */

.aoc-actu-gallery-figure {
    margin: 0;
    min-width: 0;
}

.aoc-actu-gallery-figure img {
    width: 100%;
    display: block;
}

.aoc-actu-gallery-caption {
    margin-top: 8px;

    font-family: 'Archivo', sans-serif;
    font-size: 11px;
    line-height: 1.45;
    font-weight: 400;

    color: #8B8A80;
}

.aoc-actu-gallery-caption p {
    margin: 0;
}

.aoc-actu-gallery-caption a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 2px;
}


/* Un peu plus d'air quand plusieurs images sont côte à côte */

.aoc-actu-gallery {
    align-items: start;
}


/* MOBILE */

@media (max-width: 700px) {

    .aoc-actu-gallery-caption {
        margin-top: 6px;
        font-size: 10.5px;
        line-height: 1.4;
    }

}
.aoc-actu-gallery-caption {
    margin-top: 7px;
    margin-bottom: 28px;

    font-family: 'Archivo', sans-serif;
    font-size: 10px;
    line-height: 1.4;
    font-weight: 400;

    color: #8B8A80;
}

.aoc-actu-gallery-caption p {
    margin: 0;
}

/* =========================================================
   ACTUS — COULEURS DES STATUTS
   ========================================================= */

/* EN COURS */
.aoc-actu-status-now,
.aoc-actu-single-status-now {
    background: #8EEFC4 !important;
    color: #15120B !important;
}

/* À VENIR */
.aoc-actu-status-soon,
.aoc-actu-single-status-soon {
    background: #F5EA00 !important;
    color: #15120B !important;
}

/* PASSÉE */
.aoc-actu-status-past,
.aoc-actu-single-status-past {
    background: #E7E4D8 !important;
    color: #6F6B60 !important;
}



/* =========================================================
   HEADER — BOUTON CONTACT
   FORME CLAUDE CONSERVÉE
   ========================================================= */

.aoc-header .btn.btn-solid {
    clip-path: polygon(
        0.00% 44.12%,
        0.00% 55.78%,
        2.33% 59.03%,
        1.05% 67.23%,
        7.36% 95.17%,
        9.58% 90.23%,
        9.95% 99.89%,
        90.03% 99.89%,
        90.40% 90.23%,
        92.61% 95.17%,
        98.90% 67.23%,
        97.97% 56.62%,
        99.98% 55.78%,
        99.98% 44.12%,
        97.65% 40.97%,
        98.90% 32.56%,
        92.59% 4.62%,
        90.38% 9.56%,
        90.03% 0.00%,
        9.95% 0.00%,
        9.65% 9.35%,
        7.39% 4.62%,
        1.05% 32.67%,
        2.17% 42.44%
    );

    -webkit-clip-path: polygon(
        0.00% 44.12%,
        0.00% 55.78%,
        2.33% 59.03%,
        1.05% 67.23%,
        7.36% 95.17%,
        9.58% 90.23%,
        9.95% 99.89%,
        90.03% 99.89%,
        90.40% 90.23%,
        92.61% 95.17%,
        98.90% 67.23%,
        97.97% 56.62%,
        99.98% 55.78%,
        99.98% 44.12%,
        97.65% 40.97%,
        98.90% 32.56%,
        92.59% 4.62%,
        90.38% 9.56%,
        90.03% 0.00%,
        9.95% 0.00%,
        9.65% 9.35%,
        7.39% 4.62%,
        1.05% 32.67%,
        2.17% 42.44%
    );

    background: #ffff5d !important;
    background-color: #ffff5d !important;
    background-image: none !important;

    color: #7500ca !important;
    border: 0 !important;

    opacity: 1 !important;
    filter: none !important;
    mix-blend-mode: normal !important;

    min-width: 150px;
    height: 54px;
    padding: 0 34px !important;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    font-family: 'Chivo Mono', monospace;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .03em;

    transition: none !important;
}


/* =========================================================
   DESKTOP — SURVOL AVEC SOURIS
   ========================================================= */

@media (hover: hover) and (pointer: fine) {

    .aoc-page .aoc-header .btn.btn-solid:hover {
        background: #7500ca !important;
        background-color: #7500ca !important;
        background-image: none !important;

        color: #ffff5d !important;

        opacity: 1 !important;
        filter: none !important;

        transform: translateY(-2px);
    }

}



/* =========================================================
   MOBILE — CONTACT : JAUNE AU REPOS, VIOLET AU CLIC
   ========================================================= */

@media (hover: none) {

    /* Jaune au repos */
    .aoc-page .aoc-header .btn.btn-solid {
        background: #ffff5d !important;
        background-color: #ffff5d !important;
        background-image: none !important;

        color: #7500ca !important;

        opacity: 1 !important;
        filter: none !important;
        mix-blend-mode: normal !important;

        -webkit-tap-highlight-color: transparent;

        transform: none !important;
        transition: none !important;
    }

    /* Violet dès le clic et pendant le focus */
    .aoc-page .aoc-header .btn.btn-solid:hover,
    .aoc-page .aoc-header .btn.btn-solid:focus,
    .aoc-page .aoc-header .btn.btn-solid:active {
        background: #7500ca !important;
        background-color: #7500ca !important;
        background-image: none !important;

        color: #ffff5d !important;

        opacity: 1 !important;
        filter: none !important;
        mix-blend-mode: normal !important;

        transform: none !important;
        transition: none !important;
    }

}

/* =========================================================
   HEADER — CONTACT : PAGE ACTIVE
   ========================================================= */

.aoc-page .aoc-header .btn.btn-solid[aria-current="page"],
.aoc-page .aoc-header .btn.btn-solid.current {
    background: #7500ca !important;
    background-color: #7500ca !important;
    color: #ffff5d !important;
}
/* =========================================================
   HEADER — SUPPRESSION DE L'ESPACE SUPÉRIEUR
   ========================================================= */

.aoc-page {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.aoc-header {
    margin-top: 0 !important;
}


/* =========================================================
   HEADER AOC — RESPONSIVE MOBILE
   ========================================================= */

/* BURGER : masqué sur desktop */

.aoc-page .aoc-menu-toggle {
    display: none;

    width: 46px;
    height: 46px;

    padding: 0;

    border: 0;

    background: transparent;

    cursor: pointer;

    flex-shrink: 0;

    align-items: center;
    justify-content: center;
    flex-direction: column;

    gap: 5px;
}

.aoc-page .aoc-menu-toggle span {
    display: block;

    width: 24px;
    height: 2px;

    background: var(--purple);

    transition:
        transform .25s ease,
        opacity .25s ease;
}


/* MENU MOBILE : masqué par défaut */

.aoc-page .aoc-mobile-menu {
    display: none;

    position: absolute;

    top: 100%;
    left: 0;
    right: 0;

    width: 100%;

    padding: 12px 20px 20px;

    background: var(--paper);

    border-bottom: 1px solid var(--gray);

    z-index: 200;
}


/* MENU OUVERT */

.aoc-page .aoc-mobile-menu.is-open {
    display: flex;
    flex-direction: column;
}


/* LIENS MOBILE */

.aoc-page .aoc-mobile-menu a {
    display: block;

    padding: 17px 4px;

    border-bottom: 1px solid var(--gray);

    font-family: 'Archivo', sans-serif;

    font-size: 18px;
    font-weight: 700;

    color: var(--ink);
}

.aoc-page .aoc-mobile-menu a:last-child {
    border-bottom: 0;
}

.aoc-page .aoc-mobile-menu a:hover {
    color: var(--purple);
}


/* BURGER → CROIX */

.aoc-page .aoc-menu-toggle.is-open span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.aoc-page .aoc-menu-toggle.is-open span:nth-child(2) {
    opacity: 0;
}

.aoc-page .aoc-menu-toggle.is-open span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}


/* =========================================================
   TABLETTE / MOBILE
   ========================================================= */

@media (max-width: 900px) {

    /* Le menu desktop disparaît */
    .aoc-page .nav-links {
        display: none;
    }

    /* Le burger apparaît */
    .aoc-page .aoc-menu-toggle {
        display: flex;
    }

    .aoc-page .nav {
        gap: 14px;
    }

    .aoc-page .brand {
        margin-right: auto;
    }

    /* Contact reste visible */
    .aoc-page .aoc-header-contact {
        flex-shrink: 0;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

    .aoc-page .nav {
        padding: 12px 16px;
        gap: 8px;
    }

    /* Le nom disparaît, comme prévu dans le CSS existant */
    .aoc-page .logo {
        display: none;
    }

    .aoc-page .aoc-header-logo {
        width: 48px;
        height: 48px;
    }

    /* Bouton Contact : dimensions mobiles */
    .aoc-page .aoc-header-contact {
        min-width: 110px !important;
        height: 50px !important;

        padding-left: 20px !important;
        padding-right: 20px !important;

        font-size: 10px !important;
    }

    .aoc-page .aoc-menu-toggle {
        width: 42px;
        height: 42px;
    }

    .aoc-page .aoc-mobile-menu {
        padding-left: 18px;
        padding-right: 18px;
    }

}


/* =========================================================
   HEADER MOBILE — FINITIONS
   ========================================================= */

@media (max-width: 600px) {

    /* Burger plus discret */
    .aoc-page .aoc-menu-toggle {
        width: 38px;
        height: 38px;

        border: 0 !important;
        outline: none !important;
        box-shadow: none !important;

        background: transparent !important;
    }

    .aoc-page .aoc-menu-toggle:focus,
    .aoc-page .aoc-menu-toggle:focus-visible {
        outline: none !important;
        box-shadow: none !important;
    }

    .aoc-page .aoc-menu-toggle span {
        width: 22px;
        height: 2px;
    }

    /* Menu un peu plus compact */
    .aoc-page .aoc-mobile-menu {
        padding-top: 6px;
        padding-bottom: 10px;
    }

    .aoc-page .aoc-mobile-menu a {
        padding: 14px 4px;

        font-size: 17px;
        line-height: 1.15;
    }

}

/* =========================================================
   FOOTER AOC — VERSION COMPACTE
========================================================= */

.aoc-page .aoc-footer {
    padding: 42px 0 22px !important;
}


/* NEWSLETTER */

.aoc-page .footer-newsletter {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 32px 32px;

    display: grid;
    grid-template-columns: .9fr 1.35fr;
    gap: 70px;
    align-items: center;

    border: 0 !important;
}

.aoc-page .footer-newsletter-text h4 {
    margin: 0 0 10px;

    font-size: 12px;
    line-height: 1.2;

    text-transform: uppercase;
    letter-spacing: .08em;
}

.aoc-page .footer-newsletter-text h3 {
    display: none !important;
}

.aoc-page .footer-newsletter-text p {
    margin: 0;

    font-size: 16px;
    line-height: 1.45;
}


/* FORMULAIRE */

.aoc-page .footer-newsletter-form {
    margin: 0;
}

.aoc-page .aoc-newsletter-form label {
    display: block;
    margin-bottom: 8px;
}

.aoc-page .newsletter-fields {
    display: flex;
}

.aoc-page .newsletter-fields input {
    min-height: 52px;
}

.aoc-page .newsletter-fields button {
    min-height: 52px;
}

.aoc-page .newsletter-legal {
    margin: 8px 0 0 !important;
}


/* UN SEUL SÉPARATEUR */

.aoc-page .footer-separator {
    max-width: 1180px;
    height: 1px;

    margin: 0 auto 30px;

    background: rgba(117, 0, 202, .18);
}


/* COLONNES */

.aoc-page .footer-grid {
    max-width: 1100px;
    margin: 0 auto;

    padding: 0 32px 28px;

    display: grid;
    grid-template-columns: 1.35fr .8fr .8fr .8fr;
    gap: 60px;

    border: 0 !important;
}

.aoc-page .footer-grid h4 {
    margin: 0 0 14px;
}

.aoc-page .footer-grid p {
    margin: 0;

    max-width: 270px;
    line-height: 1.45;
}

.aoc-page .footer-grid a {
    display: block;
    margin-bottom: 8px;
}


/* BAS FOOTER */

.aoc-page .footer-bottom {
    max-width: 1100px;
    margin: 0 auto;

    padding: 18px 32px 0;

    display: flex;
    justify-content: space-between;
    align-items: center;

    border-top: 1px solid rgba(117, 0, 202, .18);
}

.aoc-page .footer-bottom a {
    color: inherit;
    text-decoration: none;
}

.aoc-page .footer-bottom a:hover {
    color: var(--purple);
}


/* MOBILE */

@media (max-width: 700px) {

    .aoc-page .aoc-footer {
        padding-top: 30px !important;
    }

    .aoc-page .footer-newsletter {
        grid-template-columns: 1fr;
        gap: 24px;

        padding: 0 20px 28px;
    }

    .aoc-page .newsletter-fields {
        flex-direction: column;
    }

    .aoc-page .newsletter-fields button {
        width: 100%;
    }

    .aoc-page .footer-separator {
        margin-left: 20px;
        margin-right: 20px;
        margin-bottom: 26px;
    }

    .aoc-page .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 28px 30px;

        padding: 0 20px 28px;
    }

    .aoc-page .footer-bottom {
        margin: 0 20px;
        padding: 18px 0 0;

        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

}
/* =========================================================
   HEADER — APPARENCE IDENTIQUE AU SCROLL
========================================================= */

.aoc-page .aoc-header,
.aoc-page .aoc-header.is-sticky,
.aoc-page .aoc-header.sticky,
.aoc-page .aoc-header.scrolled {
    background: var(--paper) !important;
    color: var(--ink) !important;
    opacity: 1 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.aoc-page .aoc-header .nav {
    background: var(--paper) !important;
}

.aoc-page .aoc-header .nav-links a {
    color: var(--ink) !important;
}

.aoc-page .aoc-header .nav-links a:hover {
    color: var(--purple) !important;
}
.site-info {
    display: none !important;
}
/* FOOTER — dernières finitions */

/* Supprime le 2e séparateur */
.aoc-page .footer-bottom {
    border-top: 0 !important;
    padding-top: 8px !important;
}

/* Réduit légèrement l'espace sous les colonnes */
.aoc-page .footer-grid {
    padding-bottom: 14px !important;
}

/* Footer bottom plus compact */
.aoc-page .footer-bottom {
    padding-bottom: 0 !important;
}
/* =========================================================
   FOOTER — COMPACTAGE FINAL
========================================================= */

/* Footer global un peu plus compact */
.aoc-page .aoc-footer {
    padding-top: 30px !important;
    padding-bottom: 14px !important;
}

/* Newsletter */
.aoc-page .footer-newsletter {
    padding-bottom: 24px !important;
}

/* Petit espace entre champ email et bouton */
.aoc-page .newsletter-fields {
    gap: 8px !important;
}

/* On conserve le champ flexible */
.aoc-page .newsletter-fields input {
    flex: 1;
}

/* Séparateur plus proche des contenus */
.aoc-page .footer-separator {
    margin-bottom: 24px !important;
}

/* Colonnes plus compactes */
.aoc-page .footer-grid {
    padding-bottom: 8px !important;
}

/* Liens légèrement rapprochés */
.aoc-page .footer-grid a {
    margin-bottom: 6px !important;
}

/* Ligne finale */
.aoc-page .footer-bottom {
    padding-top: 6px !important;
    padding-bottom: 0 !important;
}
/* =========================================================
   FOOTER MOBILE — FINITIONS
========================================================= */

@media (max-width: 700px) {

    /* Newsletter : légèrement plus compacte */
    .aoc-page .footer-newsletter {
        padding-bottom: 18px !important;
    }

    .aoc-page .footer-newsletter-text {
        margin-bottom: 18px !important;
    }

    /* Bouton jaune comme sur desktop */
    .aoc-page .newsletter-fields button {
        background: var(--yellow) !important;
        color: var(--purple) !important;
        border: 0 !important;
    }

    /* Séparateur */
    .aoc-page .footer-separator {
        margin-bottom: 18px !important;
    }

    /* Les 4 blocs : beaucoup moins d'espace vertical */
    .aoc-page .footer-grid {
        grid-template-columns: 1fr 1fr !important;
        column-gap: 28px !important;
        row-gap: 18px !important;
        padding-bottom: 18px !important;
    }

    .aoc-page .footer-grid h4 {
        margin-bottom: 8px !important;
    }

    .aoc-page .footer-grid p,
    .aoc-page .footer-grid a {
        font-size: 13px !important;
        line-height: 1.35 !important;
    }

    .aoc-page .footer-grid a {
        margin-bottom: 5px !important;
    }

    /* Copyright + email rapprochés */
    .aoc-page .footer-bottom {
        padding-top: 0 !important;
        padding-bottom: 4px !important;
        gap: 4px !important;
    }
}
/* Supprime le liseré blanc sous le footer */
.aoc-page .aoc-footer {
    margin-bottom: 0 !important;
}

.aoc-page {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

.site-content,
#page,
#content,
body {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.site-footer,
.site-info {
    display: none !important;
}
/* =========================================================
   ACCUEIL — SUPPRESSION BANDE BLANCHE SOUS LE FOOTER
========================================================= */

.page-id-7690 .inside-article {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

.page-id-7690 .entry-content {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

.page-id-7690 article {
    margin-bottom: 0 !important;
}

.page-id-7690 .aoc-page,
.page-id-7690 .aoc-footer {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}
/* =========================================================
   CONTACT — FORCER LE FOOTER MAÎTRE GLOBAL
========================================================= */

.aoc-contact-page .footer-newsletter {
    max-width: 1180px !important;
    width: auto !important;

    margin: 0 auto !important;
    padding: 0 32px 24px !important;

    display: grid !important;
    grid-template-columns: .9fr 1.35fr !important;
    gap: 70px !important;

    border: 0 !important;
}

.aoc-contact-page .footer-grid {
    max-width: 1100px !important;
    width: auto !important;

    margin: 0 auto !important;
    padding: 0 32px 8px !important;

    display: grid !important;
    grid-template-columns: 1.35fr .8fr .8fr .8fr !important;
    gap: 60px !important;
}

.aoc-contact-page .footer-bottom {
    max-width: 1100px !important;
    width: auto !important;

    margin: 0 auto !important;
    padding: 6px 32px 0 !important;

    border-top: 0 !important;
}


/* TABLETTE / MOBILE */

@media (max-width: 700px) {

    .aoc-contact-page .footer-newsletter {
        display: block !important;
        width: auto !important;

        padding: 0 28px 18px !important;
    }

    .aoc-contact-page .footer-grid {
        width: auto !important;

        grid-template-columns: 1fr 1fr !important;
        column-gap: 28px !important;
        row-gap: 18px !important;

        padding: 0 28px 18px !important;
    }

    .aoc-contact-page .footer-bottom {
        width: auto !important;

        margin: 0 !important;
        padding: 0 28px 4px !important;

        flex-direction: column !important;
        align-items: flex-start !important;
    }

}
/* =========================================================
   FOOTER AOC — MASTER GLOBAL
   RÉFÉRENCE = ACCUEIL
========================================================= */

/* ---------- CONTENEUR ---------- */

.aoc-page .aoc-footer {
    background: var(--paper-2) !important;
    color: #7500CA !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 30px 0 14px !important;
}


/* ---------- COULEURS ---------- */

.aoc-page .aoc-footer,
.aoc-page .aoc-footer p,
.aoc-page .aoc-footer h3,
.aoc-page .aoc-footer h4,
.aoc-page .aoc-footer label,
.aoc-page .aoc-footer span,
.aoc-page .aoc-footer a {
    color: #7500CA !important;
}


/* ---------- NEWSLETTER ---------- */

.aoc-page .aoc-footer .footer-newsletter {
    width: auto !important;
    max-width: 1180px !important;

    margin: 0 auto !important;
    padding: 0 32px 24px !important;

    display: grid !important;
    grid-template-columns: .9fr 1.35fr !important;

    gap: 70px !important;
    align-items: center !important;

    border: 0 !important;
}

.aoc-page .aoc-footer .footer-newsletter-text h4 {
    margin: 0 0 10px !important;
}

.aoc-page .aoc-footer .footer-newsletter-text p {
    margin: 0 !important;
}


/* ---------- FORMULAIRE ---------- */

.aoc-page .aoc-footer .newsletter-fields {
    display: flex !important;
    flex-direction: row !important;

    gap: 8px !important;
}

.aoc-page .aoc-footer .newsletter-fields input {
    flex: 1 1 auto !important;

    min-height: 52px !important;

    background: #fff !important;
    color: #111 !important;

    border: 2px solid #7500CA !important;
}

.aoc-page .aoc-footer .newsletter-fields button {
    flex: 0 0 auto !important;

    min-height: 52px !important;

    background: #ffff5d !important;
    color: #7500CA !important;

    border: 0 !important;
}

.aoc-page .aoc-footer .newsletter-legal {
    margin: 8px 0 0 !important;
}


/* ---------- SÉPARATEUR UNIQUE ---------- */

.aoc-page .aoc-footer .footer-separator {
    display: block !important;

    width: auto !important;
    max-width: 1180px !important;

    height: 1px !important;

    margin: 0 auto 24px !important;

    background: rgba(117, 0, 202, .18) !important;
}


/* ---------- COLONNES ---------- */

.aoc-page .aoc-footer .footer-grid {
    width: auto !important;
    max-width: 1100px !important;

    margin: 0 auto !important;
    padding: 0 32px 8px !important;

    display: grid !important;

    grid-template-columns:
        1.35fr .8fr .8fr .8fr !important;

    gap: 60px !important;

    border: 0 !important;
}

.aoc-page .aoc-footer .footer-grid h4 {
    margin: 0 0 14px !important;
}

.aoc-page .aoc-footer .footer-grid p {
    margin: 0 !important;
    max-width: 270px !important;
}

.aoc-page .aoc-footer .footer-grid a {
    display: block !important;
    margin: 0 0 6px !important;
}


/* ---------- BAS FOOTER ---------- */

.aoc-page .aoc-footer .footer-bottom {
    width: auto !important;
    max-width: 1100px !important;

    margin: 0 auto !important;
    padding: 6px 32px 0 !important;

    display: flex !important;

    justify-content: space-between !important;
    align-items: center !important;

    border: 0 !important;
}

.aoc-page .aoc-footer .footer-bottom a {
    color: #7500CA !important;
    text-decoration: none !important;
}


/* =========================================================
   FOOTER MASTER — MOBILE
========================================================= */

@media (max-width: 700px) {

    .aoc-page .aoc-footer {
        padding: 24px 0 16px !important;
    }


    /* Newsletter */

    .aoc-page .aoc-footer .footer-newsletter {
        display: block !important;

        width: auto !important;

        margin: 0 !important;
        padding: 0 28px 18px !important;
    }

    .aoc-page .aoc-footer .footer-newsletter-text {
        margin-bottom: 18px !important;
    }


    /* Formulaire */

    .aoc-page .aoc-footer .newsletter-fields {
        display: flex !important;
        flex-direction: column !important;

        gap: 7px !important;
    }

    .aoc-page .aoc-footer .newsletter-fields input {
        width: 100% !important;
        min-height: 48px !important;
    }

    .aoc-page .aoc-footer .newsletter-fields button {
        width: 100% !important;
        min-height: 46px !important;

        background: #ffff5d !important;
        color: #7500CA !important;
    }


    /* Séparateur */

    .aoc-page .aoc-footer .footer-separator {
        margin: 0 28px 18px !important;
    }


    /* Colonnes */

    .aoc-page .aoc-footer .footer-grid {
        width: auto !important;

        margin: 0 !important;
        padding: 0 28px 18px !important;

        grid-template-columns: 1fr 1fr !important;

        column-gap: 28px !important;
        row-gap: 18px !important;
    }


    /* Bas */

    .aoc-page .aoc-footer .footer-bottom {
        width: auto !important;

        margin: 0 !important;
        padding: 0 28px 4px !important;

        flex-direction: column !important;
        align-items: flex-start !important;

        gap: 4px !important;
    }

}
/* =========================================================
   HEADER AOC — CALAGE FINAL
   Référence = Accueil
   Ne modifie PAS le bouton Contact
========================================================= */

/* Même géométrie du header sur toutes les pages AOC */
.aoc-page .aoc-header {
    position: sticky !important;
    top: 0 !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;

    background: rgba(253, 252, 246, .94) !important;

    border-bottom: 1px solid #C9C8BF !important;

    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);

    z-index: 1000;
}


/* Même calage intérieur que l'Accueil */
.aoc-page .aoc-header > .nav {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 16px 32px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    box-sizing: border-box !important;
}


/* Logo toujours identique */
.aoc-page .aoc-header .aoc-header-logo {
    width: 60px !important;
    height: 60px !important;
    max-width: 60px !important;

    flex-shrink: 0 !important;

    object-fit: cover !important;
    border-radius: 50% !important;
}


/* Bloc marque identique */
.aoc-page .aoc-header .brand {
    display: flex !important;
    align-items: center !important;

    gap: 12px !important;

    margin: 0 !important;
}


/* Nom agence */
.aoc-page .aoc-header .logo {
    font-family: 'Archivo', sans-serif !important;

    font-size: 17px !important;
    font-weight: 800 !important;

    line-height: 1.1 !important;
    letter-spacing: -.01em !important;
}


/* Sous-titre */
.aoc-page .aoc-header .logo small {
    display: block !important;

    margin-top: 2px !important;

    font-family: 'Chivo Mono', monospace !important;

    font-size: 11px !important;
    font-weight: 400 !important;

    line-height: 1.2 !important;
    letter-spacing: .1em !important;

    text-transform: uppercase !important;

    color: #8B8A80 !important;
}


/* Menu desktop */
.aoc-page .aoc-header .nav-links {
    display: flex;

    align-items: center !important;

    gap: 30px !important;

    margin: 0 !important;
    padding: 0 !important;

    font-family: 'Archivo', sans-serif !important;

    font-size: 14px !important;
    font-weight: 500 !important;
}


/* Liens : aucune modification de largeur lorsqu'ils deviennent actifs */
.aoc-page .aoc-header .nav-links a {
    position: relative !important;

    display: block !important;

    margin: 0 !important;
    padding: 0 0 5px !important;

    border: 0 !important;

    font: inherit !important;
    line-height: 1.5 !important;

    color: #15120B !important;

    white-space: nowrap !important;
}


/* Trait sous le lien : pseudo-élément = aucune influence sur le calage */
.aoc-page .aoc-header .nav-links a::after {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    bottom: 0 !important;

    width: 0 !important;
    height: 2px !important;

    background: #7500CA !important;

    transition: width .2s ease !important;
}


/* Survol */
.aoc-page .aoc-header .nav-links a:hover::after {
    width: 100% !important;
}


/* Page active */
.aoc-page .aoc-header .nav-links a.active::after,
.aoc-page .aoc-header .nav-links a[aria-current="page"]::after {
    width: 100% !important;
}


/* =========================================================
   IMPORTANT
   ON NE REDÉFINIT PAS LE BOUTON CONTACT ICI
   Il conserve exactement le style déjà validé.
========================================================= */


/* =========================================================
   ADMIN WORDPRESS
========================================================= */

.admin-bar .aoc-page .aoc-header {
    top: 32px !important;
}


/* =========================================================
   TABLETTE
========================================================= */

@media (max-width: 900px) {

    .aoc-page .aoc-header > .nav {
        padding: 16px 20px !important;
        gap: 14px !important;
    }

    .aoc-page .aoc-header .nav-links {
        display: none !important;
    }

    .aoc-page .aoc-header .brand {
        margin-right: auto !important;
    }

    .aoc-page .aoc-menu-toggle {
        display: flex !important;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .aoc-page .aoc-header > .nav {
        padding: 12px 16px !important;
        gap: 8px !important;
    }

    /* Logo mobile */
    .aoc-page .aoc-header .aoc-header-logo {
        width: 48px !important;
        height: 48px !important;
        max-width: 48px !important;
    }


    /* Burger */
    .aoc-page .aoc-menu-toggle {
        display: flex !important;

        width: 38px !important;
        height: 38px !important;

        padding: 0 !important;

        border: 0 !important;
        outline: 0 !important;

        background: transparent !important;

        box-shadow: none !important;
    }

    .aoc-page .aoc-menu-toggle span {
        width: 22px !important;
        height: 2px !important;

        background: #7500CA !important;
    }


    /* Menu déroulant */
    .aoc-page .aoc-mobile-menu {
        padding: 6px 18px 10px !important;

        background: #FFFFFF !important;
    }

    .aoc-page .aoc-mobile-menu a {
        padding: 14px 4px !important;

        font-family: 'Archivo', sans-serif !important;

        font-size: 17px !important;
        font-weight: 700 !important;

        line-height: 1.15 !important;
    }

}
/* =========================================================
   RÉFÉRENCES — MOBILE
   Harmonisation avec le rythme des pages Actus
========================================================= */

@media (max-width: 768px) {

    /* -----------------------------------------------------
       LISTING RÉFÉRENCES
    ----------------------------------------------------- */

    .aoc-ref-page .aoc-ref-intro {
        padding-top: 36px !important;
        padding-bottom: 28px !important;
    }

    .aoc-ref-page .aoc-ref-wrap {
        width: 100% !important;
        max-width: none !important;
        padding-left: 18px !important;
        padding-right: 18px !important;
        box-sizing: border-box !important;
    }

    .aoc-ref-page .aoc-ref-breadcrumb {
        margin-bottom: 24px !important;
        font-size: 12px !important;
    }

    .aoc-ref-page .aoc-ref-intro h1 {
        margin: 0 0 20px !important;
        font-size: clamp(48px, 14vw, 68px) !important;
        line-height: .92 !important;
    }

    .aoc-ref-page .aoc-ref-intro p {
        margin: 0 !important;
        max-width: 100% !important;
        font-size: 19px !important;
        line-height: 1.45 !important;
    }


    /* Filtres */

    .aoc-ref-page .aoc-ref-filters-section {
        padding: 26px 0 34px !important;
    }

    .aoc-ref-page .aoc-ref-filters,
    .aoc-ref-page .aoc-ref-filter-row {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: flex-start !important;
        gap: 8px !important;
    }

    .aoc-ref-page .aoc-ref-filter {
        width: auto !important;
        min-width: 0 !important;
        padding: 10px 13px !important;
        font-size: 13px !important;
        line-height: 1.1 !important;
        white-space: normal !important;
    }


    /* Mosaïque : 2 colonnes, pas 4 */

    .aoc-ref-page .aoc-ref-mosaic {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .aoc-ref-page .aoc-ref-card {
        width: 100% !important;
        min-width: 0 !important;
    }

    .aoc-ref-page .aoc-ref-shape {
        width: 100% !important;
        min-height: 0 !important;
        aspect-ratio: 1 / 1 !important;
    }

    .aoc-ref-page .aoc-ref-content {
        padding: 18px !important;
    }

    .aoc-ref-page .aoc-ref-content h2 {
        font-size: clamp(21px, 6vw, 29px) !important;
        line-height: .98 !important;
        overflow-wrap: anywhere !important;
    }

    .aoc-ref-page .aoc-ref-content span {
        font-size: 11px !important;
        line-height: 1.3 !important;
    }



    /* -----------------------------------------------------
       RÉFÉRENCE INDIVIDUELLE
    ----------------------------------------------------- */

    .aoc-single-reference-page .aoc-ref-page {
        padding-left: 18px !important;
        padding-right: 18px !important;
        box-sizing: border-box !important;
    }

    .aoc-single-reference-page .aoc-ref-layout {
        display: block !important;
    }

    .aoc-single-reference-page .aoc-ref-main {
        width: 100% !important;
        max-width: none !important;
    }

    .aoc-single-reference-page .aoc-ref-hero {
        padding-top: 34px !important;
        padding-bottom: 28px !important;
    }

    .aoc-single-reference-page .aoc-ref-title {
        font-size: clamp(42px, 12vw, 64px) !important;
        line-height: .95 !important;
        overflow-wrap: anywhere !important;
    }


    /* Texte : actuellement beaucoup trop grand */

    .aoc-single-reference-page .aoc-ref-content {
        font-size: 18px !important;
        line-height: 1.6 !important;
    }

    .aoc-single-reference-page .aoc-ref-content p,
    .aoc-single-reference-page .aoc-ref-content li {
        font-size: 18px !important;
        line-height: 1.6 !important;
    }

    .aoc-single-reference-page .aoc-ref-content h2 {
        font-size: 28px !important;
        line-height: 1.1 !important;
    }

    .aoc-single-reference-page .aoc-ref-content h3 {
        font-size: 23px !important;
        line-height: 1.15 !important;
    }


    /* Liens dans le texte */

    .aoc-single-reference-page .aoc-ref-content a {
        overflow-wrap: anywhere !important;
    }


    /* Bouton site */

    .aoc-single-reference-page .aoc-ref-site {
        margin-top: 32px !important;
    }

    .aoc-single-reference-page .aoc-ref-site-button {
        width: 100% !important;
        min-height: 62px !important;
        padding: 18px 22px !important;
        box-sizing: border-box !important;

        font-size: 14px !important;
        line-height: 1.2 !important;
    }


    /* Actualités / liens / documents liés éventuels */

    .aoc-single-reference-page .aoc-ref-related,
    .aoc-single-reference-page .aoc-ref-press {
        margin-top: 42px !important;
    }


    /* Sidebar sous le contenu sur mobile */

    .aoc-single-reference-page .aoc-ref-sidebar {
        width: 100% !important;
        margin-top: 46px !important;
    }

    .aoc-single-reference-page .aoc-ref-sidebar-sticky {
        position: static !important;
    }


    /* Navigation précédente / suivante */

    .aoc-single-reference-page .aoc-ref-pagination-inner {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 1px !important;
    }

}
/* =========================================================
   RÉFÉRENCE INDIVIDUELLE — MOBILE
   Calage plus proche des fiches Actus
========================================================= */

@media (max-width: 768px) {

    /* Conteneur général */
    .aoc-single-reference-page .aoc-ref-page {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

    /* Titre plus compact */
    .aoc-single-reference-page .aoc-ref-title {
        font-size: 42px !important;
        line-height: 0.98 !important;
        letter-spacing: -0.03em !important;
        margin-bottom: 24px !important;
    }

    /* Bloc texte aligné comme Actu */
    .aoc-single-reference-page .aoc-ref-project-content {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .aoc-single-reference-page .aoc-ref-content {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;

        font-size: 17px !important;
        line-height: 1.55 !important;

        text-align: left !important;
    }

    .aoc-single-reference-page .aoc-ref-content p {
        width: 100% !important;
        max-width: none !important;

        margin: 0 0 22px !important;

        font-size: 17px !important;
        line-height: 1.55 !important;

        text-align: left !important;
    }

    .aoc-single-reference-page .aoc-ref-content strong,
    .aoc-single-reference-page .aoc-ref-content b {
        font-weight: 700 !important;
    }

    /* Liens dans le texte */
    .aoc-single-reference-page .aoc-ref-content a {
        overflow-wrap: anywhere !important;
    }

    /* Instagram : aligné avec le texte, pas décalé */
    .aoc-single-reference-page .aoc-ref-content + *,
    .aoc-single-reference-page .aoc-ref-project-content > a {
        margin-left: 0 !important;
    }

    /* Bouton "Visiter le site" */
    .aoc-single-reference-page .aoc-ref-site {
        width: 100% !important;
        margin: 34px 0 0 !important;
        padding: 0 !important;
    }

    .aoc-single-reference-page .aoc-ref-site-button {
        width: 100% !important;
        min-height: 58px !important;

        padding: 16px 18px !important;

        font-size: 13px !important;
        line-height: 1.2 !important;

        box-sizing: border-box !important;
    }

}
/* =========================================================
   RÉFÉRENCES — AJUSTEMENTS DESKTOP
========================================================= */

@media (min-width: 769px) {

    /* Centre le contenu dans chaque rouage */
    .aoc-ref-page .aoc-ref-content {
        text-align: center !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .aoc-ref-page .aoc-ref-content h2,
    .aoc-ref-page .aoc-ref-content span {
        text-align: center !important;
        width: 100% !important;
    }

}


/* =========================================================
   RÉFÉRENCES — MOBILE
   On conserve EXACTEMENT la géométrie existante
   et on réduit uniquement les textes
========================================================= */

@media (max-width: 768px) {

    .aoc-ref-page .aoc-ref-content h2 {
        font-size: 19px !important;
        line-height: 1.05 !important;
        letter-spacing: -0.02em !important;

        word-break: normal !important;
        overflow-wrap: normal !important;
        hyphens: none !important;
    }

    .aoc-ref-page .aoc-ref-content span {
        font-size: 9px !important;
        line-height: 1.25 !important;
    }

}
/* =========================================================
   RÉFÉRENCES — MOBILE FINAL
   Rouages conservés / titres centrés / filtres calés
========================================================= */

@media (max-width: 768px) {

    /* -----------------------------------------------------
       FILTRES
    ----------------------------------------------------- */

    .aoc-ref-page .aoc-ref-filters {
        width: 100% !important;

        display: flex !important;
        flex-direction: column !important;

        align-items: center !important;

        gap: 8px !important;
    }

    .aoc-ref-page .aoc-ref-filter-row {
        width: 100% !important;

        display: flex !important;
        flex-wrap: wrap !important;

        justify-content: center !important;
        align-items: center !important;

        gap: 8px !important;
    }

    .aoc-ref-page .aoc-ref-filter {
        width: auto !important;
        min-width: 0 !important;

        margin: 0 !important;

        padding: 10px 14px !important;

        font-size: 12px !important;
        line-height: 1 !important;

        text-align: center !important;
        white-space: nowrap !important;
    }


    /* -----------------------------------------------------
       MOSAÏQUE
       On NE modifie PAS la géométrie du rouage
    ----------------------------------------------------- */

    .aoc-ref-page .aoc-ref-mosaic {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }


    /* -----------------------------------------------------
       CONTENU DES ROUAGES
    ----------------------------------------------------- */

    .aoc-ref-page .aoc-ref-content {
        width: 100% !important;
        height: 100% !important;

        padding: 18px !important;

        display: flex !important;
        flex-direction: column !important;

        justify-content: center !important;
        align-items: center !important;

        box-sizing: border-box !important;

        text-align: center !important;
    }


    /* Nom de la référence */

    .aoc-ref-page .aoc-ref-content h2 {
        width: 100% !important;

        margin: 0 0 12px !important;

        font-size: 18px !important;
        line-height: 1.05 !important;

        letter-spacing: -0.02em !important;

        text-align: center !important;

        word-break: normal !important;
        overflow-wrap: normal !important;
        hyphens: none !important;
    }


    /* Expertise */

    .aoc-ref-page .aoc-ref-content span {
        width: 100% !important;

        margin: 0 !important;

        font-size: 8.5px !important;
        line-height: 1.3 !important;

        letter-spacing: 0.03em !important;

        text-align: center !important;
    }

}
/* =========================================================
   RÉFÉRENCES — FILTRES MOBILE
   Rouages inchangés
========================================================= */

@media (max-width: 768px) {

    /* On transforme les anciennes lignes en une seule suite */
    .aoc-ref-page .aoc-ref-filters {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;

        width: 100% !important;
        margin: 0 !important;
    }

    .aoc-ref-page .aoc-ref-filter-row {
        display: contents !important;
    }

    /* Un filtre après l'autre */
    .aoc-ref-page .aoc-ref-filter {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 12px 14px !important;

        box-sizing: border-box !important;

        font-size: 13px !important;
        line-height: 1.15 !important;
        text-align: center !important;
    }

}
/* =========================================================
   RÉFÉRENCES — MOBILE PROPRE
   Rouage original conservé + filtres empilés
========================================================= */

@media (max-width: 768px) {

    /* -----------------------------------------
       FILTRES
       un bouton sous l'autre
    ----------------------------------------- */

    .aoc-ref-page .aoc-ref-filters {
        width: 100% !important;
        margin: 0 !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;

        gap: 6px !important;
    }

    .aoc-ref-page .aoc-ref-filter-row {
        display: contents !important;
    }

    .aoc-ref-page .aoc-ref-filter {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 13px 14px !important;

        box-sizing: border-box !important;

        font-size: 12px !important;
        line-height: 1.1 !important;
        text-align: center !important;

        white-space: nowrap !important;
    }


    /* -----------------------------------------
       MOSAÏQUE
       2 rouages par ligne
    ----------------------------------------- */

    .aoc-ref-page .aoc-ref-mosaic {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    .aoc-ref-page .aoc-ref-card {
        width: 100% !important;
        min-width: 0 !important;
    }


    /* -----------------------------------------
       ROUAGE
       ON CONSERVE LA FORME ORIGINALE
    ----------------------------------------- */

    .aoc-ref-page .aoc-ref-shape {
        width: 100% !important;

        aspect-ratio: 211 / 253 !important;

        min-height: 0 !important;

        clip-path: url(#rouage) !important;
        -webkit-clip-path: url(#rouage) !important;
    }


    /* -----------------------------------------
       TEXTE DANS LE ROUAGE
    ----------------------------------------- */

    .aoc-ref-page .aoc-ref-content {
        width: 74% !important;
        height: auto !important;

        padding: 0 !important;

        display: flex !important;
        flex-direction: column !important;

        justify-content: center !important;
        align-items: center !important;

        text-align: center !important;
    }

    .aoc-ref-page .aoc-ref-content h2 {
        width: 100% !important;

        margin: 0 0 10px !important;

        font-size: 17px !important;
        line-height: 1.05 !important;
        letter-spacing: -0.02em !important;

        text-align: center !important;

        word-break: normal !important;
        overflow-wrap: normal !important;
        hyphens: none !important;
    }

    .aoc-ref-page .aoc-ref-content span {
        width: 100% !important;

        margin: 0 !important;

        font-size: 8px !important;
        line-height: 1.25 !important;
        letter-spacing: .02em !important;

        text-align: center !important;
    }

}
/* -----------------------------------------
   TEXTE DANS LES ROUAGES — LISTING UNIQUEMENT
----------------------------------------- */

.aoc-ref-page .aoc-ref-mosaic .aoc-ref-content {
    width: 74% !important;
    height: auto !important;

    padding: 0 !important;

    display: flex !important;
    flex-direction: column !important;

    justify-content: center !important;
    align-items: center !important;

    text-align: center !important;
}

.aoc-ref-page .aoc-ref-mosaic .aoc-ref-content h2 {
    width: 100% !important;

    margin: 0 0 10px !important;

    font-size: 17px !important;
    line-height: 1.05 !important;
    letter-spacing: -0.02em !important;

    text-align: center !important;

    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
}

.aoc-ref-page .aoc-ref-mosaic .aoc-ref-content span {
    width: 100% !important;

    margin: 0 !important;

    font-size: 8px !important;
    line-height: 1.25 !important;
    letter-spacing: .02em !important;

    text-align: center !important;
}
/* =========================================================
   SINGLE RÉFÉRENCE — CALÉE SUR SINGLE ACTU
   MOBILE — VERSION RESSERRÉE
   ========================================================= */

@media (max-width: 640px) {

    /* Conteneur : même respiration que les Actus */
    .aoc-single-reference-page .aoc-ref-page {
        padding-left: 20px !important;
        padding-right: 20px !important;
        box-sizing: border-box !important;
    }

    /* Layout en une colonne comme l'Actu */
    .aoc-single-reference-page .aoc-ref-layout {
        display: block !important;
        width: 100% !important;
    }

    .aoc-single-reference-page .aoc-ref-main {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
    }

    /* Haut de page */
    .aoc-single-reference-page .aoc-ref-hero {
        padding-top: 30px !important;
        padding-bottom: 22px !important;
    }

    /* Titre = même échelle que single Actu */
    .aoc-single-reference-page .aoc-ref-title {
        width: 100% !important;
        max-width: none !important;

        margin-bottom: 20px !important;

        font-size: 38px !important;
        line-height: 1.02 !important;
        letter-spacing: -.035em !important;

        overflow-wrap: normal !important;
        word-break: normal !important;
        hyphens: none !important;
    }

    /* Conteneur éditorial */
    .aoc-single-reference-page .aoc-ref-project-content {
        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    /* Contenu texte */
    .aoc-single-reference-page .aoc-ref-content {
        display: block !important;

        width: 100% !important;
        max-width: 680px !important;
        height: auto !important;

        margin: 14px 0 0 !important;
        padding: 0 !important;

        text-align: left !important;

        font-family: 'Archivo', sans-serif !important;
        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    /* Paragraphes */
    .aoc-single-reference-page .aoc-ref-content p {
        width: 100% !important;
        max-width: none !important;

        margin: 0 0 14px !important;

        font-size: 14px !important;
        font-weight: 400 !important;
        line-height: 1.6 !important;

        text-align: left !important;
    }

    /* Intertitres */
    .aoc-single-reference-page .aoc-ref-content h2 {
        width: 100% !important;

        margin: 26px 0 10px !important;

        font-size: 24px !important;
        line-height: 1.2 !important;

        text-align: left !important;
    }

    .aoc-single-reference-page .aoc-ref-content h3 {
        width: 100% !important;

        margin: 24px 0 10px !important;

        font-size: 18px !important;
        line-height: 1.2 !important;

        text-align: left !important;
    }

    /* Listes */
    .aoc-single-reference-page .aoc-ref-content ul,
    .aoc-single-reference-page .aoc-ref-content ol {
        margin: 14px 0 18px 22px !important;
    }

    .aoc-single-reference-page .aoc-ref-content li {
        margin-bottom: 7px !important;

        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    /* Liens */
    .aoc-single-reference-page .aoc-ref-content a {
        overflow-wrap: anywhere !important;
    }

    /* Bouton VISITER LE SITE */
    .aoc-single-reference-page .aoc-ref-site {
        width: 100% !important;
        margin: 22px 0 0 !important;
        padding: 0 !important;
    }

    .aoc-single-reference-page .aoc-ref-site-button {
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Sidebar sous le contenu */
    .aoc-single-reference-page .aoc-ref-sidebar {
        width: 100% !important;
        margin-top: 34px !important;
    }

    .aoc-single-reference-page .aoc-ref-sidebar-sticky {
        position: static !important;
    }

}

/* =========================================================
   AOC — HEADER MOBILE GLOBAL
   Le header reste visible au défilement sur mobile
   ========================================================= */

@media (max-width: 640px) {

    /* Tous les headers AOC */
    .aoc-page .aoc-header,
    .aoc-ref-page .aoc-header,
    .aoc-single-reference .aoc-header,
    .aoc-actus-archive .aoc-header,
    .aoc-single-actu .aoc-header,
    .aoc-contact-page .aoc-header,

    body.page-id-7690 .aoc-header,
    body.page-id-7770 .aoc-header,
    body.category-actus .aoc-header,
    body:has(.aoc-single-reference) .aoc-header,
    body:has(.aoc-single-actu) .aoc-header,
    body:has(.aoc-contact-page) .aoc-header,

    /* Cas admin WordPress */
    .admin-bar .aoc-page .aoc-header,
    .admin-bar .aoc-ref-page .aoc-header,
    .admin-bar .aoc-single-reference .aoc-header,
    .admin-bar .aoc-actus-archive .aoc-header,
    .admin-bar .aoc-single-actu .aoc-header,
    .admin-bar .aoc-contact-page .aoc-header,
    body.category-actus.admin-bar .aoc-header {

        position: sticky !important;

        top: 0 !important;
        left: auto !important;
        right: auto !important;

        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 !important;

        z-index: 9999 !important;

        background: #FFFFFF !important;

        border-bottom: 1px solid #C9C8BF !important;

        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;

        transform: none !important;
    }


    /* -----------------------------------------------------
       NAV INTERNE
       ----------------------------------------------------- */

    .aoc-page .aoc-header .nav,
    .aoc-ref-page .aoc-header .nav,
    .aoc-single-reference .aoc-header .nav,
    .aoc-actus-archive .aoc-header .nav,
    .aoc-single-actu .aoc-header .nav,
    .aoc-contact-page .aoc-header .nav,

    body.category-actus .aoc-header .nav {

        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 12px 18px !important;

        box-sizing: border-box !important;
    }


    /* -----------------------------------------------------
       LOGO
       ----------------------------------------------------- */

    .aoc-page .aoc-header-logo,
    .aoc-single-reference .aoc-header-logo,
    .aoc-actus-archive .aoc-header-logo,
    .aoc-single-actu .aoc-header-logo,
    .aoc-contact-page .aoc-header-logo,
    body.category-actus .aoc-header-logo {

        width: 50px !important;
        height: 50px !important;
        max-width: 50px !important;

        object-fit: cover !important;

        border-radius: 50% !important;
    }

    /* -----------------------------------------------------
       NAVIGATION DESKTOP CACHÉE
       ----------------------------------------------------- */

    .aoc-page .nav-links,
    .aoc-single-reference .nav-links,
    .aoc-actus-archive .nav-links,
    .aoc-single-actu .nav-links,
    .aoc-contact-page .nav-links,
    body.category-actus .nav-links {

        display: none !important;
    }


    /* -----------------------------------------------------
       ANNULATION DES ESPACES AJOUTÉS POUR HEADER FIXE
       ----------------------------------------------------- */

    .aoc-page,
    .aoc-ref-page,
    .aoc-single-reference,
    .aoc-actus-archive,
    .aoc-single-actu,
    .aoc-contact-page {

        padding-top: 0 !important;
    }

}

/* =========================================================
   ACTUS — TITRES DES CARTES — RÈGLE FINALE
   ========================================================= */

.aoc-actus-archive .aoc-actu-card-body h2 {
    max-width: 100% !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
}

@media (min-width: 981px) {
    .aoc-actus-archive .aoc-actu-card-body h2 {
        font-size: 19px !important;
        line-height: 1.18 !important;
    }
}

@media (max-width: 980px) {
    .aoc-actus-archive .aoc-actu-card-body h2 {
        font-size: 18px !important;
        line-height: 1.2 !important;
    }
}
/* =========================================================
   ACTUS — TITRES LONGS FINAL
   ========================================================= */

/* Listing */
.aoc-actus-archive .aoc-actu-card-body h2 {
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
}

.aoc-actus-archive .aoc-actu-card-body h2.is-long-title {
    font-size: 16px !important;
    line-height: 1.22 !important;
    letter-spacing: -.015em !important;
}

/* Single */
.aoc-single-actu .aoc-actu-title {
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
}

@media (max-width: 640px) {

    .aoc-single-actu .aoc-actu-title {
        font-size: 32px !important;
        line-height: 1.06 !important;
    }

    .aoc-single-actu .aoc-actu-title.is-long-title {
        font-size: 27px !important;
        line-height: 1.08 !important;
    }

    .aoc-actus-archive .aoc-actu-card-body h2.is-long-title {
        font-size: 15px !important;
        line-height: 1.24 !important;
    }
}
/* =========================================================
   FIX FINAL — LISTING ACTUS / TITRES LONGS DES CARTES
   ========================================================= */

.aoc-actus-archive .aoc-actu-card,
.aoc-actus-archive .aoc-actu-card-body {
    min-width: 0 !important;
    overflow: hidden !important;
}

.aoc-actus-archive .aoc-actu-card-body h2,
.aoc-actus-archive .aoc-actu-card-body h2 a {
    display: block !important;

    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;

    white-space: normal !important;

    word-break: normal !important;
    overflow-wrap: break-word !important;
    hyphens: none !important;

    overflow: visible !important;
    text-overflow: clip !important;
}


/* DESKTOP */
@media (min-width: 981px) {

    .aoc-actus-archive .aoc-actu-card-body h2,
    .aoc-actus-archive .aoc-actu-card-body h2 a {
        font-size: 19px !important;
        line-height: 1.18 !important;
    }

}


/* MOBILE */
@media (max-width: 640px) {

    .aoc-actus-archive .aoc-actu-card-body h2,
    .aoc-actus-archive .aoc-actu-card-body h2 a {
        font-size: 18px !important;
        line-height: 1.2 !important;
    }

}
/* ==================================================
   CAS CLIENTS — SLIDER
================================================== */

.cases-slider {
  position: relative;
  background: var(--peach);
}

.case-slide {
  display: none;
}

.case-slide.is-active {
  display: block;
}


/* Navigation */

.cases-nav {
  position: absolute;
  z-index: 10;
  right: max(24px, calc((100% - 1180px) / 2));
  top: 28px;

  display: flex;
  align-items: center;
  gap: 12px;
}

.case-arrow {
  width: 44px;
  height: 44px;

  display: flex;
  align-items: center;
  justify-content: center;

  border: 1px solid var(--purple);
  background: transparent;
  color: var(--purple);

  font-size: 22px;
  line-height: 1;
  cursor: pointer;

  transition: .2s ease;
}

.case-arrow:hover {
  background: var(--purple);
  color: var(--yellow);
}

.case-counter {
  font-family: 'Chivo Mono', monospace;
  font-size: 11px;
  font-weight: 600;
  color: var(--purple);
  letter-spacing: .08em;
}


/* Mobile */

@media (max-width: 768px) {

  .cases-nav {
    top: 18px;
    right: 18px;
  }

  .case-arrow {
    width: 38px;
    height: 38px;
  }

}
/* ==================================================
   CAS CLIENTS — SLIDER
================================================== */

.cases-slider {
  position: relative;
  background: var(--peach);

  /* moins de pêche en haut / bas */
  padding: 38px 0 34px;
}


/* SLIDES */

.case-slide {
  display: none;
}

.case-slide.is-active {
  display: block;
}

/* évite que l'ancien padding de .case agrandisse le fond */
.cases-slider .case {
  padding-top: 0;
  padding-bottom: 0;
}


/* NAVIGATION */

.cases-nav {
  position: absolute;
  z-index: 20;

  top: 24px;
  right: max(24px, calc((100% - 1180px) / 2));

  display: flex;
  align-items: center;
  gap: 10px;
}

.case-arrow {
  width: 38px;
  height: 38px;

  display: flex;
  align-items: center;
  justify-content: center;

  border: 1px solid var(--purple);
  background: transparent;
  color: var(--purple);

  font-size: 19px;
  line-height: 1;

  cursor: pointer;

  transition:
    background .2s ease,
    color .2s ease;
}

.case-arrow:hover {
  background: var(--purple);
  color: var(--yellow);
}

.case-counter {
  font-family: 'Chivo Mono', monospace;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  color: var(--purple);
}


/* GRILLE */

.cases-slider .case-grid {
  padding-top: 24px;
}


/* STATS */

.case-stats-grid {
  margin-top: 28px;

  display: grid;
  grid-template-columns: 1fr 1fr;

  border-top: 1px solid rgba(117, 0, 202, .22);
}

.case-stat-cell {
  padding: 18px 0;

  border-bottom: 1px solid rgba(117, 0, 202, .22);
}

.case-stat-cell:nth-child(odd) {
  padding-right: 22px;
  border-right: 1px solid rgba(117, 0, 202, .22);
}

.case-stat-cell:nth-child(even) {
  padding-left: 22px;
}


/* TAKEAWAYS */

.case-takeaways {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.case-takeaway {
  display: flex;
  align-items: center;
  gap: 18px;

  padding: 17px 22px;

  background: var(--purple);
  color: var(--yellow);

  font-weight: 700;
  line-height: 1.3;
}

.case-takeaway-num {
  flex: 0 0 auto;

  font-family: 'Chivo Mono', monospace;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .08em;

  color: var(--yellow);
  opacity: .7;
}


/* MOBILE */

@media (max-width: 768px) {

  .cases-slider {
    padding: 70px 0 30px;
  }

  .cases-nav {
    top: 18px;
    right: 18px;
  }

  .case-arrow {
    width: 36px;
    height: 36px;
  }

  .cases-slider .case-grid {
    padding-top: 0;
  }

  .case-stats-grid {
    grid-template-columns: 1fr;
  }

  .case-stat-cell:nth-child(odd) {
    padding-right: 0;
    border-right: 0;
  }

  .case-stat-cell:nth-child(even) {
    padding-left: 0;
  }

  .case-takeaway {
    padding: 15px 16px;
  }

}
.case-more {
  display: inline-block;
  margin-top: 16px;

  font-family: 'Chivo Mono', monospace;
  font-size: 10.5px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: .06em;
  text-transform: uppercase;

  color: var(--purple);
  text-decoration: none;
}

.case-more:hover {
  text-decoration: underline;
}
.cases-nav {
  top: 36px;
}

.cases-slider {
  padding: 22px 0 22px;
}
/* Bandeau références — vitesse */
.marquee-track {
    animation-duration: 55s !important;
}
/* Bandeau références — pleine largeur */
.marquee-band {
    width: 100vw !important;
    max-width: none !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
}

/* Bandeau références — vitesse */
.marquee-track {
    animation-duration: 55s !important;
}
/* ==================================================
   HOME — BANDEAU RÉFÉRENCES VRAIE PLEINE LARGEUR
================================================== */

body.page-id-7690 .aoc-page .marquee-band {
    position: relative !important;
    left: 50% !important;
    transform: translateX(-50%) !important;

    width: 100vw !important;
    max-width: 100vw !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    padding-left: 0 !important;
    padding-right: 0 !important;

    overflow-x: clip !important;
}

/* Vitesse du défilement */
body.page-id-7690 .aoc-page .marquee-track {
    animation-duration: 55s !important;
}
/* ==================================================
   HOME — MÉTHODE : ALIGNEMENT + ESPACEMENTS
================================================== */

/* Titre méthode aligné avec la grille */
body.page-id-7690 #methode > .wrap {
    width: calc(100% - 56px) !important;
    max-width: none !important;
    margin-left: 28px !important;
    margin-right: 28px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Réduit l'espace entre le titre et les blocs */
body.page-id-7690 #methode .sec-head {
    margin-bottom: 28px !important;
}

/* Réduit l'espace blanc avant la section Méthode */
body.page-id-7690 #methode {
    margin-top: 45px !important;
}
/* ==================================================
   HOME — ALIGNEMENTS FINAUX
================================================== */

/* MÉTHODE : titre sur le même axe que les autres titres */
body.page-id-7690 #methode > .wrap {
    width: 100% !important;
    max-width: 1280px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    padding-left: 32px !important;
    padding-right: 32px !important;
}

/* Espace titre → blocs méthode */
body.page-id-7690 #methode .sec-head {
    margin-bottom: 28px !important;
}

/* Réduit le grand blanc après les expertises */
body.page-id-7690 .sec:has(.exp-grid) {
    padding-bottom: 42px !important;
}

/* Pas de blanc supplémentaire en haut de Méthode */
body.page-id-7690 #methode {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
/* ==================================================
   HOME — CAS CLIENTS : ALIGNEMENT SUR LA GRILLE
================================================== */

body.page-id-7690 .cases-slider .case-grid {
    width: 100% !important;
    max-width: 1280px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    padding-left: 32px !important;
    padding-right: 32px !important;
}
@media (max-width:700px) {

    body.page-id-7690 .cases-slider .case-grid {
        padding-left: 22px !important;
        padding-right: 22px !important;
    }

}
/* ==================================================
   HOME — CTA + FOOTER PLEINE LARGEUR
================================================== */

/* CTA violet — bord à bord */
body.page-id-7690 .cta {
    position: relative !important;
    left: 50% !important;
    transform: translateX(-50%) !important;

    width: 100vw !important;
    max-width: 100vw !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    box-sizing: border-box !important;
}

/* Footer — bord à bord */
body.page-id-7690 .footer {
    position: relative !important;
    left: 50% !important;
    transform: translateX(-50%) !important;

    width: 100vw !important;
    max-width: 100vw !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    box-sizing: border-box !important;
}
/* ==================================================
   HOME — APLATS PLEINE LARGEUR
================================================== */

/* Cas clients */
body.page-id-7690 .cases-slider,

/* Actualités */
body.page-id-7690 #actus,

/* Témoignages */
body.page-id-7690 .testi,

/* CTA final */
body.page-id-7690 .cta,

/* Footer */
body.page-id-7690 .aoc-footer {
    position: relative !important;
    left: 50% !important;
    transform: translateX(-50%) !important;

    width: 100vw !important;
    max-width: 100vw !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    box-sizing: border-box !important;
}


/* Contenus intérieurs : restent centrés */
body.page-id-7690 #actus > .wrap,
body.page-id-7690 .cases-slider .case-grid {
    width: 100% !important;
    max-width: 1280px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    padding-left: 32px !important;
    padding-right: 32px !important;

    box-sizing: border-box !important;
}


/* Mobile */
@media (max-width:700px) {

    body.page-id-7690 #actus > .wrap,
    body.page-id-7690 .cases-slider .case-grid {
        padding-left: 22px !important;
        padding-right: 22px !important;
    }

}
/* ==================================================
   HOME — STATUTS ACTUS
================================================== */

body.page-id-7690 .actu-status {
    display: inline-block;
    margin-bottom: 8px;

    font-family: "Chivo Mono", monospace;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;

    letter-spacing: .08em;
    text-transform: uppercase;
}

body.page-id-7690 .actu-status-now {
    font-weight: 700;
    opacity: 1;
}

body.page-id-7690 .actu-status-soon {
    opacity: .55;
}
/* ==================================================
   HOME — CORRECTIONS MOBILE
================================================== */

@media (max-width: 768px) {

  /* ------------------------------------------
     CHIFFRES / INTRO
  ------------------------------------------ */

  body.page-id-7690 .stats {
    padding-bottom: 30px !important;
  }

  body.page-id-7690 .stats + * {
    margin-top: 0 !important;
  }


/* ------------------------------------------
   ACTUS
------------------------------------------ */

body.page-id-7690 #actus .actu-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 18px !important;

  width: 100% !important;
  min-width: 0 !important;

  padding: 28px 20px !important;
  box-sizing: border-box !important;
}

body.page-id-7690 #actus .actu-meta,
body.page-id-7690 #actus .actu-main,
body.page-id-7690 #actus .actu-title,
body.page-id-7690 #actus .actu-place {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;

  grid-column: 1 !important;
}

body.page-id-7690 #actus .actu-title {
  font-size: clamp(24px, 6.5vw, 30px) !important;
  line-height: 1.12 !important;

  white-space: normal !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: none !important;
}

body.page-id-7690 #actus .actu-place {
  font-size: 14px !important;
  line-height: 1.4 !important;

  white-space: normal !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: none !important;
}

body.page-id-7690 #actus .actu-arrow {
  position: static !important;

  width: 100% !important;
  min-width: 0 !important;

  display: flex !important;
  justify-content: flex-end !important;

  margin-top: 4px !important;

  grid-column: 1 !important;
}
  /* ------------------------------------------
     CAS CLIENTS
  ------------------------------------------ */

  body.page-id-7690 .cases-slider .case-head {
    display: block !important;
  }


  body.page-id-7690 .cases-slider .case-controls {
    width: 100% !important;

    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 14px !important;

    margin-top: 24px !important;
  }

}
/* ==================================================
   HOME MOBILE — HERO : STATS + LOGO — FINAL
================================================== */

@media (max-width: 768px) {

  body.page-id-7690 .hero {
    min-height: 0 !important;
    height: auto !important;
    padding-bottom: 0 !important;
  }

  body.page-id-7690 .hero-grid {
    display: block !important;
    min-height: 0 !important;
    height: auto !important;
  }

  body.page-id-7690 .hero-grid > div:first-child {
    min-height: 0 !important;
    height: auto !important;
  }

  body.page-id-7690 .stat-strip {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }


  /* LOGO */

  body.page-id-7690 .hero-visual {
    position: static !important;

    width: 100% !important;
    max-width: none !important;

    height: auto !important;
    min-height: 0 !important;

    /* IMPORTANT : supprime le carré réservé */
    aspect-ratio: auto !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin: 45px 0 45px 0 !important;
    padding: 0 !important;
  }

  body.page-id-7690 .aoc-hero-logo {
    position: static !important;

    display: block !important;

    width: 52vw !important;
    max-width: 270px !important;
    height: auto !important;

    aspect-ratio: auto !important;

    margin: 0 auto !important;
    padding: 0 !important;
  }


  /* BANDEAU CLIENTS */

  body.page-id-7690 .marquee-band {
    margin-top: 0 !important;
  }

}
/* ==================================================
   HOME MOBILE — CAS CLIENTS — FINAL
================================================== */

@media (max-width: 768px) {

  body.page-id-7690 .cases-slider {
    position: relative !important;
    padding-top: 0 !important;
  }

  /* NAVIGATION DU SLIDER */

  body.page-id-7690 .cases-nav {
    position: static !important;

    width: auto !important;
    max-width: none !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 20px !important;

    margin: 0 32px 50px 32px !important;
    padding: 30px 0 0 0 !important;

    transform: none !important;
  }

  body.page-id-7690 .case-arrow {
    position: static !important;

    flex: 0 0 54px !important;

    width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin: 0 !important;
    padding: 0 !important;

    transform: none !important;
  }

  body.page-id-7690 .case-counter {
    position: static !important;

    flex: 0 0 auto !important;
    min-width: 78px !important;

    margin: 0 !important;

    text-align: center !important;
    white-space: nowrap !important;

    transform: none !important;
  }


  /* CONTENU */

  body.page-id-7690 .case-grid {
    display: block !important;
  }

  body.page-id-7690 .case h2 {
    max-width: 100% !important;
    margin-right: 0 !important;
  }


  /* STATS */

  body.page-id-7690 .case-stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0 !important;
  }

  body.page-id-7690 .case-stat-cell {
    min-width: 0 !important;
  }


  /* TAKEAWAYS */

  body.page-id-7690 .case-takeaways {
    margin-top: 34px !important;
  }

}
/* ==================================================
   HOME MOBILE — TÉMOIGNAGES
================================================== */

@media (max-width: 768px) {

  body.page-id-7690 .testi {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
  }

  body.page-id-7690 .testi-inner {
    min-height: 0 !important;
  }

  body.page-id-7690 .testi-slider {
    margin-top: 55px !important;
  }

  body.page-id-7690 .testi-controls {
    margin-top: 55px !important;
  }

}
/* ==================================================
   EXPERTISES — FIL D'ARIANE
================================================== */

.aoc-expertises-page .aoc-breadcrumb {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 14px 32px;
  box-sizing: border-box;

  display: flex;
  align-items: center;
  gap: 8px;

  font-family: "Chivo Mono", monospace;
  font-size: 11px;
  line-height: 1.4;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.aoc-expertises-page .aoc-breadcrumb a {
  color: inherit;
  text-decoration: none;
}

.aoc-expertises-page .aoc-breadcrumb a:hover {
  text-decoration: underline;
}

.aoc-expertises-page .aoc-breadcrumb span[aria-current="page"] {
  opacity: 0.55;
}
/* CORRECTION COULEUR DE FOND — PAGE MÉTHODE */

.aoc-methode-page,
.aoc-methode-page main,
.aoc-methode-process,
.aoc-methode-terrain,
.aoc-methode-experience,
.aoc-methode-parcours,
.aoc-methode-collaborations {
    background-color: #FFFFFF;
}
/* =========================================================
   MÉTHODE — LISIBILITÉ DES ÉTAPES
   ========================================================= */

/* ÉTAPE 1 / ÉTAPE 2 / ÉTAPE 3 */
.aoc-methode-page .aoc-methode-step-label {
    font-size: 12px !important;
    line-height: 1.4 !important;
    letter-spacing: .05em !important;
}

/* AUDIT / POSITIONNEMENT / STRATÉGIE / ETC. */
.aoc-methode-page .aoc-methode-step-content li {
    font-size: 12px !important;
    line-height: 1.5 !important;
    font-weight: 600 !important;
}
/* MÉTHODE — VIDÉO TERRAIN */

.aoc-methode-story-media {
    overflow: hidden;
}

.aoc-methode-story-video {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 100%;
    object-fit: cover;
}
/* ==================================================
   EXPERTISES — PARCOURS / ESPACEMENTS
================================================== */

.aoc-expertises-page .aoc-expertises-parcours {
    padding-top: 10px;
    padding-bottom: 60px;
}

.aoc-expertises-page .aoc-expertises-parcours .aoc-methode-section-head {
    margin-bottom: 35px;
}

.aoc-expertises-page .aoc-expertises-parcours .aoc-methode-section-head h2 {
    margin-bottom: 0;
}

.aoc-expertises-page .aoc-expertises-parcours-grid {
    margin-top: 0;
}
/* ==================================================
   MÉTHODE — RYTHME VERTICAL FINAL
   Aligné sur la page Expertises
================================================== */

/* HERO */
.aoc-methode-page .aoc-methode-hero {
    padding-bottom: 40px !important;
}

/* COMMENT NOUS TRAVAILLONS + ÉTAPES */
.aoc-methode-page .aoc-methode-process {
    margin: 0 !important;
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}

.aoc-methode-page .aoc-methode-process .aoc-methode-section-head {
    margin-bottom: 35px !important;
}

/* SUR LE TERRAIN */
.aoc-methode-page .aoc-methode-story {
    margin: 0 !important;
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}

/* EXPÉRIENCE */
.aoc-methode-page .aoc-methode-manifesto {
    margin: 0 !important;
    padding-top: 55px !important;
    padding-bottom: 55px !important;
}

/* UNE AGENCE AGILE */
.aoc-methode-page .aoc-methode-collab {
    margin: 0 !important;
    padding-top: 50px !important;
    padding-bottom: 50px !important;
}

.aoc-methode-page .aoc-methode-collab .aoc-methode-section-head {
    margin-bottom: 35px !important;
}
/* MÉTHODE — dernier ajustement vertical */

.aoc-methode-page .aoc-methode-process {
    padding-bottom: 20px !important;
}

.aoc-methode-page .aoc-methode-story {
    padding-top: 25px !important;
}
/* MÉTHODE — plus d'espace entre le verbe et le contenu */

.aoc-methode-page .aoc-methode-step {
    grid-template-columns: 50px 300px 1fr !important;
    column-gap: 40px !important;
}
/* MÉTHODE — vidéo au ratio d'origine */

.aoc-methode-page .aoc-methode-story-media {
    overflow: hidden;
    height: auto !important;
    min-height: 0 !important;
}

.aoc-methode-page .aoc-methode-story-video {
    display: block;
    width: 100%;
    height: auto !important;
    min-height: 0 !important;
    object-fit: contain !important;
}
/* =========================================================
   MÉTHODE — RAPPROCHER LE HERO DU FIL D'ARIANE
   ========================================================= */

.aoc-methode-page .aoc-methode-hero {
    padding-top: 55px !important;
}
/* =========================================================
   RÉFÉRENCES — INTRO DESKTOP
   ========================================================= */

@media (min-width: 769px) {

    /* Centre le surtitre, le titre et l'introduction */
    .aoc-ref-page .aoc-ref-intro .aoc-ref-eyebrow,
    .aoc-ref-page .aoc-ref-intro h1,
    .aoc-ref-page .aoc-ref-intro > .aoc-ref-wrap > p {
        text-align: center;
    }

    /* Centre le paragraphe sous le titre */
    .aoc-ref-page .aoc-ref-intro > .aoc-ref-wrap > p {
        margin-left: auto;
        margin-right: auto;
    }

    /* Le fil d'Ariane reste aligné à gauche */
    .aoc-ref-page .aoc-ref-intro .aoc-ref-breadcrumb {
        text-align: left;
    }
}


/* =========================================================
   ACTUS — INTRO + FILTRES DESKTOP
   ========================================================= */

@media (min-width: 769px) {

    /* Centre surtitre, titre et introduction */
    .aoc-actus-page .aoc-actus-intro .aoc-actus-eyebrow,
    .aoc-actus-page .aoc-actus-intro h1,
    .aoc-actus-page .aoc-actus-intro > .aoc-actus-wrap > p {
        text-align: center;
    }

    /* Centre le paragraphe */
    .aoc-actus-page .aoc-actus-intro > .aoc-actus-wrap > p {
        margin-left: auto;
        margin-right: auto;
    }

    /* Garde le fil d'Ariane à gauche */
    .aoc-actus-page .aoc-actus-breadcrumb {
        text-align: left;
    }

    /* Centre les filtres */
    .aoc-actus-page .aoc-actus-filter-list {
        justify-content: center;
    }
}


/* =========================================================
   RÉFÉRENCES — MOBILE
   Intro centrée / filtres 2 colonnes / rouages préservés
   ========================================================= */

@media (max-width: 768px) {

    /* =====================================================
       INTRO
       ===================================================== */

    /* Fil d'Ariane à gauche */
    .aoc-ref-page .aoc-ref-breadcrumb {
        text-align: left !important;
    }

    /* Surtitre + titre + introduction centrés */
    .aoc-ref-page .aoc-ref-intro .aoc-ref-eyebrow,
    .aoc-ref-page .aoc-ref-intro h1,
    .aoc-ref-page .aoc-ref-intro > .aoc-ref-wrap > p {
        text-align: center !important;
    }

    .aoc-ref-page .aoc-ref-intro > .aoc-ref-wrap > p {
        margin-left: auto !important;
        margin-right: auto !important;
        max-width: 100% !important;
    }

    /* Réduit le blanc entre l'introduction et les filtres */
    .aoc-ref-page .aoc-ref-intro {
        padding-bottom: 25px !important;
    }


    /* =====================================================
       FILTRES
       ===================================================== */

    .aoc-ref-page .aoc-ref-filters {
        width: 100% !important;
        margin-top: 0 !important;

        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

        gap: 8px !important;
    }

    /*
     * Neutralise les anciennes lignes de filtres.
     * Les boutons deviennent directement
     * des éléments de la grille.
     */
    .aoc-ref-page .aoc-ref-filter-row {
        display: contents !important;
    }

    .aoc-ref-page .aoc-ref-filter {
        width: 100% !important;
        min-width: 0 !important;

        grid-column: auto !important;

        margin: 0 !important;
        padding: 11px 6px !important;

        box-sizing: border-box !important;

        font-size: 11px !important;
        line-height: 1.2 !important;

        text-align: center !important;
        white-space: normal !important;
    }

    /* Seulement "Toutes" occupe les deux colonnes */
    .aoc-ref-page .aoc-ref-filter[data-filter="all"] {
        grid-column: 1 / -1 !important;
    }


    /* =====================================================
       CONTENU DES ROUAGES
       On ne touche PAS à leur géométrie
       ===================================================== */

    .aoc-ref-page .aoc-ref-content {
        text-align: center !important;
        align-items: center !important;
        justify-content: center !important;
    }


    /* =====================================================
       NOM DE LA RÉFÉRENCE
       ===================================================== */

    .aoc-ref-page .aoc-ref-content h2 {
        width: 100% !important;

        margin-left: auto !important;
        margin-right: auto !important;

        font-size: 17px !important;
        line-height: 1.08 !important;
        letter-spacing: -0.02em !important;

        text-align: center !important;

        word-break: normal !important;
        overflow-wrap: normal !important;
        hyphens: none !important;
    }

} /* FIN DU MOBILE */


/* Références : couleurs FIXES sur écrans tactiles, même au clic/hover */
@media (hover: none) and (pointer: coarse) {
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-purple .aoc-ref-shape { background: #7500CA !important; }
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-purple .aoc-ref-content { color: #FFFF5D !important; }
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-yellow .aoc-ref-shape { background: #FFFF5D !important; }
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-yellow .aoc-ref-content { color: #7500CA !important; }
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-pink .aoc-ref-shape { background: #FF8FE3 !important; }
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-pink .aoc-ref-content { color: #33066B !important; }
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-brown .aoc-ref-shape { background: #4A3524 !important; }
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-brown .aoc-ref-content { color: #FFFF5D !important; }
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-peach .aoc-ref-shape { background: #FFB894 !important; }
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-peach .aoc-ref-content { color: #4A3524 !important; }
}

/* Affichage du nom AOC dans le header */

.aoc-header .brand .logo {
    display: block;
    visibility: visible;
    opacity: 1;
}

/* AOC — Références : couleurs au toucher pour TOUS les rouages (mobile) */
@media (hover: none) and (pointer: coarse) {
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-purple.aoc-touch-selected .aoc-ref-shape { background: #FFFF5D !important; }
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-purple.aoc-touch-selected .aoc-ref-content { color: #7500CA !important; }
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-yellow.aoc-touch-selected .aoc-ref-shape { background: #7500CA !important; }
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-yellow.aoc-touch-selected .aoc-ref-content { color: #FFFF5D !important; }
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-pink.aoc-touch-selected .aoc-ref-shape { background: #7500CA !important; }
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-pink.aoc-touch-selected .aoc-ref-content { color: #FFFF5D !important; }
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-brown.aoc-touch-selected .aoc-ref-shape { background: #FFB894 !important; }
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-brown.aoc-touch-selected .aoc-ref-content { color: #4A3524 !important; }
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-peach.aoc-touch-selected .aoc-ref-shape { background: #FF8FE3 !important; }
  body.page-id-7770 .aoc-ref-page .aoc-ref-card.ref-peach.aoc-touch-selected .aoc-ref-content { color: #33066B !important; }
}
/* =========================================================
   CONTACT — BOUTON VIOLET SUR LA PAGE CONTACT
   ========================================================= */

body.page-contact .aoc-header .btn.btn-solid,
body.page-contact .aoc-header .btn.btn-solid:hover,
body.page-contact .aoc-header .btn.btn-solid:focus,
body.page-contact .aoc-header .btn.btn-solid:active {
    background: #7500ca !important;
    background-color: #7500ca !important;
    background-image: none !important;
    color: #ffff5d !important;
    opacity: 1 !important;
    filter: none !important;
    transition: none !important;
}


/* =========================================================
   HEADER MOBILE — LOGO : EFFET AU CLIC
   ========================================================= */

@media (hover: none) {

    .aoc-page .aoc-header .aoc-header-logo {
        transform-origin: center center;
        transition: transform .12s ease !important;
    }

    /* Si le lien entoure le logo */
    .aoc-page .aoc-header a:active .aoc-header-logo,
    .aoc-page .aoc-header a:focus .aoc-header-logo,
    .aoc-page .aoc-header a:hover .aoc-header-logo,

    /* Si le logo est lui-même dans un lien */
    .aoc-page .aoc-header a:active.aoc-header-logo,
    .aoc-page .aoc-header a:focus.aoc-header-logo {
        transform: scale(0.88) !important;
    }

}


/* AOC - References : centrage des noms sur ordinateur uniquement.
   Les rouages, les etiquettes et le mobile restent inchanges. */
@media (min-width: 1025px) and (hover: hover) {
  body.page-id-7770 .aoc-ref-page .aoc-ref-mosaic .aoc-ref-content {
    position: relative !important;
  }
  body.page-id-7770 .aoc-ref-page .aoc-ref-mosaic .aoc-ref-content h2 {
    margin: 0 !important;
    text-align: center !important;
  }
  body.page-id-7770 .aoc-ref-page .aoc-ref-mosaic .aoc-ref-content span {
    position: absolute !important;
    top: calc(100% + 10px) !important;
    left: 0 !important;
    width: 100% !important;
    margin: 0 !important;
  }
}
/* AOC – alignement vertical des noms des références sur desktop */
@media (min-width: 1025px) and (hover: hover) {
  body.page-id-7770 .aoc-ref-page .aoc-ref-mosaic .aoc-ref-content {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    margin: 0 !important;
  }
}


/* AOC — Flèche des cartes Expertises sur mobile */

@media (max-width: 767px) {

  .aoc-page .exp-grid a.exp-card {
    position: relative;
    padding-bottom: 48px;
    text-decoration: none;
  }

  .aoc-page .exp-grid a.exp-card::after {
    content: "→";
    position: absolute;
    right: 20px;
    bottom: 14px;

    font-family: "Archivo", sans-serif;
    font-size: 25px;
    font-weight: 400;
    line-height: 1;

    color: inherit;
    background: transparent;
    border: none;
    border-radius: 0;

    pointer-events: none;
  }

}

/* ==================================================
   AOC — MÉTHODE : correction des listes d'étapes
================================================== */

.aoc-page.aoc-methode-page
.aoc-methode-step-content ul {
  list-style: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}

.aoc-page.aoc-methode-page
.aoc-methode-step-content li {
  position: relative;
  list-style: none !important;
  padding-left: 0 !important;
}

.aoc-page.aoc-methode-page
.aoc-methode-step-content li::before,
.aoc-page.aoc-methode-page
.aoc-methode-step-content li::after {
  content: none !important;
  display: none !important;
}

/* AOC — Cartes Méthode cliquables */

.aoc-page .method-row a.method-step {
  display: block;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}

.aoc-page .method-row a.method-step:focus-visible {
  outline: 2px solid var(--purple);
  outline-offset: 3px;
}

/* ==================================================
   AOC — ACCUEIL / MÉTHODE
   Couleurs, survol et flèches mobile
================================================== */

/* Cartes cliquables */
.aoc-page #methode .method-row a.method-step {
  position: relative;
  display: block;
  color: #17130f;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .25s ease,
              color .25s ease;
}

/* 1 — PENSER : PÊCHE */
.aoc-page #methode .method-row a.method-step:nth-child(1) {
  background-color: #ffb99b;
}

/* 2 — FAIRE : JAUNE */
.aoc-page #methode .method-row a.method-step:nth-child(2) {
  background-color: #ffff5d;
}

/* 3 — TRANSMETTRE : VIOLET */
.aoc-page #methode .method-row a.method-step:nth-child(3) {
  background-color: #5c2a8a;
  color: #fff;
}

/* Textes : héritent de la couleur de la carte */
.aoc-page #methode .method-step h3,
.aoc-page #methode .method-step .method-num,
.aoc-page #methode .method-step li {
  color: inherit;
}

/* SURVOL DESKTOP : rotation des couleurs */
@media (hover: hover) {

  .aoc-page #methode .method-row a.method-step:nth-child(1):hover {
    background-color: #ffff5d;
    color: #17130f;
  }

  .aoc-page #methode .method-row a.method-step:nth-child(2):hover {
    background-color: #5c2a8a;
    color: #fff;
  }

  .aoc-page #methode .method-row a.method-step:nth-child(3):hover {
    background-color: #ffb99b;
    color: #17130f;
  }

}

/* Accessibilité clavier */
.aoc-page #methode .method-step:focus-visible {
  outline: 3px solid #5c2a8a;
  outline-offset: -5px;
}

/* MOBILE : flèches discrètes */
@media (max-width: 767px) {

  .aoc-page #methode .method-row a.method-step {
    padding-bottom: 54px;
  }

  .aoc-page #methode .method-row a.method-step::after {
    content: "→";
    position: absolute;
    right: 22px;
    bottom: 16px;
    font-family: "Archivo", sans-serif;
    font-size: 27px;
    font-weight: 400;
    line-height: 1;
    color: inherit;
    pointer-events: none;
  }

}

/* ==========================================
   AOC — ACCUEIL / MÉTHODE
   Couleurs identiques à la page Méthode
========================================== */

.aoc-page #methode .method-row a.method-step {
  position: relative;
  color: #17130f;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .25s ease,
              color .25s ease;
}

/* ÉTAPE 1 — PENSER : JAUNE */
.aoc-page #methode .method-row a.method-step:nth-child(1) {
  background-color: #ffff5d;
  color: #17130f;
}

/* ÉTAPE 2 — FAIRE : PÊCHE */
.aoc-page #methode .method-row a.method-step:nth-child(2) {
  background-color: #ffb99b;
  color: #17130f;
}

/* ÉTAPE 3 — TRANSMETTRE : VIOLET */
.aoc-page #methode .method-row a.method-step:nth-child(3) {
  background-color: #7600c8;
  color: #fff;
}

/* Harmonisation des textes */
.aoc-page #methode .method-step h3,
.aoc-page #methode .method-step .method-num,
.aoc-page #methode .method-step li {
  color: inherit;
}

/* SURVOLS DESKTOP */
@media (hover: hover) {

  .aoc-page #methode .method-row a.method-step:nth-child(1):hover {
    background-color: #ffb99b;
  }

  .aoc-page #methode .method-row a.method-step:nth-child(2):hover {
    background-color: #7600c8;
    color: #fff;
  }

  .aoc-page #methode .method-row a.method-step:nth-child(3):hover {
    background-color: #ffff5d;
    color: #17130f;
  }
}

/* ACCESSIBILITÉ CLAVIER */
.aoc-page #methode .method-step:focus-visible {
  outline: 3px solid #17130f;
  outline-offset: -5px;
}

/* MOBILE — FLÈCHES */
@media (max-width: 767px) {

  .aoc-page #methode .method-row a.method-step {
    padding-bottom: 54px;
  }

  .aoc-page #methode .method-row a.method-step::after {
    content: "→";
    position: absolute;
    right: 22px;
    bottom: 16px;
    font-family: "Archivo", sans-serif;
    font-size: 27px;
    font-weight: 400;
    line-height: 1;
    color: inherit;
    pointer-events: none;
  }
}

/* AOC — Méthode accueil : séparateurs Penser */

.aoc-page #methode .method-row a.method-step:first-child li {
  border-bottom: 1px solid rgba(23, 19, 15, 0.22);
}

.aoc-page #methode .method-row a.method-step:first-child li:last-child {
  border-bottom: none;
}

/* AOC — ACCUEIL / MÉTHODE : alignement et textes */

.aoc-page #methode .method-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}

.aoc-page #methode .method-row a.method-step {
  box-sizing: border-box;
  min-width: 0;
  width: 100%;
  margin: 0;
  padding: 40px 30px;
  display: flex;
  flex-direction: column;
}

/* Alignement des titres et listes */
.aoc-page #methode .method-step .method-num {
  margin: 0 0 12px;
}

.aoc-page #methode .method-step h3 {
  margin: 0 0 20px;
}

.aoc-page #methode .method-step ul {
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

.aoc-page #methode .method-step li {
  margin: 0;
  padding: 10px 0;
  border-bottom: 1px solid currentColor;
  border-color: rgba(92, 42, 138, .25);
}

.aoc-page #methode .method-step li:last-child {
  border-bottom: none;
}

/* Penser et Faire : textes violets */
.aoc-page #methode .method-row a.method-step:nth-child(1),
.aoc-page #methode .method-row a.method-step:nth-child(2) {
  color: #5c2a8a;
}

/* Transmettre : textes blancs */
.aoc-page #methode .method-row a.method-step:nth-child(3) {
  color: #fff;
}

.aoc-page #methode .method-row a.method-step:nth-child(3) li {
  border-color: rgba(255,255,255,.25);
}

/* Tous les textes héritent de la couleur de la carte */
.aoc-page #methode .method-step h3,
.aoc-page #methode .method-step .method-num,
.aoc-page #methode .method-step li {
  color: inherit;
}

/* Conserver les trois cartes empilées sur mobile */
@media (max-width: 767px) {
  .aoc-page #methode .method-row {
    grid-template-columns: 1fr;
  }

  .aoc-page #methode .method-row a.method-step {
    padding: 30px 24px 54px;
  }
}





/* =========================================================
   AOC — COLLABORATIONS
   CORRECTION DESKTOP + MOBILE
   Pleine largeur, centrage, portraits, flèche
   ========================================================= */

/* 1. MASQUER HEADER ET FOOTER GENERATEPRESS */

body:has(.aoc-collaborations-page) > #masthead,
body:has(.aoc-collaborations-page) #page > #masthead,
body:has(.aoc-collaborations-page) #page > #colophon,
body:has(.aoc-collaborations-page) #page > .site-footer {
    display: none !important;
}

/* 2. PLEINE LARGEUR WORDPRESS / GENERATEPRESS */

body:has(.aoc-collaborations-page) #page,
body:has(.aoc-collaborations-page) #content,
body:has(.aoc-collaborations-page) #primary,
body:has(.aoc-collaborations-page) #main,
body:has(.aoc-collaborations-page) .site-content,
body:has(.aoc-collaborations-page) .content-area,
body:has(.aoc-collaborations-page) .site-main,
body:has(.aoc-collaborations-page) .inside-article,
body:has(.aoc-collaborations-page) .entry-content {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* 3. CONTENEUR GLOBAL */

body .aoc-page.aoc-collaborations-page {
    display: block;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box;
}

/* 4. HEADER AOC PLEINE LARGEUR */

.aoc-collaborations-page .aoc-header {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

/* 5. FIL D'ARIANE — STYLE RÉFÉRENCES */

.aoc-collaborations-page .aoc-breadcrumb {
    display: block;
    width: 100% !important;
    max-width: 1050px !important;

    margin: 0 auto !important;
    padding: 60px 25px 0 !important;

    font-family: 'Chivo Mono', monospace;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: .06em;
    text-transform: uppercase;

    color: #8B8A80;
    text-align: left;
}

.aoc-collaborations-page .aoc-breadcrumb a,
.aoc-collaborations-page .aoc-breadcrumb span {
    font-family: 'Chivo Mono', monospace;
    font-size: inherit;
    font-weight: 400;
    letter-spacing: inherit;
    text-transform: uppercase;
    color: #8B8A80;
    text-decoration: none;
}

.aoc-collaborations-page .aoc-breadcrumb a:hover {
    color: #7500CA;
}

/* 6. CONTENEUR COLLABORATIONS */

.aoc-collaborations-page .aoc-collaborations {
    display: block;
    width: 100% !important;
    max-width: 1050px !important;

    margin: 0 auto !important;
    padding: 32px 25px 90px !important;

    box-sizing: border-box;
}

/* 7. INTRODUCTION CENTRÉE */

.aoc-collaborations-page .aoc-collaborations__intro {
    width: 100%;
    max-width: 100%;

    margin: 0 auto 44px !important;
    padding: 0 !important;

    text-align: center !important;
}

/* 8. TITRE — MÊME TYPOGRAPHIE QUE RÉFÉRENCES */

.aoc-collaborations-page .aoc-collaborations__intro h1 {
    margin: 10px 0 0 !important;

    font-family: 'Archivo', sans-serif;
    font-size: clamp(46px, 7vw, 88px);
    font-weight: 800;
    line-height: .96;
    letter-spacing: -.035em;

    color: #15120B;
    text-align: center !important;
}

/* 9. DESCRIPTION CENTRÉE */

.aoc-collaborations-page .aoc-collaborations__description {
    width: 100%;
    max-width: 610px;

    margin: 22px auto 0 !important;

    font-family: 'Archivo', sans-serif;
    font-size: 17px;
    font-weight: 400;
    line-height: 1.6;

    color: #4A4738;
    text-align: center !important;
}

/* 10. GRILLE CENTRÉE — DEUX COLONNES */

.aoc-collaborations-page .aoc-collaborations__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    width: 100% !important;
    max-width: 1000px !important;

    margin: 0 auto !important;
    padding: 0 !important;

    column-gap: 28px;
    row-gap: 44px;
    align-items: start;
}

/* 11. CARTES */

.aoc-collaborations-page .aoc-collaboration {
    min-width: 0;
    margin: 0;
    padding: 0;
}

/* 12. PORTRAITS — FORMAT UNIFORME */

.aoc-collaborations-page .aoc-collaboration__image {
    position: relative;
    display: block;

    width: 100%;
    aspect-ratio: 4 / 3;

    overflow: hidden;
    background: #7500CA;
}

.aoc-collaborations-page .aoc-collaboration__image img {
    display: block;

    width: 100% !important;
    height: 100% !important;

    aspect-ratio: auto !important;
    object-fit: cover;
    object-position: center;

    transition: transform .35s ease;
}

/* 13. FILTRE VIOLET */

.aoc-collaborations-page .aoc-collaboration__image::after {
    content: "";

    position: absolute;
    inset: 0;

    background: #7500CA;
    opacity: .35;

    pointer-events: none;
    transition: opacity .3s ease;
}

/* 14. SURVOL DES PHOTOGRAPHIES */

@media (hover: hover) and (pointer: fine) {

    .aoc-collaborations-page
    .aoc-collaboration:hover
    .aoc-collaboration__image::after {
        opacity: 0;
    }

    .aoc-collaborations-page
    .aoc-collaboration:hover
    .aoc-collaboration__image img {
        transform: scale(1.035);
    }
}

/* 15. NOMS */

.aoc-collaborations-page .aoc-collaboration__content {
    padding-top: 14px;
}

.aoc-collaborations-page .aoc-collaboration__content h2 {
    margin: 0 !important;

    font-family: 'Archivo', sans-serif;
    font-size: 20px !important;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -.02em;

    color: #15120B;
}

.aoc-collaborations-page .aoc-collaboration__content h2 a {
    color: #15120B;
    text-decoration: none;
}

.aoc-collaborations-page .aoc-collaboration__content h2 a:hover {
    color: #7500CA;
}

/* 16. FLÈCHE MASQUÉE SUR DESKTOP */

.aoc-collaborations-page .aoc-collaboration__arrow {
    display: none !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

    /* Fil d'Ariane */

    .aoc-collaborations-page .aoc-breadcrumb {
        padding: 40px 20px 0 !important;
    }

    /* Conteneur */

    .aoc-collaborations-page .aoc-collaborations {
        padding: 32px 20px 75px !important;
    }

    /* Introduction */

    .aoc-collaborations-page .aoc-collaborations__intro {
        margin-bottom: 36px !important;
    }

    /* Titre */

    .aoc-collaborations-page .aoc-collaborations__intro h1 {
        font-size: 48px;
        text-align: center !important;
    }

    /* Description */

    .aoc-collaborations-page .aoc-collaborations__description {
        font-size: 16px;
        text-align: center !important;
    }

    /* Grille — une colonne */

    .aoc-collaborations-page .aoc-collaborations__grid {
        grid-template-columns: minmax(0, 1fr);

        max-width: 520px !important;
        row-gap: 36px;
    }

    /* Noms */

    .aoc-collaborations-page .aoc-collaboration__content {
        padding-top: 12px;
    }

    .aoc-collaborations-page .aoc-collaboration__content h2 {
        font-size: 20px !important;
    }

    /* Nom et flèche alignés */

    .aoc-collaborations-page .aoc-collaboration__content h2 a {
        display: flex !important;
        align-items: center;
        justify-content: space-between;

        width: 100%;
        gap: 15px;
    }

    /* Flèche horizontale vers la droite */

    .aoc-collaborations-page .aoc-collaboration__arrow {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;

        font-size: 0 !important;
        line-height: 1;
        color: #7500CA;
    }

    .aoc-collaborations-page .aoc-collaboration__arrow::before {
        content: "\2192";
        display: block;

        font-family: 'Archivo', sans-serif;
        font-size: 26px !important;
        font-weight: 400;
        line-height: 1;

        color: #7500CA;
    }
}

/* PETITS MOBILES */

@media (max-width: 380px) {

    .aoc-collaborations-page .aoc-collaborations__intro h1 {
        font-size: 42px;
    }
}

/* ACCESSIBILITÉ */

@media (prefers-reduced-motion: reduce) {

    .aoc-collaborations-page .aoc-collaboration__image img,
    .aoc-collaborations-page .aoc-collaboration__image::after {
        transition: none;
    }
}



/* ==========================================
   AOC — ALIGNEMENT MENU DESKTOP
   ========================================== */

/* Grands écrans */
@media (min-width: 1450px) {

  .aoc-page .aoc-header .nav-links {
    position: absolute !important;

    /* Alignement sur AGENCE INDÉPENDANTE */
    left: calc(50% - 500px) !important;
    top: 50% !important;
    transform: translateY(-50%) !important;

    margin: 0 !important;
    gap: 30px !important;
  }

  .aoc-page .aoc-header .nav-links a {
    font-family: 'Archivo', sans-serif !important;
    font-size: 19px !important;
    font-weight: 800 !important;
    color: #15120B !important;
  }
}

/* Écrans de 13 pouces et ordinateurs intermédiaires */
@media (min-width: 901px) and (max-width: 1449px) {

  .aoc-page .aoc-header .nav-links {
    position: static !important;
    transform: none !important;

    margin-left: 32px !important;
    margin-right: auto !important;

    gap: 18px !important;
  }

  .aoc-page .aoc-header .nav-links a {
    font-family: 'Archivo', sans-serif !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #15120B !important;
  }
}




/* ==========================================
   AOC — HEADER DESKTOP DEUX LIGNES
   HARMONISATION ENTRE LES PAGES
   ========================================== */

@media (min-width: 1200px) {

  /* Accueil */
  .aoc-page {
    padding-top: 0 !important;
  }

  /* Header sur deux lignes */
  :is(
    .aoc-page,
    .aoc-ref-page,
    .aoc-single-reference,
    .aoc-actus-archive,
    .aoc-single-actu,
    .aoc-contact-page,
    .aoc-collaborations-page,
    .aoc-expertises-page,
    .aoc-methode-page
  ) .aoc-header > .nav {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    align-items: center !important;
    column-gap: 24px;
    row-gap: 0;

    min-height: 0 !important;
    padding: 12px 24px 16px !important;
  }

  /* Logo et nom en haut à gauche */
  :is(
    .aoc-page,
    .aoc-ref-page,
    .aoc-single-reference,
    .aoc-actus-archive,
    .aoc-single-actu,
    .aoc-contact-page,
    .aoc-collaborations-page,
    .aoc-expertises-page,
    .aoc-methode-page
  ) .aoc-header .brand {
    grid-column: 1;
    grid-row: 1;
  }

  /* Contact à droite sur la deuxième ligne */
  :is(
    .aoc-page,
    .aoc-ref-page,
    .aoc-single-reference,
    .aoc-actus-archive,
    .aoc-single-actu,
    .aoc-contact-page,
    .aoc-collaborations-page,
    .aoc-expertises-page,
    .aoc-methode-page
  ) .aoc-header .aoc-header-contact {
    grid-column: 2;
    grid-row: 2;
    justify-self: end;
    align-self: center;
  }

  /* Menu sur la deuxième ligne */
  :is(
    .aoc-page,
    .aoc-ref-page,
    .aoc-single-reference,
    .aoc-actus-archive,
    .aoc-single-actu,
    .aoc-contact-page,
    .aoc-collaborations-page,
    .aoc-expertises-page,
    .aoc-methode-page
  ) .aoc-header .nav-links {
    grid-column: 1;
    grid-row: 2;

    position: static !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    margin-left: max(
      0px,
      calc((100vw - 980px) / 2 - 24px)
    ) !important;

    margin-right: 0 !important;
    gap: 36px !important;
  }

  /* Typographie du menu */
  :is(
    .aoc-page,
    .aoc-ref-page,
    .aoc-single-reference,
    .aoc-actus-archive,
    .aoc-single-actu,
    .aoc-contact-page,
    .aoc-collaborations-page,
    .aoc-expertises-page,
    .aoc-methode-page
  ) .aoc-header .nav-links a {
    font-family: 'Archivo', sans-serif !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    letter-spacing: -0.025em !important;
    line-height: 1.2 !important;
    color: #15120B !important;
    white-space: nowrap;
  }

  /* Filet violet sous les liens */
  :is(
    .aoc-page,
    .aoc-ref-page,
    .aoc-single-reference,
    .aoc-actus-archive,
    .aoc-single-actu,
    .aoc-contact-page,
    .aoc-collaborations-page,
    .aoc-expertises-page,
    .aoc-methode-page
  ) .aoc-header .nav-links a::after {
    height: 1px !important;
  }

}

/* Écrans intermédiaires */
@media (min-width: 1200px) and (max-width: 1350px) {

  :is(
    .aoc-page,
    .aoc-ref-page,
    .aoc-single-reference,
    .aoc-actus-archive,
    .aoc-single-actu,
    .aoc-contact-page,
    .aoc-collaborations-page,
    .aoc-expertises-page,
    .aoc-methode-page
  ) .aoc-header .nav-links {
    gap: 24px !important;
  }

  :is(
    .aoc-page,
    .aoc-ref-page,
    .aoc-single-reference,
    .aoc-actus-archive,
    .aoc-single-actu,
    .aoc-contact-page,
    .aoc-collaborations-page,
    .aoc-expertises-page,
    .aoc-methode-page
  ) .aoc-header .nav-links a {
    font-size: 18px !important;
  }

}

/* ==========================================
   AOC — DERNIERS AJUSTEMENTS DESKTOP
   ========================================== */

@media (min-width: 1200px) {

  /* Menu : 60 px plus à gauche */
  .aoc-page .aoc-header .nav-links {
    margin-left: max(
      0px,
      calc((100vw - 980px) / 2 - 180px)
    ) !important;
  }

  /* Rapprocher le contenu du filet du header */
  .aoc-page .hero {
    padding-top: 50px !important;
  }

}

/* AOC — ALIGNEMENT INTRO EXPERTISES / MENU */

@media (min-width: 1200px) {

  .aoc-page #expertises .sec-head {
    position: relative;
    left: calc(
      24px
      + max(0px, (100vw - 980px) / 2 - 180px)
      - 64px
      - max(0px, (100vw - 1344px) / 2)
    );
  }

}


/* ==========================================
   AOC — HEADER COMPACT ET STICKY
   DESKTOP
   ========================================== */

@media (min-width: 1200px) {

  /* Header visible pendant le défilement */
  .aoc-page .aoc-header {
    position: sticky !important;
    top: 0 !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    z-index: 9999 !important;
    background: #FFFFFF !important;
    border-bottom: 1px solid rgba(21,18,11,.12) !important;
  }

  /* Deux lignes compactes */
  .aoc-page .aoc-header > .nav {
    row-gap: 0 !important;
    padding-top: 8px !important;
    padding-bottom: 10px !important;
  }

  /* Aucun décalage artificiel */
  .aoc-page {
    padding-top: 0 !important;
  }

  /* Espacement naturel du hero */
  .aoc-page .hero {
    padding-top: 80px !important;
  }

  /* Barre d'administration WordPress */
  body.admin-bar .aoc-page .aoc-header {
    top: 32px !important;
  }

}

/* ==========================================
   AOC — PICTOGRAMMES SOCIAUX
   ========================================== */

@media (min-width: 1200px) {

  .aoc-page .aoc-header .aoc-header-socials {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    align-self: center;

    display: flex;
    align-items: center;
    gap: 18px;
  }

  .aoc-page .aoc-header .aoc-header-socials a {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 32px;
    height: 32px;
    color: #7500CA;
    transition: transform .2s ease;
  }

  .aoc-page .aoc-header .aoc-header-socials svg {
    width: 24px;
    height: 24px;
    display: block;
  }

  .aoc-page .aoc-header .aoc-header-socials a:hover {
    transform: translateY(-2px);
  }

}

/* Masquer les réseaux sociaux sur tablette et mobile */
@media (max-width: 1199px) {

  .aoc-header-socials {
    display: none !important;
  }

}

/* ==========================================
   AOC — ALIGNEMENT DES TITRES ACCUEIL
   MÊME REPÈRE QUE LE MENU : 180
   ========================================== */

@media (min-width: 1200px) {

  /* Décalage commun, identique au menu */
  .aoc-page {
    --aoc-titre-decalage: calc(
      24px
      + max(0px, (100vw - 980px) / 2 - 180px)
      - 64px
      - max(0px, (100vw - 1344px) / 2)
    );
  }

  /* NOTRE MÉTHODE + DE L'IDÉE À L'ACTION */
  .aoc-page #methode .sec-head,

  /* ACTUS : titre et introduction */
  .aoc-page #actus .sec-head {
    position: relative;
    left: var(--aoc-titre-decalage);
  }

  /* CAS CLIENT : titre et sous-titre */
  .aoc-page .cases-slider .case-grid > div:first-child > .eyebrow,
  .aoc-page .cases-slider .case-grid > div:first-child > h2 {
    position: relative;
    left: var(--aoc-titre-decalage);
  }

}



/* ==========================================
   AOC — FILS D'ARIANE
   ALIGNEMENT SUR EXPERTISES — REPÈRE 180
   DESKTOP UNIQUEMENT
   ========================================== */

@media (min-width: 1200px) {

  :root {
    --aoc-bc-cible: calc(
      24px + max(0px, (100vw - 980px) / 2 - 180px)
    );
  }

  /* RÉFÉRENCES — LISTING */
  .aoc-ref-page .aoc-ref-breadcrumb {
    --aoc-bc-origine: max(
      25px, calc((100vw - 1050px) / 2 + 25px)
    );
  }

  /* ACTUS — LISTING */
  .aoc-actus-archive .aoc-actus-breadcrumb {
    --aoc-bc-origine: max(
      25px, calc((100vw - 1050px) / 2 + 25px)
    );
  }

  /* SINGLE RÉFÉRENCE */
  .aoc-single-reference .aoc-ref-breadcrumb {
    --aoc-bc-origine: max(
      28px, calc((100vw - 1320px) / 2 + 28px)
    );
  }

  /* SINGLE ACTU */
  .aoc-single-actu .aoc-actu-breadcrumb {
    --aoc-bc-origine: max(
      20px, calc((100vw - 1040px) / 2 + 20px)
    );
  }

  /* COLLABORATIONS — LISTING */
  .aoc-collaborations-page .aoc-breadcrumb {
    --aoc-bc-origine: max(
      25px, calc((100vw - 1050px) / 2 + 25px)
    );
  }

  /* SINGLE COLLABORATION */
  .aoc-collab-breadcrumb {
    --aoc-bc-origine: max(
      60px, calc((100vw - 1280px) / 2)
    );
  }

  /* ESPACE PRESSE */
  .aoc-press-breadcrumb {
    --aoc-bc-origine: calc(
      max(0px, (100vw - 980px) / 2) + 28px
    );
  }

  /* MENTIONS LÉGALES */
  .aoc-legal-breadcrumb {
    --aoc-bc-origine: max(
      48px, calc((100vw - 1100px) / 2)
    );
  }

  /* EXPERTISES ET MÉTHODE */
  .aoc-expertises-page .aoc-breadcrumb,
  .aoc-methode-page .aoc-breadcrumb {
    --aoc-bc-origine: calc(
      max(0px, (100vw - 1280px) / 2) + 32px
    );
  }

  /* DÉPLACEMENT COMMUN */
  :is(
    .aoc-ref-page .aoc-ref-breadcrumb,
    .aoc-actus-archive .aoc-actus-breadcrumb,
    .aoc-single-reference .aoc-ref-breadcrumb,
    .aoc-single-actu .aoc-actu-breadcrumb,
    .aoc-collaborations-page .aoc-breadcrumb,
    .aoc-collab-breadcrumb,
    .aoc-press-breadcrumb,
    .aoc-legal-breadcrumb,
    .aoc-expertises-page .aoc-breadcrumb,
    .aoc-methode-page .aoc-breadcrumb
  ) {
    position: relative !important;
    left: 0 !important;
    transform: translateX(
      calc(var(--aoc-bc-cible) - var(--aoc-bc-origine))
    ) !important;
  }

}


/* ESPACE PRESSE — ALIGNEMENT FIL D'ARIANE À 180 */

@media (min-width: 1200px) {

  .aoc-press-page .aoc-press-breadcrumb {
    position: relative !important;

    left: calc(
      24px
      + max(0px, (100vw - 980px) / 2 - 180px)
      - max(40px, (100vw - 1080px) / 2)
    ) !important;

    transform: none !important;
  }

}

/* AOC — TYPOGRAPHIE UNIFIÉE DES FILS D'ARIANE */

:is(
  .aoc-ref-breadcrumb,
  .aoc-actus-breadcrumb,
  .aoc-collab-breadcrumb,
  .aoc-press-breadcrumb,
  .aoc-legal-breadcrumb,
  .aoc-breadcrumb
) {
  font-family: 'Chivo Mono', monospace !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
}

/* AOC — COULEUR UNIFIÉE DES FILS D'ARIANE */

:is(
  .aoc-ref-breadcrumb,
  .aoc-actus-breadcrumb,
  .aoc-collab-breadcrumb,
  .aoc-press-breadcrumb,
  .aoc-legal-breadcrumb,
  .aoc-breadcrumb
) {
  color: #8B8A80 !important;
}

/* Tous les liens héritent du même gris */
:is(
  .aoc-ref-breadcrumb,
  .aoc-actus-breadcrumb,
  .aoc-collab-breadcrumb,
  .aoc-press-breadcrumb,
  .aoc-legal-breadcrumb,
  .aoc-breadcrumb
) a {
  color: inherit !important;
}

/* Violet au survol */
:is(
  .aoc-ref-breadcrumb,
  .aoc-actus-breadcrumb,
  .aoc-collab-breadcrumb,
  .aoc-press-breadcrumb,
  .aoc-legal-breadcrumb,
  .aoc-breadcrumb
) a:hover {
  color: #7500CA !important;
}

/* ==========================================
   AOC — FILS D'ARIANE : GRIS UNIFORME
   ========================================== */

:is(
  .aoc-breadcrumb,
  .aoc-ref-breadcrumb,
  .aoc-actus-breadcrumb,
  .aoc-collab-breadcrumb,
  .aoc-press-breadcrumb,
  .aoc-legal-breadcrumb
),
:is(
  .aoc-breadcrumb,
  .aoc-ref-breadcrumb,
  .aoc-actus-breadcrumb,
  .aoc-collab-breadcrumb,
  .aoc-press-breadcrumb,
  .aoc-legal-breadcrumb
) :is(a, span, strong, .current, [aria-current="page"]) {
  color: #8B8A80 !important;
  opacity: 1 !important;
}

/* Violet uniquement au survol des liens */
:is(
  .aoc-breadcrumb,
  .aoc-ref-breadcrumb,
  .aoc-actus-breadcrumb,
  .aoc-collab-breadcrumb,
  .aoc-press-breadcrumb,
  .aoc-legal-breadcrumb
) a:hover {
  color: #7500CA !important;
}

/* ==========================================
   AOC — HAUTEUR UNIFIÉE DES FILS D'ARIANE
   RÉFÉRENCE : EXPERTISES / MÉTHODE
   DESKTOP UNIQUEMENT
   ========================================== */

@media (min-width: 1200px) {

  /* RÉFÉRENCES — LISTING */
  .aoc-ref-page .aoc-ref-intro {
    padding-top: 14px !important;
  }

  /* ACTUS — LISTING */
  .aoc-actus-archive .aoc-actus-intro {
    padding-top: 14px !important;
  }

  /* FICHE RÉFÉRENCE */
  .aoc-single-reference .aoc-ref-layout {
    padding-top: 14px !important;
  }

  /* FICHE ACTU */
  .aoc-single-actu .aoc-actu-layout {
    padding-top: 14px !important;
  }

  /* COLLABORATIONS — LISTING */
  .aoc-collaborations-page .aoc-breadcrumb {
    padding-top: 14px !important;
  }

  /* FICHE COLLABORATION */
  .aoc-collab-page {
    padding-top: 14px !important;
  }

  /* ESPACE PRESSE */
  .aoc-press-page .aoc-press-wrap {
    padding-top: 14px !important;
  }

  /* MENTIONS LÉGALES */
  .aoc-legal-main {
    padding-top: 14px !important;
  }

}



/* SINGLE ACTU — REMONTER UNIQUEMENT LE FIL D'ARIANE */

@media (min-width: 1200px) {

  .aoc-single-actu .aoc-actu-breadcrumb {
    position: relative !important;
    top: -20px !important;
  }

}

/* ==========================================
   AOC — ACCUEIL
   Harmonisation des espaces entre sections
   Desktop uniquement
   ========================================== */

@media (min-width: 901px) {

    /* Références : sélection de projets */
    .aoc-page #references {
        padding-top: 48px !important;
        padding-bottom: 48px !important;
    }

    /* Notre méthode */
    .aoc-page #methode {
        padding-top: 48px !important;
        padding-bottom: 48px !important;
    }

    /* Espacement entre le titre et les blocs */
    .aoc-page #methode .sec-head {
        margin-bottom: 32px !important;
    }

    /* Actualités */
    .aoc-page #actus {
        padding-top: 48px !important;
        padding-bottom: 48px !important;
    }

    .aoc-page #actus .sec-head {
        margin-bottom: 32px !important;
    }

}


/* ==========================================
   AOC — ACCUEIL
   Harmonisation des espacements
   Version ordinateur
   ========================================== */

@media (min-width: 901px) {

    /* Menu → Agence indépendante */
    body.page-id-7690 .aoc-page .hero {
        padding-top: 36px !important;
    }

    /* Bandeau rose → Ce que nous faisons */
    body.page-id-7690 .aoc-page .sec:has(.exp-grid) {
        padding-top: 40px !important;
    }

    /* Boutons → Filet des chiffres clés */
    body.page-id-7690 .aoc-page .stat-strip {
        margin-top: 25px !important;
    }

}



/* ACCUEIL — Bouton Voir toutes les actus */

/* Au repos : fond transparent, bordure violette */
body.page-id-7690 .aoc-page #actus a.btn.btn-ghost {
    border: 2px solid #7500CA !important;
    color: #7500CA !important;
    background: transparent !important;
}

/* Au survol : fond jaune, bordure violette */
body.page-id-7690 .aoc-page #actus a.btn.btn-ghost:hover,
body.page-id-7690 .aoc-page #actus a.btn.btn-ghost:focus-visible {
    background: #FFFF5D !important;
    color: #7500CA !important;
    border-color: #7500CA !important;
}

/* ACCUEIL — Alignement du titre Références */

@media (min-width: 1200px) {

    body.page-id-7690 .aoc-page #references .sec-head {
        position: relative;
        left: calc(
            24px + max(0px, (100vw - 980px) / 2 - 180px)
            - max(32px, (100vw - 1280px) / 2 + 32px)
        );
    }

}
/* ==========================================
   AOC — LISTES DES FICHES RÉFÉRENCES
   ========================================== */

.aoc-single-reference .aoc-ref-content ul {
    list-style-type: disc;
    list-style-position: outside;
    padding-left: 1.5rem;
    margin: 1.25rem 0;
    text-align: left;
}

.aoc-single-reference .aoc-ref-content li {
    display: list-item;
    text-align: left;
    margin-bottom: 0.4rem;
}

.aoc-single-reference .aoc-ref-content ul li::marker {
    color: currentColor;
}


/* ==========================================================================
   NEWSLETTER FOOTER — ENVOI BREVO (inc/aoc-newsletter.php)
   ========================================================================== */

/* Champ anti-spam : hors écran, invisible pour les visiteurs */
.aoc-footer .aoc-newsletter-form .newsletter-hp {
    position: absolute !important;
    left: -9999px !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* Message de retour (succès / erreur) */
.aoc-footer .aoc-newsletter-form .newsletter-message {
    margin: 12px 0 0;
    font-family: "Chivo Mono", monospace;
    font-size: 12px;
    line-height: 1.45;
    color: var(--purple-deep);
}

.aoc-footer .aoc-newsletter-form .newsletter-message:empty {
    display: none;
}

.aoc-footer .aoc-newsletter-form .newsletter-message.is-success {
    color: var(--purple);
    font-weight: 600;
}

.aoc-footer .aoc-newsletter-form .newsletter-message.is-error {
    color: #B00020;
}

/* Bouton pendant l'envoi */
.aoc-footer .aoc-newsletter-form button[disabled] {
    opacity: .6;
    cursor: wait;
}

/* ==========================================
   AOC — PAGE AGENCE
   CORRECTIONS FINALES AVANT LANCEMENT
   ========================================== */

/* 1. INTRODUCTION */

.aoc-agence-page .aoc-agence-content {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.aoc-agence-page .aoc-agence-intro {
    width: min(1280px, calc(100% - 120px)) !important;
    max-width: none !important;
    margin: 0 auto !important;
    padding: 35px 0 20px !important;
}

.aoc-agence-page .aoc-agence-eyebrow {
    color: #7500CA !important;
    font-family: "Chivo Mono", monospace;
    font-size: 12px !important;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    margin-bottom: 16px;
}

.aoc-agence-page .aoc-agence-intro h1 {
    font-family: "Archivo", sans-serif;
    font-size: clamp(56px, 7vw, 96px) !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: -.05em;
    margin: 0 0 24px !important;
}

.aoc-agence-page .aoc-agence-point {
    color: #7500CA !important;
}

.aoc-agence-page .aoc-agence-lead {
    max-width: 1000px !important;
    font-size: clamp(23px, 3vw, 36px) !important;
    font-weight: 500;
    line-height: 1.3 !important;
    margin: 0 !important;
}

.aoc-agence-page .aoc-agence-intro-texte {
    width: 100% !important;
    max-width: 1000px !important;
    margin: 28px 0 0 !important;
}

.aoc-agence-page .aoc-agence-intro-texte p {
    font-size: 17px !important;
    line-height: 1.65 !important;
    margin: 0 0 16px !important;
    color: #4A4738;
}

/* 2. PARCOURS */

.aoc-agence-page .aoc-agence-parcours {
    padding-top: 30px !important;
    padding-bottom: 45px !important;
}

/* 3. AGENCE AGILE ET COLLABORATIONS */

.aoc-agence-page .aoc-agence-collab {
    padding-top: 35px !important;
    padding-bottom: 35px !important;
}

.aoc-agence-page .aoc-agence-collab
.aoc-methode-section-head {
    margin-bottom: 40px !important;
}

/* 4. NOS ENGAGEMENTS */

.aoc-agence-page .aoc-agence-engagements {
    padding-top: 25px !important;
    padding-bottom: 75px !important;
    background: #FFFFFF;
}

.aoc-agence-page .aoc-agence-engagements
.aoc-expertises-engagements {
    margin-top: 0 !important;
}

.aoc-agence-page .aoc-expertises-chips {
    margin-top: 18px !important;
    margin-bottom: 0 !important;
}

/* 5. BANDEAU EXPÉRIENCE */

.aoc-agence-page .aoc-agence-experience {
    margin: 0 !important;
    padding: 60px 0 !important;
    background: #FFB894 !important;
}

/* 6. TABLETTE */

@media (max-width: 980px) {

    .aoc-agence-page .aoc-agence-intro {
        width: calc(100% - 56px) !important;
    }
}

/* 7. MOBILE */

@media (max-width: 700px) {

    .aoc-agence-page .aoc-agence-intro {
        width: calc(100% - 40px) !important;
        padding: 25px 0 15px !important;
    }

    .aoc-agence-page .aoc-agence-intro h1 {
        font-size: 56px !important;
    }

    .aoc-agence-page .aoc-agence-lead {
        font-size: 24px !important;
    }

    .aoc-agence-page .aoc-agence-intro-texte p {
        font-size: 16px !important;
    }

    .aoc-agence-page .aoc-agence-parcours,
    .aoc-agence-page .aoc-agence-collab {
        padding-top: 25px !important;
        padding-bottom: 35px !important;
    }

    .aoc-agence-page .aoc-agence-engagements {
        padding: 25px 0 55px !important;
    }

    .aoc-agence-page .aoc-agence-experience {
        padding: 45px 0 !important;
    }
}

/* ==========================================
   AOC — AGENCE
   ALIGNEMENT DU FIL D'ARIANE
   ========================================== */

.aoc-agence-page .aoc-breadcrumb {
    width: min(1280px, calc(100% - 120px)) !important;
    max-width: none !important;
    margin: 0 auto !important;
    padding: 20px 0 0 !important;
    box-sizing: border-box;
}

/* TABLETTE */

@media (max-width: 980px) {
    .aoc-agence-page .aoc-breadcrumb {
        width: calc(100% - 56px) !important;
    }
}

/* MOBILE */

@media (max-width: 700px) {
    .aoc-agence-page .aoc-breadcrumb {
        width: calc(100% - 40px) !important;
        padding-top: 14px !important;
    }
}

/* ==========================================
   AOC — SINGLE RÉFÉRENCES
   ALIGNEMENT TEXTE ET BOUTON
   ========================================== */

.aoc-single-reference-page .aoc-ref-project {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 18px !important;
}

.aoc-single-reference-page .aoc-ref-project-content {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.aoc-single-reference-page .aoc-ref-project-content .aoc-ref-content {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
}

.aoc-single-reference-page .aoc-ref-site {
    width: 100% !important;
    max-width: none !important;
    margin: 20px 0 45px !important;
    padding: 0 !important;
    text-align: left !important;
}

.aoc-single-reference-page .aoc-ref-site-button {
    display: inline-flex !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
}

/* ==========================================
   AOC — CONTACT
   LISIBILITÉ DU FORMULAIRE
   ========================================== */

/* Champs : fond blanc et texte foncé */

.aoc-contact-form-wrapper input:not([type="submit"]),
.aoc-contact-form-wrapper textarea,
.aoc-contact-form-wrapper select,
.aoc-contact-cf7 input:not([type="submit"]),
.aoc-contact-cf7 textarea,
.aoc-contact-cf7 select {
    background: #FFFFFF !important;
    color: #240046 !important;
    -webkit-text-fill-color: #240046 !important;

    border: 2px solid #C9BEE2 !important;
    border-radius: 0 !important;

    font-size: 16px !important;
    line-height: 1.5 !important;

    opacity: 1 !important;
    caret-color: #7500CA;
}

/* Texte indicatif */

.aoc-contact-form-wrapper input::placeholder,
.aoc-contact-form-wrapper textarea::placeholder,
.aoc-contact-cf7 input::placeholder,
.aoc-contact-cf7 textarea::placeholder {
    color: #62536F !important;
    opacity: 1 !important;
}

/* Focus bien visible */

.aoc-contact-form-wrapper input:focus,
.aoc-contact-form-wrapper textarea:focus,
.aoc-contact-cf7 input:focus,
.aoc-contact-cf7 textarea:focus {
    background: #FFFFFF !important;
    color: #240046 !important;
    -webkit-text-fill-color: #240046 !important;

    border-color: #FFFF5D !important;
    outline: 2px solid #7500CA !important;
    outline-offset: 2px;
}

/* Remplissage automatique Chrome / Safari */

.aoc-contact-form-wrapper input:-webkit-autofill,
.aoc-contact-form-wrapper input:-webkit-autofill:focus,
.aoc-contact-cf7 input:-webkit-autofill,
.aoc-contact-cf7 input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px #FFFFFF inset !important;
    -webkit-text-fill-color: #240046 !important;
    caret-color: #240046 !important;
}

/* Libellés des champs */

.aoc-contact-form-wrapper label,
.aoc-contact-cf7 label {
    color: #FFFFFF !important;
}

/* Messages d'erreur */

.aoc-contact-form-wrapper .wpcf7-not-valid-tip,
.aoc-contact-cf7 .wpcf7-not-valid-tip {
    display: block;
    color: #FFFF5D !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.5 !important;
    margin-top: 8px !important;
}

/* Message après soumission */

.aoc-contact-form-wrapper .wpcf7-response-output,
.aoc-contact-cf7 .wpcf7-response-output {
    color: #FFFFFF !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    padding: 14px !important;
}

/* Bouton envoyer : conserver le jaune */

.aoc-contact-form-wrapper input[type="submit"],
.aoc-contact-cf7 input[type="submit"] {
    background: #FFFF5D !important;
    color: #7500CA !important;
    -webkit-text-fill-color: #7500CA !important;
}