/* =========================================================================
   Thème ADER — styles complémentaires à theme.json
   Les couleurs, tailles et espacements viennent des variables --wp--preset--*
   ========================================================================= */

/* --- Confort de lecture général ------------------------------------------ */

html {
  scroll-behavior: smooth;
  /* Empêche Safari iOS de grossir le texte en mode paysage. */
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

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

/* Cible de focus visible : obligation d'accessibilité, souvent oubliée. */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid var(--wp--preset--color--brique);
  outline-offset: 2px;
  border-radius: 2px;
}

/* Lien d'évitement pour la navigation au clavier. */
.lien-evitement {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 1000;
  padding: .75rem 1.25rem;
  background: var(--wp--preset--color--marine);
  color: #fff;
  text-decoration: none;
}
.lien-evitement:focus { left: 0; }

/* --- En-tête -------------------------------------------------------------- */

:is(.site-en-tete, header.wp-block-template-part) {
  position: sticky;
  top: 0;
  z-index: 100;
  border-bottom: 1px solid var(--wp--preset--color--filet);
}

/* Le fond flouté est porté par un pseudo-élément : un `backdrop-filter` posé
   sur l'en-tête lui-même enfermerait le menu mobile (en position fixe)
   dans la hauteur de l'en-tête au lieu de couvrir tout l'écran. */
:is(.site-en-tete, header.wp-block-template-part)::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: rgba(255, 255, 255, .94);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}

/* L'espacement automatique entre blocs décollait l'en-tête du haut de page
   et laissait une bande vide entre l'en-tête et le bandeau. */
.wp-site-blocks > :is(.site-en-tete, header.wp-block-template-part, main) {
  margin-block-start: 0;
}

:is(.site-en-tete, header.wp-block-template-part) .wp-block-site-logo img {
  height: 78px;
  width: auto;
  transition: height .2s ease;
}

@media (max-width: 1100px) {
  :is(.site-en-tete, header.wp-block-template-part) .wp-block-site-logo img { height: 58px; }
}

@media (max-width: 781px) {
  :is(.site-en-tete, header.wp-block-template-part) .wp-block-site-logo img { height: 48px; }
}

/* --- Navigation ----------------------------------------------------------- */

.menu-principal {
  font-family: var(--wp--preset--font-family--titre);
  font-weight: 600;
  font-size: 1.1rem;
  letter-spacing: .01em;
  text-transform: uppercase;
}

.menu-principal .wp-block-navigation-item__content {
  color: var(--wp--preset--color--marine-fonce);
  text-decoration: none;
  padding: .4rem .1rem;
  border-bottom: 2px solid transparent;
  transition: color .15s ease, border-color .15s ease;
}

.menu-principal .wp-block-navigation-item__content:hover,
.menu-principal .wp-block-navigation-item__content:focus {
  color: var(--wp--preset--color--brique);
  border-bottom-color: var(--wp--preset--color--brique);
}

/* Page courante signalée autrement que par la seule couleur. */
.menu-principal .current-menu-item > .wp-block-navigation-item__content,
.menu-principal .current_page_item > .wp-block-navigation-item__content {
  color: var(--wp--preset--color--brique);
  border-bottom-color: var(--wp--preset--color--brique);
}

/* Sous-menus déroulants */
.menu-principal .wp-block-navigation__submenu-container {
  border: 1px solid var(--wp--preset--color--filet);
  border-radius: 4px;
  box-shadow: var(--wp--preset--shadow--carte);
  padding: .35rem 0;
  min-width: 15rem;
  background: #fff;
}

.menu-principal .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  padding: .55rem 1.1rem;
  border-bottom: none;
  font-size: 1.05rem;
}

.menu-principal .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
  background: var(--wp--preset--color--sable);
  color: var(--wp--preset--color--brique);
}

/* Bouton « menu » : zone tactile de 44 px sans décaler l'icône. */
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
  padding: 10px;
  margin: -10px;
}

/* Menu mobile plein écran */
.wp-block-navigation__responsive-container.is-menu-open {
  background: var(--wp--preset--color--marine-fonce) !important;
  /* Couleur héritée par la croix de fermeture, sinon noire sur fond sombre. */
  color: #fff !important;
  padding: 1.25rem var(--wp--preset--spacing--40) 2.5rem;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
  color: #fff !important;
  font-family: var(--wp--preset--font-family--titre);
  font-size: 1.5rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .02em;
  line-height: 1.2;
  padding-block: .35rem;
  border-bottom: none;
  text-decoration: none;
}
/* Sélecteurs aussi précis que ceux du cœur de WordPress, pour les supplanter. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container {
  gap: .75rem;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-container {
  background: transparent !important;
  border: none;
  border-left: 2px solid rgba(255, 255, 255, .22);
  box-shadow: none;
  gap: .1rem;
  margin-top: .35rem;
  padding: 0 0 0 1rem;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  font-family: var(--wp--preset--font-family--corps);
  font-size: 1.1rem;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  opacity: .82;
}
/* Page courante : soulignée, la couleur seule ne suffit pas sur fond sombre. */
.wp-block-navigation__responsive-container.is-menu-open :is(.current-menu-item, .current_page_item) > .wp-block-navigation-item__content {
  opacity: 1;
  text-decoration: underline;
  text-decoration-color: var(--wp--preset--color--brique);
  text-decoration-thickness: 3px;
  text-underline-offset: .3em;
}

/* --- Bandeau de page (hero) ---------------------------------------------- */

.bandeau {
  position: relative;
  isolation: isolate;
}

.bandeau .wp-block-cover__background {
  /* Dégradé plutôt qu'un voile uniforme : l'image reste lisible en haut,
     le texte reste contrasté en bas. */
  background: linear-gradient(180deg, rgba(27, 32, 80, .30) 0%, rgba(27, 32, 80, .78) 100%) !important;
  opacity: 1 !important;
}

.bandeau h1,
.bandeau .bandeau__titre {
  color: #fff;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .35);
}

.bandeau__chapo {
  color: rgba(255, 255, 255, .93);
  font-size: var(--wp--preset--font-size--large);
  max-width: 44ch;
  margin-inline: auto;
}

/* Filet rouge décoratif sous les titres de section. */
.titre-filet { position: relative; padding-bottom: .6rem; }
.titre-filet::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 3.5rem;
  height: 3px;
  background: var(--wp--preset--color--brique);
}
.has-text-align-center.titre-filet::after { left: 50%; transform: translateX(-50%); }

/* --- Cartes --------------------------------------------------------------- */

.carte {
  background: #fff;
  border: 1px solid var(--wp--preset--color--filet);
  border-radius: 6px;
  overflow: hidden;
  box-shadow: var(--wp--preset--shadow--carte);
  transition: transform .18s ease, box-shadow .18s ease;
  height: 100%;
}

.carte:hover,
.carte:focus-within {
  transform: translateY(-4px);
  box-shadow: var(--wp--preset--shadow--relief);
}

.carte img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }

.carte__corps { padding: 1.25rem 1.4rem 1.6rem; }

.carte h3 { margin: 0 0 .45rem; }

.carte h3 a {
  color: var(--wp--preset--color--marine-fonce);
  text-decoration: none;
}

.carte:hover h3 a,
.carte:focus-within h3 a { color: var(--wp--preset--color--brique); }

/* Toute la carte devient cliquable à partir du lien du titre. */
.carte__lien::after {
  content: "";
  position: absolute;
  inset: 0;
}
.carte { position: relative; }

/* --- Encadré d'information ------------------------------------------------ */

.encart {
  background: #fff;
  border-left: 4px solid var(--wp--preset--color--brique);
  border-radius: 0 6px 6px 0;
  padding: 1.5rem 1.75rem;
  box-shadow: var(--wp--preset--shadow--carte);
}

.encart--marine {
  background: var(--wp--preset--color--marine);
  border-left-color: var(--wp--preset--color--brique);
  color: #fff;
}
.encart--marine :is(h2, h3, h4, p, li) { color: #fff; }
.encart--marine a { color: #fff; text-decoration-color: rgba(255, 255, 255, .5); }

/* Le bouton plein est bleu marine comme l'encart : on l'inverse pour qu'il reste visible. */
.encart--marine .wp-block-button:not(.is-style-outline) .wp-block-button__link {
  background: #fff;
  color: var(--wp--preset--color--marine-fonce);
  text-decoration: none;
}
.encart--marine .wp-block-button:not(.is-style-outline) .wp-block-button__link:is(:hover, :focus) {
  background: var(--wp--preset--color--brique);
  color: #fff;
}

/* --- Boutons -------------------------------------------------------------- */

/* Le style « contour » ajoute une bordure et son propre rembourrage :
   on les compense pour que les deux styles aient la même hauteur côte à côte. */
.wp-block-button.is-style-outline > .wp-block-button__link {
  padding: calc(.7rem - 2px) calc(1.75rem - 2px);
}

/* --- Trombinoscope du conseil d'administration ---------------------------- */

.membre {
  background: #fff;
  border: 1px solid var(--wp--preset--color--filet);
  border-top: 3px solid var(--wp--preset--color--marine);
  border-radius: 4px;
  padding: 1.1rem 1.25rem;
  height: 100%;
}

/* Les trois lignes forment un seul bloc : pas d'espacement automatique entre elles. */
.membre > * { margin-block-start: 0; }

.membre__role {
  display: block;
  font-family: var(--wp--preset--font-family--titre);
  font-size: 1.05rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--wp--preset--color--brique);
  margin-bottom: .15rem;
}

.membre__nom { display: block; font-weight: 600; font-size: 1.1rem; color: var(--wp--preset--color--marine-fonce); }
.membre__tel { display: block; font-size: .95rem; color: var(--wp--preset--color--gris); margin-top: .2rem; }
.membre__tel a { color: inherit; text-decoration: none; }
.membre__tel a:hover { color: var(--wp--preset--color--brique); text-decoration: underline; }

/* --- Logos de partenaires ------------------------------------------------- */

.partenaires { display: flex; flex-wrap: wrap; gap: 2.5rem 3rem; align-items: center; justify-content: center; }

.partenaires a {
  display: block;
  filter: grayscale(1);
  opacity: .72;
  transition: filter .2s ease, opacity .2s ease, transform .2s ease;
}
.partenaires a:hover,
.partenaires a:focus { filter: grayscale(0); opacity: 1; transform: scale(1.04); }
.partenaires img { max-height: 84px; width: auto; object-fit: contain; }

/* --- Galeries ------------------------------------------------------------- */

.wp-block-gallery.has-nested-images figure.wp-block-image img { border-radius: 4px; }

.wp-block-gallery figcaption {
  font-size: .9rem;
  color: var(--wp--preset--color--gris);
}

/* --- Widgets externes (marées, météo) ------------------------------------- */

.widget-externe {
  background: #fff;
  border: 1px solid var(--wp--preset--color--filet);
  border-radius: 6px;
  padding: 1.25rem;
  box-shadow: var(--wp--preset--shadow--carte);
  overflow: hidden;
}
.widget-externe iframe { max-width: 100%; border: 0; display: block; margin-inline: auto; }

/* --- Lecteur PDF ---------------------------------------------------------- */

.lecteur-pdf {
  /* `object` est inline par défaut : sans `display:block`, les marges
     automatiques de la mise en page ne le centrent pas. */
  display: block;
  margin-inline: auto;
  width: 100%;
  height: min(78vh, 900px);
  border: 1px solid var(--wp--preset--color--filet);
  border-radius: 6px;
  background: #fff;
}

/* Sur téléphone et tablette, Safari n'affiche que la première page d'un PDF
   intégré et Chrome Android n'en affiche aucune : le bouton de
   téléchargement placé sous le lecteur ouvre la visionneuse du système. */
@media (max-width: 781px), (hover: none) and (pointer: coarse) {
  .lecteur-pdf,
  .lecteur-pdf + .wp-block-spacer { display: none; }
  .lecteur-pdf + .wp-block-spacer + * { margin-block-start: 0; }
}

/* --- The Events Calendar : accord avec la charte -------------------------- */

/* Les rangées de TEC ont des marges négatives qui dépassent de 2 px
   sur téléphone et provoquent un défilement horizontal. */
.tribe-events .tribe-events-l-container { overflow-x: clip; }

/* Boutons (recherche, navigation de vues, « Voir plus ») */
.tribe-common .tribe-common-c-btn,
.tribe-common a.tribe-common-c-btn,
.tribe-common button.tribe-common-c-btn,
.tribe-events .tribe-events-c-search__button {
  background-color: var(--wp--preset--color--marine);
  border-color: var(--wp--preset--color--marine);
  border-radius: 4px;
  font-family: var(--wp--preset--font-family--titre);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.tribe-common .tribe-common-c-btn:hover,
.tribe-common a.tribe-common-c-btn:hover,
.tribe-common button.tribe-common-c-btn:hover,
.tribe-events .tribe-events-c-search__button:hover {
  background-color: var(--wp--preset--color--brique);
  border-color: var(--wp--preset--color--brique);
}

/* Titres d'évènements et de sections */
.tribe-events .tribe-events-calendar-list__event-title a,
.tribe-events .tribe-events-calendar-day__event-title a,
.tribe-events .tribe-events-calendar-latest-past__event-title a,
.tribe-events .tribe-events-calendar-month__calendar-event-title a,
.tribe-events .tribe-events-single-event-title {
  font-family: var(--wp--preset--font-family--titre);
  text-transform: uppercase;
  letter-spacing: .01em;
  color: var(--wp--preset--color--marine-fonce);
  text-decoration: none;
}

.tribe-events .tribe-events-calendar-list__event-title a:hover,
.tribe-events .tribe-events-calendar-latest-past__event-title a:hover,
.tribe-events .tribe-events-calendar-month__calendar-event-title a:hover {
  color: var(--wp--preset--color--brique);
  text-decoration: underline;
}

.tribe-events .tribe-events-calendar-latest-past__heading,
.tribe-events .tribe-events-header__title {
  font-family: var(--wp--preset--font-family--titre);
  text-transform: uppercase;
  color: var(--wp--preset--color--marine-fonce);
}

/* Pastille de date : reprend le rouge de la charte */
.tribe-events .tribe-events-calendar-list__month-separator-text,
.tribe-events .tribe-events-calendar-latest-past__event-date-tag-month,
.tribe-events .tribe-events-calendar-list__event-date-tag-month {
  color: var(--wp--preset--color--brique);
  font-family: var(--wp--preset--font-family--titre);
  text-transform: uppercase;
}

/* Lignes d'évènements : TEC les espace très généreusement par défaut. */
.tribe-events .tribe-events-calendar-list__event-row,
.tribe-events .tribe-events-calendar-latest-past__event-row {
  margin-bottom: 1.25rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--wp--preset--color--filet);
}

.tribe-events .tribe-events-calendar-latest-past__event-featured-image-wrapper,
.tribe-events .tribe-events-calendar-list__event-featured-image-wrapper {
  max-width: 240px;
}

.tribe-events .tribe-events-calendar-latest-past__event-featured-image-link img,
.tribe-events .tribe-events-calendar-list__event-featured-image-link img {
  border-radius: 4px;
}

/* Le bandeau de recherche de TEC laisse un grand vide sous l'en-tête. */
.tribe-events .tribe-events-header {
  padding-top: var(--wp--preset--spacing--40);
}

.tribe-events-view { margin-bottom: var(--wp--preset--spacing--50); }

/* --- Formulaire de contact (Fluent Forms) -------------------------------- */

.fluentform .ff-btn-submit {
  font-family: var(--wp--preset--font-family--titre);
  font-size: var(--wp--preset--font-size--large);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .7rem 1.75rem;
  border-radius: 4px;
}

.fluentform .ff-el-form-control {
  border: 1px solid var(--wp--preset--color--filet);
  border-radius: 4px;
  padding: .6rem .8rem;
  font-family: inherit;
  font-size: 1rem;
}

.fluentform .ff-el-form-control:focus {
  border-color: var(--wp--preset--color--marine);
  box-shadow: 0 0 0 3px rgba(42, 50, 122, .14);
}

.fluentform .ff-el-input--label label {
  font-weight: 600;
  color: var(--wp--preset--color--marine-fonce);
}

/* --- Pied de page --------------------------------------------------------- */

:is(.site-pied, footer.wp-block-template-part) {
  background: var(--wp--preset--color--marine-fonce);
  color: rgba(255, 255, 255, .8);
}

:is(.site-pied, footer.wp-block-template-part) :is(h2, h3, h4) { color: #fff; font-size: 1.15rem; }
:is(.site-pied, footer.wp-block-template-part) a { color: #fff; text-decoration-color: rgba(255, 255, 255, .4); }
:is(.site-pied, footer.wp-block-template-part) a:hover { color: var(--wp--preset--color--brique); }
:is(.site-pied, footer.wp-block-template-part) .wp-block-navigation { font-family: var(--wp--preset--font-family--titre); text-transform: uppercase; }
:is(.site-pied, footer.wp-block-template-part) img { max-height: 74px; width: auto; }

.site-pied__legal {
  border-top: 1px solid rgba(255, 255, 255, .14);
  font-size: .9rem;
  color: rgba(255, 255, 255, .6);
}

/* --- Téléphones ----------------------------------------------------------- */

@media (max-width: 781px) {
  /* Safari iOS zoome sur tout champ dont le texte fait moins de 16 px. */
  input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"]),
  select,
  textarea {
    font-size: max(16px, 1em) !important;
  }
}

@media (max-width: 600px) {
  /* Boutons empilés sur toute la largeur : même taille, plus faciles à toucher. */
  .wp-block-buttons {
    flex-direction: column;
    align-items: stretch;
  }
  .wp-block-buttons > .wp-block-button { width: 100%; }
  .wp-block-buttons .wp-block-button__link {
    display: block;
    width: 100%;
    padding-inline: 1rem;
    letter-spacing: .02em;
    line-height: 1.25;
  }
  .wp-block-buttons .wp-block-button.is-style-outline > .wp-block-button__link {
    padding-inline: calc(1rem - 2px);
  }

  /* Chiffres clés de l'accueil, empilés : moins d'air entre chiffre et légende. */
  .wp-block-column > h3.has-text-align-center + p.has-text-align-center { margin-block-start: .35rem; }

  /* Mentions légales du pied de page, passées à la ligne. */
  .site-pied__legal { gap: .25rem; }
}

/* --- Impression ----------------------------------------------------------- */

@media print {
  :is(.site-en-tete, header.wp-block-template-part), :is(.site-pied, footer.wp-block-template-part), .bandeau { display: none !important; }
  body { background: #fff; }
}