/* Accueil : mise en page ORDINATEUR (nouvelle accueil).
   Tout est sous @media(min-width:960px) : en dessous, l'accueil mobile reste STRICTEMENT identique.
   Chargé uniquement quand $accueil_version = 'nouvelle' (voir config.inc.php). */

/* Éléments réservés à l'ordinateur : cachés partout ailleurs */
.bureau-seul{display:none}
.partage-actions{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.partage-actions .btn{padding:14px}   /* mini icône « play » du bandeau « Partie en cours » : ordinateur seulement */

@media(min-width:960px){
    .bureau-seul{display:revert}

    body.v-bureau .ecran{
        max-width:1160px;min-height:0;padding:28px 32px 36px;
        display:grid;grid-template-columns:minmax(0,1fr) minmax(0,480px);column-gap:80px;
        grid-template-rows:auto auto auto auto auto auto;align-content:start
    }
    /* Bandeau « Partie en cours » : pleine largeur de l'écran, collé en haut */
    body.v-bureau{overflow-x:clip}
    body.v-bureau .reprise-ligne{
        grid-column:1/-1;grid-row:1;
        width:100vw;margin:-28px 0 28px calc(50% - 50vw);
        background:var(--ac);color:var(--sur-ac);
        display:flex;align-items:center;gap:20px;
        padding:12px max(32px,calc(50vw - 548px))
    }
    body.v-bureau .reprise-ligne .reprise{flex:1;margin:0;padding:0;background:transparent;border-radius:0}
    body.v-bureau .reprise-ligne .reprise em{display:inline-flex;align-items:center;gap:10px}
    body.v-bureau .reprise .r-fl{display:none}
    body.v-bureau .reprise .r-play{
        display:inline-block;position:relative;flex:none;width:24px;height:24px;
        border:1.5px solid var(--sur-ac);border-radius:50%
    }
    body.v-bureau .reprise .r-play::after{
        content:"";position:absolute;left:8.5px;top:5.5px;
        border-left:8px solid var(--sur-ac);border-top:5px solid transparent;border-bottom:5px solid transparent
    }
    body.v-bureau .reprise-ligne .reprise-x{position:static;flex:none;width:30px;height:30px;font-size:20px;background:transparent;color:var(--sur-ac);border:1.5px solid color-mix(in srgb,var(--sur-ac) 55%,transparent)}
    body.v-bureau .ecran>.msg{grid-column:1/-1;grid-row:2}

    /* En-tête : logo à gauche, liens à droite */
    body.v-bureau .entete.centre{grid-column:1/-1;grid-row:3;justify-content:space-between;margin-bottom:56px}
    body.v-bureau .mot img{height:40px}
    .bureau-nav{display:flex;align-items:center;gap:28px;margin-right:56px}
    .bureau-nav a,.bureau-nav button{font:inherit;font-size:15px;font-weight:500;color:var(--texte);background:none;border:0;padding:6px 0;cursor:pointer;text-decoration:none}
    .bureau-nav a:hover,.bureau-nav button:hover{text-decoration:underline;text-underline-offset:4px}

    /* Colonne gauche : accroche + actions */
    body.v-bureau h1.centre{grid-column:1;grid-row:4;text-align:left;font-size:clamp(40px,4.3vw,58px);line-height:1.08;font-weight:500;letter-spacing:-.03em;align-self:end}
    body.v-bureau .kicker.centre.sous{grid-column:1;grid-row:5;text-align:left;font-size:14px;margin:18px 0 0;white-space:normal;letter-spacing:.04em}
    body.v-bureau .rejoindre-haut{display:none}
    body.v-bureau .bas{grid-column:1;grid-row:6;max-width:480px;padding-top:32px;
        display:grid;grid-template-columns:1fr 1fr;column-gap:12px;align-content:start}
    body.v-bureau .bas .ou{display:none}
    body.v-bureau .bas>.mention,body.v-bureau .bas>.consent,body.v-bureau .bas>.detail,body.v-bureau .bas>.msg,body.v-bureau .bas>.bas-liens{grid-column:1/-1}
    body.v-bureau .bas>.mention{text-align:left;margin:18px 0 6px}
    body.v-bureau .bas>.consent{margin:10px 0 4px}
    body.v-bureau .bas>.detail{margin-left:36px}
    /* Bas de colonne : seul « Inviter un ami » reste (règles et compte sont dans le menu du haut) */
    body.v-bureau .bas .bas-liens{display:flex;justify-content:flex-start;margin-top:18px}
    body.v-bureau .bas .bas-liens>a.btn-regles,body.v-bureau .bas .bas-liens #btnRegles{display:none}
    body.v-bureau .bas .btn{padding:18px 12px}
    .bureau-rejoindre{display:block}

    /* Colonne droite : le polaroïd */
    body.v-bureau .photos{grid-column:2;grid-row:4 / span 3;align-self:center;
        width:100%;max-width:480px;max-height:none;min-height:0;margin:0 auto}

    /* Panneaux : fenêtre centrée au lieu d'un volet en bas */
    body.v-bureau .panneau{
        left:50%;right:auto;bottom:auto;top:50%;width:520px;max-width:calc(100vw - 48px);
        border-radius:28px;padding:30px 32px 32px;max-height:88vh;
        transform:translate(-50%,-46%);opacity:0;
        transition:transform .25s cubic-bezier(.2,.8,.2,1),opacity .2s,visibility 0s .25s
    }
    body.v-bureau .panneau.o{transform:translate(-50%,-50%);opacity:1;transition:transform .25s cubic-bezier(.2,.8,.2,1),opacity .2s}
    body.v-bureau .poignee{display:none}
    body.v-bureau .fermer{top:20px;right:20px}

    /* Sections sous l'écran d'accueil */
    .bureau-sections{max-width:1160px;margin:0 auto;padding:24px 32px 72px}
    .bureau-sections h2{font-family:"Lexend",sans-serif;font-size:28px;font-weight:500;letter-spacing:-.02em;margin:0 0 24px}
    .b-etapes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-bottom:64px}
    .b-etape{background:var(--carte);border-radius:22px;padding:26px 26px 28px}
    .b-etape i{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--ac);color:var(--sur-ac);font-style:normal;font-weight:700;font-size:16px;margin-bottom:18px}
    .b-etape b{display:block;font-size:19px;font-weight:600;letter-spacing:-.01em;margin-bottom:8px}
    .b-etape p{font-size:15.5px;line-height:1.5;color:var(--doux)}
    .b-etape em{font-style:normal;color:var(--texte)}

    .b-packs{display:flex;flex-wrap:wrap;gap:40px;align-items:center;justify-content:space-between;margin-bottom:36px}
    .b-packs-txt{flex:1 1 320px}
    .b-packs-txt p{font-size:16px;line-height:1.5;color:var(--doux);max-width:440px}
    .b-offres{display:flex;gap:16px;flex:1 1 440px}
    .b-offre{flex:1;background:var(--carte);border:2px solid var(--bord);border-radius:22px;padding:22px 24px;display:flex;flex-direction:column;gap:4px}
    .b-offre span{font-size:14.5px;color:var(--doux)}
    .b-offre b{font-size:34px;font-weight:700;letter-spacing:-.03em}
    .b-offre small{font-size:13.5px;color:var(--doux)}
    .b-actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
    .b-actions .btn{width:auto;display:inline-block;padding:15px 28px;font-size:16px}
    .b-actions .lien-video{margin:0}
    .b-confiance{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:40px;padding-top:26px;border-top:1px solid var(--bord);font-size:14px;font-weight:500;color:var(--doux)}
    .b-confiance span::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--texte);margin-right:10px;vertical-align:middle}
}

/* Écrans très larges : un peu plus d'air */
@media(min-width:1500px){
    body.v-bureau .ecran{max-width:1280px;column-gap:110px}
    body.v-bureau .reprise-ligne{padding-left:max(32px,calc(50vw - 608px));padding-right:max(32px,calc(50vw - 608px))}
    .bureau-sections{max-width:1280px}
}