/* =====================================================================================
   Diapos photos de l'accueil : version « 1 · l'atelier », choisie par le client le 14/09.
   Chargé UNIQUEMENT par les 4 accueils (index.html, fr/, en/, es/).
   Sections Fresques, Live painting, Portraits, Paysages : grande photo sans texte,
   petites photos carrées en dessous, flèches rondes claires posées sur la photo.
   La mosaïque graphisme (#graphic) n'est pas concernée.
   Sélecteurs préfixés par l'ID de la section : ils passent devant les règles à ID de l'accueil.
   Mobile d'abord ; ordinateur dans @media (min-width:720px).
   ===================================================================================== */

/* couleur de l'anneau de la petite photo active : celle de chaque section */
body.page-home #murales{--dz-ring:rgba(214,171,60,.9)}
body.page-home #live{--dz-ring:rgba(185,120,91,.9)}
body.page-home #portraits{--dz-ring:rgba(138,106,82,.9)}
body.page-home #landscapes{--dz-ring:rgba(180,138,114,.9)}

/* ---------- la carte photo ---------- */
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .media-card{display:flex!important;flex-direction:column!important;height:auto!important;max-height:none!important;min-height:0!important}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .text-card{height:auto!important}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-A{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;gap:10px}

/* ---------- les images : les règles de l'accueil sur « .media-card img » ne s'appliquent pas ---------- */
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-A img{position:absolute;inset:0;width:100%!important;height:100%!important;max-height:none!important;max-width:none!important;object-fit:cover!important;display:block;margin:0;padding:0;border-radius:0}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-A .is-oeuvre img{object-fit:contain!important;padding:12px!important;box-sizing:border-box}

/* ---------- la grande photo ---------- */
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-stage{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;flex:1 1 auto;min-height:0}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-view{position:relative;min-width:0}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-track{position:relative;display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-inline:contain;border-radius:22px}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-track::-webkit-scrollbar{display:none}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-slide{flex:0 0 100%;min-width:0;margin:0;display:flex;flex-direction:column;scroll-snap-align:start;scroll-snap-stop:always}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-frame{position:relative;flex:none;aspect-ratio:4/5;border-radius:22px;overflow:hidden;background:#efe5d8;box-shadow:0 18px 40px -22px rgba(60,40,24,.45)}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-slide.is-oeuvre .dz-a-frame{background:#fffdfa;box-shadow:inset 0 0 0 1px rgba(200,159,99,.22)}

/* ---------- les flèches : cercles clairs posés sur la photo ---------- */
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-view .dz-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:2;display:inline-grid;place-items:center;width:42px;height:42px;padding:0 0 3px;border-radius:50%;border:0;background:rgba(255,252,246,.86);color:#3a2e25;font-size:24px;box-shadow:0 6px 18px rgba(40,28,18,.18);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);cursor:pointer;transition:background .2s ease,transform .2s ease}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-view .dz-arrow:hover{background:#fffaf2}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-view .dz-prev{left:10px}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-view .dz-next{right:10px}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-view .dz-arrow:disabled{opacity:0;pointer-events:none;cursor:default}

/* ---------- les petites photos, en dessous ---------- */
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-thumbs{position:relative;min-height:0}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-thumbs-in{display:flex;justify-content:safe center;gap:10px;overflow-x:auto;overflow-y:visible;scrollbar-width:none;padding:6px 4px 10px}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-thumbs-in::-webkit-scrollbar{display:none}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-thumbs-in{overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-thumb{scroll-snap-align:center}
body.page-home #mainContent .dz-fade-r .dz-a-thumbs-in{-webkit-mask-image:linear-gradient(to right,#000 82%,transparent);mask-image:linear-gradient(to right,#000 82%,transparent)}
body.page-home #mainContent .dz-fade-l .dz-a-thumbs-in{-webkit-mask-image:linear-gradient(to right,transparent,#000 18%);mask-image:linear-gradient(to right,transparent,#000 18%)}
body.page-home #mainContent .dz-fade-l.dz-fade-r .dz-a-thumbs-in{-webkit-mask-image:linear-gradient(to right,transparent,#000 16%,#000 84%,transparent);mask-image:linear-gradient(to right,transparent,#000 16%,#000 84%,transparent)}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-thumb{position:relative;flex:0 0 auto;width:56px;height:56px;min-height:0;padding:0;border:0;border-radius:12px;overflow:hidden;background:#efe5d8;cursor:pointer;opacity:.55;transition:opacity .2s ease,box-shadow .2s ease}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-thumb.is-active{opacity:1;box-shadow:0 0 0 2px #fffaf2,0 0 0 4px var(--dz-ring)}

/* ---------- clavier ---------- */
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) [data-dz-track]:focus-visible,
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-thumb:focus-visible{outline:3px solid var(--dz-ring);outline-offset:3px}

/* téléphone tactile : on fait glisser la photo, les flèches se retirent */
@media (hover:none) and (max-width:719px){
  body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-view .dz-arrow{display:none}
}

/* ---------- ordinateur ---------- */
@media (min-width:720px){
  body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .section-layout{align-items:stretch!important}
  body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .media-card{align-self:stretch!important}
  body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-frame{aspect-ratio:auto;height:min(58vh,520px)}
  body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-thumb{width:64px;height:64px}
}

@media (prefers-reduced-motion:reduce){
  body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-thumb,
  body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dz-a-view .dz-arrow{transition:none}
}

/* réglages par photo (générés par docs/generateur/diapos_accueil.py) */
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-artist-holding-hand-painted-portraits{object-position:70% 12%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-bedroom-two-walls-figures-mural{object-position:50% 50%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-botanical-bedroom-wall-mural{object-position:50% 40%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-couple-portrait-painted-from-photo{object-position:50% 42%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-duomo-milan-restaurant-mural{object-position:45% 55%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-elephants-savannah-sunset-painting{object-position:50% 50%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-facade-mural-brush{object-position:50% 50%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-giulia-painting-portrait-wall-mural{object-position:35% 50%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-lemon-arch-restaurant-mural{object-position:50% 55%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-live-painting-reception-hall{object-position:50% 55%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-live-painting-seafront-musician{object-position:50% 70%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-live-painting-sunset-audience{object-position:50% 50%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-live-portrait-painting-park{object-position:50% 62%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-menton-watercolour-framed{object-position:40% 40%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-piano-painting-show-concert-hall{object-position:50% 50%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-piano-painting-show-dark-stage{object-position:45% 55%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-piano-painting-show-seaside-dusk{object-position:50% 50%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-piano-painting-show-theatre{object-position:50% 45%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-public-garden-tribute-wall-mural{object-position:50% 50%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-seaside-dusk-live-painting{object-position:75% 55%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-starry-night-van-road-painting{object-position:50% 50%}
body.page-home #mainContent :is(#murales,#live,#portraits,#landscapes) .dzp-venice-restaurant-mural{object-position:50% 40%}
/* fin des réglages par photo */

/* bouton « Voir d'autres … dans le portfolio » : même style, une seule ligne sur téléphone (14/09) */
@media (max-width:719px){
  body.page-home #mainContent a.section-portfolio-cta{white-space:nowrap;font-size:clamp(12.5px,3.62vw,15.68px);letter-spacing:-.005em;padding-left:14px;padding-right:14px}
}