/* Normalisation mobile */
:root { color-scheme: light; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

/* Option : assure une hauteur utile correcte sur iOS */
/*.container { min-height: 100svh; }*/

/* Ne pas forcer tous les liens en blanc globalement */
a, a:focus, a:hover { color: inherit; }

/* Respecte la couleur "info" partout */
a.text-info { color: #17a2b8 !important; text-decoration: none; }
a.text-info:hover { text-decoration: underline; }


/*a,
a:focus,
a:hover {
  color: #fff;
}*/
.btn-secondary,
.btn-secondary:hover,
.btn-secondary:focus {
  color: #333;
  text-shadow: none;
  background-color: #fff;
  border: .05rem solid #fff;
}
html,
body {
  height: 100%;
}

body {
  padding-top: 64px;
  display: -ms-flexbox;
  display: flex;
  color: #141414;
  text-shadow: 0 .05rem .1rem rgba(0, 0, 0, .5);
  animation:1s fondu;
  font-family: "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}


.cover-container {
  max-width: 90ch;
}
.masthead {
  margin-bottom: 2rem;
}

.masthead-brand {
  margin-bottom: 0;
}

.nav-masthead .nav-link {
  padding: .25rem 0;
  font-weight: 700;
  color:orange;
  background-color: transparent;
  border-bottom: .25rem solid transparent;
}

.nav-masthead .nav-link:hover,
.nav-masthead .nav-link:focus {
  border-bottom-color:orange;
}

.nav-masthead .nav-link + .nav-link {
  margin-left: 1rem;
}

.nav-masthead .active {
  color:orange;
  border-bottom-color:orange;
}

@media (min-width: 48em) {
  .masthead-brand {
    float: left;
  }
  .nav-masthead {
    float: right;
  }
}
.cover {
  padding: 0 1.5rem;
}
.cover .btn-lg {
  padding: .75rem 1.25rem;
  font-weight: 700;
}
.mastfoot {
  color: rgba(255, 255, 255, .5);
}

/* Vidéo de fond */
#vidfond {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  z-index: -1;
  background-image: url('../bg/video-fond.jpg');
  background-size: cover;
  opacity: 1;
}
/*#vidfond {
  position: fixed; right: 0; bottom: 0;
  min-width: 100%; min-height: 100%;
  width: auto; height: auto; z-index: -100;
  background-image:url('bg/video-fond.jpg');
  background-size:cover;
  opacity:1;
}*/


#titre-l1 {
  /*color: #3c6382;*/
  color: #0074b8;
  animation: fondu 5s;
  font-size:clamp(1.7rem, 4.2vw, 1.9rem);
}

#titre-l2 {
  color: #0a3d62;
  animation: fondu 5s;
  text-transform:uppercase;
  font-size:clamp(3rem, 8.2vw, 4rem);
}


@keyframes souffle {
  0%, 100% {
    transform: scale(1) rotate(0deg);
  }
  50% {
    transform: scale(1.05) rotate(0.3deg);
  }
}

#titre-l2-souffle {
  display: inline-block;
  color: #0a3d62 !important;
  text-transform: uppercase;
  font-size: clamp(2.4rem, 7.2vw, 3.6rem);
  line-height: 1.1;

  /* animations conservées */
  animation: fondu 5s ease-in-out forwards,
             souffle 14s cubic-bezier(0.42, 0, 0.58, 1) infinite;
  transform-origin: center;
  will-change: transform;
  backface-visibility: hidden;

  /* anti auto-dark Vanadium/Chrome : “vrai” fond ultra léger */
  background-image: linear-gradient(rgba(255,255,255,0.01), rgba(255,255,255,0.01));
  background-color: rgba(255,255,255,0.01);
}

#titre-l3 {
  color: #0074b8;
  animation: fondu 5s;
  font-size:clamp(1.7rem, 4.2vw, 1.9rem);
}

#titre-l4 {
  color: #3c6382;
  animation: fondu 5s;
  font-size:clamp(1.5rem, 2.4vw, 1.75rem);
}

#titre-l5 {
  color: #212121;                        /* blanc pur */
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  /* halo sombre multi-couches pour rester visible sur fond clair */
  text-shadow:
    0 0 2px rgba(0,0,0,.75),
    0 1px 2px rgba(0,0,0,.8),
    0 0 10px rgba(0,0,0,.35);
  /* fin trait noir fin, discret mais efficace (Chrome/Safari/Vanadium) */
  -webkit-text-stroke: .4px rgba(0,0,0,.35);
}

/* Équilibre les retours de ligne des titres modernes */
#titre-l1, #titre-l2, #titre-l2-souffle, #titre-l3, #titre-l4, #titre-l5 { 
  text-wrap: balance;            /* largement supporté, sans risque */
}

/* Pour coller un groupe de mots */
.no-break { 
  white-space: nowrap; 
}


.orange {
  color:orange!important;
}
.orange:hover {
  color:orange!important;
  text-decoration:underline!important;
  cursor:pointer!important;
} 
hr {
  width:10%;
  border:1px #2196F3 solid;
}
.hr-vert {
  width:10%;
  border:1px #28a745 solid;
}
.open-sans {
  font-family:'Open Sans', sans-serif;
}
.a-hover {
  text-decoration:none!important;
}
.a-hover:hover {
  text-decoration:none!important;
}

@keyframes fondu {
  from {
    opacity:0;
  }
  to {
    opacity:1;
  }
}

table {
  border-collapse: collapse;
  width: 100%;
}

th, td {
  border-left: none;
  border-right: none;
  border-top: 1px solid #444;  /* ligne horizontale discrète */
  border-bottom: 1px solid #444;
  padding: 12px 16px;
  background-color: rgba(0, 0, 0, 0.4); /* effet de transparence */
  color: white;
}

.cell-activite {
  background-color: rgba(255, 255, 255, 0.15); /* fond semi-transparent */
  border: 1px solid rgba(255, 255, 255, 0.2);   /* bordure subtile */
  border-radius: 8px;                           /* coins arrondis */
  padding: 10px;                                /* espace intérieur */
  display: inline-block;
}			

		@keyframes photoRespire {
		0%, 100% { transform: scale(1); }
		50% { transform: scale(1.03); }
		}

		@keyframes carteRespire {
		0%, 100% { transform: scale(1); }
		50% { transform: scale(1.015); }
		}

		.photo-respire {
		animation: photoRespire 8s ease-in-out infinite;
		transition: transform 0.4s ease;
		}

		.carte-respire {
		animation: carteRespire 8s ease-in-out infinite;
		animation-delay: 0.3s;
		transition: transform 0.5s ease;
		}		

@keyframes texteRespire {
  0%, 100% {
    transform: scale(1);
    opacity: 1;
    letter-spacing: normal;
  }
  50% {
    transform: scale(1.02);
    opacity: 0.95;
    letter-spacing: 0.03em;
  }
}

.texte-respire {
  display: inline-block;
  animation: texteRespire 8s ease-in-out infinite;
  transition: all 0.3s ease;
}


#titre-l2-respire {
  flex-wrap: nowrap;
  color: #0a3d62;
  animation: fondu 5s ease-in-out forwards, texteRespire 8s ease-in-out infinite;
  text-transform:uppercase;
  font-size:350%;
  display: inline-block;
  transition: all 0.3s ease;  
}


/*#titre-l2-souffle {
  display: inline-block;
  color: #0a3d62;
  font-size: clamp(2rem, 6.2vw, 3.25rem);
  text-transform: uppercase;
  animation: fondu 5s ease-in-out forwards, souffle 14s cubic-bezier(0.42, 0, 0.58, 1) infinite;
  transform-origin: center;
}*/

.text-columns {
  column-count: 1;
  column-gap: 2rem;
  max-width: 90ch;
  margin: auto;
  text-align: justify;
}

@media (min-width: 768px) {
  .text-columns {
    column-count: 2;
  }
}

/* FOOTER SANS BARRE DE FOND, LISIBLE SUR VIDÉO */
/* Footer — taille réduite + ombre adoucie */
footer.mastfoot{
  padding: .5rem .75rem .75rem;
}

footer.mastfoot .footer-brand{
  /* titre du pied de page */
  font-size: clamp(1rem, 1.6vw, 1.25rem);
  font-weight: 700;
  margin-bottom: .2rem;
}

footer.mastfoot .lead{
  /* ligne copyright */
  font-size: clamp(.82rem, 1.2vw, .95rem);
  font-weight: 500;       /* un peu moins gras */
  opacity: .9;
}

/* Ombre beaucoup plus fine (lisible sans effet « halo ») */
footer.mastfoot .footer-brand,
footer.mastfoot .lead{
  text-shadow: 0 1px 2px rgba(0,0,0,.35);
  -webkit-text-stroke: 0; /* retire le liseré noir */
}

/* Adoucit l’ombre du conteneur */
footer.mastfoot .inner{
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.25));
}

/* Footer — contraste renforcé sans changer la taille */
footer.mastfoot .footer-brand,
footer.mastfoot .lead{
  color: #1f2937;                /* anthracite lisible sur fond clair */
  text-shadow: 0 1px 1px rgba(0,0,0,.5);  /* ombre nette, courte */
  opacity: 1;                    /* supprime tout voile éventuel */
}

/* Option : si tu veux encore un peu plus de relief, dé-commente la ligne suivante */
/* footer.mastfoot .footer-brand { letter-spacing: .2px; } */

/* Le footer colle en bas quand le contenu est court */
footer.mastfoot{ margin-top: auto; }

/* Option : s'il y a un header fixe, compense-le ici (sinon laisse) */
/* #page { min-height: calc(100dvh - 64px); } */

:root { --header-h: 64px; }                  /* valeur par défaut (fallback) */

/* Le body se décale pour ne pas passer sous le(s) menu(s) fixe(s) */
body { padding-top: var(--header-h); }

/* Le wrapper principal occupe le viewport - header */
#page{
  display: flex;
  flex-direction: column;
  min-height: calc(100dvh - var(--header-h));
}

/* Menu mobile : pour éviter les blocages du menu */
#menuMobile .modal-content, 
#menuMobile .modal-body, 
#menuMobile a.nav-link { pointer-events: auto; }

/* === Page de capture pour les masterclass === */

/* Layout horizontal propre et responsive */
form.card .field {
  display: flex;
  align-items: center;
  gap: .75rem;
}

form.card .field .form-label {
  width: 130px;           /* largeur colonne labels */
  margin: 0;
  text-align: right;      /* label à droite de sa colonne */
  font-weight: 600;
}

form.card .field .form-control {
  flex: 1;
  background-color: #fff9db;
  border: 1px solid #e0c97f;
  text-align: left;       /* meilleure UX en mode horizontal */
}

form.card .form-control:focus {
  background-color: #fff7c2;
  border-color: #d4af37;
  box-shadow: 0 0 6px rgba(212,175,55,.5);
}

/* Aligner les checkboxes avec la colonne des champs */
form.card .checks {
  padding-left: calc(130px + .75rem);
}

/* Mobile : repasser en vertical */
@media (max-width: 575.98px) {
  form.card .field {
    flex-direction: column;
    align-items: stretch;
  }
  form.card .field .form-label {
    width: auto;
    text-align: left;
  }
  form.card .checks {
    padding-left: 0;
  }
}

/* Taille + contraste des cases à cocher */
form.card .form-check-input {
  width: 1.3em;
  height: 1.3em;
  border: 2px solid #444;        /* contour plus foncé */
  background-color: #fff;        /* fond bien blanc */
  cursor: pointer;
  transition: all 0.2s ease;
}

form.card .form-check-input:checked {
  background-color: #d4af37;     /* doré (ou change la couleur) */
  border-color: #b38e1d;
}

form.card .form-check-input:focus {
  box-shadow: 0 0 5px rgba(212, 175, 55, 0.6);
}



/* === Agenda cartes === */
/*:root{
  --ev-card-bg: rgba(255,255,255,0.96);
  --ev-text: #1d1d1f;
  --ev-muted:#60646c;
  --ev-border: rgba(0,0,0,.06);
  --ev-shadow: 0 10px 30px rgba(0,0,0,.18);
  --ev-accent:#1f6feb;
  --ev-accent-h:#1857bb;
}

.events-grid{
  display:grid;
  grid-template-columns: repeat(auto-fill,minmax(300px,1fr));
  gap:20px;
  margin: 12px 0 28px;
}

.event-card{
  background:var(--ev-card-bg);
  color:var(--ev-text);
  border:1px solid var(--ev-border);
  border-radius:18px;
  box-shadow:var(--ev-shadow);
  overflow:hidden;
  transform:translateZ(0);
  transition:transform .15s ease, box-shadow .15s ease;
}
.event-card:hover{ transform:translateY(-2px); box-shadow:0 16px 44px rgba(0,0,0,.22); }

.event-card .card-link{ color:inherit; text-decoration:none; display:block; }

.event-media{
  position:relative;
  aspect-ratio: 16/9;
  background-image: url('/img/agenda/banner-default.jpg'); /* image douce et lisible */
 /* background-size: cover;
  background-position: center;
  filter: saturate(1.05);
}
.event-date{
  position:absolute; left:14px; top:14px;
  background:rgba(255,255,255,.95);
  border:1px solid var(--ev-border);
  border-radius:12px;
  padding:8px 10px; text-align:center; line-height:1;
}
.event-date .big{ font-weight:800; font-size:20px; display:block; letter-spacing:.3px; }
.event-date .small{ font-size:11px; color:var(--ev-muted); font-weight:700; letter-spacing:.6px; }

.event-body{ padding:14px 14px 12px; display:flex; flex-direction:column; gap:10px; }
.event-title{ margin:0; font-size:20px; line-height:1.25; font-weight:800; }
.event-meta{ display:flex; gap:12px; flex-wrap:wrap; font-size:14px; color:var(--ev-muted); }
.event-meta .duration{ background:#eef2f7; padding:2px 8px; border-radius:999px; color:#394150; }

.guides-row{ display:flex; align-items:center; gap:8px; margin-top:2px; }
.avatar{
  width:38px; height:38px; border-radius:50%;
  background:#ddd; display:inline-flex; align-items:center; justify-content:center;
  border:2px solid #fff; box-shadow:0 2px 8px rgba(0,0,0,.12);
  overflow:hidden; position:relative;
}
.avatar img{ width:100%; height:100%; object-fit:cover; display:block; }
.avatar.more{ font-weight:800; color:#222; background:#eef2f7; }

.event-desc{ font-size:14px; color:#333; opacity:.85; }

.event-footer{
  margin-top:4px; display:flex; align-items:center; justify-content:space-between; gap:12px;
}
.price{ font-weight:900; font-size:20px; color:#111; }
.cta{
  display:inline-block; padding:10px 14px; border-radius:12px;
  background:var(--ev-accent); color:#fff; font-weight:800;
  box-shadow: 0 4px 18px rgba(31,111,235,.35);
}
.event-card:hover .cta{ background:var(--ev-accent-h); }

/* Infobulle douce sur avatar */
/*.tip::after{
  content: attr(data-title);
  position:absolute; left:50%; bottom:calc(100% + 10px);
  transform:translateX(-50%);
  white-space:nowrap;
  background:rgba(20,20,20,.92);
  color:#fff; font-size:12px; font-weight:600;
  padding:6px 8px; border-radius:8px;
  box-shadow:0 8px 20px rgba(0,0,0,.3);
  opacity:0; pointer-events:none; transition:opacity .15s ease, transform .15s ease;
}
.tip:hover::after{ opacity:1; transform:translateX(-50%) translateY(-2px); }

/* Mobile : plus compact */
/*@media (max-width:480px){
  .event-title{ font-size:18px; }
  .event-meta{ font-size:13px; }
  .avatar{ width:34px; height:34px; }
}*/