/* =========================================
   1. DESIGN TOKENS (Variables de Figma)
   ========================================= */
:root {
    /* --- Color Brand --- */
    --color-brand-primary: #76BA4B;

    /* --- Color Accent --- */
    --color-accent: #1A4E2C;

    /* --- Color Surface (Fondos) --- */
    --background-neutro-050: #FFFFFF;
    --background-neutro-100: #FAF7EE;
    --background-neutro-150: #F7F3E9;
    --background-accent-tonal: #1A4E2C;

    /* --- Color Content (Textos) --- */
    --color-text-brand: #1A4E2C;
    --color-text-primary: #080F0A;
    --color-text-secundary: #4F5852;
    --color-text: #546256;
    --color-text-light: #FAF7EE;
    --text-on-brand-secundary: #76BA4B;
    --text-on-brand: #ffffff;

    /* --- Color Stroke (Contornos) --- */
    --color-stroke-light: #DFDCD4;

    /* --- Tipografías --- */
    --font-primary: 'Inter', sans-serif;

    /* =========================================
   2. BOOTSTRAP OVERRIDES
   ========================================= */
    --bs-primary: var(--color-brand-primary);
    --bs-body-font-family: var(--font-primary);
    --bs-body-color: var(--text-primary);
    --bs-body-bg: var(--background-neutro-050);
    --bs-secondary-color: var(--color-text);
}

/* =========================================
   3. COMPONENTES PERSONALIZADOS
   ========================================= */

/* A. Ajuste del Botón Primary */
.btn-primary {
    background-color: var(--color-brand-primary);
    color: var(--color-text-primary);
    padding: 1rem 1.5rem;
    border-color: var(--color-brand-primary);
    border-radius: 100px;
    transition: all 0.3s ease;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary:active:focus {
    background-color: var(--color-accent) !important;
    border-color: var(--color-accent) !important;
    color: var(--color-text-light) !important;
    filter: brightness(1.3);
}

/* B. boton Secundario */
.btn-secondary {
    background-color: var(--background-neutro-050);
    color: var(--color-text-primary);
    font-weight: 500;
    font-style: normal;
    border-radius: 100px;
    padding: 1rem 1.5rem;
    transition: all 0.3s ease;
}

.btn-secondary:hover,
.btn-secondary:focus {
    background-color: var(--color-brand-primary) !important;
    color: var(--color-text-primary) !important;
    filter: brightness(0.95);
}

.btn-link {
    color: var(--color-text-light) !important;
    font-weight: 500;
    transition: all 0.3s ease;
}

.btn-link:hover,
.btn-link:focus {
    color: var(--color-text-light) !important;
    filter: brightness(0.95);
}

/* C. Card */
.card {
    border-radius: 1rem;
    border: 1px solid var(--color-stroke-light);
}

/* D. Utility classes for HTML */
html {
    scroll-behavior: smooth;
}

section[id] {
    scroll-margin-top: 120px;
}

.text-brand-primary {
    color: var(--color-brand-primary);
}

.color-text-accent {
    color: var(--color-accent);
}

.color-text-brand {
    color: var(--color-text-brand);
}

.color-text-primary {
    color: var(--color-text-primary);
}

.color-text-secundary {
    color: var(--color-text-secundary);
}

.color-text-light {
    color: var(--color-text-light);
}

.text-on-brand-secondary {
    color: var(--text-on-brand-secundary);
}

.text-on-brand {
    color: var(--text-on-brand);
}

.bg-brand-primary {
    background-color: var(--color-brand-primary);
}

.bg-accent {
    background-color: var(--color-accent);
}

.bg-neutro-050 {
    background-color: var(--background-neutro-050);
}

.bg-neutro-100 {
    background-color: var(--background-neutro-100);
}

.bg-neutro-150 {
    background-color: var(--background-neutro-150);
}

.bg-accent-tonal {
    background-color: var(--background-accent-tonal);
}

.border-stroke-light {
    border-color: var(--color-stroke-light);
}

.border-brand-primary {
    border-color: var(--color-brand-primary);
}

.border-accent {
    border-color: var(--color-accent);
}

/* E. Evitar scroll horizontal */
html,
body {
    overflow-x: clip;
    width: 100%;
}

body {
    background-color: var(--background-neutro-100);
}

/* F. Divider */
.divider {
    border-top: 1px solid var(--color-stroke-light);
}

/* =========================================
   4. Homepage Custom Styles
     (Estilos específicos para la página de inicio, no relacionados con componentes reutilizables)
     Sección por sección, con comentarios claros.
   ========================================= */

/* --- Header / Navbar --- */
.enlace-numero {
    font-family: "JetBrains Mono", monospace;
    font-optical-sizing: auto;
    font-style: normal;
    font-size: 0.75rem;
    color: #A7AD9B;
}

/* Ajuste de escala para el logotipo */
.logotipo-empresa {
    max-height: 70px;
    width: auto;
    object-fit: contain;
}

/* --- Hero image --- */
.hero-card {
    border-radius: 1.5rem 1.5rem 0 0;
    border: 1px solid var(--color-stroke-light);
    overflow: hidden;
}

.hero-text-block {
    background-color: #F7F3E9;
}

.hero-eyebrow {
    font-family: "JetBrains Mono", monospace;
    font-optical-sizing: auto;
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: .14em;
}

.hero-title {
    font-family: "Fraunces", serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-style: normal;
}

.hero-title span {
    font-style: italic;
}

.hero-imagen-adaptativa {
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: right;
    display: block;
    /* Forzamos la relación de aspecto solicitada en móviles (puedes usar 1/1 o 3/4) */
    aspect-ratio: 4 / 3;
    /* Separación sutil del contenido superior */
    border-radius: 0 0 1.5rem 1.5rem;
}

/* --- sección desafío --- */
.section-title {
    font-family: "Fraunces", serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-size: 2rem;
}

.section-title span {
    font-weight: 600;
}

.section-eyebrow,
.card-num {
    font-family: "JetBrains Mono", monospace;
    font-optical-sizing: auto;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: .14em;
    color: var(--color-text-secundary);
}

.card-title {
    font-family: "Fraunces", serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-style: normal;
    font-size: 1.5rem;
    color: var(--color-text-primary);
}

.card-desc {
    font-family: var(--font-primary);
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-size: 1rem;
    color: var(--color-text-secundary);
}

.grid-cell-1 {
    border: 1px solid var(--color-stroke-light);
    border-radius: 1.5rem 1.5rem 0 0;
}

.grid-cell-5 {
    border-radius: 0 0 1.5rem 1.5rem;
}

.grid-cell-2,
.grid-cell-3,
.grid-cell-5 {
    border-left: 1px solid var(--color-stroke-light);
    border-right: 1px solid var(--color-stroke-light);
    border-bottom: 1px solid var(--color-stroke-light);
}

.grid-cell-4 {
    border-left: 1px solid var(--color-stroke-light);
    border-right: 1px solid var(--color-stroke-light);
}

/* ── Recuerda callout ── */
.caja-recordatorio {
    background: linear-gradient(to right, #13311d 0%, #24472c 50%, #305839 100%);
    border-radius: 1.5rem;
    max-width: 615px;
}

/* El texto se fuerza por encima de la imagen */
.contenido-recordatorio {
    z-index: 2;
}

/* Estilos de la etiqueta de encabezado */
.recordatorio-etiqueta {
    font-family: "JetBrains Mono", monospace;
    font-size: 0.75rem;
    color: rgba(250, 247, 238, 0.75);
    letter-spacing: 0.18em;
}

/* Estilos del cuerpo de texto en serif */
.recordatorio-texto {
    font-family: "Fraunces", serif;
    font-size: 1.15rem;
    /* Un poco más grande para emular la jerarquía de la imagen */
    font-weight: 300;
    line-height: 1.4;
    color: var(--color-text-light);
}

/* Enfatizados en cursiva y con el color de marca verde claro */
.texto-resaltado {
    font-weight: 500;
    font-style: italic;
    color: #79b94b;
    /* Reemplaza aquí por tu variable fija si lo prefieres */
}

/* --- Sección Presentación --- */
.seccion-presentacion {
    /* Mismo degradado base que el snackbar corporativo */
    background: linear-gradient(to right, #164527 0%, #0C321B 100%);
    isolation: isolate;
}

/* Control estricto de la imagen del patrón */
.presentacion-patron-fondo {
    z-index: -1;
}

.posicion-contenido-presentacion {
    z-index: 2;
}

.section-eyebrow-accent,
.section-title-accent {
    color: var(--color-text-light);
}

.section-title-accent span {
    font-style: italic;
}

.section-eyebrow-accent {
    font-size: 0.875rem;
    color: rgba(250, 247, 238, 0.75);
}

/* --- Tarjetas de Productos (Grid Inferior) --- */
.tarjeta-producto {
    height: 400px;
    /* Altura fija óptima para mostrar el bulto y el cultivo */
    border: 1px solid var(--color-stroke-light);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
    z-index: 1;
    cursor: pointer;
}

.tarjeta-imagen-fondo {
    z-index: -1;
    transition: transform 0.5s ease;
}

/* Gradiente interno inferior en cada tarjeta para asegurar legibilidad del texto "Ver Detalle" */
.tarjeta-producto::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 40%;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%);
    z-index: 1;
}

/* --- sección solución --- */

/* --- Bloque 1: La Solución --- */
.posicion-contenido-solucion {
    border-radius: 1.5rem 1.5rem 0 0;
}

.contenedor-grid {
    border-radius: 1.5rem;
}

.contenedor-grid .grid-cell-1 {
    border-radius: 1.5rem 1.5rem 0 0;
}

.contenedor-grid .grid-cell-2,
.contenedor-grid .grid-cell-3,
.contenedor-grid .grid-cell-4 {
    border-left: 1px solid var(--color-stroke-light);
    border-bottom: 1px solid var(--color-stroke-light);
    border-right: 1px solid var(--color-stroke-light);
}

.contenedor-grid .grid-cell-4 {
    border-radius: 0 0 1.5rem 1.5rem;
}

/* --- Bloque 2: Plan Nutricional --- */
.bloque-plan {
    background: linear-gradient(to left, #0C321B 0%, #164527 100%);
    isolation: isolate;
}

.plan-patron {
    opacity: 0.7;
}

/* --- Tarjetas del Plan --- */
.titulo-producto-plan {
    font-style: italic;
    color: var(--color-brand-primary);
}

.card-subtitle {
    font-family: "JetBrains Mono", monospace;
    font-optical-sizing: auto;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: .14em;
}

.texto-descripcion-plan {
    color: rgba(250, 247, 238, 0.75);
}

.bg-dark-smooth {
    background-color: #062714;
}

.tarjeta-plan {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.imagen-tarjeta-plan {
    transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}

.badge-etapa span {
    color: var(--color-text-light);
}

.subtitulo-producto-plan {
    font-size: 0.95rem;
    font-style: italic;
}

.tarjeta-plan:hover .imagen-tarjeta-plan {
    transform: scale(1.03);
}

/* --- Sección Semillas --- */
.seccion-semillas .semillas-logo {
    width: 35%;
}

.tarjeta-variedades {
    border: 1px solid var(--color-stroke-light);
}

.badge-variedad {
    font-size: 0.875rem;
    border: 1px solid var(--color-stroke-light);
    padding: 0.25rem 0.75rem;
    background-color: #F7F3E9;
}

.titulo-minituberculos {
    font-family: "Fraunces", serif;
    font-size: 1.5rem;
}

.contenedor-info-minituberculos .text-desc {
    font-size: 0.875rem;
}

.contenedor-condiciones-ventajas {
    background-color: #F7F3E9;
}

.contenedor-info-minituberculos .grid-cell-3 {
    border-radius: 0 0 1.5rem 1.5rem;
}

.contenedor-info-minituberculos ul li {
    font-size: 0.875rem;
}

.contenedor-manejo-tecnico .grid-cell-4 {
    border-radius: 0 0 1.5rem 1.5rem;
    border-bottom: 1px solid var(--color-stroke-light);
}

.cta-semillas-yc {
    background: linear-gradient(to right, #021E0C 0%, #000000 100%);
    border-radius: 1.5rem;
}

.cta-semillas-yc .card-num {
    color: var(--color-text-light);
}

/* --- Sección Productos --- */
.capa-hover-fondo {
    display: none;
}

.container-productos .grid-cell-1 {
    border-radius: 1.5rem 1.5rem 0 0;
    border-left: 1px solid var(--color-stroke-light);
    border-top: 1px solid var(--color-stroke-light);
    border-right: 1px solid var(--color-stroke-light);
    border-bottom: 1px solid var(--color-stroke-light);
}

.container-productos .grid-cell-2,
.container-productos .grid-cell-3 {
    border-left: 1px solid var(--color-stroke-light);
    border-right: 1px solid var(--color-stroke-light);
    border-bottom: 1px solid var(--color-stroke-light);
}

.container-productos .grid-cell-3 {
    border-radius: 0 0 1.5rem 1.5rem;
}

.seccion-catalogo .tarjeta-catalogo {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.seccion-catalogo .tarjeta-catalogo .contenido-tarjeta-superior {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
}

.seccion-catalogo .tarjeta-catalogo .contenido-tarjeta-inferior {
    margin-top: auto;
}

.seccion-catalogo .tarjeta-catalogo .card-especificaciones {
    font-size: 0.75rem;
}

.contenedor-bulto-producto {
    width: 100%;
    max-height: 275px;
}

.contenedor-bulto-producto .imagen-bulto-catalogo {
    transition: transform 0.4s ease, opacity 0.3s ease;
    width: 50%;
    height: 100%;
}

.badge-tecnico-catalogo {
    font-family: "JetBrains Mono", monospace;
    font-size: 0.875rem;
    border-radius: 100px;
    border: 1px solid var(--color-stroke-light);
    padding: 0.25rem 0.5rem;
}

.seccion-catalogo .lista-beneficios-catalogo li span {
    font-family: "JetBrains Mono", monospace;
    font-size: 0.75rem;
}

/* --- Sección porque elegirnos --- */
.img-card {
    position: relative;
    border-radius: 1rem;
    overflow: hidden;
    /* La altura se define por el contenido de la col derecha en desktop */
    height: 100%;
    min-height: 340px;
}

/* Caption sobre la imagen */
.img-caption {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 1.5rem;
    background: linear-gradient(to top, rgba(0, 0, 0, 1) 0%, transparent 100%);
}

.img-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.img-caption p {
    font-family: "Fraunces", serif;
    font-size: 2rem;
    font-weight: 600;
    color: var(--color-text-light);
    line-height: 1.3;
    margin: 0;
}

.img-caption em {
    font-family: "Fraunces", serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-style: italic;
    color: var(--color-brand-primary);
}

.ventaja-row h3 {
    font-size: 1.125rem;
}

/* sección testimonios */
.seccion-testimonios .tarjeta-testimonio-principal {
    border-radius: 1.5rem 1.5rem 0 0;
}

.seccion-testimonios .tarjeta-testimonio-principal .card-num-accent {
    color: var(--color-text-light);
}

.seccion-testimonios .tarjeta-testimonio-principal .badge,
.tarjeta-testimonio-secundaria .badge {
    font-size: 0.75rem;
}

.seccion-testimonios .tarjeta-testimonio-principal .card-title {
    color: var(--color-text-light);
}

.seccion-testimonios .tarjeta-testimonio-principal .testimonio-desc {
    font-family: "Fraunces", serif;
    font-optical-sizing: auto;
    font-size: 1.125rem;
}

.contenedor-test-secundarios {
    border-radius: 0 0 1.5rem 1.5rem;
    border-left: 1px solid var(--color-stroke-light);
    border-right: 1px solid var(--color-stroke-light);
    border-bottom: 1px solid var(--color-stroke-light);
}

.tarjeta-testimonio-secundaria .badge {
    font-family: "JetBrains Mono", monospace;
    font-optical-sizing: auto;
    border: 1px solid var(--color-stroke-light);
}

.tarjeta-testimonio-secundaria .testimonio-body p {
    font-family: "Fraunces", serif;
    font-optical-sizing: auto;
    font-size: 1.125rem;
}

.tarjeta-testimonio-secundaria .testimonio-footer h4 {
    font-family: "Fraunces", serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-style: normal;
    font-size: 1.125rem;
}

.tarjeta-testimonio-secundaria .testimonio-footer p {
    font-family: "JetBrains Mono", monospace;
    font-optical-sizing: auto;
    font-size: 0.75rem;
    letter-spacing: .14em;
}

/* sección faq */
.seccion-faq .accordion-button {
    font-family: "Fraunces", serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-size: 1.125rem;
}

.seccion-faq .accordion-button:not(.collapsed) {
    color: #062714 !important;
    /* Cambia al verde oscuro corporativo al abrirse */
}

/* sección cta */
.seccion-cta {
    background: linear-gradient(to right, #164527 0%, #0C321B 100%);
    isolation: isolate;
}

.seccion-cta .cta-title {
    font-size: 3rem;
}

.seccion-cta .cta-footer span {
    color: var(--color-text-light);
}

/* Footer */
.tarjeta-distribuidor {
    background-color: #F7F3E9;
}

.tarjeta-distribuidor .distribuidor-info {
    font-family: "Fraunces", serif;
    font-optical-sizing: auto;
    font-size: 1.125rem;
}

/* Botón flotante personalizado */
.whatsapp-fab {
    position: fixed;
    right: max(12px, calc((100vw - 100%) / 2 + 14px));
    bottom: 16px;
    z-index: 1050;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 16%;
    background: #25D366;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
    text-decoration: none;
}

.whatsapp-fab img {
    width: 56px;
    height: 56px;
    display: block;
}

/* =========================================
   Breakpoints Customizados
   ========================================= */

/* --- 608px landscape --- */
@media (min-width: 608px) {}

/* --- 768px Tablet --- */
@media (min-width: 768px) {

    /* --- Hero image --- */
    .hero-section {
        min-height: 528px;
    }

    .hero-imagen-adaptativa {
        aspect-ratio: auto;
    }

    /* --- sección desafío --- */
    .grid-cell-1 {
        border-top: 1px solid var(--color-stroke-light);
        border-right: 1px solid var(--color-stroke-light);
        border-bottom: 1px solid var(--color-stroke-light);
        border-left: 1px solid var(--color-stroke-light);
        border-radius: 1.5rem 0 0 0;
    }

    .grid-cell-2 {
        border-left: 0px;
        border-top: 1px solid var(--color-stroke-light);
        border-radius: 0 1.5rem 0 0;
    }

    .grid-cell-3 {
        border-bottom: 0px;
    }

    .grid-cell-4 {
        border-left: 0px;
        border-bottom: 1px solid var(--color-stroke-light);
    }

    .grid-cell-5 {
        border-radius: 0 0 1.5rem 0;
    }

    .grid-cell-6 img {
        border-radius: 0 0 0 1.5rem;
    }

    /* --- sección solución --- */
    .posicion-contenido-solucion {
        border-left: 1px solid var(--color-stroke-light);
        border-top: 1px solid var(--color-stroke-light);
        border-right: 1px solid var(--color-stroke-light);
    }

    .contenedor-grid .grid-cell-1 {
        border-radius: 1.5rem 0 0 0;
    }

    .contenedor-grid .grid-cell-2,
    .contenedor-grid .grid-cell-4 {
        border-left: 0px;
    }

    .contenedor-grid .grid-cell-3 {
        border-radius: 0 0 0 1.5rem;
    }

    .contenedor-grid .grid-cell-4 {
        border-radius: 0 0 1.5rem 0;
    }

    .imagen-criolla {
        height: 100%;
        object-position: right;
    }

    /* --- sección semillas --- */
    .seccion-semillas .semillas-logo {
        width: 25%;
    }

    .contenedor-info-minituberculos .grid-cell-1 {
        border-bottom: 0px;
        border-radius: 1.5rem 1.5rem 0 0;
    }

    .contenedor-info-minituberculos .grid-cell-2 {
        border-left: 1px solid var(--color-stroke-light);
        border-radius: 0 0 0 1.5rem;
    }

    .contenedor-info-minituberculos .grid-cell-3 {
        border-radius: 0 0 1.5rem 0;
        border-left: 0px;
        border-top: 1px solid var(--color-stroke-light);
        border-bottom: 1px solid var(--color-stroke-light);
    }

    .contenedor-manejo-tecnico .grid-cell-3 {
        border-radius: 0 0 0 1.5rem;
        border-bottom: 1px solid var(--color-stroke-light);
    }

    .contenedor-manejo-tecnico .grid-cell-4 {
        border-radius: 0 0 1.5rem 0;
    }

    /* --- Sección Productos --- */
    .container-productos .grid-cell-1 {
        border-radius: 1.5rem 0 0 1.5rem;
    }

    .container-productos .grid-cell-2 {
        border-radius: 0;
        border-left: 0;
        border-right: 0;
    }

    .container-productos .grid-cell-3 {
        border-radius: 0 1.5rem 1.5rem 0;
        border-top: 1px solid var(--color-stroke-light);
    }

    /* --- Sección porque elegirnos --- */
    .img-col {
        /* En desktop: sticky para que acompañe el scroll del listado */
        position: sticky;
        top: 1.5rem;
        align-self: flex-start;
        /* necesario para que sticky funcione en flex/grid */
    }

    /* --- FAB --- */
    .whatsapp-fab {
        bottom: 24px;
    }
}

/* --- 992px Small Desktop --- */
@media (min-width: 992px) {

    /* --- Hero image --- */
    .hero-text-block {
        background: transparent;
        position: relative;
        z-index: 1;
    }

    /* La imagen vuelve a ser el fondo absoluto del contenedor */
    .hero-imagen-adaptativa {
        position: absolute;
        top: 0;
        left: 12px;
        width: 98%;
        height: 100%;
        object-fit: cover;
        z-index: 0;
        aspect-ratio: 4/3;
        border-radius: 1.5rem;
    }

    .hero-degradado::after {
        content: '';
        position: absolute;
        inset: 0;
        border-radius: 1.5rem;
        left: 12px;
        background: linear-gradient(to right,
                rgba(0, 0, 0, 0.7) 0%,
                rgba(0, 0, 0, 0.1) 50%,
                rgba(0, 0, 0, 0) 100%);
    }

    .hero-section .hero-title {
        color: var(--color-text-light);
    }

    /* --- sección desafío --- */
    .grid-cell-2 {
        border-radius: 0px;
        border-right: 0px;
    }

    .grid-cell-3 {
        border-radius: 0 1.5rem 0 0;
        border-top: 1px solid var(--color-stroke-light);
        border-bottom: 1px solid var(--color-stroke-light);
    }

    .grid-cell-4 {
        border-radius: 0 0 0 1.5rem;
        border-left: 1px solid var(--color-stroke-light);
    }

    .grid-cell-6 img {
        border-radius: 0px;
    }

    /* --- sección presentación --- */
    .tarjeta-producto:hover .tarjeta-imagen-fondo {
        transform: scale(1.04);
    }

    /* --- sección solución --- */
    .grid-cell-1 {
        border-bottom: 0px;
    }

    /* --- sección semillas --- */
    .seccion-semillas .semillas-logo {
        width: 20%;
    }

    .contenedor-info-minituberculos .grid-cell-1 {
        border-bottom: 1px solid var(--color-stroke-light);
        border-radius: 1.5rem 0 0 1.5rem;
    }

    .contenedor-info-minituberculos .grid-cell-2 {
        border-left: 0px;
        border-radius: 0;
    }

    .contenedor-info-minituberculos .grid-cell-3 {
        border-radius: 0 1.5rem 1.5rem 0;
        border-left: 1px solid var(--color-stroke-light);
    }

    .contenedor-manejo-tecnico .grid-cell-1 {
        border-radius: 1.5rem 0 0 1.5rem;
        border-bottom: 1px solid var(--color-stroke-light);
    }

    .contenedor-manejo-tecnico .grid-cell-3 {
        border-radius: 0px;
        border-right: 0px;
    }

    .contenedor-manejo-tecnico .grid-cell-4 {
        border-top: 1px solid var(--color-stroke-light);
        border-radius: 0 1.5rem 1.5rem 0;
    }

    /* --- Sección Productos --- */
    .tarjeta-catalogo:hover {
        background-color: #062714;
        padding: 0 !important;
        overflow: hidden;
    }

    .tarjeta-catalogo:hover .capa-hover-fondo {
        display: block;
        max-height: 466px;
        height: 25vw;
    }

    .tarjeta-catalogo:hover .contenido-tarjeta-superior {
        padding: 1rem;
    }

    .tarjeta-catalogo:hover .contenedor-bulto-producto {
        display: none;
    }

    .tarjeta-catalogo:hover .contenedor-badges {
        display: none !important;
    }

    .tarjeta-catalogo:hover .lista-beneficios-catalogo {
        display: none !important;
    }

    .tarjeta-catalogo:hover .contenido-tarjeta-superior .card-num,
    .tarjeta-catalogo:hover .contenido-tarjeta-superior h3 {
        color: var(--color-text-light) !important;
    }

    .tarjeta-catalogo:hover .contenido-tarjeta-superior span {
        color: var(--color-brand-primary) !important;
    }

    .tarjeta-catalogo:hover .contenido-tarjeta-inferior {
        margin-top: 0px !important;
        padding: 1rem !important;
    }

    .tarjeta-catalogo:hover .contenido-tarjeta-inferior .icono-descarga-blanco {
        display: block !important;
    }

    .tarjeta-catalogo:hover .contenido-tarjeta-inferior .icono-descarga {
        display: none !important;
    }

    .tarjeta-catalogo:hover .contenido-tarjeta-inferior .enlace-ficha {
        color: var(--color-text-light);
    }

    .tarjeta-catalogo:hover .contenido-tarjeta-inferior .icono-flecha-diagonal-verde {
        display: block !important;
    }

    .tarjeta-catalogo:hover .contenido-tarjeta-inferior .icono-flecha-diagonal {
        display: none !important;
    }

    /* sección testimonios */
    .seccion-testimonios .tarjeta-testimonio-principal {
        border-radius: 1.5rem 0 0 1.5rem;
    }

    .contenedor-test-secundarios {
        border-radius: 0 1.5rem 1.5rem 0;
        border-left: 0px;
        border-top: 1px solid var(--color-stroke-light);
    }

    .tarjeta-reel .cover-reel {
        transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
    }

    .tarjeta-reel:hover .cover-reel {
        transform: scale(1.05);
    }

    /* sección cta */
    .seccion-cta .cta-title {
        font-size: 4.5rem;
    }
}

/* --- 1200px md Desktop --- */
@media (min-width: 1200px) {

    /* --- header/navbar --- */
    .logotipo-empresa {
        max-height: 100px;
    }

    /* --- hero image --- */
    .hero-section {
        min-height: 768px;
    }

    .hero-imagen-adaptativa {
        width: 99%;
    }

    /* --- sección presentación  --- */
    .tarjeta-producto {
        height: 695px;
    }

    /* --- sección solución  --- */
    .contenedor-grid .grid-cell-2 {
        border-bottom: 0px;
    }

    .contenedor-grid .grid-cell-4 {
        border-top: 1px solid var(--color-stroke-light);
    }

    .titulo-producto-plan {
        font-size: 2rem;
    }

    .titulo-producto-plan span {
        font-size: 1.5rem;
    }

    /* --- sección testimonios  --- */
    .seccion-testimonios .tarjeta-testimonio-principal .testimonio-desc,
    .tarjeta-testimonio-secundaria .testimonio-body p {
        font-size: 1.5rem;
    }
}

/* --- 1400px Larger Desktop --- */
@media (min-width: 1400px) {

    /* --- hero image --- */
    .hero-section h1 {
        font-size: 3rem;
    }

    /* --- titulo de secciones --- */
    .seccion-desafio .section-title,
    .seccion-presentacion .section-title,
    .bloque-solucion .section-title,
    .seccion-semillas .section-title,
    .cta-semillas-yc .section-title,
    .seccion-catalogo .section-title,
    .seccion-elegirnos .section-title,
    .seccion-testimonios .section-title,
    .seccion-faq .section-title,
    .seccion-redes .section-title {
        font-size: 3rem;
    }

    /* --- FAB --- */
    .whatsapp-fab {
        bottom: 32px;
    }
}