@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@100;700&display=swap');

body { background: #0B0D1C }
body.home #start { background: rgba(0,0,0,.7); min-height: 100vh; }
#header { background: black; }
a { color: white; }

#myVideo {
    position: absolute;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
    z-index: -1;
    object-fit: cover;
}

/*
body.header-fixed.header-animated.home #header {
visibility: hidden;
}

body.header-fixed.header-animated.home #header.scrolled {
visibility: visible;
}

body.home #header, body.home #header .logo img, body.home #header .logo svg, body.home #header .navbar-section, body.home .default-animation, body.home .modular-features .feature-icon, body.home .modular-features.small .feature-icon i { transition: none; }

#header .logo svg, body.header-fixed.header-animated #header.scrolled .logo img, body.header-fixed.header-animated #header.scrolled .logo svg { height: 44px; }
*/

h2 { margin: 8rem 0 3rem 0; }

h2, h1 svg {
  stroke: white; /* Couleur de base du néon (ex: vert) */
  stroke-width: 5; /* Épaisseur du tube néon */
  fill: none; /* Important : pas de remplissage pour un effet néon pur */

  /* L'effet de lueur néon est créé par plusieurs drop-shadows */
  filter:
    /* Lueur intérieure, très proche du trait */
    drop-shadow(0 0 2px #fff)
    /* Lueur médiane, la couleur principale */
    drop-shadow(0 0 5px #F1C7B2)
    /* Lueur extérieure, plus diffuse */
    drop-shadow(0 0 10px #F1C7B2)
    /* Halo extérieur très large pour l'ambiance */
    drop-shadow(0 0 20px #F1C7B2);
}

.tickets a {
    display: block; 
    margin: 3rem 5rem 1rem 5rem; 
    border: 1px solid white;
    padding: .5rem; 
    border-radius: 10rem; 
    text-align: center;
    color: white;
  filter:
    /* Lueur intérieure, très proche du trait */
    drop-shadow(0 0 2px #fff)
    /* Lueur médiane, la couleur principale */
    drop-shadow(0 0 5px red)
    /* Lueur extérieure, plus diffuse */
    drop-shadow(0 0 10px red)
    /* Halo extérieur très large pour l'ambiance */
    drop-shadow(0 0 20px red);
}

.tickets p {
    margin: 0rem 2rem; 
}

#header .logo svg path {
    fill: rgba(255,255,255,.1);
    fill: white;
}

.film-poster { aspect-ratio: 16 / 9; background-repeat: no-repeat; background-position: 50% 100%; background-size: contain;  margin-bottom: .5rem; border-radius: .3rem; overflow: hidden; }
@media (min-width:600px) { .col-5 { width: 20%; } }
@media (max-width:600px) { 
    body.home .header-fixed #body-wrapper { padding-top: 1rem; } 
    h1 { font-size: 2.1rem; }
}

.jury-avatar { max-width: 6rem; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: 50% 100%; background-size: contain; border-radius: 100%; margin: 0 auto .5rem auto; }

body, h1, h2, h3, h4, h5, h6 { color: white; }
h1, h2, .film-card b, .jury-card b, #start h4, #start h3, .tickets a { text-transform: uppercase; 
  font-family: "Barlow Condensed", sans-serif;
  font-weight: 700;
  font-style: normal;
}
body.home h3 { margin-top: -1rem; }
.fully-clickable h3 { margin-top: 0.5rem; text-align: center}

#start h4, .tickets a { font-weight: 100;  }
#start h1 { margin-top: 0; }
.film-card, .jury-card { margin-bottom: 3rem; color: #454d5d }

.film-card b, .jury-card b  { color: white; font-size: 1rem; }

.edition-poster { aspect-ratio: 21 / 29.3; background-repeat: no-repeat; background-position: 50% 100%; background-size: contain; }
.fully-clickable {
  position: relative;
}

/* https://stackoverflow.com/questions/70068954/make-entire-card-clickable-by-targeting-a-inside-of-it */
.fully-clickable a::before {
  content: "";
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
}
