/* =====================================================
   SCHOLA CANTORUM — CSS PERSONNALISÉ
   Thème enfant Blocksy

   Fichier réorganisé à partir de la version existante.
   Les identifiants de menu et les classes Elementor sont conservés.
   ===================================================== */

/* =====================================================
   SCHOLA CANTORUM — CSS GÉNÉRAL
   ===================================================== */


/* =====================================================
   1. LIENS DE MENU NON CLIQUABLES
   ===================================================== */

.unclickable > a{
  pointer-events:none !important;
}


/* =====================================================
   HERO DE PAGE
   Classe Elementor : sc-hero
   ===================================================== */

.sc-hero{
  padding:86px 32px 78px;
  background:#EDE5D6;
  text-align:center;
}

.sc-hero .elementor-container,
.sc-hero .elementor-widget-container{
  max-width:900px;
  margin:0 auto;
}

.sc-hero .elementor-heading-title{
  margin:0;
  color:#730109;
  font-size:52px;
  font-weight:700;
  line-height:1.1;
}

.sc-hero .elementor-heading-title::after{
  content:"";
  display:block;
  width:58px;
  height:3px;
  margin:22px auto 0;
  background:#B79255;
}

.sc-hero .elementor-widget-text-editor{
  max-width:720px;
  margin:20px auto 0;
  color:#294665;
  font-size:19px;
  line-height:1.65;
}

@media (max-width:767px){
  .sc-hero{
    padding:62px 24px 56px;
  }

  .sc-hero .elementor-heading-title{
    font-size:38px;
  }

  .sc-hero .elementor-widget-text-editor{
    font-size:17px;
  }
}

/* =====================================================
   2. BOUTON INSCRIPTION — EN-TÊTE
   Classe Elementor : btn-inscription
   ===================================================== */

.btn-inscription{
  display:inline-block;
  height:55px;
  line-height:55px;
  padding:0 24px;

  background-color:#DDD6CC;
  color:#000;

  border:2px solid #DDD6CC;
  border-radius:5px;

  font-weight:bold;
  cursor:pointer;

  box-shadow:0 2px 4px rgba(0,0,0,.2);
  transition:all .3s ease;
}

.btn-inscription:hover{
  background-color:transparent;
  color:#730109;

  border-color:#730109;
  box-shadow:0 4px 8px rgba(0,0,0,.3);
}


/* =====================================================
   3. BOUTONS MENU — INSCRIPTION
   ===================================================== */

/* Inscription français */
#menu-item-38469 a{
  height:45px;
  background-color:#DDD6CC;
  color:#000;

  border:2px solid #DDD6CC;
  border-radius:5px;
}

#menu-item-38469 a:hover{
  background-color:#730109;
  color:#fff;

  border-color:#DDD6CC;
}

/* Inscription anglais */
#menu-item-38491 a{
  height:55px;
  background-color:#DDD6CC;
  color:#000;

  border:2px solid #DDD6CC;
  border-radius:5px;
}

#menu-item-38491 a:hover{
  background-color:#730109;
  color:#fff;

  border-color:#DDD6CC;
}


/* =====================================================
   4. BOUTONS MENU — NEWSLETTER
   ===================================================== */

/* Newsletter français */
#menu-item-34343 a{
  height:55px;
  background-color:#DDD6CC;
  color:#000 !important;

  border:2px solid #DDD6CC;
  border-radius:5px;
}

#menu-item-34343 a:hover{
  background-color:#730109;
  color:#fff !important;

  border-color:#DDD6CC;
}

/* Newsletter anglais */
#menu-item-38506 a{
  height:55px;
  background-color:#DDD6CC;
  color:#000 !important;

  border:2px solid #DDD6CC;
  border-radius:5px;
}

#menu-item-38506 a:hover{
  background-color:#730109;
  color:#fff !important;

  border-color:#DDD6CC;
}

/* Newsletter français — menu mobile */
#menu-item-38522 a{
  min-height:55px;
  background-color:#DDD6CC;
  color:#000 !important;

  border:2px solid #DDD6CC;
  border-radius:5px;
}

/* Newsletter anglais — menu mobile */
#menu-item-38540 a{
  min-height:55px;
  background-color:#DDD6CC;
  color:#000 !important;

  border:2px solid #DDD6CC;
  border-radius:5px;
}


/* =====================================================
   5. BOUTON « LIRE LA SUITE »
   Attention : idéalement, remplacer plus tard l’ID
   #lire-la-suite par une classe .lire-la-suite
   ===================================================== */

#lire-la-suite{
  display:inline-block;
  padding:8px 16px;

  background-color:#730109;
  color:#fff;

  border:2px solid #730109;
  border-radius:5px;

  font-weight:bold;
  text-decoration:none;
  cursor:pointer;

  box-shadow:0 2px 4px rgba(0,0,0,.2);
  transition:all .3s ease;
}

#lire-la-suite:hover{
  background-color:#8C1B25;
  color:#fff;

  border-color:#730109;
  box-shadow:0 4px 8px rgba(0,0,0,.3);
}


/* =====================================================
   6. SOCLE VISUEL COMMUN — CARTES
   Accueil : conteneur-discipline
   Inscription : sc-step-card

   Même fond, bordure, arrondi, ombre et survol.
   ===================================================== */

.conteneur-discipline,
.sc-step-card{
  background:#FFFFFF !important;
  border:1px solid #DDD6CC !important;
  border-radius:6px !important;

  box-shadow:0 2px 8px rgba(0,0,0,.04) !important;

  transition:transform .2s ease,
             box-shadow .2s ease !important;
}

.conteneur-discipline:hover,
.sc-step-card:hover{
  transform:translateY(-3px) !important;
  box-shadow:0 6px 14px rgba(0,0,0,.06) !important;
}


/* =====================================================
   7. PAGE D'ACCUEIL — CARTES DISCIPLINES
   Classe Elementor sur chaque carte :
   conteneur-discipline
   ===================================================== */

.conteneur-discipline{
  display:flex;
  flex-direction:column;
  align-items:center;

  min-height:480px;
  padding:38px 30px 30px;

  text-align:center;
  box-sizing:border-box;
}

/* Icône de la carte */
.conteneur-discipline .elementor-widget-icon{
  margin-bottom:18px;
}

/* Titre de la carte */
.conteneur-discipline .elementor-heading-title{
  margin:0 0 18px;

  color:#730109;
  font-size:28px;
  line-height:1.15;
}

/* Texte de la carte */
.conteneur-discipline .elementor-widget-text-editor{
  color:#294665;
  font-size:16px;
  line-height:1.55;
}

/* Zone bouton : pousse le bouton vers le bas */
.conteneur-discipline .elementor-widget-button{
  width:100%;
  margin-top:auto;
  padding-top:22px;
}

/* Bouton de la carte */
.bouton-disciplines{
  display:inline-block;
  width:100%;
  padding:14px 18px;

  background:#730109;
  color:#fff;

  border:1px solid #730109;
  border-radius:5px;

  font-size:16px;
  font-weight:700;
  line-height:1.35;
  text-align:center;
  text-decoration:none;
  box-sizing:border-box;

  transition:background .2s ease,
             transform .2s ease,
             box-shadow .2s ease;
}

.bouton-disciplines:hover{
  background:#8C1B25;
  color:#fff;

  transform:translateY(-2px);
  box-shadow:0 4px 9px rgba(0,0,0,.16);
}

.bouton-disciplines:focus{
  outline:2px solid #B79255;
  outline-offset:3px;
}


/* =====================================================
   ACTUALITÉS — PAGE D'ACCUEIL
   Classe CSS du conteneur principal : actualites
===================================================== */

/* Fond de la section */
.actualites{
  background:#F1ECE4;
  padding:48px 32px;
}

/* Structure qui faisait fonctionner l'alignement des boutons */
.actualites > .elementor-container > .elementor-container{
  display:flex;
  flex-direction:column;
  height:100%;
}

/* Le bouton est poussé en bas de chaque carte */
.actualites .elementor-widget-button{
  margin-top:auto;
}

/* Images plus courtes */
.actualites .elementor-widget-image img{
  width:100%;
  height:145px;
  object-fit:cover;
  display:block;
}

/* Titres */
.actualites .elementor-heading-title{
  color:#730109;
  font-size:20px;
  line-height:1.2;
}

/* Texte d’aperçu */
.actualites .elementor-widget-text-editor{
  color:#444;
  font-size:14px;
  line-height:1.5;
}

/* Le bouton devient un lien éditorial */
.actualites .elementor-button{
  display:inline-block;
  width:auto;

  padding:8px 14px;

  background:transparent;
  border:1px solid #730109;
  border-radius:4px;
  box-shadow:none;

  color:#730109;
  font-size:14px;
  font-weight:700;
  line-height:1.2;
  text-decoration:none;
}

.actualites .elementor-button:hover{
  background:#730109;
  border-color:#730109;
  color:#FFFFFF;
  box-shadow:none;
  transform:none;
}

.actualites .elementor-button::after{
  content:" →";
  font-size:17px;
}

/* =====================================================
   PAGE « UN PEU D’HISTOIRE »
   CSS général
===================================================== */

/* =====================================================
   1. SECTIONS DE CONTENU PRINCIPALES
   Classe : sc-history-section
===================================================== */

.sc-history-section{
  max-width:1200px;
  margin:0 auto;
  padding:72px 32px;
  box-sizing:border-box;
}

.sc-history-section p,
.sc-history-text-section p{
  color:#294665;
  font-size:16px;
  line-height:1.75;
  margin:0 0 16px;
}


/* =====================================================
   2. GRANDES SECTIONS DE TEXTE
   Classe : sc-history-text-section
===================================================== */

.sc-history-text-section{
  max-width:900px;
  margin:0 auto;
  padding:58px 32px;
  box-sizing:border-box;
}

/* Espace sous les titres utilisant la classe sc-section-title */
.sc-history-section .sc-section-title,
.sc-history-text-section .sc-section-title{
  margin-bottom:32px;
}


/* =====================================================
   3. SECTION LÉGÈREMENT TEINTÉE
   Ajouter aussi : sc-history-tinted
===================================================== */

.sc-history-tinted{
  background:#F1ECE4;
  border-top:1px solid #DDD6CC;
  border-bottom:1px solid #DDD6CC;
}


/* =====================================================
   LES FONDATEURS
   Conteneur deux colonnes : sc-history-founders
   Colonne image : sc-history-founders-image
===================================================== */

.sc-history-founders{
  display:flex;
  max-width:1200px;
  margin:0 auto;
  padding:0 32px;
  align-items:center;
  gap:56px;
  box-sizing:border-box;
}

.sc-history-founders-image{
  flex:0 0 320px;
  text-align:center;
}

.sc-history-founders-image img{
  width:100%;
  max-width:320px;
  height:auto;
  display:block;
  border:1px solid #DDD6CC;
  box-shadow:0 10px 24px rgba(0,0,0,.12);
}

/* Légende sous l’image */
.sc-history-founders-image .elementor-widget-text-editor{
  margin-top:14px;
  color:#294665;
  font-size:14px;
  font-style:italic;
  line-height:1.5;
  text-align:center;
}

.sc-history-founders > :not(.sc-history-founders-image){
  flex:1;
  min-width:0;
}

@media (max-width:767px){
  .sc-history-founders{
    display:block;
    padding:0 24px;
  }

  .sc-history-founders-image{
    max-width:280px;
    margin:0 auto 30px;
  }

  .sc-history-founders-image img{
    max-width:280px;
  }
}


/* =====================================================
   5. BLOC « LE LIVRE DES 400 ANS »
   
   Structure Elementor :
   sc-history-book-section  = conteneur beige extérieur
   sc-history-book-card     = carte blanche intérieure
   sc-history-book-grid     = grille texte + image
   sc-history-book          = conteneur de l'image
   sc-history-book-button-row = ligne du bouton
===================================================== */

/* Cadre beige extérieur */
.sc-history-book-section{
  max-width:1000px;
  margin:28px auto 72px;
  padding:34px;
  background:#F1ECE4;
  box-sizing:border-box;
}

/* Carte blanche : contient la grille ET le bouton */
.sc-history-book-card{
  background:#FFFFFF;
  border:1px solid #DDD6CC;
  border-radius:6px;
  padding:38px 46px 30px;
  box-shadow:0 4px 14px rgba(0,0,0,.05);
  box-sizing:border-box;
}

/* Grille texte + image */
.sc-history-book-grid{
  width:90%;
  margin:0 auto;
}

/* Titre */
.sc-history-book-card .elementor-heading-title{
  color:#730109;
  font-size:28px;
  line-height:1.25;
  margin-bottom:18px;
}

/* Texte */
.sc-history-book-card .elementor-widget-text-editor{
  color:#294665;
  font-size:16px;
  line-height:1.7;
}

/* Image : effet couverture de livre */
.sc-history-book{
  text-align:center;
  perspective:900px;
}

.sc-history-book img{
  width:100%;
  max-width:285px;
  height:auto;
  display:inline-block;
  border:1px solid rgba(0,0,0,.12);
  transform:rotateY(-10deg) rotateZ(1deg);
  transform-origin:left center;
  box-shadow:
    -10px 7px 0 rgba(80,55,35,.20),
    -18px 15px 26px rgba(0,0,0,.20);
  transition:transform .25s ease, box-shadow .25s ease;
}

.sc-history-book img:hover{
  transform:rotateY(-4deg) rotateZ(0);
  box-shadow:
    -8px 6px 0 rgba(80,55,35,.18),
    -16px 14px 28px rgba(0,0,0,.24);
}

/* Ligne du bouton : deuxième grille sous texte + image */
.sc-history-book-button-row{
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
  margin-top:14px;
  text-align:center;
  box-sizing:border-box;
}

/* Bouton */
.sc-history-book-card .elementor-button{
  background:#B79255;
  border:1px solid #B79255;
  border-radius:5px;
  color:#FFFFFF;
  font-weight:700;
  padding:13px 20px;
  box-shadow:none;
  transition:background .2s ease,
             border-color .2s ease,
             transform .2s ease,
             box-shadow .2s ease;
}

.sc-history-book-card .elementor-button:hover{
  background:#730109;
  border-color:#730109;
  color:#FFFFFF;
  transform:translateY(-2px);
  box-shadow:0 5px 12px rgba(0,0,0,.14);
}

@media (max-width:767px){

  .sc-history-book-section{
    margin:20px 24px 52px;
    padding:18px;
  }

  .sc-history-book-card{
    padding:30px 24px 26px;
  }

  .sc-history-book-grid{
    width:100%;
  }

  .sc-history-book-card .elementor-heading-title{
    font-size:25px;
  }

  .sc-history-book{
    margin-top:28px;
  }

  .sc-history-book img{
    max-width:240px;
  }

  .sc-history-book-button-row{
    margin-top:22px;
  }
}

/* =====================================================
   6. APPEL À L’ACTION FINAL
   Classe : sc-history-cta
===================================================== */

.sc-history-cta{
  max-width:900px;
  margin:26px auto 78px;
  padding:52px 32px;
  background:#193452;
  text-align:center;
  box-sizing:border-box;
}

.sc-history-cta .elementor-heading-title,
.sc-history-cta .elementor-widget-text-editor{
  color:#FFFFFF;
}

.sc-history-cta .elementor-heading-title{
  font-size:30px;
  line-height:1.25;
  margin-bottom:14px;
}

.sc-history-cta .elementor-widget-text-editor{
  font-size:16px;
  line-height:1.6;
  margin-bottom:24px;
}

.sc-history-cta .elementor-button{
  background:#B79255;
  border:1px solid #B79255;
  border-radius:5px;
  color:#193452;
  font-weight:700;
  padding:12px 20px;
  transition:background .2s ease,
             border-color .2s ease,
             color .2s ease,
             transform .2s ease;
}

.sc-history-cta .elementor-button:hover{
  background:#FFFFFF;
  border-color:#FFFFFF;
  color:#730109;
  transform:translateY(-2px);
}


/* =====================================================
   7. VERSION MOBILE
===================================================== */

@media (max-width:767px){

  .sc-history-hero{
    padding:62px 24px 56px;
  }

  .sc-history-hero h1{
    font-size:38px;
  }

  .sc-history-hero p{
    font-size:17px;
  }

  .sc-history-section{
    padding:52px 24px;
  }

  .sc-history-text-section{
    padding:48px 24px;
  }

  .sc-history-cta{
    margin:20px 24px 52px;
    padding:42px 24px;
  }

  .sc-history-cta .elementor-heading-title{
    font-size:26px;
  }
}

/* ==================================06.PAGE HORAIRES DES COURS
==================================
*/

/* =====================================================
   PAGE HORAIRES — EN-TÊTE
   Classe du conteneur : sc-hours-hero
   ===================================================== */



/* =====================================================
   3. GRANDES SECTIONS DE TEXTE
   Classe : sc-hours-text-section
===================================================== */

.sc-hours-text-section{
  max-width:900px;
  margin:0 auto;
  padding:58px 32px;
  box-sizing:border-box;
}

/* Espace sous les titres utilisant la classe sc-section-title */
.sc-hours-section .sc-section-title,
.sc-hours-text-section .sc-section-title{
  margin-bottom:32px;
}


/* =====================================================
   4. SECTION LÉGÈREMENT TEINTÉE
   Ajouter aussi : sc-hours-tinted
===================================================== */

.sc-hours-tinted{
  background:#F1ECE4;
  border-top:1px solid #DDD6CC;
  border-bottom:1px solid #DDD6CC;
}

/* ==================================
07. PAGE INSCRIPTION — FORMULAIRE FORMINATOR   ================================== */

#forminator-module-28956{
  padding:40px;

  background:#FCFBF8;
  border:1px solid #DDD6CC;
  border-radius:16px;

  box-shadow:0 12px 35px rgba(0,0,0,.05);
}

/* Bandeau de titre dans un champ HTML Forminator */
.titre-section{
  display:block;
  margin:35px 0 20px;
  padding:12px 20px;

  background:linear-gradient(90deg, #730109 0%, #A12C4B 100%);
  color:#fff;

  border-left:6px solid #D4AF37;
  border-radius:4px;

  font-weight:600;
  letter-spacing:.5px;

  box-shadow:0 2px 6px rgba(0,0,0,.12);
}


/* =====================================================
   11. TITRES DES GRANDES SECTIONS
   Classe Elementor sur le widget Titre :
   sc-section-title
   ===================================================== */

.sc-section-title{
  margin:0 0 18px;

  color:#730109;
  font-size:42px;
  font-weight:700;
  line-height:1.15;
  text-align:center;
}

.sc-section-title::after{
  content:"";
  display:block;

  width:58px;
  height:3px;
  margin:18px auto 0;

  background:#B79255;
}


/* =====================================================
   12. RESPONSIVE — TABLETTE
   ===================================================== */

@media (max-width:1024px){

  /* Cartes disciplines accueil */
  .conteneur-discipline{
    min-height:440px;
    padding:34px 26px 28px;
  }

  .conteneur-discipline .elementor-heading-title{
    font-size:25px;
  }

  /* Cartes étapes inscription */
  .sc-step-card{
    width:calc(50% - 12px);
  }

  .sc-step-card:nth-child(2n){
    margin-right:0;
  }

  /* Titres de section */
  .sc-section-title{
    font-size:36px;
  }
}


/* =====================================================
   13. RESPONSIVE — MOBILE
   ===================================================== */

@media (max-width:767px){

  /* Cartes disciplines accueil */
  .conteneur-discipline{
    min-height:auto;
    padding:32px 24px;
  }

  .conteneur-discipline .elementor-heading-title{
    font-size:23px;
  }

  /* Titres de section */
  .sc-section-title{
    font-size:30px;
    line-height:1.2;
  }

  .sc-section-title::after{
    width:46px;
    margin-top:14px;
  }
}

@media (max-width:600px){

  /* Cartes étapes inscription */
  .sc-step-card{
    width:100%;
    margin-right:0;
    margin-bottom:16px;
  }
}

/* =====================================================
   PAGE NOS PROFESSEURS — BOÎTES D'IMAGES
   Classe Elementor à ajouter sur chaque widget :
   sc-professeur-card
   ===================================================== */

.sc-professeur-card{
  overflow:hidden;

  background:#FFFFFF !important;
  border:1px solid #DDD6CC !important;
  border-radius:6px !important;

  box-shadow:0 2px 8px rgba(0,0,0,.04) !important;

  transition:transform .2s ease,
             box-shadow .2s ease !important;
}

/* Même survol que les autres cartes du site */
.sc-professeur-card:hover{
  transform:translateY(-3px);
  box-shadow:0 6px 14px rgba(0,0,0,.06) !important;
}

/* Photo */
.sc-professeur-card .elementor-image-box-img img{
  display:block;
  width:100%;
  aspect-ratio:1 / 1;
  object-fit:cover;
  object-position:center;

  transition:transform .35s ease;
}

/* Zoom très discret de la photo */
.sc-professeur-card:hover .elementor-image-box-img img{
  transform:scale(1.03);
}

/* Nom du professeur */
.sc-professeur-card .elementor-image-box-title{
  margin:20px 18px 8px;

  color:#730109;
  font-size:18px;
  font-weight:600;
  line-height:1.25;
  text-align:center;
}

/* Discipline / description */
.sc-professeur-card .elementor-image-box-description{
  margin:0 18px 22px;

  color:#444;
  font-size:14px;
  line-height:1.5;
  text-align:center;
}

/* Mobile */
@media (max-width:767px){
  .sc-professeur-card .elementor-image-box-title{
    font-size:17px;
  }
}