/* =========================================================
   CORATTO PET — CATÁLOGO PÚBLICO
   Base oficial: catalogo.php con sidebar lateral
   ========================================================= */

.catalog-page {
    --catalog-paper: #fffaf4;
    --catalog-paper-soft: #fbf1e4;
    --catalog-cream: #f3e1c9;
    --catalog-cream-deep: #e5c393;
    --catalog-brown: #402b20;
    --catalog-brown-soft: #5c4030;
    --catalog-muted: #786558;
    --catalog-gold: #bd7d31;
    --catalog-gold-soft: #d6a15c;
    --catalog-line: rgb(98 66 45 / 14%);
    --catalog-line-strong: rgb(98 66 45 / 24%);
    --catalog-shadow: 0 1rem 2.6rem rgb(67 43 28 / 8%);
    --catalog-shadow-soft: 0 .65rem 1.7rem rgb(67 43 28 / 6%);
    --catalog-shadow-hover: 0 1.4rem 3.2rem rgb(67 43 28 / 13%);
    --catalog-sidebar-width: 21rem;
    --catalog-gap: clamp(1.7rem, 2.2vw, 2.2rem);

    background: var(--catalog-paper);
    color: var(--catalog-brown);
    font-family: var(--sans);
}

.catalog-page main {
    overflow: clip;

    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='%23bd7d31' fill-opacity='.095'%3E%3Cellipse cx='50' cy='63' rx='20' ry='17'/%3E%3Cellipse cx='23' cy='39' rx='9' ry='13'/%3E%3Cellipse cx='42' cy='25' rx='9' ry='13'/%3E%3Cellipse cx='60' cy='25' rx='9' ry='13'/%3E%3Cellipse cx='79' cy='39' rx='9' ry='13'/%3E%3C/g%3E%3C/svg%3E"),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='%23cba77e' fill-opacity='.08'%3E%3Cellipse cx='50' cy='63' rx='20' ry='17'/%3E%3Cellipse cx='23' cy='39' rx='9' ry='13'/%3E%3Cellipse cx='42' cy='25' rx='9' ry='13'/%3E%3Cellipse cx='60' cy='25' rx='9' ry='13'/%3E%3Cellipse cx='79' cy='39' rx='9' ry='13'/%3E%3C/g%3E%3C/svg%3E"),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='%23b88854' fill-opacity='.065'%3E%3Cellipse cx='50' cy='63' rx='20' ry='17'/%3E%3Cellipse cx='23' cy='39' rx='9' ry='13'/%3E%3Cellipse cx='42' cy='25' rx='9' ry='13'/%3E%3Cellipse cx='60' cy='25' rx='9' ry='13'/%3E%3Cellipse cx='79' cy='39' rx='9' ry='13'/%3E%3C/g%3E%3C/svg%3E"),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='%23d4b591' fill-opacity='.075'%3E%3Cellipse cx='50' cy='63' rx='20' ry='17'/%3E%3Cellipse cx='23' cy='39' rx='9' ry='13'/%3E%3Cellipse cx='42' cy='25' rx='9' ry='13'/%3E%3Cellipse cx='60' cy='25' rx='9' ry='13'/%3E%3Cellipse cx='79' cy='39' rx='9' ry='13'/%3E%3C/g%3E%3C/svg%3E"),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='%23bd7d31' fill-opacity='.055'%3E%3Cellipse cx='50' cy='63' rx='20' ry='17'/%3E%3Cellipse cx='23' cy='39' rx='9' ry='13'/%3E%3Cellipse cx='42' cy='25' rx='9' ry='13'/%3E%3Cellipse cx='60' cy='25' rx='9' ry='13'/%3E%3Cellipse cx='79' cy='39' rx='9' ry='13'/%3E%3C/g%3E%3C/svg%3E");

    background-repeat: no-repeat;
    background-size: 7rem 7rem, 9rem 9rem, 6.5rem 6.5rem, 8rem 8rem, 7rem 7rem;
    background-position:
        96% 28rem,
        3% 55rem,
        91% 90rem,
        15% 128rem,
        82% 166rem;
}

.catalog-page main a {
    color: inherit;
    text-decoration: none;
}

.catalog-page main svg {
    width: 1.2em;
    height: 1.2em;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.catalog-page .eyebrow {
    display: block;
    color: var(--catalog-gold);
    font-size: .82rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.catalog-page .catalog-products__heading>.eyebrow {
    margin-bottom: .3rem;

    color: #a76c2d;

    font-size: .74rem;
    font-weight: 900;
    letter-spacing: .1em;
}

.catalog-page main .button {
    min-height: 3rem;
    padding: .78rem 1.2rem;
    border-radius: 999px;
    font-size: .92rem;
}

.catalog-page main .button-light {
    border-color: rgb(93 65 44 / 28%);
    color: var(--catalog-brown);
    background: #fffdf9;
}

.catalog-page main :is(a, button, input, select, summary):focus-visible {
    outline: 3px solid rgb(189 125 49 / 38%);
    outline-offset: 3px;
}

/* =========================================================
   HERO COMPACTO
   ========================================================= */

.catalog-page .catalog-hero-compact {
    position: relative;
    overflow: hidden;

    width: 100%;

    border-bottom: 1px solid rgb(189 125 49 / 17%);

    background:
        radial-gradient(circle at 88% 18%,
            rgb(189 125 49 / 14%),
            transparent 18rem),
        linear-gradient(118deg,
            #fffaf4 0%,
            #f7ead8 68%,
            #efd3aa 100%);
}

.catalog-page .catalog-hero-compact::after {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='%23bd7d31' fill-opacity='.12'%3E%3Cellipse cx='50' cy='63' rx='20' ry='17'/%3E%3Cellipse cx='23' cy='39' rx='9' ry='13'/%3E%3Cellipse cx='42' cy='25' rx='9' ry='13'/%3E%3Cellipse cx='60' cy='25' rx='9' ry='13'/%3E%3Cellipse cx='79' cy='39' rx='9' ry='13'/%3E%3C/g%3E%3C/svg%3E"),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='%23cba77e' fill-opacity='.10'%3E%3Cellipse cx='50' cy='63' rx='20' ry='17'/%3E%3Cellipse cx='23' cy='39' rx='9' ry='13'/%3E%3Cellipse cx='42' cy='25' rx='9' ry='13'/%3E%3Cellipse cx='60' cy='25' rx='9' ry='13'/%3E%3Cellipse cx='79' cy='39' rx='9' ry='13'/%3E%3C/g%3E%3C/svg%3E");

    background-repeat: no-repeat;
    background-size: 4.6rem 4.6rem, 5.6rem 5.6rem;
    background-position: 82% 18%, 6% 82%;
}

.catalog-page .catalog-hero-compact__inner {
    position: relative;
    z-index: 2;

    display: grid;
    grid-template-columns: minmax(30rem, .9fr) minmax(0, 1.65fr);
    align-items: center;

    width: min(calc(100% - 96px), 1660px);
    gap: clamp(3rem, 5vw, 6.5rem);

    margin-inline: auto;

    padding: 1rem 0 1.15rem;
}

.catalog-page .catalog-hero-compact__copy {
    display: block;
    width: 100%;
    min-width: 0;
}

.catalog-page .catalog-hero-compact__copy h1 {
    width: 100%;
    max-width: 39rem;

    margin: .22rem 0 0;

    color: var(--catalog-brown);

    font-family: var(--serif);
    font-size: clamp(2.15rem, 2.65vw, 3rem);
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.04em;

    text-wrap: balance;
}

.catalog-page .catalog-hero-compact__copy p {
    max-width: 52rem;

    margin: .42rem 0 0;

    color: #6f5a4b;

    font-size: .88rem;
    line-height: 1.48;
}

.catalog-page .catalog-search {
    width: 100%;
    min-width: 0;

    align-self: center;
    margin: 0;
}

.catalog-page .catalog-search>label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

.catalog-page .catalog-search__control {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;

    width: 100%;
    min-height: 3.65rem;

    overflow: hidden;

    border: 1px solid rgb(145 96 44 / 26%);
    border-radius: 1rem;

    background: rgb(255 253 249 / 96%);

    box-shadow:
        0 .85rem 2rem rgb(66 42 28 / 7%),
        inset 0 0 0 1px rgb(255 255 255 / 55%);
}

.catalog-page .catalog-search__control>svg {
    width: 1.18rem;
    height: 1.18rem;
    margin-left: 1rem;
    color: #a86a2d;
}

.catalog-page .catalog-search input {
    width: 100%;
    min-width: 0;
    padding: 1rem;
    border: 0;
    outline: 0;
    color: var(--catalog-brown);
    background: transparent;
    font: inherit;
    font-size: 1rem;
}

.catalog-page .catalog-search input::placeholder {
    color: #907b6b;
}

.catalog-page .catalog-search button {
    min-height: 2.75rem;
    margin-right: .35rem;
    padding: .75rem 1.5rem;
    border: 0;
    border-radius: .78rem;
    color: #fffaf4;
    background: #523524;
    font: inherit;
    font-size: .88rem;
    font-weight: 850;
    cursor: pointer;
    transition: transform .18s ease, background .18s ease;
}

.catalog-page .catalog-search button:hover {
    background: #68452f;
    transform: translateY(-1px);
}

/* =========================================================
   LAYOUT TIENDA
   ========================================================= */

.catalog-page .catalog-shop-shell {
    position: relative;
    isolation: isolate;

    width: min(calc(100% - 24px), 1900px);
    margin-inline: auto;

    padding: .85rem 0 0;
}


.catalog-page .catalog-shop-layout {
    position: relative;
    z-index: 1;

    display: grid;
    grid-template-columns: var(--catalog-sidebar-width) minmax(0, 1fr);
    align-items: start;
    gap: var(--catalog-gap);
}

.catalog-page .catalog-mobile-filter-trigger,
.catalog-page .catalog-sidebar-backdrop,
.catalog-page .catalog-sidebar__close {
    display: none;
}

/* =========================================================
   SIDEBAR
   ========================================================= */

.catalog-page .catalog-sidebar {
    position: sticky;
    top: 5rem;
    align-self: start;

    max-height: calc(100dvh - 6rem);

    overflow-x: hidden;
    overflow-y: auto;

    border: 1px solid var(--catalog-line);
    border-radius: 1.35rem;

    background:
        linear-gradient(180deg,
            rgb(255 253 249 / 98%),
            rgb(249 238 222 / 94%));

    box-shadow: 0 .7rem 1.9rem rgb(64 42 27 / 5%);

    scrollbar-width: thin;
    scrollbar-color: rgb(189 125 49 / 40%) transparent;
}

.catalog-page .catalog-sidebar::-webkit-scrollbar {
    width: 7px;
}

.catalog-page .catalog-sidebar::-webkit-scrollbar-track {
    background: transparent;
}

.catalog-page .catalog-sidebar::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgb(189 125 49 / 38%);
}

.catalog-page .catalog-sidebar__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.25rem 1.25rem 1rem;
    border-bottom: 1px solid var(--catalog-line);
    background: rgb(245 227 202 / 45%);
}

.catalog-page .catalog-sidebar__eyebrow {
    display: block;
    color: var(--catalog-gold);
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .11em;
    text-transform: uppercase;
}

.catalog-page .catalog-sidebar__top h2 {
    margin: .22rem 0 0;

    color: #432e23;
    font-family: var(--serif);
    font-size: 1.9rem;
    line-height: 1;
}

.catalog-page .catalog-sidebar__section {
    padding: 1.15rem 1.2rem;
    border-bottom: 1px solid var(--catalog-line);
}

.catalog-page .catalog-sidebar__section:last-of-type {
    border-bottom: 0;
}

.catalog-page .catalog-sidebar__heading {
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr);
    gap: .65rem;
    align-items: start;
    margin-bottom: .85rem;
}

.catalog-page .catalog-sidebar__heading>span {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border: 1px solid rgb(189 125 49 / 24%);
    border-radius: 50%;
    color: #9b6228;
    background: #fff8ed;
    font-size: .64rem;
    font-weight: 900;
}

.catalog-page .catalog-sidebar__heading h3 {
    margin: .02rem 0 0;

    color: #473126;
    font-size: 1.02rem;
    font-weight: 850;
    line-height: 1.2;
}

.catalog-page .catalog-sidebar__heading p {
    margin: .16rem 0 0;
    color: #806d60;
    font-size: .72rem;
    line-height: 1.38;
}

.catalog-page .catalog-sidebar__categories {
    display: grid;
    gap: .25rem;
}

.catalog-page .catalog-sidebar__category {
    position: relative;
    display: flex;
    min-height: 2.6rem;
    align-items: center;
    padding: .55rem .7rem .55rem .85rem;
    border: 1px solid transparent;
    border-radius: .75rem;
    color: #5e4433;
    background: transparent;
    font-size: .86rem;
    font-weight: 800;
    line-height: 1.2;
    transition: background .18s ease, border-color .18s ease, color .18s ease;
}

.catalog-page .catalog-sidebar__category::before {
    content: "";
    width: .35rem;
    height: .35rem;
    margin-right: .58rem;
    border: 1px solid #b77b38;
    border-radius: 50%;
    background: transparent;
    flex: 0 0 auto;
}

.catalog-page .catalog-sidebar__category:hover {
    border-color: rgb(189 125 49 / 18%);
    background: #fff8ed;
}

.catalog-page .catalog-sidebar__category.is-active,
.catalog-page .catalog-sidebar__category[aria-current="page"] {
    border-color: rgb(118 74 45 / 20%);
    color: #fffaf4;
    background: #71482e;
}

.catalog-page .catalog-sidebar__category.is-active::before,
.catalog-page .catalog-sidebar__category[aria-current="page"]::before {
    border-color: #e4b16a;
    background: #e4b16a;
}

.catalog-page .catalog-sidebar__subcategories {
    position: relative;
    display: grid;
    gap: .15rem;
    margin: .35rem 0 .55rem 1.15rem;
    padding: .55rem 0 .15rem .8rem;
    border-left: 2px solid rgb(189 125 49 / 26%);
}

.catalog-page .catalog-sidebar__subcategories-title {
    display: block;
    margin-bottom: .3rem;
    color: #9c6a35;
    font-size: .62rem;
    font-weight: 900;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.catalog-page .catalog-sidebar__subcategories a {
    display: block;
    padding: .4rem .52rem;
    border-radius: .55rem;
    color: #755a47;
    font-size: .78rem;
    font-weight: 720;
    line-height: 1.28;
}

.catalog-page .catalog-sidebar__subcategories a:hover {
    color: #744821;
    background: rgb(255 248 237 / 72%);
}

.catalog-page .catalog-sidebar__subcategories a.is-active,
.catalog-page .catalog-sidebar__subcategories a[aria-current="page"] {
    color: #6a421f;
    background: #f2dfc3;
    font-weight: 850;
}

.catalog-page .catalog-sidebar__pets {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .35rem;
}

.catalog-page .catalog-sidebar__pets a {
    display: inline-flex;
    min-height: 2.35rem;
    align-items: center;
    justify-content: center;
    padding: .45rem .45rem;
    border: 1px solid rgb(96 63 43 / 15%);
    border-radius: 999px;
    color: #654a38;
    background: #fffaf4;
    font-size: .7rem;
    font-weight: 800;
}

.catalog-page .catalog-sidebar__pets a:hover {
    border-color: #bd7d31;
    background: #fff5e6;
}

.catalog-page .catalog-sidebar__pets a.is-active,
.catalog-page .catalog-sidebar__pets a[aria-current="page"] {
    color: #fffaf4;
    background: #744a2e;
    border-color: #744a2e;
}

.catalog-page .catalog-sidebar__form {
    display: grid;
    gap: .7rem;
}

.catalog-page .catalog-sidebar__field {
    display: grid;
    gap: .35rem;
}

.catalog-page .catalog-sidebar__field>span {
    color: #5a4334;
    font-size: .75rem;
    font-weight: 850;
}

.catalog-page .catalog-sidebar__field select {
    width: 100%;
    min-height: 2.7rem;
    padding: .6rem .72rem;
    border: 1px solid rgb(96 63 43 / 21%);
    border-radius: .72rem;
    color: var(--catalog-brown);
    background: #fffdf9;
    font: inherit;
    font-size: .78rem;
}

.catalog-page .catalog-sidebar__check {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: .55rem;
    padding: .65rem;
    border: 1px solid rgb(96 63 43 / 11%);
    border-radius: .72rem;
    background: rgb(255 250 244 / 68%);
    cursor: pointer;
}

.catalog-page .catalog-sidebar__check input {
    width: 1rem;
    height: 1rem;
    margin-top: .1rem;
    accent-color: #a86a2d;
}

.catalog-page .catalog-sidebar__check>span {
    display: grid;
    gap: .08rem;
}

.catalog-page .catalog-sidebar__check strong {
    color: #4c3528;
    font-size: .76rem;
}

.catalog-page .catalog-sidebar__check small {
    color: #806d60;
    font-size: .66rem;
    line-height: 1.32;
}

.catalog-page .catalog-sidebar__submit {
    width: 100%;
    min-height: 2.7rem !important;
    margin-top: .1rem;
    padding: .62rem .8rem !important;
    border: 0;
    color: #fffaf4;
    background: #68452f;
    font-size: .76rem !important;
    font-weight: 850;
}

.catalog-page .catalog-sidebar__clear,
.catalog-page .catalog-sidebar__reset {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.25rem;
    color: #8c5f38;
    font-size: .68rem;
    font-weight: 800;
    text-align: center;
}

.catalog-page .catalog-sidebar__reset {
    width: calc(100% - 2.4rem);
    margin: 0 1.2rem 1.2rem;
    border-top: 1px solid var(--catalog-line);
    padding-top: .85rem;
}

/* =========================================================
   PRODUCTOS / CABECERA
   ========================================================= */

.catalog-page .catalog-products {
    position: relative;
    min-width: 0;
}

.catalog-page .catalog-products__header {
    display: grid;
    gap: .8rem;
    margin-bottom: 1rem;
    padding: .2rem 0 1rem;
    border-bottom: 1px solid var(--catalog-line);
}

.catalog-page .catalog-products__heading h2 {
    margin: 0;

    color: #38271f;

    font-family: var(--sans);
    font-size: clamp(1.65rem, 2vw, 2.15rem);
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: -.035em;
}

.catalog-page .catalog-products__heading p {
    max-width: 48rem;

    margin: .55rem 0 0;

    color: #725d4e;

    font-size: .96rem;
    font-weight: 500;
    line-height: 1.5;
}

.catalog-page .catalog-applied {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .38rem;
}

.catalog-page .catalog-applied__label {
    margin-right: .1rem;
    color: #887463;
    font-size: .64rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.catalog-page .catalog-applied__chip {
    display: inline-flex;
    align-items: center;
    gap: .18rem;

    padding: .38rem .62rem;

    border: 1px solid rgb(189 125 49 / 26%);
    border-radius: 999px;

    color: #62442f;

    background:
        linear-gradient(180deg,
            #fffaf4,
            #f7e8d2);

    font-size: .69rem;

    box-shadow:
        0 .18rem .5rem rgb(72 45 27 / 4%);
}

.catalog-page .catalog-applied__chip b {
    color: #a46b30;
    font-weight: 850;
}

.catalog-page .catalog-applied>a {
    margin-left: .2rem;

    color: #8a5930;

    font-size: .68rem;
    font-weight: 800;

    text-decoration: underline;
    text-underline-offset: .18rem;
    text-decoration-color: rgb(138 89 48 / 30%);
}

/* =========================================================
   GRILLA Y CARDS
   ========================================================= */

.catalog-page .catalog-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(1rem, 1.5vw, 1.35rem);
}

.catalog-page .catalog-card {
    --catalog-accent: var(--catalog-gold);
    display: flex;
    min-width: 0;
    height: 100%;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgb(189 125 49 / 21%);
    border-radius: 1.25rem;
    background: #fffdf9;
    box-shadow: 0 .55rem 1.5rem rgb(62 42 29 / 5%);
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.catalog-page .catalog-card--perro {
    --catalog-accent: #9b682f;
}

.catalog-page .catalog-card--gato {
    --catalog-accent: var(--blue-soft);
}

.catalog-page .catalog-card--ambos {
    --catalog-accent: #83603f;
}

.catalog-page .catalog-card:hover {
    border-color: var(--catalog-accent);
    box-shadow: var(--catalog-shadow-hover);
    transform: translateY(-4px);
}

/* Área visual de la imagen:
   - Alimentos: 1:1.
   - Resto: la foto conserva su proporción real.
   - Si una foto es más corta que 3:4, el contenedor completa el espacio
     con el fondo de la card, sin recortar ni deformar la imagen. */
.catalog-page .card-image {
    position: relative;

    display: grid;
    width: 100%;

    overflow: hidden;

    border-bottom: 1px solid rgb(189 125 49 / 15%);
    background:
        radial-gradient(circle at 50% 45%, rgb(255 255 255 / 34%), transparent 70%),
        linear-gradient(145deg, #f8ead7, #edd2af);
}


/* Alimentos: formato cuadrado. */
.catalog-page .catalog-card--alimentos .card-image {
    aspect-ratio: 1 / 1;
    place-items: center;
}


/* No alimentos:
   este pseudo-elemento define solamente una ALTURA MÍNIMA visual de 3:4.
   Si la fotografía es más alta, el contenedor crece con ella. */
.catalog-page .catalog-card:not(.catalog-card--alimentos) .card-image::before {
    content: "";

    grid-area: 1 / 1;

    width: 100%;
    aspect-ratio: 3 / 4;

    pointer-events: none;
}


/* Base común de fotografías principales. */
.catalog-page .card-image > img {
    display: block;

    width: 100%;

    padding: 0;
    border: 0;
    border-radius: 0;

    background: transparent;
    box-shadow: none;

    transition: transform .35s ease;
}


/* Alimentos: se contienen en el lienzo 1:1. */
.catalog-page .catalog-card--alimentos .card-image > img {
    width: 100%;
    height: 100%;

    object-fit: contain;
    object-position: center;
}


/* No alimentos:
   la foto mantiene su proporción real.
   Las fotos altas ocupan todo su alto natural.
   Las fotos más cortas se centran dentro del mínimo 3:4 y muestran borde/fondo. */
.catalog-page .catalog-card:not(.catalog-card--alimentos) .card-image > img {
    grid-area: 1 / 1;

    width: 100%;
    height: auto;

    align-self: center;
    justify-self: stretch;

    object-fit: contain;
    object-position: center;

    z-index: 1;
}


/* Placeholder sin imagen: ocupa correctamente el área visual disponible. */
.catalog-page .catalog-card:not(.catalog-card--alimentos) .card-image > .image-placeholder {
    grid-area: 1 / 1;
    min-height: 100%;
    z-index: 1;
}


.catalog-page .catalog-card:hover .card-image > img {
    transform: scale(1.015);
}

.catalog-page .image-placeholder {
    display: grid;

    width: 100%;
    height: 100%;

    place-items: center;
    align-content: center;

    gap: .55rem;

    padding: 1.5rem;

    color: #75533a;

    background:
        radial-gradient(circle at center,
            rgb(255 255 255 / 60%),
            transparent 8rem),
        linear-gradient(145deg,
            #f8ead8,
            #efd6b6);

    font-family: var(--sans);
    font-size: .62rem;
    font-weight: 750;

    text-align: center;
}

.catalog-page .image-placeholder::before {
    content: "CORATTO";

    display: grid;

    width: 4.5rem;
    height: 4.5rem;

    place-items: center;
    justify-self: center;

    border: 1px solid rgb(189 125 49 / 24%);
    border-radius: 50%;

    color: #a66a2c;

    background:
        radial-gradient(circle at 38% 32%,
            #fffdf8,
            #f2dfc4);

    font-family: var(--serif);
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.catalog-page .image-placeholder small {
    display: block;

    color: #8b7360;

    font-size: .7rem;
    font-weight: 600;
    line-height: 1.3;
}

.catalog-page .fraction-badge {
    position: absolute !important;

    top: .75rem !important;
    left: .75rem !important;
    right: auto !important;
    bottom: auto !important;

    z-index: 3;

    display: inline-flex !important;

    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;

    align-items: center;
    justify-content: center;

    padding: .36rem .58rem !important;

    border: 1px solid rgb(255 255 255 / 48%);
    border-radius: 999px !important;

    color: #fffaf4;

    background: rgb(82 53 36 / 90%);

    font-size: .65rem;
    font-weight: 850;
    line-height: 1;

    box-shadow: 0 .28rem .7rem rgb(49 31 21 / 16%);

    transform: none !important;
}

.catalog-page .card-body {
    display: flex;
    flex: 1;
    align-items: flex-start;
    flex-direction: column;
    padding: 1rem 1.05rem 1.05rem;
}

.catalog-page .card-meta {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: .6rem;
    color: #785a43;
    font-size: .72rem;
    font-weight: 820;
}

.catalog-page .card-meta span:last-child {
    color: var(--catalog-accent);
}

.catalog-page .card-body h2 {
    width: 100%;
    margin: .55rem 0 .5rem;
    color: #39271f;
    font-size: clamp(1.02rem, 1.15vw, 1.2rem);
    font-weight: 850;
    line-height: 1.18;
    letter-spacing: -.02em;
}

.catalog-page .card-body h2 a:hover {
    color: #8d5b2b;
}

.catalog-page .category-label {
    display: inline-flex;
    padding: .3rem .5rem;
    border: 1px solid rgb(189 125 49 / 22%);
    border-radius: 999px;
    color: #76543a;
    background: #fff7ea;
    font-size: .67rem;
    line-height: 1.1;
}

.catalog-page .card-body>p {
    display: -webkit-box;
    margin: .68rem 0 0;
    overflow: hidden;
    color: #67564b;
    font-size: .76rem;
    line-height: 1.48;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.catalog-page .formats {
    display: grid;
    gap: .1rem;
    margin-top: .65rem;
    color: #59483e;
    font-size: .7rem;
    line-height: 1.34;
}

.catalog-page .formats b {
    color: #8d5b2b;
    font-size: .68rem;
    font-weight: 850;
}

.catalog-page .card-link {
    display: flex;
    width: 100%;
    min-height: 2.8rem;

    align-items: center;
    justify-content: space-between;
    gap: .65rem;

    margin-top: auto;
    padding: .68rem .85rem;

    border: 1px solid rgb(96 63 43 / 12%);
    border-radius: .72rem;

    color: #fffaf4;
    background:
        linear-gradient(135deg,
            #68452f,
            #4e3527);

    font-size: .76rem;
    font-weight: 850;

    box-shadow:
        0 .3rem .8rem rgb(62 42 29 / 10%);

    transition:
        transform .18s ease,
        background .18s ease,
        box-shadow .18s ease;
}

.catalog-page .card-link svg {
    color: #e9bd7b;
    transition: transform .2s ease;
}

.catalog-page .card-link:hover {
    color: #fff;
    background:
        linear-gradient(135deg,
            #795039,
            #5a3b2a);

    box-shadow:
        0 .45rem 1rem rgb(62 42 29 / 16%);

    transform: translateY(-1px);
}

.catalog-page .card-link:hover svg {
    transform: translateX(3px);
}

/* =========================================================
   PAGINACIÓN / ESTADOS / ORIENTACIÓN
   ========================================================= */

.catalog-page .quick-filters {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: .4rem;
    margin-top: 1.8rem;
}

.catalog-page .quick-filters a {
    display: inline-flex;
    min-width: 2.5rem;
    min-height: 2.5rem;
    align-items: center;
    justify-content: center;
    padding: .48rem .68rem;
    border: 1px solid var(--catalog-line-strong);
    border-radius: 999px;
    color: #624736;
    background: #fffaf4;
    font-size: .74rem;
    font-weight: 820;
}

.catalog-page .quick-filters a.is-active,
.catalog-page .quick-filters a[aria-current="page"] {
    color: #fffaf4;
    background: #744a2e;
    border-color: #744a2e;
}

.catalog-page .empty-results,
.catalog-page .state-panel {
    width: min(calc(100% - 2rem), 760px);
    margin: clamp(3rem, 7vw, 5.5rem) auto;
    padding: clamp(1.8rem, 4vw, 3.5rem);
    border: 1px solid rgb(189 125 49 / 24%);
    border-radius: 1.4rem;
    color: var(--catalog-brown);
    background: #f5e6d2;
    box-shadow: var(--catalog-shadow);
    text-align: center;
}

.catalog-page .empty-results h2,
.catalog-page .state-panel h1 {
    margin: .4rem 0 .8rem;
    font-family: var(--serif);
    font-size: clamp(2.2rem, 4vw, 3.7rem);
    line-height: 1.05;
}

.catalog-page .empty-results p,
.catalog-page .state-panel p {
    margin: 0 auto 1.4rem;
    color: #6b594d;
    font-size: .98rem;
    line-height: 1.6;
}

.catalog-page .empty-results>a {
    display: inline-flex;
    min-height: 3rem;
    align-items: center;
    justify-content: center;
    padding: .75rem 1.2rem;
    border-radius: 999px;
    color: #fffaf4;
    background: #68472f;
    font-size: .88rem;
    font-weight: 800;
}

.catalog-page .state-panel>span {
    color: #8d5c2c;
    font-size: .76rem;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.catalog-page .actions {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: .75rem;
}

.catalog-page .catalog-guidance {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1.5rem;
    overflow: hidden;
    margin-top: clamp(3rem, 5vw, 4.8rem);
    padding: clamp(1.9rem, 3.5vw, 3rem);
    border-radius: 1.4rem 1.4rem 0 0;
    color: var(--catalog-brown);
    background:
        radial-gradient(circle at 76% 30%, rgb(255 255 255 / 28%), transparent 15rem),
        #d9b68d;
}

.catalog-page .catalog-guidance>svg {
    position: absolute;
    right: 16%;
    width: 9rem;
    height: 9rem;
    color: #9c682d;
    opacity: .08;
    transform: rotate(14deg);
}

.catalog-page .catalog-guidance__content,
.catalog-page .catalog-guidance__action {
    position: relative;
}

.catalog-page .catalog-guidance__content>span {
    color: #79502a;
    font-size: .76rem;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.catalog-page .catalog-guidance h2 {
    margin: .3rem 0;
    font-family: var(--serif);
    font-size: clamp(2.1rem, 3.2vw, 3.25rem);
    line-height: 1;
}

.catalog-page .catalog-guidance p {
    max-width: 45rem;
    margin: 0;
    color: #5b4334;
    font-size: .94rem;
    line-height: 1.55;
}

.catalog-page .catalog-guidance__action {
    display: inline-flex;
    min-height: 3rem;
    align-items: center;
    justify-content: center;
    padding: .8rem 1.3rem;
    border-radius: 999px;
    color: #fffaf4;
    background: #4e3527;
    font-size: .84rem;
    font-weight: 820;
    box-shadow: 0 .7rem 1.5rem rgb(64 39 24 / 14%);
}

/* =========================================================
   FICHA DE PRODUCTO — SE CONSERVA ARQUITECTURA EXISTENTE
   ========================================================= */

.catalog-page .detail-shell {
    width: min(calc(100% - 48px), 1540px);
    margin-inline: auto;
    padding: 2rem 0 clamp(4rem, 7vw, 6rem);
}

.catalog-page .detail-topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.3rem;
}

.catalog-page .back-link {
    color: #665348;
    font-size: .9rem;
    font-weight: 750;
}

.catalog-page .back-link:hover {
    color: #9c682d;
}

.catalog-page .qr-badge,
.catalog-page .scan-banner {
    display: flex;
    align-items: center;
    gap: .5rem;
    border: 1px solid rgb(189 130 56 / 28%);
    color: #704b25;
    background: #fff5df;
    font-size: .82rem;
    font-weight: 750;
}

.catalog-page .qr-badge {
    display: none;
}

.catalog-page .scan-banner {
    margin-bottom: 1.3rem;
    padding: .8rem 1rem;
    border-radius: .8rem;
}

.catalog-page .product-hero {
    display: grid;
    grid-template-columns: minmax(20rem, .9fr) minmax(24rem, 1.1fr);
    align-items: stretch;
    gap: clamp(1.8rem, 4vw, 4rem);
    padding: clamp(1.35rem, 2.2vw, 2.2rem);
    border: 1px solid rgb(189 130 56 / 24%);
    border-radius: 1.7rem;
    background: linear-gradient(130deg, #f4e4cf 0 42%, #fffdf8 42%);
    box-shadow: var(--catalog-shadow-soft);
}

.catalog-page .detail-image {
    position: relative;
    aspect-ratio: 1;
    overflow: hidden;
    border: 1px solid rgb(189 130 56 / 22%);
    border-radius: 1.3rem;
    background: linear-gradient(145deg, #fffaf2, #e8d1b4);
}

.catalog-page .detail-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    padding: clamp(14px, 2vw, 26px);
}

.catalog-page .product-gallery__viewport,
.catalog-page .product-gallery__slide {
    width: 100%;
    height: 100%;
}

.catalog-page .product-gallery__slide {
    position: absolute;
    inset: 0;
    margin: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity .42s ease, visibility .42s ease;
}

.catalog-page .product-gallery__slide.is-active {
    position: relative;
    opacity: 1;
    visibility: visible;
}

.catalog-page .product-gallery__arrow {
    position: absolute;
    z-index: 3;
    top: 50%;
    display: grid;
    width: 2.85rem;
    height: 2.85rem;
    place-items: center;
    padding: 0;
    transform: translateY(-50%);
    border: 1px solid rgb(84 58 42 / 16%);
    border-radius: 50%;
    color: var(--catalog-brown);
    background: rgb(255 253 248 / 92%);
    box-shadow: 0 .55rem 1.4rem rgb(84 58 42 / 16%);
    cursor: pointer;
    transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
}

.catalog-page .product-gallery__arrow:hover,
.catalog-page .product-gallery__arrow:focus-visible {
    background: #fff;
    box-shadow: 0 .7rem 1.6rem rgb(84 58 42 / 22%);
}

.catalog-page .product-gallery__arrow:hover {
    transform: translateY(-50%) scale(1.06);
}

.catalog-page .product-gallery__arrow:focus-visible {
    outline: 3px solid rgb(189 130 56 / 28%);
    outline-offset: 2px;
}

.catalog-page .product-gallery__arrow span {
    display: block;
    margin-top: -.13rem;
    font-family: Georgia, serif;
    font-size: 2rem;
    font-weight: 400;
    line-height: 1;
}

.catalog-page .product-gallery__arrow--prev {
    left: .9rem;
}

.catalog-page .product-gallery__arrow--next {
    right: .9rem;
}

.catalog-page .product-gallery__footer {
    position: absolute;
    z-index: 3;
    right: .85rem;
    bottom: .8rem;
    left: .85rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .7rem;
    pointer-events: none;
}

.catalog-page .product-gallery__dots {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .38rem;
    padding: .42rem .55rem;
    border: 1px solid rgb(84 58 42 / 10%);
    border-radius: 999px;
    background: rgb(255 253 248 / 88%);
    box-shadow: 0 .35rem 1rem rgb(84 58 42 / 10%);
    backdrop-filter: blur(6px);
    pointer-events: auto;
}

.catalog-page .product-gallery__dot {
    width: .48rem;
    height: .48rem;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgb(84 58 42 / 28%);
    cursor: pointer;
    transition: width .2s ease, background-color .2s ease;
}

.catalog-page .product-gallery__dot.is-active {
    width: 1.25rem;
    border-radius: 999px;
    background: #bd8238;
}

.catalog-page .product-gallery__dot:focus-visible {
    outline: 2px solid #bd8238;
    outline-offset: 2px;
}

.catalog-page .product-gallery__counter {
    min-width: 2.8rem;
    padding: .4rem .55rem;
    border: 1px solid rgb(84 58 42 / 10%);
    border-radius: 999px;
    color: #704b25;
    background: rgb(255 253 248 / 88%);
    box-shadow: 0 .35rem 1rem rgb(84 58 42 / 10%);
    font-size: .76rem;
    font-weight: 800;
    line-height: 1;
    text-align: center;
    backdrop-filter: blur(6px);
}

@media (prefers-reduced-motion: reduce) {

    .catalog-page .product-gallery__slide,
    .catalog-page .product-gallery__arrow,
    .catalog-page .product-gallery__dot {
        transition: none;
    }
}

.catalog-page .detail-intro {
    display: flex;
    min-width: 0;
    justify-content: center;
    flex-direction: column;
}

.catalog-page .detail-intro h1 {
    max-width: 50rem;
    margin: .35rem 0;
    color: var(--catalog-brown);
    font-family: var(--serif);
    font-size: clamp(2.35rem, 4vw, 3.9rem);
    line-height: 1.02;
    letter-spacing: -.035em;
}

.catalog-page .chips {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    margin: 1rem 0;
}

.catalog-page .chips span {
    display: inline-flex;
    min-height: 2.45rem;
    align-items: center;
    gap: .4rem;
    padding: .5rem .72rem;
    border: 1px solid rgb(189 130 56 / 24%);
    border-radius: 999px;
    color: #5b422f;
    background: #fff7e8;
    font-size: .82rem;
}

.catalog-page .chips .available,
.catalog-page .format-status {
    color: #426b4e;
}

.catalog-page .chips .available {
    border-color: rgb(66 107 78 / 30%);
    background: #edf5ef;
}

.catalog-page .lead {
    max-width: 44rem;
    margin-block: .8rem 0;
    color: #625248;
    font-size: .98rem;
    line-height: 1.6;
}

.catalog-page .identity {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .75rem;
    margin: 1.15rem 0;
}

.catalog-page .identity div {
    padding-top: .55rem;
    border-top: 1px solid rgb(189 130 56 / 22%);
}

.catalog-page .identity dt {
    color: #766359;
    font-size: .8rem;
    font-weight: 700;
}

.catalog-page .identity dd {
    margin: .2rem 0 0;
    color: var(--catalog-brown);
    font-size: .9rem;
    font-weight: 750;
}

.catalog-page .detail-actions {
    display: flex;
    align-items: center;
    gap: .8rem;
}

.catalog-page .detail-actions small {
    max-width: 21rem;
    color: #6b594e;
    font-size: .82rem;
    line-height: 1.45;
}

.catalog-page .why-block {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 1.2rem;
    max-width: 66rem;
    margin: clamp(2.2rem, 4.5vw, 4rem) auto;
    padding: 1.6rem 1.75rem;
    border: 1px solid rgb(190 124 42 / 18%);
    border-left: 4px solid var(--catalog-gold);
    border-radius: 0 1.2rem 1.2rem 0;
    background: linear-gradient(135deg, #f4e4cf, #f8eddf);
    box-shadow: 0 12px 30px rgb(80 52 34 / 7%);
    transition: border-color .22s ease, box-shadow .22s ease, transform .22s ease, background .22s ease;
}

.catalog-page .why-block.is-active {
    border-color: rgb(190 124 42 / 34%);
    background: linear-gradient(135deg, #f1dfc6, #fbf2e6);
    box-shadow: 0 16px 36px rgb(80 52 34 / 11%);
}

.catalog-page .why-block.is-changing .why-content {
    animation: presentationQuickReveal .34s ease both;
}

@keyframes presentationQuickReveal {
    from {
        opacity: .45;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.catalog-page .why-icon {
    display: grid;
    width: 3.1rem;
    height: 3.1rem;
    place-items: center;
    border-radius: 50%;
    color: #fffaf3;
    background: #68472f;
    box-shadow: 0 7px 18px rgb(80 52 34 / 16%);
}

.catalog-page .why-content {
    min-width: 0;
}

.catalog-page .quick-format-badge {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    margin-left: .75rem;
    padding: .38rem .72rem;
    border: 1px solid rgb(174 111 31 / 28%);
    border-radius: 999px;
    color: #704721;
    background: rgb(255 250 243 / 78%);
    font-family: var(--sans);
    font-size: .82rem;
    font-weight: 750;
    line-height: 1;
    letter-spacing: .015em;
    text-transform: none;
}

.catalog-page .quick-format-badge[hidden],
.catalog-page .quick-format-ideal[hidden] {
    display: none;
}

.catalog-page .why-block h2,
.catalog-page .presentations h2,
.catalog-page .section-heading h2 {
    margin: .28rem 0;
    font-family: var(--serif);
    font-size: clamp(1.9rem, 3vw, 3rem);
    line-height: 1.05;
}

.catalog-page .why-block p {
    max-width: 58rem;
    margin: .55rem 0 0;
    color: #625248;
    font-size: .94rem;
    line-height: 1.6;
}

.catalog-page .quick-format-ideal {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .4rem .65rem;
    margin-top: .9rem;
    padding-top: .8rem;
    border-top: 1px solid rgb(104 71 47 / 12%);
}

.catalog-page .quick-format-ideal span {
    color: #b87525;
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.catalog-page .quick-format-ideal strong {
    color: #553b2b;
    font-size: .82rem;
    font-weight: 760;
}

.catalog-page .presentations {
    display: grid;
    grid-template-columns: minmax(15rem, .62fr) minmax(21rem, 1.38fr);
    gap: clamp(1.8rem, 3.5vw, 3rem);
    padding: clamp(1.8rem, 3.5vw, 3rem);
    border-radius: 1.5rem;
    color: #fffaf3;
    background: #4e3527;
}

.catalog-page .presentations--standard {
    position: relative;
    overflow: hidden;

    grid-template-columns: auto auto;
    align-items: center;
    justify-content: center;
    gap: clamp(1.2rem, 2vw, 2.1rem);

    margin-top: 1rem;
    padding: 1.2rem 1.55rem;
    border-radius: 1.45rem;

    background:
        radial-gradient(circle at 88% 78%, rgb(240 196 119 / 10%), transparent 18rem),
        linear-gradient(90deg, #593927 0%, #6a4330 52%, #5a3928 100%);
}

.catalog-page .presentations--standard::after {
    content: "";

    position: absolute;
    right: 1.1rem;
    bottom: .7rem;

    width: 5.2rem;
    height: 5.2rem;

    pointer-events: none;
    opacity: .14;

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='%23f0c477'%3E%3Cellipse cx='50' cy='63' rx='20' ry='17'/%3E%3Cellipse cx='23' cy='39' rx='9' ry='13'/%3E%3Cellipse cx='42' cy='25' rx='9' ry='13'/%3E%3Cellipse cx='60' cy='25' rx='9' ry='13'/%3E%3Cellipse cx='79' cy='39' rx='9' ry='13'/%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.catalog-page .single-product-purchase__info {
    display: grid;
    align-content: end;
    gap: .28rem;

    min-width: 9rem;
}

.catalog-page .single-product-purchase__label {
    color: #e9bd7b;

    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.catalog-page .single-product-purchase__summary {
    position: relative;
    z-index: 1;

    display: grid;
    gap: .28rem;
    min-width: 9.5rem;

    padding: .75rem .95rem .82rem 2.7rem;
    border: 1px solid rgb(240 196 119 / 24%);
    border-radius: 1rem;

    background: rgb(255 250 243 / 7%);
    box-shadow: inset 0 0 0 1px rgb(255 255 255 / 04%);
}

.catalog-page .single-product-purchase__summary::before {
    content: "";

    position: absolute;
    top: 50%;
    left: .95rem;
    transform: translateY(-50%);

    width: 1.15rem;
    height: 1.15rem;

    opacity: .95;

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f0c477' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 1v22'/%3E%3Cpath d='M17 5H9.5a3.5 3.5 0 0 0 0 7H14a3.5 3.5 0 0 1 0 7H6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.catalog-page .single-product-purchase__price {
    color: #fffaf3;

    font-family: var(--sans);
    font-size: clamp(1.28rem, 1.45vw, 1.55rem);
    font-weight: 650;
    line-height: 1.05;
    letter-spacing: -.015em;
}

.catalog-page .presentations--standard .product-purchase-form {
    display: flex;
    align-items: end;
    justify-content: flex-end;
    min-width: 0;
}

.catalog-page .presentations--standard .purchase-controls {
    justify-content: flex-end;
    margin-top: 0;
}

.catalog-page .presentations>div>p,
.catalog-page .empty-note {
    color: #eadbc9;
    font-size: .9rem;
    line-height: 1.55;
}

.catalog-page .presentation-fieldset {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.catalog-page .presentation-fieldset legend {
    margin-bottom: .75rem;
    color: #f0c477;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.catalog-page .presentation-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
}

.catalog-page .presentation-list>div {
    position: relative;
    min-width: 0;
}

.catalog-page .presentation-list input[type="radio"] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}

.catalog-page .presentation-list label {
    position: relative;
    display: grid;
    grid-template-columns: 3.3rem minmax(0, 1fr);
    gap: .85rem;
    min-height: 8.2rem;
    padding: .9rem 1rem;
    border: 1px solid rgb(255 255 255 / 18%);
    border-radius: 1rem;
    color: #f5eadc;
    background: rgb(255 255 255 / 5%);
    cursor: pointer;
    overflow: hidden;
    transition: border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease;
}

.catalog-page .presentation-list label:hover {
    border-color: rgb(243 191 102 / 46%);
    background: rgb(255 255 255 / 8%);
    transform: translateY(-1px);
}

.catalog-page .presentation-list input[type="radio"]:focus-visible+label {
    outline: 3px solid rgb(243 191 102 / 28%);
    outline-offset: 3px;
}

.catalog-page .presentation-format-icon {
    display: grid;
    width: 3.3rem;
    height: 3.3rem;
    place-items: center;
    align-self: start;
    border: 1px solid rgb(255 255 255 / 14%);
    border-radius: .9rem;
    color: #f0c477;
    background: rgb(255 250 243 / 8%);
    transition: color .18s ease, background .18s ease, border-color .18s ease, transform .18s ease;
}

.catalog-page .presentation-format-icon svg {
    width: 1.85rem;
    height: 1.85rem;
}

.catalog-page .presentation-list input[type="radio"]:checked+label {
    border-color: #e2aa4c;
    background: linear-gradient(135deg, rgb(226 170 76 / 20%), rgb(255 255 255 / 7%));
    box-shadow: 0 0 0 3px rgb(226 170 76 / 9%), 0 12px 24px rgb(30 17 10 / 12%);
}

.catalog-page .presentation-list input[type="radio"]:checked+label .presentation-format-icon {
    color: #563827;
    border-color: #f0bd61;
    background: #f0bd61;
    transform: scale(1.04);
}

.catalog-page .presentation-list .is-unavailable label {
    cursor: not-allowed;
    opacity: .46;
}

.catalog-page .presentation-list .is-unavailable label:hover {
    transform: none;
}

.catalog-page .presentation-content {
    display: grid;
    align-content: start;
    gap: .55rem;
    min-width: 0;
}

.catalog-page .presentation-content__heading,
.catalog-page .presentation-content__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: .35rem .7rem;
}

.catalog-page .presentation-content__title {
    display: grid;
    gap: .2rem;
    min-width: 0;
}

.catalog-page .presentation-content strong {
    color: #fff;
    font-size: .86rem;
}

.catalog-page .presentation-content__title>small {
    color: #e9bd7b;
    font-size: .66rem;
    font-weight: 720;
    letter-spacing: .025em;
}

.catalog-page .presentation-weight {
    flex: 0 0 auto;
    padding: .2rem .42rem;
    border-radius: 999px;
    color: #f0c477;
    background: rgb(240 196 119 / 9%);
    font-size: .66rem;
    font-weight: 780;
}

.catalog-page .presentation-content__meta {
    align-items: center;
}

.catalog-page .presentation-content__meta>strong {
    font-size: .9rem;
}

.catalog-page .presentation-sku {
    color: #d9ad72;
    font-size: .65rem;
}

.catalog-page .presentation-selected {
    position: absolute;
    right: .8rem;
    bottom: .75rem;
    display: inline-flex;
    align-items: center;
    gap: .28rem;
    color: #f2c36d;
    font-size: .61rem;
    font-weight: 850;
    letter-spacing: .045em;
    text-transform: uppercase;
    opacity: 0;
    transform: translateY(4px);
    transition: opacity .18s ease, transform .18s ease;
}

.catalog-page .presentation-selected svg {
    width: .8rem;
    height: .8rem;
}

.catalog-page .presentation-list input[type="radio"]:checked+label .presentation-selected {
    opacity: 1;
    transform: translateY(0);
}

.catalog-page .format-status {
    display: inline-flex;
    padding: .18rem .4rem;
    border-radius: 999px;
    color: #dcebdc !important;
    background: rgb(101 143 105 / 24%);
    font-size: .63rem !important;
    font-weight: 800;
}

.catalog-page .scanned-label {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    width: fit-content;
    margin-bottom: .35rem;
    color: #f0bd61;
    font-size: .62rem;
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.catalog-page .purchase-controls {
    position: relative;
    z-index: 1;

    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: .7rem;
    margin-top: 0;
}

.catalog-page .purchase-quantity {
    display: grid;
    gap: .3rem;
}

.catalog-page .purchase-quantity>label {
    color: #f0c477;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.catalog-page .purchase-quantity__control {
    display: grid;
    grid-template-columns: 2.45rem 3.5rem 2.45rem;
    overflow: hidden;
    border: 1px solid rgb(255 255 255 / 24%);
    border-radius: 999px;
    background: #fffaf2;
}

.catalog-page .purchase-quantity__control button,
.catalog-page .purchase-quantity__control input {
    height: 2.7rem;
    border: 0;
}

.catalog-page .purchase-quantity__control button {
    color: #6d4328;
    background: #f4e3cc;
    font-size: 1.05rem;
    cursor: pointer;
}

.catalog-page .purchase-quantity__control input {
    width: 100%;
    padding: 0;
    color: #3f2b20;
    background: #fffaf2;
    font: inherit;
    font-weight: 700;
    text-align: center;
    appearance: textfield;
    -moz-appearance: textfield;
}

.catalog-page .purchase-quantity__control input::-webkit-inner-spin-button,
.catalog-page .purchase-quantity__control input::-webkit-outer-spin-button {
    margin: 0;
    appearance: none;
    -webkit-appearance: none;
}

.catalog-page .purchase-submit {
    display: inline-flex;
    min-height: 2.7rem;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    padding-inline: 1.1rem;
}

.catalog-page .product-details {
    max-width: 68rem;
    margin: clamp(2.8rem, 5vw, 4.5rem) auto;
}

.catalog-page .section-heading {
    margin-bottom: 1.5rem;
}

.catalog-page .product-details details {
    border-top: 1px solid rgb(189 130 56 / 24%);
}

.catalog-page .product-details details:last-child {
    border-bottom: 1px solid rgb(189 130 56 / 24%);
}

.catalog-page .product-details summary {
    display: flex;
    min-height: 4.25rem;
    align-items: center;
    justify-content: space-between;
    padding: 1rem .25rem;
    color: #3d2b22;
    font-size: 1.15rem;
    font-weight: 750;
    list-style: none;
    cursor: pointer;
}

.catalog-page .product-details summary span {
    display: flex;
    align-items: center;
    gap: 1.15rem;
}

.catalog-page .product-details summary b {
    color: var(--catalog-gold);
    font-size: .95rem;
}

.catalog-page .product-details summary i {
    color: var(--catalog-gold);
    font-size: 1.6rem;
    font-style: normal;
    transition: transform .2s ease;
}

.catalog-page .product-details details[open] summary i {
    transform: rotate(45deg);
}

.catalog-page .product-details details>div {
    padding: 0 3rem 1.4rem;
    color: #625248;
    font-size: .92rem;
    line-height: 1.65;
}

.catalog-page .responsible-note {
    max-width: 68rem;
    margin: 2rem auto 0;
    padding: 1.1rem 1.25rem;
    border: 1px solid rgb(189 130 56 / 24%);
    border-radius: .9rem;
    color: #4e392c;
    background: #fff7e8;
}

.catalog-page .responsible-note p {
    margin: .25rem 0 0;
    color: #67554a;
    font-size: .9rem;
    line-height: 1.55;
}

/* =========================================================
   CALCULADORA EN FICHA
   ========================================================= */

.catalog-page .nutrition-product-panel [hidden] {
    display: none !important;
}

.catalog-page .nutrition-product-panel {
    margin: clamp(1.3rem, 2.2vw, 1.8rem) 0;
    padding: clamp(1.1rem, 2.1vw, 1.6rem);
    border: 1px solid rgb(189 130 56 / 22%);
    border-radius: 1.15rem;
    background:
        radial-gradient(circle at 92% 15%, rgb(189 130 56 / 8%), transparent 20%),
        #fff8ee;
    box-shadow: 0 .5rem 1.3rem rgb(62 42 29 / 4%);
}

.catalog-page .nutrition-product-panel__default {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: .5rem 1.3rem;
}

.catalog-page .nutrition-product-panel__default>.eyebrow {
    grid-column: 1 / -1;
}

.catalog-page .nutrition-product-panel__copy h2,
.catalog-page .nutrition-product-panel__result h2 {
    margin: .14rem 0 .3rem;
    color: #3e2b22;
    font-family: var(--serif);
    font-size: clamp(1.5rem, 2.2vw, 2.2rem);
    line-height: 1.05;
}

.catalog-page .nutrition-product-panel__copy p,
.catalog-page .nutrition-product-panel__result p {
    max-width: 48rem;
    margin: 0;
    color: #6d5d53;
    font-size: .88rem;
    line-height: 1.5;
}

.catalog-page .nutrition-product-panel__result {
    display: grid;
    grid-template-columns: minmax(14rem, .9fr) minmax(18rem, 1.15fr) auto;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.1rem;
    border: 1px solid rgb(111 72 45 / 15%);
    border-radius: .95rem;
    background: linear-gradient(110deg, rgb(183 127 58 / 9%), rgb(255 250 242 / 88%));
}

.catalog-page .nutrition-product-panel__numbers {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .65rem;
}

.catalog-page .nutrition-product-panel__numbers>div {
    display: grid;
    min-height: 4.8rem;
    align-content: center;
    gap: .25rem;
    padding: .75rem .65rem;
    border-radius: .8rem;
    background: linear-gradient(145deg, #6a4734, #513526);
    text-align: center;
}

.catalog-page .nutrition-product-panel__numbers strong {
    color: #fff8ee;
    font-size: 1.55rem;
    line-height: .95;
}

.catalog-page .nutrition-product-panel__numbers span {
    color: #ead7c4;
    font-size: .67rem;
}

.catalog-page .nutrition-product-panel__actions {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.catalog-page .nutrition-product-panel__actions .button {
    min-width: 10rem;
    min-height: 2.7rem;
    padding: .6rem .85rem;
    font-size: .78rem;
}

/* =========================================================
   MODAL FICHA DE ALIMENTACIÓN
   ========================================================= */

.feeding-sheet-dialog {
    width: min(880px, calc(100% - 2rem));
    max-height: calc(100dvh - 2rem);
    overflow: auto;
    padding: 0;
    border: 1px solid rgb(197 138 55 / 22%);
    border-radius: 1.3rem;
    color: #3e2b22;
    background: #fbf3e7;
    box-shadow: 0 1.8rem 5rem rgb(45 31 24 / 34%);
}

.feeding-sheet-dialog::backdrop {
    background: rgb(30 23 19 / 66%);
    backdrop-filter: blur(5px);
}

.feeding-sheet {
    padding: clamp(1.15rem, 3vw, 1.8rem);
    background:
        radial-gradient(circle at 96% 4%, rgb(197 138 55 / 8%), transparent 12rem),
        linear-gradient(180deg, #fffaf2, #fbf3e7);
}

.feeding-sheet__header {
    display: grid;
    gap: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgb(197 138 55 / 22%);
}

.feeding-sheet__summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .55rem;
    margin: .9rem 0 0;
}

.feeding-sheet__summary>div {
    display: grid;
    min-height: 4.8rem;
    align-content: center;
    gap: .2rem;
    padding: .75rem .6rem;
    border-radius: .8rem;
    color: #fff8ee;
    background: linear-gradient(145deg, #6a4734, #513526);
    text-align: center;
}

.feeding-sheet__summary strong {
    font-size: 1.35rem;
}

.feeding-sheet__summary span {
    color: #ead7c4;
    font-size: .65rem;
}

.feeding-sheet__content-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .75rem;
    margin-top: .8rem;
}

.feeding-sheet__card {
    padding: .9rem 1rem;
    border: 1px solid rgb(111 72 45 / 12%);
    border-radius: .9rem;
    background: rgb(255 253 248 / 86%);
}

.feeding-sheet__result-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: .9rem;
    margin-top: .8rem;
    padding: .9rem 1rem;
    border: 1px solid rgb(197 138 55 / 22%);
    border-radius: .9rem;
    background: linear-gradient(110deg, #f4e2c9, #fff7ea);
}

.feeding-sheet__actions {
    position: sticky;
    bottom: 0;
    z-index: 2;
    display: flex;
    justify-content: flex-end;
    gap: .6rem;
    padding: .8rem 1.1rem;
    border-top: 1px solid rgb(84 58 42 / 12%);
    background: rgb(243 228 209 / 96%);
    backdrop-filter: blur(8px);
}

@media (prefers-reduced-motion: reduce) {
    .catalog-page .why-block.is-changing .why-content {
        animation: none;
    }

    .catalog-page .presentation-list label,
    .catalog-page .presentation-format-icon,
    .catalog-page .presentation-selected {
        transition: none;
    }
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (min-width: 1500px) {
    .catalog-page .catalog-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (min-width: 700px) and (max-width: 1049px) {
    .catalog-page .catalog-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (min-width: 851px) and (max-width: 1099px) {

    .catalog-page .detail-shell {
        width: min(calc(100% - 32px), 960px);
    }

    .catalog-page .detail-image {
        width: 100%;
        min-width: 0;
        max-width: 100%;
    }
    .catalog-page .product-hero {
        grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
        gap: 1.4rem;
        padding: 1.25rem;
    }

    .catalog-page .detail-intro h1 {
        font-size: clamp(2rem, 4vw, 2.7rem);
        line-height: 1.04;
    }

    .catalog-page .chips {
        gap: .4rem;
        margin: .75rem 0;
    }

    .catalog-page .chips span {
        min-height: 2.15rem;
        padding: .4rem .6rem;
        font-size: .74rem;
    }

    .catalog-page .lead {
        margin-top: .65rem;
        font-size: .88rem;
        line-height: 1.5;
    }

    .catalog-page .identity {
        gap: .55rem;
        margin: .9rem 0;
    }

    .catalog-page .identity dt {
        font-size: .72rem;
    }

    .catalog-page .identity dd {
        font-size: .8rem;
    }

    .catalog-page .detail-actions {
        gap: .6rem;
    }

    .catalog-page .detail-actions .button {
        flex: 0 0 auto;
        padding-inline: 1rem;
        font-size: .78rem;
    }

    .catalog-page .detail-actions small {
        font-size: .72rem;
    }
}
@media (max-width: 850px) {

    .catalog-page .product-hero,
    .catalog-page .presentations {
        grid-template-columns: 1fr;
    }

    .catalog-page .identity {
        grid-template-columns: 1fr;
    }

    .catalog-page .detail-actions {
        align-items: flex-start;
        flex-direction: column;
    }

    .catalog-page .presentation-list {
        grid-template-columns: 1fr;
    }

    .catalog-page .nutrition-product-panel__result {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 699px) {
    .catalog-page .catalog-discovery__inner {
        padding: 1.45rem 0 1.2rem;
    }

    .catalog-page .catalog-discovery__intro h1 {
        max-width: 21rem;
        margin-top: .28rem;
        font-size: 2.15rem;
        line-height: 1.02;
    }

    .catalog-page .catalog-search {
        margin-top: 1rem;
    }

    .catalog-page .catalog-search__control {
        min-height: 3.15rem;
        border-radius: .82rem;
    }

    .catalog-page .catalog-search__control>svg {
        width: .95rem;
        height: .95rem;
        margin-left: .8rem;
    }

    .catalog-page .catalog-search input {
        padding: .7rem;
        font-size: .8rem;
    }

    .catalog-page .catalog-search button {
        min-height: 2.55rem;
        margin-right: .26rem;
        padding: .58rem .8rem;
        border-radius: .68rem;
        font-size: .72rem;
    }

    .catalog-page .catalog-guide__heading p {
        font-size: .7rem;
    }

    .catalog-page .catalog-pet-filter>span {
        font-size: .66rem;
    }

    .catalog-page .catalog-pet-nav a {
        min-height: 2.2rem;
        padding: .44rem .65rem;
        font-size: .66rem;
    }

    .catalog-page .catalog-refine form {
        position: fixed;
        z-index: 40;
        right: .625rem;
        bottom: .625rem;
        left: .625rem;
        top: auto;
        width: auto;
        max-height: calc(100dvh - 1.25rem);
        overflow: auto;
        border-radius: 1rem;
        box-shadow: 0 1.5rem 5rem rgb(32 20 12 / 28%);
    }

    .catalog-page .catalog-applied__label {
        width: 100%;
    }

    .catalog-page .catalog-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .62rem;
    }

    .catalog-page .catalog-card {
        border-radius: 1rem;
    }

    .catalog-page .fraction-badge {
        top: .48rem;
        left: .48rem;
        padding: .3rem .45rem;
        font-size: .6rem;
    }

    .catalog-page .card-body {
        padding: .72rem;
    }

    .catalog-page .card-meta {
        gap: .3rem;
        font-size: .61rem;
    }

    .catalog-page .card-body h2 {
        margin: .42rem 0;
        font-size: .92rem;
        line-height: 1.17;
    }

    .catalog-page .category-label {
        padding: .25rem .4rem;
        font-size: .62rem;
    }

    .catalog-page .card-body>p {
        display: none;
    }

    .catalog-page .formats {
        margin-top: .5rem;
        font-size: .64rem;
    }

    .catalog-page .formats b {
        font-size: .64rem;
    }

    .catalog-page .card-link {
        min-height: 2.25rem;
        margin-top: .58rem;
        padding-top: .55rem;
        font-size: .68rem;
    }

    .catalog-page .quick-filters {
        gap: .35rem;
        margin-top: 1.3rem;
    }

    .catalog-page .quick-filters a {
        min-width: 2.25rem;
        min-height: 2.25rem;
        padding: .42rem .58rem;
        font-size: .68rem;
    }

    .catalog-page .catalog-guidance {
        grid-template-columns: 1fr;
        padding: 1.5rem 1.15rem;
    }

    .catalog-page .catalog-guidance__action {
        width: 100%;
    }

    .catalog-page .detail-shell {
        padding-top: 1.25rem;
    }

    .catalog-page .detail-topline {
        align-items: flex-start;
        flex-direction: column;
        gap: .5rem;
        margin-bottom: .8rem;
    }

    .catalog-page .product-hero {
        gap: .9rem;
        padding: .8rem;
        border-radius: 1.1rem;
        background: #fffaf2;
    }

    .catalog-page .detail-image {
        width: 100%;
        max-width: 18rem;
        aspect-ratio: 1 / 1;
        margin-inline: auto;
        border-radius: .9rem;
    }

    .catalog-page .detail-image img {
        padding: .35rem;
    }


    
    .catalog-page .product-gallery__arrow {
        width: 2.35rem;
        height: 2.35rem;
    }

    .catalog-page .product-gallery__arrow--prev {
        left: .55rem;
    }

    .catalog-page .product-gallery__arrow--next {
        right: .55rem;
    }

    .catalog-page .product-gallery__footer {
        right: .55rem;
        bottom: .5rem;
        left: .55rem;
    }

    .catalog-page .product-gallery__counter {
        font-size: .7rem;
    }

    .catalog-page .detail-intro {
        padding: .15rem .3rem .4rem;
    }

    .catalog-page .detail-intro h1 {
        margin: 0;
        font-family: var(--sans);
        font-size: 1.55rem;
        font-weight: 800;
        line-height: 1.08;
    }

    .catalog-page .lead {
        margin-top: .7rem;
        font-size: .82rem;
        line-height: 1.45;
    }

    .catalog-page .chips {
        gap: .36rem;
        margin: .7rem 0;
    }

    .catalog-page .chips span {
        min-height: 2rem;
        padding: .35rem .52rem;
        font-size: .68rem;
    }

    .catalog-page .identity {
        gap: .5rem;
        margin: .9rem 0;
    }

    .catalog-page .identity dt {
        font-size: .68rem;
    }

    .catalog-page .identity dd {
        font-size: .78rem;
    }

    .catalog-page .detail-actions {
        gap: .5rem;
    }

    .catalog-page .detail-actions .button {
        width: 100%;
        min-height: 2.55rem;
        font-size: .75rem;
    }

    .catalog-page .detail-actions small {
        font-size: .68rem;
    }

    .catalog-page .why-block {
        grid-template-columns: 1fr;
        padding: 1.2rem;
    }

    .catalog-page .presentations {
        padding: 1.2rem;
    }

    .catalog-page .presentations--standard {
        grid-template-columns: 1fr;
        gap: .7rem;

        padding: .9rem 1rem;
        border-radius: 1.15rem;
    }

    .catalog-page .single-product-purchase__info {
        min-width: 0;
        gap: .15rem;
    }

    .catalog-page .single-product-purchase__label {
        font-size: .6rem;
    }

    .catalog-page .single-product-purchase__price {
        font-size: 1.4rem;
        font-weight: 650;
    }

    .catalog-page .presentations--standard .product-purchase-form,
    .catalog-page .presentations--standard .purchase-controls {
        width: 100%;
    }

    .catalog-page .purchase-controls {
        align-items: stretch;
        flex-direction: column;
        gap: .6rem;
    }

    .catalog-page .purchase-quantity {
        gap: .2rem;
    }

    .catalog-page .purchase-quantity>label {
        font-size: .6rem;
    }

    .catalog-page .purchase-quantity__control,
    .catalog-page .purchase-submit {
        width: 100%;
    }

    .catalog-page .purchase-quantity__control {
        grid-template-columns: 2.65rem minmax(0, 1fr) 2.65rem;
    }

    .catalog-page .purchase-quantity__control button,
    .catalog-page .purchase-quantity__control input {
        height: 2.45rem;
    }

    .catalog-page .purchase-submit {
        min-height: 2.55rem;
        font-size: .78rem !important;
    }

    .catalog-page .product-details details>div {
        padding: 0 .2rem 1.25rem;
    }

    .catalog-page .nutrition-product-panel {
        margin: .95rem 0;
        padding: .9rem;
    }

    .catalog-page .nutrition-product-panel__default {
        grid-template-columns: 1fr;
    }

    .catalog-page .nutrition-product-panel__default>.eyebrow {
        grid-column: auto;
    }

    .catalog-page .nutrition-product-panel__default>.button {
        width: 100%;
    }

    .catalog-page .nutrition-product-panel__numbers {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: .36rem;
    }

    .catalog-page .nutrition-product-panel__numbers>div {
        padding: .6rem .3rem;
    }

    .catalog-page .nutrition-product-panel__numbers strong {
        font-size: 1rem;
    }

    .catalog-page .nutrition-product-panel__numbers span {
        font-size: .62rem;
    }

    .catalog-page .nutrition-product-panel__actions {
        flex-direction: column;
    }

    .catalog-page .nutrition-product-panel__actions .button {
        width: 100%;
    }

    .feeding-sheet-dialog {
        width: calc(100% - 1rem);
        max-height: calc(100dvh - 1rem);
        border-radius: 1rem;
    }

    .feeding-sheet {
        padding: 1rem;
    }

    .feeding-sheet__summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .feeding-sheet__content-grid {
        grid-template-columns: 1fr;
    }

    .feeding-sheet__result-card {
        grid-template-columns: 1fr;
    }

    .feeding-sheet__actions {
        flex-direction: column;
    }

    .feeding-sheet__actions .button {
        width: 100%;
    }
}

/* =========================================================
   RESPONSIVE DEL LISTADO / SIDEBAR
   ========================================================= */

@media (min-width: 1600px) {
    .catalog-page {
        --catalog-sidebar-width: 21rem;
    }

    .catalog-page .catalog-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (min-width: 1100px) and (max-width: 1599px) {
    .catalog-page .catalog-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 850px) and (max-width: 1099px) {
    .catalog-page {
        --catalog-sidebar-width: 17.25rem;
    }

    .catalog-page .catalog-hero-compact__inner {
        grid-template-columns: .9fr 1.1fr;
    }

    .catalog-page .catalog-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 849px) {
    .catalog-page .catalog-hero-compact__inner {
        grid-template-columns: 1fr;
        gap: 1rem;
        width: calc(100% - 1.5rem);
        padding: 1.45rem 0 1.25rem;
    }

    .catalog-page .catalog-hero-compact__copy h1 {
        max-width: 28rem;
        font-size: clamp(2.1rem, 8vw, 3rem);
    }

    .catalog-page .catalog-hero-compact__copy p {
        max-width: 32rem;
        font-size: .88rem;
    }

    .catalog-page .catalog-search__control {
        min-height: 3.2rem;
    }

    .catalog-page .catalog-search input {
        font-size: .84rem;
    }

    .catalog-page .catalog-search button {
        min-height: 2.55rem;
        padding: .58rem .82rem;
        font-size: .72rem;
    }

    .catalog-page .catalog-shop-shell {
        width: calc(100% - 1.25rem);
        padding-top: .9rem;

        isolation: auto;
    }

    .catalog-page .catalog-mobile-filter-trigger {
        display: inline-flex;
        min-height: 2.65rem;
        align-items: center;
        justify-content: center;
        gap: .5rem;
        margin-bottom: .85rem;
        padding: .58rem .85rem;
        border: 1px solid var(--catalog-line-strong);
        border-radius: 999px;
        color: #5e4231;
        background: #fffaf4;
        font: inherit;
        font-size: .75rem;
        font-weight: 850;
        cursor: pointer;
    }

    .catalog-page .catalog-shop-layout {
        position: static;
        z-index: auto;
        display: block;
    }

    .catalog-page .catalog-sidebar {
        position: fixed;
        z-index: 1002;
        top: 78px;
        left: 0;

        width: min(23rem, calc(100vw - 2.5rem));
        height: calc(100dvh - 78px);

        overflow-x: hidden;
        overflow-y: auto;

        border: 0;
        border-radius: 0 1.2rem 1.2rem 0;

        background: #fff8ee;

        box-shadow: 1.2rem 0 4rem rgb(39 25 17 / 22%);

        transform: translateX(-105%);
        transition: transform .24s ease;
    }

    .catalog-page .catalog-sidebar.is-open {
        transform: translateX(0);
    }

    .catalog-page .catalog-sidebar__top {
        position: sticky;
        top: 0;
        z-index: 2;
        background: rgb(248 233 211 / 98%);
        backdrop-filter: blur(10px);
    }

    .catalog-page .catalog-sidebar__close {
        display: grid;
        width: 2.35rem;
        height: 2.35rem;
        place-items: center;
        flex: 0 0 auto;
        border: 1px solid rgb(96 63 43 / 18%);
        border-radius: 50%;
        color: #5c4030;
        background: #fffaf4;
        font: inherit;
        font-size: 1.35rem;
        cursor: pointer;
    }

    .catalog-page .catalog-sidebar-backdrop:not([hidden]) {
        position: fixed;
        z-index: 1001;

        top: 78px;
        right: 0;
        bottom: 0;
        left: 0;

        display: block;

        width: 100%;
        height: auto;

        border: 0;

        background: rgb(36 24 17 / 52%);
        backdrop-filter: blur(2px);

        cursor: pointer;
    }

    body.catalog-filters-open {
        overflow: hidden;
    }

    .catalog-page .catalog-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .7rem;
    }
}

@media (max-width: 599px) {
    .catalog-page .catalog-hero-compact__inner {
        width: calc(100% - 1.25rem);
        padding: 1.25rem 0 1rem;
    }

    .catalog-page .catalog-hero-compact .eyebrow {
        font-size: .66rem;
    }

    .catalog-page .catalog-hero-compact__copy h1 {
        max-width: 20rem;
        margin-top: .25rem;
        font-size: 2rem;
        line-height: 1.02;
    }

    .catalog-page .catalog-hero-compact__copy p {
        max-width: 21rem;
        margin-top: .5rem;
        font-size: .78rem;
        line-height: 1.42;
    }

    .catalog-page .catalog-search__control {
        min-height: 3rem;
        border-radius: .8rem;
    }

    .catalog-page .catalog-search__control>svg {
        width: .92rem;
        height: .92rem;
        margin-left: .76rem;
    }

    .catalog-page .catalog-search input {
        padding: .65rem;
        font-size: .76rem;
    }

    .catalog-page .catalog-search button {
        min-height: 2.42rem;
        margin-right: .25rem;
        padding: .52rem .72rem;
        border-radius: .64rem;
        font-size: .68rem;
    }
    .catalog-page .catalog-shop-shell {
        width: calc(100% - 1rem);
    }
    .catalog-page .catalog-sidebar {
        top: 72px;
        height: calc(100dvh - 72px);
    }

    .catalog-page .catalog-sidebar-backdrop:not([hidden]) {
        top: 72px;
    }
    .catalog-page .catalog-mobile-filter-trigger {
        width: 100%;
        margin-bottom: .7rem;
    }

    .catalog-page .catalog-products__header {
        gap: .55rem;
        margin-bottom: .75rem;
        padding-bottom: .75rem;
    }

    .catalog-page .catalog-products__heading .eyebrow {
        font-size: .62rem;
    }

    .catalog-page .catalog-products__heading h2 {
        font-size: 1.72rem;
    }

    .catalog-page .catalog-products__heading p {
        font-size: .72rem;
    }

    .catalog-page .catalog-applied {
        gap: .28rem;
    }

    .catalog-page .catalog-applied__label {
        width: 100%;
    }

    .catalog-page .catalog-applied__chip {
        font-size: .61rem;
    }

    .catalog-page .catalog-grid {
        gap: .58rem;
    }

    .catalog-page .catalog-card {
        border-radius: .95rem;
    }

    .catalog-page .fraction-badge {
        top: .46rem;
        left: .46rem;
        padding: .28rem .42rem;
        font-size: .56rem;
    }

    .catalog-page .card-body {
        padding: .68rem;
    }

    .catalog-page .card-meta {
        gap: .28rem;
        font-size: .58rem;
    }

    .catalog-page .card-body h2 {
        margin: .4rem 0;
        font-size: .88rem;
        line-height: 1.16;
    }

    .catalog-page .category-label {
        padding: .23rem .38rem;
        font-size: .58rem;
    }

    .catalog-page .card-body>p {
        display: none;
    }

    .catalog-page .formats {
        margin-top: .45rem;
        font-size: .61rem;
    }

    .catalog-page .formats b {
        font-size: .61rem;
    }

    .catalog-page .card-link {
        min-height: 2.2rem;
        margin-top: .52rem;
        padding-top: .5rem;
        font-size: .64rem;
    }

    .catalog-page .quick-filters {
        margin-top: 1.2rem;
    }

    .catalog-page .catalog-guidance {
        grid-template-columns: 1fr;
        padding: 1.4rem 1rem;
    }

    .catalog-page .catalog-guidance__action {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {

    .catalog-page main *,
    .catalog-page main *::before,
    .catalog-page main *::after {
        animation: none !important;
        transition: none !important;
        scroll-behavior: auto !important;
    }
}

/* Descuentos: sticker visual sin alterar la estructura de la tarjeta. */

.catalog-page .presentation-price--discounted,
.catalog-page .single-product-purchase__discount {
    display: inline-flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 7px;
}

.catalog-page .presentation-price--discounted del,
.catalog-page .single-product-purchase__discount del {
    color: #8a8a8a;
    font-size: .86em;
    font-weight: 600;
}

.catalog-page .presentation-price--discounted small,
.catalog-page .single-product-purchase__discount small {
    display: inline-flex;
    padding: 3px 7px;
    border-radius: 999px;
    background: #A63D32;
    color: #fff;
    font-size: .72rem;
    font-weight: 800;
}
/* =========================================================
   DESCUENTO VISUAL SOBRE FOTOGRAFÍA
   Ícono Coratto + porcentaje dinámico
   ========================================================= */

.catalog-page .card-image,
.catalog-page .detail-image {
    position: relative;
}

.catalog-page .catalog-discount-icon {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 8;

    display: flex;
    width: 88px;
    align-items: center;
    flex-direction: column;

    pointer-events: none;
}

.catalog-page .catalog-discount-icon img {
    position: relative;
    padding: 0;
    border-radius: 0;
    display: block;
    width: 78px;
    height: 78px;

    object-fit: contain;

    filter: drop-shadow(0 5px 9px rgba(74, 47, 27, .17));
}


/* Badge clásico inmediatamente debajo del sello. */
.catalog-page .catalog-discount-icon strong {
    position: relative;
    z-index: 2;

    min-width: 58px;

    margin-top: -7px;
    padding: 6px 10px;

    border: 2px solid rgba(255, 250, 244, .9);
    border-radius: 999px;

    color: #fff;
    background: #A63D32;

    font-size: .78rem;
    font-weight: 900;
    line-height: 1;
    letter-spacing: .01em;
    text-align: center;

    box-shadow:
        0 5px 12px rgba(166, 61, 50, .24),
        0 1px 3px rgba(76, 42, 27, .12);
}


/* En ficha el llamado puede ser todavía más protagonista. */
.catalog-page .catalog-discount-icon--detail {
    top: 20px;
    right: 20px;

    width: 108px;
}

.catalog-page .catalog-discount-icon--detail img {
    width: 96px;
    height: 96px;
}

.catalog-page .catalog-discount-icon--detail strong {
    min-width: 68px;

    margin-top: -8px;
    padding: 7px 12px;

    font-size: .88rem;
}


/* Tablet */
@media (min-width: 769px) and (max-width: 1099px) {
    .catalog-page .catalog-discount-icon {
        width: 80px;
    }

    .catalog-page .catalog-discount-icon img {
        width: 70px;
        height: 70px;
    }

    .catalog-page .catalog-discount-icon strong {
        min-width: 54px;
        padding: 5px 9px;
        font-size: .72rem;
    }

    .catalog-page .catalog-discount-icon--detail {
        width: 94px;
    }

    .catalog-page .catalog-discount-icon--detail img {
        width: 84px;
        height: 84px;
    }
}


/* Móvil */
@media (max-width: 768px) {
    .catalog-page .catalog-discount-icon {
        top: 8px;
        right: 8px;

        width: 68px;
    }

    .catalog-page .catalog-discount-icon img {
        width: 60px;
        height: 60px;
    }

    .catalog-page .catalog-discount-icon strong {
        min-width: 46px;

        margin-top: -5px;
        padding: 4px 7px;

        border-width: 1px;

        font-size: .64rem;
    }

    .catalog-page .catalog-discount-icon--detail {
        top: 12px;
        right: 12px;

        width: 82px;
    }

    .catalog-page .catalog-discount-icon--detail img {
        width: 74px;
        height: 74px;
    }

    .catalog-page .catalog-discount-icon--detail strong {
        min-width: 54px;

        margin-top: -6px;
        padding: 5px 8px;

        font-size: .7rem;
    }
}

/* =========================================================
   FICHA PÚBLICA — OPCIONES DE PRODUCTO
   Diseño ecommerce compacto, ancho completo y responsive
   ========================================================= */

.catalog-page .variant-purchase {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .9rem;

    margin-top: 1rem;
    padding: 1rem 1.15rem;

    border: 1px solid rgb(189 130 56 / 24%);
    border-radius: 1.25rem;

    color: var(--catalog-brown);
    background: #fffdf9;

    box-shadow: var(--catalog-shadow-soft);
}

/* Encabezado horizontal:
   usa el ancho real de la ficha en desktop y evita la columna
   angosta que estaba dejando espacio muerto. */
.catalog-page .variant-purchase__heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;

    padding: .95rem 1.05rem;

    border-radius: .9rem;

    background: #68452f;
}

.catalog-page .variant-purchase__heading > div:first-child {
    min-width: 0;
    flex: 1 1 auto;
}

.catalog-page .variant-purchase__heading .eyebrow {
    margin: 0 0 .2rem;

    color: #e9bd7b;

    font-size: .67rem;
    font-weight: 900;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.catalog-page .variant-purchase__heading h2 {
    margin: 0;

    color: #fffaf3;

    font-family: var(--serif);
    font-size: clamp(1.6rem, 2vw, 2rem);
    line-height: 1.04;
}

.catalog-page .variant-purchase__heading p {
    max-width: 42rem;

    margin: .3rem 0 0;

    color: #eadbc9;

    font-size: .78rem;
    line-height: 1.45;
}

/* Precio como bloque secundario del encabezado, no como una tercera card. */
.catalog-page .variant-purchase__price {
    flex: 0 0 auto;

    display: grid;
    min-width: 9.5rem;

    padding: .62rem .8rem;

    border: 1px solid rgb(240 196 119 / 30%);
    border-radius: .7rem;

    background: rgb(255 250 243 / 8%);

    text-align: left;
}

.catalog-page .variant-purchase__buy {
    display: grid;
    justify-items: end;
    gap: .55rem;
    flex: 0 0 auto;
}

.catalog-page .variant-purchase-form .purchase-controls {
    align-items: end;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: .55rem;
}

.catalog-page .variant-purchase-form .purchase-quantity {
    gap: .2rem;
}

.catalog-page .variant-purchase-form .purchase-quantity > label {
    color: #e9bd7b;
    font-size: .68rem;
}

.catalog-page .variant-purchase-form .purchase-quantity__control {
    grid-template-columns: 2rem 2.7rem 2rem;
}

.catalog-page .variant-purchase-form .purchase-quantity__control button,
.catalog-page .variant-purchase-form .purchase-quantity__control input {
    height: 2.15rem;
}

.catalog-page .variant-purchase-form .purchase-submit {
    min-height: 2.15rem;
    padding: .46rem .8rem;
    font-size: .68rem !important;
}

.catalog-page .variant-purchase-form .purchase-submit:disabled,
.catalog-page .variant-purchase-form .purchase-quantity__control button:disabled,
.catalog-page .variant-purchase-form .purchase-quantity__control input:disabled {
    cursor: not-allowed;
    opacity: .48;
}

.catalog-page .variant-purchase__price > span {
    color: #e9bd7b;

    font-size: .6rem;
    font-weight: 850;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.catalog-page .variant-purchase__price strong {
    display: block;

    margin-top: .12rem;

    color: #fffaf3;

    font-size: 1.12rem;
    line-height: 1.1;
}

.catalog-page .variant-purchase__price-placeholder {
    color: #eadbc9 !important;
    font-size: .72rem !important;
    font-weight: 650 !important;
}

.catalog-page .variant-purchase__price del {
    margin-right: .25rem;

    color: #d9c7b6;

    font-size: .72rem;
}

/* Selector en ancho completo. */
.catalog-page .variant-fieldset {
    min-width: 0;
    margin: 0;
    padding: 0;

    border: 0;
}

.catalog-page .variant-fieldset legend {
    margin-bottom: .5rem;

    color: #4b372d;

    font-size: .76rem;
    font-weight: 850;
}

.catalog-page .variant-list {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;

    width: 100%;
}

.catalog-page .variant-option {
    position: relative;
}

.catalog-page .variant-option input {
    position: absolute;

    width: 1px;
    height: 1px;

    overflow: hidden;

    opacity: 0;
    pointer-events: none;
}

.catalog-page .variant-option label {
    display: inline-flex;

    min-width: 4.25rem;
    min-height: 2.75rem;

    align-items: center;
    justify-content: center;

    padding: .48rem .9rem;

    border: 1px solid rgb(84 58 42 / 22%);
    border-radius: .55rem;

    color: #3f2d24;
    background: #fffdf9;

    cursor: pointer;

    transition:
        border-color .18s ease,
        background .18s ease,
        color .18s ease,
        transform .18s ease,
        box-shadow .18s ease;
}

.catalog-page .variant-option label:hover {
    border-color: #bd8238;
    background: #fff7ea;
    transform: translateY(-1px);
}

.catalog-page .variant-option input:focus-visible + label {
    outline: 3px solid rgb(189 130 56 / 22%);
    outline-offset: 2px;
}

.catalog-page .variant-option input:checked + label {
    border-color: #68452f;

    color: #fffaf4;
    background: #68452f;

    box-shadow: 0 .25rem .65rem rgb(84 58 42 / 14%);
}

.catalog-page .variant-option input:checked + label strong {
    color: #fffaf4;
}

.catalog-page .variant-option input:checked + label::after {
    display: none;
}

.catalog-page .variant-option__main {
    display: flex;
    align-items: center;
    justify-content: center;
}

.catalog-page .variant-option__main strong {
    color: inherit;

    font-size: .82rem;
    font-weight: 850;
}

.catalog-page .variant-option__main small,
.catalog-page .variant-option__meta,
.catalog-page .variant-option__status {
    display: none;
}

/* Sin stock: se reconoce sin mostrar cantidades en cada opción. */
.catalog-page .variant-option.is-unavailable label {
    border-color: rgb(84 58 42 / 12%);

    color: #9b8f86;
    background: #f3eee7;

    cursor: not-allowed;
    opacity: .7;
    text-decoration: line-through;
}

.catalog-page .variant-option.is-unavailable label:hover {
    border-color: rgb(84 58 42 / 12%);
    background: #f3eee7;
    transform: none;
}

/* La información relevante aparece solo después de elegir. */
.catalog-page .variant-selection-summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .25rem .6rem;

    width: 100%;
    min-height: 2.45rem;

    margin: 0;
    padding: .56rem .75rem;

    border: 1px solid rgb(189 130 56 / 17%);
    border-left: 3px solid #bd7d31;
    border-radius: .55rem;

    color: #67564b;
    background: #fff8ec;
}

.catalog-page .variant-selection-summary strong {
    color: #68452f;

    font-size: .76rem;
}

.catalog-page .variant-selection-summary span {
    color: #786558;

    font-size: .7rem;
}

/* Mensaje técnico de implementación: no se muestra al cliente. */
.catalog-page .variant-purchase__next-step {
    display: none;
}

/* =========================================================
   TABLET / MÓVIL ANCHO
   ========================================================= */

@media (max-width: 1000px) {
    .catalog-page .variant-purchase {
        gap: .75rem;
        padding: .8rem;
    }

    .catalog-page .variant-purchase__heading {
        gap: 1rem;
        padding: .8rem .9rem;
    }

    .catalog-page .variant-purchase__heading h2 {
        font-size: 1.5rem;
    }

    .catalog-page .variant-purchase__heading p {
        font-size: .74rem;
    }

    .catalog-page .variant-purchase__price {
        min-width: 8rem;
        padding: .55rem .7rem;
    }

    .catalog-page .variant-purchase__buy {
        gap: .45rem;
    }

    .catalog-page .variant-purchase-form .purchase-controls {
        gap: .4rem;
    }

    .catalog-page .variant-option label {
        min-width: 3.8rem;
        min-height: 2.55rem;
        padding: .42rem .7rem;
    }
}

/* =========================================================
   MÓVIL — FICHA DE OPCIONES
   ========================================================= */

@media (max-width: 699px) {

    .catalog-page .variant-purchase {
        gap: .7rem;
        padding: .55rem;

        border-radius: .9rem;
    }

    /* Primero elección, luego preview y finalmente compra. */
    .catalog-page .variant-fieldset,
    .catalog-page .variant-dimension-groups {
        order: -2;
    }

    .catalog-page .variant-mobile-preview {
        display: none;
        order: -1;
    }

    .catalog-page .variant-mobile-preview:not([hidden]) {
        display: grid;
        grid-template-columns: 7rem minmax(0, 1fr);
        align-items: center;
        gap: .85rem;

        padding: .65rem;

        border: 1px solid rgb(189 130 56 / 22%);
        border-radius: .75rem;

        background: #fffaf2;
    }

    .catalog-page .variant-mobile-preview__image {
        overflow: hidden;

        width: 7rem;
        aspect-ratio: 1;

        border: 1px solid rgb(84 58 42 / 12%);
        border-radius: .65rem;

        background: #fff;
    }

    .catalog-page .variant-mobile-preview__image img {
        display: block;

        width: 100%;
        height: 100%;

        padding: .25rem;

        object-fit: contain;
        object-position: center;
    }

    .catalog-page .variant-mobile-preview__info {
        display: grid;
        gap: .18rem;

        min-width: 0;
    }

    .catalog-page .variant-mobile-preview__info > span {
        color: #a86a2d;

        font-size: .68rem;
        font-weight: 850;
        letter-spacing: .04em;
        text-transform: uppercase;
    }

    .catalog-page .variant-mobile-preview__info strong {
        color: #4b3225;

        font-size: .95rem;
        line-height: 1.25;
    }

    .catalog-page .variant-mobile-preview__info small {
        color: #715d50;

        font-size: .76rem;
        line-height: 1.35;
    }

    /* Selector más legible. */
    .catalog-page .variant-fieldset {
        padding: .75rem .7rem;

        border: 1px solid rgb(189 130 56 / 22%);
        border-radius: .7rem;

        background: #fffaf2;
    }

    .catalog-page .variant-fieldset legend {
        margin-bottom: .45rem;
        padding: 0 .15rem;

        color: #68452f;

        font-size: .8rem;
        font-weight: 900;
    }

    .catalog-page .variant-list {
        gap: .38rem;
    }

    .catalog-page .variant-option label {
        min-width: 3.5rem;
        min-height: 2.55rem;

        padding: .42rem .65rem;

        border-radius: .5rem;
    }

    .catalog-page .variant-option__main strong {
        font-size: .76rem;
    }

    /* En móvil ya escogimos arriba:
       no repetimos el título "Opciones disponibles". */
    .catalog-page .variant-purchase__heading {
        display: block;

        padding: .7rem;

        border-radius: .72rem;

        background: #68452f;
    }

    .catalog-page .variant-purchase__heading > div:first-child {
        display: none;
    }

    /* Precio + cantidad en una sola línea. */
    .catalog-page .variant-purchase__buy {
        display: grid;
        grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
        align-items: end;
        gap: .6rem;

        width: 100%;
    }

    .catalog-page .variant-purchase__price {
        grid-column: 1;
        grid-row: 1;

        width: 100%;
        min-width: 0;

        margin: 0;
        padding: .52rem .5rem;

        border-radius: .58rem;

        text-align: center;
    }

    .catalog-page .variant-purchase__price > span {
        font-size: .62rem;
    }

    .catalog-page .variant-purchase__price strong {
        margin-top: .08rem;

        font-size: 1rem;
    }

    .catalog-page .variant-purchase__price-placeholder {
        font-size: .68rem !important;
    }

    .catalog-page .variant-purchase-form {
        display: contents;
    }

    .catalog-page .variant-purchase-form .purchase-controls {
        display: contents;
    }

    .catalog-page .variant-purchase-form .purchase-quantity {
        grid-column: 2;
        grid-row: 1;

        width: 100%;
        gap: .22rem;
    }

    .catalog-page .variant-purchase-form .purchase-quantity > label {
        color: #e9bd7b;

        font-size: .66rem;
        font-weight: 850;
    }

    .catalog-page .variant-purchase-form .purchase-quantity__control {
        grid-template-columns: 2.2rem minmax(2.8rem, 1fr) 2.2rem;

        width: 100%;
    }

    .catalog-page .variant-purchase-form .purchase-quantity__control button,
    .catalog-page .variant-purchase-form .purchase-quantity__control input {
        height: 2.5rem;
    }

    .catalog-page .variant-purchase-form .purchase-submit {
        grid-column: 1 / -1;
        grid-row: 2;

        width: 100%;
        max-width: none;
        min-height: 2.65rem;

        margin-top: .08rem;

        font-size: .8rem !important;
    }

    /* El preview ya contiene esta información en móvil. */
    .catalog-page .variant-selection-summary {
        display: none;
    }

    /* El SKU es información operativa. */
    .catalog-page .identity div:first-child {
        display: none;
    }
}

@media (max-width: 480px) {

    .catalog-page .variant-mobile-preview:not([hidden]) {
        grid-template-columns: 6.4rem minmax(0, 1fr);
        gap: .7rem;
    }

    .catalog-page .variant-mobile-preview__image {
        width: 6.4rem;
    }

    .catalog-page .variant-list {
        display: flex;
        flex-wrap: wrap;
        gap: .32rem;
    }

    .catalog-page .variant-option label {
        min-width: 3.15rem;
        min-height: 2.35rem;

        padding: .36rem .5rem;
    }

    .catalog-page .variant-option__main strong {
        font-size: .74rem;
    }

    .catalog-page .variant-purchase__buy {
        grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
        gap: .5rem;
    }
}
@media (max-width: 380px) {
    .catalog-page .variant-list {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}
/* =========================================================
   FICHA DE PRODUCTO — DESCRIPCIÓN Y VARIANTES POR DIMENSIÓN
   ========================================================= */

.catalog-page .variant-dimension-groups {
    display: grid;
    gap: .95rem;
}

.catalog-page .variant-dimension-groups .variant-fieldset + .variant-fieldset {
    padding-top: .9rem;
    border-top: 1px solid rgb(84 58 42 / 10%);
}

.catalog-page .product-description-panel {
    max-width: 68rem;
    margin: clamp(2rem, 4vw, 3.4rem) auto 0;
    padding: clamp(1.15rem, 2.4vw, 1.8rem) clamp(1.1rem, 2.8vw, 2rem);
    border: 1px solid rgb(189 130 56 / 20%);
    border-radius: 1rem;
    background: #fffdf9;
    box-shadow: 0 .65rem 1.8rem rgb(84 58 42 / 5%);
}

.catalog-page .product-description-panel .section-heading {
    margin-bottom: .7rem;
}

.catalog-page .product-description-panel .section-heading h2 {
    font-size: clamp(1.55rem, 2.5vw, 2.2rem);
}

.catalog-page .product-description-panel > p {
    max-width: 62rem;
    margin: 0;
    color: #625248;
    font-size: .94rem;
    line-height: 1.72;
    white-space: pre-line;
}

@media (max-width: 699px) {
    .catalog-page .variant-dimension-groups {
        gap: .68rem;
    }

    .catalog-page .variant-dimension-groups .variant-fieldset + .variant-fieldset {
        padding-top: .65rem;
    }

    .catalog-page .product-description-panel {
        margin-top: 1rem;
        padding: .9rem .85rem;
        border-radius: .8rem;
    }

    .catalog-page .product-description-panel .section-heading {
        margin-bottom: .45rem;
    }

    .catalog-page .product-description-panel .section-heading h2 {
        font-size: 1.35rem;
    }

    .catalog-page .product-description-panel > p {
        font-size: .82rem;
        line-height: 1.62;
    }
}