/* Pages secondaires : le visuel complet de l'accueil occupe sa vraie place dans le flux.
   Le contenu commence donc seulement APRES le visuel : aucune superposition. */
.visual-header{position:relative;z-index:50;width:100%;aspect-ratio:2/3;height:auto;overflow:hidden;background:#061127;border-bottom:1px solid rgba(255,103,151,.22)}
.visual-header-art{position:absolute;z-index:0;inset:0;width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.visual-menu-toggle,.poster-menu-toggle{position:absolute;z-index:55;color:transparent;background:transparent;border:0;cursor:pointer;padding:0;font-size:0}
.visual-menu-toggle{right:2.4%;top:1.4%;width:9.5%;height:6.5%}
.visual-nav{display:none;position:absolute;z-index:80;right:16px;top:8.5%;width:min(310px,calc(100vw - 32px));padding:12px;background:rgba(6,17,39,.98);border:1px solid rgba(255,126,154,.28);border-radius:16px;box-shadow:0 18px 50px rgba(0,0,0,.5);flex-direction:column;gap:3px}
.visual-nav.open{display:flex}
.visual-nav a{display:block;padding:12px 14px;border-radius:10px;color:#f5f6fb;font-weight:700}
.visual-nav a:hover,.visual-nav a:focus{background:rgba(255,255,255,.08);color:#ff9aae}
.site-footer{border-top:1px solid rgba(255,255,255,.08);padding:35px 0;color:#aeb9cd}
.footer-inner{width:min(1180px,calc(100% - 40px));margin:auto;display:grid;grid-template-columns:1fr auto 1fr;gap:30px;align-items:center}
.footer-inner>div:last-child{text-align:right}.legal{display:flex;gap:15px}
@media(max-width:760px){.visual-menu-toggle{right:7%;top:1.05%;width:16%;height:7.5%;min-width:52px;min-height:52px;touch-action:manipulation}.visual-nav{right:10px;top:8.2%}.footer-inner{grid-template-columns:1fr;text-align:center}.footer-inner>div:last-child{text-align:center}.legal{justify-content:center}}

/* Zone cliquable sur le bouton CRÉE MA CHANSON déjà dessiné dans le grand header. */
.visual-header-cta{position:absolute;z-index:54;left:30%;top:45.2%;width:40%;height:6.8%;border-radius:999px}
.visual-header-cta:focus-visible{outline:3px solid rgba(255,255,255,.9);outline-offset:3px}
@media(max-width:760px){.visual-header-cta{left:23.5%;top:45.2%;width:53%;height:6.8%}}
.footer-payments{display:grid;gap:8px}.footer-payments>span{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#d6deee}.payment-marks{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.payment-marks>span{display:inline-flex;align-items:center;justify-content:center;min-height:28px;padding:4px 9px;border-radius:7px;background:#fff;color:#10213f;font-weight:800;font-size:12px;line-height:1}.pay-visa{font-style:italic;font-size:15px!important}.pay-paypal{font-style:italic}.pay-mastercard{gap:0;position:relative;padding-left:32px!important}.pay-mastercard i{position:absolute;width:17px;height:17px;border-radius:50%;background:#d74334;left:7px}.pay-mastercard i:nth-child(2){background:#e89b25;left:16px;opacity:.92}.pay-mastercard b{font-size:10px;font-weight:800}

/* Mobile v2 — hamburger réellement plus grand et éloigné du coin du navigateur. */
@media(max-width:760px){
  .visual-menu-toggle{
    right:10.5%;
    top:2.15%;
    width:64px;
    height:64px;
    min-width:64px;
    min-height:64px;
    color:#fff;
    font-size:40px;
    line-height:1;
    display:flex;
    align-items:center;
    justify-content:center;
    text-indent:0;
    border-radius:14px;
    background:rgba(6,17,39,.38);
    -webkit-tap-highlight-color:transparent;
  }
  .visual-nav{right:18px;top:9.4%}
}

/* Mobile v3 — masque le hamburger imprimé dans le visuel et garde un seul vrai bouton. */
@media(max-width:760px){
  .visual-header::after{
    content:"";
    position:absolute;
    z-index:54;
    right:0;
    top:0;
    width:10.5%;
    height:4.7%;
    background:rgba(6,17,39,.96);
    border-bottom-left-radius:14px;
    pointer-events:none;
  }
  .visual-menu-toggle{
    right:13.5%;
    top:2.7%;
    width:62px;
    height:62px;
    min-width:62px;
    min-height:62px;
    font-size:38px;
    border:1px solid rgba(255,255,255,.28);
    background:rgba(6,17,39,.88);
    box-shadow:0 8px 24px rgba(0,0,0,.38);
  }
  .visual-nav{right:18px;top:10.2%}
}

/* Mobile v4 — un seul bouton, rapproché du bord droit, sans cache rectangulaire. */
@media(max-width:760px){
  .visual-header::after{display:none!important;content:none!important}
  .visual-menu-toggle{
    right:2.6%!important;
    top:2.7%!important;
    width:62px!important;
    height:62px!important;
    min-width:62px!important;
    min-height:62px!important;
    font-size:38px!important;
    background:rgba(6,17,39,.90)!important;
    border:1px solid rgba(255,255,255,.28)!important;
    box-shadow:0 8px 24px rgba(0,0,0,.38)!important;
  }
  .visual-nav{right:14px!important;top:10.2%!important}
}
