@media (max-width: 820px) {

.cs { margin-top: calc(-1 * var(--mob-barra)); padding: calc(var(--mob-barra) + 53px) var(--mob-m) 72px; gap: 0; }
.cs__t { padding: 0; }
.cs__t h1 { font-size: var(--mob-h1); line-height: 1.1; }
.cs__t h1 .mask { white-space: normal; }
.cs__baj { margin: 16px 0 0; font-size: var(--mob-lead); line-height: 1.4; }

.cs .casc { margin-top: 32px; }
.cs .casc__cinta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; align-items: stretch; }
.cs .casc__it, .cs .casc__it:nth-child(even) { display: contents; width: auto; translate: none; }
.cs .casc__it:nth-child(even) .pieza { --i: 1; }

.cs .pieza[data-mob~="tarjeta"] { display: flex; flex-direction: column; min-width: 0; border: 0; border-radius: var(--mob-rc); background: var(--mob-sup); color: var(--mob-fg); }
.cs .pieza[data-mob~="tarjeta"]:focus-visible { outline: 2px solid var(--mob-fg); outline-offset: 2px; }
.cs .pieza .pieza__video[data-mob~="marco"] { flex: none; width: 100%; aspect-ratio: 4 / 5; border-radius: 0; background: var(--mob-sup); }
.cs .pieza .pieza__video--foto img { animation: none; }

.cs .casc__cinta > .casc__it:last-child:nth-child(odd) > .pieza[data-mob~="tarjeta"] { grid-column: 1 / -1; }
.cs .casc__cinta > .casc__it:last-child:nth-child(odd) > .pieza .pieza__video[data-mob~="marco"] { aspect-ratio: 16 / 9; }

.cs .pieza[data-mob~="tarjeta"] > .pieza__panel { flex: 1 1 auto; display: flex; align-items: center; min-height: 0; margin: 0; padding: 12px 8px 12px 12px; background: transparent; }
.cs .pieza__cota, .cs .pieza__lab { display: none; }
.cs .pieza__info { flex: 1 1 auto; display: flex; align-items: center; justify-content: space-between; gap: 4px; width: 100%; min-width: 0; padding: 0; background: transparent; text-align: left; }
.cs .casc__it .pieza__n, .cs .casc__it--sl .pieza__n { position: static; flex: 1 1 auto; min-width: 0; width: auto; height: auto; overflow: visible; clip-path: none; white-space: normal; color: var(--mob-fg); font-size: var(--mob-sec); font-weight: 500; line-height: 1.25; text-wrap: balance; }
.cs .pieza__ver[data-mob~="icono"] { flex: none; }
.cs .pieza__ver[data-mob~="icono"] svg { display: none; }

.cs .cs__r { gap: 24px; margin-top: 48px; padding: 0; }
.cs__txt { font-size: var(--mob-cuerpo); line-height: 1.5; max-width: 34ch; }
.cs__acc { display: block; }
.cs .cs__pausa[data-mob~="oculto"] { display: none; }

main a[href*="givenchy"] [data-mob~="marco"] > video, main a[href*="givenchy"] [data-mob~="marco"] > img { object-position: 50% 30%; }
main a[href*="branca"] [data-mob~="marco"] > video, main a[href*="branca"] [data-mob~="marco"] > img { object-position: 50% 60%; }
}