:root {  --ry-campo-foto: #FFFFFF;  --ry-contraste-txt: #F5F1EC;  --ry-sombra: color-mix(in srgb, var(--ry-fondo) 70%, transparent);  --ry-fondo: #FAF7F2; --ry-superficie: #FFFFFF; --ry-superficie-2: #F2EDE4; --ry-texto: #1C3A2E; --ry-texto-2: #6B6259; --ry-linea: #E5DED2; --ry-acento: #AE5623; --ry-acento-hondo: #8E4319; --ry-acento-texto: #FFFFFF; --ry-precio: #AE5623; --ry-fuerte: #1C3A2E; --ry-fuerte-texto: #FAF7F2; --ry-contraste: #1C3A2E;  --ry-bone: var(--ry-fondo); --ry-surface: var(--ry-superficie); --ry-surface-2: var(--ry-superficie-2); --ry-forest: var(--ry-texto); --ry-forest-deep: #10271e; --ry-forest-soft: #315c49; --ry-copper: var(--ry-acento); --ry-copper-deep: var(--ry-acento-hondo); --ry-sand: var(--ry-linea); --ry-muted: var(--ry-texto-2); --ry-white: #FFFFFF; --ry-danger: #9b342c; --ry-success: #2d684f; }   *, *::before, *::after { box-sizing: border-box; } html { margin: 0; padding: 0; scroll-behavior: smooth; scroll-padding-top: 116px; } body { min-width: 320px; margin: 0; background: var(--ry-fondo); color: var(--ry-texto); font-family: var(--ry-sans); font-size: 15px; line-height: 1.5; overflow-x: clip; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; } img, picture { display: block; max-width: 100%; } button, input, select { font: inherit; color: inherit; } button { -webkit-tap-highlight-color: transparent; } a { color: inherit; } :root {  --ry-serif: 'Newsreader', 'Newsreader sustituta', Georgia, 'Times New Roman', serif; --ry-sans: 'Archivo', 'Archivo sustituta', system-ui, -apple-system, sans-serif;  --ry-marca: 'Fredoka', 'Baloo 2', 'Trebuchet MS', system-ui, sans-serif; --ry-mono: 'JetBrains Mono', 'Mono sustituta', ui-monospace, SFMono-Regular, monospace; --ry-r-superficie: 14px; --ry-r-pastilla: 999px; --ry-aire: 48px; --ry-margen: 18px; --ry-max: 1280px; } .ry-simbolos { position: absolute; inline-size: 0; block-size: 0; overflow: hidden; } .ry-contenedor { width: min(100%, var(--ry-max)); margin-inline: auto; padding-inline: var(--ry-margen); } .ry-seccion { padding-block: var(--ry-aire); scroll-margin-top: 116px; } .ry-titulo { max-width: 15ch; margin: 0; font-family: var(--ry-serif); font-size: clamp(2.5rem, 10.5vw, 4rem); font-weight: 500; letter-spacing: -.035em; line-height: .96; text-wrap: balance; } .ry-titulo em { color: var(--ry-acento); font-style: italic; font-weight: 500; }  .ry-kicker { margin: 0 0 12px; color: color-mix(in srgb, var(--ry-acento) 86%, var(--ry-texto)); font-family: var(--ry-mono); font-size: 10px; font-weight: 700; letter-spacing: .14em; line-height: 1.3; text-transform: uppercase; } .ry-mono { font-family: var(--ry-mono); font-variant-numeric: tabular-nums; } .ry-btn { min-height: 48px; padding: 0 20px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; border: 1px solid var(--ry-linea); border-radius: 9px; background: transparent; color: var(--ry-texto); font-size: 14px; font-weight: 600; text-decoration: none; cursor: pointer; transition: color 220ms ease, background-color 220ms ease, border-color 220ms ease, transform 220ms ease; } .ry-btn .ry-i { width: 18px; height: 18px; } .ry-btn:hover { border-color: var(--ry-texto); } .ry-btn:active { transform: translateY(1px) scale(.99); } .ry-btn--fuerte { border-color: var(--ry-fuerte); background: var(--ry-fuerte); color: var(--ry-fuerte-texto); } .ry-btn--fuerte:hover { background: color-mix(in srgb, var(--ry-fuerte) 88%, #000); } .ry-btn--acento { border-color: var(--ry-acento); background: var(--ry-acento); color: var(--ry-acento-texto); } .ry-btn--acento:hover { border-color: var(--ry-acento-hondo); background: var(--ry-acento-hondo); } .ry-riel { display: flex; gap: 12px; overflow-x: auto; overscroll-behavior-inline: contain; padding: 4px max(var(--ry-margen), calc((100vw - var(--ry-max)) / 2 + var(--ry-margen))) 10px; scroll-padding-inline: max(var(--ry-margen), calc((100vw - var(--ry-max)) / 2 + var(--ry-margen)));  scroll-snap-type: x proximity; overflow-anchor: none; scrollbar-width: none; -webkit-overflow-scrolling: touch; } .ry-riel::-webkit-scrollbar { display: none; } .ry-riel > * { flex: 0 0 auto; scroll-snap-align: start; } .visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; } .ry-salto { position: fixed; top: 8px; left: 8px; z-index: 1000; min-height: 44px; padding: 10px 14px; display: flex; align-items: center; background: var(--ry-texto); color: var(--ry-fondo); font-weight: 600; text-decoration: none; transform: translateY(-160%); transition: transform 180ms ease; } .ry-salto:focus { transform: translateY(0); } :where(a, button, input, select):focus-visible { outline: 2px solid var(--ry-acento); outline-offset: 3px; } .ry-estado { position: fixed; left: 50%; bottom: calc(80px + env(safe-area-inset-bottom)); z-index: 420; max-width: calc(100vw - 36px); padding: 11px 15px; border: 1px solid color-mix(in srgb, var(--ry-contraste-txt) 18%, transparent); border-radius: 8px; background: var(--ry-contraste); color: var(--ry-contraste-txt); box-shadow: 0 10px 30px color-mix(in srgb, var(--ry-contraste) 28%, transparent); font-size: 13px; opacity: 0; pointer-events: none; transform: translate(-50%, 10px); transition: opacity 180ms ease, transform 180ms ease; } .ry-estado[data-visible] { opacity: 1; transform: translate(-50%, 0); } @media (min-width: 768px) { html { scroll-padding-top: 84px; } :root { --ry-margen: 28px; --ry-aire: 64px; } body { font-size: 16px; } .ry-seccion { scroll-margin-top: 84px; } } @media (min-width: 1200px) { :root { --ry-margen: 32px; --ry-aire: 76px; } } @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .001ms !important; } }   .ry-i { width: 1em; height: 1em; display: inline-block; stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; }  .ry-i--macizo { stroke: none; fill: currentColor; }   .ry-avisos {  --ry-avisos-hueco: 34px; min-height: 32px; padding-block: 6px; display: flex; align-items: center; background: var(--ry-contraste); color: var(--ry-contraste-txt); font-size: 10px; letter-spacing: .015em; overflow: clip; } .ry-avisos__ventana { min-width: 0; flex: 1; overflow: hidden;  mask-image: linear-gradient(90deg, transparent 0, #000 4%, #000 96%, transparent 100%); } .ry-avisos__cinta { width: max-content; display: flex; gap: var(--ry-avisos-hueco); will-change: transform; } .ry-avisos__pista { display: flex; align-items: center; gap: var(--ry-avisos-hueco); } .ry-avisos p { margin: 0; white-space: nowrap; } .ry-avisos a { color: #e8a56f; text-decoration: none; font-weight: 700; } .ry-cabezal { position: sticky; top: 0; z-index: 300; border-bottom: 1px solid color-mix(in srgb, var(--ry-linea) 86%, transparent); background: color-mix(in srgb, var(--ry-fondo) 94%, transparent); box-shadow: 0 10px 34px color-mix(in srgb, var(--ry-contraste) 7%, transparent); backdrop-filter: blur(18px) saturate(1.1); } .ry-cabezal__fila { position: relative; width: min(100%, var(--ry-max)); min-height: 105px; margin-inline: auto; padding: 4px var(--ry-margen) 9px; display: grid; grid-template-columns: 44px minmax(0, 1fr) 88px; grid-template-areas: "menu . acciones" "buscador buscador buscador"; align-items: center; row-gap: 4px; } .ry-cabezal__menu, .ry-cabezal__icono, .ry-panel__cerrar, .ry-carrito__cerrar { width: 44px; height: 44px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 50%; background: transparent; color: var(--ry-texto); text-decoration: none; cursor: pointer; } .ry-cabezal__menu { grid-area: menu; justify-self: start; } .ry-cabezal__menu:hover, .ry-cabezal__icono:hover { background: var(--ry-superficie-2); } .ry-cabezal__menu .ry-i, .ry-cabezal__icono .ry-i, .ry-panel__cerrar .ry-i, .ry-carrito__cerrar .ry-i { width: 22px; height: 22px; }  .ry-cabezal__logo { position: absolute; top: 4px; left: 50%; z-index: 1; min-width: 0; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; text-decoration: none; transform: translateX(-50%); transition: opacity 180ms cubic-bezier(.23, 1, .32, 1), transform 260ms cubic-bezier(.23, 1, .32, 1); } .ry-cabezal__logo img { max-width: none; width: auto; height: 32px; object-fit: contain; } .ry-cabezal__nav { display: none; } .ry-cabezal__acciones { grid-area: acciones; z-index: 2; display: flex; align-items: center; justify-self: end; } .ry-cabezal__icono { position: relative; } .ry-cabezal__globo { position: absolute; top: 2px; right: 0; min-width: 18px; height: 18px; padding-inline: 4px; display: grid; place-items: center; border: 2px solid var(--ry-fondo); border-radius: var(--ry-r-pastilla); background: var(--ry-acento); color: var(--ry-acento-texto); font-size: 8px; font-weight: 700; } .ry-cabezal__buscador { --ry-buscador-alto: 44px; position: relative; grid-area: buscador; z-index: 5; width: 100%; max-width: none; margin: 0; } .ry-cabezal__buscador[data-abierto] { width: 100%; } .ry-cabezal[data-busqueda-abierta] .ry-cabezal__logo { opacity: 1; transform: translateX(-50%); pointer-events: auto; } .ry-buscador__campo { position: relative; height: var(--ry-buscador-alto); } .ry-buscador__filtro { position: absolute; overflow: hidden; pointer-events: none; } .ry-buscador__goo { display: none; } .ry-cabezal__buscador[data-sin-goo] .ry-buscador__goo { filter: none; } .ry-buscador__superficie, .ry-buscador__burbuja { position: absolute; top: 0; height: var(--ry-buscador-alto); display: block; border-radius: calc(var(--ry-buscador-alto) / 2); background: var(--ry-superficie); box-shadow: inset 0 0 0 1px var(--ry-linea); } .ry-buscador__superficie { right: 18px; width: calc(100% - 18px); opacity: 0; transform: scaleX(.08); transform-origin: right center; transition: opacity 120ms ease 140ms, transform 680ms cubic-bezier(.16, 1, .3, 1); } .ry-buscador__burbuja { right: 0; width: var(--ry-buscador-alto); opacity: 0; transform: scale(.7); transition: opacity 180ms ease 100ms, transform 560ms cubic-bezier(.16, 1, .3, 1); } .ry-cabezal__buscador[data-abierto] .ry-buscador__superficie, .ry-cabezal__buscador[data-abierto] .ry-buscador__burbuja { opacity: 1; transform: scale(1); } .ry-cabezal__buscador input { position: relative; z-index: 1; width: 100%; height: var(--ry-buscador-alto); padding: 0 42px 0 15px; border: 1px solid var(--ry-linea); border-radius: 10px; background: var(--ry-superficie); color: var(--ry-texto); font-size: 14px; appearance: none; clip-path: inset(0 0 0 0 round 22px); transform-origin: right center; transition: border-color 180ms cubic-bezier(.23, 1, .32, 1), box-shadow 180ms cubic-bezier(.23, 1, .32, 1), clip-path 240ms cubic-bezier(.23, 1, .32, 1), opacity 160ms cubic-bezier(.23, 1, .32, 1), transform 250ms cubic-bezier(.23, 1, .32, 1); } .ry-cabezal__buscador[data-mejorado]:not([data-abierto]) input { clip-path: inset(0 0 0 0 round 10px); opacity: 1; pointer-events: auto; transform: none; } .ry-cabezal__buscador[data-mejorado][data-abierto] input { clip-path: inset(0 0 0 0 round 10px); opacity: 1; transform: none; } .ry-buscador__disparador { position: absolute; top: 0; right: 0; z-index: 2; width: 44px; height: 44px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 50%; background: transparent; color: var(--ry-texto); box-shadow: none; cursor: pointer; transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, transform 140ms cubic-bezier(.23, 1, .32, 1); } .ry-buscador__disparador .ry-i { width: 18px; height: 18px; transition: opacity 150ms cubic-bezier(.23, 1, .32, 1), filter 180ms cubic-bezier(.23, 1, .32, 1), transform 180ms cubic-bezier(.23, 1, .32, 1); } .ry-buscador__texto { display: none; } @media (hover: hover) and (pointer: fine) { .ry-buscador__disparador:hover { background: color-mix(in srgb, var(--ry-acento) 10%, var(--ry-superficie)); color: var(--ry-acento); } } .ry-buscador__disparador:active { transform: scale(.96); } .ry-buscador__disparador:focus-visible { outline: 2px solid color-mix(in srgb, var(--ry-acento) 72%, transparent); outline-offset: 2px; } .ry-buscador__cargando { position: absolute; top: 14px; right: 14px; z-index: 3; width: 16px; height: 16px; border: 2px solid color-mix(in srgb, var(--ry-acento) 28%, transparent); border-top-color: var(--ry-acento); border-radius: 50%; opacity: 0; pointer-events: none; transform: scale(.88); transition: opacity 130ms cubic-bezier(.23, 1, .32, 1), transform 160ms cubic-bezier(.23, 1, .32, 1); } .ry-cabezal__buscador[data-cargando] .ry-buscador__disparador .ry-i { opacity: 0; filter: blur(2px); transform: scale(.84); } .ry-cabezal__buscador[data-cargando] .ry-buscador__cargando { opacity: 1; transform: scale(1); } .ry-cabezal__buscador input::placeholder { color: var(--ry-texto-2); } .ry-cabezal__buscador input::-webkit-search-cancel-button { appearance: none; } .ry-cabezal__buscador input:focus-visible { outline: 0; border-color: color-mix(in srgb, var(--ry-acento) 55%, var(--ry-linea)); box-shadow: 0 0 0 4px color-mix(in srgb, var(--ry-acento) 8%, transparent); } .ry-buscador__resultados { position: absolute; top: calc(100% + 7px); right: 0; left: 0; max-height: min(390px, 58dvh); overflow-y: auto; border: 1px solid var(--ry-linea); border-radius: 12px; background: var(--ry-superficie); box-shadow: 0 22px 58px color-mix(in srgb, var(--ry-contraste) 18%, transparent); opacity: 0; transform: translateY(-6px) scale(.985); transform-origin: top right; transition: opacity 150ms cubic-bezier(.23, 1, .32, 1), transform 180ms cubic-bezier(.23, 1, .32, 1); } .ry-buscador__resultados[hidden] { display: none; } .ry-buscador__resultados[data-visible] { opacity: 1; transform: translateY(0) scale(1); } .ry-buscador__resultado { min-height: 62px; padding: 9px 12px; display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 10px; border-bottom: 1px solid var(--ry-linea); color: var(--ry-texto); text-decoration: none; opacity: 1; transform: translateY(0) scale(1); transition: background-color 160ms ease, opacity 190ms cubic-bezier(.23, 1, .32, 1), transform 210ms cubic-bezier(.23, 1, .32, 1); } .ry-buscador__resultado[data-entrando] { opacity: 0; transform: translateY(-7px) scale(.975); } .ry-buscador__resultado:last-child { border-bottom: 0; } @media (hover: hover) and (pointer: fine) { .ry-buscador__resultado:hover { background: var(--ry-superficie-2); } } .ry-buscador__resultado:focus-visible { position: relative; z-index: 1; outline: 2px solid color-mix(in srgb, var(--ry-acento) 58%, transparent); outline-offset: -2px; } .ry-buscador__resultado img { width: 44px; height: 44px; object-fit: contain; mix-blend-mode: multiply; } .ry-buscador__resultado span { min-width: 0; } .ry-buscador__resultado strong, .ry-buscador__resultado small { display: block; } .ry-buscador__resultado strong { overflow: hidden; font-size: 12px; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; } .ry-buscador__resultado small { margin-top: 2px; color: var(--ry-texto-2); font-size: 10px; } .ry-buscador__resultado b { color: var(--ry-acento); font-family: var(--ry-mono); font-size: 12px; } .ry-buscador__vacio { margin: 0; padding: 18px; color: var(--ry-texto-2); font-size: 13px; opacity: 1; transform: translateY(0); transition: opacity 180ms cubic-bezier(.23, 1, .32, 1), transform 200ms cubic-bezier(.23, 1, .32, 1); } .ry-buscador__vacio[data-entrando] { opacity: 0; transform: translateY(-6px); }  .ry-drawer { position: fixed; top: 0; bottom: 0; width: min(92vw, 440px); max-width: none; height: 100dvh; max-height: none; margin: 0; padding: 0; overflow: hidden; border: 0; box-shadow: 0 0 70px rgba(3, 15, 10, .2); } .ry-drawer--izquierda { right: auto; left: 0; } .ry-drawer--derecha { right: 0; left: auto; } .ry-drawer::backdrop { background: rgba(3, 14, 10, .6); backdrop-filter: blur(3px); } .ry-panel { flex-direction: column; background: #071b15; color: #f7eee1; } .ry-panel[open], .ry-carrito[open] { display: flex; } .ry-panel__cabecera, .ry-carrito__cabecera { min-height: 72px; padding: 0 18px; display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; } .ry-panel__cabecera { border-bottom: 1px solid rgba(231, 171, 108, .2); } .ry-panel__marca { display: inline-flex; align-items: center; } .ry-panel__marca img { width: auto; height: 38px; } .ry-panel__cerrar { color: #f7eee1; } .ry-panel__cerrar:hover { background: rgba(255, 255, 255, .08); }  .ry-panel__cuerpo { padding: 14px 18px 24px; flex: 1 1 auto; overflow-y: auto; overscroll-behavior: contain; } .ry-panel__mundo { border-bottom: 1px solid rgba(247, 238, 225, .13); } .ry-panel__mundo summary { min-height: 72px; padding-block: 11px; display: flex; align-items: center; gap: 13px; cursor: pointer; list-style: none; } .ry-panel__mundo summary::-webkit-details-marker { display: none; } .ry-panel__mundo summary:focus-visible { outline: 2px solid #efa164; outline-offset: 3px; } .ry-panel__mundo-foto { width: 52px; height: 52px; flex: 0 0 auto; border: 1px solid rgba(231, 171, 108, .45); border-radius: 50%; background-position: center 34%; background-size: cover; } .ry-panel__mundo--perro .ry-panel__mundo-foto { background-image: url("/wp-content/themes/racionya/assets/images/menu/perro-cachorro.webp"); } .ry-panel__mundo--gato .ry-panel__mundo-foto { background-image: url("/wp-content/themes/racionya/assets/images/menu/gato-gatito.webp"); } .ry-panel__mundo--salud .ry-panel__mundo-foto { background-image: url("/wp-content/themes/racionya/assets/images/menu/perro-medicado.webp"); } .ry-panel__mundo summary > span:nth-child(2) { flex: 1 1 auto; } .ry-panel__mundo small, .ry-panel__mundo strong { display: block; } .ry-panel__mundo small { color: rgba(255, 248, 239, .66); font-size: 10px; } .ry-panel__mundo strong { font-family: var(--ry-serif); font-size: 23px; font-weight: 500; line-height: 1.1; } .ry-panel__mundo-chevron { width: 18px; height: 18px; flex: 0 0 auto; color: #efa164; transform: rotate(90deg); transition: transform 220ms cubic-bezier(.22, .72, .25, 1); } .ry-panel__mundo[open] .ry-panel__mundo-chevron { transform: rotate(-90deg); } .ry-panel__mundo-contenido { padding-bottom: 21px; } .ry-panel__mundo[open] .ry-panel__mundo-contenido { animation: ry-panel-contenido-entra 190ms cubic-bezier(.23, 1, .32, 1) both; } .ry-panel__grupo-categorias + .ry-panel__grupo-categorias { margin-top: 16px; } .ry-panel__grupo-categorias > h3 { margin: 0 0 9px; color: #efa164; font-family: var(--ry-mono); font-size: 9px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; } .ry-categorias--panel { margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .ry-categorias--panel .ry-categoria { min-width: 0; padding: 8px 8px 10px; display: flex; flex-direction: column; gap: 8px; border-color: rgba(247, 238, 225, .14); border-style: solid; border-width: 1px; border-radius: 10px; background: rgba(255, 255, 255, .045); color: #f7eee1; text-decoration: none; } .ry-categorias--panel .ry-categoria:hover { border-color: rgba(239, 161, 100, .58); background: rgba(255, 255, 255, .08); } .ry-categorias--panel .ry-categoria__campo { aspect-ratio: 1.14 / 1; display: grid; place-items: center; overflow: hidden; border-radius: 7px; background: #0b281e; } .ry-categorias--panel .ry-categoria__campo img { width: 100%; height: 100%; padding: 0; object-fit: cover; mix-blend-mode: normal; } .ry-categorias--panel .ry-categoria__nombre { min-height: 30px; display: flex; align-items: center; font-size: 11px; line-height: 1.2; } @keyframes ry-panel-contenido-entra { from { opacity: 0; transform: translateY(-5px); } to { opacity: 1; transform: translateY(0); } } .ry-categorias--panel-salud { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ry-categorias--panel-salud .ry-categoria__nombre { min-height: 26px; font-size: 9px; } .ry-panel__mundo-banner { position: relative; height: 128px; display: block; overflow: hidden; border: 1px solid rgba(231, 171, 108, .26); border-radius: 12px; color: #f7eee1; text-decoration: none; } .ry-panel__mundo-banner img { width: 100%; height: 100%; object-fit: cover; object-position: center 52%; transition: transform 360ms cubic-bezier(.2, .8, .2, 1); } .ry-panel__mundo-banner span { position: absolute; inset: auto 0 0; min-height: 48px; padding: 16px 14px 10px; display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; background: linear-gradient(to top, rgba(2, 16, 11, .95), rgba(2, 16, 11, 0)); font-size: 12px; font-weight: 600; } .ry-panel__mundo-banner .ry-i { width: 15px; height: 15px; color: #efa164; } .ry-panel__mundo-banner:hover img { transform: scale(1.035); } .ry-panel__mundo-banner:focus-visible { outline: 2px solid #efa164; outline-offset: 3px; } .ry-panel__grupos { margin-top: 10px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .ry-panel__grupos section { min-width: 0; padding: 12px; border: 1px solid rgba(247, 238, 225, .12); border-radius: 10px; background: rgba(255, 255, 255, .045); } .ry-panel__grupos h3 { margin: 0 0 7px; color: #efa164; font-family: var(--ry-mono); font-size: 8px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; } .ry-panel__grupos a { min-height: 32px; padding-block: 6px; display: flex; align-items: center; border-bottom: 1px solid rgba(247, 238, 225, .09); color: #f7eee1; font-size: 11px; font-weight: 500; line-height: 1.2; text-decoration: none; } .ry-panel__grupos a:last-child { border-bottom: 0; } .ry-panel__grupos a:hover { color: #efa164; } .ry-panel__grupos a:focus-visible { outline: 2px solid #efa164; outline-offset: 2px; } .ry-panel__aviso-salud { margin: 9px 0 0; color: rgba(247, 238, 225, .58); font-size: 9px; line-height: 1.45; } .ry-panel__secundario { margin-top: 20px; } .ry-panel__secundario a, .ry-panel__secundario button { width: 100%; min-height: 50px; padding: 0; display: flex; align-items: center; gap: 12px; border: 0; border-bottom: 1px solid rgba(247, 238, 225, .12); background: transparent; color: #f7eee1; font-family: inherit; font-size: 15px; font-weight: 500; text-align: left; text-decoration: none; cursor: pointer; } .ry-panel__secundario a:hover, .ry-panel__secundario button:hover { color: #efa164; } .ry-panel__secundario a:focus-visible, .ry-panel__secundario button:focus-visible { outline: 2px solid #efa164; outline-offset: 2px; } .ry-panel__secundario .ry-i { width: 18px; height: 18px; flex: 0 0 auto; color: #e89a58; } .ry-panel__pie { margin-top: auto; padding: 18px; display: grid; gap: 8px; color: rgba(247, 238, 225, .7); font-size: 12px; } .ry-panel__pie button { min-height: 44px; padding: 0; border: 0; background: transparent; color: #efa164; font-weight: 600; text-align: left; text-decoration: none; cursor: pointer; } .ry-panel__pie small { font-size: 10px; }  .ry-carrito { flex-direction: column; background: var(--ry-fondo); color: var(--ry-texto); } .ry-carrito__cabecera { padding-inline: 18px; border-bottom: 1px solid var(--ry-linea); } .ry-carrito__cabecera p { margin: 0 0 2px; color: var(--ry-acento); font-size: 8px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; } .ry-carrito__cabecera h2 { margin: 0; font-family: var(--ry-serif); font-size: 28px; font-weight: 500; letter-spacing: -.025em; } .ry-carrito__cabecera h2 span { color: var(--ry-texto-2); font-family: var(--ry-mono); font-size: 12px; } .ry-carrito__cerrar:hover { background: var(--ry-superficie-2); }  .ry-carrito__envio { min-height: 62px; margin: 14px 18px 4px; padding: 11px 13px 12px; display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 4px 10px; border-radius: 10px; background: color-mix(in srgb, var(--ry-fuerte) 8%, var(--ry-superficie)); } .ry-carrito__envio > .ry-i { width: 23px; height: 23px; color: var(--ry-acento); } .ry-carrito__envio strong, .ry-carrito__envio small { display: block; } .ry-carrito__envio strong { font-size: 12px; } .ry-carrito__envio small { margin-top: 1px; color: var(--ry-texto-2); font-size: 10px; } .ry-carrito__envio-barra { grid-column: 1 / -1; margin-top: 7px; block-size: 6px; display: block; overflow: hidden; border-radius: 999px;  background: color-mix(in srgb, var(--ry-fuerte) 16%, var(--ry-superficie-2)); } .ry-carrito__envio-barra > i { display: block; block-size: 100%; min-inline-size: 6px; border-radius: inherit; background: var(--ry-acento); transition: inline-size 420ms cubic-bezier(.22, .61, .36, 1), background-color 260ms ease; }  .ry-carrito__envio[data-estado="listo"] { background: color-mix(in srgb, var(--ry-success) 12%, var(--ry-superficie)); } .ry-carrito__envio[data-estado="listo"] > .ry-i { color: var(--ry-success); } .ry-carrito__envio[data-estado="listo"] .ry-carrito__envio-barra > i { background: var(--ry-success); } @media (prefers-reduced-motion: reduce) { .ry-carrito__envio-barra > i { transition: none; } } .ry-carrito__items { min-height: 0; padding: 4px 18px 16px; flex: 1; overflow-y: auto; overscroll-behavior: contain; } .ry-carrito__item { position: relative; padding-block: 16px; display: grid; grid-template-columns: 82px minmax(0, 1fr); gap: 13px; border-bottom: 1px solid var(--ry-linea); } .ry-carrito__item-foto { width: 82px; height: 98px; padding: 6px; object-fit: contain; border-radius: 9px; background: var(--ry-campo-foto); mix-blend-mode: multiply; } .ry-carrito__item-info { min-width: 0; } .ry-carrito__item-marca { margin: 0 28px 2px 0; overflow: hidden; color: var(--ry-texto-2); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; } .ry-carrito__item-titulo { margin: 0 22px 7px 0; display: -webkit-box; overflow: hidden; font-size: 12px; font-weight: 600; line-height: 1.3; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .ry-carrito__item-precio { margin: 0; color: var(--ry-acento); font-family: var(--ry-mono); font-size: 14px; font-weight: 700; } .ry-carrito__cantidad { width: 102px; height: 36px; margin-top: 10px; display: grid; grid-template-columns: 34px 1fr 34px; align-items: center; border: 1px solid var(--ry-linea); border-radius: 7px; background: var(--ry-superficie); } .ry-carrito__cantidad button { width: 34px; height: 34px; padding: 0; border: 0; background: transparent; cursor: pointer; } .ry-carrito__cantidad output, .ry-carrito__cantidad span { font-family: var(--ry-mono); font-size: 11px; text-align: center; } .ry-carrito__eliminar { position: absolute; top: 12px; right: -7px; width: 36px; height: 36px; padding: 0; border: 0; background: transparent; color: var(--ry-texto-2); font-size: 18px; line-height: 1; text-align: center; text-decoration: none; cursor: pointer; } .ry-carrito__vacio { min-height: 0; padding: 40px 26px; flex: 1; flex-direction: column; align-items: center; justify-content: center; text-align: center; } .ry-carrito__vacio:not([hidden]) { display: flex; } .ry-carrito__vacio-icono { width: 72px; height: 72px; display: grid; place-items: center; border-radius: 50%; background: var(--ry-superficie-2); color: var(--ry-acento); } .ry-carrito__vacio-icono .ry-i { width: 30px; height: 30px; } .ry-carrito__vacio h3 { margin: 20px 0 7px; font-family: var(--ry-serif); font-size: 27px; font-weight: 500; } .ry-carrito__vacio p { max-width: 30ch; margin: 0 0 22px; color: var(--ry-texto-2); font-size: 13px; } .ry-carrito__pie { padding: 17px 18px calc(18px + env(safe-area-inset-bottom)); flex: 0 0 auto; border-top: 1px solid var(--ry-linea); background: var(--ry-superficie); box-shadow: 0 -14px 32px color-mix(in srgb, var(--ry-contraste) 5%, transparent); } .ry-carrito__subtotal { display: flex; align-items: baseline; justify-content: space-between; } .ry-carrito__subtotal span { font-size: 13px; font-weight: 600; } .ry-carrito__subtotal strong { color: var(--ry-acento); font-size: 22px; } .ry-carrito__pie > p { margin: 4px 0 14px; color: var(--ry-texto-2); font-size: 9px; } .ry-carrito__pie .ry-btn { width: 100%; justify-content: space-between; } .ry-carrito__secundarias { margin-top: 9px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } .ry-carrito__ver, .ry-carrito__seguir { min-height: 42px; padding: 0 12px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; border: 1px solid var(--ry-linea); border-radius: 10px; background: var(--ry-fondo); color: var(--ry-texto); font: inherit; font-size: 11px; font-weight: 700; line-height: 1.2; text-align: center; text-decoration: none; cursor: pointer; transition: border-color 160ms ease, background-color 160ms ease, color 160ms ease; } .ry-carrito__ver .ry-i { width: 15px; height: 15px; } .ry-carrito__ver:hover, .ry-carrito__seguir:hover { border-color: color-mix(in srgb, var(--ry-acento) 54%, var(--ry-linea)); background: color-mix(in srgb, var(--ry-acento) 6%, var(--ry-superficie)); color: var(--ry-acento); } .ry-carrito__seguir { width: 100%; margin: 0; } @media (max-width: 359px) { .ry-cabezal__icono:not([data-cart-open]) { display: none; } .ry-cabezal__logo img { height: 30px; } } @media (min-width: 700px) { .ry-drawer { width: min(88vw, 460px); } .ry-panel__cabecera, .ry-carrito__cabecera { padding-inline: 24px; } .ry-panel__cuerpo { padding-inline: 24px; } .ry-panel__pie { padding: 22px 24px; } .ry-carrito__envio { margin-inline: 24px; } .ry-carrito__items { padding-inline: 24px; } .ry-carrito__pie { padding-inline: 24px; } } @media (min-width: 1024px) {  .ry-cabezal__fila { min-height: 80px; padding-block: 10px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; grid-template-areas: "logo nav buscador acciones"; gap: 20px; overflow: visible; } .ry-cabezal__menu { display: none; } .ry-cabezal__logo img { height: 52px; } .ry-cabezal__logo { position: relative; top: auto; left: auto; grid-area: logo; justify-content: flex-start; font-size: 22px; transform: none; } .ry-cabezal__logo svg { width: 34px; height: 34px; } .ry-cabezal__acciones { grid-area: acciones; margin-left: 0; padding-left: 0; justify-self: end; } .ry-cabezal__nav { grid-area: nav; display: flex; align-items: center; justify-content: center; gap: 16px; } .ry-cabezal__nav > a:not(.ry-cabezal__recomprar), .ry-desplegable__abre { min-height: 46px; padding-inline: 10px; display: inline-flex; align-items: center; color: var(--ry-texto); font-size: 13.5px; font-weight: 600; text-decoration: none; border-radius: 999px; transition: background-color 160ms ease, color 160ms ease; white-space: nowrap; } .ry-cabezal__nav > button { min-height: 44px; font-size: 13px; } .ry-cabezal__nav > a:not(.ry-cabezal__recomprar):hover, .ry-cabezal__nav > button:hover, .ry-desplegable__abre:hover { background: color-mix(in srgb, var(--ry-acento) 7%, transparent); color: var(--ry-acento); }  .ry-desplegable { position: relative; display: inline-flex; align-items: center; } .ry-desplegable__pico { width: 14px; height: 14px; margin-left: 5px; color: var(--ry-acento); transform: rotate(90deg); transition: transform 200ms cubic-bezier(.22, .72, .25, 1); } .ry-desplegable:hover .ry-desplegable__pico, .ry-desplegable:focus-within .ry-desplegable__pico { transform: rotate(90deg) translateX(2px); } .ry-desplegable__panel { position: absolute; top: 100%; left: 50%; z-index: 40; width: max-content; max-width: min(760px, 92vw); margin-top: 9px; padding: 18px; display: grid; grid-template-columns: repeat(2, minmax(165px, auto)) minmax(190px, 224px); gap: 10px 22px; border: 1px solid color-mix(in srgb, var(--ry-acento) 18%, var(--ry-linea)); border-radius: 22px; background: var(--ry-superficie); box-shadow: 0 28px 70px color-mix(in srgb, var(--ry-contraste) 20%, transparent); opacity: 0; transform: translate(-50%, -8px) scale(.985); transform-origin: 50% 0; visibility: hidden; transition: opacity 180ms cubic-bezier(.23, 1, .32, 1), transform 180ms cubic-bezier(.23, 1, .32, 1), visibility 180ms; } .ry-desplegable__panel::before { content: ""; position: absolute; top: -13px; left: 0; right: 0; height: 13px; } .ry-desplegable:hover .ry-desplegable__panel, .ry-desplegable:focus-within .ry-desplegable__panel { opacity: 1; transform: translate(-50%, 0) scale(1); visibility: visible; } .ry-desplegable__panel--corto { grid-template-columns: repeat(2, minmax(150px, auto)); }  @media (max-width: 1359px) { .ry-cabezal__nav { position: relative; } .ry-desplegable { position: static; } .ry-desplegable__panel { left: 0; transform: translate(0, -8px) scale(.985); transform-origin: 0 0; max-width: calc(100vw - var(--ry-margen) * 2 - 40px); } .ry-desplegable:hover .ry-desplegable__panel, .ry-desplegable:focus-within .ry-desplegable__panel { transform: translate(0, 0) scale(1); } } .ry-desplegable__columnas { display: grid; align-content: start; gap: 2px; } .ry-desplegable__rotulo { margin: 0 0 7px; color: var(--ry-texto-2); font-family: var(--ry-mono); font-size: 9px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; } .ry-desplegable__columnas a { min-height: 32px; padding-inline: 10px; display: flex; align-items: center; color: var(--ry-texto); font-size: 13.5px; font-weight: 500; text-decoration: none; white-space: nowrap; border-radius: 9px; transition: background-color 150ms ease, color 150ms ease, transform 150ms ease; } .ry-desplegable__columnas a:hover { background: color-mix(in srgb, var(--ry-acento) 7%, var(--ry-fondo)); color: var(--ry-acento); transform: translateX(2px); } .ry-desplegable__pieza { position: relative; overflow: hidden; display: block; border-radius: 15px; color: #fff8ef; text-decoration: none; } .ry-desplegable__pieza img { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: cover; object-position: 50% 34%; transition: transform 260ms cubic-bezier(.23, 1, .32, 1); } .ry-desplegable__pieza:hover img { transform: scale(1.025); } .ry-desplegable__pieza span { position: relative; z-index: 1; min-height: 158px; padding: 17px; display: grid; align-content: end; gap: 7px; background: linear-gradient(to top, rgb(6 22 16 / .92), rgb(6 22 16 / .12) 74%); font-size: 13px; font-weight: 600; line-height: 1.25; } .ry-desplegable__pieza small { color: rgb(255 248 239 / .7); font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; } .ry-desplegable__pieza strong { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-family: var(--ry-serif); font-size: 17px; font-weight: 500; } .ry-desplegable__pieza .ry-i { width: 15px; height: 15px; } .ry-desplegable__nota { grid-column: 1 / -1; max-width: 44ch; margin: 12px 0 0; padding-top: 13px; border-top: 1px solid var(--ry-linea); color: var(--ry-texto-2); font-size: 12px; line-height: 1.5; text-wrap: pretty; }  .ry-cabezal__nav .ry-cabezal__recomprar { padding: 0; border: 0; background: transparent; font: inherit; cursor: pointer; gap: 7px; padding-left: 19px; border-left: 1px solid var(--ry-linea);  white-space: nowrap; text-decoration: none; } .ry-cabezal__nav .ry-cabezal__recomprar-texto { transition: color 160ms ease; } .ry-cabezal__nav .ry-cabezal__recomprar:hover .ry-cabezal__recomprar-texto, .ry-cabezal__nav .ry-cabezal__recomprar:focus-visible .ry-cabezal__recomprar-texto { color: var(--ry-acento); }  @media (max-width: 1149px) { .ry-cabezal__nav .ry-cabezal__recomprar { padding-left: 14px; gap: 0; } .ry-cabezal__nav .ry-cabezal__recomprar-texto { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; } } .ry-cabezal__nav .ry-cabezal__recomprar:hover { color: var(--ry-acento); } .ry-cabezal__recomprar .ry-i { width: 16px; height: 16px; color: var(--ry-acento); } @media (min-width: 1180px) { .ry-cabezal__nav { gap: 20px; } .ry-cabezal__nav > a:not(.ry-cabezal__recomprar), .ry-desplegable__abre { min-height: 48px; padding-inline: 4px; font-size: 14.5px; } }  .ry-cabezal__buscador, .ry-cabezal__buscador[data-abierto] { --ry-buscador-alto: 40px; position: relative; grid-area: buscador; top: auto; right: auto; width: 240px; max-width: 240px; margin: 0; justify-self: end; } .ry-cabezal[data-busqueda-abierta] .ry-cabezal__logo { opacity: 1; transform: none; pointer-events: auto; } .ry-cabezal__buscador input { position: absolute; top: 0; right: 60px; z-index: 1; width: 180px; padding-right: 15px; border-radius: 20px; font-size: 13px; transition: border-color 180ms cubic-bezier(.23, 1, .32, 1), box-shadow 180ms cubic-bezier(.23, 1, .32, 1), clip-path 750ms cubic-bezier(.16, 1, .3, 1), opacity 420ms cubic-bezier(.16, 1, .3, 1) 90ms, transform 750ms cubic-bezier(.16, 1, .3, 1); } .ry-buscador__disparador { top: 0; right: 0; width: 100px; height: 40px; border-radius: 20px; transition: width 750ms cubic-bezier(.16, 1, .3, 1), color 160ms ease, background-color 160ms ease, border-color 160ms ease, box-shadow 180ms ease, transform 140ms cubic-bezier(.23, 1, .32, 1); } .ry-buscador__disparador .ry-i { position: absolute; width: 16px; height: 16px; opacity: 0; filter: blur(3px); transform: translateX(-8px) scale(.86); } .ry-buscador__texto { display: block; font-size: 13px; font-weight: 600; letter-spacing: -.01em; transition: opacity 140ms cubic-bezier(.23, 1, .32, 1), filter 180ms cubic-bezier(.23, 1, .32, 1), transform 200ms cubic-bezier(.23, 1, .32, 1); } .ry-buscador__cargando { top: 12px; right: 12px; } .ry-cabezal__buscador[data-mejorado] .ry-buscador__goo { position: absolute; inset: 0; z-index: 0; display: block; filter: url("#ry-buscador-goo"); pointer-events: none; } .ry-cabezal__buscador[data-mejorado][data-sin-goo] .ry-buscador__goo { filter: none; } .ry-cabezal__buscador[data-mejorado] .ry-buscador__superficie, .ry-cabezal__buscador[data-mejorado] .ry-buscador__burbuja { position: absolute; top: 0; height: 40px; display: block; border-radius: 20px; background: var(--ry-superficie); } .ry-cabezal__buscador[data-mejorado] .ry-buscador__superficie { right: 60px; width: 180px; clip-path: inset(0 0 0 80px round 20px); transform: translateX(60px); transform-origin: right center; transition: clip-path 750ms cubic-bezier(.16, 1, .3, 1), transform 750ms cubic-bezier(.16, 1, .3, 1); } .ry-cabezal__buscador[data-mejorado] .ry-buscador__burbuja { right: 0; width: 40px; opacity: 0; transform: translateX(-50px) scale(.8); transition: opacity 850ms cubic-bezier(.16, 1, .3, 1) 100ms, transform 850ms cubic-bezier(.16, 1, .3, 1) 100ms; } .ry-cabezal__buscador[data-mejorado][data-abierto] .ry-buscador__superficie { clip-path: inset(0 0 0 0 round 20px); transform: translateX(0); } .ry-cabezal__buscador[data-mejorado][data-abierto] .ry-buscador__burbuja { opacity: 1; transform: translateX(0) scale(1); } .ry-cabezal__buscador[data-mejorado] input { background: transparent; } .ry-cabezal__buscador[data-mejorado]:not([data-abierto]) input { clip-path: inset(0 0 0 80px round 20px); opacity: 0; pointer-events: none; transform: translateX(60px); } .ry-cabezal__buscador[data-mejorado]:not([data-abierto]) .ry-buscador__disparador { border-color: var(--ry-linea); background: transparent; color: var(--ry-texto); box-shadow: 0 8px 22px color-mix(in srgb, var(--ry-contraste) 9%, transparent); } .ry-cabezal__buscador[data-mejorado]:not([data-abierto]) .ry-buscador__disparador:hover { border-color: color-mix(in srgb, var(--ry-acento) 44%, var(--ry-linea)); color: var(--ry-acento); } .ry-cabezal__buscador[data-mejorado][data-abierto] input { clip-path: inset(0 0 0 0 round 20px); opacity: 1; transform: translateX(0); } .ry-cabezal__buscador[data-mejorado][data-abierto] .ry-buscador__disparador { width: 40px; border-color: var(--ry-linea); background: transparent; box-shadow: 0 8px 22px color-mix(in srgb, var(--ry-contraste) 8%, transparent); } .ry-cabezal__buscador[data-mejorado][data-abierto] .ry-buscador__texto { opacity: 0; filter: blur(3px); transform: translateX(10px) scale(.94); pointer-events: none; } .ry-cabezal__buscador[data-mejorado][data-abierto] .ry-buscador__disparador .ry-i { opacity: 1; filter: blur(0); transform: translateX(0) scale(1); } .ry-cabezal__buscador[data-sin-movimiento] input, .ry-cabezal__buscador[data-sin-movimiento] .ry-buscador__superficie, .ry-cabezal__buscador[data-sin-movimiento] .ry-buscador__burbuja, .ry-cabezal__buscador[data-sin-movimiento] .ry-buscador__disparador, .ry-cabezal__buscador[data-sin-movimiento] .ry-buscador__texto, .ry-cabezal__buscador[data-sin-movimiento] .ry-buscador__disparador .ry-i, .ry-cabezal__buscador[data-sin-movimiento] .ry-buscador__resultados { animation: none; transition-duration: 1ms; } .ry-buscador__resultados { left: auto; min-width: min(440px, 44vw); } } @media (min-width: 1180px) { .ry-cabezal__fila { gap: 28px; } .ry-cabezal__nav { gap: 25px; } } @media (prefers-reduced-motion: no-preference) { .ry-panel[open] { animation: ry-panel-entra 260ms cubic-bezier(.22, .72, .25, 1); } .ry-carrito[open] { animation: ry-carrito-entra 260ms cubic-bezier(.22, .72, .25, 1); } .ry-cabezal__buscador[data-cargando] .ry-buscador__cargando { animation: ry-buscador-gira 560ms linear infinite; } .ry-cabezal__buscador[data-mejorado][data-abierto]:not([data-sin-movimiento]) .ry-buscador__superficie { animation: ry-buscador-campo-abre 750ms cubic-bezier(.16, 1, .3, 1) both; } .ry-cabezal__buscador[data-mejorado][data-abierto]:not([data-sin-movimiento]) input { animation: ry-buscador-input-abre 750ms cubic-bezier(.16, 1, .3, 1) both; } .ry-cabezal__buscador[data-mejorado][data-abierto]:not([data-sin-movimiento]) .ry-buscador__disparador { animation: ry-buscador-boton-separa 750ms cubic-bezier(.16, 1, .3, 1) both; } .ry-cabezal__buscador[data-mejorado][data-abierto]:not([data-sin-movimiento]):not([data-cargando]) .ry-buscador__disparador .ry-i { animation: ry-buscador-icono-separa 850ms cubic-bezier(.16, 1, .3, 1) 100ms both; } @keyframes ry-panel-entra { from { transform: translateX(-100%); } } @keyframes ry-carrito-entra { from { transform: translateX(100%); } } @keyframes ry-buscador-gira { to { rotate: 1turn; } } @keyframes ry-buscador-campo-abre { from { clip-path: inset(0 0 0 80px round 20px); transform: translateX(60px); } 76% { clip-path: inset(0 0 0 0 round 20px); transform: translateX(-2px); } to { clip-path: inset(0 0 0 0 round 20px); transform: translateX(0); } } @keyframes ry-buscador-input-abre { from { clip-path: inset(0 0 0 80px round 20px); opacity: 0; transform: translateX(60px); } 76% { clip-path: inset(0 0 0 0 round 20px); opacity: 1; transform: translateX(-2px); } to { clip-path: inset(0 0 0 0 round 20px); opacity: 1; transform: translateX(0); } } @keyframes ry-buscador-boton-separa { from { width: 100px; } 76% { width: 38px; } to { width: 40px; } } @keyframes ry-buscador-icono-separa { from { opacity: 0; filter: blur(5px); transform: translateX(-50px) scale(.8); } 72% { opacity: 1; filter: blur(0); transform: translateX(2px) scale(1.035); } to { opacity: 1; filter: blur(0); transform: translateX(0) scale(1); } } } @media (max-width: 1023px) { .ry-cabezal__buscador[data-mejorado][data-abierto] .ry-buscador__superficie, .ry-cabezal__buscador[data-mejorado][data-abierto] input, .ry-cabezal__buscador[data-mejorado][data-abierto] .ry-buscador__disparador, .ry-cabezal__buscador[data-mejorado][data-abierto] .ry-buscador__disparador .ry-i { animation: none; } } @media (prefers-reduced-motion: reduce) { .ry-cabezal__logo, .ry-cabezal__buscador, .ry-cabezal__buscador input, .ry-buscador__disparador, .ry-buscador__disparador .ry-i, .ry-buscador__texto, .ry-buscador__cargando, .ry-buscador__superficie, .ry-buscador__burbuja, .ry-buscador__resultados, .ry-buscador__resultado, .ry-buscador__vacio { transition-duration: 1ms; } }   .ry-hero { position: relative; min-height: clamp(540px, calc(100svh - 137px), 680px); display: grid; overflow: hidden; isolation: isolate; background: var(--ry-contraste); color: var(--ry-contraste-txt); } .ry-hero__foto, .ry-hero__foto img, .ry-hero__velo { position: absolute; inset: 0; width: 100%; height: 100%; } .ry-hero__foto { z-index: -2; } .ry-hero__foto img { max-width: none; object-fit: cover; object-position: 52% 35%; } .ry-hero__velo { z-index: -1; background: linear-gradient(to top, rgba(6, 15, 11, .98) 0%, rgba(6, 15, 11, .83) 28%, rgba(6, 15, 11, .16) 64%, rgba(6, 15, 11, .04) 100%); } .ry-hero__contenido { align-self: end; padding-top: 220px; padding-bottom: 38px; } .ry-hero__titulo { max-width: 9ch; margin: 0; font-family: var(--ry-serif); font-size: clamp(3.25rem, 14vw, 4.7rem); font-weight: 500; letter-spacing: -.045em; line-height: .88; text-wrap: balance; } .ry-hero__titulo em { color: #E67A42; font-style: italic; font-weight: 500; } .ry-hero__bajada { max-width: 35ch; margin: 18px 0 0; color: color-mix(in srgb, var(--ry-contraste-txt) 84%, transparent); font-size: 16px; line-height: 1.45; text-wrap: pretty; } .ry-hero__acciones { margin-top: 27px; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; } .ry-hero .ry-btn { width: min(100%, 290px); min-height: 54px; padding-inline: 22px; justify-content: space-between; font-size: 15px; } .ry-hero__enlace { min-height: 48px; padding: 0 2px; display: inline-flex; align-items: center; gap: 12px; color: var(--ry-contraste-txt); font-size: 14px; font-weight: 500; text-decoration: none; border-radius: 999px; transition: color 160ms ease, background-color 160ms ease; } .ry-hero__enlace .ry-i { width: 18px; height: 18px; } .ry-hero__enlace:hover { color: #efaa79; } @media (min-width: 600px) { .ry-hero { min-height: clamp(560px, calc(100svh - 137px), 680px); } .ry-hero__contenido { padding-bottom: 50px; } } @media (min-width: 768px) { .ry-hero { min-height: clamp(540px, calc(100svh - 108px), 680px); } .ry-hero__foto img { object-position: center; } .ry-hero__velo { background: linear-gradient(90deg, rgba(6, 15, 11, .98) 0%, rgba(6, 15, 11, .84) 27%, rgba(6, 15, 11, .2) 58%, rgba(6, 15, 11, .04) 100%), linear-gradient(to top, rgba(6, 15, 11, .42), transparent 50%); } .ry-hero__contenido { align-self: center; padding-top: 44px; padding-bottom: 44px; } .ry-hero__titulo { max-width: 8.5ch; font-size: clamp(4.3rem, 6.6vw, 6rem); line-height: .88; } .ry-hero__bajada { max-width: 34ch; font-size: 18px; } .ry-hero__acciones { margin-top: 31px; } }   .ry-marcas { position: relative; min-height: 70px; overflow: hidden; border-bottom: 1px solid var(--ry-linea); background: var(--ry-superficie); color: var(--ry-texto); } .ry-marcas__interior { min-height: 70px; display: grid; grid-template-columns: 88px 1px minmax(0, 1fr); align-items: center; gap: 14px; } .ry-marcas__rotulo { margin: 0; font-family: var(--ry-sans); font-size: 10px; font-weight: 700; letter-spacing: .065em; line-height: 1.25; text-transform: uppercase; } .ry-marcas__divisor { width: 1px; height: 30px; background: color-mix(in srgb, var(--ry-texto) 18%, transparent); } .ry-marcas__ventana { min-width: 0; overflow: hidden; mask-image: linear-gradient(90deg, #000 0%, #000 96%, transparent); } .ry-marcas__cinta { width: max-content; display: flex; gap: 28px; will-change: transform; } .ry-marcas__pista { display: flex; align-items: center; gap: 28px; } .ry-marca { width: 94px; height: 44px; padding: 7px 6px; flex: 0 0 auto; display: grid; place-items: center; border: 0; border-radius: 0; background: transparent; color: var(--ry-texto); cursor: pointer; opacity: .88; transition: opacity 180ms ease, transform 180ms ease; } .ry-marca:hover, .ry-marca:focus-visible { opacity: 1; transform: translateY(-2px); } .ry-marca:focus-visible { outline: 2px solid color-mix(in srgb, var(--ry-acento) 62%, transparent); outline-offset: 2px; border-radius: 4px; } .ry-marca__campo { width: 100%; height: 100%; display: grid; place-items: center; } .ry-marca__logo { max-width: 100%; max-height: 30px; object-fit: contain; filter: none; mix-blend-mode: normal; }  .ry-marca[data-marca="eukanuba"] .ry-marca__logo, .ry-marca[data-marca="taste-of-the-wild"] .ry-marca__logo { filter: brightness(0) saturate(100%); } .ry-marca__nombre { max-width: 11ch; font-family: var(--ry-serif); font-size: 15px; font-weight: 500; letter-spacing: -.025em; line-height: 1; text-align: center; text-wrap: balance; } .ry-marca__nombre[hidden], .ry-marca__logo[hidden] { display: none; } .ry-marca[data-marca="hills"] .ry-marca__logo, .ry-marca[data-marca="virbac"] .ry-marca__logo, .ry-marca[data-marca="taste-of-the-wild"] .ry-marca__logo, .ry-marca[data-marca="formula-natural"] .ry-marca__logo { max-height: 33px; } @media (prefers-reduced-motion: no-preference) { .ry-marcas__cinta { animation: ry-marcas-corre 52s linear infinite; } .ry-marcas:hover .ry-marcas__cinta, .ry-marcas:focus-within .ry-marcas__cinta { animation-play-state: paused; } @keyframes ry-marcas-corre { from { transform: translateX(0); } to { transform: translateX(calc(-50% - 14px)); } } } @media (prefers-reduced-motion: reduce) { .ry-marcas__cinta { width: auto; overflow-x: auto; scrollbar-width: none; } .ry-marca, .ry-marca:hover { transition: none; transform: none; } } @media (min-width: 700px) { .ry-marcas, .ry-marcas__interior { min-height: 76px; } .ry-marcas__interior { grid-template-columns: 128px 1px minmax(0, 1fr); gap: 22px; } .ry-marcas__rotulo { font-size: 11px; } .ry-marcas__divisor { height: 34px; } .ry-marcas__cinta, .ry-marcas__pista { gap: 38px; } .ry-marca { width: 104px; } } @media (min-width: 1024px) { .ry-marcas, .ry-marcas__interior { min-height: 80px; } .ry-marcas__interior { grid-template-columns: 154px 1px minmax(0, 1fr); gap: 26px; } .ry-marcas__rotulo { font-size: 11px; } .ry-marcas__divisor { height: 36px; } .ry-marcas__cinta, .ry-marcas__pista { gap: 48px; } .ry-marca { width: 116px; height: 46px; } .ry-marca__logo { max-height: 32px; } }   .ry-cinta { border-bottom: 1px solid var(--ry-linea); background: var(--ry-superficie); } .ry-cinta__fila { display: flex; gap: 0; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: none; -webkit-overflow-scrolling: touch; } .ry-cinta__fila::-webkit-scrollbar { display: none; } .ry-cinta__item { min-height: 72px; padding: 14px 20px 14px 0; flex: 0 0 auto; display: flex; align-items: center; gap: 11px; } .ry-cinta__item + .ry-cinta__item { padding-left: 20px; border-left: 1px solid var(--ry-linea); } .ry-cinta__icono { width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--ry-acento) 42%, transparent); border-radius: 50%; color: var(--ry-acento); } .ry-cinta__icono .ry-i { width: 17px; height: 17px; } .ry-cinta__texto strong, .ry-cinta__texto small { display: block; white-space: nowrap; } .ry-cinta__texto strong { font-size: 13px; font-weight: 650; letter-spacing: -.005em; line-height: 1.2; } .ry-cinta__texto small { margin-top: 2px; color: var(--ry-texto-2); font-size: 11.5px; line-height: 1.3; } @media (min-width: 900px) {  .ry-cinta__fila { overflow-x: visible; } .ry-cinta__item { flex: 1 1 0; min-width: 0; } .ry-cinta__texto strong { font-size: 13.5px; } .ry-cinta__texto small { font-size: 12px; } } @media (min-width: 1100px) { .ry-cinta__item { min-height: 78px; } .ry-cinta__icono { width: 36px; height: 36px; } .ry-cinta__icono .ry-i { width: 18px; height: 18px; } }   .ry-relampago { --ry-hot-rojo: hsl(11 68% 38%); --ry-hot-rojo-hondo: hsl(9 72% 30%); --ry-hot-dorado: hsl(42 92% 64%); padding-block: 26px 34px; background: radial-gradient(circle at 24% 0%, color-mix(in srgb, var(--ry-acento) 7%, transparent), transparent 34%), var(--ry-fondo); scroll-margin-top: 116px; }  .ry-relampago__cabecera { margin-block-end: 16px; padding: 12px 14px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; border-radius: 14px; background: linear-gradient(118deg, var(--ry-hot-rojo-hondo), var(--ry-hot-rojo)); color: hsl(40 54% 96%); } .ry-relampago__titulo { margin: 0; display: flex; align-items: center; gap: 8px; color: inherit; font-family: var(--ry-serif); font-size: clamp(1.32rem, 4.6vw, 1.85rem); font-weight: 500; letter-spacing: -.02em; line-height: 1; } .ry-relampago__titulo em { color: var(--ry-hot-dorado); font-style: italic; } .ry-relampago__rayo { inline-size: 1em; block-size: 1em; color: var(--ry-hot-dorado); }  .ry-relampago__cuenta { margin-inline-start: auto; display: flex; align-items: center; gap: 8px; } .ry-relampago__rotulo { font-size: 11px; letter-spacing: .06em; opacity: .82; text-transform: uppercase; } .ry-relampago__reloj { display: flex; align-items: stretch; gap: 4px; } .ry-relampago__unidad { min-inline-size: 38px; padding: 4px 6px; display: grid; justify-items: center; gap: 1px; border-radius: 8px; background: rgb(0 0 0 / .26); } .ry-relampago__unidad strong { font-size: 15px; font-weight: 700; line-height: 1;  font-variant-numeric: tabular-nums; } .ry-relampago__unidad small { font-size: 9px; letter-spacing: .04em; line-height: 1; opacity: .78; } .ry-relampago__vertodo { padding: 7px 13px; border-radius: 999px; background: rgb(255 255 255 / .14); color: inherit; font-size: 13px; font-weight: 600; text-decoration: none; transition: background-color 160ms ease; } .ry-relampago__vertodo:hover, .ry-relampago__vertodo:focus-visible { background: rgb(255 255 255 / .26); } .ry-relampago__vertodo:focus-visible { outline: 2px solid var(--ry-hot-dorado); outline-offset: 2px; }  .ry-relampago__riel { margin: 0; margin-inline: calc(var(--ry-margen) * -1); padding: 2px var(--ry-margen) 10px; display: flex; gap: 10px; list-style: none; overflow-x: auto; overscroll-behavior-inline: contain; scroll-padding-inline: var(--ry-margen); scroll-snap-type: x proximity;  overflow-anchor: none; scrollbar-width: none; -webkit-overflow-scrolling: touch; } .ry-relampago__riel::-webkit-scrollbar { display: none; } .ry-relampago__item { inline-size: min(44vw, 190px); flex: 0 0 auto; scroll-snap-align: start; } .ry-relampago__ficha { position: relative; block-size: 100%; padding: 10px 10px 12px; display: flex; flex-direction: column; gap: 5px; border: 1px solid var(--ry-linea); border-radius: 13px; background: var(--ry-superficie); transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; } .ry-relampago__ficha:hover { border-color: color-mix(in srgb, var(--ry-acento) 40%, var(--ry-linea)); box-shadow: 0 12px 26px color-mix(in srgb, var(--ry-texto) 8%, transparent); transform: translateY(-2px); } .ry-relampago__foto { position: relative; display: block; aspect-ratio: 1; overflow: hidden; border-radius: 9px; background: var(--ry-fondo); } .ry-relampago__foto img { inline-size: 100%; block-size: 100%; object-fit: contain; } .ry-relampago__vista { position: absolute; z-index: 2; inset-block-start: 16px; inset-inline-end: 16px; inline-size: 40px; block-size: 40px; padding: 0; display: grid; place-items: center; border: 1px solid rgb(255 255 255 / .74); border-radius: 999px; background: rgb(255 255 255 / .94); color: var(--ry-texto); box-shadow: 0 7px 18px rgb(22 54 42 / .16); cursor: pointer; transition: color 170ms ease, background-color 170ms ease, transform 170ms ease; } .ry-relampago__vista[hidden] { display: none; } .ry-relampago__vista .ry-i { inline-size: 17px; block-size: 17px; } .ry-relampago__vista span { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } .ry-relampago__vista:hover, .ry-relampago__vista:focus-visible { background: var(--ry-contraste); color: var(--ry-contraste-txt); transform: translateY(-1px); } .ry-relampago__vista:focus-visible { outline: 2px solid var(--ry-acento); outline-offset: 2px; }  @media (hover: hover) and (pointer: fine) { .ry-relampago__vista:not([hidden]) { opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-4px); } .ry-relampago__ficha:hover .ry-relampago__vista:not([hidden]), .ry-relampago__ficha:focus-within .ry-relampago__vista:not([hidden]), .ry-relampago__vista:focus-visible { opacity: 1; visibility: visible; pointer-events: auto; transform: none; } }  .ry-relampago__dto { position: absolute; inset-block-start: 6px; inset-inline-start: 6px; padding: 3px 7px; border-radius: 7px; background: var(--ry-hot-rojo); color: hsl(40 54% 96%); font-family: var(--ry-font-mono, inherit); font-size: 12px; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; } .ry-relampago__nombre { margin: 3px 0 0; font-family: var(--ry-sans, inherit); font-size: 12.5px; font-weight: 600; letter-spacing: -.01em; line-height: 1.28; } .ry-relampago__nombre a { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: var(--ry-texto); text-decoration: none; } .ry-relampago__nombre a:hover { color: var(--ry-acento); } .ry-relampago__peso { align-self: start; padding: 2px 7px; border: 1px solid var(--ry-linea); border-radius: 999px; color: var(--ry-texto-2); font-size: 11px; line-height: 1.4; } .ry-relampago__precios { margin: 2px 0 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; } .ry-relampago__precio { color: var(--ry-precio); font-size: 16px; font-weight: 700; line-height: 1.1; }  .ry-relampago__antes { color: var(--ry-texto-2); font-size: 12px; text-decoration-thickness: 1px; } .ry-relampago__kilo { color: var(--ry-texto-2); font-size: 11px; line-height: 1.35; }  .ry-relampago__quedan { margin: 1px 0 0; color: var(--ry-hot-rojo); font-size: 11px; font-weight: 700; line-height: 1.3; } .ry-relampago__agregar { margin-block-start: auto; min-block-size: 40px; padding-inline: 12px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; font-size: 13px; } .ry-relampago__agregar .ry-i { inline-size: 15px; block-size: 15px; }  @media (min-width: 700px) { .ry-relampago__cabecera { padding: 14px 18px; } .ry-relampago__riel { margin-inline: 0; padding: 2px 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; overflow: visible; } .ry-relampago__item { inline-size: auto; } .ry-relampago__ficha { padding: 12px 12px 14px; } .ry-relampago__nombre { font-size: 13px; } .ry-relampago__precio { font-size: 17px; } } @media (min-width: 1024px) { .ry-relampago { padding-block: 32px 42px; } .ry-relampago__riel { gap: 14px; } .ry-relampago__nombre { font-size: 13.5px; } .ry-relampago__precio { font-size: 18px; } .ry-relampago__unidad { min-inline-size: 42px; } .ry-relampago__unidad strong { font-size: 16px; } .ry-relampago__vista { inline-size: auto; min-inline-size: 40px; padding-inline: 11px; display: inline-flex; align-items: center; gap: 7px; } .ry-relampago__vista span { position: static; inline-size: auto; block-size: auto; clip: auto; font-size: 11px; font-weight: 700; } } @media (prefers-reduced-motion: reduce) { .ry-relampago__ficha, .ry-relampago__ficha:hover { transition: none; transform: none; } }   .ry-cabecera-seccion { margin-bottom: 22px; display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; } .ry-cabecera-seccion .ry-titulo { max-width: 12ch; }  .ry-vertodo { min-height: 44px; padding: 0 15px; flex: 0 0 auto; display: inline-flex; align-items: center; gap: 7px; border: 1px solid color-mix(in srgb, var(--ry-acento) 32%, var(--ry-linea)); border-radius: 999px; background: color-mix(in srgb, var(--ry-acento) 5%, var(--ry-superficie)); color: var(--ry-texto); font-size: 13px; font-weight: 650; line-height: 1; text-decoration: none; cursor: pointer; transition: color 180ms ease, border-color 180ms ease, background-color 180ms ease, transform 180ms ease; } .ry-vertodo::after { content: "→"; font-size: 16px; line-height: 1; } .ry-vertodo:hover { border-color: var(--ry-acento); background: color-mix(in srgb, var(--ry-acento) 10%, var(--ry-superficie)); color: var(--ry-acento); transform: translateY(-1px); }  #ofertas { padding-bottom: calc(var(--ry-aire) - 24px); } #ofertas .ry-riel { display: flex; gap: 12px; overflow-x: auto; overscroll-behavior-inline: contain; padding-top: 4px; padding-bottom: 18px;  scroll-snap-type: x proximity; overflow-anchor: none; scrollbar-width: none; -webkit-overflow-scrolling: touch; } #ofertas .ry-riel::-webkit-scrollbar { display: none; } #ofertas .ry-riel > .ry-ficha { width: min(72vw, 274px); flex: 0 0 min(72vw, 274px); scroll-snap-align: start; }  #ofertas .ry-riel > .ry-ficha:first-child { width: min(calc(100vw - 72px), 336px); flex-basis: min(calc(100vw - 72px), 336px); border-color: color-mix(in srgb, var(--ry-acento) 44%, var(--ry-linea)); } #ofertas .ry-riel > .ry-ficha:first-child .ry-ficha__campo { aspect-ratio: 4 / 3; } #ofertas .ry-riel > .ry-ficha:first-child .ry-ficha__titulo { min-height: 0; font-family: var(--ry-serif); font-size: 19px; font-weight: 500; line-height: 1.14; -webkit-line-clamp: 3; } #ofertas .ry-riel > .ry-ficha:first-child .ry-ficha__precio { font-size: 27px; } #ofertas .ry-riel > .ry-ficha:first-child .ry-ficha__ahorro { font-size: 12px; } @media (min-width: 700px) { .ry-cabecera-seccion { margin-bottom: 26px; } } @media (min-width: 1024px) { #ofertas .ry-riel { gap: 16px; } #ofertas .ry-riel > .ry-ficha { width: clamp(216px, 18vw, 236px); flex-basis: clamp(216px, 18vw, 236px); } #ofertas .ry-riel > .ry-ficha:first-child { width: clamp(300px, 25vw, 332px); flex-basis: clamp(300px, 25vw, 332px); } } @media (prefers-reduced-motion: reduce) { .ry-vertodo { transition: none; } }   .ry-reco { position: relative; z-index: 1; padding-block: 52px 36px; background: radial-gradient(circle at 84% 20%, color-mix(in srgb, var(--ry-acento) 7%, transparent), transparent 28%), var(--ry-fondo); scroll-margin-top: 116px; } .ry-reco__tarjeta { display: grid; overflow: hidden; border: 1px solid color-mix(in srgb, var(--ry-acento) 35%, var(--ry-linea)); border-radius: 18px; background: color-mix(in srgb, var(--ry-superficie) 92%, var(--ry-fondo)); box-shadow: 0 24px 62px color-mix(in srgb, var(--ry-texto) 7%, transparent); } .ry-reco__consulta { min-width: 0; padding: 24px 20px 20px; } .ry-reco__encabezado { display: grid; gap: 17px; } .ry-reco__titulo { max-width: 15ch; margin: 0; font-family: var(--ry-serif); font-size: clamp(2.1rem, 9vw, 3.15rem); font-weight: 500; letter-spacing: -.04em; line-height: .94; } .ry-reco__titulo em, .ry-reco__panel h3 em { color: var(--ry-acento); font-style: italic; font-weight: 500; } .ry-reco__modos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: hidden; border: 1px solid var(--ry-linea); border-radius: 13px; } .ry-reco__modo { min-height: 67px; padding: 9px 10px; display: grid; place-items: center; align-content: center; gap: 1px; border: 0; background: transparent; color: var(--ry-texto); font-size: 14px; font-weight: 700; cursor: pointer; transition: background-color 180ms ease, color 180ms ease; } .ry-reco__modo + .ry-reco__modo { border-left: 1px solid var(--ry-linea); } .ry-reco__modo span, .ry-reco__modo small { display: block; color: var(--ry-texto-2); font-family: var(--ry-mono); font-size: 8px; font-weight: 600; line-height: 1.25; } .ry-reco__modo[aria-selected="true"] { background: var(--ry-fuerte); color: var(--ry-fuerte-texto); } .ry-reco__modo[aria-selected="true"] span, .ry-reco__modo[aria-selected="true"] small { color: color-mix(in srgb, var(--ry-fuerte-texto) 82%, transparent); } .ry-reco__progreso { margin-top: 20px; display: grid; grid-template-columns: 43px minmax(0, 1fr); align-items: center; gap: 11px; } .ry-reco__contador { color: var(--ry-texto-2); font-size: 9px; } .ry-reco__barra { height: 4px; overflow: hidden; border-radius: 999px; background: var(--ry-superficie-2); } .ry-reco__barra i { width: 0; height: 100%; display: block; border-radius: inherit; background: var(--ry-fuerte); transition: width 260ms ease; } .ry-reco__pregunta { min-width: 0; margin: 17px 0 0; padding: 0; border: 0; } .ry-reco__pregunta legend { margin: 0 0 13px; padding: 0; font-family: var(--ry-serif); font-size: clamp(1.48rem, 6vw, 1.88rem); font-weight: 500; letter-spacing: -.025em; line-height: 1.05; } .ry-reco__opciones { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; } .ry-reco__opciones--amplias { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ry-reco__opcion { position: relative; min-width: 0; min-height: 150px; padding: 5px 8px 12px; display: grid; grid-template-rows: minmax(88px, 1fr) auto; align-items: end; justify-items: center; overflow: hidden; border: 1px solid var(--ry-linea); border-radius: 13px; background: radial-gradient(circle at 50% 28%, color-mix(in srgb, var(--ry-acento) 6%, transparent), transparent 45%), var(--ry-superficie); color: var(--ry-texto); text-align: center; cursor: pointer; transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease, transform 180ms ease; } .ry-reco__opcion:hover { border-color: color-mix(in srgb, var(--ry-texto) 40%, var(--ry-linea)); transform: translateY(-2px); } .ry-reco__opcion[aria-pressed="true"] { border-color: var(--ry-fuerte); background: radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--ry-acento) 11%, transparent), transparent 48%), color-mix(in srgb, var(--ry-fuerte) 5%, var(--ry-superficie)); box-shadow: inset 0 0 0 1px var(--ry-fuerte); } .ry-reco__selector { position: absolute; top: 9px; right: 9px; width: 14px; height: 14px; border: 1px solid color-mix(in srgb, var(--ry-texto) 55%, transparent); border-radius: 50%; background: var(--ry-superficie); } .ry-reco__opcion[aria-pressed="true"] .ry-reco__selector { border: 4px solid var(--ry-fuerte); } .ry-reco__opcion-media { position: relative; width: 100%; height: 98px; display: grid; place-items: center; overflow: hidden; border-radius: 10px; } .ry-reco__opcion-media img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; object-fit: contain; object-position: center; filter: none; transform: scale(.92); transition: transform 220ms ease; } .ry-reco__opcion:hover .ry-reco__opcion-media img, .ry-reco__opcion[aria-pressed="true"] .ry-reco__opcion-media img { transform: scale(.98); } .ry-reco__opcion-texto { min-width: 0; max-width: calc(100% - 15px); display: grid; justify-items: center; gap: 2px; } .ry-reco__opcion-texto strong { font-size: 11px; font-weight: 700; line-height: 1.15; text-wrap: balance; } .ry-reco__opcion-texto small { color: var(--ry-texto-2); font-size: 8px; line-height: 1.2; } .ry-reco__opciones--muchas { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ry-reco__opciones--muchas .ry-reco__opcion:last-child:nth-child(odd) { width: calc(50% - 4px); grid-column: 1 / -1; justify-self: center; } .ry-reco__opciones--muchas .ry-reco__opcion { min-height: 126px; grid-template-rows: minmax(72px, 1fr) auto; } .ry-reco__opciones--muchas .ry-reco__opcion-media { height: 80px; } .ry-reco__opciones--muchas .ry-reco__opcion-media img { transform: scale(.96); } .ry-reco__opciones--muchas .ry-reco__opcion:hover .ry-reco__opcion-media img, .ry-reco__opciones--muchas .ry-reco__opcion[aria-pressed="true"] .ry-reco__opcion-media img { transform: scale(1.02); } .ry-reco__opciones--amplias .ry-reco__opcion { min-height: 160px; } .ry-reco__opciones--amplias .ry-reco__opcion-media { height: 105px; } .ry-reco__opciones--amplias .ry-reco__opcion-media img { transform: scale(.92); } .ry-reco__opciones--amplias .ry-reco__opcion:hover .ry-reco__opcion-media img, .ry-reco__opciones--amplias .ry-reco__opcion[aria-pressed="true"] .ry-reco__opcion-media img { transform: scale(.98); } .ry-reco__opciones--amplias .ry-reco__opcion-texto strong { font-size: 14px; } .ry-reco__opcion-media--bolsa { height: 92px; } .ry-reco__bolsa { position: relative; width: 52px; height: 68px; display: block; border: 2px solid var(--ry-fuerte); border-radius: 5px 5px 12px 12px; background: linear-gradient(145deg, color-mix(in srgb, var(--ry-acento) 78%, white), var(--ry-acento)); box-shadow: inset 0 -12px 0 color-mix(in srgb, var(--ry-fuerte) 82%, transparent); transform-origin: 50% 100%; } .ry-reco__bolsa::before { position: absolute; top: 7px; left: 6px; right: 6px; height: 2px; background: color-mix(in srgb, var(--ry-fuerte) 70%, transparent); box-shadow: 0 4px 0 color-mix(in srgb, var(--ry-fuerte) 22%, transparent); content: ""; } .ry-reco__bolsa::after { position: absolute; left: 50%; bottom: 15px; width: 17px; height: 14px; border-radius: 52% 48% 58% 42%; background: color-mix(in srgb, var(--ry-superficie) 86%, transparent); content: ""; transform: translateX(-50%); } .ry-reco__bolsa--chica { transform: scale(.72); } .ry-reco__bolsa--media { transform: scale(.88); } .ry-reco__bolsa--grande { transform: scale(1.06); } .ry-reco__navegacion { margin-top: 14px; display: grid; grid-template-columns: minmax(0, .76fr) minmax(0, 1.24fr); gap: 8px; } .ry-reco__navegacion > :only-child { grid-column: 1 / -1; } .ry-reco__atras { min-width: 0; } .ry-reco__atras[hidden] { display: none; } .ry-reco__atras .ry-i { transform: rotate(180deg); } .ry-reco__siguiente:disabled { cursor: not-allowed; opacity: .48; } .ry-reco__legal { margin: 13px 0 0; color: var(--ry-texto-2); font-size: 8px; line-height: 1.35; } .ry-reco__panel { min-width: 0; min-height: 390px; padding: 24px 20px; display: flex; flex-direction: column; border-top: 1px solid var(--ry-linea); background: radial-gradient(circle at 50% 38%, color-mix(in srgb, var(--ry-acento) 10%, transparent), transparent 33%), color-mix(in srgb, var(--ry-superficie-2) 44%, var(--ry-superficie)); } .ry-reco__panel h3 { margin: 0; font-family: var(--ry-serif); font-size: 1.65rem; font-weight: 500; letter-spacing: -.025em; line-height: 1; } .ry-reco__pista { min-height: 18px; margin: 7px 0 0; color: var(--ry-texto-2); font-size: 10px; line-height: 1.3; } .ry-reco__resultado { min-height: 0; flex: 1; display: grid; place-items: center; } .ry-reco__cargando { width: min(100%, 410px); display: grid; justify-items: center; align-content: center; } .ry-reco__cargando-ilustracion { width: min(100%, 310px); height: 230px; margin: 5px 0 0; display: grid; place-items: center; animation: ry-reco-estudia 3.4s ease-in-out infinite; } .ry-reco__cargando-ilustracion img { width: 100%; height: 100%; object-fit: contain; } @keyframes ry-reco-estudia { 0%, 100% { transform: translateY(0) rotate(-.25deg); } 50% { transform: translateY(-5px) rotate(.25deg); } } .ry-reco__cargando-puntos { height: 15px; margin-top: -3px; display: inline-flex; align-items: center; gap: 7px; } .ry-reco__cargando-puntos i { width: 7px; height: 7px; display: block; border-radius: 50%; background: var(--ry-linea); animation: ry-reco-punto 1.25s ease-in-out infinite; } .ry-reco__cargando-puntos i:first-child { background: var(--ry-fuerte); } .ry-reco__cargando-puntos i:nth-child(2) { animation-delay: 140ms; } .ry-reco__cargando-puntos i:nth-child(3) { animation-delay: 280ms; } @keyframes ry-reco-punto { 0%, 70%, 100% { transform: translateY(0); opacity: .45; } 35% { transform: translateY(-5px); opacity: 1; } } .ry-reco__cargando-copy { max-width: 32ch; margin-top: 7px; display: grid; gap: 4px; text-align: center; } .ry-reco__cargando-copy strong { font-family: var(--ry-serif); font-size: 1.22rem; font-style: italic; font-weight: 500; letter-spacing: -.015em; line-height: 1.1; } .ry-reco__cargando-copy span { color: var(--ry-texto-2); font-size: 9px; } .ry-reco__productos { width: 100%; display: grid; gap: 12px; } .ry-reco__producto { min-width: 0; display: grid; gap: 10px; justify-items: center; text-align: center; } .ry-reco__foto { width: min(100%, 230px); height: 230px; margin: 0; display: grid; place-items: center; overflow: hidden; border: 1px solid color-mix(in srgb, var(--ry-linea) 70%, transparent); border-radius: 24px 24px 66px 66px; background: var(--ry-campo-foto); box-shadow: inset 0 -26px 38px color-mix(in srgb, var(--ry-superficie-2) 70%, transparent); } .ry-reco__foto img { width: 100%; height: 100%; padding: 8px 8px 18px; object-fit: contain; filter: none; mix-blend-mode: normal; transform: scale(1.05); } .ry-reco__producto-datos { max-width: 31ch; display: grid; justify-items: center; gap: 8px; } .ry-reco__producto-datos strong { font-family: var(--ry-serif); font-size: 1.07rem; font-weight: 500; line-height: 1.15; } .ry-reco__precio { width: max-content; padding: 6px 10px; border: 1px solid color-mix(in srgb, var(--ry-acento) 52%, var(--ry-linea)); border-radius: 999px; background: var(--ry-superficie); color: var(--ry-texto); font-size: 10px; } .ry-reco__productos--doble { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: end; } .ry-reco__productos--doble .ry-reco__foto { width: min(100%, 166px); height: 180px; } .ry-reco__productos--doble .ry-reco__producto-datos strong { display: -webkit-box; overflow: hidden; font-size: .89rem; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .ry-reco__sin-resultado { max-width: 28ch; margin: auto; color: var(--ry-texto-2); text-align: center; } @media (min-width: 580px) { .ry-reco__encabezado { grid-template-columns: minmax(190px, .75fr) minmax(330px, 1.25fr); align-items: end; } .ry-reco__opciones--muchas { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ry-reco__opciones--muchas .ry-reco__opcion:last-child:nth-child(3n + 2) { width: auto; grid-column: 2; justify-self: stretch; } } @media (min-width: 760px) { .ry-reco { padding-block: 64px 44px; scroll-margin-top: 84px; } .ry-reco__tarjeta { grid-template-columns: minmax(0, 1.78fr) minmax(310px, .92fr); } .ry-reco__consulta { padding: 30px 32px 25px; } .ry-reco__panel { min-height: 500px; padding: 32px 28px; border-top: 0; border-left: 1px solid var(--ry-linea); } .ry-reco__opcion { min-height: 164px; } .ry-reco__opcion-media { height: 108px; } .ry-reco__opciones--muchas .ry-reco__opcion { min-height: 136px; } .ry-reco__opciones--muchas .ry-reco__opcion-media { height: 89px; } .ry-reco__opcion-texto strong { font-size: 12px; } .ry-reco__cargando-ilustracion { width: 100%; height: 285px; } .ry-reco__foto { width: min(100%, 250px); height: 280px; } } @media (min-width: 1100px) { .ry-reco__tarjeta { grid-template-columns: minmax(0, 2.02fr) minmax(360px, .98fr); } .ry-reco__consulta { padding: 34px 38px 29px; } .ry-reco__encabezado { grid-template-columns: minmax(240px, .82fr) minmax(390px, 1.18fr); gap: 28px; } .ry-reco__titulo { font-size: 3.25rem; } .ry-reco__modo { min-height: 73px; } .ry-reco__pregunta legend { font-size: 1.98rem; } .ry-reco__opcion { min-height: 172px; padding-inline: 11px; } .ry-reco__opcion-media { height: 114px; } .ry-reco__opciones--muchas { grid-template-columns: repeat(5, minmax(0, 1fr)); } .ry-reco__opciones--muchas .ry-reco__opcion, .ry-reco__opciones--muchas .ry-reco__opcion:last-child:nth-child(3n + 2), .ry-reco__opciones--muchas .ry-reco__opcion:last-child:nth-child(odd) { width: auto; min-height: 148px; grid-column: auto; justify-self: stretch; } .ry-reco__opciones--muchas .ry-reco__opcion-media { height: 96px; } .ry-reco__panel { padding: 36px 32px; } } @media (prefers-reduced-motion: reduce) { .ry-reco__barra i, .ry-reco__opcion, .ry-reco__opcion-media img { transition: none; } .ry-reco__cargando-ilustracion, .ry-reco__cargando-puntos i { animation: none; } }  .ry-reco__cesion { margin: 0 0 12px; padding: 10px 12px; display: flex; gap: 8px; border-inline-start: 3px solid var(--ry-acento); border-radius: 0 8px 8px 0; background: color-mix(in srgb, var(--ry-acento) 7%, transparent); color: var(--ry-texto); font-size: 12.5px; line-height: 1.4; text-wrap: pretty; }   .ry-divisor-correa {  --correa: 46px; position: relative; z-index: 10; height: 0; overflow: visible; pointer-events: none; } .ry-divisor-correa__banda { position: absolute; top: 0; width: 100%; height: var(--correa); display: block;  background: url("/wp-content/themes/racionya/assets/images/divisor-correa-banda.webp") center bottom / auto calc(var(--correa) * 120 / 114.3) repeat-x; transform: translateY(-50%); } .ry-divisor-correa__herrajes { position: absolute;  top: calc(var(--correa) * 1.4 / 169); left: 50%; width: auto; height: calc(var(--correa) * 255 / 169); max-width: none; display: block; opacity: 1; transform: translate(-50%, -50%); -webkit-mask-image: linear-gradient( 90deg, transparent 8%, black 10.5%, black 89.5%, transparent 92% ); mask-image: linear-gradient( 90deg, transparent 8%, black 10.5%, black 89.5%, transparent 92% ); } @media (max-width: 767px) { .ry-divisor-correa { --correa: 32px; } }   .ry-especie { --ry-mundo-fondo: #0d2d21; --ry-mundo-panel: #153d2d; --ry-mundo-texto: #fff7ea; --ry-mundo-muted: #d8cbbc; --ry-mundo-cobre: #dc8050; --ry-mundo-linea: rgb(255 247 234 / .17); position: relative; scroll-margin-top: 116px; background: var(--ry-mundo-fondo); color: var(--ry-mundo-texto); } .ry-especie--gato { --ry-mundo-fondo: #0a281d; --ry-mundo-panel: #123828; --ry-mundo-cobre: #d9905d; border-top: 1px solid var(--ry-mundo-linea); } .ry-especie__mundo { padding-block: 32px 18px; }  .ry-franja { min-height: 196px; position: relative; display: flex; align-items: center; overflow: hidden; border: 1px solid color-mix(in srgb, var(--ry-mundo-cobre) 32%, transparent); border-radius: 20px; background: radial-gradient( circle at 86% 92%, color-mix(in srgb, var(--ry-mundo-cobre) 9%, transparent), transparent 43% ), var(--ry-mundo-panel); color: var(--ry-mundo-texto); isolation: isolate; text-decoration: none; }  .ry-franja > img { height: 90%; width: auto; max-width: 49%; position: absolute; right: clamp(14px, 3vw, 34px); bottom: 0; object-fit: contain; object-position: bottom right; transition: transform 260ms cubic-bezier(.23, 1, .32, 1); } .ry-especie--perro .ry-franja > img { right: clamp(12px, 2.8vw, 30px); } .ry-especie--gato .ry-franja > img { height: 93%; right: clamp(16px, 3vw, 34px); } .ry-franja:hover > img { transform: translateY(-2px) scale(1.012); } .ry-franja__texto { max-width: 54%; padding: 20px 22px; } .ry-franja__texto small, .ry-franja__texto strong, .ry-franja__texto > span { display: block; } .ry-franja__texto small { color: var(--ry-mundo-cobre); font-family: var(--ry-serif); font-size: 17px; font-style: italic; line-height: 1; } .ry-franja__texto strong { margin-top: 1px; font-family: var(--ry-serif); font-size: clamp(3rem, 15vw, 4.6rem); font-weight: 500; letter-spacing: -.04em; line-height: .88; } .ry-franja__texto > span { max-width: 20ch; margin-top: 9px; color: var(--ry-mundo-muted); font-size: 13px; line-height: 1.45; text-wrap: pretty; }  .ry-mosaico { margin-top: 14px; display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; } .ry-mosaico__pieza { min-height: 108px; position: relative; display: flex; align-items: center; overflow: hidden; border: 1px solid var(--ry-mundo-linea); border-radius: 10px; background: rgb(0 0 0 / .16); color: var(--ry-mundo-texto); text-decoration: none; transition: border-color 200ms ease, background-color 200ms ease, transform 200ms ease; } .ry-mosaico__pieza:hover { border-color: color-mix(in srgb, var(--ry-mundo-cobre) 70%, transparent); background: rgb(0 0 0 / .08); transform: translateY(-2px); } .ry-mosaico__pieza:active { transform: translateY(1px); } .ry-mosaico__pieza:focus-visible { outline-color: var(--ry-mundo-cobre); }  .ry-mosaico__pieza > img { width: auto; height: 104px; max-width: 48%; margin: 0 7px 0 auto; flex: 0 0 auto; align-self: center; object-fit: contain; object-position: center; transition: transform 320ms cubic-bezier(.2, .8, .2, 1); } .ry-mosaico__pieza:hover > img { transform: translateY(-3px) scale(1.03); } .ry-mosaico__texto { min-width: 0; padding: 14px 6px 14px 16px; } .ry-mosaico__texto strong, .ry-mosaico__texto small { display: block; } .ry-mosaico__texto strong { font-size: 15px; font-weight: 650; line-height: 1.2; text-wrap: balance; } .ry-mosaico__texto small { margin-top: 4px; color: var(--ry-mundo-muted); font-size: 12px; line-height: 1.35; text-wrap: pretty; } .ry-mosaico__accion { margin-top: 11px; display: inline-flex; align-items: center; gap: 7px; color: var(--ry-mundo-cobre); font-size: 11px; font-weight: 700; letter-spacing: .01em; } .ry-mosaico__accion .ry-i { width: 14px; height: 14px; transition: transform 200ms ease; } .ry-mosaico__pieza:hover .ry-mosaico__accion .ry-i { transform: translateX(3px); }  .ry-categorias { margin-top: 14px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; } .ry-categoria { padding: 10px 10px 12px; display: flex; flex-direction: column; gap: 9px; border: 1px solid var(--ry-mundo-linea); border-radius: 12px; background: rgb(255 255 255 / .055); color: var(--ry-mundo-texto); text-decoration: none; transition: background-color 180ms ease, border-color 180ms ease, transform 180ms ease; } .ry-categoria:hover { border-color: color-mix(in srgb, var(--ry-mundo-cobre) 68%, transparent); background: rgb(255 255 255 / .09); transform: translateY(-2px); } .ry-categoria:active { transform: translateY(1px); } .ry-categoria:focus-visible { outline-color: var(--ry-mundo-cobre); } .ry-categoria__campo { aspect-ratio: 1 / 1; display: grid; place-items: center; overflow: hidden; border-radius: 8px; background: var(--ry-campo-foto); } .ry-categoria__campo img { width: 100%; height: 100%; padding: 7px; object-fit: contain; mix-blend-mode: multiply; transition: transform 320ms cubic-bezier(.2, .8, .2, 1); } .ry-categoria:hover .ry-categoria__campo img { transform: scale(1.05); } .ry-categoria__nombre { display: block; font-size: 12px; font-weight: 600; line-height: 1.25; text-wrap: balance; overflow-wrap: break-word; } .ry-panel .ry-categorias--panel { margin-top: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } .ry-panel .ry-categorias--panel-salud { grid-template-columns: repeat(3, minmax(0, 1fr)); } @media (max-width: 359px) { .ry-categorias { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ry-panel .ry-categorias--panel-salud { grid-template-columns: repeat(2, minmax(0, 1fr)); } }  .ry-especie__productos { padding-block: 22px 30px; } .ry-especie__productos .ry-cabecera-seccion { margin-bottom: 18px; } .ry-especie__productos-titulo { max-width: 12ch; margin: 0; color: var(--ry-mundo-texto); font-family: var(--ry-serif); font-size: clamp(2rem, 9vw, 3rem); font-weight: 500; letter-spacing: -.025em; line-height: .98; text-wrap: balance; } .ry-especie .ry-vertodo { border-color: color-mix(in srgb, var(--ry-mundo-cobre) 62%, transparent); background: rgb(255 255 255 / .08); color: var(--ry-mundo-texto); } .ry-especie .ry-vertodo:hover, .ry-especie .ry-vertodo:focus-visible { border-color: var(--ry-mundo-cobre); background: var(--ry-mundo-cobre); color: #173629; }  .ry-especie__productos > .ry-riel { display: flex; gap: 12px; overflow-x: auto; padding-top: 4px; padding-bottom: 18px;  scroll-snap-type: x proximity; overflow-anchor: none; } .ry-especie__productos > .ry-riel > .ry-ficha { --ry-superficie: #fffaf2; --ry-texto: #15362a; --ry-texto-2: #6b6259; --ry-linea: #ded6ca; --ry-acento: #b65328; --ry-precio: #a84824; --ry-fuerte: #14382b; --ry-fuerte-texto: #fffaf2; width: min(72vw, 274px); flex: 0 0 min(72vw, 274px); border-color: var(--ry-linea); background: var(--ry-superficie); color: var(--ry-texto); scroll-snap-align: start; } .ry-especie__productos > .ry-riel > .ry-ficha:first-child { width: min(calc(100vw - 72px), 336px); flex-basis: min(calc(100vw - 72px), 336px); } .ry-especie__productos > .ry-riel > .ry-ficha:first-child .ry-ficha__campo { aspect-ratio: 4 / 3; } .ry-especie__productos > .ry-riel > .ry-ficha:first-child .ry-ficha__titulo { font-size: 16px; -webkit-line-clamp: 3; } .ry-especie__productos > .ry-riel > .ry-ficha:first-child .ry-ficha__precio { font-size: 25px; } @media (min-width: 620px) { .ry-mosaico { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ry-mosaico__pieza { min-height: 132px; } } @media (min-width: 760px) { .ry-especie { scroll-margin-top: 84px; } .ry-especie__mundo { padding-block: 44px 22px; } .ry-franja { min-height: 216px; } .ry-franja > img { height: 92%; max-width: 43%; } .ry-especie--gato .ry-franja > img { height: 95%; } .ry-franja__texto { max-width: 56%; padding: 26px clamp(30px, 4vw, 52px); } .ry-franja__texto small { font-size: 20px; } .ry-franja__texto strong { font-size: clamp(3.6rem, 6vw, 5rem); } .ry-franja__texto > span { max-width: 34ch; margin-top: 11px; font-size: 15px; } .ry-mosaico { margin-top: 12px; gap: 12px; } .ry-mosaico__pieza { min-height: 152px; } .ry-mosaico__pieza > img { height: 120px; } .ry-mosaico__texto strong { font-size: 17px; } }  .ry-motion .ry-especie__mundo:not(.is-visible) .ry-franja, .ry-motion .ry-especie__mundo:not(.is-visible) .ry-mosaico__pieza { opacity: 0; transform: translateY(8px); } .ry-motion .ry-especie__mundo:not(.is-visible) .ry-franja > img, .ry-motion .ry-especie__mundo:not(.is-visible) .ry-mosaico__pieza > img { opacity: 0; transform: translateY(6px) scale(.985); } .ry-motion .ry-especie__mundo.is-visible .ry-franja { animation: ry-mundo-entra 270ms cubic-bezier(.23, 1, .32, 1) backwards; } .ry-motion .ry-especie__mundo.is-visible .ry-franja > img { animation: ry-mundo-arte-entra 290ms 30ms cubic-bezier(.23, 1, .32, 1) backwards; } .ry-motion .ry-especie__mundo.is-visible .ry-mosaico__pieza { animation: ry-mundo-entra 260ms cubic-bezier(.23, 1, .32, 1) backwards; } .ry-motion .ry-especie__mundo.is-visible .ry-mosaico__pieza > img { animation: ry-mundo-arte-entra 280ms cubic-bezier(.23, 1, .32, 1) backwards; } .ry-motion .ry-especie__mundo.is-visible .ry-mosaico__pieza:nth-child(1) { animation-delay: 35ms; } .ry-motion .ry-especie__mundo.is-visible .ry-mosaico__pieza:nth-child(1) > img { animation-delay: 55ms; } .ry-motion .ry-especie__mundo.is-visible .ry-mosaico__pieza:nth-child(2) { animation-delay: 70ms; } .ry-motion .ry-especie__mundo.is-visible .ry-mosaico__pieza:nth-child(2) > img { animation-delay: 90ms; } .ry-motion .ry-especie__mundo.is-visible .ry-mosaico__pieza:nth-child(3) { animation-delay: 105ms; } .ry-motion .ry-especie__mundo.is-visible .ry-mosaico__pieza:nth-child(3) > img { animation-delay: 125ms; } @keyframes ry-mundo-entra { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } } @keyframes ry-mundo-arte-entra { from { opacity: 0; transform: translateY(6px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } } @media (min-width: 1024px) { .ry-especie__productos { padding-block: 26px 42px; } .ry-especie__productos > .ry-riel { gap: 16px; } .ry-especie__productos > .ry-riel > .ry-ficha { width: clamp(216px, 18vw, 236px); flex-basis: clamp(216px, 18vw, 236px); } .ry-especie__productos > .ry-riel > .ry-ficha:first-child { width: clamp(300px, 25vw, 332px); flex-basis: clamp(300px, 25vw, 332px); } } @media (prefers-reduced-motion: reduce) { .ry-categoria, .ry-categoria:hover, .ry-categoria:active, .ry-categoria:hover .ry-categoria__campo img, .ry-mosaico__pieza, .ry-mosaico__pieza:hover, .ry-mosaico__pieza:active, .ry-mosaico__pieza:hover > img, .ry-mosaico__pieza:hover .ry-mosaico__accion .ry-i, .ry-franja:hover > img { animation: none; opacity: 1; transition: none; transform: none; } .ry-motion .ry-especie__mundo:not(.is-visible) .ry-franja, .ry-motion .ry-especie__mundo:not(.is-visible) .ry-franja > img, .ry-motion .ry-especie__mundo:not(.is-visible) .ry-mosaico__pieza, .ry-motion .ry-especie__mundo:not(.is-visible) .ry-mosaico__pieza > img, .ry-motion .ry-especie__mundo.is-visible .ry-franja, .ry-motion .ry-especie__mundo.is-visible .ry-franja > img, .ry-motion .ry-especie__mundo.is-visible .ry-mosaico__pieza, .ry-motion .ry-especie__mundo.is-visible .ry-mosaico__pieza > img { animation: none; opacity: 1; transform: none; } }   .ry-testimonios { position: relative; padding-block: clamp(48px, 6vw, 76px) clamp(54px, 6.5vw, 86px); overflow: clip; border-top: 1px solid var(--ry-linea); background: radial-gradient(circle at 7% 20%, color-mix(in srgb, var(--ry-acento) 7%, transparent) 0, transparent 26rem), var(--ry-fondo); } .ry-testimonios__intro { display: grid; gap: 18px; align-items: end; } .ry-testimonios__intro .ry-titulo { max-width: 11ch; } .ry-testimonios__bajada { max-width: 35rem; } .ry-testimonios__bajada p { max-width: 35ch; margin: 0; color: var(--ry-texto-2); font-family: var(--ry-serif); font-size: clamp(1.12rem, 3.8vw, 1.42rem); letter-spacing: -.02em; line-height: 1.12; text-wrap: balance; } .ry-testimonios__movil { margin-top: 28px; margin-inline: calc(var(--ry-margen) * -1); padding: 4px var(--ry-margen) 12px; display: flex; gap: 12px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-padding-inline: var(--ry-margen);  scroll-snap-type: x proximity;  overflow-anchor: none; scrollbar-width: none; -webkit-overflow-scrolling: touch; }  .ry-testimonios__movil:focus-visible { outline: 2px solid var(--ry-acento); outline-offset: -4px; border-radius: 12px; } .ry-testimonios__movil::-webkit-scrollbar { display: none; } .ry-testimonios__movil .ry-testimonio { width: min(82vw, 306px); min-height: 268px; flex: 0 0 auto; scroll-snap-align: start; } .ry-testimonios__muro { display: none; } .ry-testimonio { position: relative; padding: 20px; display: flex; flex-direction: column; justify-content: space-between; gap: 22px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--ry-linea) 88%, transparent); border-radius: 14px; background: color-mix(in srgb, var(--ry-superficie) 92%, transparent); box-shadow: 0 18px 38px color-mix(in srgb, var(--ry-texto) 6%, transparent), inset 0 1px 0 color-mix(in srgb, var(--ry-superficie) 92%, transparent); color: var(--ry-texto); transition: border-color 220ms ease, box-shadow 220ms ease, transform 220ms ease; } .ry-testimonio::before { content: "“"; position: absolute; top: -10px; right: 17px; color: color-mix(in srgb, var(--ry-acento) 12%, transparent); font-family: var(--ry-serif); font-size: 6.8rem; font-style: italic; line-height: 1; pointer-events: none; } .ry-testimonio:hover, .ry-testimonio:focus-visible { border-color: color-mix(in srgb, var(--ry-acento) 42%, var(--ry-linea)); box-shadow: 0 23px 46px color-mix(in srgb, var(--ry-texto) 9%, transparent), inset 0 1px 0 color-mix(in srgb, var(--ry-superficie) 94%, transparent); transform: translateY(-5px); } .ry-testimonio:focus-visible { outline: 2px solid var(--ry-acento); outline-offset: 3px; } .ry-testimonio--destacado { border-color: color-mix(in srgb, var(--ry-contraste-txt) 15%, transparent); background: radial-gradient(circle at 90% 8%, color-mix(in srgb, var(--ry-acento) 16%, transparent), transparent 12rem), var(--ry-contraste); color: var(--ry-contraste-txt); } .ry-testimonio--destacado::before { color: color-mix(in srgb, var(--ry-acento) 25%, transparent); } .ry-testimonio__estrellas { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 2px; color: var(--ry-acento); font-size: 14px; letter-spacing: .03em; line-height: 1; } .ry-testimonio blockquote { position: relative; z-index: 1; margin: 12px 0 0; } .ry-testimonio blockquote > p { margin: 0; color: color-mix(in srgb, var(--ry-texto) 84%, transparent); font-family: var(--ry-serif); font-size: clamp(1rem, 2vw, 1.13rem); letter-spacing: -.015em; line-height: 1.35; text-wrap: pretty; } .ry-testimonio--destacado blockquote > p { color: color-mix(in srgb, var(--ry-contraste-txt) 92%, transparent); font-size: clamp(1.08rem, 2vw, 1.22rem); } .ry-testimonio footer { position: relative; z-index: 1; display: flex; align-items: center; gap: 12px; } .ry-testimonio footer img { width: 48px; height: 48px; flex: 0 0 auto; border: 2px solid color-mix(in srgb, var(--ry-superficie) 82%, transparent); border-radius: 13px; object-fit: cover; box-shadow: 0 5px 15px color-mix(in srgb, var(--ry-texto) 12%, transparent); } .ry-testimonio--destacado footer img { border-color: color-mix(in srgb, var(--ry-contraste-txt) 28%, transparent); } .ry-testimonio footer div { min-width: 0; } .ry-testimonio cite { display: block; color: inherit; font-size: 13px; font-style: normal; font-weight: 700; line-height: 1.3; } .ry-testimonio footer small { margin-top: 3px; display: block; color: color-mix(in srgb, var(--ry-texto-2) 88%, transparent); font-size: 10px; line-height: 1.35; } .ry-testimonio--destacado footer small { color: color-mix(in srgb, var(--ry-contraste-txt) 63%, transparent); } @media (min-width: 700px) { .ry-testimonios__intro { grid-template-columns: minmax(0, 1.15fr) minmax(260px, .7fr); gap: clamp(40px, 6vw, 78px); } .ry-testimonios__bajada { padding-bottom: 4px; } .ry-testimonios__movil { display: none; } .ry-testimonios__muro { height: 520px; margin-top: 36px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; overflow: hidden; mask-image: linear-gradient(to bottom, transparent, #000 8%, #000 92%, transparent); -webkit-mask-image: linear-gradient(to bottom, transparent, #000 8%, #000 92%, transparent); } .ry-testimonios__columna { min-width: 0; overflow: hidden; } .ry-testimonios__columna--3 { display: none; } .ry-testimonios__pista { display: grid; gap: 14px; will-change: transform; } .ry-testimonios__grupo { display: grid; gap: 14px; } .ry-testimonios__columna:hover .ry-testimonios__pista, .ry-testimonios__columna:focus-within .ry-testimonios__pista { animation-play-state: paused; } .ry-testimonio { padding: 22px; } } @media (min-width: 1024px) { .ry-testimonios__muro { height: 550px; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } .ry-testimonios__columna--3 { display: block; } .ry-testimonios__pista, .ry-testimonios__grupo { gap: 16px; } .ry-testimonio { padding: 23px; } } @media (prefers-reduced-motion: no-preference) and (min-width: 700px) { .ry-testimonios.is-visible .ry-testimonios__pista { animation: ry-testimonios-suben var(--ry-testimonios-duracion, 31s) linear infinite; animation-delay: var(--ry-testimonios-retraso, 0s); } @keyframes ry-testimonios-suben { from { transform: translateY(0); } to { transform: translateY(calc(-50% - 7px)); } } } @media (prefers-reduced-motion: no-preference) and (min-width: 1024px) { @keyframes ry-testimonios-suben { from { transform: translateY(0); } to { transform: translateY(calc(-50% - 8px)); } } } @media (prefers-reduced-motion: reduce) and (min-width: 700px) { .ry-testimonios__muro { height: auto; overflow: visible; mask-image: none; -webkit-mask-image: none; } .ry-testimonios__pista > .ry-testimonios__grupo[aria-hidden="true"] { display: none; } .ry-testimonio:hover, .ry-testimonio:focus-visible { transform: none; } }   .ry-comunidad { --ry-envio-violeta: hsl(269 35% 43%); --ry-envio-violeta-claro: hsl(270 42% 94%); --ry-envio-verde: hsl(154 45% 20%); --ry-envio-dorado: hsl(41 76% 54%); padding-block: 58px 64px; overflow: clip; border-block: 1px solid var(--ry-linea); background: radial-gradient(circle at 84% 7%, color-mix(in srgb, var(--ry-envio-dorado) 11%, transparent), transparent 24%), linear-gradient(180deg, color-mix(in srgb, var(--ry-fondo) 92%, white), var(--ry-fondo)); color: var(--ry-texto); } .ry-comunidad__intro { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; } .ry-comunidad__intro .ry-titulo { max-width: 15ch; color: var(--ry-texto); font-size: clamp(2.55rem, 11vw, 4.25rem); } .ry-comunidad__intro .ry-titulo em { color: var(--ry-acento); } .ry-comunidad__intro p { margin: 12px 0 0; color: var(--ry-texto-2); font-family: var(--ry-serif); font-size: clamp(1.08rem, 4.5vw, 1.45rem); line-height: 1.2; } .ry-comunidad__intro p em { color: var(--ry-envio-violeta); font-style: italic; } .ry-comunidad__sello { width: 98px; height: 98px; flex: 0 0 98px; display: none; place-items: center; align-content: center; gap: 4px; border: 1px solid color-mix(in srgb, var(--ry-envio-dorado) 75%, var(--ry-linea)); border-radius: 50%; color: color-mix(in srgb, var(--ry-envio-dorado) 76%, var(--ry-texto)); text-align: center; transform: rotate(7deg); } .ry-comunidad__sello .ry-i { width: 26px; height: 26px; stroke-width: 1.2; } .ry-comunidad__sello span { font-family: var(--ry-mono); font-size: 6px; font-weight: 700; letter-spacing: .08em; line-height: 1.35; text-transform: uppercase; } .ry-comunidad__rutas { margin-top: 30px; display: grid; gap: 14px; } .ry-ruta { min-width: 0; display: grid; overflow: hidden; border: 1px solid color-mix(in srgb, var(--ry-acento) 34%, var(--ry-linea)); border-radius: 18px; background: var(--ry-superficie); box-shadow: 0 18px 46px color-mix(in srgb, var(--ry-texto) 8%, transparent); } .ry-ruta__datos { position: relative; min-width: 0; padding: 25px 22px 23px; } .ry-ruta__numero { position: absolute; top: 0; right: 18px; min-width: 38px; padding: 7px 8px 11px; display: grid; place-items: center; background: var(--ry-envio-violeta); color: white; clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 82%, 0 100%); font-size: 10px; font-weight: 700; letter-spacing: .08em; } .ry-ruta__datos h3 { max-width: 10ch; margin: 0; font-family: var(--ry-serif); font-size: clamp(2.25rem, 10vw, 3.1rem); font-weight: 500; letter-spacing: -.045em; line-height: .9; } .ry-ruta__tipo { margin: 17px 0 0; display: flex; align-items: center; gap: 9px; color: var(--ry-envio-violeta); font-size: 13px; font-weight: 750; } .ry-ruta__pictograma { width: 35px; height: 35px; flex: 0 0 35px; display: grid; place-items: center; border: 1px solid color-mix(in srgb, currentColor 42%, transparent); border-radius: 10px; background: color-mix(in srgb, currentColor 8%, var(--ry-superficie)); } .ry-ruta__pictograma .ry-i { width: 24px; height: 24px; stroke-width: 1.8; } .ry-ruta__pictograma--violeta { color: var(--ry-envio-violeta); } .ry-ruta__pictograma--caja { color: color-mix(in srgb, var(--ry-envio-dorado) 74%, var(--ry-texto)); } .ry-ruta__datos ul { margin: 16px 0 0; padding: 15px 0 0; display: grid; gap: 11px; border-top: 1px solid var(--ry-linea); list-style: none; } .ry-ruta__datos li { min-width: 0; display: grid; grid-template-columns: 25px minmax(0, 1fr); align-items: start; gap: 8px; color: var(--ry-texto-2); font-size: 10px; line-height: 1.35; } .ry-ruta__datos li > .ry-i { width: 23px; height: 23px; padding: 3px; border: 1px solid color-mix(in srgb, var(--ry-envio-verde) 35%, var(--ry-linea)); border-radius: 50%; color: var(--ry-envio-verde); stroke-width: 1.8; } .ry-ruta__datos li > span { display: grid; gap: 1px; } .ry-ruta__datos li strong { color: var(--ry-texto); font-size: 11px; font-weight: 700; } .ry-ruta__mini-recorrido { margin-top: 16px; padding-top: 13px; display: flex; align-items: center; gap: 7px; border-top: 1px solid var(--ry-linea); } .ry-ruta__mini-recorrido span { min-width: 0; display: inline-grid; justify-items: center; gap: 2px; color: var(--ry-texto-2); font-family: var(--ry-mono); font-size: 6px; font-weight: 700; letter-spacing: .02em; line-height: 1.1; white-space: nowrap; } .ry-ruta__mini-recorrido span .ry-i { width: 22px; height: 22px; padding: 2px; color: var(--ry-envio-dorado); stroke-width: 2; } .ry-ruta__mini-recorrido b { position: relative; min-width: 24px; height: 12px; flex: 1 1 auto; display: block; border-top: 2px dotted var(--ry-envio-verde); } .ry-ruta__mini-recorrido b > i { position: absolute; top: -5px; left: 50%; width: 8px; height: 8px; border: 2px solid var(--ry-superficie); border-radius: 50%; background: var(--ry-envio-dorado); box-shadow: 0 0 0 1px var(--ry-envio-dorado); transform: translateX(-50%); } .ry-ruta__mini-recorrido--agencia b { border-color: var(--ry-envio-violeta); } .ry-ruta__foto { position: relative; height: 290px; margin: 0; overflow: hidden; background: var(--ry-superficie-2); } .ry-ruta__foto::after { position: absolute; inset: 0; border: 1px solid color-mix(in srgb, white 30%, transparent); box-shadow: inset 0 0 38px color-mix(in srgb, var(--ry-texto) 13%, transparent); content: ""; pointer-events: none; } .ry-ruta__foto img { width: 100%; height: 100%; object-fit: cover; transition: transform 600ms cubic-bezier(.22, .72, .25, 1); } .ry-ruta:hover .ry-ruta__foto img { transform: scale(1.025); } .ry-ruta:first-child .ry-ruta__foto img { object-position: 52% 48%; } .ry-ruta:last-child .ry-ruta__foto img { object-position: 50% 50%; } .ry-ruta__nota { margin: 0; padding: 12px 16px; display: flex; align-items: center; justify-content: center; gap: 7px; border-top: 1px solid color-mix(in srgb, var(--ry-envio-violeta) 22%, var(--ry-linea)); background: color-mix(in srgb, var(--ry-envio-violeta) 4%, var(--ry-superficie)); color: color-mix(in srgb, var(--ry-envio-violeta) 78%, var(--ry-texto)); font-family: var(--ry-serif); font-size: 12px; font-style: italic; line-height: 1.25; text-align: center; } .ry-ruta__nota .ry-i { width: 18px; height: 18px; flex: 0 0 auto; color: var(--ry-envio-dorado); } .ry-comunidad__garantia { margin-top: 17px; padding: 18px; display: grid; gap: 0; border: 1px solid color-mix(in srgb, var(--ry-acento) 32%, var(--ry-linea)); border-radius: 17px; background: radial-gradient(circle at 88% 15%, color-mix(in srgb, var(--ry-envio-dorado) 8%, transparent), transparent 24%), var(--ry-superficie); box-shadow: 0 15px 38px color-mix(in srgb, var(--ry-texto) 6%, transparent); } .ry-comunidad__garantia-copy { display: grid; grid-template-columns: 43px minmax(0, 1fr); align-items: center; gap: 11px; } .ry-comunidad__escudo { width: 43px; height: 43px; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--ry-envio-dorado) 60%, var(--ry-linea)); border-radius: 50%; background: color-mix(in srgb, var(--ry-envio-dorado) 18%, var(--ry-superficie)); color: var(--ry-envio-verde); } .ry-comunidad__escudo .ry-i { width: 21px; height: 21px; stroke-width: 2; } .ry-comunidad__garantia p { min-width: 0; margin: 0; } .ry-comunidad__garantia p strong, .ry-comunidad__garantia p span { display: block; } .ry-comunidad__garantia p strong { font-family: var(--ry-serif); font-size: 20px; font-weight: 500; letter-spacing: -.02em; line-height: 1; } .ry-comunidad__garantia p span { margin-top: 5px; color: var(--ry-texto-2); font-size: 10px; line-height: 1.45; } @media (min-width: 700px) { .ry-comunidad { padding-block: 70px 76px; } .ry-comunidad__sello { display: grid; } .ry-comunidad__rutas { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ry-ruta__foto { height: 330px; } .ry-comunidad__garantia { grid-template-columns: minmax(0, 1fr); align-items: center; } } @media (min-width: 980px) { .ry-ruta { grid-template-columns: minmax(250px, .95fr) minmax(0, 1.05fr); grid-template-rows: minmax(350px, 1fr) auto; } .ry-ruta__datos { padding: 30px 25px 25px; } .ry-ruta__datos h3 { font-size: clamp(2.45rem, 3.35vw, 3.05rem); } .ry-ruta__foto { height: 100%; min-height: 350px; } .ry-ruta__nota { grid-column: 1 / -1; } .ry-comunidad__garantia { grid-template-columns: minmax(0, 1fr); padding: 20px 22px; } } @media (min-width: 1180px) { .ry-comunidad { padding-block: 78px 84px; } .ry-comunidad__rutas { gap: 16px; } .ry-ruta { grid-template-columns: minmax(270px, .96fr) minmax(0, 1.04fr); } .ry-ruta__datos { padding: 34px 28px 28px; } .ry-ruta__datos li { font-size: 11px; } .ry-ruta__datos li strong { font-size: 12px; } .ry-ruta__mini-recorrido span { font-size: 7px; } } @media (prefers-reduced-motion: reduce) { .ry-ruta__foto img, .ry-ruta:hover .ry-ruta__foto img { transition: none; transform: none; } }  .ry-repetir { position: relative; padding-block: 70px; overflow: hidden; border-top: 1px solid var(--ry-linea); background: radial-gradient(circle at 92% 14%, color-mix(in srgb, var(--ry-acento) 12%, transparent), transparent 36%), var(--ry-superficie-2); scroll-margin-top: 116px; } .ry-repetir__grilla { display: grid; gap: 24px; } .ry-repetir .ry-titulo { max-width: 12ch; } .ry-repetir p { max-width: 48ch; margin: 18px 0 25px; color: var(--ry-texto-2); }  .ry-repetir__nota { max-width: 34ch; margin: 0; font-size: 13px; line-height: 1.6; text-wrap: pretty; } .ry-confianza { padding-block: 34px; background: var(--ry-contraste); color: var(--ry-contraste-txt); scroll-margin-top: 116px; } .ry-confianza__grilla { display: grid; } .ry-confianza__item { min-height: 74px; padding-block: 15px; display: grid; grid-template-columns: 32px minmax(0, 1fr); align-items: center; gap: 13px; border-bottom: 1px solid color-mix(in srgb, var(--ry-contraste-txt) 14%, transparent); } .ry-confianza__item:last-child { border-bottom: 0; } .ry-confianza__item > .ry-i { width: 26px; height: 26px; color: #E67A42; } .ry-confianza__item span, .ry-confianza__item strong, .ry-confianza__item small { display: block; } .ry-confianza__item strong { font-size: 14px; font-weight: 600; } .ry-confianza__item small { margin-top: 2px; color: color-mix(in srgb, var(--ry-contraste-txt) 68%, transparent); font-size: 12px; } @media (min-width: 768px) { .ry-repetir { padding-block: 92px; scroll-margin-top: 84px; } .ry-repetir__grilla { grid-template-columns: minmax(0, 1fr) minmax(0, .62fr); align-items: center; gap: clamp(40px, 6vw, 80px); } .ry-repetir__nota { padding-left: clamp(24px, 3vw, 40px); border-left: 1px solid var(--ry-linea); font-size: 14px; } .ry-confianza { scroll-margin-top: 84px; } .ry-confianza__grilla { grid-template-columns: repeat(2, 1fr); gap: 0 30px; } .ry-confianza__item:nth-last-child(-n + 2) { border-bottom: 0; } } @media (min-width: 1100px) { .ry-confianza { padding-block: 42px; } .ry-confianza__grilla { grid-template-columns: repeat(4, 1fr); gap: 0; } .ry-confianza__item { min-height: 82px; padding: 8px 24px; border-right: 1px solid color-mix(in srgb, var(--ry-contraste-txt) 14%, transparent); border-bottom: 0; } .ry-confianza__item:first-child { padding-left: 0; } .ry-confianza__item:last-child { padding-right: 0; border-right: 0; } }   .ry-magazine { padding-block: clamp(62px, 8vw, 108px); border-top: 1px solid color-mix(in srgb, var(--ry-linea) 76%, transparent); background: radial-gradient(circle at 8% 8%, color-mix(in srgb, var(--ry-acento) 8%, transparent) 0, transparent 27rem), color-mix(in srgb, var(--ry-fondo) 82%, var(--ry-superficie)); } .ry-magazine__cabecera { margin-block-end: clamp(28px, 4vw, 42px); display: grid; gap: 16px; } .ry-magazine__kicker { margin: 0 0 9px; color: var(--ry-acento); font-family: var(--ry-mono); font-size: 10px; font-weight: 750; letter-spacing: .14em; text-transform: uppercase; } .ry-magazine__cabecera h2 { max-width: 13ch; margin: 0; font-family: var(--ry-serif); font-size: clamp(2.45rem, 7vw, 4.9rem); font-weight: 500; letter-spacing: -.045em; line-height: .94; text-wrap: balance; } .ry-magazine__cabecera h2 em { color: var(--ry-acento); font-style: italic; font-weight: inherit; } .ry-magazine__bajada { max-width: 41ch; margin: 0; color: var(--ry-texto-2); font-size: 14px; line-height: 1.58; text-wrap: pretty; } .ry-magazine__todos { width: fit-content; min-height: 44px; padding-inline: 15px 12px; display: inline-flex; align-items: center; gap: 9px; border: 1px solid color-mix(in srgb, var(--ry-acento) 32%, var(--ry-linea)); border-radius: 999px; background: var(--ry-superficie); color: var(--ry-texto); font-size: 12px; font-weight: 700; text-decoration: none; transition: border-color 170ms ease, background-color 170ms ease, color 170ms ease; } .ry-magazine__todos .ry-i, .ry-magazine__leer .ry-i { inline-size: 15px; block-size: 15px; } .ry-magazine__todos:hover, .ry-magazine__todos:focus-visible { border-color: var(--ry-acento); background: var(--ry-acento); color: var(--ry-acento-texto); } .ry-magazine__grilla { margin-inline: calc(var(--ry-margen) * -1); padding: 2px var(--ry-margen) 18px; display: flex; gap: 12px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-padding-inline: var(--ry-margen); scroll-snap-type: x proximity; scrollbar-width: none; -webkit-overflow-scrolling: touch; } .ry-magazine__grilla::-webkit-scrollbar { display: none; } .ry-magazine__tarjeta { min-width: min(84vw, 340px); flex: 0 0 min(84vw, 340px); overflow: hidden; display: flex; flex-direction: column; border: 1px solid color-mix(in srgb, var(--ry-linea) 92%, transparent); border-radius: 18px; background: var(--ry-superficie); box-shadow: 0 16px 44px color-mix(in srgb, var(--ry-contraste) 7%, transparent); scroll-snap-align: start; transition: border-color 190ms ease, box-shadow 190ms ease, transform 230ms cubic-bezier(.23, 1, .32, 1); } .ry-magazine__tarjeta:hover { border-color: color-mix(in srgb, var(--ry-acento) 36%, var(--ry-linea)); box-shadow: 0 23px 58px color-mix(in srgb, var(--ry-contraste) 12%, transparent); transform: translateY(-3px); } .ry-magazine__imagen { position: relative; aspect-ratio: 4 / 3; overflow: hidden; display: block; background: var(--ry-superficie-2); text-decoration: none; } .ry-magazine__imagen img { inline-size: 100%; block-size: 100%; object-fit: cover; transition: transform 600ms cubic-bezier(.23, 1, .32, 1); } .ry-magazine__tarjeta:hover .ry-magazine__imagen img { transform: scale(1.025); } .ry-magazine__contenido { padding: 20px; display: flex; flex: 1; flex-direction: column; align-items: flex-start; } .ry-magazine__meta { width: 100%; margin: 0 0 12px; display: flex; align-items: center; justify-content: space-between; gap: 12px; } .ry-magazine__meta > span { padding: 5px 9px; border-radius: 999px; background: color-mix(in srgb, var(--ry-acento) 9%, var(--ry-superficie)); color: var(--ry-acento); font-size: 9px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; } .ry-magazine__meta small { display: inline-flex; align-items: center; gap: 5px; color: var(--ry-texto-2); font-family: var(--ry-mono); font-size: 9px; } .ry-magazine__meta small .ry-i { inline-size: 13px; block-size: 13px; } .ry-magazine__contenido h3 { margin: 0; font-family: var(--ry-serif); font-size: clamp(1.48rem, 4vw, 2rem); font-weight: 500; letter-spacing: -.025em; line-height: 1.05; text-wrap: balance; } .ry-magazine__contenido h3 a { color: inherit; text-decoration: none; } .ry-magazine__contenido > p:not(.ry-magazine__meta) { margin: 12px 0 19px; color: var(--ry-texto-2); font-size: 12.5px; line-height: 1.55; text-wrap: pretty; } .ry-magazine__leer { min-height: 42px; margin-block-start: auto; padding-inline: 14px 11px; display: inline-flex; align-items: center; gap: 9px; border-radius: 999px; background: var(--ry-contraste); color: var(--ry-contraste-txt); font-size: 11px; font-weight: 700; text-decoration: none; transition: background-color 170ms ease, transform 170ms ease; } .ry-magazine__leer:hover, .ry-magazine__leer:focus-visible { background: var(--ry-acento-hondo); color: #fff; } .ry-magazine__leer:active { transform: translateY(1px); }  .ry-magazine-articulo { max-width: 900px; margin-inline: auto; } .ry-magazine-articulo .ry-page-header { max-width: 780px; margin-inline: auto; text-align: center; } .ry-magazine-articulo .ry-kicker { display: flex; align-items: center; justify-content: center; gap: 12px; } .ry-magazine-articulo .ry-kicker > span { padding: 5px 9px; border-radius: 999px; background: color-mix(in srgb, var(--ry-copper) 9%, var(--ry-white)); color: var(--ry-copper-deep); } .ry-magazine-articulo .ry-kicker small { display: inline-flex; align-items: center; gap: 5px; color: var(--ry-muted); font: inherit; } .ry-magazine-articulo .ry-kicker .ry-i { inline-size: 14px; block-size: 14px; } .ry-magazine-articulo__portada { max-width: 900px; margin: clamp(26px, 5vw, 46px) auto; overflow: hidden; border-radius: 20px; box-shadow: 0 22px 64px color-mix(in srgb, var(--ry-forest) 14%, transparent); } .ry-magazine-articulo__portada img { inline-size: 100%; aspect-ratio: 4 / 3; object-fit: cover; } .ry-magazine-articulo .ry-prose { max-width: 72ch; margin-inline: auto; } .ry-magazine-articulo .ry-prose > p:first-child { color: var(--ry-forest); font-family: var(--ry-serif); font-size: clamp(1.3rem, 3vw, 1.65rem); line-height: 1.35; } .ry-magazine-articulo .ry-prose a { padding-inline: 2px; border-radius: 3px; background: color-mix(in srgb, var(--ry-copper) 10%, transparent); color: var(--ry-copper-deep); font-weight: 650; text-decoration: none; } @media (min-width: 760px) { .ry-magazine__cabecera { grid-template-columns: minmax(0, 1fr) minmax(260px, .52fr) auto; align-items: end; column-gap: clamp(28px, 5vw, 70px); } .ry-magazine__todos { align-self: end; } .ry-magazine__grilla { margin-inline: 0; padding: 2px 0; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 16px; overflow: visible; } .ry-magazine__tarjeta { min-width: 0; flex: initial; } .ry-magazine__tarjeta--principal { grid-row: 1 / span 2; } .ry-magazine__tarjeta:not(.ry-magazine__tarjeta--principal) { display: grid; grid-template-columns: minmax(132px, 42%) minmax(0, 1fr); } .ry-magazine__tarjeta:not(.ry-magazine__tarjeta--principal) .ry-magazine__imagen { block-size: 100%; aspect-ratio: auto; } .ry-magazine__tarjeta:not(.ry-magazine__tarjeta--principal) .ry-magazine__contenido { padding: 18px; } .ry-magazine__tarjeta:not(.ry-magazine__tarjeta--principal) .ry-magazine__contenido h3 { font-size: clamp(1.2rem, 2vw, 1.55rem); } .ry-magazine__tarjeta:not(.ry-magazine__tarjeta--principal) .ry-magazine__contenido > p:not(.ry-magazine__meta) { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } } @media (prefers-reduced-motion: reduce) { .ry-magazine__tarjeta, .ry-magazine__imagen img, .ry-magazine__leer { transition: none; } .ry-magazine__tarjeta:hover, .ry-magazine__tarjeta:hover .ry-magazine__imagen img { transform: none; } }   .ry-pie { position: relative; padding-bottom: calc(100px + env(safe-area-inset-bottom)); overflow: clip; border-top: 1px solid color-mix(in srgb, var(--ry-contraste-txt) 16%, transparent); background: radial-gradient(circle at 92% 4%, color-mix(in srgb, var(--ry-acento) 12%, transparent) 0, transparent 29rem), var(--ry-contraste); color: var(--ry-contraste-txt); } .ry-pie__llamado { padding-block: 42px 38px; display: grid; justify-items: center; gap: 28px; text-align: center; border-bottom: 1px solid color-mix(in srgb, var(--ry-contraste-txt) 15%, transparent); } .ry-pie__llamado > div > span, .ry-pie__atencion > span, .ry-pie__nav > div > strong { display: block; color: color-mix(in srgb, var(--ry-acento) 88%, var(--ry-contraste-txt)); font-family: var(--ry-mono); font-size: 10px; font-weight: 700; letter-spacing: .12em; line-height: 1.35; text-transform: uppercase; } .ry-pie__llamado h2 { max-width: 12ch; margin: 12px auto 0; font-family: var(--ry-serif); font-size: clamp(2.85rem, 13vw, 4.7rem); font-weight: 500; letter-spacing: -.045em; line-height: .9; text-wrap: balance; } .ry-pie__llamado h2 em { color: var(--ry-acento); font-style: italic; font-weight: inherit; } .ry-pie__repetir, .ry-pie__atencion button { min-height: 52px; padding-inline: 18px; display: inline-flex; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid var(--ry-acento); border-radius: 9px; background: var(--ry-acento); color: var(--ry-acento-texto); font-size: 13px; font-weight: 700; cursor: pointer; touch-action: manipulation; transition: border-color 180ms ease, background-color 180ms ease, transform 180ms ease; } .ry-pie__repetir { width: min(100%, 310px); min-height: 56px; justify-content: center; font-size: 14px; text-align: center; text-decoration: none; } .ry-pie__repetir .ry-i, .ry-pie__atencion button .ry-i { width: 19px; height: 19px; } .ry-pie__repetir:hover, .ry-pie__atencion button:hover { border-color: var(--ry-acento-hondo); background: var(--ry-acento-hondo); } .ry-pie__repetir:active, .ry-pie__atencion button:active { transform: translateY(1px) scale(.99); } .ry-pie__superior { padding-block: 38px 4px; display: grid; gap: 30px; } .ry-pie__identidad { min-width: 0; } .ry-pie__marca { width: fit-content; display: inline-block; text-decoration: none; } .ry-pie__marca img { width: auto; height: clamp(49px, 13vw, 61px); } .ry-pie__identidad p { max-width: 28ch; margin: 17px 0 0; color: color-mix(in srgb, var(--ry-contraste-txt) 76%, transparent); font-size: 13px; line-height: 1.55; } .ry-pie__identidad address { margin-top: 14px; color: color-mix(in srgb, var(--ry-contraste-txt) 54%, transparent); font-size: 12px; font-style: normal; line-height: 1.55; }  .ry-pie__nav { padding-block: 24px; display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); column-gap: 22px; row-gap: 24px; border-block: 1px solid color-mix(in srgb, var(--ry-contraste-txt) 14%, transparent); } .ry-pie__nav > div { min-width: 0; display: grid; align-content: start; } .ry-pie__nav > div > strong { margin-bottom: 8px; } .ry-pie__nav a, .ry-pie__nav button { min-width: 0; min-height: 44px; padding: 0; display: flex; align-items: center; border: 0; background: transparent; color: color-mix(in srgb, var(--ry-contraste-txt) 84%, transparent); font: inherit; font-size: 13px; font-weight: 500; text-align: left; text-decoration: none; cursor: pointer; transition: color 180ms ease, transform 180ms ease; } .ry-pie__nav a:hover, .ry-pie__nav button:hover { color: var(--ry-acento); transform: translateX(2px); } .ry-pie__atencion { align-self: start; } .ry-pie__atencion h3 { margin: 8px 0 0; font-family: var(--ry-serif); font-size: clamp(1.65rem, 7vw, 2.1rem); font-weight: 500; letter-spacing: -.03em; line-height: 1; } .ry-pie__atencion p { margin: 10px 0 16px; color: color-mix(in srgb, var(--ry-contraste-txt) 68%, transparent); font-size: 12px; line-height: 1.5; } .ry-pie__atencion button { width: 100%; } .ry-pie__legal { margin-top: 34px; padding-top: 18px; display: flex; flex-wrap: wrap; align-items: center; gap: 0 17px; border-top: 1px solid color-mix(in srgb, var(--ry-contraste-txt) 14%, transparent); color: color-mix(in srgb, var(--ry-contraste-txt) 53%, transparent); font-family: var(--ry-mono); font-size: 9px; letter-spacing: .02em; line-height: 1.4; } .ry-pie__legal span { flex: 0 0 100%; margin-bottom: 5px; } .ry-pie__legal button { min-height: 44px; padding: 0; border: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; transition: color 180ms ease; } .ry-pie__legal button:hover { color: var(--ry-contraste-txt); } .ry-pie__legal small { flex: 0 0 100%; margin-top: 8px; color: inherit; font: inherit; } @media (min-width: 700px) { .ry-pie { padding-bottom: calc(58px + env(safe-area-inset-bottom)); } .ry-pie__llamado { padding-block: 50px 44px; gap: 30px; } .ry-pie__repetir { width: min(100%, 320px); min-width: 280px; } .ry-pie__superior { padding-top: 44px; grid-template-columns: minmax(220px, 1.15fr) minmax(260px, 1fr); align-items: start; column-gap: 56px; } .ry-pie__nav { padding-block: 0; border-block: 0; } .ry-pie__atencion { grid-column: 2; padding-top: 25px; border-top: 1px solid color-mix(in srgb, var(--ry-contraste-txt) 14%, transparent); } .ry-pie__atencion button { width: auto; min-width: 224px; } .ry-pie__legal span { flex-basis: auto; margin: 0 7px 0 0; } .ry-pie__legal small { flex-basis: auto; margin: 0 0 0 auto; } } @media (min-width: 1024px) { .ry-pie__llamado { padding-block: 58px 50px; } .ry-pie__llamado h2 { font-size: clamp(4.2rem, 6vw, 5.5rem); } .ry-pie__repetir { min-width: 300px; margin-bottom: 0; } .ry-pie__superior { padding-top: 50px; grid-template-columns: minmax(230px, .95fr) minmax(390px, 1.15fr) minmax(240px, .74fr); gap: clamp(48px, 6.5vw, 92px); } .ry-pie__nav { grid-template-columns: repeat(3, minmax(108px, 1fr)); column-gap: 22px; } .ry-pie__atencion { grid-column: auto; padding: 0 0 0 30px; border-top: 0; border-left: 1px solid color-mix(in srgb, var(--ry-contraste-txt) 14%, transparent); } .ry-pie__atencion button { width: 100%; min-width: 0; } .ry-pie__legal { margin-top: 42px; padding-right: 86px; } } @media (prefers-reduced-motion: reduce) { .ry-pie__nav a:hover, .ry-pie__nav button:hover, .ry-pie__repetir:active, .ry-pie__atencion button:active { transform: none; } }    .ry-suma { margin: 14px 18px 4px; padding: 14px; border: 1px solid color-mix(in srgb, var(--ry-acento) 18%, var(--ry-linea)); border-radius: 14px; background: color-mix(in srgb, var(--ry-acento) 3%, var(--ry-superficie)); } .ry-suma__titulo { margin: 0 0 10px; color: var(--ry-texto-2); font-family: var(--ry-sans, inherit); font-size: 12px; font-weight: 700; letter-spacing: .01em; line-height: 1.3; } .ry-suma__lista { margin: 0; padding: 0; display: grid; gap: 8px; list-style: none; } .ry-suma__item { display: grid; grid-template-columns: 44px minmax(0, 1fr) 36px; align-items: center; gap: 10px; padding: 7px 8px; border: 1px solid var(--ry-linea); border-radius: 11px; background: var(--ry-superficie); } .ry-suma__enlace { display: block; aspect-ratio: 1; overflow: hidden; border-radius: 8px; background: var(--ry-fondo); } .ry-suma__enlace img { inline-size: 100%; block-size: 100%; object-fit: contain; } .ry-suma__info { min-inline-size: 0; display: grid; gap: 2px; } .ry-suma__nombre { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: var(--ry-texto); font-size: 11.5px; font-weight: 600; line-height: 1.25; text-decoration: none; } .ry-suma__nombre:hover { color: var(--ry-acento); } .ry-suma__precio { color: var(--ry-precio); font-size: 12.5px; font-weight: 700; line-height: 1.2; }  .ry-suma__sumar { inline-size: 36px; block-size: 36px; display: grid; place-items: center; border: 1px solid var(--ry-acento); border-radius: 999px; background: transparent; color: var(--ry-acento); font-size: 19px; font-weight: 700; line-height: 1; text-decoration: none; transition: background-color 150ms ease, color 150ms ease; } .ry-suma__sumar:hover, .ry-suma__sumar:focus-visible { background: var(--ry-acento); color: var(--ry-acento-texto); } .ry-suma__sumar:focus-visible { outline: 2px solid var(--ry-acento); outline-offset: 2px; }  .ry-suma__sumar.loading { opacity: .6; pointer-events: none; } .ry-suma__sumar.added::after { content: "✓"; font-size: 15px; } .ry-suma__sumar.added { font-size: 0; }  .ry-suma .added_to_cart { display: none; }  .ry-suma-pagina .ry-suma { margin: 0; padding: 16px; border: 1px solid var(--ry-linea); border-radius: 13px; background: var(--ry-fondo); } @media (min-width: 720px) { .ry-suma-pagina .ry-suma__lista { grid-template-columns: repeat(3, minmax(0, 1fr)); } }  .ry-ultima { --ry-hot-rojo: hsl(11 68% 38%); margin-block: 16px; padding: 13px 14px 12px; border: 1px solid color-mix(in srgb, var(--ry-hot-rojo) 30%, transparent); border-radius: 13px; background: color-mix(in srgb, var(--ry-hot-rojo) 5%, var(--ry-superficie)); } .ry-ultima__rotulo { margin: 0 0 10px; display: flex; align-items: center; gap: 6px; color: var(--ry-hot-rojo); font-family: var(--ry-sans, inherit); font-size: 12px; font-weight: 700; letter-spacing: .03em; line-height: 1; text-transform: uppercase; } .ry-ultima__rotulo .ry-i { inline-size: 15px; block-size: 15px; } .ry-ultima__ficha { display: grid; grid-template-columns: 56px minmax(0, 1fr); align-items: center; gap: 11px; } .ry-ultima__foto { inline-size: 56px; block-size: 56px; border-radius: 9px; background: var(--ry-fondo); object-fit: contain; } .ry-ultima__texto { min-inline-size: 0; } .ry-ultima__nombre { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: var(--ry-texto); font-size: 13px; font-weight: 600; line-height: 1.25; text-decoration: none; } .ry-ultima__nombre:hover { color: var(--ry-acento); } @media (min-width: 700px) { .ry-carrito > .ry-suma { margin-inline: 24px; } } .ry-ultima__precios { margin: 4px 0 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 7px; } .ry-ultima__dto { padding: 2px 6px; border-radius: 6px; background: var(--ry-hot-rojo); color: hsl(40 54% 96%); font-family: var(--ry-font-mono, inherit); font-size: 11px; font-weight: 700; line-height: 1.3; font-variant-numeric: tabular-nums; } .ry-ultima__precios strong { color: var(--ry-precio); font-size: 15px; font-weight: 700; }  .ry-ultima__precios s { color: var(--ry-texto-2); font-size: 12px; text-decoration-thickness: 1px; }  .ry-ultima__sumar { grid-column: 1 / -1; min-block-size: 42px; margin-block-start: 10px; justify-content: center; font-size: 13px; } .ry-ultima__sumar.is-cargando { opacity: .6; }  .ry-ultima.is-sumado .ry-ultima__ficha { display: none; } .ry-ultima.is-sumado { border-color: color-mix(in srgb, var(--ry-forest, var(--ry-contraste)) 30%, transparent); background: color-mix(in srgb, var(--ry-contraste) 5%, var(--ry-superficie)); } .ry-ultima.is-sumado .ry-ultima__rotulo { color: var(--ry-texto-2); } .ry-ultima.is-sumado .ry-ultima__nota { margin-block-start: 0; font-weight: 600; } .ry-ultima__nota { margin: 9px 0 0; color: var(--ry-texto-2); font-size: 12px; line-height: 1.35; } .ry-ultima__nota:empty { display: none; } .ry-ultima__nota.is-error { color: var(--ry-hot-rojo); font-weight: 600; } @media (min-width: 420px) { .ry-ultima__ficha { grid-template-columns: 56px minmax(0, 1fr) auto; } .ry-ultima__sumar { grid-column: auto; margin-block-start: 0; padding-inline: 18px; } }   .ry-carrito .ry-suma { margin-block-start: 10px; padding-block-start: 11px; } .ry-carrito .ry-suma__titulo { margin-block-end: 8px; } .ry-carrito .ry-suma__lista { display: flex; gap: 8px; padding-block-end: 5px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: inline proximity; scrollbar-width: thin; } .ry-carrito .ry-suma__item { flex: 0 0 min(238px, 78%); scroll-snap-align: start; } .ry-ultima { padding: 14px; overflow: hidden; } .ry-ultima__cabecera { margin-block-end: 10px; display: flex; align-items: end; justify-content: space-between; gap: 12px; } .ry-ultima__cabecera .ry-ultima__rotulo { margin: 0 0 4px; } .ry-ultima__cabecera small { display: block; color: var(--ry-texto-2); font-size: 11px; line-height: 1.25; } .ry-ultima__controles { display: flex; gap: 6px; } .ry-ultima__controles button { inline-size: 34px; block-size: 34px; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--ry-hot-rojo) 32%, var(--ry-linea)); border-radius: 999px; background: var(--ry-superficie); color: var(--ry-hot-rojo); font-size: 16px; cursor: pointer; } .ry-ultima__controles button:hover, .ry-ultima__controles button:focus-visible { border-color: var(--ry-hot-rojo); background: var(--ry-hot-rojo); color: #fff; } .ry-ultima__ventana { margin-inline-end: -14px; overflow: hidden; } .ry-ultima__carril { display: flex; gap: 10px; padding-inline-end: 14px; padding-block-end: 5px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: inline mandatory; scrollbar-width: thin; } .ry-ultima__ficha { flex: 0 0 min(310px, 88%); grid-template-columns: 58px minmax(0, 1fr); align-content: center; padding: 10px; border: 1px solid color-mix(in srgb, var(--ry-hot-rojo) 18%, var(--ry-linea)); border-radius: 11px; background: var(--ry-superficie); scroll-snap-align: start; } .ry-ultima__sumar { grid-column: 1 / -1; min-block-size: 38px; margin-block-start: 7px; } .ry-ultima.is-completo .ry-ultima__ventana, .ry-ultima.is-completo .ry-ultima__controles { display: none; } .ry-ultima.is-completo { border-color: color-mix(in srgb, var(--ry-forest, var(--ry-contraste)) 30%, transparent); background: color-mix(in srgb, var(--ry-contraste) 5%, var(--ry-superficie)); } .ry-ultima.is-completo .ry-ultima__nota { margin-block-start: 0; font-weight: 600; } @media (min-width: 420px) { .ry-ultima__ficha { grid-template-columns: 58px minmax(0, 1fr); } .ry-ultima__sumar { grid-column: 1 / -1; margin-block-start: 7px; } }    .woocommerce-cart .ry-prose > *, .woocommerce-checkout .ry-prose > * { max-width: none; }  .woocommerce-cart .ry-prose, .woocommerce-checkout .ry-prose { color: var(--ry-texto); }  .woocommerce-cart .ry-content__inner, .woocommerce-checkout .ry-content__inner { max-width: 1120px; }  .woocommerce-cart .ry-page-header h1, .woocommerce-checkout .ry-page-header h1 { font-size: clamp(2rem, 4vw, 3rem); }  .woocommerce-cart .ry-prose a, .woocommerce-checkout .ry-prose a { text-decoration: none; } .woocommerce-cart .ry-prose a:hover { color: var(--ry-acento); }  .woocommerce-cart .woocommerce { display: grid; align-items: start; gap: 20px; } .ry-carrito-pagina__garantias { grid-column: 1 / -1; margin: 0 0 4px; padding: 9px; display: grid; gap: 8px; border: 1px solid color-mix(in srgb, var(--ry-acento) 16%, var(--ry-linea)); border-radius: 18px; background: color-mix(in srgb, var(--ry-acento) 3%, var(--ry-superficie)); } .ry-carrito-pagina__garantia { min-width: 0; padding: 11px 12px; display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; gap: 10px; border-radius: 12px; background: var(--ry-superficie); } .ry-carrito-pagina__garantia-icono { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: color-mix(in srgb, var(--ry-acento) 10%, var(--ry-fondo)); color: var(--ry-acento); } .ry-carrito-pagina__garantia-icono .ry-i { width: 18px; height: 18px; } .ry-carrito-pagina__garantia strong, .ry-carrito-pagina__garantia small { display: block; } .ry-carrito-pagina__garantia strong { font-size: 12px; line-height: 1.25; } .ry-carrito-pagina__garantia small { margin-top: 3px; color: var(--ry-texto-2); font-size: 9.5px; line-height: 1.35; } @media (min-width: 700px) { .ry-carrito-pagina__garantias { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (min-width: 900px) { .woocommerce-cart .woocommerce { grid-template-columns: minmax(0, 1.6fr) minmax(300px, .9fr); } .woocommerce-cart .woocommerce-notices-wrapper { grid-column: 1 / -1; } } .woocommerce table.shop_table.cart { inline-size: 100%; overflow: hidden; border-radius: var(--ry-r-superficie, 16px); }  @media (min-width: 720px) { .woocommerce table.shop_table.cart { table-layout: fixed; } .woocommerce table.shop_table.cart th.product-remove, .woocommerce table.shop_table.cart td.product-remove { inline-size: 56px; } .woocommerce table.shop_table.cart th.product-thumbnail, .woocommerce table.shop_table.cart td.product-thumbnail { inline-size: 84px; } .woocommerce table.shop_table.cart th.product-price, .woocommerce table.shop_table.cart td.product-price, .woocommerce table.shop_table.cart th.product-subtotal, .woocommerce table.shop_table.cart td.product-subtotal { inline-size: 116px; } .woocommerce table.shop_table.cart th.product-quantity, .woocommerce table.shop_table.cart td.product-quantity { inline-size: 96px; }  .woocommerce table.shop_table.cart th.product-name, .woocommerce table.shop_table.cart td.product-name { inline-size: auto; } } .woocommerce table.shop_table.cart th { color: var(--ry-texto-2); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }  .woocommerce table.shop_table.cart td.product-thumbnail img { inline-size: 64px; block-size: 64px; border-radius: 10px; background: var(--ry-fondo); object-fit: contain; } .woocommerce table.shop_table.cart td.product-name a { color: var(--ry-texto); font-size: 14px; font-weight: 600; line-height: 1.3; } .woocommerce table.shop_table.cart td.product-price, .woocommerce table.shop_table.cart td.product-subtotal { font-family: var(--ry-font-mono, inherit); font-variant-numeric: tabular-nums; } .woocommerce table.shop_table.cart td.product-subtotal { color: var(--ry-precio); font-weight: 700; }  .woocommerce table.shop_table.cart del, .woocommerce-checkout #order_review del { color: var(--ry-texto-2); opacity: 1; } .woocommerce table.shop_table.cart ins, .woocommerce-checkout #order_review ins, .ry-carrito ins { background: transparent; text-decoration: none; } .woocommerce table.shop_table.cart .quantity input.qty { inline-size: 68px; min-block-size: 44px; padding-inline: 6px; border: 1px solid var(--ry-linea); border-radius: 10px; background: var(--ry-superficie); font-family: var(--ry-font-mono, inherit); font-size: 15px; text-align: center; }  .woocommerce table.shop_table.cart td.product-remove a.remove { inline-size: 30px; block-size: 30px; display: grid; place-items: center; border: 1px solid var(--ry-linea); border-radius: 999px; background: var(--ry-superficie); color: var(--ry-texto-2); font-size: 17px; line-height: 1; transition: border-color 150ms ease, color 150ms ease, background-color 150ms ease; } .woocommerce table.shop_table.cart td.product-remove a.remove:hover { border-color: var(--ry-acento); background: var(--ry-acento); color: var(--ry-acento-texto); }  .woocommerce .actions .button[disabled], .woocommerce .actions .button:disabled { border: 1px solid var(--ry-linea); background: var(--ry-fondo); color: var(--ry-texto-2); opacity: 1; cursor: default; }  .woocommerce .cart .actions .button { white-space: nowrap; } .woocommerce .cart .actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; } .woocommerce .cart .actions .coupon { display: flex; flex-wrap: wrap; gap: 8px; } .woocommerce .cart .actions .coupon .input-text { inline-size: min(220px, 60vw); min-block-size: 46px; padding: 11px 12px; border: 1px solid var(--ry-linea); border-radius: 9px; } .woocommerce .cart_totals > h2, .woocommerce-checkout #order_review_heading { margin: 0 0 12px; font-family: var(--ry-serif); font-size: clamp(1.3rem, 3vw, 1.6rem); font-weight: 500; letter-spacing: -.02em; } .woocommerce .cart_totals table.shop_table { overflow: hidden; border-radius: var(--ry-r-superficie, 16px); } .woocommerce .cart_totals table.shop_table th { color: var(--ry-texto-2); font-size: 13px; font-weight: 600; } .woocommerce .cart_totals .order-total th, .woocommerce .cart_totals .order-total td { border-block-start: 1px solid var(--ry-linea); font-size: 16px; } .woocommerce .cart_totals .order-total td { color: var(--ry-precio); font-weight: 700; } .woocommerce .wc-proceed-to-checkout .checkout-button { inline-size: 100%; min-block-size: 52px; margin-block-start: 14px; background: var(--ry-acento); color: var(--ry-acento-texto); font-size: .92rem; } .woocommerce .wc-proceed-to-checkout .checkout-button:hover { background: var(--ry-acento-hondo); }  @media (max-width: 719px) { .woocommerce table.shop_table.cart thead { display: none; } .woocommerce table.shop_table.cart tbody tr.cart_item { position: relative; margin-block-end: 10px; padding: 12px 12px 12px 88px; display: block; min-block-size: 92px; border: 1px solid var(--ry-linea); border-radius: 13px; background: var(--ry-superficie); } .woocommerce table.shop_table.cart tbody tr.cart_item td { padding: 0; display: block; border: 0; text-align: start; } .woocommerce table.shop_table.cart td.product-thumbnail { position: absolute; inset-block-start: 12px; inset-inline-start: 12px; } .woocommerce table.shop_table.cart td.product-remove { position: absolute; inset-block-start: 10px; inset-inline-end: 10px; } .woocommerce table.shop_table.cart td.product-name { padding-inline-end: 36px; } .woocommerce table.shop_table.cart td.product-price::before, .woocommerce table.shop_table.cart td.product-subtotal::before { margin-inline-end: 6px; color: var(--ry-texto-2); font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; } .woocommerce table.shop_table.cart td.product-price::before { content: "Precio"; } .woocommerce table.shop_table.cart td.product-subtotal::before { content: "Subtotal"; } .woocommerce table.shop_table.cart td.product-quantity { margin-block-start: 8px; } }   @media (min-width: 860px) { .woocommerce-checkout .col2-set { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(260px, 1fr); align-items: start; gap: 28px; }  .woocommerce-checkout .col2-set::before, .woocommerce-checkout .col2-set::after { display: none; } .woocommerce-checkout .col2-set .col-1, .woocommerce-checkout .col2-set .col-2 { inline-size: auto; float: none; }  .woocommerce-checkout .col2-set .col-1 { grid-column: 1; } .woocommerce-checkout .col2-set .col-2 { grid-column: 2; }  .woocommerce-checkout .woocommerce-billing-fields__field-wrapper { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 16px; } .woocommerce-checkout .woocommerce-billing-fields__field-wrapper::before, .woocommerce-checkout .woocommerce-billing-fields__field-wrapper::after { display: none; } .woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row-wide, .woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row { grid-column: 1 / -1; inline-size: auto; float: none; } .woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row-first { grid-column: 1; } .woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row-last { grid-column: 2; } } .woocommerce-checkout .woocommerce-billing-fields > h3, .woocommerce-checkout .woocommerce-shipping-fields > h3, .woocommerce-checkout .woocommerce-additional-fields > h3 { margin: 0 0 14px; font-family: var(--ry-serif); font-size: 1.25rem; font-weight: 500; letter-spacing: -.02em; } .woocommerce-checkout .form-row > label { margin-block-end: 5px; display: block; color: var(--ry-texto-2); font-size: 12.5px; font-weight: 600; } .woocommerce-checkout .required { color: var(--ry-acento); text-decoration: none; }   .woocommerce-checkout select.country_to_state--single, #billing_country_field .woocommerce-input-wrapper > strong, #shipping_country_field .woocommerce-input-wrapper > strong, .woocommerce-checkout .form-row .woocommerce-input-wrapper > strong { display: block; padding: 12px; border: 1px dashed var(--ry-linea); border-radius: 9px; background: var(--ry-fondo); color: var(--ry-texto-2); font-size: 14px; font-weight: 600; }  #billing_country.country_to_state--single, #shipping_country.country_to_state--single { inline-size: 100%; block-size: auto; padding: 12px; border: 1px dashed var(--ry-linea); border-radius: 9px; background: var(--ry-fondo); color: var(--ry-texto-2); font-size: 14px; font-weight: 600; pointer-events: none; }  .woocommerce-checkout .woocommerce-shipping-fields > h3 { margin: 0; } .woocommerce-checkout .woocommerce-form__label-for-checkbox { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border: 1px solid var(--ry-linea); border-radius: 11px; background: var(--ry-superficie); cursor: pointer; font-family: var(--ry-sans, inherit); font-size: 14px; font-weight: 600; line-height: 1.3; } .woocommerce-checkout .woocommerce-form__label-for-checkbox:hover { border-color: color-mix(in srgb, var(--ry-acento) 42%, var(--ry-linea)); } .woocommerce-checkout input[type="checkbox"].woocommerce-form__input-checkbox, .woocommerce-checkout .woocommerce-form__label-for-checkbox input[type="checkbox"] { inline-size: 20px; block-size: 20px; margin: 0; flex: 0 0 auto; appearance: none; -webkit-appearance: none; border: 1.5px solid var(--ry-linea); border-radius: 6px; background: var(--ry-superficie); cursor: pointer; transition: background-color 140ms ease, border-color 140ms ease; } .woocommerce-checkout input[type="checkbox"]:checked { border-color: var(--ry-acento); background: var(--ry-acento);  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 8.5l3 3 6-6'/%3E%3C/svg%3E"); background-position: center; background-repeat: no-repeat; background-size: 14px; } .woocommerce-checkout input[type="checkbox"]:focus-visible { outline: 2px solid var(--ry-acento); outline-offset: 2px; }  .woocommerce-checkout #order_review { margin-block-start: 26px; padding: 18px; border: 1px solid var(--ry-linea); border-radius: var(--ry-r-superficie, 16px); background: var(--ry-superficie); } .woocommerce-checkout #order_review table.shop_table { border: 0; background: transparent; } .woocommerce-checkout #order_review table.shop_table th, .woocommerce-checkout #order_review table.shop_table td { padding-inline: 0; } .woocommerce-checkout #order_review .order-total th, .woocommerce-checkout #order_review .order-total td { font-size: 17px; } .woocommerce-checkout #order_review .order-total td { color: var(--ry-precio); font-weight: 700; } .woocommerce-checkout #payment { border-radius: 13px; background: var(--ry-fondo); } .woocommerce-checkout #payment ul.payment_methods { border-block-end: 1px solid var(--ry-linea); } .woocommerce-checkout #payment .place-order .button { inline-size: 100%; min-block-size: 54px; background: var(--ry-acento); color: var(--ry-acento-texto); font-size: .95rem; } .woocommerce-checkout #payment .place-order .button:hover { background: var(--ry-acento-hondo); }  .woocommerce-checkout form.checkout { display: grid; gap: 18px; } .woocommerce-checkout .woocommerce-billing-fields, .woocommerce-checkout .woocommerce-shipping-fields, .woocommerce-checkout .woocommerce-additional-fields { padding: clamp(16px, 2.4vw, 22px); border: 1px solid var(--ry-linea); border-radius: var(--ry-r-superficie, 16px); background: var(--ry-superficie); } .woocommerce-checkout .col2-set .col-2 { margin-block-start: 14px; } .woocommerce-checkout .woocommerce-billing-fields__field-wrapper { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 12px; } .woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row { min-inline-size: 0; } .woocommerce-checkout .form-row input.input-text, .woocommerce-checkout .form-row textarea, .woocommerce-checkout .form-row select, .woocommerce-checkout .select2-container .select2-selection--single { min-block-size: 46px; padding: 10px 12px; border: 1px solid var(--ry-linea); border-radius: 9px; background: var(--ry-fondo); color: var(--ry-texto); font-size: 14px; box-shadow: none; transition: border-color 150ms ease, box-shadow 150ms ease, background-color 150ms ease; } .woocommerce-checkout .form-row input.input-text:focus, .woocommerce-checkout .form-row textarea:focus, .woocommerce-checkout .form-row select:focus { border-color: var(--ry-acento); background: var(--ry-superficie); outline: 0; box-shadow: 0 0 0 3px color-mix(in srgb, var(--ry-acento) 13%, transparent); } .woocommerce-checkout .form-row[hidden] { display: none !important; }  .woocommerce-checkout #billing_country_field { display: none; } .woocommerce-checkout #billing_consumo_final_field { margin-block-end: 18px; padding-block-end: 18px; border-block-end: 1px solid var(--ry-linea); } .woocommerce-checkout #billing_consumo_final_field label { color: var(--ry-texto); font-size: 13px; } .woocommerce-checkout #order_review { margin-block-start: 0; box-shadow: 0 14px 36px color-mix(in srgb, var(--ry-contraste) 8%, transparent); } .woocommerce-checkout .ry-prose > p:first-child { margin-block: 0 4px; padding: 10px 13px; border-inline-start: 3px solid var(--ry-acento); border-radius: 0 8px 8px 0; background: color-mix(in srgb, var(--ry-acento) 7%, var(--ry-superficie)); color: var(--ry-texto-2); font-size: 12.5px; } @media (min-width: 640px) { .woocommerce-checkout .woocommerce-billing-fields__field-wrapper { grid-template-columns: repeat(2, minmax(0, 1fr)); } .woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row-wide { grid-column: 1 / -1; } .woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row-first { grid-column: 1; } .woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row-last { grid-column: 2; } } @media (min-width: 960px) { .woocommerce-checkout .ry-content__inner { max-width: 1180px; } .woocommerce-checkout form.checkout { grid-template-columns: minmax(0, 1.15fr) minmax(360px, .85fr); align-items: start; column-gap: 24px; } .woocommerce-checkout form.checkout > .col2-set { grid-column: 1; grid-row: 1 / span 2; display: block; } .woocommerce-checkout form.checkout > #order_review_heading { grid-column: 2; grid-row: 1; align-self: end; margin: 0; } .woocommerce-checkout form.checkout > #order_review { position: sticky; inset-block-start: 96px; grid-column: 2; grid-row: 2; } .woocommerce-checkout .col2-set .col-1, .woocommerce-checkout .col2-set .col-2 { inline-size: 100%; float: none; } }   .ry-recompra { padding-block: 56px 72px; } .ry-recompra__caja { max-width: 560px; } .ry-recompra__titulo { margin: 0 0 12px; font-family: var(--ry-serif); font-size: clamp(28px, 4vw, 38px); line-height: 1.15; color: var(--ry-texto); } .ry-recompra__bajada { margin: 0 0 8px; font-size: 16px; line-height: 1.55; color: var(--ry-texto); } .ry-recompra__ayuda { margin: 0 0 28px; font-size: 14px; color: var(--ry-texto-2); } .ry-recompra__form { display: grid; gap: 18px; padding: 24px; border: 1px solid var(--ry-linea); border-radius: var(--ry-r-superficie); background: var(--ry-superficie); } .ry-recompra__form .ry-campo { display: grid; gap: 6px; margin: 0; } .ry-recompra__form label { font-size: 14px; font-weight: 600; color: var(--ry-texto); } .ry-recompra__form input {  min-height: 48px; padding: 0 14px; border: 1px solid var(--ry-linea); border-radius: 10px; background: var(--ry-fondo); font-size: 16px; color: var(--ry-texto); } .ry-recompra__form input:focus-visible { outline: 2px solid var(--ry-acento); outline-offset: 1px; } .ry-recompra__form .ry-btn { min-height: 50px; justify-content: center; } .ry-recompra__pie { margin: 20px 0 0; font-size: 14px; color: var(--ry-texto-2); } .ry-recompra__pie a {  color: var(--ry-acento); border-bottom: 1px solid currentColor; padding-bottom: 1px; } .ry-recompra__pie a:hover, .ry-recompra__pie a:focus-visible { border-bottom-color: transparent; }   .ry-wa { position: fixed; right: calc(14px + env(safe-area-inset-right)); bottom: calc(14px + env(safe-area-inset-bottom)); z-index: 260; width: 54px; height: 54px; padding: 0; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--ry-fuerte-texto) 18%, transparent); border-radius: var(--ry-r-pastilla); background: var(--ry-fuerte); color: var(--ry-fuerte-texto); box-shadow: 0 12px 30px color-mix(in srgb, var(--ry-contraste) 26%, transparent), inset 0 1px 0 color-mix(in srgb, var(--ry-fuerte-texto) 14%, transparent); cursor: pointer; isolation: isolate; touch-action: manipulation; -webkit-tap-highlight-color: transparent; transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease; } .ry-wa .ry-i { width: 27px; height: 27px; } .ry-wa:hover { background: color-mix(in srgb, var(--ry-fuerte) 88%, var(--ry-acento)); box-shadow: 0 15px 34px color-mix(in srgb, var(--ry-contraste) 31%, transparent), inset 0 1px 0 color-mix(in srgb, var(--ry-fuerte-texto) 16%, transparent); transform: translateY(-2px); } .ry-wa:active { transform: translateY(1px) scale(.97); } .ry-wa:focus-visible { outline: 2px solid var(--ry-acento); outline-offset: 4px; } @media (min-width: 768px) { .ry-wa { right: calc(22px + env(safe-area-inset-right)); bottom: calc(22px + env(safe-area-inset-bottom)); width: 58px; height: 58px; } .ry-wa .ry-i { width: 29px; height: 29px; } } @media (max-height: 520px) { .ry-wa { width: 48px; height: 48px; } .ry-wa .ry-i { width: 24px; height: 24px; } } @media (prefers-reduced-motion: reduce) { .ry-wa, .ry-wa:hover, .ry-wa:active { transform: none; } }   .ry-ficha { width: min(76vw, 284px); min-height: 454px; padding: 10px; display: flex; flex-direction: column; position: relative; border: 1px solid var(--ry-linea); border-radius: var(--ry-r-superficie); background: var(--ry-superficie); transition: border-color 220ms ease, transform 220ms ease; } .ry-ficha:hover { border-color: color-mix(in srgb, var(--ry-acento) 46%, var(--ry-linea)); transform: translateY(-2px); } .ry-ficha__campo { aspect-ratio: 1 / 1; margin-bottom: 12px; display: grid; place-items: center; overflow: hidden; border-radius: 9px; background: var(--ry-campo-foto); } .ry-ficha__campo img { width: 100%; height: 100%; padding: 8px; object-fit: contain; mix-blend-mode: multiply; transition: transform 300ms cubic-bezier(.2, .8, .2, 1); } .ry-ficha:hover .ry-ficha__campo img { transform: scale(1.025); } .ry-ficha__chip { position: absolute; top: 18px; left: 18px; z-index: 1; padding: 4px 7px; border: 1px solid color-mix(in srgb, var(--ry-texto) 28%, var(--ry-linea)); border-radius: 4px; background: color-mix(in srgb, var(--ry-superficie) 93%, transparent); color: var(--ry-texto); font-family: var(--ry-mono); font-size: 10px; font-weight: 700; letter-spacing: .035em; } .ry-ficha__datos { min-height: 0; display: flex; flex: 1; flex-direction: column; } .ry-ficha__marca { margin: 0 0 3px; overflow: hidden; color: var(--ry-texto-2); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; } .ry-ficha__titulo { min-height: 2.6em; margin: 0 0 12px; display: -webkit-box; overflow: hidden; color: var(--ry-texto); font-size: 14px; font-weight: 600; line-height: 1.3; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .ry-ficha__precios { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px; } .ry-ficha__precio, .ry-ficha__antes, .ry-ficha__porkilo, .ry-ficha__ahorro { font-family: var(--ry-mono); font-variant-numeric: tabular-nums; } .ry-ficha__precio { color: var(--ry-precio); font-size: 21px; font-weight: 700; line-height: 1.1; } .ry-ficha__antes { color: var(--ry-texto-2); font-size: 11px; text-decoration: line-through; }  .ry-ficha__meta { min-height: 17px; margin-top: 5px; display: flex; align-items: baseline; justify-content: space-between; gap: 10px; } .ry-ficha__porkilo { color: var(--ry-texto-2); font-size: 11px; white-space: nowrap; } .ry-ficha__ahorro { color: var(--ry-acento); font-size: 11px; font-weight: 700; white-space: nowrap; } .ry-ficha__btn { width: 100%; margin-top: auto; padding-inline: 12px; border-radius: 8px; font-size: 13px; }  .ry-ficha--ancha { width: 100%; min-height: 0; display: grid; grid-template-columns: 108px minmax(0, 1fr); align-items: center; gap: 14px; } .ry-ficha--ancha .ry-ficha__campo { margin-bottom: 0; aspect-ratio: 1 / 1; } .ry-ficha--ancha .ry-ficha__chip { top: 16px; left: 16px; } .ry-ficha--ancha .ry-ficha__titulo { min-height: 0; -webkit-line-clamp: 3; } .ry-ficha--ancha .ry-ficha__btn { width: fit-content; min-height: 44px; margin-top: 12px; padding-inline: 22px; } @media (min-width: 480px) { .ry-ficha--ancha { grid-template-columns: 128px minmax(0, 1fr); } } .ry-ficha__btn[data-agregado] { border-color: var(--ry-fuerte); background: transparent; color: var(--ry-fuerte); } @media (min-width: 700px) { .ry-ficha { width: 254px; } } @media (min-width: 1024px) { .ry-ficha { width: auto; min-width: 0; min-height: 420px; } }  @media (min-width: 700px) { .ry-ficha--ancha { width: 100%; min-height: 0; } } @media (min-width: 1024px) { .ry-ficha--ancha { width: 100%; min-height: 0; } } @media (prefers-reduced-motion: reduce) { .ry-ficha:hover, .ry-ficha:hover .ry-ficha__campo img { transform: none; } }   .ry-pdp { --ry-pdp-borde: color-mix(in srgb, var(--ry-linea) 92%, var(--ry-texto) 8%); --ry-pdp-sombra: 0 20px 60px color-mix(in srgb, var(--ry-contraste) 8%, transparent); --ry-pdp-sombra-suave: 0 10px 34px color-mix(in srgb, var(--ry-contraste) 6%, transparent); } .ry-pdp main { overflow: clip; } .ry-pdp .ry-cabezal__logo { z-index: 3; } .ry-pdp__migas { min-height: 54px; padding-block: 15px 12px; display: flex; align-items: center; gap: 9px; overflow: hidden; color: var(--ry-texto-2); font-size: 11px; white-space: nowrap; } .ry-pdp__migas a { text-decoration: none; } .ry-pdp__migas a:hover { color: var(--ry-acento); } .ry-pdp__migas span:last-child { overflow: hidden; color: var(--ry-texto); text-overflow: ellipsis; } .ry-pdp__compra { padding-bottom: 54px; display: grid; gap: 32px; } .ry-pdp__galeria { min-width: 0; display: grid; grid-template-columns: 58px minmax(0, 1fr); gap: 10px; } .ry-pdp__miniaturas { display: grid; align-content: start; gap: 9px; } .ry-pdp__miniatura { width: 58px; aspect-ratio: 1; padding: 3px; display: grid; place-items: center; overflow: hidden; border: 1px solid var(--ry-pdp-borde); border-radius: 10px; background: var(--ry-superficie); cursor: pointer; transition: border-color 180ms ease, background-color 180ms ease, transform 180ms ease; } .ry-pdp__miniatura:hover { border-color: var(--ry-acento); background: color-mix(in srgb, var(--ry-acento) 4%, var(--ry-superficie)); } .ry-pdp__miniatura:active { transform: scale(.97); } .ry-pdp__miniatura[aria-current="true"] { border-color: var(--ry-acento); box-shadow: inset 0 0 0 1px var(--ry-acento); } .ry-pdp__miniatura img { width: 100%; height: 100%; object-fit: contain; } .ry-pdp__miniatura:nth-child(2) img { transform: scale(1.38) translateY(4%); } .ry-pdp__foto-principal { position: relative; min-height: 405px; display: grid; place-items: center; overflow: hidden; border: 1px solid color-mix(in srgb, var(--ry-linea) 65%, transparent); border-radius: 14px; background: radial-gradient(circle at 50% 72%, color-mix(in srgb, var(--ry-linea) 45%, transparent), transparent 35%), var(--ry-superficie-2); box-shadow: inset 0 1px 0 color-mix(in srgb, var(--ry-superficie) 92%, transparent); cursor: zoom-in; } .ry-pdp__foto-principal::after { content: ""; position: absolute; right: 15%; bottom: 7%; left: 15%; height: 16px; border-radius: 50%; background: color-mix(in srgb, var(--ry-contraste) 14%, transparent); filter: blur(13px); pointer-events: none; } .ry-pdp__foto-principal > img { position: relative; z-index: 1; width: min(92%, 560px); max-height: 385px; object-fit: contain; filter: drop-shadow(0 22px 18px color-mix(in srgb, var(--ry-contraste) 17%, transparent)); transform: scale(1); transition: transform 520ms cubic-bezier(.16, 1, .3, 1); } .ry-pdp__foto-principal[data-zoomed] { cursor: zoom-out; } .ry-pdp__foto-principal[data-zoomed] > img { transform: scale(1.32); } .ry-pdp__foto-principal[data-gallery-mode="detalle"] > img { transform: scale(1.28) translateY(5%); } .ry-pdp__favorito { position: absolute; top: 12px; right: 12px; z-index: 3; width: 44px; height: 44px; padding: 0; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--ry-linea) 80%, transparent); border-radius: 50%; background: color-mix(in srgb, var(--ry-superficie) 90%, transparent); color: var(--ry-texto); cursor: pointer; backdrop-filter: blur(8px); transition: color 180ms ease, background-color 180ms ease, transform 180ms ease; } .ry-pdp__favorito .ry-i { width: 21px; height: 21px; } .ry-pdp__favorito:hover, .ry-pdp__favorito[aria-pressed="true"] { background: var(--ry-acento); color: var(--ry-acento-texto); } .ry-pdp__favorito:active { transform: scale(.94); } .ry-pdp__favorito[aria-pressed="true"] .ry-i { fill: currentColor; } .ry-pdp__zoom-ayuda { position: absolute; right: 12px; bottom: 10px; z-index: 3; padding: 6px 9px; border-radius: 7px; background: color-mix(in srgb, var(--ry-superficie) 90%, transparent); color: var(--ry-texto-2); font-size: 9px; pointer-events: none; backdrop-filter: blur(8px); } .ry-pdp__venta { min-width: 0; } .ry-pdp__venta h1 { max-width: 13ch; margin: 0; font-family: var(--ry-serif); font-size: clamp(2.65rem, 12vw, 4.7rem); font-weight: 500; letter-spacing: -.045em; line-height: .92; text-wrap: balance; } .ry-pdp__venta h1 span { display: block; }  .ry-pdp__chips { margin: 12px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 7px; list-style: none; } .ry-pdp__chip { padding: 6px 12px 6px 10px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--ry-linea); border-radius: 999px; background: color-mix(in srgb, var(--ry-superficie-2) 55%, transparent); color: var(--ry-texto); font-size: 12.5px; font-weight: 600; line-height: 1.2; white-space: nowrap; } .ry-pdp__chip .ry-i { inline-size: 15px; block-size: 15px; flex: none; color: var(--ry-texto-2); } .ry-pdp__variantes { margin: 24px 0 0; padding: 20px 0 0; border: 0; border-top: 1px solid var(--ry-linea); } .ry-pdp__variantes legend { padding: 0; font-size: 13px; font-weight: 600; } .ry-pdp__variantes > div { margin-top: 11px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; } .ry-pdp__variantes button { min-width: 0; min-height: 48px; padding: 0 8px; border: 1px solid var(--ry-linea); border-radius: 9px; background: var(--ry-superficie); color: var(--ry-texto); font-family: var(--ry-mono); font-size: 11px; font-weight: 700; cursor: pointer; transition: border-color 180ms ease, background-color 180ms ease, color 180ms ease, transform 180ms ease; } .ry-pdp__variantes button:hover { border-color: var(--ry-texto); } .ry-pdp__variantes button:active { transform: scale(.98); } .ry-pdp__variantes button[aria-pressed="true"] { border-color: var(--ry-fuerte); background: var(--ry-fuerte); color: var(--ry-fuerte-texto); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ry-acento) 75%, transparent); } .ry-pdp__variantes > p { min-height: 17px; margin: 8px 0 0; color: var(--ry-texto-2); font-size: 10px; } .ry-pdp__precio { margin-top: 20px; display: flex; align-items: end; gap: 17px; } .ry-pdp__precio > strong { color: var(--ry-texto); font-family: var(--ry-serif); font-size: clamp(3.25rem, 15vw, 4.8rem); font-weight: 500; letter-spacing: -.04em; line-height: .82; } .ry-pdp__precio > span { padding-bottom: 2px; display: grid; gap: 4px; font-family: var(--ry-mono); font-size: 11px; line-height: 1.25; } .ry-pdp__precio b { color: var(--ry-texto); font-weight: 700; } .ry-pdp__precio em { color: var(--ry-acento); font-style: normal; font-weight: 700; } .ry-pdp__stock { margin: 18px 0 0; padding-bottom: 18px; display: flex; align-items: center; gap: 9px; border-bottom: 1px solid var(--ry-linea); color: var(--ry-texto); font-size: 13px; font-weight: 500; } .ry-pdp__stock > span { width: 21px; height: 21px; display: grid; place-items: center; border-radius: 50%; background: color-mix(in srgb, var(--ry-fuerte) 90%, var(--ry-acento)); color: var(--ry-fuerte-texto); } .ry-pdp__stock .ry-i { width: 13px; height: 13px; stroke-width: 2.2; } .ry-pdp__cantidad { margin-top: 18px; display: flex; align-items: center; justify-content: space-between; gap: 14px; } .ry-pdp__cantidad > span { font-size: 13px; font-weight: 600; } .ry-pdp__cantidad > div { min-width: 132px; height: 48px; display: grid; grid-template-columns: 44px minmax(32px, 1fr) 44px; align-items: center; border: 1px solid var(--ry-linea); border-radius: 9px; background: var(--ry-superficie); } .ry-pdp__cantidad button { width: 44px; height: 44px; padding: 0; display: grid; place-items: center; border: 0; background: transparent; cursor: pointer; } .ry-pdp__cantidad button:hover { color: var(--ry-acento); } .ry-pdp__cantidad button:disabled { color: var(--ry-linea); cursor: not-allowed; } .ry-pdp__cantidad .ry-i { width: 16px; height: 16px; } .ry-pdp__cantidad output { text-align: center; font-family: var(--ry-mono); font-size: 12px; font-weight: 700; } .ry-pdp__agregar { width: 100%; min-height: 54px; margin-top: 15px; font-size: 14px; } .ry-pdp__agregar[data-agregado] { background: color-mix(in srgb, var(--ry-fuerte) 78%, var(--ry-acento)); } .ry-pdp__plazo { min-height: 58px; margin-top: 11px; padding: 10px 12px; display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: center; gap: 11px; border: 1px solid color-mix(in srgb, var(--ry-acento) 28%, var(--ry-linea)); border-radius: 10px; background: color-mix(in srgb, var(--ry-acento) 4%, var(--ry-superficie)); color: var(--ry-texto); } .ry-pdp__plazo > .ry-i { width: 27px; height: 27px; color: var(--ry-acento); } .ry-pdp__plazo span, .ry-pdp__plazo strong, .ry-pdp__plazo small { display: block; } .ry-pdp__plazo strong { font-size: 11px; line-height: 1.25; } .ry-pdp__plazo small { margin-top: 2px; color: var(--ry-texto-2); font-size: 9px; line-height: 1.35; }  .ry-pdp__info, .ry-pdp__detalles { margin-bottom: 18px; padding-block: 34px; } .ry-pdp__info { border: 1px solid var(--ry-pdp-borde); border-radius: 14px; background: var(--ry-superficie); box-shadow: var(--ry-pdp-sombra-suave); } .ry-pdp__info-presentacion, .ry-pdp__atributos { padding-inline: 24px; } .ry-pdp__info h2, .ry-pdp__detalles h2, .ry-pdp__relacionados h2 { max-width: 12ch; margin: 0; font-family: var(--ry-serif); font-size: clamp(2.45rem, 10vw, 4.4rem); font-weight: 500; letter-spacing: -.04em; line-height: .94; text-wrap: balance; } .ry-pdp__acento { width: 44px; height: 2px; margin-top: 17px; display: block; background: var(--ry-acento); } .ry-pdp__info-presentacion > p, .ry-pdp__detalles-copia > p { margin: 16px 0 0; color: var(--ry-texto-2); font-size: 13px; } .ry-pdp__info-presentacion > img { width: 80%; max-width: 370px; max-height: 340px; margin: 20px auto 8px; object-fit: contain; filter: drop-shadow(0 20px 16px color-mix(in srgb, var(--ry-contraste) 14%, transparent)); } .ry-pdp__atributos { margin-top: 24px; } .ry-pdp__atributos dl { margin: 0; } .ry-pdp__atributos dl > div { min-height: 70px; padding-block: 10px; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(110px, .9fr); align-items: center; gap: 14px; border-bottom: 1px solid var(--ry-linea); } .ry-pdp__atributos dt { display: flex; align-items: center; gap: 10px; color: var(--ry-texto-2); font-size: 12px; } .ry-pdp__atributos dt > span, .ry-pdp__descripcion-corta > span { width: 38px; height: 38px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid var(--ry-linea); border-radius: 50%; color: var(--ry-texto); } .ry-pdp__atributos .ry-i, .ry-pdp__descripcion-corta .ry-i { width: 20px; height: 20px; } .ry-pdp__atributos dd { margin: 0; color: var(--ry-texto); font-size: 12px; font-weight: 600; text-align: right; } .ry-pdp__descripcion-corta { padding-block: 20px; display: flex; align-items: flex-start; gap: 12px; } .ry-pdp__descripcion-corta h3 { margin: 0; font-size: 14px; } .ry-pdp__descripcion-corta p { max-width: 37ch; margin: 6px 0 0; color: var(--ry-texto-2); font-size: 12px; line-height: 1.5; } .ry-pdp__descripcion-corta a { margin-top: 9px; display: inline-block; font-size: 12px; font-weight: 600; color: var(--ry-acento); text-decoration: none; } .ry-pdp__consulta { min-height: 74px; padding: 14px 16px; display: flex; align-items: center; gap: 13px; border: 1px solid var(--ry-linea); border-radius: 10px; color: var(--ry-texto); text-decoration: none; transition: border-color 180ms ease, background-color 180ms ease; } .ry-pdp__consulta:hover { border-color: var(--ry-acento); background: color-mix(in srgb, var(--ry-acento) 4%, var(--ry-superficie)); } .ry-pdp__consulta > .ry-i { width: 34px; height: 34px; flex: 0 0 auto; } .ry-pdp__consulta span { color: var(--ry-texto-2); font-size: 11px; } .ry-pdp__consulta strong { margin-top: 3px; display: block; color: var(--ry-texto); font-size: 12px; text-decoration: none; }  .ry-pdp__detalles { padding-inline: 24px; border: 1px solid var(--ry-pdp-borde); border-radius: 14px; background: var(--ry-superficie); box-shadow: var(--ry-pdp-sombra-suave); } .ry-pdp__acordeon { margin-top: 24px; border-top: 1px solid var(--ry-linea); } .ry-pdp__acordeon details { border-bottom: 1px solid var(--ry-linea); } .ry-pdp__acordeon summary { min-height: 56px; display: flex; align-items: center; justify-content: space-between; gap: 16px; color: var(--ry-texto); font-size: 13px; font-weight: 600; cursor: pointer; list-style: none; } .ry-pdp__acordeon summary::-webkit-details-marker { display: none; } .ry-pdp__acordeon summary .ry-i { width: 18px; height: 18px; flex: 0 0 auto; transition: transform 180ms cubic-bezier(.23, 1, .32, 1); } .ry-pdp__acordeon details[open] summary .ry-i { transform: rotate(180deg); } .ry-pdp__acordeon details > div { overflow: hidden; } .ry-pdp__acordeon details[open] > div { animation: ry-pdp-acordeon-entra 180ms cubic-bezier(.23, 1, .32, 1) both; } @keyframes ry-pdp-acordeon-entra { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } } .ry-pdp__acordeon details > div p { max-width: 54ch; margin: -3px 0 18px; color: var(--ry-texto-2); font-size: 12px; line-height: 1.55; } .ry-pdp__detalles-fotos { margin-top: 24px; display: none; } .ry-pdp__detalles-fotos figure { min-width: 0; min-height: 390px; margin: 0; display: grid; place-items: center; overflow: hidden; border-radius: 12px; background: radial-gradient(circle at 50% 68%, color-mix(in srgb, var(--ry-linea) 56%, transparent), transparent 42%), var(--ry-superficie-2); } .ry-pdp__detalles-fotos img { width: 94%; max-height: 380px; object-fit: contain; filter: drop-shadow(0 18px 16px color-mix(in srgb, var(--ry-contraste) 13%, transparent)); } .ry-pdp__detalles-fotos figure:nth-child(2) img { transform: scale(1.34) translateY(6%); }  .ry-pdp__relacionados { padding-block: 52px 64px; border-top: 1px solid var(--ry-linea); } .ry-pdp__relacionados-cabecera { position: relative; } .ry-pdp__relacionados-cabecera p { margin: 11px 0 0; color: var(--ry-texto-2); font-size: 13px; } .ry-pdp__relacionados-cabecera > a { margin-top: 15px; display: inline-block; font-size: 13px; font-weight: 600; color: var(--ry-acento); text-decoration: none; } .ry-pdp__carrusel-controles { position: absolute; right: 0; bottom: -2px; display: none; gap: 8px; } .ry-pdp__carrusel-controles button { width: 42px; height: 42px; padding: 0; display: grid; place-items: center; border: 1px solid var(--ry-linea); border-radius: 50%; background: var(--ry-superficie); color: var(--ry-texto); cursor: pointer; transition: border-color 180ms ease, color 180ms ease, transform 180ms ease; } .ry-pdp__carrusel-controles button:hover { border-color: var(--ry-acento); color: var(--ry-acento); } .ry-pdp__carrusel-controles button:active { transform: scale(.95); } .ry-pdp__carrusel-controles button:first-child .ry-i { transform: rotate(180deg); } .ry-pdp__carrusel-controles .ry-i { width: 18px; height: 18px; } .ry-pdp__productos { margin-top: 26px; padding: 2px var(--ry-margen) 12px; display: flex; gap: 11px; overflow-x: auto; scroll-padding-inline: var(--ry-margen);  scroll-snap-type: x proximity; overflow-anchor: none; scrollbar-width: none; margin-inline: calc(var(--ry-margen) * -1); } .ry-pdp__productos::-webkit-scrollbar { display: none; } .ry-pdp__producto { position: relative; flex: 0 0 min(76vw, 282px); min-width: 0; overflow: hidden; border: 1px solid var(--ry-pdp-borde); border-radius: 12px; background: var(--ry-superficie); scroll-snap-align: start; transition: border-color 220ms ease, transform 260ms cubic-bezier(.16, 1, .3, 1), box-shadow 220ms ease; } .ry-pdp__producto:hover { border-color: color-mix(in srgb, var(--ry-acento) 45%, var(--ry-linea)); box-shadow: var(--ry-pdp-sombra-suave); transform: translateY(-3px); } .ry-pdp__producto > span { position: absolute; top: 12px; left: 12px; z-index: 2; padding: 5px 8px; border: 1px solid color-mix(in srgb, var(--ry-acento) 72%, var(--ry-linea)); border-radius: 7px; background: var(--ry-superficie); color: var(--ry-texto); font-family: var(--ry-mono); font-size: 9px; font-weight: 700; } .ry-pdp__producto > a { height: 270px; display: grid; place-items: center; overflow: hidden; background: var(--ry-campo-foto); } .ry-pdp__producto > a img { width: 86%; height: 86%; object-fit: contain; transition: transform 400ms cubic-bezier(.16, 1, .3, 1); } .ry-pdp__producto:hover > a img { transform: scale(1.035); } .ry-pdp__producto > div { padding: 15px; } .ry-pdp__producto p { margin: 0; color: var(--ry-texto-2); font-family: var(--ry-mono); font-size: 8px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; } .ry-pdp__producto h3 { min-height: 42px; margin: 6px 0 0; font-family: var(--ry-serif); font-size: 20px; font-weight: 500; letter-spacing: -.02em; line-height: 1.05; } .ry-pdp__producto strong, .ry-pdp__producto small { display: block; } .ry-pdp__producto strong { margin-top: 12px; font-family: var(--ry-serif); font-size: 28px; font-weight: 500; line-height: 1; } .ry-pdp__producto small { min-height: 20px; margin-top: 4px; color: var(--ry-acento); font-family: var(--ry-mono); font-size: 10px; font-weight: 700; } .ry-pdp__producto button { width: 100%; min-height: 46px; margin-top: 11px; padding: 0 14px; display: flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid var(--ry-fuerte); border-radius: 8px; background: var(--ry-fuerte); color: var(--ry-fuerte-texto); font-size: 12px; font-weight: 700; cursor: pointer; transition: background-color 180ms ease, transform 180ms ease; } .ry-pdp__producto button:hover { background: color-mix(in srgb, var(--ry-fuerte) 88%, var(--ry-contraste)); } .ry-pdp__producto button:active { transform: scale(.98); } .ry-pdp__producto button .ry-i { width: 17px; height: 17px; } .ry-pdp__producto button[data-agregado] { background: var(--ry-acento); border-color: var(--ry-acento); color: var(--ry-acento-texto); } .ry-pdp__recomendador { margin-top: 20px; padding: 22px; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 13px; border-radius: 12px; background: radial-gradient(circle at 96% 10%, color-mix(in srgb, var(--ry-acento) 12%, transparent), transparent 15rem), var(--ry-contraste); color: var(--ry-contraste-txt); } .ry-pdp__recomendador > span { width: 52px; height: 52px; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--ry-acento) 45%, transparent); border-radius: 50%; background: var(--ry-superficie); color: var(--ry-acento); } .ry-pdp__recomendador > span .ry-i { width: 28px; height: 28px; } .ry-pdp__recomendador h3 { margin: 0; font-family: var(--ry-serif); font-size: 1.55rem; font-weight: 500; letter-spacing: -.02em; line-height: 1; } .ry-pdp__recomendador p { margin: 5px 0 0; color: color-mix(in srgb, var(--ry-contraste-txt) 70%, transparent); font-size: 10px; } .ry-pdp__recomendador > a { grid-column: 1 / -1; min-height: 46px; padding: 0 14px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border: 1px solid color-mix(in srgb, var(--ry-contraste-txt) 72%, transparent); border-radius: 8px; color: var(--ry-contraste-txt); font-size: 12px; font-weight: 600; text-decoration: none; } .ry-pdp__recomendador > a:hover { border-color: var(--ry-acento); background: color-mix(in srgb, var(--ry-acento) 10%, transparent); } .ry-pdp__recomendador > a .ry-i { width: 17px; height: 17px; }  .ry-pdp__barra-movil { position: fixed; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom)); left: 10px; z-index: 410; min-height: 66px; padding: 8px 8px 8px 14px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border: 1px solid color-mix(in srgb, var(--ry-linea) 84%, transparent); border-radius: 12px; background: color-mix(in srgb, var(--ry-superficie) 94%, transparent); box-shadow: 0 18px 55px color-mix(in srgb, var(--ry-contraste) 22%, transparent); opacity: 0; pointer-events: none; transform: translateY(calc(100% + 18px)); backdrop-filter: blur(16px) saturate(1.15); transition: opacity 220ms ease, transform 300ms cubic-bezier(.16, 1, .3, 1); } .ry-pdp__barra-movil[data-visible] { opacity: 1; pointer-events: auto; transform: translateY(0); } .ry-pdp__barra-movil div { min-width: 0; } .ry-pdp__barra-movil small, .ry-pdp__barra-movil strong { display: block; } .ry-pdp__barra-movil small { color: var(--ry-texto-2); font-family: var(--ry-mono); font-size: 9px; } .ry-pdp__barra-movil strong { margin-top: 2px; font-family: var(--ry-serif); font-size: 23px; font-weight: 500; line-height: 1; } .ry-pdp__barra-movil button { min-height: 48px; padding-inline: 16px; display: flex; align-items: center; gap: 7px; border: 1px solid var(--ry-fuerte); border-radius: 9px; background: var(--ry-fuerte); color: var(--ry-fuerte-texto); font-size: 12px; font-weight: 700; cursor: pointer; } .ry-pdp__barra-movil button .ry-i { width: 17px; height: 17px; }  [data-reveal] { opacity: 1; transform: none; } @media (prefers-reduced-motion: no-preference) { .ry-pdp.js [data-reveal] { opacity: 0; transform: translateY(10px); transition: opacity 320ms cubic-bezier(.23, 1, .32, 1), transform 340ms cubic-bezier(.23, 1, .32, 1); } .ry-pdp.js [data-reveal][data-visible] { opacity: 1; transform: translateY(0); } } @media (min-width: 700px) { .ry-pdp__migas { min-height: 62px; padding-block: 18px 14px; font-size: 12px; } .ry-pdp__compra { grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); align-items: start; gap: clamp(34px, 5vw, 72px); padding-bottom: 68px; } .ry-pdp__galeria { position: sticky; top: 96px; grid-template-columns: 72px minmax(0, 1fr); gap: 12px; } .ry-pdp__miniatura { width: 72px; } .ry-pdp__foto-principal { min-height: 610px; } .ry-pdp__foto-principal > img { width: 95%; max-height: 570px; } .ry-pdp__venta { padding-top: 31px; } .ry-pdp__venta h1 { font-size: clamp(3.3rem, 5.4vw, 4.8rem); } .ry-pdp__info, .ry-pdp__detalles { margin-bottom: 24px; } .ry-pdp__info { padding: 46px 0; display: grid; grid-template-columns: minmax(280px, .9fr) minmax(360px, 1.1fr); align-items: center; } .ry-pdp__info-presentacion, .ry-pdp__atributos { padding-inline: clamp(34px, 4vw, 62px); } .ry-pdp__info-presentacion > img { width: 86%; max-height: 390px; margin-top: 25px; } .ry-pdp__atributos { margin-top: 0; border-left: 1px solid var(--ry-linea); } .ry-pdp__atributos dl > div { min-height: 74px; } .ry-pdp__atributos dt, .ry-pdp__atributos dd { font-size: 13px; } .ry-pdp__detalles { padding: 48px; display: grid; grid-template-columns: minmax(290px, .82fr) minmax(0, 1.18fr); gap: clamp(36px, 5vw, 76px); } .ry-pdp__detalles-fotos { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .ry-pdp__relacionados { padding-block: 72px 82px; } .ry-pdp__relacionados-cabecera { padding-right: 120px; } .ry-pdp__relacionados h2 { max-width: none; font-size: clamp(3.5rem, 5.8vw, 5rem); } .ry-pdp__relacionados-cabecera > a { position: absolute; right: 120px; bottom: 0; } .ry-pdp__carrusel-controles { display: flex; } .ry-pdp__productos { margin-inline: 0; padding-inline: 2px; scroll-padding-inline: 2px; gap: 13px; } .ry-pdp__producto { flex-basis: min(30vw, 304px); } .ry-pdp__recomendador { padding: 20px 24px; grid-template-columns: auto minmax(0, 1fr) minmax(220px, 280px); gap: 16px; } .ry-pdp__recomendador > a { grid-column: auto; } .ry-pdp__barra-movil { display: none; } } @media (min-width: 1024px) { .ry-pdp__compra { grid-template-columns: minmax(0, 1fr) minmax(420px, auto); gap: clamp(48px, 5vw, 76px); } .ry-pdp__galeria { grid-template-columns: 86px minmax(0, 1fr); gap: 15px; } .ry-pdp__miniatura { width: 86px; } .ry-pdp__foto-principal { min-height: 690px; } .ry-pdp__foto-principal > img { max-height: 650px; } .ry-pdp__venta { padding-top: 47px; } .ry-pdp__info { grid-template-columns: minmax(350px, .86fr) minmax(480px, 1.14fr); } .ry-pdp__info-presentacion > img { max-height: 430px; } .ry-pdp__detalles { grid-template-columns: minmax(340px, .78fr) minmax(0, 1.22fr); min-height: 640px; } .ry-pdp__detalles-fotos figure { min-height: 540px; } .ry-pdp__detalles-fotos img { max-height: 520px; } .ry-pdp__producto { flex-basis: min(24vw, 306px); } } @media (min-width: 1280px) { .ry-pdp__compra { padding-bottom: 82px; } } @media (prefers-reduced-transparency: reduce) { .ry-pdp__favorito, .ry-pdp__barra-movil { backdrop-filter: none; background: var(--ry-superficie); } } @media (prefers-reduced-motion: reduce) { .ry-pdp__producto:hover, .ry-pdp__producto:hover > a img, .ry-pdp__foto-principal[data-zoomed] > img, .ry-pdp__foto-principal[data-gallery-mode="detalle"] > img { transform: none; } }    .ry-ficha--agotada .ry-ficha__campo img { opacity: 0.55; filter: grayscale(45%); } .ry-ficha__chip--agotado { background: var(--ry-texto); color: var(--ry-fondo); } .ry-ficha__btn--agotado { border-color: var(--ry-linea); background: transparent; color: var(--ry-texto-2); } .ry-ficha__titulo a { color: inherit; text-decoration: none; } .ry-ficha__campo { display: block; }  .ry-ficha__precio del { margin-left: 8px; color: var(--ry-texto-2); font-size: 0.82em; text-decoration: line-through; } .ry-ficha__precio ins { text-decoration: none; }  .ry-carrito__item-titulo a { color: inherit; text-decoration: none; } .ry-carrito__item-unico { color: var(--ry-texto-2); font-size: 12px; } .ry-carrito__aviso { min-height: 1em; margin: 4px 0 0; color: var(--ry-acento-hondo); font-size: 12.5px; } .ry-carrito__aviso:empty { display: none; } .ry-carrito__cantidad [data-ry-step][disabled] { opacity: 0.4; cursor: not-allowed; } .ry-carrito__cuerpo { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; } .ry-carrito__cuerpo .ry-carrito__items { flex: 1 1 auto; overflow-y: auto; }  .ry-buscador__resultado[data-entrando] { opacity: 0; transform: translateY(4px); } .ry-buscador__resultado { transition: opacity 220ms ease, transform 220ms ease; } @media (prefers-reduced-motion: reduce) { .ry-buscador__resultado { transition: none; } }  .ry-shop { background: var(--ry-fondo); } .ry-shop ul.products { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; } .ry-shop ul.products li.product { margin: 0; min-width: 0; } .ry-shop ul.products .ry-ficha { width: 100%; height: 100%; } @media (min-width: 700px) { .ry-shop ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; } } @media (min-width: 1200px) { .ry-shop ul.products { grid-template-columns: repeat(4, minmax(0, 1fr)); } }  .ry-shop .woocommerce-ordering select { min-height: 44px; padding: 0 12px; border: 1px solid var(--ry-linea); border-radius: 9px; background: var(--ry-superficie); color: var(--ry-texto); font: inherit; } .ry-shop .woocommerce-result-count { color: var(--ry-texto-2); font-family: var(--ry-mono); font-size: 12.5px; } .ry-shop nav.woocommerce-pagination { margin-top: 26px; } .ry-shop nav.woocommerce-pagination ul { display: flex; justify-content: center; gap: 6px; margin: 0; padding: 0; border: 0; list-style: none; } .ry-shop nav.woocommerce-pagination ul li { border: 0; } .ry-shop nav.woocommerce-pagination ul li a, .ry-shop nav.woocommerce-pagination ul li span { display: grid; place-items: center; min-width: 42px; min-height: 42px; border: 1px solid var(--ry-linea); border-radius: 9px; background: var(--ry-superficie); color: var(--ry-texto); font-family: var(--ry-mono); text-decoration: none; } .ry-shop nav.woocommerce-pagination ul li span.current { border-color: var(--ry-fuerte); background: var(--ry-fuerte); color: var(--ry-fuerte-texto); }  .ry-pdp { background: var(--ry-fondo); }  .ry-pdp__form .variations { width: 100%; border-collapse: collapse; } .ry-pdp__form .variations td, .ry-pdp__form .variations th { padding: 0; border: 0; } .ry-pdp__form .variations .label label { display: block; margin: 14px 0 6px; color: var(--ry-texto-2); font-size: 12.5px; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; } .ry-pdp__form .reset_variations { display: inline-block; margin-top: 6px; color: var(--ry-texto-2); font-size: 12.5px; }  .ry-pdp__form .woocommerce-variation-price, .ry-pdp__form .woocommerce-variation-availability { display: none; } .ry-pdp__form form.cart { display: flex; flex-wrap: wrap; align-items: stretch; gap: 10px; margin-top: 16px; } .ry-pdp__form form.cart.variations_form { display: block; } .ry-pdp__form form.cart.variations_form .woocommerce-variation-add-to-cart { display: flex; flex-wrap: wrap; align-items: stretch; gap: 10px; margin-top: 14px; } .ry-pdp__cantidad-controles { display: inline-flex; align-items: center; border: 1px solid var(--ry-linea); border-radius: 9px; background: var(--ry-superficie); } .ry-pdp__cantidad-controles button { display: grid; place-items: center; width: 44px; min-height: 48px; border: 0; background: transparent; color: var(--ry-texto); font-size: 18px; cursor: pointer; } .ry-pdp__cantidad-controles input.qty { width: 44px; min-height: 48px; border: 0; background: transparent; color: var(--ry-texto); font-family: var(--ry-mono); font-size: 15px; text-align: center; -moz-appearance: textfield; } .ry-pdp__cantidad-controles input.qty::-webkit-outer-spin-button, .ry-pdp__cantidad-controles input.qty::-webkit-inner-spin-button { appearance: none; margin: 0; } .ry-pdp__form .single_add_to_cart_button { flex: 1 1 auto; min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 0 20px; border: 1px solid var(--ry-fuerte); border-radius: 9px; background: var(--ry-fuerte); color: var(--ry-fuerte-texto); font-size: 14px; font-weight: 600; cursor: pointer; transition: background-color 220ms ease, transform 220ms ease; } .ry-pdp__form .single_add_to_cart_button:hover { background: color-mix(in srgb, var(--ry-fuerte) 88%, #000); } .ry-pdp__form .single_add_to_cart_button:active { transform: translateY(1px) scale(0.99); } .ry-pdp__form .single_add_to_cart_button.disabled { opacity: 0.5; cursor: not-allowed; } .ry-pdp__stock--agotado { color: var(--ry-acento-hondo); }  .ry-pdp [data-reveal] { opacity: 0; transform: translateY(14px); transition: opacity 480ms ease, transform 480ms ease; } .ry-pdp [data-reveal].is-visible { opacity: 1; transform: none; } @media (prefers-reduced-motion: reduce) { .ry-pdp [data-reveal] { opacity: 1; transform: none; transition: none; } }  .ry-pdp__sticky { position: fixed; right: 0; bottom: 0; left: 0; z-index: 40; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 10px var(--ry-margen); padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--ry-linea); background: var(--ry-superficie); box-shadow: 0 -10px 28px color-mix(in srgb, var(--ry-contraste) 9%, transparent); } .ry-pdp__sticky[hidden] { display: none; } .ry-pdp__sticky-info { min-width: 0; } .ry-pdp__sticky-info strong { display: block; overflow: hidden; color: var(--ry-texto); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; } .ry-pdp__sticky-info span { color: var(--ry-precio); font-family: var(--ry-mono); font-size: 14px; } .ry-pdp__sticky-out { color: var(--ry-acento-hondo); font-size: 13px; font-weight: 600; } @media (min-width: 1024px) { .ry-pdp__sticky { display: none; } }  .ry-pdp__galeria--unica { grid-template-columns: minmax(0, 1fr); }  .ry-pdp__venta h1 .ry-pdp__marca { display: block; margin-bottom: 6px; color: var(--ry-acento); font-family: var(--ry-sans); font-size: 13px; font-weight: 700; letter-spacing: 0.1em; line-height: 1.2; text-transform: uppercase; }   .ry-pdp__venta h1 { max-width: 20ch; font-size: clamp(1.7rem, 3.6vw, 2.5rem); line-height: 1.05; } .ry-pdp__precio strong { font-size: clamp(1.6rem, 3.2vw, 2.1rem); } .ry-pdp__precio { gap: 12px; }  .ry-filters__option { justify-content: flex-start; } .ry-filters__count { margin-left: auto; padding-left: 8px; color: var(--ry-texto-2); font-size: 11.5px; font-weight: 400; }   .ry-marcas__pista .ry-marca { width: 138px; height: 60px; padding: 0; } .ry-marcas__pista .ry-marca__campo { display: grid; place-items: center; width: 138px; height: 60px; padding: 9px 14px; border: 1px solid var(--ry-linea); border-radius: 10px; background: var(--ry-campo-foto); }  .ry-marcas__pista .ry-marca__campo {  --ry-marca-alto: 52px; block-size: 72px; padding: 8px 12px; display: grid; place-items: center; overflow: hidden; }  .ry-marcas__pista { block-size: auto; align-items: center; } .ry-marcas__pista .ry-marca__logo {  inline-size: auto; block-size: auto; max-inline-size: 100%; max-block-size: var(--ry-marca-alto, 52px); object-fit: contain; opacity: 1; filter: none; mix-blend-mode: multiply; } .ry-marcas__pista .ry-marca__nombre { color: var(--ry-texto); font-family: var(--ry-serif); font-size: 1.05rem; line-height: 1.1; text-align: center; } .ry-marcas__pista .ry-marca:hover .ry-marca__campo, .ry-marcas__pista .ry-marca:focus-visible .ry-marca__campo { border-color: var(--ry-acento); }   .ry-reco__marca { display: block; color: var(--ry-acento); font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; } .ry-reco__kilo { display: block; margin-top: 2px; color: var(--ry-texto-2); font-size: 12px; } .ry-reco__producto { color: inherit; text-decoration: none; }  .ry-panel .ry-categorias--panel, .ry-panel .ry-categorias--panel-salud { grid-template-columns: minmax(0, 1fr); gap: 0; } .ry-panel .ry-categorias--panel .ry-categoria { align-items: center; min-height: 54px; padding: 7px 10px 7px 6px; flex-direction: row; gap: 12px; border-width: 0 0 1px; border-radius: 8px; border-color: rgba(247, 238, 225, .1); background: transparent; } .ry-panel .ry-categorias--panel .ry-categoria:last-child { border-bottom-width: 0; } .ry-panel .ry-categorias--panel .ry-categoria:hover, .ry-panel .ry-categorias--panel .ry-categoria:focus-visible { border-color: rgba(239, 161, 100, .5); background: rgba(255, 255, 255, .07); } .ry-panel .ry-categorias--panel .ry-categoria__campo { flex: 0 0 auto; width: 46px; height: 46px; aspect-ratio: auto; border-radius: 9px; } .ry-panel .ry-categorias--panel .ry-categoria__nombre { min-height: 0; font-size: 15px; line-height: 1.25; }  .ry-panel__grupo-categorias + .ry-panel__grupo-categorias { margin-top: 20px; }    .ry-pdp__pestanias { margin-top: 18px; } .ry-pdp__pestanias-lista { display: flex; gap: 4px; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; border-bottom: 1px solid var(--ry-linea); padding-bottom: 0;  margin-inline: calc(var(--ry-margen) * -1); padding-inline: var(--ry-margen); } .ry-pdp__pestanias-lista::-webkit-scrollbar { display: none; } .ry-pdp__pestania { position: relative; flex: 0 0 auto; padding: 11px 14px 12px; border: 0; border-radius: 9px 9px 0 0; background: transparent; color: var(--ry-texto-2); font-family: inherit; font-size: 14px; font-weight: 600; line-height: 1.2; white-space: nowrap; cursor: pointer; transition: color 160ms ease, background 160ms ease; } .ry-pdp__pestania::after { content: ""; position: absolute; right: 10px; bottom: -1px; left: 10px; height: 2px; border-radius: 2px 2px 0 0; background: var(--ry-acento); opacity: 0; transform: scaleX(.4); transition: opacity 180ms ease, transform 240ms cubic-bezier(.22, .72, .25, 1); } .ry-pdp__pestania:hover { color: var(--ry-texto); background: var(--ry-superficie-2); } .ry-pdp__pestania[aria-selected="true"] { color: var(--ry-texto); } .ry-pdp__pestania[aria-selected="true"]::after { opacity: 1; transform: scaleX(1); } .ry-pdp__pestania:focus-visible { outline: 2px solid var(--ry-acento); outline-offset: -3px; } .ry-pdp__panel { padding-top: 18px; } .ry-pdp__panel + .ry-pdp__panel { border-top: 1px solid var(--ry-linea); margin-top: 22px; }  [data-mejorado] .ry-pdp__panel-rotulo { display: none; } [data-mejorado] .ry-pdp__panel + .ry-pdp__panel { border-top: 0; margin-top: 0; } .ry-pdp__panel-rotulo { margin: 0 0 10px; color: var(--ry-texto); font-family: var(--ry-serif); font-size: 17px; font-weight: 500; } .ry-pdp__panel-cuerpo { color: var(--ry-texto-2); font-size: 14.5px; line-height: 1.65; } .ry-pdp__panel-cuerpo > :first-child { margin-top: 0; } .ry-pdp__panel-cuerpo > :last-child { margin-bottom: 0; } .ry-pdp__panel-cuerpo h4 { margin: 18px 0 6px; color: var(--ry-texto); font-size: 13px; font-weight: 700; letter-spacing: .01em; } .ry-pdp__panel-cuerpo p { margin: 0 0 10px; } .ry-pdp__panel-cuerpo ul, .ry-pdp__panel-cuerpo ol { margin: 0 0 12px; padding-left: 18px; } .ry-pdp__panel-cuerpo li { margin-bottom: 4px; } .ry-pdp__panel-cuerpo a { color: var(--ry-acento); font-weight: 650; text-decoration: none; }  .ry-pdp__panel-cuerpo table { display: block; width: 100%; max-width: 100%; overflow-x: auto; border-collapse: collapse; margin: 0 0 12px; font-size: 13.5px; white-space: normal; } .ry-pdp__panel-cuerpo th, .ry-pdp__panel-cuerpo td { padding: 7px 10px; border: 1px solid var(--ry-linea); text-align: left; vertical-align: top; } .ry-pdp__panel-cuerpo th { background: var(--ry-superficie-2); color: var(--ry-texto); font-weight: 600; } .ry-pdp__panel-cuerpo tr:nth-child(even) td { background: color-mix(in srgb, var(--ry-superficie-2) 45%, transparent); }  .ry-pdp__panel-cuerpo img { max-width: 100%; height: auto; border-radius: 8px; } @media (min-width: 768px) { .ry-pdp__pestanias-lista { margin-inline: 0; padding-inline: 0; } .ry-pdp__pestania { font-size: 14.5px; padding-inline: 16px; } .ry-pdp__panel-cuerpo { font-size: 15px; } }  .ry-marcas, .ry-marcas__interior { min-height: 92px; }  @media (max-width: 767px) { .ry-marcas__interior { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 10px; padding-block: 16px; } .ry-marcas__divisor { display: none; } .ry-marcas__rotulo { color: var(--ry-texto-2); font-size: 10px; letter-spacing: .1em; }  .ry-marcas__ventana { margin-inline: calc(var(--ry-margen) * -1); mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent); } .ry-marcas__pista { gap: 14px; padding-inline: 7px; } .ry-marcas__cinta { gap: 14px; } .ry-marcas__pista .ry-marca, .ry-marcas__pista .ry-marca__campo { width: 116px; height: 54px; } }  .ry-buscador__atajos { padding: 12px 14px 14px; } .ry-buscador__atajos-rotulo { margin: 0 0 9px; color: var(--ry-texto-2); font-family: var(--ry-mono, var(--ry-sans)); font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; } .ry-buscador__atajos-lista { display: flex; flex-wrap: wrap; gap: 7px; } .ry-buscador__atajo { padding: 7px 12px; border: 1px solid var(--ry-linea); border-radius: var(--ry-r-pastilla, 999px); background: var(--ry-superficie); color: var(--ry-texto); font-size: 13px; line-height: 1.2; text-decoration: none; transition: border-color 160ms ease, color 160ms ease, background 160ms ease; } .ry-buscador__atajo:hover, .ry-buscador__atajo:focus-visible { border-color: var(--ry-acento); background: color-mix(in srgb, var(--ry-acento) 8%, var(--ry-superficie)); color: var(--ry-acento-hondo); } .ry-buscador__atajo:focus-visible { outline: 2px solid var(--ry-acento); outline-offset: 2px; }  .ry-buscador__vacio + .ry-buscador__atajos { border-top: 1px solid var(--ry-linea); }  .ry-pdp__panel-cuerpo table.ry-especificacion { display: table; overflow: visible; table-layout: fixed; } .ry-especificacion th[scope="row"] { width: 62%; background: transparent; font-weight: 500; color: var(--ry-texto-2); } .ry-especificacion td { color: var(--ry-texto); font-variant-numeric: tabular-nums; font-weight: 600; text-align: right; } .ry-especificacion__grupo th { background: var(--ry-superficie-2); color: var(--ry-texto); font-family: var(--ry-mono, var(--ry-sans)); font-size: 10px; font-weight: 700; letter-spacing: .1em; text-align: left; text-transform: uppercase; } .ry-especificacion tr:nth-child(even) td, .ry-especificacion tr:nth-child(even) th[scope="row"] { background: color-mix(in srgb, var(--ry-superficie-2) 40%, transparent); }  .ry-pdp__claves { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0 0; padding: 0; } .ry-pdp__clave { flex: 1 1 auto; min-width: 108px; padding: 9px 12px 10px; border: 1px solid var(--ry-linea); border-radius: 10px; background: var(--ry-superficie); } .ry-pdp__clave dt { margin: 0 0 2px; color: var(--ry-texto-2); font-family: var(--ry-mono, var(--ry-sans)); font-size: 9.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; } .ry-pdp__clave dd { margin: 0; color: var(--ry-texto); font-size: 16px; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.15; } .ry-pdp__razones { margin-top: 20px; } .ry-pdp__razones h3 { margin: 0 0 10px; color: var(--ry-texto); font-family: var(--ry-serif); font-size: 18px; font-weight: 500; }  .ry-pdp__razones ul { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; } .ry-pdp__razones li { display: flex; align-items: start; gap: 9px; color: var(--ry-texto-2); font-size: 14.5px; line-height: 1.5; } .ry-pdp__razones li .ry-i { flex: 0 0 auto; width: 17px; height: 17px; margin-top: 2px; padding: 3px; border-radius: 50%; background: color-mix(in srgb, var(--ry-fuerte) 12%, transparent); color: var(--ry-fuerte); } .ry-pdp__cierre { margin-top: 24px; padding: 16px; border: 1px solid var(--ry-linea); border-radius: 14px; background: var(--ry-superficie-2); } .ry-pdp__cierre-precio { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; color: var(--ry-precio); font-size: 22px; font-weight: 700; line-height: 1.1; } .ry-pdp__cierre-precio del { color: var(--ry-texto-2); font-size: 15px; font-weight: 500; } .ry-pdp__cierre-precio ins { text-decoration: none; } .ry-pdp__cierre-kilo { color: var(--ry-texto-2); font-size: 13px; font-weight: 500; }  .ry-pdp__cierre-acciones { display: grid; gap: 12px; justify-items: center; margin-top: 14px; } .ry-pdp__cierre-acciones .ry-btn { inline-size: 100%; min-block-size: 52px; justify-content: center; font-size: 15px; } .ry-pdp__cierre-consulta { display: inline-flex; align-items: center; gap: 7px; color: var(--ry-texto); font-size: 14px; font-weight: 600; text-decoration: none; } .ry-pdp__cierre-consulta:hover { color: var(--ry-acento); } .ry-pdp__cierre-envio { display: flex; align-items: center; gap: 7px; margin: 12px 0 0; color: var(--ry-texto-2); font-size: 13px; } .ry-pdp__cierre-envio .ry-i { width: 15px; height: 15px; color: var(--ry-fuerte); } @media (min-width: 768px) { .ry-pdp__clave { min-width: 128px; } .ry-pdp__cierre { padding: 20px; } }  .ry-ficha__regalo { margin: -8px 0 10px; color: var(--ry-fuerte); font-size: 11.5px; font-weight: 600; line-height: 1.2; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; }  .ry-buscador__vacio { padding: 12px 14px; } .ry-buscador__vacio + .ry-buscador__atajos { padding-top: 0; }   .ry-filters__marcados { min-inline-size: 20px; margin-inline-start: auto; padding: 1px 7px; border-radius: 999px; background: var(--ry-copper); color: var(--ry-white); font-size: 11px; line-height: 1.6; text-align: center; }  .ry-filters__group > summary > span:first-child { margin-inline-end: auto; }  .ry-filters__options--largo { max-block-size: 264px; overflow-y: auto; overscroll-behavior: contain; padding-inline-end: 4px; } .ry-filters__buscar { display: block; margin-block: 4px 8px; } .ry-filters__buscar input { inline-size: 100%; padding: 7px 10px; border: 1px solid var(--ry-linea); border-radius: 8px; background: var(--ry-superficie); font: inherit; font-size: 13px; } .ry-filters__buscar input:focus-visible { outline: 2px solid var(--ry-copper); outline-offset: 1px; } .ry-filters__sin-coincidencias { margin: 6px 2px; color: var(--ry-texto-2); font-size: 13px; } .ry-filters__option > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }  .ry-filters__actions { position: sticky; inset-block-end: 0; padding-block-end: calc(12px + env(safe-area-inset-bottom, 0px)); background: linear-gradient(to bottom, transparent, var(--ry-fondo) 24%); }  [data-ry-barra-compra] .ry-wa { bottom: calc(90px + 14px + env(safe-area-inset-bottom)); transition: bottom 260ms cubic-bezier(.16, 1, .3, 1); } .ry-wa { transition: bottom 260ms cubic-bezier(.16, 1, .3, 1); }  [data-ry-barra-compra] .ry-wa, .ry-wa { will-change: bottom; }  .ry-ficha__pesos { margin-block: 2px 8px; display: flex; flex-wrap: wrap; gap: 5px; } .ry-ficha__peso { padding: 4px 9px; border: 1px solid var(--ry-linea); border-radius: 999px; background: var(--ry-superficie); color: var(--ry-texto-2); font-family: var(--ry-font-mono, inherit); font-size: 12px; line-height: 1.5; text-decoration: none; white-space: nowrap; transition: border-color 140ms ease, color 140ms ease, background-color 140ms ease; } .ry-ficha__peso:hover { border-color: var(--ry-copper); color: var(--ry-copper); } .ry-ficha__peso.is-actual { border-color: var(--ry-forest); background: var(--ry-forest); color: var(--ry-white); }  .ry-ficha__peso.is-agotado { border-color: var(--ry-linea); background: transparent; color: var(--ry-texto-2); text-decoration: line-through; } .ry-ficha__peso:focus-visible { outline: 2px solid var(--ry-copper); outline-offset: 2px; }  .ry-shop ul.products[class*="columns-"] li.product.product, .ry-shop ul.products li.product.product { inline-size: auto; width: auto; margin: 0; float: none; clear: none; } .ry-shop ul.products[class*="columns-"] li.product.product .ry-ficha { inline-size: 100%; }  .ry-filters[data-auto] .ry-filters__actions .ry-button { display: none; } .ry-filters[data-auto] .ry-filters__actions { justify-content: flex-start; padding-block: 8px calc(8px + env(safe-area-inset-bottom, 0px)); }  .ry-filters[data-enviando] { opacity: .55; pointer-events: none; transition: opacity 120ms ease; } .ry-filters[data-enviando]::after { content: "Filtrando…"; position: sticky; inset-block-end: 0; display: block; padding: 10px 2px; color: var(--ry-texto-2); font-size: 13px; }  .ry-shop ul.products .ry-ficha, .ry-archivo .ry-ficha { min-block-size: 0; }  .ry-riel .ry-ficha, .ry-ofertas .ry-ficha { min-block-size: 420px; }  .ry-shop ul.products .ry-ficha__titulo, .ry-archivo .ry-ficha__titulo { min-block-size: 0; -webkit-line-clamp: 3; line-clamp: 3; } @media (max-width: 559px) {  .ry-shop ul.products .ry-ficha__titulo, .ry-archivo .ry-ficha__titulo { font-size: 13.5px; line-height: 1.3; -webkit-line-clamp: 3; line-clamp: 3; overflow-wrap: anywhere; } }  .ry-conv { margin-block-start: 12px; padding: 14px 16px; border: 1px solid var(--ry-linea); border-radius: 12px; background: var(--ry-superficie); } .ry-conv__titulo { margin: 0 0 10px; display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: var(--ry-texto); } .ry-conv__titulo .ry-i { inline-size: 18px; block-size: 18px; color: var(--ry-copper); } .ry-conv__campo select { inline-size: 100%; min-block-size: 42px; padding: 8px 12px; border: 1px solid var(--ry-linea); border-radius: 9px; background: var(--ry-fondo); font: inherit; font-size: 14px; } .ry-conv__resultado { margin: 10px 0 0; font-family: var(--ry-font-mono, inherit); font-size: 15px; font-weight: 600; color: var(--ry-forest); } .ry-conv__resultado:empty { display: none; } .ry-conv__nota { margin: 6px 0 0; color: var(--ry-texto-2); font-size: 12px; line-height: 1.4; }  .ry-pdp__tamanos { margin-top: 16px; } .ry-pdp__tamanos-rotulo { margin: 0 0 8px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; color: var(--ry-texto); font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; } .ry-pdp__tamanos-rotulo span { color: var(--ry-texto-2); font-size: 11.5px; font-weight: 500; letter-spacing: 0; text-transform: none; } .ry-pdp__tamanos-lista { margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(112px, 1fr)); gap: 8px; list-style: none; } .ry-pdp__tamano {  block-size: 100%; min-block-size: 62px; padding: 9px 11px; display: grid; align-content: center; gap: 2px; border: 1.5px solid var(--ry-linea); border-radius: 11px; background: var(--ry-superficie); color: inherit; text-decoration: none; transition: border-color 160ms ease, background-color 160ms ease; } .ry-pdp__tamano strong { font-size: 15px; font-weight: 700; letter-spacing: -.01em; line-height: 1.1; } .ry-pdp__tamano span { color: var(--ry-texto-2); font-size: 11.5px; line-height: 1.2; } .ry-pdp__tamano em { margin-top: 3px; justify-self: start; padding: 2px 7px; border-radius: 999px; background: var(--ry-acento); color: var(--ry-acento-texto); font-size: 10px; font-style: normal; font-weight: 700; letter-spacing: .01em; line-height: 1.4; white-space: nowrap; } .ry-pdp__tamano:hover { border-color: var(--ry-acento); } .ry-pdp__tamano.is-actual { border-color: var(--ry-fuerte); background: color-mix(in srgb, var(--ry-fuerte) 7%, var(--ry-superficie)); cursor: default; } .ry-pdp__tamano:focus-visible { outline: 2px solid var(--ry-fuerte); outline-offset: 2px; }  .ry-pdp__tamano.is-agotado { border-style: dashed; color: var(--ry-texto-2); } .ry-pdp__tamano.is-agotado strong { font-weight: 600; } .ry-pdp__tamano.is-agotado em { background: color-mix(in srgb, var(--ry-texto-2) 16%, transparent); color: var(--ry-texto-2); } @media (prefers-reduced-motion: reduce) { .ry-pdp__tamano { transition: none; } }  .ry-conv--garantias ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 11px; } .ry-conv--garantias li { display: grid; grid-template-columns: 20px 1fr; align-items: start; gap: 10px; font-size: 13.5px; } .ry-conv--garantias .ry-i { inline-size: 18px; block-size: 18px; color: var(--ry-forest); margin-block-start: 1px; } .ry-conv--garantias strong { display: block; font-weight: 600; } .ry-conv--garantias small { display: block; color: var(--ry-texto-2); font-size: 12.5px; } .ry-conv--garantias a { color: var(--ry-forest); } .ry-conv__guardar { margin-block-start: 13px; inline-size: 100%; min-block-size: 42px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 9px 14px; border: 1px solid var(--ry-linea); border-radius: 999px; background: transparent; color: var(--ry-texto); font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; transition: border-color 160ms ease, color 160ms ease; } .ry-conv__guardar:hover { border-color: var(--ry-copper); color: var(--ry-copper); } .ry-conv__guardar .ry-i { inline-size: 17px; block-size: 17px; } .ry-conv__guardar.is-guardado { border-color: var(--ry-copper); color: var(--ry-copper); } .ry-conv__guardar.is-guardado .ry-i { fill: currentColor; } .ry-conv__guardar:focus-visible { outline: 2px solid var(--ry-copper); outline-offset: 2px; }  @media (min-width: 900px) {  .ry-pdp__detalles { grid-template-rows: auto auto; align-items: start; } .ry-pdp__detalles-copia { display: contents; } .ry-pdp__detalles-copia > * { grid-column: 1; } .ry-pdp__pestanias--ancha { grid-column: 1 / -1; grid-row: 2; margin-block-start: 26px; } }  .ry-pdp__panel-cuerpo > p, .ry-pdp__panel-cuerpo > ul, .ry-pdp__panel-cuerpo > ol, .ry-pdp__panel-cuerpo > h4 { max-inline-size: 68ch; }  .ry-pdp__panel-cuerpo table { display: block; max-inline-size: 100%; overflow-x: auto; border-collapse: collapse; margin-block: 16px; font-size: 13.5px; } .ry-pdp__panel-cuerpo table td, .ry-pdp__panel-cuerpo table th { padding: 8px 12px; border-block-end: 1px solid var(--ry-linea); text-align: start; white-space: nowrap; } .ry-pdp__panel-cuerpo table tr:nth-child(2n) { background: color-mix(in srgb, var(--ry-superficie-2) 60%, transparent); }  .ry-pdp__panel-cuerpo img { max-inline-size: min(100%, 260px); block-size: auto; border-radius: 8px; }  .ry-pdp__panel[data-plegado] .ry-pdp__panel-cuerpo { max-block-size: 460px; overflow: hidden; -webkit-mask-image: linear-gradient(to bottom, #000 74%, transparent); mask-image: linear-gradient(to bottom, #000 74%, transparent); } .ry-pdp__desplegar { margin-block-start: 12px; min-block-size: 44px; padding: 10px 20px; display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--ry-linea); border-radius: 999px; background: transparent; color: var(--ry-forest); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; } .ry-pdp__desplegar:hover { border-color: var(--ry-copper); color: var(--ry-copper); } .ry-pdp__desplegar:focus-visible { outline: 2px solid var(--ry-copper); outline-offset: 2px; }  .ry-pdp__resenas { margin-block: 34px; padding-block-start: 28px; border-block-start: 1px solid var(--ry-linea); } .ry-pdp__resenas h2 { margin: 0 0 6px; font-size: clamp(22px, 3vw, 28px); } .ry-pdp__resenas-vacio { margin: 0 0 18px; max-inline-size: 62ch; color: var(--ry-texto-2); font-size: 15px; } .ry-pdp__resenas .comment-form { display: grid; gap: 12px; max-inline-size: 62ch; } .ry-pdp__resenas .comment-form input[type="text"], .ry-pdp__resenas .comment-form input[type="email"], .ry-pdp__resenas .comment-form textarea { inline-size: 100%; padding: 10px 13px; border: 1px solid var(--ry-linea); border-radius: 9px; background: var(--ry-superficie); font: inherit; font-size: 14.5px; } .ry-pdp__resenas .comment-form textarea { min-block-size: 120px; resize: vertical; } .ry-pdp__resenas .commentlist { margin: 0 0 24px; padding: 0; list-style: none; display: grid; gap: 16px; } .ry-pdp__resenas .commentlist li { padding: 14px 16px; border: 1px solid var(--ry-linea); border-radius: 12px; background: var(--ry-superficie); } .ry-pdp__resenas .star-rating { color: var(--ry-copper); }  .ry-avisos p { display: inline-flex; align-items: center; gap: 8px; } .ry-avisos .ry-i { inline-size: 15px; block-size: 15px; flex: none; opacity: .85; }  .ry-avisos a { color: inherit; text-decoration: none; transition: color 160ms ease; } .ry-avisos a:hover { color: #efa164; } .ry-avisos a:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; border-radius: 3px; } @media (prefers-reduced-motion: no-preference) {  .ry-avisos__cinta { animation: ry-avisos-corre 44s linear infinite; }  .ry-avisos:hover .ry-avisos__cinta, .ry-avisos:focus-within .ry-avisos__cinta { animation-play-state: paused; } @keyframes ry-avisos-corre { from { transform: translateX(0); } to { transform: translateX(calc(-50% - (var(--ry-avisos-hueco) / 2))); } } }  @media (prefers-reduced-motion: reduce) { .ry-avisos__ventana { overflow-x: auto; scrollbar-width: none; mask-image: none; } .ry-avisos__ventana::-webkit-scrollbar { display: none; } .ry-avisos__pista[aria-hidden="true"] { display: none; } }  .ry-pdp__productos { --ry-visibles: 1; --ry-asomo: 26px; --ry-hueco: 13px; } .ry-pdp__producto { flex: 0 0 calc( (100% - (var(--ry-visibles) - 1) * var(--ry-hueco) - var(--ry-asomo)) / var(--ry-visibles) ); scroll-snap-align: start; } @media (min-width: 560px) { .ry-pdp__productos { --ry-visibles: 2; } } @media (min-width: 860px) { .ry-pdp__productos { --ry-visibles: 3; } } @media (min-width: 1180px) { .ry-pdp__productos { --ry-visibles: 4; } }  .ry-pdp__productos > :last-child { margin-inline-end: var(--ry-asomo); }   .ry-pdp__recomendador > span { inline-size: 68px; block-size: 68px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--ry-acento) 55%, transparent); background: var(--ry-fondo); } .ry-pdp__recomendador > span img { inline-size: 100%; block-size: 100%; border-radius: inherit; object-fit: cover; display: block; } @media (min-width: 768px) { .ry-pdp__recomendador > span { inline-size: 84px; block-size: 84px; } }  .ry-paginacion { margin-block: 30px 8px; display: grid; gap: 12px; justify-items: center; } .ry-paginacion__estado { margin: 0; color: var(--ry-texto-2); font-family: var(--ry-font-mono, inherit); font-size: 13px; } .ry-paginacion ul { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; } .ry-paginacion a, .ry-paginacion span { min-inline-size: 44px; min-block-size: 44px; padding: 10px 14px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--ry-linea); border-radius: 10px; background: var(--ry-superficie); color: var(--ry-texto); font-size: 14px; font-weight: 600; text-decoration: none; transition: border-color 160ms ease, color 160ms ease; } .ry-paginacion a:hover { border-color: var(--ry-copper); color: var(--ry-copper); } .ry-paginacion .current { border-color: var(--ry-forest); background: var(--ry-forest); color: var(--ry-white); } .ry-paginacion .dots { border-color: transparent; background: transparent; min-inline-size: 24px; padding-inline: 4px; } .ry-paginacion a:focus-visible { outline: 2px solid var(--ry-copper); outline-offset: 2px; }   .ry-ficha__meta { flex-wrap: wrap; row-gap: 2px; min-block-size: 0; } .ry-ficha__meta > * { min-inline-size: 0; } .ry-ficha__ahorro { white-space: nowrap; }  .ry-desplegable__pieza { position: relative; } .ry-desplegable__pieza > span { position: absolute; inset: 0; block-size: auto; }  .ry-especie .ry-vertodo { text-decoration: none; } .ry-especie .ry-vertodo:hover, .ry-especie .ry-vertodo:focus-visible { border-color: var(--ry-mundo-cobre); }  .ry-marca-hero { --ry-marca-hero-foco: 50% 50%; --ry-marca-hero-foco-movil: 50% 72%; --ry-marca-hero-x: 7%; --ry-marca-hero-ancho: 42%; --ry-marca-hero-tinta: #FFFFFF; --ry-marca-hero-realce: #FFFFFF; --ry-marca-hero-fondo: var(--ry-contraste); --ry-marca-hero-velo: 28 58 46; --ry-marca-hero-velo-op: .55; --ry-marca-hero-velo-movil: .86; --ry-marca-hero-cta-fondo: #FFFFFF; --ry-marca-hero-cta-texto: var(--ry-contraste); --ry-marca-hero-cta-activo: #FFFFFF; position: relative; isolation: isolate; margin: 2px 0 clamp(20px, 3.4vw, 34px); border-radius: var(--ry-r-superficie); overflow: clip; background: var(--ry-marca-hero-fondo); color: var(--ry-marca-hero-tinta);  block-size: clamp(500px, 70vh, 620px); }  .ry-marca-hero__foto { display: block; position: absolute; inset: 0; z-index: 0; block-size: 100%; } .ry-marca-hero__foto img { display: block; inline-size: 100%; block-size: 100%; max-inline-size: none; object-fit: cover;  object-position: var(--ry-marca-hero-foco-movil); }  .ry-marca-hero__velo { display: block; position: absolute; inset: 0; z-index: 1; background: linear-gradient( 0deg, rgb(var(--ry-marca-hero-velo) / .62) 0%, rgb(var(--ry-marca-hero-velo) / .28) 7%, rgb(var(--ry-marca-hero-velo) / 0) 15% ), linear-gradient( 180deg, rgb(var(--ry-marca-hero-velo) / var(--ry-marca-hero-velo-movil)) 0%, rgb(var(--ry-marca-hero-velo) / calc(var(--ry-marca-hero-velo-movil) * .8)) 24%, rgb(var(--ry-marca-hero-velo) / calc(var(--ry-marca-hero-velo-movil) * .28)) 48%, rgb(var(--ry-marca-hero-velo) / 0) 66% ); } .ry-marca-hero__panel { position: absolute; z-index: 2; inset-block-start: 0; inset-inline: 0; padding: clamp(22px, 5.5vw, 30px) var(--ry-margen) 0; background: transparent; } .ry-marca-hero__titulo { max-width: 15ch; margin: 0; color: var(--ry-marca-hero-tinta); font-family: var(--ry-serif); font-size: clamp(2.35rem, 10.4vw, 3.1rem); font-weight: 500; letter-spacing: -.032em; line-height: 1; text-shadow: 0 1px 22px rgb(var(--ry-marca-hero-velo) / .55); text-wrap: balance; } .ry-marca-hero__realce { color: var(--ry-marca-hero-realce); font-style: italic; font-weight: 500; } .ry-marca-hero__cta { min-height: 52px;  margin-top: 22px; padding: 0 26px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; border-radius: var(--ry-r-pastilla); background: var(--ry-marca-hero-cta-fondo); color: var(--ry-marca-hero-cta-texto); font-family: var(--ry-sans); font-size: 15px; font-weight: 600; letter-spacing: -.005em; text-decoration: none; transition: background-color .18s ease, transform .18s ease; } .ry-marca-hero__cta:hover, .ry-marca-hero__cta:focus-visible { background: var(--ry-marca-hero-cta-activo); } .ry-marca-hero__cta:focus-visible { outline: 3px solid var(--ry-marca-hero-tinta); outline-offset: 3px; } .ry-marca-hero__cta:active { transform: translateY(1px); }  @media (min-width: 768px) { .ry-marca-hero {  block-size: auto; aspect-ratio: 2.9 / 1; min-block-size: clamp(320px, 34vw, 520px);  inline-size: 100%; max-inline-size: 100%; display: grid; align-items: center; } .ry-marca-hero__foto img {  object-position: var(--ry-marca-hero-foco); }  .ry-marca-hero[data-lado="derecha"] .ry-marca-hero__velo { background: linear-gradient(90deg, rgb(var(--ry-marca-hero-velo) / var(--ry-marca-hero-velo-op)) 0%, rgb(var(--ry-marca-hero-velo) / calc(var(--ry-marca-hero-velo-op) * .78)) 34%, rgb(var(--ry-marca-hero-velo) / calc(var(--ry-marca-hero-velo-op) * .3)) 54%, rgb(var(--ry-marca-hero-velo) / 0) 68%); } .ry-marca-hero[data-lado="izquierda"] .ry-marca-hero__velo { background: linear-gradient(270deg, rgb(var(--ry-marca-hero-velo) / var(--ry-marca-hero-velo-op)) 0%, rgb(var(--ry-marca-hero-velo) / calc(var(--ry-marca-hero-velo-op) * .78)) 34%, rgb(var(--ry-marca-hero-velo) / calc(var(--ry-marca-hero-velo-op) * .3)) 54%, rgb(var(--ry-marca-hero-velo) / 0) 68%); }  .ry-marca-hero__panel { position: relative; grid-area: 1 / 1; z-index: 2; inset: auto; inline-size: var(--ry-marca-hero-ancho); margin-inline-start: var(--ry-marca-hero-x); padding: 0; background: none; } .ry-marca-hero__titulo { max-width: none;  font-size: clamp(2.6rem, 5vw, 5.4rem); line-height: .96; text-shadow: 0 2px 26px rgb(var(--ry-marca-hero-velo) / .5); } .ry-marca-hero__cta { min-height: 60px; margin-top: clamp(20px, 2vw, 30px); padding: 0 32px; font-size: 17px; } } @media (prefers-reduced-motion: reduce) { .ry-marca-hero__cta { transition: none; } .ry-marca-hero__cta:active { transform: none; } }   .ry-hero-marcas { position: relative; isolation: isolate; display: grid; block-size: clamp(500px, 70vh, 620px); background: var(--ry-contraste); }  @media (min-width: 768px) { .ry-hero-marcas { block-size: auto; aspect-ratio: 2.9 / 1; min-block-size: clamp(320px, 34vw, 520px); } } .ry-hero-marcas__pista { grid-area: 1 / 1; display: grid; block-size: 100%; } .ry-hero-marcas__slide { grid-area: 1 / 1; min-width: 0; block-size: 100%; opacity: 0; visibility: hidden; transition: opacity 520ms ease; } .ry-hero-marcas__slide.is-actual { opacity: 1; visibility: visible; }  .ry-hero-marcas:not([data-mejorado]) .ry-hero-marcas__slide:first-child { opacity: 1; visibility: visible; } .ry-hero-marcas:not([data-mejorado]) .ry-hero-marcas__puntos { display: none; }  .ry-hero-marcas .ry-marca-hero { margin: 0; border-radius: 0; block-size: 100%; min-block-size: 0; aspect-ratio: auto; }  .ry-hero-marcas__puntos { position: absolute; z-index: 3; inset-block-end: clamp(14px, 2.2vw, 26px); inset-inline-start: var(--ry-margen); padding-inline: 4px; display: flex; align-items: center; gap: 2px; border: 1px solid rgb(255 255 255 / .18); border-radius: 999px; background: rgb(9 24 18 / .42); box-shadow: 0 6px 18px rgb(0 0 0 / .14); backdrop-filter: blur(8px); } .ry-hero-marcas__punto { inline-size: 26px; block-size: 44px; padding: 0; display: grid; place-items: center; border: 0; background: transparent; cursor: pointer; -webkit-tap-highlight-color: transparent; } .ry-hero-marcas__punto::after { content: ""; display: block; inline-size: 8px; block-size: 8px; border: 1.5px solid rgb(255 255 255 / .72); border-radius: 999px; background: transparent; box-shadow: 0 1px 6px rgb(0 0 0 / .35); transition: inline-size 220ms ease, background-color 220ms ease, border-color 220ms ease; } .ry-hero-marcas__punto.is-actual::after { inline-size: 22px; border-color: #FFFFFF; background: #FFFFFF; } .ry-hero-marcas__punto:hover::after, .ry-hero-marcas__punto:focus-visible::after { border-color: #FFFFFF; background: rgb(255 255 255 / .55); } .ry-hero-marcas__punto.is-actual:hover::after, .ry-hero-marcas__punto.is-actual:focus-visible::after { background: #FFFFFF; } .ry-hero-marcas__punto:focus-visible { outline: 2px solid #FFFFFF; outline-offset: -6px; border-radius: 8px; } @media (min-width: 768px) { .ry-hero-marcas__puntos { inset-inline-start: 50%; transform: translateX(-50%); } .ry-hero-marcas__punto { inline-size: 28px; } } @media (prefers-reduced-motion: reduce) { .ry-hero-marcas__slide { transition: none; } .ry-hero-marcas__punto::after { transition: none; } }  .ry-hero-lanzamiento { overflow: clip; color: var(--ry-contraste-txt); background: var(--ry-forest-deep); } .ry-hero-lanzamiento__foto, .ry-hero-lanzamiento__velo { position: absolute; inset: 0; } .ry-hero-lanzamiento__foto { z-index: 0; display: block; } .ry-hero-lanzamiento__foto img { display: block; inline-size: 100%; block-size: 100%; max-inline-size: none; object-fit: cover; object-position: 50% 52%; } .ry-hero-lanzamiento__velo { z-index: 1; background: linear-gradient(90deg, rgb(10 27 20 / .36) 0%, rgb(10 27 20 / .20) 34%, rgb(10 27 20 / .06) 54%, rgb(10 27 20 / 0) 72%), linear-gradient(0deg, rgb(10 27 20 / .12) 0%, rgb(10 27 20 / 0) 34%); } .ry-hero-lanzamiento__eco { display: none; } .ry-hero-lanzamiento__contenido { position: relative; z-index: 2; inline-size: 100%; block-size: 100%; display: flex; align-items: center; } .ry-hero-lanzamiento__panel { inline-size: min(47%, 650px); padding-block: clamp(28px, 4vw, 56px); } .ry-hero-lanzamiento__identidad { margin-block-end: clamp(14px, 1.6vw, 22px); display: flex; align-items: center; gap: clamp(12px, 1.4vw, 18px); } .ry-hero-lanzamiento__sello { inline-size: clamp(62px, 5.4vw, 76px); block-size: clamp(62px, 5.4vw, 76px); flex: 0 0 auto; display: grid; place-content: center; border: 2px solid var(--ry-contraste-txt); border-radius: 48% 52% 43% 57% / 52% 43% 57% 48%; background: var(--ry-acento); color: var(--ry-acento-texto); box-shadow: 0 0 0 4px rgb(16 39 30 / .72), 7px 8px 0 rgb(16 39 30 / .52); text-align: center; transform: rotate(-7deg); } .ry-hero-lanzamiento__sello small, .ry-hero-lanzamiento__sello strong { display: block; } .ry-hero-lanzamiento__sello small { font-family: var(--ry-mono); font-size: clamp(.46rem, .48vw, .58rem); font-weight: 700; letter-spacing: .12em; line-height: 1; text-transform: uppercase; } .ry-hero-lanzamiento__sello strong { margin-block-start: 2px; font-family: var(--ry-serif); font-size: clamp(1.35rem, 1.8vw, 1.75rem); font-style: italic; font-weight: 600; letter-spacing: -.06em; line-height: .85; } .ry-hero-lanzamiento__etiqueta { max-inline-size: 20ch; margin: 0; color: rgb(250 247 242 / .88); font-family: var(--ry-mono); font-size: clamp(.7rem, .76vw, .82rem); font-weight: 600; letter-spacing: .08em; line-height: 1.25; text-transform: uppercase; } .ry-hero-lanzamiento__titulo { max-inline-size: 12ch; margin: 0; color: var(--ry-contraste-txt); font-family: var(--ry-serif); font-size: clamp(2.85rem, 5vw, 5.75rem); font-weight: 500; letter-spacing: -.045em; line-height: .9; text-wrap: balance; } .ry-hero-lanzamiento__titulo em { display: block; position: relative; inline-size: fit-content; margin-block-start: .02em; color: #E4A37C; font-size: 1.22em; font-weight: 500; letter-spacing: -.07em; line-height: .78; text-shadow: 4px 5px 0 rgb(0 0 0 / .16); transform: rotate(-2deg); } .ry-hero-lanzamiento__titulo em::after { content: ""; position: absolute; inset-inline: .06em -.09em; inset-block-end: -.12em; block-size: .08em; border-radius: 999px; background: var(--ry-contraste-txt); opacity: .78; transform: rotate(-2deg); } .ry-hero-lanzamiento__bajada { max-inline-size: 42ch; margin: clamp(18px, 2vw, 28px) 0 0; color: rgb(250 247 242 / .88); font-size: clamp(.98rem, 1.15vw, 1.2rem); line-height: 1.55; } .ry-hero-lanzamiento__cta { min-block-size: 56px; margin-block-start: clamp(22px, 2.3vw, 32px); padding-inline: 26px 22px; display: inline-flex; align-items: center; justify-content: center; gap: 18px; border: 1px solid rgb(250 247 242 / .16); border-radius: var(--ry-r-pastilla); background: var(--ry-fondo); color: var(--ry-texto); font-size: 15px; font-weight: 650; line-height: 1; text-decoration: none; box-shadow: 0 12px 28px rgb(0 0 0 / .16); transition: background-color 180ms ease, color 180ms ease, transform 180ms ease; } .ry-hero-lanzamiento__cta > span { font-size: 20px; line-height: 1; transition: transform 180ms ease; } .ry-hero-lanzamiento__cta:hover, .ry-hero-lanzamiento__cta:focus-visible { background: var(--ry-acento); color: var(--ry-acento-texto); } .ry-hero-lanzamiento__cta:hover > span, .ry-hero-lanzamiento__cta:focus-visible > span { transform: translateX(3px); } .ry-hero-lanzamiento__cta:focus-visible { outline: 3px solid var(--ry-contraste-txt); outline-offset: 4px; } .ry-hero-lanzamiento__cta:active { transform: translateY(1px); } @media (min-width: 768px) { .ry-hero-lanzamiento { aspect-ratio: 2.55 / 1; min-block-size: clamp(380px, 39vw, 570px); } } @media (min-width: 1100px) { .ry-hero-lanzamiento__eco { position: absolute; z-index: 1; inset-inline-start: 31%; inset-block-end: -.16em; display: block; color: transparent; font-family: var(--ry-sans); font-size: clamp(7rem, 11vw, 11rem); font-weight: 700; letter-spacing: -.08em; line-height: .8; -webkit-text-stroke: 1px rgb(250 247 242 / .13); white-space: nowrap; transform: rotate(-5deg); pointer-events: none; } } @media (max-width: 767px) { .ry-hero-lanzamiento { aspect-ratio: auto; block-size: clamp(680px, 82svh, 740px); min-block-size: 680px; grid-template-rows: 45% 55%; } .ry-hero-lanzamiento__foto { position: absolute; inset: 0; block-size: 100%; background: linear-gradient(180deg, #F2E5CC 0 46%, #0E392C 46% 100%); } .ry-hero-lanzamiento__foto img { object-fit: contain; object-position: 50% 0%; } .ry-hero-lanzamiento__velo { position: absolute; inset: 0; background: linear-gradient(0deg, rgb(10 27 20 / .30) 0%, rgb(10 27 20 / .08) 50%, rgb(10 27 20 / 0) 67%); } .ry-hero-lanzamiento__contenido { grid-area: 2 / 1; align-items: flex-start; padding-block: 24px 28px; background: transparent; } .ry-hero-lanzamiento__panel { inline-size: 100%; padding: 0; } .ry-hero-lanzamiento__identidad { margin-block-end: 15px; gap: 13px; } .ry-hero-lanzamiento__sello { inline-size: 58px; block-size: 58px; } .ry-hero-lanzamiento__sello small { font-size: .42rem; } .ry-hero-lanzamiento__sello strong { font-size: 1.25rem; } .ry-hero-lanzamiento__etiqueta { max-inline-size: 21ch; font-size: .66rem; } .ry-hero-lanzamiento__titulo { max-inline-size: 10ch; font-size: clamp(2.5rem, 12.8vw, 3.4rem); line-height: .88; } .ry-hero-lanzamiento__bajada { max-inline-size: 36ch; margin-block-start: 15px; font-size: .94rem; line-height: 1.45; } .ry-hero-lanzamiento__cta { min-block-size: 52px; margin-block-start: 19px; padding-inline: 22px 19px; font-size: 14px; } } @media (prefers-reduced-motion: reduce) { .ry-hero-lanzamiento__cta, .ry-hero-lanzamiento__cta > span { transition: none; } .ry-hero-lanzamiento__cta:active { transform: none; } }   .ry-ficha__vista { position: absolute; z-index: 2; inset-block-start: 10px; inset-inline-end: 10px; min-block-size: 34px; padding: 7px 11px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--ry-linea); border-radius: 999px; background: color-mix(in srgb, var(--ry-superficie) 92%, transparent); backdrop-filter: blur(8px); color: var(--ry-texto); font-size: 11px; font-weight: 600; line-height: 1; cursor: pointer; transition: opacity 180ms ease, transform 180ms ease, border-color 180ms ease; } .ry-ficha__vista .ry-i { inline-size: 14px; block-size: 14px; } .ry-ficha__vista.is-cargando { opacity: .55; pointer-events: none; } .ry-ficha__vista:hover, .ry-ficha__vista:focus-visible { border-color: var(--ry-texto); } @media (min-width: 1024px) and (hover: hover) { .ry-ficha__vista { opacity: 0; transform: translateY(-4px); } .ry-ficha:hover .ry-ficha__vista, .ry-ficha__vista:focus-visible { opacity: 1; transform: none; } }  @media (max-width: 519px) { .ry-ficha__vista span { display: none; } .ry-ficha__vista { inline-size: 44px; block-size: 44px; min-block-size: 44px; padding: 0; display: grid; place-items: center; } } .ry-vista-dialogo { max-inline-size: min(100vw, 940px); inline-size: 100%; max-block-size: 92svh; padding: 0; border: 0; border-radius: 16px; background: var(--ry-superficie); color: var(--ry-texto); overflow: visible; } .ry-vista-dialogo::backdrop { background: color-mix(in srgb, #060F0B 62%, transparent); backdrop-filter: blur(3px); } .ry-vista-dialogo__caja { position: relative; max-block-size: 92svh; overflow-y: auto; overscroll-behavior: contain; border-radius: inherit; } .ry-vista-dialogo__cerrar { position: absolute; z-index: 3; inset-block-start: 12px; inset-inline-end: 12px; inline-size: 44px; block-size: 44px; display: grid; place-items: center; border: 1px solid var(--ry-linea); border-radius: 50%; background: var(--ry-superficie); color: var(--ry-texto); cursor: pointer; } .ry-vista-dialogo__cuerpo { min-block-size: 220px; } .ry-vista__cargando, .ry-vista__error { margin: 0; padding: 90px 24px; color: var(--ry-texto-2); text-align: center; } .ry-vista { display: grid; gap: 0; } .ry-vista__foto { display: grid; place-items: center; padding: 26px; background: var(--ry-campo-foto, var(--ry-superficie-2)); } .ry-vista__foto img { inline-size: 100%; max-inline-size: 320px; block-size: auto; object-fit: contain; mix-blend-mode: multiply; } .ry-vista__datos { padding: 22px 22px 26px; } .ry-vista__titulo { margin: 0 0 4px; font-family: var(--ry-serif); font-size: clamp(1.5rem, 5vw, 2rem); font-weight: 500; letter-spacing: -.03em; line-height: 1.04; text-wrap: balance; } .ry-vista__marca { display: block; margin-bottom: 5px; color: var(--ry-acento); font-family: var(--ry-sans); font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; } .ry-vista__precio { margin-top: 14px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; } .ry-vista__precio strong { font-size: 26px; } .ry-vista__precio b { color: var(--ry-texto-2); font-size: 12px; font-weight: 600; } .ry-vista__precio em { color: var(--ry-acento); font-size: 12px; font-style: normal; font-weight: 700; } .ry-vista__compra { margin-top: 16px; } .ry-vista__compra form.cart { margin: 0; display: flex; align-items: stretch; gap: 10px; } .ry-vista__compra .quantity { flex: 0 0 auto; } .ry-vista__compra .single_add_to_cart_button { min-block-size: 52px; flex: 1 1 auto; display: inline-flex; align-items: center; justify-content: center; padding-inline: 22px; border: 1px solid var(--ry-acento); border-radius: 11px; background: var(--ry-acento); color: var(--ry-acento-texto); font-family: var(--ry-sans); font-size: 14px; font-weight: 750; line-height: 1.15; text-align: center; text-decoration: none; cursor: pointer; transition: background-color 160ms ease, border-color 160ms ease, transform 160ms ease; } .ry-vista__compra .single_add_to_cart_button:hover { border-color: var(--ry-acento-hondo); background: var(--ry-acento-hondo); } .ry-vista__compra .single_add_to_cart_button:active { transform: translateY(1px); } .ry-vista__compra .single_add_to_cart_button:focus-visible { outline: 2px solid var(--ry-acento); outline-offset: 3px; } .ry-vista__ficha { margin-top: 18px; display: inline-flex; align-items: center; gap: 7px; color: var(--ry-texto); font-size: 13px; font-weight: 600; text-decoration: none; } .ry-vista__ficha .ry-i { inline-size: 15px; block-size: 15px; } @media (min-width: 760px) { .ry-vista { grid-template-columns: minmax(0, 42%) minmax(0, 1fr); align-items: stretch; } .ry-vista__foto { min-block-size: 100%; padding: 34px; border-end-start-radius: 16px; border-start-start-radius: 16px; } .ry-vista__datos { padding: 30px 32px 34px; } } @media (prefers-reduced-motion: reduce) { .ry-ficha__vista { transition: none; } }  .ry-shop__count { margin: 0; color: var(--ry-texto-2); font-family: var(--ry-mono, var(--ry-sans)); font-size: 12px; letter-spacing: .04em; } .ry-orden { display: flex; align-items: center; gap: 9px; margin-inline-start: auto; } .ry-orden__rotulo { color: var(--ry-texto-2); font-size: 12px; white-space: nowrap; } .ry-orden__campo { position: relative; display: inline-flex; align-items: center; } .ry-orden__campo select { min-block-size: 40px; padding: 0 34px 0 13px; border: 1px solid var(--ry-linea); border-radius: 999px; background: var(--ry-superficie); color: var(--ry-texto); font-family: inherit; font-size: 13px; font-weight: 600; cursor: pointer; appearance: none; transition: border-color 160ms ease; } .ry-orden__campo select:hover { border-color: var(--ry-texto); } .ry-orden__campo select:focus-visible { outline: 2px solid var(--ry-acento); outline-offset: 2px; }  .ry-orden__campo .ry-i { position: absolute; inset-inline-end: 12px; inline-size: 14px; block-size: 14px; color: var(--ry-texto-2); pointer-events: none; }  .ry-shop__results > .ry-shop__count, .ry-shop__results > .ry-orden { grid-row: 1; } .ry-shop__results { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 14px; } .ry-shop__results > *:not(.ry-shop__count):not(.ry-orden) { grid-column: 1 / -1; }  @media (max-width: 599px) { .ry-orden__rotulo { display: none; } .ry-orden__campo select { max-inline-size: 46vw; text-overflow: ellipsis; } }  .ry-garantias { border-block-end: 1px solid var(--ry-linea); background: var(--ry-superficie); }  .ry-garantias__lista { margin: 0;  padding-inline: 0; padding-block: 14px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; list-style: none; } .ry-garantias__item { display: grid; justify-items: center; align-content: start; gap: 7px; text-align: center; } .ry-garantias__item a { display: contents; color: inherit; text-decoration: none; } .ry-garantias__item .ry-i { inline-size: 21px; block-size: 21px; color: var(--ry-acento); }  .ry-garantias__item strong, .ry-garantias__item small { display: block; } .ry-garantias__item strong {  font-size: clamp(9.5px, 2.9vw, 12px); font-weight: 700; letter-spacing: -.012em; line-height: 1.16; text-wrap: balance; } .ry-garantias__item small { display: none; margin-top: 1px; color: var(--ry-texto-2); font-size: 11px; line-height: 1.35; } .ry-garantias__item a:hover strong { color: var(--ry-acento); }  @media (min-width: 720px) { .ry-garantias__lista { padding-block: 20px; gap: 0; } .ry-garantias__item { grid-template-columns: 30px minmax(0, 1fr); justify-items: stretch; align-content: center; align-items: center; gap: 11px; padding-inline: clamp(12px, 2vw, 24px); text-align: start; } .ry-garantias__item .ry-i { inline-size: 22px; block-size: 22px; justify-self: center; } .ry-garantias__item strong { font-size: 13px; line-height: 1.25; text-wrap: initial; } .ry-garantias__item small { display: block; } .ry-garantias__item + .ry-garantias__item { border-inline-start: 1px solid var(--ry-linea); } .ry-garantias__item:first-child { padding-inline-start: 0; } .ry-garantias__item:last-child { padding-inline-end: 0; } } @media (min-width: 1024px) { .ry-garantias__item strong { font-size: 14px; } .ry-garantias__item small { font-size: 12px; } }  @media (max-width: 699px) { .ry-ficha:not(.ry-ficha--ancha) > .ry-ficha__chip { top: 13px; left: 13px; padding: 3px 6px; font-size: 9px; }  .ry-ficha:not(.ry-ficha--ancha) .ry-ficha__campo { padding-top: 26px; aspect-ratio: auto; } .ry-ficha:not(.ry-ficha--ancha) .ry-ficha__campo img { aspect-ratio: 1 / 1; block-size: auto; }  .ry-ficha--ancha { grid-template-columns: 120px minmax(0, 1fr); } .ry-ficha--ancha > .ry-ficha__chip { top: 12px; left: 12px; padding: 2px 5px; font-size: 9px; } .ry-ficha--ancha .ry-ficha__campo { padding-top: 22px; aspect-ratio: auto; } .ry-ficha--ancha .ry-ficha__campo img { aspect-ratio: 1 / 1; block-size: auto; } }  .ry-panel__mundo-todo { margin-block-end: 14px; padding: 11px 14px; min-block-size: 44px; display: flex; align-items: center; justify-content: space-between; gap: 10px; border: 1px solid rgba(231, 171, 108, .38); border-radius: 10px; background: rgba(231, 171, 108, .09); color: #f7eee1; font-size: 13px; font-weight: 600; text-decoration: none; } .ry-panel__mundo-todo .ry-i { inline-size: 15px; block-size: 15px; flex: 0 0 auto; color: #efa164; } .ry-panel__mundo-todo:hover { background: rgba(231, 171, 108, .16); } .ry-panel__mundo-todo:focus-visible { outline: 2px solid #efa164; outline-offset: 3px; }  .ry-entrega { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border: 1px solid var(--ry-linea); border-radius: var(--ry-r-superficie); background: var(--ry-superficie); color: var(--ry-texto); }  .ry-entrega.is-hoy { border-color: color-mix(in srgb, var(--ry-fuerte) 55%, var(--ry-linea)); background: color-mix(in srgb, var(--ry-fuerte) 6%, var(--ry-superficie)); } .ry-entrega.is-hoy .ry-entrega__sello { background: var(--ry-fuerte); color: var(--ry-superficie); } .ry-entrega__sello { inline-size: 34px; block-size: 34px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; background: color-mix(in srgb, var(--ry-fuerte) 12%, transparent); color: var(--ry-fuerte); } .ry-entrega__sello .ry-i { inline-size: 19px; block-size: 19px; } .ry-entrega__texto { margin: 0; min-inline-size: 0; display: flex; flex-direction: column; gap: 2px; } .ry-entrega__titulo { font-size: 13px; font-weight: 700; letter-spacing: .01em; } .ry-entrega.is-hoy .ry-entrega__titulo { color: var(--ry-fuerte); } .ry-entrega__detalle { color: var(--ry-texto-2); font-size: 12.5px; line-height: 1.4; text-wrap: pretty; }  .ry-entrega--portada { margin-block: 0 4px; padding: 14px 18px; } .ry-entrega--portada .ry-entrega__titulo { font-size: 14px; } .ry-entrega--portada .ry-entrega__detalle { font-size: 13px; }  .ry-entrega--ficha, .ry-entrega--carrito { margin-block-end: 12px; } .ry-entrega--ficha .ry-entrega__sello, .ry-entrega--carrito .ry-entrega__sello { inline-size: 30px; block-size: 30px; } @media (max-width: 559px) { .ry-entrega { padding: 11px 13px; gap: 10px; } .ry-entrega__detalle { font-size: 12px; } }  @media (min-width: 700px) { .ry-pdp__galeria { grid-template-columns: minmax(0, 1fr); gap: 14px; } .ry-pdp__foto-principal { order: 1; } .ry-pdp__miniaturas { order: 2; grid-auto-flow: column; grid-auto-columns: 78px; justify-content: start; gap: 10px; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: thin; } .ry-pdp__miniatura { width: 78px; } } @media (min-width: 1024px) { .ry-pdp__galeria { gap: 16px; } .ry-pdp__miniaturas { grid-auto-columns: 88px; gap: 12px; } .ry-pdp__miniatura { width: 88px; }  .ry-pdp__foto-principal { min-height: 620px; } .ry-pdp__foto-principal > img { width: 100%; max-height: 580px; } }   .ry-entrega.ry-entrega--barra { padding: 16px clamp(16px, 4vw, 40px); display: flex; align-items: center; justify-content: center; gap: clamp(14px, 2vw, 28px); border: 0; border-radius: 0; background: var(--ry-fuerte); color: var(--ry-fondo); text-align: left; } .ry-entrega.ry-entrega--barra .ry-entrega__sello { inline-size: 42px; block-size: 42px; background: color-mix(in srgb, var(--ry-fondo) 16%, transparent); color: var(--ry-fondo); } .ry-entrega.ry-entrega--barra .ry-entrega__sello .ry-i { inline-size: 22px; block-size: 22px; } .ry-entrega.ry-entrega--barra .ry-entrega__texto { gap: 3px; } .ry-entrega.ry-entrega--barra .ry-entrega__titulo { color: var(--ry-fondo); font-size: 12px; letter-spacing: .11em; text-transform: uppercase; } .ry-entrega.ry-entrega--barra .ry-entrega__detalle { max-inline-size: 46ch; color: color-mix(in srgb, var(--ry-fondo) 82%, transparent); font-size: 13.5px; } .ry-entrega__reloj { display: none; font-size: 15px; font-weight: 700; } .ry-entrega.ry-entrega--barra .ry-entrega__reloj { padding: 8px 18px; display: block; flex: 0 0 auto; border-radius: 999px; background: color-mix(in srgb, var(--ry-fondo) 14%, transparent); color: var(--ry-fondo); font-size: clamp(1.4rem, 2.4vw, 2rem); font-weight: 700; letter-spacing: -.01em; line-height: 1.05; white-space: nowrap; } .ry-entrega.ry-entrega--barra .ry-entrega__reloj[hidden] { display: none; }  .ry-entrega.ry-entrega--barra:not(.is-hoy) { background: color-mix(in srgb, var(--ry-fuerte) 88%, #000); } @media (max-width: 899px) { .ry-entrega.ry-entrega--barra { padding: 13px 16px; flex-wrap: wrap; justify-content: flex-start; gap: 10px 12px; } .ry-entrega.ry-entrega--barra .ry-entrega__reloj { order: 3; inline-size: 100%; padding: 7px 14px; font-size: 1.25rem; text-align: center; } .ry-entrega.ry-entrega--barra .ry-entrega__texto { flex: 1 1 60%; } .ry-entrega.ry-entrega--barra .ry-entrega__detalle { font-size: 12.5px; } }  .ry-entrega--ficha { flex-wrap: wrap; } .ry-entrega--ficha .ry-entrega__texto { flex: 1 1 200px; } .ry-entrega--ficha .ry-entrega__reloj { display: block; inline-size: fit-content;  margin-inline-start: 42px; margin-block-start: 2px; padding: 5px 13px; border-radius: 999px; background: color-mix(in srgb, var(--ry-fuerte) 13%, transparent); color: var(--ry-fuerte); font-size: 15px; font-weight: 700; white-space: nowrap; } .ry-entrega--ficha .ry-entrega__reloj[hidden], .ry-entrega--carrito .ry-entrega__reloj { display: none; }  .ry-pie__redes { margin: 16px 0 0; padding: 0; display: flex; gap: 10px; list-style: none; } .ry-pie__redes a { inline-size: 44px; block-size: 44px; display: grid; place-items: center; border: 1px solid color-mix(in srgb, currentColor 22%, transparent); border-radius: 50%; color: inherit; text-decoration: none; transition: border-color 180ms ease, background-color 180ms ease; } .ry-pie__redes a:hover { border-color: color-mix(in srgb, currentColor 46%, transparent); background: color-mix(in srgb, currentColor 8%, transparent); } .ry-pie__redes a:focus-visible { outline: 2px solid var(--ry-acento); outline-offset: 3px; } .ry-pie__redes .ry-i { inline-size: 19px; block-size: 19px; }  @media (min-width: 1024px) { .ry-pdp__compra { grid-template-columns: minmax(0, 1fr) minmax(380px, 460px); } } @media (min-width: 1280px) { .ry-pdp__compra { grid-template-columns: minmax(0, 1fr) minmax(420px, 500px); } }  @media (min-width: 700px) { .ry-pdp__detalles { grid-template-columns: minmax(0, 1fr); gap: 28px; } .ry-pdp__detalles-copia { order: 1; } .ry-pdp__detalles-fotos { order: 2; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; } .ry-pdp__detalles-fotos figure { margin: 0; }  .ry-pdp__cierre { inline-size: 100%; max-inline-size: none; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; padding: 18px 26px; } .ry-pdp__cierre-precio { flex: 0 0 auto; font-size: clamp(1.5rem, 2vw, 1.9rem); font-weight: 700; white-space: nowrap; } .ry-pdp__cierre-acciones { flex: 0 1 auto; display: flex; align-items: center; gap: 14px; } .ry-pdp__cierre-acciones > .ry-btn { inline-size: clamp(200px, 22vw, 290px); min-block-size: 50px; } .ry-pdp__cierre-consulta { flex: 0 0 auto; white-space: nowrap; }  .ry-pdp__cierre-envio { margin: 0; margin-inline-start: auto; white-space: nowrap; } } @media (max-width: 699px) {  .ry-pdp__cierre { inline-size: 100%; } .ry-pdp__cierre-acciones { display: grid; gap: 10px; } }  @media (max-width: 699px) { .ry-pdp__galeria { grid-template-columns: minmax(0, 1fr); gap: 10px; } .ry-pdp__foto-principal { order: 1; } .ry-pdp__miniaturas { order: 2; grid-auto-flow: column; grid-auto-columns: 62px; justify-content: start; gap: 8px; overflow-x: auto; overscroll-behavior-inline: contain;  scroll-snap-type: inline proximity; } .ry-pdp__miniatura { width: 62px; scroll-snap-align: start; } }  .ry-pdp__detalles-fotos figure { max-block-size: 300px; overflow: hidden; border-radius: 14px; } .ry-pdp__detalles-fotos img { inline-size: 100%; block-size: 100%; object-fit: contain; }  .ry-panel__grupo-categorias > .ry-panel__grupo-rotulo { margin: 0 0 9px; color: #efa164; font-family: var(--ry-mono); font-size: 9px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }  .ry-ficha__chips { position: absolute; top: 13px; left: 13px; right: 13px; z-index: 1; display: flex; flex-wrap: wrap; gap: 5px; pointer-events: none; }  .ry-ficha__chips > .ry-ficha__chip { position: static; top: auto; left: auto; } .ry-ficha__chip--oferta { border-color: color-mix(in srgb, var(--ry-acento) 55%, var(--ry-linea)); background: var(--ry-acento); color: var(--ry-superficie); } @media (max-width: 699px) { .ry-ficha:not(.ry-ficha--ancha) > .ry-ficha__chips { top: 10px; left: 10px; right: 10px; gap: 4px; }  .ry-shop ul.products li.product, .ry-shop ul.products li.product.product, .ry-archivo ul.products li.product { padding: 0; border: 0; }  .ry-shop ul.products .ry-ficha, .ry-archivo .ry-ficha { padding: 8px; } .ry-shop ul.products .ry-ficha .ry-ficha__campo img, .ry-archivo .ry-ficha .ry-ficha__campo img { padding: 4px; } .ry-shop .ry-contenedor, .ry-archivo .ry-contenedor { padding-inline: 12px; } .ry-shop ul.products, .ry-archivo ul.products { gap: 10px; } }   .ry-entrega.ry-entrega--linea { padding: 0 clamp(16px, 4vw, 40px); min-block-size: 46px; display: flex; align-items: center; justify-content: center; gap: 12px; border: 0; border-radius: 0; background: var(--ry-fuerte); color: var(--ry-fondo); } .ry-entrega--linea .ry-entrega__sello { inline-size: 22px; block-size: 22px; background: transparent; color: var(--ry-fondo); } .ry-entrega--linea .ry-entrega__sello .ry-i { inline-size: 17px; block-size: 17px; }  .ry-entrega--linea .ry-entrega__texto { flex-direction: row; align-items: baseline; gap: 8px; }  .ry-entrega--linea .ry-entrega__titulo, .ry-entrega--linea.is-hoy .ry-entrega__titulo { color: var(--ry-fondo); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; } .ry-entrega--linea .ry-entrega__detalle { color: color-mix(in srgb, var(--ry-fondo) 88%, transparent); font-size: 13px;  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-inline-size: 52ch; } .ry-entrega--linea .ry-entrega__reloj { display: block; padding: 3px 11px; border-radius: 999px; background: color-mix(in srgb, var(--ry-fondo) 16%, transparent); color: var(--ry-fondo); font-size: 14px; font-weight: 700; white-space: nowrap; } .ry-entrega--linea .ry-entrega__reloj[hidden] { display: none; } @media (max-width: 699px) { .ry-entrega.ry-entrega--linea { padding-inline: 14px; gap: 9px; } .ry-entrega--linea .ry-entrega__titulo { font-size: 10.5px; } .ry-entrega--linea .ry-entrega__detalle { display: none; } .ry-entrega--linea .ry-entrega__reloj { font-size: 13px; } }  .ry-garantias__item--entrega .ry-i { color: var(--ry-fuerte); } .ry-entrega.ry-entrega--garantia { display: contents; padding: 0; border: 0; background: none; } .ry-entrega--garantia strong { color: var(--ry-fuerte); }  .ry-garantias__item--entrega small { white-space: nowrap; } .ry-entrega--garantia .ry-entrega__reloj { display: inline; margin-inline-end: 5px; padding: 1px 7px; border-radius: 999px; background: color-mix(in srgb, var(--ry-fuerte) 14%, transparent); color: var(--ry-fuerte); font-weight: 700; } .ry-entrega--garantia .ry-entrega__reloj[hidden] { display: none; }  .ry-entrega.ry-entrega--flotante { position: fixed;  inset-block-end: 22px; inset-inline-start: 22px; z-index: 60; max-inline-size: min(320px, calc(100vw - 44px)); padding: 11px 15px; gap: 11px; border-color: color-mix(in srgb, var(--ry-fuerte) 45%, var(--ry-linea)); background: var(--ry-superficie); box-shadow: 0 10px 30px rgba(2, 16, 11, .18); } .ry-entrega.ry-entrega--flotante.is-hoy { border-color: var(--ry-fuerte); background: var(--ry-fuerte); color: var(--ry-fondo); } .ry-entrega--flotante.is-hoy .ry-entrega__titulo, .ry-entrega--flotante.is-hoy .ry-entrega__detalle { color: var(--ry-fondo); } .ry-entrega--flotante.is-hoy .ry-entrega__sello { background: color-mix(in srgb, var(--ry-fondo) 18%, transparent); color: var(--ry-fondo); } .ry-entrega--flotante .ry-entrega__titulo { font-size: 12px; } .ry-entrega--flotante .ry-entrega__detalle { font-size: 11.5px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }  .ry-entrega.ry-entrega--flotante { flex-wrap: wrap; } .ry-entrega--flotante .ry-entrega__texto { flex: 1 1 150px; } .ry-entrega--flotante .ry-entrega__reloj { display: block; inline-size: fit-content;  margin-inline-start: 45px; margin-block-start: 2px; padding: 3px 11px; border-radius: 999px; background: color-mix(in srgb, var(--ry-fondo) 16%, transparent); font-size: 15px; font-weight: 700; white-space: nowrap; }  .ry-entrega--flotante:not(.is-hoy) .ry-entrega__reloj { background: color-mix(in srgb, var(--ry-fuerte) 12%, transparent); color: var(--ry-fuerte); } .ry-entrega--flotante .ry-entrega__reloj[hidden] { display: none; } @media (max-width: 699px) {  .ry-entrega.ry-entrega--flotante { inset-block-end: 14px; inset-inline-start: 12px; max-inline-size: calc(100vw - 92px); padding: 9px 12px; } }  .ry-entrega.ry-entrega--flotante { position: fixed; inset-block-end: 22px; inset-inline-start: 22px; z-index: 60;  display: block; inline-size: auto; max-inline-size: none; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; } .ry-entrega__mini { display: inline-flex; align-items: center; gap: 7px; min-block-size: 40px; padding: 0 14px 0 11px; border: 1px solid color-mix(in srgb, var(--ry-fuerte) 40%, var(--ry-linea)); border-radius: 999px; background: var(--ry-superficie); color: var(--ry-texto); box-shadow: 0 6px 18px rgba(2, 16, 11, .16); cursor: pointer; font: inherit; line-height: 1; } .ry-entrega--flotante.is-hoy .ry-entrega__mini { border-color: var(--ry-fuerte); background: var(--ry-fuerte); color: var(--ry-fondo); } .ry-entrega__mini .ry-i { inline-size: 17px; block-size: 17px; flex: 0 0 auto; } .ry-entrega--flotante .ry-entrega__reloj { display: block; padding: 0; border: 0; background: none; color: inherit; font-size: 13.5px; font-weight: 700; white-space: nowrap; } .ry-entrega--flotante .ry-entrega__reloj[hidden] { display: none; }  .ry-entrega--flotante.is-hoy .ry-entrega__mini-rotulo { display: none; } .ry-entrega--flotante .ry-entrega__mini-rotulo { font-size: 12.5px; font-weight: 600; white-space: nowrap; } .ry-entrega__pop { position: absolute; inset-block-end: calc(100% + 8px); inset-inline-start: 0; inline-size: max-content; max-inline-size: min(280px, calc(100vw - 44px)); padding: 11px 14px; border: 1px solid var(--ry-linea); border-radius: 12px; background: var(--ry-superficie); color: var(--ry-texto-2); box-shadow: 0 12px 32px rgba(2, 16, 11, .2); font-size: 12.5px; line-height: 1.45; text-wrap: pretty; } .ry-entrega__pop[hidden] { display: none; } .ry-entrega__mini:focus-visible { outline: 2px solid var(--ry-acento); outline-offset: 3px; } @media (max-width: 699px) { .ry-entrega.ry-entrega--flotante { inset-block-end: 16px; inset-inline-start: 14px; } .ry-entrega__mini { min-block-size: 36px; padding: 0 12px 0 10px; gap: 6px; } .ry-entrega--flotante .ry-entrega__reloj { font-size: 12.5px; } }   .ry-garantias__lista { display: flex; grid-template-columns: none; } .ry-garantias__lista > .ry-garantias__item { flex: 1 1 0; min-inline-size: 0; }  @media (max-width: 719px) { .ry-garantias__item--entrega small { display: block; margin-block-start: 2px; font-size: 10.5px; white-space: normal; } .ry-garantias__item--entrega .ry-entrega__reloj { padding: 1px 6px; font-size: 10.5px; } }  .ry-ficha__chips { justify-content: space-between; }  @media (min-width: 720px) { .ry-garantias__lista > .ry-garantias__item { grid-template-columns: 30px auto; justify-content: center; padding-inline: clamp(12px, 2vw, 24px); } .ry-garantias__lista > .ry-garantias__item:first-child { padding-inline-start: clamp(12px, 2vw, 24px); } .ry-garantias__lista > .ry-garantias__item:last-child { padding-inline-end: clamp(12px, 2vw, 24px); } } @media (max-width: 719px) {  .ry-garantias__lista > .ry-garantias__item { justify-items: center; text-align: center; } }  .ry-pdp__variants { margin-block: 18px 0; display: grid; gap: 9px; } .ry-pdp__variants > label, .ry-pdp__variants .label { font-size: 13px; font-weight: 600; }  .ry-pdp__variants--enhanced > select { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; } .ry-pills { display: flex; flex-wrap: wrap; gap: 8px; } .ry-pills__item { min-block-size: 46px; padding-inline: 16px; border: 1px solid var(--ry-linea); border-radius: 10px; background: var(--ry-superficie); color: var(--ry-texto); font-family: var(--ry-mono); font-size: 12px; font-weight: 700; cursor: pointer; transition: border-color 180ms ease, background-color 180ms ease, color 180ms ease; } .ry-pills__item:hover { border-color: var(--ry-texto); } .ry-pills__item[aria-pressed="true"] { border-color: var(--ry-fuerte); background: var(--ry-fuerte); color: var(--ry-fondo); } .ry-pills__item:focus-visible { outline: 2px solid var(--ry-acento); outline-offset: 2px; }   .woocommerce .single_add_to_cart_button.button.alt, .single_add_to_cart_button.button.alt { background: var(--ry-acento); border-color: var(--ry-acento); color: var(--ry-superficie); border-radius: 999px; font-weight: 600; } .woocommerce .single_add_to_cart_button.button.alt:hover, .single_add_to_cart_button.button.alt:hover { background: color-mix(in srgb, var(--ry-acento) 88%, #000); }  .woocommerce .single_add_to_cart_button.button.alt.disabled, .woocommerce .single_add_to_cart_button.button.alt.wc-variation-selection-needed, .single_add_to_cart_button.button.alt.disabled { background: color-mix(in srgb, var(--ry-linea) 60%, var(--ry-superficie)); border-color: var(--ry-linea); color: var(--ry-texto-2); cursor: not-allowed; }  .woocommerce div.product .woocommerce-variation-price { margin-block: 6px 10px; } .woocommerce div.product .woocommerce-variation-availability { font-size: 13px; }  .ry-lupa { inline-size: min(94vw, 1100px); max-inline-size: none; block-size: auto; max-block-size: 92vh; padding: 0; border: 0; border-radius: 16px; background: var(--ry-superficie); overflow: visible; } .ry-lupa::backdrop { background: rgba(2, 16, 11, .78); } .ry-lupa img { display: block; inline-size: 100%; block-size: auto; max-block-size: 92vh; object-fit: contain; border-radius: 16px; } .ry-lupa__cerrar { position: absolute; inset-block-start: -14px; inset-inline-end: -14px; inline-size: 42px; block-size: 42px; display: grid; place-items: center; border: 1px solid var(--ry-linea); border-radius: 50%; background: var(--ry-superficie); color: var(--ry-texto); cursor: pointer; } .ry-lupa__cerrar:focus-visible { outline: 2px solid var(--ry-acento); outline-offset: 2px; }  .ry-pdp__foto-principal { cursor: zoom-in; } .ry-pdp__foto-principal:focus-visible { outline: 2px solid var(--ry-acento); outline-offset: 3px; } @media (max-width: 699px) { .ry-lupa { inline-size: 96vw; border-radius: 12px; } .ry-lupa__cerrar { inset-block-start: -10px; inset-inline-end: -10px; inline-size: 38px; block-size: 38px; } }  .ry-conv--garantias { padding: 16px 18px; border: 1px solid var(--ry-linea); border-radius: var(--ry-r-superficie); background: var(--ry-superficie); } .ry-conv--garantias ul { gap: 0; }  .ry-conv--garantias li + li { margin-block-start: 11px; padding-block-start: 11px; border-block-start: 1px solid color-mix(in srgb, var(--ry-linea) 70%, transparent); } .ry-conv--garantias li { grid-template-columns: 22px minmax(0, 1fr); gap: 12px; } .ry-conv--garantias .ry-i { inline-size: 19px; block-size: 19px; } .ry-conv--garantias strong { font-size: 13.5px; }  .ry-conv--garantias a { text-decoration: none; border-block-end: 1px solid transparent; } .ry-conv--garantias a:hover { border-block-end-color: currentColor; }  @media (min-width: 700px) { .ry-pdp__cierre { justify-content: center; } .ry-pdp__cierre-envio { margin-inline-start: 0; } }   .ry-ficha__vista { top: auto; bottom: 10px; right: 10px; }  .ry-anuncio button, .ry-anuncio a, .ry-cintillo button, .ry-cintillo a { min-block-size: 24px; min-inline-size: 24px; }  @media (max-width: 699px) { .ry-buscador input[type="search"], .ry-buscador__campo input { font-size: 16px; } .ry-buscador__campo, .ry-buscador form { overflow: hidden; border-radius: 999px; } }  @media (max-width: 699px) { .ry-riel .ry-ficha, .ry-ofertas .ry-ficha { width: min(64vw, 240px); min-block-size: 0; } }  .ry-pdp__precio .woocommerce-variation-price, .ry-pdp__precio .price, .ry-pdp__precio ins, .ry-pdp__precio .amount { font-size: inherit; font-weight: inherit; color: inherit; }  .ry-entrega--ficha { margin-block-start: 18px; }   .woocommerce-account:not(.logged-in) #customer_login.ry-cuenta--una-columna { display: block; } .woocommerce-account:not(.logged-in) #customer_login.ry-cuenta--una-columna > .u-column2 { display: none; } .woocommerce-account:not(.logged-in) #customer_login.ry-cuenta--una-columna.is-registro > .u-column1 { display: none; } .woocommerce-account:not(.logged-in) #customer_login.ry-cuenta--una-columna.is-registro > .u-column2 { display: grid; } .woocommerce-account #customer_login.ry-cuenta--una-columna > .u-column1, .woocommerce-account #customer_login.ry-cuenta--una-columna > .u-column2 { inline-size: 100%; max-inline-size: 460px; margin-inline: auto; float: none; } .ry-cuenta__cambiar { margin-block-start: 16px; padding-block-start: 14px; border-block-start: 1px solid var(--ry-linea); color: var(--ry-texto-2); font-size: 13.5px; text-align: center; } .ry-cuenta__cambiar button { padding: 0; border: 0; background: none; color: var(--ry-fuerte); font: inherit; font-weight: 700; cursor: pointer; } .ry-cuenta__cambiar button:hover { color: var(--ry-acento); } .ry-cuenta__cambiar button:focus-visible { outline: 2px solid var(--ry-acento); outline-offset: 2px; }  .ry-pdp__pestanias-lista { overflow-y: hidden;  overscroll-behavior-x: contain;  padding-block: 4px; }  .ry-pdp__cierre-producto { display: flex; align-items: center; gap: 14px; min-inline-size: 0; } .ry-pdp__cierre-foto { flex: 0 0 auto; inline-size: 64px; block-size: 64px; margin: 0; padding: 6px; border: 1px solid var(--ry-linea); border-radius: 11px; background: #fff; } .ry-pdp__cierre-foto img { inline-size: 100%; block-size: 100%; object-fit: contain; } .ry-pdp__cierre-datos { display: grid; gap: 3px; min-inline-size: 0; } .ry-pdp__cierre-marca { color: var(--ry-texto-2); font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; } .ry-pdp__cierre-nombre { font-size: 16px; font-weight: 700; line-height: 1.25; }  @media (max-width: 899px) { .ry-pdp__cierre { display: grid; gap: 14px; } .ry-pdp__cierre-acciones { margin-top: 0; } } @media (min-width: 900px) { .ry-pdp__cierre { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 28px; } .ry-pdp__cierre-producto { flex: 1 1 260px; } .ry-pdp__cierre-acciones { flex: 0 0 auto; display: flex; align-items: stretch; gap: 12px; margin-top: 0; } .ry-pdp__cierre-acciones > .ry-btn { inline-size: auto; min-inline-size: 210px; }  .ry-pdp__cierre-consulta { justify-content: center; min-block-size: 52px; padding-inline: 18px; border: 1px solid var(--ry-linea-fuerte, var(--ry-linea)); border-radius: 9px; background: #fff; font-size: 15px; white-space: nowrap; } .ry-pdp__cierre-consulta:hover { border-color: var(--ry-fuerte); color: var(--ry-fuerte); } }  .ry-pdp__obsequio { display: flex; align-items: flex-start; gap: 11px; margin: 14px 0 0; padding: 12px 14px; border: 1px solid color-mix(in srgb, var(--ry-acento) 24%, transparent); border-radius: 12px; background: color-mix(in srgb, var(--ry-acento) 7%, var(--ry-superficie, #fff)); } .ry-pdp__obsequio[hidden] { display: none; } .ry-pdp__obsequio-icono { display: flex; flex: 0 0 auto; align-items: center; justify-content: center; inline-size: 30px; block-size: 30px; border-radius: 50%; background: color-mix(in srgb, var(--ry-acento) 14%, transparent); color: var(--ry-acento); } .ry-pdp__obsequio-icono .ry-i { inline-size: 17px; block-size: 17px; } .ry-pdp__obsequio > span:last-child { display: grid; gap: 2px; min-inline-size: 0; } .ry-pdp__obsequio strong { color: var(--ry-texto); font-size: 15px; font-weight: 700; line-height: 1.3; } .ry-pdp__obsequio em { color: var(--ry-texto-2); font-size: 13px; font-style: normal; line-height: 1.45; }   @media (max-width: 899px) { .ry-orden select { font-size: 16px; padding-inline: 12px 30px; } }  @media (max-width: 899px) { .ry-ficha__vista { display: none !important; } }  @media (min-width: 900px) and (hover: hover) { .ry-ficha__vista { inset-block-start: 10px; inset-block-end: auto; inset-inline-end: 10px; } .ry-ficha__chips { transition: flex-direction 0s, gap 160ms ease; } .ry-ficha:hover .ry-ficha__chips, .ry-ficha:focus-within .ry-ficha__chips { flex-direction: column; align-items: flex-start; gap: 5px; } }  :where(a, button, summary, [tabindex]):focus-visible { outline: 2px solid color-mix(in srgb, var(--ry-fuerte) 60%, transparent); outline-offset: 1px; }  .ry-entrega--flotante.is-hoy .ry-entrega__mini-rotulo { display: inline; } .ry-entrega--flotante .ry-entrega__mini-rotulo { font-size: 13px; font-weight: 700; white-space: nowrap; }  .ry-entrega--flotante.is-hoy .ry-entrega__mini { border-color: color-mix(in srgb, var(--ry-fuerte) 30%, var(--ry-linea)); background: var(--ry-superficie); color: var(--ry-texto); } .ry-entrega--flotante.is-hoy .ry-entrega__mini .ry-i { color: var(--ry-fuerte); }  .ry-entrega--flotante.is-hoy .ry-entrega__reloj { padding-inline-start: 6px; border-inline-start: 1px solid var(--ry-linea); margin-inline-start: 2px; color: var(--ry-acento); font-weight: 700; } .ry-entrega__cerrar { position: absolute; inset-block-start: -7px; inset-inline-end: -7px; inline-size: 24px; block-size: 24px; display: grid; place-items: center; padding: 0; border: 1px solid var(--ry-linea); border-radius: 50%; background: var(--ry-superficie); color: var(--ry-texto-2); box-shadow: 0 2px 8px rgba(2, 16, 11, .18); cursor: pointer; } .ry-entrega__cerrar .ry-i { inline-size: 11px; block-size: 11px; } .ry-entrega__cerrar:hover { color: var(--ry-texto); border-color: var(--ry-fuerte); } .ry-entrega--flotante[hidden] { display: none !important; }  .ry-vista__compra .variations { inline-size: 100%; margin: 0 0 12px; border-collapse: collapse; } .ry-vista__compra .variations td, .ry-vista__compra .variations th { padding: 0; border: 0; display: block; text-align: start; } .ry-vista__compra .variations .label label { display: block; margin: 0 0 7px; color: var(--ry-texto-2); font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }  .ry-vista__compra .ry-pdp__variants--enhanced select { display: none; } .ry-vista__compra .ry-pdp__variants select { inline-size: 100%; max-inline-size: 280px; min-block-size: 42px; padding: 0 12px; border: 1px solid var(--ry-linea); border-radius: 9px; background: var(--ry-superficie); font-size: 16px; } .ry-vista__compra .reset_variations { display: inline-block; margin-block-start: 8px; color: var(--ry-texto-2); font-size: 12.5px; }  .ry-vista__compra .woocommerce-variation-price, .ry-vista__compra .woocommerce-variation-availability { display: none; } .ry-vista__compra form.cart.variations_form { display: block; } .ry-vista__compra .woocommerce-variation-add-to-cart { display: flex; flex-wrap: wrap; align-items: stretch; gap: 10px; margin-block-start: 14px; } .ry-vista__compra .ry-pills { margin: 0; }  .ry-entrega__capsula { display: inline-flex; align-items: stretch; border: 1px solid color-mix(in srgb, var(--ry-fuerte) 30%, var(--ry-linea)); border-radius: 999px; background: var(--ry-superficie); box-shadow: 0 6px 18px rgba(2, 16, 11, .16); overflow: hidden; }  .ry-entrega--flotante .ry-entrega__mini, .ry-entrega--flotante.is-hoy .ry-entrega__mini { border: 0; border-radius: 0; background: none; box-shadow: none; padding-inline: 14px 12px; } .ry-entrega__cerrar { position: static; inline-size: 34px; block-size: auto; display: grid; place-items: center; padding: 0; border: 0; border-inline-start: 1px solid var(--ry-linea); border-radius: 0; background: none; box-shadow: none; color: var(--ry-texto-2); cursor: pointer; } .ry-entrega__cerrar .ry-i { inline-size: 12px; block-size: 12px; } .ry-entrega__cerrar:hover { background: var(--ry-superficie-2); color: var(--ry-texto); }  .ry-entrega--flotante.is-hoy .ry-entrega__reloj { padding-inline-start: 0; border-inline-start: 0; margin-inline-start: 8px; }   .ry-entrega.ry-entrega--flotante, .ry-entrega.ry-entrega--flotante.is-hoy { padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; gap: 0; }  .ry-entrega__antes { margin-inline-start: 8px; color: var(--ry-texto-2); font-size: 12.5px; font-weight: 500; white-space: nowrap; } .ry-entrega__antes[hidden] { display: none; } .ry-entrega--flotante.is-hoy .ry-entrega__reloj { margin-inline-start: 5px; }  @media (max-width: 419px) { .ry-entrega__antes { display: none; } }