diff --git a/css/public.css b/css/public.css index 545246e..d12401a 100644 --- a/css/public.css +++ b/css/public.css @@ -690,18 +690,27 @@ body { display: block; } +/* --- AMÉLIORATION DE L'AFFICHE (EFFET BOÎTIER PHYSIQUE) --- */ .detail-poster.poster-video { - aspect-ratio: 2 / 3; - display: flex; - align-items: center; - justify-content: center; + /* On laisse l'image dicter ses propres proportions */ + aspect-ratio: auto; + background: transparent; + border: none; + box-shadow: none; + display: block; } .detail-poster.poster-video img { width: 100%; - height: 100%; - object-fit: contain; + height: auto; + object-fit: cover; display: block; + border-radius: 4px 6px 6px 4px; /* Bords légèrement arrondis sur la droite */ + /* Simulation de l'épaisseur du boîtier (tranche noire à gauche) et ombres */ + border-left: 7px solid #1a1a1a; + border-top: 1px solid rgba(255, 255, 255, 0.1); + box-shadow: -5px 0 15px rgba(0, 0, 0, 0.6), 5px 10px 25px rgba(0, 0, 0, 0.8); + position: relative; } /* Colonne Contenu */ @@ -961,6 +970,40 @@ footer { align-items: center; } +/* --- DESIGN DU BLOC CASTING & RÉALISATION --- */ +.pub-cast-crew { + background: linear-gradient(90deg, rgba(201, 168, 76, 0.05) 0%, transparent 100%); + border-left: 3px solid var(--gold); + padding: 1rem 1.2rem; + margin-bottom: 1.5rem; + border-radius: 0 8px 8px 0; +} + +.pub-cast-crew p { + margin-bottom: 0.4rem; + font-size: 0.95rem; + line-height: 1.5; +} + +.pub-cast-crew p:last-child { + margin-bottom: 0; +} + +.cast-label { + color: var(--muted); + font-weight: 500; + text-transform: uppercase; + font-size: 0.8rem; + letter-spacing: 0.05em; + display: inline-block; + width: 100px; /* Aligne le texte correctement */ +} + +.cast-value { + color: var(--text); + font-weight: 600; +} + /* ══════════════════════════════════════════════════════════════ RESPONSIVE MOBILE (index.html)