/* Phillias 32 — V9 (03/10/2026) : par-dessus v7.css + v8.css.
   Mobile d'abord : rails horizontaux, galerie repliée, sections resserrées, barre de contact. */

/* ── La preuve en vrai, sous le simulateur ── */
.vrai{margin-top:clamp(32px,5vh,56px)}
.vrai .oeil{color:var(--jaune-txt);margin-bottom:var(--e4)}
.vrai__rail{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:clamp(12px,1.4vw,20px)}
.vrai__fig{margin:0;position:relative;border-radius:16px;overflow:hidden;background:var(--noir-2);
  box-shadow:inset 0 0 0 1px var(--filet)}
.vrai__fig video,.vrai__fig img{display:block;width:100%;height:100%;aspect-ratio:16/9;object-fit:cover}
.vrai__fig figcaption{position:absolute;left:0;right:0;bottom:0;padding:28px 14px 12px;
  font:600 .9375rem/1.25 var(--texte);color:var(--blanc);
  background:linear-gradient(transparent,rgb(5 3 4/.82))}
.vrai__lien{display:inline-block;margin-top:var(--e4);font:600 1rem/1.4 var(--texte);color:var(--jaune-txt);
  text-decoration:none;border-bottom:1px solid color-mix(in oklch,var(--jaune) 50%,transparent)}

/* ── Galerie repliée : 8 photos, puis « Voir toutes les photos » ── */
.vignette.est-replie{display:none}
.galerie__plus{text-align:center;margin-top:var(--e5)}

/* ── Barre de contact (téléphone seulement) ── */
.barre{display:none}

@media (max-width:760px){
  :root{--section-y:clamp(56px,8vh,84px)}
  .sec--souffle{padding-block:var(--section-y)}
  .sec__tete{margin-bottom:var(--e5)}

  /* Rails : on fait défiler du doigt, la page ne déborde jamais */
  [data-rail]{display:grid!important;grid-auto-flow:column;grid-template-columns:none!important;
    grid-auto-columns:78%;gap:12px!important;overflow-x:auto;overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;scrollbar-width:none;
    margin-inline:calc(-1 * var(--pad));padding-inline:var(--pad);scroll-padding-inline:var(--pad);
    padding-bottom:6px}
  [data-rail]::-webkit-scrollbar{display:none}
  [data-rail]>*{scroll-snap-align:start;min-width:0}
  .grille--parc[data-rail]{grid-auto-columns:56%}
  .vrai__rail[data-rail]{grid-auto-columns:84%}
  .vrai__fig figcaption{font-size:.875rem}

  /* Galerie : deux colonnes serrées */
  .galerie{columns:2;column-gap:8px}
  .vignette{margin-bottom:8px}

  /* Barre de contact collée en bas */
  .barre{display:grid;grid-template-columns:1fr 1.6fr;gap:8px;position:fixed;z-index:60;left:0;right:0;bottom:0;
    padding:10px 12px calc(10px + env(safe-area-inset-bottom));
    background:rgb(11 7 8/.92);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
    box-shadow:0 -1px 0 var(--filet);transition:transform .28s ease}
  .barre.est-cachee{transform:translateY(110%)}
  .barre a{display:flex;align-items:center;justify-content:center;min-height:48px;border-radius:999px;
    font:600 1rem/1 var(--texte);text-decoration:none}
  .barre__tel{color:var(--blanc);box-shadow:inset 0 0 0 1px var(--filet)}
  .barre__resa{background:var(--magenta);color:var(--encre)}
  body{padding-bottom:76px}
}

@media (prefers-reduced-motion:reduce){.barre{transition:none}}

/* Réservation, étape 1 : les huit types en deux colonnes au téléphone */
@media (max-width:760px){
  .resa__cartes{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .resa__cartes .carte{min-height:0;padding:12px}
  .resa__cartes .carte b{font-size:1rem}
  .resa__cartes .carte span{font-size:.8125rem;line-height:1.25}
}

/* Fin de réservation : le titre de remerciement héritait du noir de la section */
[data-fini] h3{color:var(--blanc)}

/* ── Roue V10 (03/10) : une platine sobre — parts sombres, la part active allumée, graduations ── */
.roue8__svg{filter:drop-shadow(0 0 26px color-mix(in srgb,var(--roue-c) 16%,transparent))}
.roue8__secteur{fill:#1B1519;transition:fill .28s ease}
.roue8__part:not(.est-actif) .roue8__secteur{opacity:1}
.roue8__part:hover .roue8__secteur{fill:#251C27}
.roue8__part.est-actif .roue8__secteur{fill:var(--c)}
.roue8__filet{fill:none;stroke:var(--c);stroke-width:3;stroke-linecap:round;opacity:.8}
.roue8__part.est-actif .roue8__filet{opacity:0}
.roue8__txt{fill:#CFC4D2;font-family:var(--texte);font-weight:600;letter-spacing:.12em;text-anchor:middle;pointer-events:none}
.roue8__ico{fill:none;stroke:#CFC4D2;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.roue8__part.est-actif .roue8__txt{fill:#FFFFFF}
.roue8__part.est-actif .roue8__ico{stroke:#FFFFFF}
.roue8__part.est-actif .roue8__lab--sombre .roue8__txt{fill:#0B0708}
.roue8__part.est-actif .roue8__lab--sombre .roue8__ico{stroke:#0B0708}
.roue8__grad{stroke:#3A3140;stroke-width:1.2}
.roue8__grad--long{stroke:#6E6274;stroke-width:1.8}
.roue8__moyeu{inset:31.6%;background:#0B0708;box-shadow:0 0 0 1.5px #2B2430,0 0 0 8px #120D10}
.roue8__moyeu .logo{width:80%}
.roue8__repere{top:-6px;border-left-width:11px;border-right-width:11px;border-top:20px solid var(--roue-c);filter:none}
@media (max-width:959px){
  .roue8__col{display:contents}
  .roue8__zone{order:1}
  .roue8__fiche{order:2;margin-top:0}
  .roue8__roue{width:min(400px,80vw)}
}

/* ── Héros V10 : la vraie photo de l'écran, le canevas LED posé dessus ── */
.mur--photo .mur__tete{text-align:left}
.actu-ruban{display:inline-flex;align-items:center;gap:10px;margin:0 0 clamp(16px,2.4vh,26px);padding:6px 14px 6px 6px;border-radius:999px;
  background:rgb(255 197 61/.1);box-shadow:inset 0 0 0 1px rgb(255 197 61/.45);color:var(--blanc);text-decoration:none;
  font:600 .9375rem/1.25 var(--texte);max-width:100%}
.actu-ruban b{flex:none;padding:5px 10px;border-radius:999px;background:var(--jaune);color:var(--encre);
  font-size:.75rem;letter-spacing:.12em;text-transform:uppercase}
.actu-ruban span{min-width:0}
.actu-ruban i{font-style:normal;color:var(--jaune)}
.actu-ruban:hover{background:rgb(255 197 61/.18)}
.photo{margin:clamp(18px,3vh,32px) auto 0;max-width:1200px;padding:0 var(--pad)}
.photo__cadre{position:relative;border-radius:18px;overflow:hidden;background:#000;aspect-ratio:1600/855;
  box-shadow:0 30px 80px rgb(0 0 0/.55),inset 0 0 0 1px var(--filet)}
.photo__fond{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.72) saturate(.9)}
.photo__lueur{position:absolute;left:8%;right:8%;top:10%;bottom:-10%;pointer-events:none;mix-blend-mode:screen;opacity:.55;
  background:radial-gradient(60% 55% at 50% 42%,var(--lueur,#FFC53D),transparent 70%);transition:background .6s}
.photo__ecran{position:absolute!important;bottom:auto!important;left:15.89%!important;top:19.74%!important;width:68.63%!important;height:42.56%!important;
  clip-path:polygon(0 0,100% 0,98.6% 96.4%,1% 100%)}
.photo__ecran .mur__ecran{position:absolute;inset:0;width:100%;height:100%;border-radius:0;box-shadow:none;outline:0;background:#050304}
.photo__ecran .mur__toile{display:block;width:100%;height:100%}
.mur--photo .mur__leg{max-width:1200px;margin:10px auto 0;color:var(--gris-sourd);font-size:.8125rem;text-align:left;padding:0}
.mur--photo .mur__commandes{margin-top:clamp(14px,2vh,22px)}
.actu{margin-top:clamp(40px,6vh,72px)}
.actu__titre{margin:.2em 0 .25em;font-family:var(--display);font-weight:400;font-size:clamp(1.7rem,3.2vw,2.6rem);line-height:1.05}
.actu__texte{margin:0 0 clamp(16px,2vh,24px);color:#CFC4D2;max-width:60ch}
@media (max-width:760px){
  .photo{padding:0}
  .photo__cadre{border-radius:0;box-shadow:none}
  .mur--photo .mur__leg{padding:0 var(--pad)}
  .actu-ruban{font-size:.8125rem}
}
.actu-ruban{width:fit-content;justify-self:start}
.mur--photo .mur__intro{margin-top:clamp(16px,2.4vh,26px)}
.mur--photo .mur__intro .chapo{margin:0;max-width:62ch}
@media (max-width:760px){
  .mur--photo{padding-top:18px}
  .mur--photo .mur__titre{font-size:clamp(2rem,9.6vw,2.6rem)}
}

/* ── Panier de location (V10) ── */
.objet__img{cursor:pointer}
.objet__ajout{margin-top:10px;width:100%;min-height:44px;border:0;border-radius:999px;cursor:pointer;
  font:600 .9375rem/1 var(--texte);color:var(--encre);background:var(--jaune);transition:background .2s,color .2s}
.objet__ajout:hover{filter:brightness(1.06)}
.objet__ajout[aria-pressed="true"]{background:transparent;color:var(--jaune);box-shadow:inset 0 0 0 1.5px var(--jaune)}
.objet__ajout:disabled{background:transparent;color:var(--gris-sourd);box-shadow:inset 0 0 0 1px var(--filet);cursor:default;font-weight:400;font-size:.8125rem}
.objet.est-choisi{box-shadow:inset 0 0 0 2px var(--jaune);border-radius:var(--r,16px)}
.objet.est-choisi .objet__img::after{content:"✓";position:absolute;top:10px;right:10px;width:30px;height:30px;border-radius:50%;
  display:grid;place-items:center;background:var(--jaune);color:var(--encre);font:700 1rem/1 var(--texte)}
.objet__img{position:relative}
.panier-bouton{position:fixed;z-index:61;right:24px;bottom:24px;display:inline-flex;align-items:center;gap:10px;
  padding:12px 18px 12px 16px;border:0;border-radius:999px;cursor:pointer;background:var(--jaune);color:var(--encre);
  font:600 1rem/1 var(--texte);box-shadow:0 10px 30px rgb(0 0 0/.45)}
.panier-bouton svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.panier-bouton svg circle{fill:currentColor;stroke:none}
.panier-bouton b{min-width:24px;height:24px;padding:0 6px;border-radius:999px;background:var(--encre);color:var(--jaune);
  display:grid;place-items:center;font-size:.875rem}
.panier-bouton[hidden]{display:none}
.panier{width:min(560px,calc(100vw - 24px));max-height:min(86vh,760px);padding:0;border:0;border-radius:20px;
  background:var(--noir-2);color:var(--blanc);box-shadow:0 30px 90px rgb(0 0 0/.6),inset 0 0 0 1px var(--filet)}
.panier::backdrop{background:rgb(5 3 4/.72)}
.panier[open]{display:flex;flex-direction:column}
.panier__tete{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 22px 12px}
.panier__tete h2{margin:0;font:400 1.35rem/1.1 var(--display)}
.panier__x{width:44px;height:44px;border:0;border-radius:50%;background:transparent;color:var(--blanc);font-size:1.8rem;cursor:pointer}
.panier__liste{list-style:none;margin:0;padding:0 22px;overflow:auto;display:grid;gap:10px}
.panier__ligne{display:grid;grid-template-columns:56px 1fr auto;grid-template-areas:"img txt q" "img ret q";gap:2px 12px;align-items:center;
  padding:10px;border-radius:14px;background:var(--noir);box-shadow:inset 0 0 0 1px var(--filet)}
.panier__ligne img{grid-area:img;width:56px;height:56px;object-fit:contain;border-radius:10px;background:#fff1}
.panier__ligne div:first-of-type{grid-area:txt;display:grid;gap:2px;min-width:0}
.panier__ligne b{font-weight:600;font-size:.9375rem;line-height:1.25}
.panier__ligne span{font-size:.8125rem;color:var(--gris)}
.panier__q{grid-area:q;display:flex;align-items:center;gap:4px}
.panier__q button{width:36px;height:36px;border:0;border-radius:50%;background:var(--noir-3);color:var(--blanc);font-size:1.2rem;cursor:pointer}
.panier__q output{min-width:22px;text-align:center;font-weight:600}
.panier__retirer{grid-area:ret;justify-self:start;padding:4px 0;border:0;background:none;color:var(--magenta-txt);font:400 .8125rem var(--texte);cursor:pointer;text-decoration:underline}
.panier__vide{padding:6px 22px 22px;color:var(--gris);margin:0}
.panier__pied{padding:14px 22px 20px;border-top:1px solid var(--filet);margin-top:12px}
.panier__pied[hidden]{display:none}
.panier__total{margin:0;font-size:1rem;color:var(--gris)} .panier__total b{color:var(--jaune);font-size:1.25rem;margin-left:6px}
.panier__plus{margin:.35em 0 0;font-size:.875rem;color:#CFC4D2}
.panier__mention{margin:.5em 0 0;font-size:.8125rem;color:var(--gris-sourd)}
.panier__actions{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 0}
.resa__panier{margin:0 0 18px;padding:14px 16px;border-radius:14px;box-shadow:inset 0 0 0 1.5px var(--jaune);background:rgb(255 197 61/.06)}
.resa__panier[hidden]{display:none}
.resa__panier .resa__q{margin-top:0}
.resa__panier-liste{margin:.2em 0 .8em;color:#E8E0EA}
@media (max-width:760px){
  .panier-bouton{right:12px;bottom:calc(84px + env(safe-area-inset-bottom))}
  .panier{width:100vw;max-width:100vw;max-height:88vh;margin:auto 0 0;border-radius:20px 20px 0 0}
  .panier__liste{padding:0 16px} .panier__tete{padding:18px 16px 10px} .panier__pied{padding:12px 16px calc(16px + env(safe-area-inset-bottom))}
}

/* ── machine indisponible (démo : marquée dans l'espace Philippe) ── */
.objet.est-indispo .objet__img img{filter:grayscale(1);opacity:.5}
.objet.est-indispo .objet__ajout{border-color:var(--filet);background:transparent;color:var(--gris)}
/* ── actualité publiée par Philippe (démo), au-dessus de celle de l'écran ── */
.actu__neuf{padding:0 0 22px;margin:0 0 22px;border-bottom:1px solid var(--filet)}
.visio img{cursor:zoom-out}
