/* =========================================================
   Design « La Maison » (Claude Design, direction 1a) — fichier unique de styles.
   Seule l'APPARENCE change : textes, liens, formulaires et fonctionnement restent
   ceux du site. Ce fichier s'applique aux pages dont le <body> porte la classe
   « maison ». Mesures reprises de design_reference/claude_design_3_directions.html.
   ========================================================= */
.maison{
  --m-nuit:#0D1A3A; --m-bleu:#1E3A8A; --m-or:#B8934A; --m-papier:#FBFBFA; --m-beige:#F3EFE6;
  --m-encre:#14161C; --m-gris:#5B6472; --m-filet:#E6E8EE; --m-filet-beige:#CFC6B4;
  --m-gout:56px; --m-section:80px; --m-rayon:4px;
  background:var(--m-papier);
}
.maison .wrap{max-width:1280px;padding:0 var(--m-gout)}

/* ---------- Boutons et liens discrets ---------- */
.maison .btn{border-radius:var(--m-rayon);font:600 15px var(--sans);padding:15px 26px;gap:18px;background:var(--m-bleu);border-color:var(--m-bleu);justify-content:center}
.maison .btn:hover{background:var(--m-nuit);border-color:var(--m-nuit)}
.maison .tlink{font:600 15px var(--sans);color:var(--m-bleu)}
.maison .tlink:hover{color:var(--m-nuit);border-color:var(--m-or)}

/* ---------- En-tête bleu nuit, logo blanc ---------- */
.maison .site-header{background:var(--m-nuit);border-bottom:0;backdrop-filter:none}
.maison .site-header .bar{height:84px}
.maison .site-header .logo__img--clair{display:none}
.maison .site-header .logo__img--fonce{display:block;height:44px}
.maison .mnav ul{gap:36px}
.maison .mnav a{font:500 15px var(--sans);color:rgba(255,255,255,.88);border-bottom-color:transparent}
.maison .mnav a:hover{color:#fff;border-color:var(--m-or)}
.maison .mnav a.is-active{color:#fff;border-color:var(--m-or)}
.maison .cta-top{font:600 14px var(--sans);color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:var(--m-rayon);padding:11px 20px}
.maison .cta-top:hover{background:#fff;color:var(--m-nuit);border-color:#fff}
.maison .menu-btn{border-color:rgba(255,255,255,.5);color:#fff;border-radius:var(--m-rayon)}

/* ---------- Bandeau d'ouverture : bleu nuit, photo voilée, filet or ---------- */
.maison .page-head{background:var(--m-nuit);border-bottom:0;color:#fff}
.maison .page-head.with-ph{min-height:620px;display:flex;align-items:flex-end;padding:0 0 72px}
.maison .page-head .ph{background:#1B2A4F}
.maison .page-head .ph::after{background:rgba(13,26,58,.6)}
.maison .page-head .crumb{display:none}
.maison .page-head .eyebrow{font:600 14px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.85)}
.maison .page-head .eyebrow::before{content:"";display:block;width:56px;height:3px;background:var(--m-or);margin-bottom:22px}
.maison .page-head h1{font:700 88px/.98 var(--title);letter-spacing:-.03em;color:#fff;max-width:900px;margin-top:22px}
.maison .page-head h1 em{color:#fff}
.maison .page-head .lead{font:400 19px/1.55 var(--sans);color:rgba(255,255,255,.9);max-width:620px;margin-top:22px}

/* ---------- Titres de section ---------- */
.maison .block,.maison .closing{padding:var(--m-section) 0;border-bottom:0}
.maison .sec-head{grid-template-columns:320px 1fr;gap:56px;margin-bottom:44px;align-items:end}
.maison .sec-head .eyebrow{font:600 13px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--m-or)}
.maison .sec-head h2,.maison .closing h2,.maison .stance h2{font:700 44px/1.05 var(--title);letter-spacing:-.02em;color:var(--m-nuit)}
.maison .sec-head p:not(.eyebrow){font:400 16px/1.6 var(--sans);color:var(--m-gris);max-width:520px}

/* ---------- Contenu en colonnes séparées par des filets fins (sans cartes) ---------- */
.maison .list{border-top:0;display:grid;grid-template-columns:repeat(2,1fr);gap:40px 56px}
.maison .list .row{display:flex;flex-direction:column;gap:14px;border-top:1px solid var(--m-nuit);border-bottom:0;padding:22px 0 0}
.maison .list .row .n{font:600 13px var(--sans);letter-spacing:.12em;color:var(--m-or);padding:0}
.maison .list .row h3{font:700 26px/1.2 var(--title);letter-spacing:-.01em;color:var(--m-bleu)}
.maison .list .row p{font:400 16px/1.6 var(--sans);color:var(--m-gris)}

/* ---------- Bande bleu nuit « Ce que nous ne faisons pas » ---------- */
.maison .stance{background:var(--m-nuit);padding:var(--m-section) 0}
.maison .stance h2{color:#fff}
.maison .stance .eyebrow{font:600 13px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--m-or)}
.maison .stance .eyebrow::before{content:"";display:block;width:40px;height:2px;background:var(--m-or);margin-bottom:16px}
.maison .stance ul{border-top:1px solid rgba(255,255,255,.18)}
.maison .stance li{border-bottom:1px solid rgba(255,255,255,.18);padding:22px 0}
.maison .stance li b{font:600 13px var(--sans);letter-spacing:.12em;color:var(--m-or)}
.maison .stance li span{font:400 18px/1.55 var(--sans);color:rgba(255,255,255,.9)}

/* ---------- Bande beige ---------- */
.maison .closing{background:var(--m-beige)}
.maison .closing .eyebrow{font:600 13px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--m-or)}
.maison .closing h2{max-width:860px;margin-top:14px}
.maison .closing .actions{margin-top:36px;gap:24px}

/* ---------- Bande « L'analyse du matin » : bleu nuit, bouton blanc ---------- */
.maison .analyse-bande{background:var(--m-nuit);padding:72px 0}
.maison .analyse-bande .wrap.narrow{max-width:1280px;display:grid;grid-template-columns:1fr auto;gap:16px 64px;align-items:center}
.maison .analyse-bande .wrap > *{grid-column:1}
.maison .analyse-bande .eyebrow{font:600 13px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--m-or)}
.maison .analyse-bande .eyebrow::before{content:"";display:block;width:40px;height:2px;background:var(--m-or);margin-bottom:16px}
.maison .analyse-bande h2{font:700 40px/1.05 var(--title);letter-spacing:-.02em;color:#fff;margin:0}
.maison .analyse-bande .lead{font:400 17px/1.6 var(--sans);color:rgba(255,255,255,.82);margin:0!important;max-width:620px}
.maison .analyse-bande .btn{grid-column:2;grid-row:1 / span 3;background:#fff;color:var(--m-nuit);border-color:#fff}
.maison .analyse-bande .btn:hover{background:transparent;color:#fff}

/* ---------- Pied de page bleu nuit ---------- */
.maison .site-footer{background:var(--m-nuit);padding:56px 0 32px;border-top:1px solid rgba(255,255,255,.08)}
.maison .site-footer .fgrid{grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}
.maison .site-footer .logo__img--fonce{height:48px}
.maison .site-footer h4{font:600 13px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:#fff;margin-bottom:16px}
.maison .site-footer ul a,.maison .site-footer .about{font:400 14px/1.6 var(--sans);color:rgba(255,255,255,.82)}
.maison .site-footer ul a:hover{color:#fff}
.maison .site-footer li{margin-bottom:10px}
.maison .site-footer .social{gap:10px}
.maison .site-footer .social a{width:36px;height:36px;border:1px solid rgba(255,255,255,.3);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:#fff}
.maison .site-footer .social a:hover{border-color:var(--m-or)}
.maison .site-footer .social svg{width:15px;height:15px}
.maison .site-footer .risk{margin-top:40px;padding-top:22px;border-top:1px solid rgba(255,255,255,.15);font:400 13px/1.5 var(--sans);color:rgba(255,255,255,.62)}

/* ---------- Téléphone (moins de 768 px) : mesures des maquettes téléphone ---------- */
@media (max-width:980px){
  .maison{--m-gout:22px}
  .maison .site-header .bar{height:60px}
  .maison .site-header .logo__img--fonce{height:34px}
  .maison .menu-panel{inset:60px 0 0 0}
  .maison .sec-head{grid-template-columns:1fr;gap:12px}
}
@media (max-width:767px){
  .maison{--m-section:36px}
  .maison .page-head.with-ph{min-height:500px;padding-bottom:32px}
  .maison .page-head .eyebrow{font-size:11px}
  .maison .page-head .eyebrow::before{width:40px;margin-bottom:14px}
  .maison .page-head h1{font-size:44px;line-height:1;margin-top:14px}
  .maison .page-head .lead{font-size:15px;line-height:1.5;margin-top:14px}
  .maison .sec-head{margin-bottom:24px}
  .maison .sec-head h2,.maison .closing h2,.maison .stance h2{font-size:28px;line-height:1.1}
  .maison .list{grid-template-columns:1fr;gap:24px}
  .maison .list .row{padding-top:16px;gap:8px}
  .maison .list .row .n{font-size:12px}
  .maison .list .row h3{font-size:21px}
  .maison .list .row p{font-size:15px;line-height:1.55}
  .maison .stance li span{font-size:16px}
  .maison .closing .actions .btn{width:100%}
  .maison .analyse-bande{padding:32px 0}
  .maison .analyse-bande .wrap.narrow{grid-template-columns:1fr;gap:14px}
  .maison .analyse-bande h2{font-size:26px}
  .maison .analyse-bande .lead{font-size:15px}
  .maison .analyse-bande .btn{grid-column:1;grid-row:auto;width:100%}
  .maison .site-footer{padding:28px 0 96px}
  .maison .site-footer .fgrid{grid-template-columns:1fr 1fr;gap:24px}
}

/* Bouton du menu téléphone : icône à trois traits, comme la maquette (le mot reste lu par les lecteurs d'écran) */
@media (max-width:980px){
  .maison .menu-btn{width:44px;height:40px;padding:0;border:0;font-size:0;color:transparent;
    background:linear-gradient(#fff,#fff) center 12px/24px 2px no-repeat,linear-gradient(#fff,#fff) center 19px/24px 2px no-repeat,linear-gradient(#fff,#fff) center 26px/24px 2px no-repeat}
  .maison .site-header.is-open .menu-btn{background:linear-gradient(45deg,transparent 46%,#fff 46%,#fff 54%,transparent 54%) center/22px 22px no-repeat,linear-gradient(-45deg,transparent 46%,#fff 46%,#fff 54%,transparent 54%) center/22px 22px no-repeat}
}

/* =========================================================
   Pages intérieures
   ========================================================= */
/* Grand titre : plus grand qu'avant, mais plus modéré que la maquette (choix d'Obed) */
.maison .page-head h1{font-size:48px;line-height:1.05}
.maison .page-head h1 [data-fmt]{font-size:inherit!important}
/* Bandeau photo : grand sur la page d'accueil (L'école), bas sur les autres pages */
.maison:not([data-page="m-ecole"]) .page-head.with-ph{min-height:40vh;padding-bottom:56px}
.maison .page-head:not(.with-ph){padding:72px 0 64px}

/* Les deux parcours : deux cartes côte à côte (emprunt à la direction « La Nuit ») */
.maison .offers{border-top:0;gap:24px}
.maison .offer,.maison .offer+.offer{padding:40px 36px 36px;border-radius:var(--m-rayon)}
.maison .offer:first-child{background:var(--m-nuit);color:#fff;border:0}
.maison .offer:last-child{background:#fff;border:1px solid var(--m-filet)}
.maison .offer .eyebrow{font:600 12px var(--sans);letter-spacing:.12em;color:var(--m-or)}
.maison .offer h2{font:700 32px/1.1 var(--title);letter-spacing:-.02em;color:var(--m-bleu)}
.maison .offer:first-child h2{color:#fff}
.maison .offer:first-child .offer__line,.maison .offer:first-child .offer__facts dd{color:rgba(255,255,255,.88)}
.maison .offer:first-child .offer__facts dt{color:rgba(255,255,255,.6)}
.maison .offer:first-child .offer__facts,.maison .offer:first-child .offer__facts>div{border-color:rgba(255,255,255,.18)}
.maison .offer:first-child .btn{background:#fff;color:var(--m-nuit);border-color:#fff}
.maison .offer:first-child .btn:hover{background:transparent;color:#fff}

/* Formulaires (candidature, inscription, contact, newsletter) */
.maison .field input,.maison .field select,.maison .field textarea,.maison .pay-card input{border-radius:var(--m-rayon);border-color:#C9CDD6}
.maison .fgroup h3,.maison .achat h3{color:var(--m-nuit)}
.maison .achat{border-radius:var(--m-rayon);border:1px solid var(--m-filet);border-top:3px solid var(--m-or)}
.maison .achat-formule{border-radius:var(--m-rayon)}
.maison .acces-card,.maison #analyseLecture{border-radius:var(--m-rayon);border-top-color:var(--m-or)}

/* En-tête simplifié (newsletter, inscription, candidature) */
.maison .site-header--simple .entete-lien{color:rgba(255,255,255,.88)}
.maison .site-header--simple .entete-lien:hover{color:#fff}
.maison .site-footer--simple .risk{margin-top:0;padding-top:0;border-top:0}
.maison .analyse-page{background:var(--m-papier)}
.maison .analyse-h1{color:var(--m-nuit)}

/* Publications : catégorie en or, titre en gras, filets fins */
.maison .blog-grid{border-top:1px solid var(--m-nuit)}
.maison .post-card__meta{font:500 12px var(--sans);letter-spacing:.08em}
.maison .post-card__meta .tag{color:var(--m-or)}
.maison .post-card h3{font:700 22px/1.25 var(--title);color:var(--m-encre)}
.maison .post-card__link{color:var(--m-bleu)}

/* Contact, FAQ, pages légales */
.maison .channels,.maison .faq{border-top-color:var(--m-nuit)}
.maison .channel .eyebrow{color:var(--m-or)}
.maison .faq summary{color:var(--m-nuit)}
.maison .faq summary::after{color:var(--m-or)}
.maison .faq-cat>h2{color:var(--m-or)}
.maison .legal h2{color:var(--m-nuit)}
.maison .notice{border-left-color:var(--m-or)}
.maison .pay-methods{border-top-color:var(--m-nuit)}

@media (max-width:767px){
  .maison .page-head h1{font-size:34px}
  .maison:not([data-page="m-ecole"]) .page-head.with-ph{min-height:34vh;padding-bottom:32px}
  .maison .page-head:not(.with-ph){padding:36px 0 32px}
  .maison .offer,.maison .offer+.offer{padding:28px 22px 26px}
  .maison .offer:last-child{border-bottom:1px solid var(--m-filet)}
  .maison .offer h2{font-size:26px}
}

/* Ligne de chandeliers sur la photo : plus grande et plus visible (demande d'Obed) */
.maison .candles{opacity:.34;height:300px;bottom:6%}
.maison .candles line{stroke-width:2.4}
.maison .candles rect.b{stroke-width:2.4}
.maison .candles rect:not(.b){fill:var(--m-or)}
@media (max-width:767px){.maison .candles{height:200px;bottom:4%;opacity:.38}}

/* Bouton de l'ouverture (« Découvrir les formations »), blanc sur la photo */
.maison .hero-actions{margin-top:30px}
.maison .btn--blanc,.maison .btn--blanc:visited{background:#fff;color:var(--m-nuit);border-color:#fff}
.maison .btn--blanc:hover{background:transparent;color:#fff}
/* Les boutons gardent leur couleur de texte, même après une visite (sinon le texte devenait noir) */
.maison .btn:visited{color:#fff}
.maison .offer .btn,.maison .offer .btn:visited{background:#fff;color:var(--m-nuit);border-color:#fff}
.maison .offer .btn:hover{background:transparent;color:#fff;border-color:#fff}

/* Bas de L'école : seulement les deux boutons */
.maison .closing .actions{margin-top:0}

/* Téléphone : le titre de l'ouverture au milieu de l'image */
@media (max-width:767px){
  .maison[data-page="m-ecole"] .page-head.with-ph{align-items:center;padding:88px 0 56px}
  .maison .hero-actions .btn{width:100%}
}

/* Admission : les deux cartes en bleu nuit (Trading institutionnel en premier) */
.maison .offer:last-child{background:var(--m-nuit);color:#fff;border:0}
.maison .offer:last-child h2{color:#fff}
.maison .offer:last-child .offer__line,.maison .offer:last-child .offer__facts dd{color:rgba(255,255,255,.88)}
.maison .offer:last-child .offer__facts dt{color:rgba(255,255,255,.6)}
.maison .offer:last-child .offer__facts,.maison .offer:last-child .offer__facts>div{border-color:rgba(255,255,255,.18)}
@media (max-width:767px){.maison .offer:last-child{border-bottom:0}}

/* =========================================================
   Page de paiement : présentation classique des sites de paiement connus
   (récapitulatif à gauche, coordonnées et moyen de paiement à droite)
   ========================================================= */
.maison .checkout{padding:56px 0 72px;background:var(--m-papier)}
.maison .checkout__grille{display:grid;grid-template-columns:1fr 1fr;gap:0;max-width:1040px;border:1px solid var(--m-filet);border-radius:8px;overflow:hidden;background:#fff;padding:0}
.maison .checkout__resume{background:var(--m-nuit);color:#fff;padding:44px 44px 40px}
.maison .checkout__marque{font:600 12px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--m-or)}
.maison .checkout__titre{font:700 32px/1.1 var(--title);letter-spacing:-.02em;color:#fff;margin:10px 0 28px}
.maison .checkout__formules{display:flex;flex-direction:column;gap:10px}
.maison .checkout__formule{display:flex;align-items:center;gap:12px;border:1px solid rgba(255,255,255,.22);border-radius:6px;padding:14px 16px;cursor:pointer}
.maison .checkout__formule:has(input:checked){border-color:#fff;background:rgba(255,255,255,.06)}
.maison .checkout__formule input{accent-color:var(--m-or)}
.maison .checkout__f-nom{flex:1;font-weight:600}
.maison .checkout__f-prix{font-weight:600}
.maison .checkout__f-prix small{font-weight:400;color:rgba(255,255,255,.7)}
.maison .checkout__total{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid rgba(255,255,255,.18);margin-top:28px;padding-top:18px;font-size:15px;color:rgba(255,255,255,.8)}
.maison .checkout__total strong{font:700 26px var(--title);color:#fff}
.maison .checkout__fcfa{text-align:right;font-size:13px;color:rgba(255,255,255,.6);margin-top:4px}
.maison .checkout__form{padding:40px 44px;display:flex;flex-direction:column;gap:14px}
.maison .checkout__h2{font:600 15px var(--sans);color:var(--m-encre);margin-top:6px}
.maison .checkout__h2:not(:first-child){margin-top:14px}
.maison .checkout__moyens{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.maison .checkout__moyen{display:flex;gap:10px;align-items:flex-start;border:1px solid #C9CDD6;border-radius:6px;padding:14px;cursor:pointer}
.maison .checkout__moyen:has(input:checked){border-color:var(--m-bleu);box-shadow:0 0 0 1px var(--m-bleu)}
.maison .checkout__moyen input{margin-top:3px;accent-color:var(--m-bleu)}
.maison .checkout__moyen strong{display:block;font-weight:600;font-size:15px}
.maison .checkout__moyen small{display:block;color:var(--m-gris);font-size:13px}
.maison .checkout__moyen.is-off{opacity:.5;cursor:not-allowed}
.maison .checkout__risque{font-size:14px;margin-top:4px}
.maison .checkout__risque a{color:var(--m-bleu);font-weight:600}
.maison .checkout__payer,.maison .checkout__payer:visited{width:100%;justify-content:center;padding:17px 24px;font-size:16px;margin-top:6px;color:#fff}
.maison .checkout__secu{text-align:center;font-size:13px;color:var(--m-gris)}
@media (max-width:767px){
  .maison .checkout{padding:20px 0 40px}
  .maison .checkout__grille{grid-template-columns:1fr;border-radius:6px}
  .maison .checkout__resume{padding:26px 20px 22px}
  .maison .checkout__titre{font-size:26px;margin-bottom:18px}
  .maison .checkout__form{padding:24px 20px}
  .maison .checkout__moyens{grid-template-columns:1fr}
}
.maison .checkout__invalide{max-width:620px}
.maison .checkout__titre-clair{font:700 34px/1.1 var(--title);color:var(--m-nuit);margin-bottom:12px}
.maison .checkout__payer-carte,.maison .checkout__payer-carte:visited{width:100%;justify-content:center;background:#fff;color:var(--m-bleu)}
.maison #payPane .checkout__total{margin-top:8px}
/* Chandeliers encore plus visibles ; sur téléphone, bougies plus grandes (bande plus large) */
.maison .candles{opacity:.42}
@media (max-width:767px){
  .maison .candles{opacity:.5;height:230px;bottom:3%}
  .maison .candles__track{width:560%}
}
/* Téléphone : les chandeliers dans la bande libre sous le bouton, bien visibles */
@media (max-width:767px){
  .maison[data-page="m-ecole"] .page-head.with-ph{padding-bottom:150px}
  .maison .candles{height:120px;bottom:12px;opacity:.6}
}

/* Correctif : le bouton blanc garde son texte bleu nuit, même après une visite ou un appui (téléphone) */
.maison a.btn.btn--blanc,.maison a.btn.btn--blanc:visited{background:#fff;color:var(--m-nuit);border-color:#fff}
@media (hover:hover){.maison a.btn.btn--blanc:hover{background:transparent;color:#fff}}
@media (hover:none){.maison a.btn.btn--blanc:hover{background:#fff;color:var(--m-nuit)}}
.maison .analyse-bande a.btn,.maison .analyse-bande a.btn:visited{background:#fff;color:var(--m-nuit);border-color:#fff}
@media (hover:none){.maison .analyse-bande a.btn:hover{background:#fff;color:var(--m-nuit)}}

/* =========================================================
   Apparition au défilement (réglages du site Rothschild & Co)
   ========================================================= */
:root{--app-distance:3rem;--app-duree:800ms;--app-courbe:cubic-bezier(0.33,1,0.68,1);--app-decalage:100ms}
.js-apparition .reveal,.js-apparition .reveal-image,.js-apparition .reveal-children > *{
  opacity:0;transform:translateY(var(--app-distance));
  transition:opacity var(--app-duree) var(--app-courbe),transform var(--app-duree) var(--app-courbe)}
.js-apparition .reveal.play,.js-apparition .reveal-image.play,.js-apparition .reveal-children.play > *{opacity:1;transform:none}
.js-apparition .reveal-children > *{transition-delay:calc(var(--i, 0) * var(--app-decalage))}
.js-apparition .reveal-image{transition-delay:150ms}
/* Bandeau d'ouverture : visible tout de suite, le titre et le bouton apparaissent en fondu (sans décalage) */
@keyframes kbo-fondu{from{opacity:0}to{opacity:1}}
.js-apparition .page-head .wrap > *{animation:kbo-fondu 700ms var(--app-courbe) both}
.js-apparition .page-head .wrap > :nth-child(3){animation-delay:80ms}
.js-apparition .page-head .wrap > :nth-child(n+4){animation-delay:160ms}
@media (prefers-reduced-motion:reduce){
  .reveal,.reveal-image,.reveal-children > *{opacity:1!important;transform:none!important;transition:none!important}
  .page-head .wrap > *{animation:none!important}
}