/* Fiches publiques : la présentation du musicien reste au premier plan. */
.m-page-fiche a.m-bouton-principal { color: #fff; }
.m-fiche-hero { padding-block: 23px 40px; background: var(--m-creme); border-bottom: 1px solid var(--m-trait); }
.m-fiche-hero-grille { display: grid; grid-template-columns: minmax(0, 1fr) 300px; grid-template-rows: 1fr 1fr; gap: 23px 70px; margin-top: 35px; }
.m-fiche-identite { align-self: end; }
.m-fiche-identite h1 { margin-top: 17px; font-size: clamp(40px, 5.4vw, 67px); overflow-wrap: anywhere; }
.m-fiche-lieu { display: flex; align-items: center; gap: 8px; margin-top: 20px !important; color: var(--m-secondaire); font-size: 14px; }
.m-fiche-lieu .m-icone { width: 18px; height: 18px; }
.m-fiche-actions { display: flex; flex-wrap: wrap; align-content: start; align-items: start; gap: 11px; }
.m-fiche-portrait { --m-portrait-hauteur: 330px; --m-portrait-bord: 7px; grid-column: 2; grid-row: 1 / 3; position: relative; display: block; align-self: center; justify-self: end; width: fit-content; max-width: 100%; height: auto; overflow: hidden; border: var(--m-portrait-bord) solid var(--m-papier); border-radius: 5px; background: #ede6dc; box-shadow: 0 10px 25px #3924170c; text-decoration: none; }
.m-fiche-portrait img { display: block; max-width: 100%; max-height: calc(var(--m-portrait-hauteur) - var(--m-portrait-bord) - var(--m-portrait-bord)); width: auto; height: auto; object-fit: contain; }
.m-fiche-portrait > span { position: absolute; right: 9px; bottom: 9px; display: flex; align-items: center; gap: 7px; padding: 7px 10px; border-radius: 3px; background: #fffefaeF; color: var(--m-encre); font-size: 10px; }
.m-fiche-portrait .m-icone { width: 14px; height: 14px; }
.m-fiche-hero-sans-photo { grid-template-columns: 1fr; grid-template-rows: auto auto; padding-block: 15px 5px; }
.m-fiche-onglets { border-bottom: 1px solid var(--m-trait); }
.m-fiche-onglets > div { display: flex; flex-wrap: wrap; gap: 30px; }
.m-fiche-onglets a { position: relative; display: inline-flex; align-items: center; gap: 8px; padding-block: 19px; text-decoration: none; font-size: 13px; white-space: nowrap; }
.m-fiche-onglets [aria-current] { color: var(--m-brique-texte); }
.m-fiche-onglets [aria-current]::after { position: absolute; content: ''; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--m-brique); }
.m-fiche-onglets a span { display: inline-flex; align-items: center; justify-content: center; min-width: 21px; height: 21px; border: 1px solid var(--m-trait); border-radius: 50%; color: var(--m-secondaire); font-size: 10px; }
.m-fiche-corps { display: grid; grid-template-columns: minmax(0, 1fr) 320px; align-items: start; gap: 65px; padding-block: 48px 65px; }
.m-fiche-principal, .m-fiche-infos { min-width: 0; }
.m-fiche-presentation h2, .m-fiche-audio h2 { margin-top: 15px; font-size: 38px; }
.m-fiche-texte { margin-top: 26px; color: var(--m-secondaire); line-height: 1.9; font-size: 15px; overflow-wrap: anywhere; }
.m-fiche-texte p { margin-block: 17px; }
.m-fiche-texte p:first-child { margin-top: 0; }
.m-fiche-texte h2, .m-fiche-texte h3 { margin-block: 28px 14px; color: var(--m-encre); font-family: var(--m-serif); font-size: 28px; font-weight: 400; line-height: 1.25; }
.m-fiche-texte a { color: var(--m-encre); }
.m-fiche-texte img { max-width: 100%; height: auto !important; }
.m-fiche-texte iframe, .m-fiche-texte video, .m-fiche-texte embed, .m-fiche-texte object { max-width: 100%; }
.m-fiche-texte iframe[src*="youtube"], .m-fiche-texte iframe[src*="vimeo"] { width: 100%; height: auto; aspect-ratio: 16 / 9; }
.m-fiche-texte table { display: block; max-width: 100%; overflow-x: auto; }
.m-fiche-infos { display: flex; flex-direction: column; gap: 18px; }
.m-fiche-carte { padding: 24px; border: 1px solid var(--m-trait); border-radius: 5px; background: #fffefa; font-size: 13px; overflow-wrap: anywhere; }
.m-fiche-carte h2 { margin-bottom: 17px; font-size: 24px; letter-spacing: -.03em; }
.m-fiche-disciplines, .m-fiche-styles, .m-fiche-sociaux { list-style: none; padding: 0; margin: 0; }
.m-fiche-disciplines > li + li { margin-top: 17px; padding-top: 17px; border-top: 1px solid var(--m-trait); }
.m-fiche-discipline { font-size: 14px; font-weight: 600; text-decoration: none; }
.m-fiche-activite { display: block; margin-top: 7px !important; color: var(--m-secondaire); font-size: 12px; line-height: 1.5; }
.m-fiche-styles { display: flex; flex-wrap: wrap; gap: 8px; }
.m-fiche-styles a { display: block; padding: 5px 10px; border: 1px solid var(--m-trait); border-radius: 3px; background: var(--m-creme); font-size: 11px; text-decoration: none; }
.m-fiche-lien-web + .m-fiche-lien-web { padding-top: 15px; margin-top: 15px; border-top: 1px solid var(--m-trait); }
.m-fiche-lien-web a, .m-fiche-sociaux a { display: flex; justify-content: space-between; align-items: center; gap: 12px; text-decoration: none; }
.m-fiche-lien-web .m-icone, .m-fiche-sociaux .m-icone { width: 16px; height: 16px; color: var(--m-brique); }
.m-fiche-lien-web p { margin-top: 7px; font-size: 12px; line-height: 1.6; color: var(--m-secondaire); }
.m-fiche-sociaux { display: flex; flex-direction: column; gap: 13px; }
.m-fiche-lien-web + .m-fiche-sociaux { margin-top: 19px; padding-top: 17px; border-top: 1px solid var(--m-trait); }
.m-fiche-invitation { background: var(--m-creme); }
.m-fiche-invitation h2 { margin-top: 13px; font-size: 27px; }
.m-fiche-invitation p:not(.m-surtitre) { color: var(--m-secondaire); line-height: 1.6; }
.m-fiche-invitation .m-bouton { width: 100%; margin-top: 20px; font-size: 12px; padding-inline: 14px; }
.m-fiche-audio { margin-top: 42px; padding-top: 35px; border-top: 1px solid var(--m-trait); }
.m-fiche-aide { margin-top: 16px !important; font-size: 14px; color: var(--m-secondaire); }
.m-fiche-pistes { display: flex; flex-direction: column; gap: 13px; padding: 0; margin: 25px 0 0; list-style: none; }
.m-fiche-piste { padding: 19px; border: 1px solid var(--m-trait); border-radius: 5px; background: #faf6f0; transition: border-color .2s; }
.m-fiche-piste-active { border-color: var(--m-brique); }
.m-fiche-piste-titre { display: flex; align-items: baseline; gap: 14px; margin-bottom: 13px; }
.m-fiche-piste-titre > span { font-size: 11px; color: var(--m-brique-texte); }
.m-fiche-piste-titre h3 { font-size: 14px; line-height: 1.5; font-weight: 600; overflow-wrap: anywhere; }
.m-fiche-piste audio { display: block; width: 100%; max-width: 100%; height: 43px; }
.m-fiche-audio-erreur { margin-top: 10px !important; font-size: 12px; color: var(--m-secondaire); }
.m-fiche-videos { margin-top: 42px; padding-top: 35px; border-top: 1px solid var(--m-trait); }
.m-fiche-videos h2 { margin-top: 15px; font-size: 38px; }
.m-fiche-videos-liste { display: flex; flex-direction: column; gap: 23px; margin-top: 25px; }
.m-fiche-video { min-width: 0; }
.m-fiche-video-cadre { overflow: hidden; width: 100%; max-width: 100%; min-height: 200px; aspect-ratio: 16 / 9; border: 1px solid var(--m-trait); border-radius: 5px; background: var(--m-creme); }
.m-fiche-video-ouvrir { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 15px; width: 100%; height: 100%; min-height: 200px; padding: 22px; border: 0; background: var(--m-creme); color: var(--m-encre); }
.m-fiche-video-play { display: flex; align-items: center; justify-content: center; width: 57px; height: 57px; border: 1px solid #d9bba9; border-radius: 50%; color: var(--m-brique-texte); font-size: 19px; padding-left: 3px; }
.m-fiche-video-ouvrir strong { font-size: 15px; font-weight: 600; }
.m-fiche-video-ouvrir > span:last-child { font-size: 12px; color: var(--m-secondaire); }
.m-fiche-video-ouvrir:hover { background: #f0e7da; }
.m-fiche-video-cadre iframe { display: block; width: 100%; height: 100%; min-height: 200px; border: 0; }
.m-fiche-video-source { display: inline-flex; align-items: center; gap: 9px; margin-top: 10px; font-size: 12px; text-decoration: none; }
.m-fiche-video-source .m-icone { width: 15px; height: 15px; }
.m-fiche-contact-mobile { display: none; }
.m-fiche-zoom { max-width: min(96vw, 1200px); max-height: 95vh; padding: 18px; border: 1px solid var(--m-trait); border-radius: 5px; background: var(--m-papier); color: var(--m-encre); }
.m-fiche-zoom::backdrop { background: #201a15cf; }
.m-fiche-zoom > div { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.m-fiche-zoom button { align-self: end; min-height: 40px; padding: 8px 15px; }
.m-fiche-zoom img { max-width: 100%; max-height: 75vh; width: auto; height: auto; object-fit: contain; }
.m-fiche-zoom p { font-size: 12px; }
@media (max-width: 1000px) {
    .m-fiche-hero-grille { gap: 22px 35px; grid-template-columns: minmax(0, 1fr) 250px; }
    .m-fiche-portrait { --m-portrait-hauteur: 300px; }
    .m-fiche-corps { grid-template-columns: minmax(0, 1fr) 280px; gap: 32px; }
    .m-fiche-carte { padding: 20px; }
}
@media (max-width: 760px) {
    .m-fiche-hero { padding-block: 19px 28px; }
    .m-fiche-hero-grille { grid-template-columns: minmax(0, 1fr) 160px; grid-template-rows: auto auto; gap: 20px; margin-top: 28px; }
    .m-fiche-identite { align-self: center; }
    .m-fiche-identite h1 { font-size: 42px; margin-top: 11px; }
    .m-fiche-portrait { grid-row: 1; --m-portrait-hauteur: 185px; --m-portrait-bord: 5px; }
    .m-fiche-actions { grid-column: 1 / -1; }
    .m-fiche-corps { grid-template-columns: 1fr; gap: 32px; padding-block: 32px 40px; }
    .m-fiche-infos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .m-fiche-invitation { grid-column: 1 / -1; }
    .m-fiche-texte { font-size: 14px; margin-top: 20px; }
    .m-fiche-onglets > div { gap: 20px; }
    .m-fiche-onglets a { font-size: 12px; padding-block: 15px; }
    .m-fiche-contact-mobile { position: fixed; z-index: 8; display: flex; justify-content: center; inset: auto 0 0; padding: 10px 20px max(10px, env(safe-area-inset-bottom)); border-top: 1px solid var(--m-trait); background: #fffefaf5; box-shadow: 0 -3px 20px #3924170a; }
    .m-fiche-contact-mobile .m-bouton { width: 100%; }
    .m-page-fiche.m-fiche-contact-fixe { padding-bottom: 78px; }
}
@media (max-width: 500px) {
    .m-fiche-hero-grille { grid-template-columns: minmax(0, 1fr) 105px; gap: 19px 14px; }
    .m-fiche-identite .m-surtitre { font-size: 9px; letter-spacing: .1em; }
    .m-fiche-identite h1 { font-size: 33px; }
    .m-fiche-portrait { --m-portrait-hauteur: 138px; --m-portrait-bord: 4px; }
    .m-fiche-portrait > span { font-size: 0; padding: 5px; right: 4px; bottom: 4px; }
    .m-fiche-portrait .m-icone { width: 14px; height: 14px; }
    .m-fiche-lieu { margin-top: 12px !important; font-size: 11px; gap: 5px; }
    .m-fiche-lieu .m-icone { width: 14px; height: 14px; }
    .m-fiche-actions .m-bouton { min-height: 47px; padding: 12px 15px; font-size: 12px; }
    .m-fiche-actions > .m-bouton-principal { flex-grow: 1; }
    .m-fiche-hero-sans-photo { grid-template-columns: 1fr; }
    .m-fiche-infos { grid-template-columns: 1fr; }
    .m-fiche-presentation h2, .m-fiche-audio h2 { font-size: 32px; }
    .m-fiche-piste { padding: 15px 12px; }
    .m-fiche-onglets > div { gap: 0 20px; }
}
