.frame{aspect-ratio:var(--w) / var(--h);background:var(--color-borde);margin:0;position:relative;overflow:hidden}.frame__media{transform-origin:var(--focus);position:absolute;inset:0}.frame img{max-width:none;width:calc(var(--W) / var(--w) * 100%);height:auto;transform:translate(calc(var(--x) / var(--W) * -100%), calc(var(--y) / var(--H) * -100%));position:absolute;top:0;left:0}@media (max-width:767.98px){.frame{aspect-ratio:var(--m-w) / var(--m-h)}.frame img{width:calc(var(--W) / var(--m-w) * 100%);transform:translate(calc(var(--m-x) / var(--W) * -100%), calc(var(--m-y) / var(--H) * -100%))}}.mat{--mat-pad:clamp(14px, 3.2vw, 48px);padding:var(--mat-pad);background:var(--color-melocoton)}.mat--dark{background:color-mix(in srgb, var(--color-carbon), var(--color-blanco) 6%)}