/* BioAgro Blocks — Frontend Styles */

/* ── Fuentes ──────────────────────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&display=swap');

/* ── Reset y base ─────────────────────────────────────────────────────────── */
.bioagro-section {
    box-sizing: border-box;
}

.bioagro-section *,
.bioagro-section *::before,
.bioagro-section *::after {
    box-sizing: inherit;
}

/* ── Material Symbols ────────────────────────────────────────────────────── */
.material-symbols-outlined {
    font-family: 'Material Symbols Outlined', sans-serif;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    vertical-align: middle;
    line-height: 1;
    display: inline-block;
}

/* ── Sombra editorial ────────────────────────────────────────────────────── */
.bioagro-editorial-shadow {
    box-shadow: 0 32px 64px -12px rgba(26, 28, 27, 0.08);
}

/* ── Animaciones respetuosas de accesibilidad ─────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .bioagro-section *,
    .bioagro-section *::before,
    .bioagro-section *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

/* ── Hero: imagen flotante ────────────────────────────────────────────────── */
.bioagro-section .rotate-1 {
    transform: rotate(1deg);
}

.bioagro-section .rotate-1:hover {
    transform: rotate(0deg);
}

/* ── Productos: hover card ────────────────────────────────────────────────── */
.bioagro-section .group:hover img {
    transform: scale(1.05);
}

/* ── Galería: hover imagen ────────────────────────────────────────────────── */
.bioagro-section figure:hover img {
    transform: scale(1.1);
}

/* ── Focus ring global para accesibilidad ────────────────────────────────── */
.bioagro-section a:focus-visible,
.bioagro-section button:focus-visible,
.bioagro-section input:focus-visible,
.bioagro-section textarea:focus-visible {
    outline: 3px solid #E76F51;
    outline-offset: 3px;
    border-radius: 4px;
}

/* ── CTA Form inputs focus ───────────────────────────────────────────────── */
.bioagro-section input:focus,
.bioagro-section textarea:focus {
    box-shadow: 0 0 0 2px #E76F51;
}

/* ── Diferenciador: tabla responsiva ─────────────────────────────────────── */
@media (max-width: 767px) {
    .bioagro-section [role="table"] {
        gap: 0;
    }
    .bioagro-section [role="table"] > div {
        border-radius: 0;
    }
    .bioagro-section [role="table"] > div:first-child {
        border-radius: 1.5rem 1.5rem 0 0;
    }
    .bioagro-section [role="table"] > div:last-child {
        border-radius: 0 0 1.5rem 1.5rem;
    }
}

/* ── Testimonios: estrellas ───────────────────────────────────────────────── */
.bioagro-section blockquote svg {
    display: inline-block;
}

/* ── Galería: grid responsivo extra-small ────────────────────────────────── */
@media (max-width: 480px) {
    .bioagro-section .grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* ── Smooth scroll ───────────────────────────────────────────────────────── */
html {
    scroll-behavior: smooth;
}

/* ── Utilidades de imagen lazy ───────────────────────────────────────────── */
.bioagro-section img {
    transition: transform 0.5s ease, opacity 0.3s ease;
}

.bioagro-section img[loading="lazy"] {
    opacity: 0;
}

.bioagro-section img[loading="lazy"].loaded,
.bioagro-section img:not([loading="lazy"]) {
    opacity: 1;
}