.receta {
    background-color: var(--background-libreta);
    border-radius: 26px;
    overflow-x: hidden;
    /* Previene scroll horizontal */
    overflow-y: visible;
    /* Permite que las imágenes de fondo se vean por abajo */
    color: var(--azul-xunta);
    width: 100%;
    max-width: 100%;
}

.receta-col {
    display: flex;
    flex-direction: column;
}

.single-receta {
    display: flex;
    flex-direction: column;

}

.columna-oculta-en-desktop {
    display: block;
}

@media (min-width: 992px) {
    .columna-oculta-en-desktop {
        display: none;
    }
}

.anillas {
    width: 100%;
    margin-bottom: 30px;
}

.anillas img {
    display: block;
    width: 100%;
    height: auto;
}

.receta-body {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 0 16px 60px;
    /* padding lateral + inferior en mobile */
}

@media (min-width: 992px) {
    .receta-body {
        grid-template-columns: 1fr 1fr;
        padding-left: 8%;
        padding-right: 8%;
        column-gap: 28px;
    }

    /* Background solo en desktop */
    .receta.primeiros {
        background-image: url('../imaxes/almirez.svg');
        background-repeat: no-repeat;
        background-position: calc(100% - 12%) calc(100% + 16%);
        /* 12% desde la derecha (más a la izquierda) 16% por debajo (negativo) */
        background-size: 30% auto;
        /* 30% de ancho (más grande) */
        overflow-x: hidden;
        /* Previene scroll horizontal */
        overflow-y: visible;
        /* Permite que se vea la parte que sobresale por debajo */
    }

    .receta.peixes {
        background-image: url('../imaxes/amasador.svg');
        background-repeat: no-repeat;
        background-position: calc(100% - 40%) bottom;
        /* -40% desde la derecha, abajo */
        background-size: 50% auto;
        /* Máximo 50% de ancho */
        overflow-x: hidden;
        /* Previene scroll horizontal */
        overflow-y: visible;
        /* Permite que se vea la parte que sobresale por debajo */
    }

    /* Background amasador.svg invertido y a la derecha para el módulo con Filloas */
    .receta.peixes.filloas-module {
        background-image: none;
        /* Eliminamos el background original */
        position: relative;
        overflow-x: hidden;
        overflow-y: visible;
    }

    /* Pseudo-elemento para el background invertido a la derecha */
    .receta.peixes.filloas-module::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-image: url('../imaxes/amasador.svg');
        background-repeat: no-repeat;
        background-position: calc(-10%) bottom;
        /* Posicionado a la derecha, ajustado para que se vea bien */
        background-size: 50% auto;
        transform: scaleX(-1);
        /* Invierte solo el background */
        pointer-events: none;
        /* No interfiere con el contenido */
        z-index: 0;
    }

    /* Asegurar que el contenido esté por encima */
    .receta.peixes.filloas-module .anillas,
    .receta.peixes.filloas-module .receta-body {
        position: relative;
        z-index: 1;
    }

    .receta.cordeiro {
        background-image: url('../imaxes/cuchara.svg');
        background-repeat: no-repeat;
        background-position: -9% calc(100% + 1%);
        /* Se sale por la izquierda, 16% por debajo (negativo) */
        background-size: 44% auto;
        /* 45% de ancho */
        overflow-x: hidden;
        /* Previene scroll horizontal */
        overflow-y: visible;
        /* Permite que se vea la parte que sobresale */
    }

    .receta.polo {
        background-image: url('../imaxes/manopla-olla.svg');
        background-repeat: no-repeat;
        background-position: calc(100% + 22%) calc(100% + 8%);
        /* Se sale 1% por la derecha, 1% por debajo */
        background-size: 55% auto;
        /* 30% de ancho */
        overflow-x: hidden;
        /* Previene scroll horizontal */
        overflow-y: visible;
        /* Permite que se vea la parte que sobresale */
    }

}

.titulo-receta {
    text-wrap: balance;
    font-weight: 600;
    line-height: 1.1;
    font-size: 24px;
    /* mobile */
}

.subtitulo-receta {
    font-size: 20px;
    /* mobile */
    font-weight: 400;
    margin-top: 16px;
    margin-bottom: 6px;
}

.texto-receta {
    font-size: 15px;
    /* mobile */
    font-weight: 400;
    line-height: 1.2;
}

@media (min-width: 992px) {
    .titulo-receta {
        font-size: 40px;
        line-height: 1.1;
    }

    .subtitulo-receta {
        font-size: 32px;
        /* desktop */
    }

    .texto-receta {
        font-size: 22px;
        /* desktop */
    }
}

.texto-receta p+p {
    margin-top: 0.5em;
}

.separador-receta {
    border: 0;
    border-top: 2px solid var(--dorado);
    margin: 32px 0;
}

/* Variantes por sección */
.receta.primeiros {
    background-color: var(--background-libreta);
}

.receta.peixes {
    background-color: var(--azul-claro);
}

.receta.cordeiro {
    background-color: var(--naranja-claro);
}

.receta.polo {
    background-color: var(--amarillo-claro);
}