/* Los Recomendados — smooth @-style R mark. The logo geometry lives in one vector path; no segmented redraws. */
.logo-mark{transform-box:fill-box;transform-origin:center;}
/* Replace the legacy inline geometry with the corrected master SVG through a CSS mask. */
.logo-mark{color:currentColor;background:currentColor;mask:url('/brand/los-recomendados-mark.svg') center/contain no-repeat;-webkit-mask:url('/brand/los-recomendados-mark.svg') center/contain no-repeat;}
.logo-mark path{display:none!important;}
.hero-mark .logo-mark{animation:lr-mark-breathe 10s ease-in-out infinite;}
.brand .logo-mark{transition:transform .5s cubic-bezier(.22,.61,.36,1);}
.brand:hover .logo-mark{transform:scale(1.045);}
.nav--scrolled .brand .logo-mark{animation:lr-condense .55s cubic-bezier(.22,.61,.36,1) both;}
.hero-mark .logo-mark{animation:lr-mark-breathe 10s ease-in-out infinite;}
@keyframes lr-mark-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.012)}}
@keyframes lr-condense{from{transform:scale(1.02)}to{transform:scale(1)}}
/* Editorial R: always the same smooth master geometry. */
.r-editorial{pointer-events:none;position:absolute;overflow:visible;}
.r-editorial .logo-mark{width:100%;height:100%;}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .hero-mark .logo-mark,.brand .logo-mark,.nav--scrolled .brand .logo-mark{animation:none!important;transition:none!important;}
}