/* ============================================================
   ONI LIVE v2 : habillage calqué sur le site ordre-infirmiers.fr
   (couleurs relevées sur le site en ligne, police Montserrat,
   boutons carrés, cartes à filet rouge, carré rouge de titre,
   pastilles rondes rouges, blocs pleins bleu et rouge, pied de
   page gris clair, bouton flottant « Contactez l'Ordre »).
   Ce fichier ne se modifie pas pour un événement (voir config.js).
   ============================================================ */

:root{
  --bleu:#1a438f;
  --rouge:#cf2c29;
  --noir:#21252b;
  --gris-texte:#747474;
  --hero:#eef7fc;
  --gris-fond:#f7f6f6;
  --blanc:#ffffff;
  --filet:#d8dbe0;
  --largeur:1240px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  background:var(--blanc);color:var(--noir);
  font-family:"Montserrat","Poppins",Arial,sans-serif;
  font-size:15px;line-height:1.6;
  min-height:100vh;display:flex;flex-direction:column;
}
a{color:var(--bleu);text-decoration:none}
a:hover{text-decoration:underline}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--bleu);outline-offset:3px}
h1,h2,h3{font-weight:800;line-height:1.15;color:var(--noir)}
h1{font-size:clamp(1.9rem,3.6vw,2.7rem);color:var(--bleu)}
h2{font-size:clamp(1.55rem,2.8vw,2.2rem);margin-bottom:26px}
h3{font-size:1.1rem;font-weight:700}
p{max-width:64ch}
.int{width:100%;max-width:var(--largeur);margin:0 auto;padding:0 24px}

/* ---------- en-tête ---------- */
.entete{background:var(--blanc);border-bottom:1px solid var(--filet)}
.entete .int{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:14px;padding-bottom:14px}
.logo-lien{display:inline-block;line-height:0}
.logo{height:100px;width:auto}
.entete-droite{display:flex;align-items:center;gap:0}
.lien-site{font-weight:600;color:var(--gris-texte);font-size:.98rem}
.bouton-entete{display:inline-flex;align-items:center;height:56px;padding:0 26px;background:var(--bleu);color:var(--blanc);font-weight:700;font-size:.95rem;text-decoration:none;white-space:nowrap}
.bouton-entete:hover{background:#153672;text-decoration:none}
.bouton-entete-clair{background:var(--blanc);color:var(--bleu);border:1px solid var(--bleu)}
.bouton-entete-clair:hover{background:var(--hero)}
.bouton-entete-rouge{background:var(--rouge)}
.bouton-entete-rouge:hover{background:#b8241f}
@media (max-width:700px){
  .logo{height:68px}
  .entete .int{padding-top:10px;padding-bottom:10px}
  .lien-site{display:none}
  .bouton-entete{height:44px;padding:0 12px;font-size:.82rem}
  .entete-droite{gap:0}
}

/* ---------- boutons ---------- */
.bouton{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:inherit;font-weight:700;font-size:.95rem;background:var(--bleu);color:var(--blanc);border:1px solid var(--bleu);padding:0 30px;height:56px;cursor:pointer;text-decoration:none;white-space:nowrap;transition:background .15s,color .15s}
.bouton:hover{background:#153672;text-decoration:none}
.bouton-grand{height:66px;font-size:1.05rem;padding:0 40px}
.bouton-ligne{background:var(--blanc);color:var(--noir);border:1px solid var(--noir)}
.bouton-ligne:hover{background:var(--noir);color:var(--blanc)}
.bouton-blanc{background:var(--blanc);color:var(--bleu);border-color:var(--blanc)}
.bouton-blanc:hover{background:var(--hero);color:var(--bleu)}
.bouton-blanc-rouge{background:var(--blanc);color:var(--rouge);border-color:var(--blanc)}
.bouton-blanc-rouge:hover{background:#fbe9e8}
.bouton svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8}
/* lien « Lire la suite » encadré de deux traits */
.lien-trait{display:flex;align-items:center;gap:20px;font-weight:700;color:var(--noir);text-decoration:none;font-size:.95rem;width:100%}
.lien-trait::before,.lien-trait::after{content:"";flex:1;height:1px;background:#9fb3cf}
.lien-trait:hover{color:var(--bleu);text-decoration:none}

/* carré rouge sous les titres, comme sur le site */
.carre{display:block;width:14px;height:14px;background:var(--rouge);margin:18px auto}
.carre-gauche{margin:14px 0 18px}
/* vaguelette rouge sous le H1 */
.vague{display:block;width:120px;height:32px;margin:12px 0 26px;overflow:visible}
.vague path{fill:none;stroke:var(--rouge);stroke-width:4;stroke-linecap:round}

/* ---------- héros ---------- */
.heros{background:var(--hero)}
.heros .int{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:48px;align-items:center;padding-top:56px;padding-bottom:130px}
.heros .sur-titre{font-weight:600;color:var(--gris-texte);font-size:.9rem;margin-bottom:10px}
.heros .chiffre{font-size:clamp(2.1rem,3.9vw,3.1rem);font-weight:800;color:var(--rouge);line-height:1;letter-spacing:-.01em}
.heros .chiffre-sous{font-size:1.3rem;font-weight:800;color:var(--bleu);line-height:1.2}
.heros .chiffre-date{color:var(--gris-texte);font-size:.95rem;margin:4px 0 26px}
.heros .apres-bouton{font-size:.85rem;color:var(--gris-texte);margin-top:16px}
/* la carte de droite, à la place du carrousel d'actualités */
.carte-heros{background:transparent}
.lecteur{background:#0b1730;box-shadow:0 18px 40px rgba(13,26,51,.28)}
.lecteur-ecran{position:relative;aspect-ratio:16/9;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:
    radial-gradient(ellipse 70% 60% at 50% 40%,rgba(90,140,220,.45),transparent 70%),
    linear-gradient(160deg,#1a438f 0%,#12306b 55%,#0b1730 100%)}
.lecteur-ecran::before{content:"";position:absolute;inset:0;background:
    repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 4px);pointer-events:none}
.lecteur-ecran::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(11,23,48,.85),transparent 45%);pointer-events:none}
.lecteur-live{position:absolute;top:14px;left:14px;z-index:2;display:inline-flex;align-items:center;gap:7px;background:var(--rouge);color:var(--blanc);font-weight:700;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;padding:4px 10px}
.lecteur-live .point{width:7px;height:7px;border-radius:50%;background:var(--blanc);animation:clignote 1.6s ease-in-out infinite}
@keyframes clignote{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes onde{0%{transform:scale(1);opacity:.55}100%{transform:scale(1.9);opacity:0}}
@media (prefers-reduced-motion:reduce){.lecteur-live .point,.lecteur-lecture::before{animation:none}}
.lecteur-hd{position:absolute;top:14px;right:14px;z-index:2;border:1px solid rgba(255,255,255,.55);color:var(--blanc);font-weight:700;font-size:.66rem;padding:2px 7px;letter-spacing:.06em}
.lecteur-plateau{position:relative;z-index:2;display:flex;align-items:center;gap:clamp(18px,3.5%,34px);background:var(--blanc);padding:16px clamp(18px,3.5%,34px);margin-top:-6px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.lecteur-plateau img{height:clamp(56px,8vw,86px);width:auto;display:block}
.lecteur-sep{width:1px;align-self:stretch;background:var(--filet)}
.lecteur-lecture{position:relative;z-index:2;margin-top:24px;width:60px;height:60px;border-radius:50%;background:var(--blanc);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 22px rgba(0,0,0,.35)}
.lecteur-lecture::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(255,255,255,.7);animation:onde 2.4s ease-out infinite}
.lecteur-lecture svg{width:26px;height:26px;fill:var(--bleu);margin-left:4px}
.lecteur-etiquette{position:absolute;z-index:2;left:0;right:0;bottom:12px;margin:0;max-width:none;text-align:center;color:var(--blanc);font-weight:600;font-size:.82rem;letter-spacing:.01em;text-shadow:0 1px 6px rgba(0,0,0,.5)}
.lecteur-barre{display:flex;align-items:center;gap:12px;padding:10px 14px;background:#0b1730;color:var(--blanc);border-top:1px solid rgba(255,255,255,.08)}
.lecteur-bouton{width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;opacity:.9}
.lecteur-bouton svg{width:18px;height:18px;fill:var(--blanc);stroke:var(--blanc);stroke-width:1.5}
.lecteur-piste{flex:1;height:3px;background:rgba(255,255,255,.22);position:relative;border-radius:2px}
.lecteur-piste .curseur{position:absolute;left:0;top:50%;width:10px;height:10px;margin:-5px 0 0 -2px;border-radius:50%;background:var(--rouge);box-shadow:0 0 0 3px rgba(207,44,41,.3)}
.lecteur-temps{font-size:.7rem;color:rgba(255,255,255,.8);white-space:nowrap;font-weight:600}
@media (max-width:500px){
  .lecteur-ecran{aspect-ratio:4/3}
  .lecteur-hd,.lecteur-temps{display:none}
  .lecteur-plateau{padding:10px 14px;gap:14px}
  .lecteur-plateau img{height:46px}
  .lecteur-lecture{margin-top:14px;width:46px;height:46px}
  .lecteur-lecture svg{width:20px;height:20px}
  .lecteur-etiquette{font-size:.74rem;bottom:8px}
}
.carte-heros-bas{padding:22px 28px 26px}
.carte-heros-bas h3{font-size:1rem;margin-bottom:12px}
.compte-titre{font-weight:600;color:var(--gris-texte);font-size:.85rem;margin:26px 0 8px}
.compte{display:flex;gap:10px;flex-wrap:wrap}
.compte-bloc{min-width:76px;padding:10px 12px;text-align:center;border:1px solid var(--filet)}
.compte-bloc b{display:block;font-size:1.9rem;font-weight:800;color:var(--bleu);line-height:1.1}
.compte-bloc span{font-size:.72rem;color:var(--gris-texte)}
.compte-message{font-weight:700;color:var(--rouge)}
.carte-heros-bas .lien-trait{margin-top:6px}
@media (max-width:900px){
  .heros .int{grid-template-columns:1fr;gap:34px;padding-top:40px;padding-bottom:90px}
}

/* ---------- cartes à filet rouge (chevauchent le bandeau héros) ---------- */
.cartes{margin-top:-70px;position:relative;z-index:2}
.cartes .int{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px}
.carte{background:var(--blanc);border:1px solid var(--rouge);padding:32px 22px 28px;text-align:center;display:flex;flex-direction:column;align-items:center}
.carte h3{color:var(--bleu);font-size:1.2rem;font-weight:800}
.carte p{font-size:.88rem;margin-bottom:22px;color:var(--noir)}
.carte .bouton-ligne{margin-top:auto;height:48px;font-size:.88rem;padding:0 20px}
@media (max-width:1000px){.cartes .int{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.cartes .int{grid-template-columns:1fr}}

/* ---------- sections ---------- */
.section{padding:64px 0}
.section-grise{background:var(--gris-fond)}
.deux-tiers{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:40px;align-items:stretch}
@media (max-width:900px){.deux-tiers{grid-template-columns:1fr}}

/* citation du code de déontologie */
.citation{border-left:4px solid var(--bleu);padding:4px 0 4px 24px;font-size:.98rem}
.citation p{margin-bottom:14px;max-width:66ch}
.citation p:last-child{margin-bottom:0}
.citation-source{font-size:.85rem;color:var(--gris-texte);margin-top:14px}
.bloc-rouge{background:var(--rouge);color:var(--blanc);padding:36px 28px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:18px}
.bloc-rouge h3{color:var(--blanc);font-size:1.3rem;font-weight:800}
.bloc-rouge svg{width:56px;height:56px;stroke:var(--blanc);fill:none;stroke-width:1.5}
.bloc-rouge p{font-size:.92rem}
.bloc-rouge .bouton{width:100%;max-width:320px;height:52px;padding:0 16px;white-space:normal;text-align:center;line-height:1.2}

/* pastilles rondes rouges (comme la section Annuaires) */
.pastilles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:56px}
@media (max-width:760px){.pastilles{grid-template-columns:1fr}}
.pastille{display:flex;flex-direction:column;align-items:flex-start}
.pastille .rond{width:118px;height:118px;border-radius:50%;background:var(--rouge);color:var(--blanc);display:flex;align-items:center;justify-content:center;font-size:2.5rem;font-weight:800;margin-bottom:24px}
.pastille h3{font-size:1.5rem;font-weight:800;margin-bottom:12px}
.pastille p{color:var(--gris-texte);margin-bottom:24px}
.pastille .bouton-ligne{height:52px}

/* bloc bleu final (comme « Mon espace membre ») */
.bloc-bleu{background:var(--bleu);color:var(--blanc);padding:56px 56px}
.bloc-bleu h2{color:var(--blanc);margin-bottom:22px}
.bloc-bleu p{font-size:1rem;margin-bottom:12px}
.bloc-bleu .quand{font-weight:800;font-size:1.1rem;margin:16px 0 26px}
@media (max-width:700px){.bloc-bleu{padding:44px 26px}}

/* ---------- page d'inscription ---------- */
.page-inscription .heros .int{grid-template-columns:1fr;padding-top:36px;padding-bottom:36px}
.page-inscription .section-grise{padding-top:40px}
.formulaire{background:var(--blanc);border:1px solid var(--rouge);padding:32px}
.formulaire h2{font-size:1.35rem;margin-bottom:8px}
.formulaire .note{color:var(--gris-texte);font-size:.95rem;margin-bottom:18px}
label{display:block;font-size:.9rem;font-weight:700;color:var(--noir);margin:16px 0 6px}
select,input[type=text],input[type=email]{width:100%;padding:12px 14px;border:1px solid #9a9a9a;background:var(--blanc);color:var(--noir);font-size:1rem;font-family:inherit}
input:focus{border-color:var(--bleu)}
.consentement{display:flex;gap:12px;align-items:flex-start;margin-top:20px;font-size:.86rem;font-weight:400;line-height:1.5}
.consentement input{margin-top:5px;width:18px;height:18px;flex:none;accent-color:var(--bleu)}
.erreur{color:var(--rouge);font-size:.95rem;margin-top:12px;display:none;font-weight:600}
.erreur.visible{display:block}
.formulaire .bouton{margin-top:26px;width:100%}
.confirmation{display:none;border-left:4px solid var(--bleu);padding:6px 0 6px 24px}
.confirmation.visible{display:block}
.confirmation h2{margin-bottom:10px}
iframe.mailjet{width:100%;border:0;display:block}
.recevrez{list-style:none;margin-bottom:22px}
.recevrez li{position:relative;padding-left:28px;margin-bottom:16px}
.recevrez li::before{content:"";position:absolute;left:0;top:9px;width:12px;height:12px;background:var(--rouge)}
.rgpd{margin-top:30px;font-size:.82rem;color:var(--gris-texte);border-top:1px solid var(--filet);padding-top:22px}
.rgpd h3{font-size:1rem;color:var(--noir);margin-bottom:8px}
.rgpd p{margin-bottom:10px;max-width:none}

/* ---------- pied de page ---------- */
.pied{margin-top:auto;background:var(--gris-fond);padding:50px 0 0}
.pied > .int{display:grid;grid-template-columns:auto 1fr;gap:40px 60px;align-items:start}
.pied .logo{height:150px}
.pied-liens{display:flex;flex-wrap:wrap;gap:12px 30px;justify-content:center;font-weight:600;font-size:.9rem;padding-top:40px}
.pied-liens a{color:var(--noir)}
.pied-boites{display:flex;justify-content:center;gap:24px;flex-wrap:wrap;position:relative}
.pied-boites::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:#c9ccd1}
.pied-boite{position:relative;background:var(--gris-fond);border:1px solid var(--noir);padding:0 30px;height:64px;display:inline-flex;align-items:center;gap:12px;font-weight:600;color:var(--noir)}
.pied-boite svg{width:20px;height:20px;stroke:var(--noir);fill:none;stroke-width:1.6}
.pied-bas{background:var(--blanc);margin-top:44px;padding:22px 0;font-size:.82rem;color:var(--gris-texte);text-align:center}
.pied-bas p{max-width:none;margin:0 auto}
@media (max-width:800px){
  .pied > .int{grid-template-columns:1fr;justify-items:center;text-align:center}
}

.bloc-bleu .recevrez li::before{background:var(--blanc)}
.bloc-bleu .recevrez li{font-size:.95rem}
.pied-bas .int{display:block}
.pied-bas p+p{margin-top:4px}
.barre-haut .membre{white-space:nowrap}
@media (max-width:900px){.barre-haut .membre{font-size:.8rem;padding:0 12px}}
.page-inscription .bloc-bleu h2{font-size:1.4rem;margin-bottom:20px}
.page-inscription .bloc-bleu{padding:44px 36px}
.compte-bloc{background:var(--blanc)}

select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2321252b' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>");background-repeat:no-repeat;background-position:right 12px center;background-size:16px;padding-right:40px;cursor:pointer}
select:invalid{color:var(--gris-texte)}
.deux-champs{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
@media (max-width:560px){.deux-champs{grid-template-columns:1fr}}
.champ-obligatoire{color:var(--rouge)}
.facultatif{font-weight:400;color:var(--gris-texte);font-size:.82rem}
input::placeholder{color:#a3a3a3;font-size:.9rem}
.piege{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}

.page-inscription .heros .chiffre-sous{font-size:1.75rem;margin-top:6px}
.page-inscription .heros .chiffre-date{font-size:1.2rem;color:var(--noir);font-weight:600;margin-bottom:0}

/* les trois étapes de l'inscription : étape 1 en cours (rouge), suite en bleu ;
   trait plein entre 1 et 2, pointillés réguliers entre 2 et 3 */
.etapes{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);margin:26px 0 2px;padding:0}
.etapes li{display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;padding:0 6px}
.etape-lien{position:absolute;z-index:0;top:16px;left:-50%;width:100%;height:2px;padding:0 20px 0 18px;box-sizing:border-box;background-clip:content-box;opacity:.75}
.etape-lien-plein{background-image:linear-gradient(90deg,var(--bleu) 0 25%,transparent 25%),repeating-linear-gradient(90deg,var(--bleu) 0 5px,transparent 5px 11px);background-origin:content-box}
.etape-lien-pointille{background-image:repeating-linear-gradient(90deg,var(--bleu) 0 5px,transparent 5px 11px)}
.etape-num{position:relative;z-index:1;width:34px;height:34px;border-radius:50%;background:var(--bleu);color:var(--blanc);font-weight:800;font-size:.95rem;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 4px var(--blanc);margin-bottom:9px}
.etape-courante .etape-num{background:var(--rouge);box-shadow:0 0 0 3px var(--blanc),0 0 0 5px var(--rouge)}
.etape-courante .etape-texte{color:var(--rouge)}
.etape-texte{font-weight:700;font-size:.8rem;color:var(--noir);line-height:1.3;max-width:15ch}
.note-champs{font-size:.7rem;line-height:1.3;margin-bottom:12px}
@media (max-width:560px){.etape-texte{font-size:.74rem}.etape-num{width:30px;height:30px;font-size:.88rem}.etape-lien{top:14px;padding:0 17px 0 15px}}

.pied-bas .int p{max-width:none}
.pied-bas a{color:var(--noir);font-weight:600}
.pied-bas .version{color:#c9c9c9;font-size:.72rem;margin-left:14px;white-space:nowrap}
.pied-bas{font-size:.76rem;color:#9a9a9a}
.pied-bas a{color:#9a9a9a;font-weight:600}
.pied-bas a:hover{color:var(--bleu)}
.pied-bas .version{color:#d6d6d6;font-size:.66rem}
/* en-tête : les deux boutons ont la même largeur */
.entete-droite .bouton-entete{justify-content:center;min-width:170px;padding:0 20px}
@media (max-width:700px){.entete-droite .bouton-entete{min-width:0;flex:1 1 0;padding:0 8px}}

/* ---------- page du Direct ---------- */
.portillon{position:fixed;inset:0;z-index:50;background:var(--hero);display:flex;align-items:center;justify-content:center;padding:24px;overflow:auto}
.portillon-carte{background:var(--blanc);padding:40px 44px;max-width:460px;width:100%;text-align:center;box-shadow:0 12px 40px rgba(26,67,143,.12)}
.portillon-carte img{height:96px;margin-bottom:14px}
.portillon-carte h1{font-size:1.9rem;margin-bottom:4px}
.portillon-carte .chiffre-date{color:var(--noir);font-weight:600;font-size:.95rem;margin-bottom:18px}
.portillon-carte p{max-width:none;font-size:.95rem}
.portillon-carte label{text-align:left}
.portillon-carte input{width:100%;padding:12px 14px;border:1px solid #9a9a9a;font-size:1rem;font-family:inherit}
.portillon-carte .bouton{width:100%;margin-top:18px}
.portillon-carte .note{margin-top:18px;font-size:.85rem;color:var(--gris-texte)}
.bandeau-direct{background:var(--hero)}
.bandeau-direct .int{padding-top:28px;padding-bottom:28px}
.bandeau-direct h1{font-size:1.9rem}
.bandeau-direct .chiffre-date{color:var(--noir);font-weight:600;margin:4px 0 0}
.scene{padding:32px 0 60px}
.scene-grille{display:grid;grid-template-columns:minmax(0,2fr) minmax(320px,1fr);grid-template-rows:auto 1fr;gap:28px;align-items:start}
.scene-grille .lecteur-direct{grid-column:1;grid-row:1}
.scene-grille .salon{grid-column:2;grid-row:1 / span 2}
.scene-grille .sous-lecteur{grid-column:1;grid-row:2}
@media (max-width:960px){.scene-grille{grid-template-columns:1fr;grid-template-rows:none}.scene-grille .lecteur-direct,.scene-grille .salon,.scene-grille .sous-lecteur{grid-column:1;grid-row:auto}}
/* le lecteur de démonstration : mire sobre, comme sur eJAMS */
.lecteur-direct{position:relative;aspect-ratio:16/9;background:#0b1730;overflow:hidden}
.mire{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;padding:20px;color:var(--blanc)}
.mire-anim{width:120px;height:6px;overflow:hidden;background:rgba(255,255,255,.15);position:relative;margin-bottom:12px}
.mire-anim::after{content:"";position:absolute;top:0;left:-40%;width:40%;height:100%;background:var(--rouge);animation:balaye 1.6s ease-in-out infinite}
@keyframes balaye{0%{left:-40%}100%{left:100%}}
@media (prefers-reduced-motion:reduce){.mire-anim::after{animation:none;left:30%}}
.mire-titre{font-weight:800;font-size:1.05rem;letter-spacing:.04em;text-transform:uppercase;max-width:none}
.mire-note{color:rgba(255,255,255,.7);font-size:.9rem;max-width:44ch}
/* annonce, programme, intervenants : un seul filet à la fois */
.annonce{display:flex;gap:16px;align-items:flex-start;background:var(--hero);padding:16px 18px;margin-top:18px}
.annonce-etiquette{flex:none;background:var(--rouge);color:var(--blanc);font-weight:700;font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;padding:4px 10px}
.annonce p{max-width:none;font-size:.95rem}
.programme,.intervenants{margin-top:36px}
.programme h2,.intervenants h2{font-size:1.4rem;margin-bottom:14px}
.programme-liste,.intervenants-liste{list-style:none}
.programme-liste li{display:grid;grid-template-columns:64px 1fr;gap:14px;padding:12px 0;font-size:.95rem}
.programme-liste li+li{border-top:1px solid var(--filet)}
.programme-liste .heure{font-weight:800;color:var(--rouge)}
.intervenants-liste{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px}
.intervenants-liste li{display:flex;gap:12px;align-items:center;font-size:.92rem}
.initiales{flex:none;width:48px;height:48px;border-radius:50%;background:var(--bleu);color:var(--blanc);font-weight:800;display:flex;align-items:center;justify-content:center}
/* salon : carte blanche sans cadre, séparations par les fonds */
.salon{background:var(--blanc);box-shadow:0 8px 30px rgba(26,67,143,.10);display:flex;flex-direction:column;height:calc(100vh - 160px);min-height:520px;max-height:720px;position:sticky;top:16px}
.salon-entete{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 18px 12px}
.salon-entete h2{font-size:.95rem;margin:0;display:flex;align-items:center;gap:10px;color:var(--bleu)}
.carre-mini{width:10px;height:10px;background:var(--rouge);flex:none}
.salon-nb{font-size:.75rem;font-weight:600;color:var(--gris-texte);white-space:nowrap}
.salon-identite{padding:14px 18px 16px;background:var(--hero)}
.salon-identite p{font-size:.85rem;margin-bottom:10px;max-width:none}
.salon-identite form{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.salon-identite input{padding:11px 12px;border:1px solid #c4c9d2;font-size:.92rem;font-family:inherit;min-width:0}
.salon-identite .bouton{grid-column:1 / -1;height:44px;font-size:.9rem}
.salon-messages{flex:1;overflow-y:auto;padding:12px 18px;display:flex;flex-direction:column;gap:12px}
.message{font-size:.88rem;padding:8px 10px}
.message p{max-width:none;margin:0;line-height:1.45}
.message .auteur{display:block;font-weight:700;font-size:.76rem;color:var(--bleu);margin-bottom:2px}
.message .auteur em{font-style:normal;font-weight:500;color:var(--gris-texte);margin-left:8px}
.message-regie{background:#fbe9e8;padding:10px 12px}
.message-regie .auteur{color:var(--rouge)}
.message-moi{background:var(--hero)}
.salon-saisie{display:flex;gap:8px;padding:12px 18px 6px}
.salon-saisie input{flex:1;padding:11px 12px;border:1px solid #c4c9d2;font-size:.92rem;font-family:inherit;min-width:0}
.salon-saisie .bouton{width:48px;height:44px;padding:0}
.salon-saisie .bouton svg{width:18px;height:18px;fill:var(--blanc);stroke:none}
.salon-note{font-size:.72rem;color:var(--gris-texte);padding:6px 18px 12px;text-align:center;max-width:none}
[hidden]{display:none !important}
@media (max-width:960px){.salon{position:static;height:auto;min-height:0;max-height:none}.salon-messages{max-height:340px;min-height:220px}}
.portillon-carte img{height:150px;margin-bottom:18px}
.salon-entete{background:var(--hero);padding:16px 18px}
.salon-identite{background:var(--gris-fond)}
.salon-identite input{background:var(--blanc)}
.message-moi{background:var(--gris-fond)}
/* mire de démonstration sur la photo du plateau, avec un voile bleu nuit */
.lecteur-direct{background:#0b1730 url("plateau-demo.jpg") center/cover no-repeat}
.mire{background:linear-gradient(180deg,rgba(11,23,48,.55),rgba(11,23,48,.72))}
.mire-titre,.mire-note{text-shadow:0 1px 8px rgba(0,0,0,.5)}
.mire-note{color:rgba(255,255,255,.85)}

.duplex{display:inline-block;vertical-align:middle;margin-left:6px;background:var(--hero);color:var(--bleu);font-weight:700;font-size:.66rem;text-transform:uppercase;letter-spacing:.05em;padding:2px 7px}
.intervenants-liste{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
/* portillon remonté pour tenir sans défilement */
.portillon{align-items:flex-start;padding:28px 24px}
.portillon-carte{padding:28px 40px 30px}
.portillon-carte img{height:120px;margin-bottom:10px}
.portillon-carte h1{font-size:1.7rem}
.portillon-carte .chiffre-date{margin-bottom:12px}
.portillon-carte .bouton{margin-top:14px;height:56px}
.portillon-carte .note{margin-top:14px}
.salon-note{font-size:.66rem}
.portillon{padding-top:72px}
.formulaire h2{margin-bottom:2px}
.note-champs{font-size:.6rem;line-height:1.2;margin-bottom:10px;color:var(--gris-texte)}

/* pages confirmation, renvoyer-codes, rappels */
.formulaire .lien-bouton { background: none; border: 0; padding: 0; color: var(--bleu); font: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.formulaire .lien-bouton:hover { color: var(--rouge); }
.formulaire .actions .bouton { height: 52px; }
.formulaire .bouton:disabled { opacity: .6; cursor: wait; }
.page-inscription .heros .chiffre-sous:empty, .page-inscription .heros .chiffre-date:empty { display: none; }

/* régie des inscriptions */
.regie-table { border-collapse: collapse; font-size: .92rem; }
.regie-table td { padding: 6px 18px 6px 0; border-top: 1px solid var(--filet); }
.regie-table td + td { font-weight: 700; color: var(--bleu); }
button[data-rappel]:disabled { opacity: .55; cursor: wait; }