/* =========================
   Variables & bases
   ========================= */
:root{
  --blue:#26a6d4;
  --blue-strong:#1e9ac7;
  --navy:#2a2670;
  --text:#111;
  --border:#e6e9ee;
  --container:1100px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0}
body{
  font:400 16px/1.6 Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--text); background:#fff;
}
.wrap{max-width:var(--container); margin-inline:auto; padding:0 20px}

/* =========================
   Topbar
   ========================= */
.topbar img{display:block; width:100%; max-width:1000px; height:auto; margin:0 auto}

/* =========================
   Navigation
   ========================= */
.mainnav{border-block:2px solid var(--blue); margin-top:10px}
.menu{
  display:flex; flex-wrap:wrap; justify-content:center; align-items:center;
  gap:24px; list-style:none; padding:14px 0; margin:0;
}
.menu a{
  display:inline-block; padding:10px 14px;
  color:var(--text); text-decoration:none; letter-spacing:.3px; font-weight:600; border-radius:6px;
}
.menu a.active{background:var(--blue); color:#fff; box-shadow:0 2px 0 var(--blue-strong) inset}
.nav-toggle{display:none; background:none; border:0; font-size:1.6rem; line-height:1; cursor:pointer}

/* =========================
   Contenu
   ========================= */
.content{padding:40px 0 20px}

.page-title{
  margin:10px 0 8px;
  font-size:clamp(28px, 5vw, 48px);
  letter-spacing:.5px;
  color:var(--blue);
  font-weight:700;
  text-transform:uppercase;
  text-align:center;
}
.page-intro{
  margin:0 auto 10px; max-width:640px;
  text-align:center; color:#555;
}

.partners-group{margin-top:44px}
.group-title{
  margin:0 0 28px;
  text-align:center;
  font-family:"Playfair Display", serif;
  font-style:italic; font-weight:500;
  font-size:clamp(1.4rem, 3vw, 2rem);
  color:var(--navy);
}

/* Grille : les cartes de la dernière ligne restent centrées */
.partners-grid{
  display:flex; flex-wrap:wrap; justify-content:center;
  gap:24px;
}

/* =========================
   Carte partenaire
   ========================= */
.partner-card{
  --accent:var(--blue);
  flex:0 1 240px;
  display:flex; flex-direction:column; align-items:center;
  padding:26px 18px 22px;
  text-align:center;
  background:#fff;
  border-radius:12px;
  border-top:4px solid var(--accent);
  box-shadow:0 10px 28px rgba(30,40,90,.10);
  transition:transform .3s ease, box-shadow .3s ease;
}
.partner-card:hover{
  transform:translateY(-4px);
  box-shadow:0 16px 34px rgba(30,40,90,.16);
}

.partner-logo{
  display:flex; align-items:center; justify-content:center;
  width:100%; height:110px; margin-bottom:18px;
}
.partner-logo img{
  max-width:100%; max-height:100%;
  object-fit:contain; display:block;
}
/* Pastille affichée si le logo est introuvable */
.partner-logo .logo-fallback{
  width:84px; height:84px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--accent); color:#fff;
  font:600 1.6rem/1 Inter,system-ui,sans-serif;
  letter-spacing:.5px;
}

.partner-name{
  margin:0;
  font-family:"Playfair Display", serif;
  font-size:1.05rem; font-weight:500;
  color:var(--navy);
  line-height:1.3;
}
.partner-link{
  margin-top:6px;
  color:var(--blue); text-decoration:none; font-size:.92rem;
}
.partner-link:hover{color:var(--blue-strong); text-decoration:underline}
.partner-link:focus-visible{outline:2px solid var(--blue); outline-offset:3px; border-radius:3px}

/* =========================
   Footer
   ========================= */
.footer{
  margin-top:60px; padding:48px 0 64px; text-align:center;
  background:#2f2e2b; color:#cfd2d6;
}

/* =========================
   Breakpoints
   ========================= */
@media (max-width:1100px){
  :root{--container:92vw}
}
@media (max-width:980px){
  .menu{gap:12px}
}
@media (max-width:700px){
  .mainnav,.mainnav .wrap{position:relative}

  .nav-toggle{
    display:block; position:absolute; right:20px; top:8px; z-index:3;
    padding:8px 10px; background:none; border:0; line-height:1;
  }

  .menu{
    display:none; flex-direction:column; align-items:stretch;
    gap:16px; padding:8px; margin-top:44px; border-top:1px solid #e5e7eb;
    position:relative; z-index:2; background:#fff;
  }
  .menu.open{display:flex}

  .topbar img{max-width:92vw}

    .topbar img{max-width:92vw}

  .partners-grid{gap:14px}
  .partner-card{
    flex:0 1 calc(50% - 7px);
    max-width:none;
    min-width:0;
    padding:18px 10px 16px;
  }
  .partner-logo{height:80px; margin-bottom:12px}
  .partner-name{font-size:.95rem}
  .partner-link{font-size:.85rem}
}
@media (max-width:360px){
  .menu a{padding:10px 8px}

}
@media (max-width:360px){
  .menu a{padding:10px 8px}
}