
/* ==================================================
   COMPONENTES INTERIORES COMPARTIDOS
================================================== */

/* HERO INTERIOR */
.inner-hero {
    padding: 190px 0 110px;
    background: linear-gradient(125deg,#102e20,#275c35);
    color: #fff;
}

.inner-hero .container {
    max-width: 1150px;
}

.inner-kicker {
    font-size: 12px;
    letter-spacing: .22em;
    font-weight: 800;
    text-transform: uppercase;
    color: #a9d57a;
}

.inner-hero h1 {
    font: 800 clamp(42px,6.5vw,86px)/1.07 Manrope,sans-serif;
    letter-spacing: -.05em;
    max-width: 930px;
    margin: 18px 0;
}

.inner-hero p:not(.inner-kicker) {
    max-width: 690px;
    line-height: 1.7;
    font-size: clamp(16px,2vw,21px);
    color: #e1eae0;
}


/* ==================================================
   SECCIONES INTERIORES
================================================== */

.inner-section {
    padding: 95px 0;
    background: #f7f9f4;
}

.inner-section.alt {
    background: #fff;
}

.inner-heading {
    max-width: 760px;
    margin-bottom: 38px;
}

.inner-heading h2 {
    font: 800 clamp(30px,4vw,50px)/1.15 Manrope,sans-serif;
    letter-spacing: -.04em;
    color: #193d28;
}

.inner-heading p {
    line-height: 1.8;
    color: #526355;
}


/* ==================================================
   TARJETAS Y GRID
================================================== */

.inner-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 20px;
}

.inner-card {
    background: white;
    border: 1px solid #e4e9df;
    border-radius: 18px;
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-height: 235px;
}

.inner-card h3 {
    font: 800 23px/1.25 Manrope,sans-serif;
    color: #183d27;
    margin: 0;
}

.inner-card p {
    line-height: 1.65;
    color: #5b695e;
    margin: 0;
}

.inner-card a {
    margin-top: auto;
    font-weight: 800;
    color: #376f3e;
    text-decoration: none;
}

.inner-card small {
    color: #68816b;
    font-weight: 700;
}

.inner-card .inner-placeholder {
    min-height: 135px;
    margin: -10px -10px 8px;
}


/* ==================================================
   LLAMADO A LA ACCIÓN
================================================== */

.inner-cta {
    background: #1b3024;
    color: white;
    padding: 70px 0;
}

.inner-cta-grid {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 35px;
}

.inner-cta h2 {
    font: 800 clamp(26px,3.8vw,44px)/1.18 Manrope,sans-serif;
    max-width: 650px;
}

.inner-cta p:not(.inner-kicker) {
    color: #c8d9cb;
    line-height: 1.7;
}


/* ==================================================
   NAVEGACIÓN / BREADCRUMB
================================================== */

.inner-breadcrumb {
    font-size: 14px;
    color: #56715b;
    margin-bottom: 30px;
}

.inner-breadcrumb a {
    color: #27663c;
}


/* ==================================================
   DETALLE DE PRODUCTOS
================================================== */

.inner-detail {
    background: #fff;
    border-radius: 22px;
    padding: 35px;
    border: 1px solid #e4e9df;
}

.inner-detail h2 {
    color: #183d27;
}

.inner-detail p {
    line-height: 1.85;
}

.inner-detail ul {
    line-height: 1.9;
}

.inner-note {
    border-left: 4px solid #83b954;
    background: #eef4e9;
    padding: 20px 24px;
    border-radius: 0 12px 12px 0;
}

.inner-product-image {
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: 18px;
    background: #f2f4ee;
}

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


/* ==================================================
   PLACEHOLDERS / IMÁGENES PENDIENTES
================================================== */

.inner-placeholder {
    border: 2px dashed #c8d9c6;
    border-radius: 20px;
    min-height: 260px;
    display: grid;
    place-items: center;
    color: #65836b;
    text-align: center;
    padding: 20px;
    background: #edf2e9;
}


/* ==================================================
   DISTRIBUCIÓN EN DOS COLUMNAS
================================================== */

.inner-two {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 35px;
    align-items: center;
}


/* ==================================================
   ETIQUETAS
================================================== */

.inner-tags {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.inner-tags span {
    padding: 9px 14px;
    border-radius: 100px;
    background: #e6eee2;
    color: #315c38;
    font-size: 13px;
    font-weight: 700;
}


/* ==================================================
   FORMULARIOS
================================================== */

.inner-form {
    display: grid;
    gap: 15px;
    max-width: 650px;
}

.inner-form label {
    font-weight: 700;
    color: #25442d;
}

.inner-form input,
.inner-form textarea {
    display: block;
    width: 100%;
    padding: 13px 15px;
    border: 1px solid #b9c8b8;
    border-radius: 10px;
    font: inherit;
    margin-top: 7px;
}

.inner-form textarea {
    min-height: 135px;
}

.inner-muted {
    color: #657568;
}


/* ==================================================
   HERO FOTOGRÁFICO
================================================== */

.inner-hero.inner-hero-photo {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: #153d20;
}

.inner-hero-photo .inner-hero-background {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

.inner-hero-photo .inner-hero-background img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.inner-hero-photo .inner-hero-background::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(10,35,18,.84), rgba(10,35,18,.28));
}

.inner-hero-photo > .container {
    position: relative;
    z-index: 1;
}

.inner-hero-photo h1,
.inner-hero-photo p {
    color: #fff;
}


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

@media (max-width: 800px) {

    .inner-grid {
        grid-template-columns: 1fr 1fr;
    }

    .inner-two {
        grid-template-columns: 1fr;
    }

    .inner-cta-grid {
        align-items: flex-start;
        flex-direction: column;
    }

    .inner-hero {
        padding: 150px 0 80px;
    }
}


/* ==================================================
   RESPONSIVE / MÓVIL
================================================== */

@media (max-width: 560px) {

    .inner-grid {
        grid-template-columns: 1fr;
    }

    .inner-section {
        padding: 60px 0;
    }

    .inner-card {
        min-height: unset;
    }

    .inner-detail {
        padding: 22px;
    }
}

@media (max-width: 767px) {

    .inner-hero.inner-hero-photo {
        background-position: center;
    }
}

/* Tarjetas de categorías y productos: esquinas discretas */
.inner-grid .inner-card, .inner-grid .inner-card-image,
.inner-grid .inner-product-image, .inner-grid .inner-product-image img,
.inner-grid .inner-card-image img { border-radius: 2px !important; }

/* Enlaces visuales y esquinas discretas en tarjetas */
.inner-grid .inner-card, .inner-grid .inner-placeholder,
.inner-grid .inner-card-image, .inner-grid .inner-product-image,
.inner-grid .inner-card-image img, .inner-grid .inner-product-image img { border-radius: 2px !important; }
.inner-grid .inner-image-link { display:block; width:100%; aspect-ratio:4/3; overflow:hidden; flex-shrink:0; margin-top:0; }
.inner-grid .inner-image-link img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .45s ease; }
@media (hover:hover) { .inner-grid .inner-image-link:hover img { transform:scale(1.035); } }
.inner-grid .inner-image-link:focus-visible { outline:3px solid #78b525; outline-offset:3px; }
/* Ajustes para anchos pequeños */
.inner-grid > *, .inner-two > * { min-width:0; }
.inner-card { overflow-wrap:anywhere; }
@media(max-width:767px) {
  .inner-hero { padding-top:140px; padding-bottom:65px; }
  .inner-hero h1 { font-size:clamp(34px,9vw,58px); overflow-wrap:break-word; }
  .inner-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:600px) {
  .inner-grid { grid-template-columns:minmax(0,1fr); }
  .inner-card { padding:20px; }
  .inner-section { padding:55px 0; }
}
@media(prefers-reduced-motion:reduce) { .inner-grid .inner-image-link img { transition:none; } }

/* Fichas técnicas individuales: estilos reutilizables */
.ficha-extra { margin-top: clamp(36px, 5vw, 70px); padding-top: 30px; border-top: 1px solid #dfe6da; }
.ficha-extra > h2 { font-size: clamp(25px, 3vw, 36px); line-height: 1.2; }
.ficha-extra-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 25px 0; }
.ficha-extra-grid article { padding: 22px; background: #f6f8f2; border: 1px solid #e2e9df; border-radius: 2px; }
.ficha-extra-grid h3 { margin: 0 0 10px; font-size: 18px; }
.ficha-extra-grid p { margin: 0; line-height: 1.7; }
@media (max-width: 650px) { .ficha-extra-grid { grid-template-columns: 1fr; } .ficha-extra-grid article { padding: 18px; } }


/* Fichas independientes de forrajes conservados */
.eco-category-intro{max-width:900px;margin:0 0 32px;line-height:1.75}
.eco-category-intro h3{color:#173e29;font-size:clamp(1.25rem,2vw,1.75rem);margin-bottom:12px}
.eco-ficha-ampliada{margin-top:55px;padding-top:32px;border-top:1px solid #dce5d8}
.eco-ficha-ampliada h2{font-size:clamp(1.6rem,3vw,2.5rem);color:#173e29;margin:10px 0 18px}
.eco-ficha-ampliada h3{color:#173e29;margin:22px 0 12px}
.eco-ficha-lead{max-width:920px;line-height:1.8}
.eco-ficha-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:26px 0}
.eco-ficha-columns article{border:1px solid #e0e8db;border-radius:2px;padding:24px;background:#fafbf8}
.eco-ficha-columns ul{padding-left:20px;line-height:1.8}
.eco-ficha-columns li+li{margin-top:10px}
.eco-table-wrap{max-width:960px;overflow-x:auto}
.eco-tech-table{width:100%;border-collapse:collapse;line-height:1.6}
.eco-tech-table th,.eco-tech-table td{text-align:left;padding:15px;border-bottom:1px solid #e1e8dd;vertical-align:top}
.eco-tech-table th{width:30%;color:#173e29}
.eco-source-note{font-size:.85rem;color:#647467;line-height:1.6;margin-top:24px}
@media(max-width:700px){.eco-ficha-columns{grid-template-columns:1fr;gap:14px}.eco-ficha-columns article{padding:18px}.eco-tech-table th{width:38%}.eco-tech-table th,.eco-tech-table td{padding:12px 8px}}
