/*
Theme Name: Biomidas PM
Theme URI: https://biomidas.ec
Author: Biomidas PM / Nutriphos Ecuador
Description: Tema corporativo de Biomidas PM — Sistema Dual GROW + ROOT. Paleta corporativa verde bosque y dorado metálico, optimizado para Elementor.
Version: 1.0.0
Requires at least: 5.9
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: biomidas-pm
*/

/* ==========================================================================
   1. Variables de diseño (paleta corporativa CMYK -> HEX)
   ========================================================================== */
:root {
  --verde-bosque: #135A20;           /* Texto BIOMIDAS: CMYK 85,30,75,50 */
  --verde-azulado-oscuro: #127D47;   /* Icono oscuro: CMYK 90,30,60,30 */
  --verde-azulado-claro: #40E68C;    /* Icono claro: CMYK 75,10,45,0 */
  --dorado-oscuro: #AA9118;          /* Dorado metálico oscuro: CMYK 30,40,90,5 */
  --dorado-claro: #D4AF37;           /* Dorado metálico claro (pantalla) */
  --dorado-suave: #FFE082;

  --verde-fondo: #0B3A16;            /* Fondo oscuro derivado del verde bosque */
  --verde-fondo-2: #07301a;
  --verde-superficie: #0E4B22;

  --bg-light: #F8FAF6;
  --bg-card: #FFFFFF;
  --text-dark: #1A2A1A;
  --text-muted: #5A6E5A;
  --border: #E2E8E0;

  --rojo: #E53E3E;
  --rojo-bg: #FFF5F5;

  --shadow-sm: 0 2px 8px rgba(19,90,32,0.06);
  --shadow-md: 0 8px 24px rgba(19,90,32,0.12);
  --shadow-lg: 0 16px 40px rgba(19,90,32,0.18);

  --radius: 12px;
  --font-heading: 'Montserrat', sans-serif;
  --font-body: 'Roboto', sans-serif;
}

/* ==========================================================================
   2. Base
   ========================================================================== */
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font-body);
  background: var(--bg-light);
  color: var(--text-dark);
  line-height: 1.65;
  font-size: 16px;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); font-weight: 700; color: var(--verde-bosque); line-height: 1.2; }
a { text-decoration: none; color: inherit; }
img { max-width: 100%; height: auto; display: block; }
ul { list-style: none; }

.container { max-width: 1240px; margin: 0 auto; padding: 0 20px; }
.section { padding: 84px 0; }
.section.alt { background: #EEF4EC; }
.section.white { background: #fff; }

/* ==========================================================================
   3. Botones
   ========================================================================== */
.btn { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; padding: 14px 28px; border-radius: 8px; font-size: 1rem; transition: all .25s ease; cursor: pointer; border: 0; font-family: var(--font-heading); }
.btn-gold { background: linear-gradient(135deg, var(--dorado-claro) 0%, var(--dorado-oscuro) 100%); color: var(--verde-fondo); box-shadow: 0 6px 20px rgba(212,175,55,.35); }
.btn-gold:hover { transform: translateY(-3px); box-shadow: 0 10px 25px rgba(212,175,55,.5); color: #000; }
.btn-outline { background: transparent; border: 2px solid rgba(255,255,255,.3); color: #fff; }
.btn-outline:hover { border-color: var(--dorado-claro); color: var(--dorado-claro); }
.btn-green { background: var(--verde-bosque); color: #fff; }
.btn-green:hover { background: var(--verde-azulado-oscuro); transform: translateY(-2px); }

/* ==========================================================================
   4. Barra superior + Header
   ========================================================================== */
.top-bar { background: var(--verde-fondo-2); color: var(--dorado-claro); font-size: .85rem; padding: 8px 0; text-align: center; font-weight: 600; letter-spacing: .5px; }
.top-bar i { margin-right: 6px; }

.site-header { background: var(--verde-bosque); position: sticky; top: 0; z-index: 1000; box-shadow: var(--shadow-md); border-bottom: 2px solid var(--dorado-claro); }
.header-inner { display: flex; justify-content: space-between; align-items: center; padding: 12px 0; gap: 16px; }
.brand { display: flex; align-items: center; gap: 12px; }
.brand img { max-height: 50px; width: auto; }
.brand-text { color: #fff; font-family: var(--font-heading); font-weight: 800; font-size: 1.35rem; letter-spacing: -.5px; }
.brand-text span { color: var(--dorado-claro); }

.main-nav ul { display: flex; gap: 22px; align-items: center; }
.main-nav a { color: #E2EFE9; font-size: .95rem; font-weight: 500; transition: color .2s; }
.main-nav a:hover { color: var(--dorado-claro); }

.btn-header { background: linear-gradient(135deg, var(--dorado-claro) 0%, var(--dorado-oscuro) 100%); color: var(--verde-fondo); font-weight: 700; padding: 10px 18px; border-radius: 50px; display: inline-flex; align-items: center; gap: 8px; box-shadow: 0 4px 12px rgba(212,175,55,.3); white-space: nowrap; }
.btn-header:hover { transform: translateY(-2px); color: #000; }

.nav-toggle { display: none; background: none; border: 0; color: #fff; font-size: 1.6rem; cursor: pointer; }

/* ==========================================================================
   5. Hero
   ========================================================================== */
.hero { background: linear-gradient(145deg, var(--verde-fondo-2) 0%, var(--verde-bosque) 50%, var(--verde-azulado-oscuro) 100%); color: #fff; padding: 70px 0 90px; position: relative; overflow: hidden; }
.hero::before { content: ''; position: absolute; top: -50%; right: -20%; width: 600px; height: 600px; background: radial-gradient(circle, rgba(212,175,55,.14) 0%, rgba(0,0,0,0) 70%); border-radius: 50%; }
.hero-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 50px; align-items: center; position: relative; z-index: 1; }
.hero-badge { display: inline-flex; align-items: center; gap: 8px; background: rgba(212,175,55,.15); border: 1px solid var(--dorado-claro); color: var(--dorado-claro); padding: 6px 16px; border-radius: 50px; font-size: .82rem; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; letter-spacing: 1px; }
.hero h1 { font-size: 2.7rem; color: #fff; margin-bottom: 20px; }
.hero h1 span { background: linear-gradient(120deg, var(--dorado-suave), var(--dorado-claro)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.hero p { font-size: 1.15rem; color: #C8E4D6; margin-bottom: 30px; max-width: 620px; }
.hero-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 35px; }
.stat-card { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); padding: 16px; border-radius: var(--radius); text-align: center; }
.stat-card .number { font-family: var(--font-heading); font-size: 1.7rem; font-weight: 800; color: var(--dorado-claro); display: block; }
.stat-card .label { font-size: .78rem; color: #A9D0BC; text-transform: uppercase; font-weight: 600; }
.hero-ctas { display: flex; gap: 16px; flex-wrap: wrap; }

.products-card-wrapper { background: rgba(255,255,255,.05); border: 1px solid rgba(212,175,55,.3); border-radius: 20px; padding: 25px; backdrop-filter: blur(12px); box-shadow: var(--shadow-lg); text-align: center; position: relative; }
.product-dual-badge { position: absolute; top: -15px; left: 50%; transform: translateX(-50%); background: var(--dorado-claro); color: var(--verde-fondo); padding: 8px 20px; border-radius: 50px; font-weight: 800; font-size: .82rem; box-shadow: 0 4px 15px rgba(0,0,0,.3); text-transform: uppercase; white-space: nowrap; }
.dual-images { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-top: 15px; }
.prod-box { background: rgba(0,0,0,.2); border-radius: 12px; padding: 15px; border: 1px solid rgba(255,255,255,.1); transition: transform .3s; }
.prod-box:hover { transform: translateY(-5px); border-color: var(--dorado-claro); }
.prod-box img { width: 100%; height: 170px; object-fit: contain; filter: drop-shadow(0 8px 12px rgba(0,0,0,.4)); }
.prod-box h4 { color: var(--dorado-claro); font-size: 1.1rem; margin-top: 10px; }
.prod-box span { font-size: .75rem; color: #A9D0BC; }

/* ==========================================================================
   6. Encabezados de sección
   ========================================================================== */
.section-header { text-align: center; max-width: 760px; margin: 0 auto 50px; }
.section-subtitle { color: var(--dorado-oscuro); font-weight: 700; text-transform: uppercase; font-size: .82rem; letter-spacing: 1.5px; display: block; margin-bottom: 8px; }
.section-title { font-size: 2.15rem; color: var(--verde-bosque); margin-bottom: 15px; }
.section-desc { color: var(--text-muted); font-size: 1.05rem; }

/* ==========================================================================
   7. Selector de perfil (tabs)
   ========================================================================== */
.profile-tabs { display: flex; justify-content: center; gap: 15px; margin-bottom: 35px; flex-wrap: wrap; }
.profile-tab-btn { background: var(--bg-light); border: 2px solid var(--border); padding: 14px 26px; border-radius: 50px; font-weight: 700; font-size: .95rem; color: var(--text-dark); cursor: pointer; transition: all .25s; display: flex; align-items: center; gap: 10px; font-family: var(--font-heading); }
.profile-tab-btn:hover { border-color: var(--verde-azulado-oscuro); color: var(--verde-bosque); }
.profile-tab-btn.active { background: var(--verde-bosque); color: #fff; border-color: var(--verde-bosque); box-shadow: var(--shadow-md); }
.profile-tab-btn.active i { color: var(--dorado-claro); }
.profile-panel { display: none; }
.profile-panel.active { display: block; }
.profile-content-card { background: linear-gradient(135deg, #F9FBF8 0%, #EFF5ED 100%); border: 2px solid #D8E5D5; border-radius: 16px; padding: 35px; box-shadow: var(--shadow-sm); }
.profile-content-grid { display: grid; grid-template-columns: 1.3fr .7fr; gap: 35px; align-items: center; }
.profile-content-text h3 { font-size: 1.55rem; margin-bottom: 12px; }
.profile-bullets { margin-top: 20px; }
.profile-bullets li { margin-bottom: 13px; display: flex; align-items: flex-start; gap: 12px; font-size: 1rem; }
.profile-bullets i { color: var(--verde-azulado-oscuro); font-size: 1.2rem; margin-top: 3px; flex-shrink: 0; }

/* ==========================================================================
   8. Sistema dual / tarjetas de producto
   ========================================================================== */
.dual-hub-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.product-card { background: var(--bg-card); border-radius: 16px; border: 1px solid var(--border); overflow: hidden; box-shadow: var(--shadow-sm); transition: transform .3s, box-shadow .3s; display: flex; flex-direction: column; }
.product-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); border-color: var(--dorado-claro); }
.card-head { padding: 25px; color: #fff; position: relative; }
.card-head.root-bg { background: linear-gradient(135deg, var(--verde-bosque) 0%, var(--verde-azulado-oscuro) 100%); }
.card-head.grow-bg { background: linear-gradient(135deg, var(--verde-bosque) 0%, #2E7D32 100%); }
.card-tag { position: absolute; top: 20px; right: 20px; background: var(--dorado-claro); color: var(--verde-fondo); font-weight: 800; font-size: .72rem; padding: 4px 12px; border-radius: 50px; text-transform: uppercase; }
.card-head h3 { font-size: 1.8rem; margin-bottom: 5px; color: #fff; }
.card-head p { font-size: .9rem; opacity: .9; }
.card-body { padding: 28px; flex-grow: 1; display: flex; flex-direction: column; }
.card-image-wrap { text-align: center; margin-bottom: 18px; background: #F4F8F4; padding: 15px; border-radius: 12px; }
.card-image-wrap img { max-height: 170px; object-fit: contain; margin: 0 auto; }

.comp-table { width: 100%; border-collapse: collapse; margin: 15px 0; font-size: .88rem; }
.comp-table td { padding: 8px 10px; border-bottom: 1px solid var(--border); }
.comp-table td:first-child { font-weight: 700; color: var(--verde-bosque); width: 42%; }

.hack-box { background: #FFFDF3; border: 1px solid var(--dorado-suave); border-left: 4px solid var(--dorado-claro); padding: 16px; border-radius: 8px; margin-top: auto; font-size: .9rem; }
.hack-box strong { color: #8C6D00; display: block; margin-bottom: 5px; font-family: var(--font-heading); }
.hack-box strong i { color: var(--dorado-oscuro); margin-right: 5px; }

/* ==========================================================================
   9. Hub de cultivos
   ========================================================================== */
.crop-filters { display: flex; justify-content: center; gap: 10px; margin-bottom: 30px; flex-wrap: wrap; }
.filter-btn { background: #fff; border: 1px solid #CBDBC7; padding: 10px 20px; border-radius: 8px; font-weight: 700; color: var(--text-dark); cursor: pointer; transition: all .2s; font-family: var(--font-heading); font-size: .9rem; }
.filter-btn.active { background: var(--verde-bosque); color: var(--dorado-claro); border-color: var(--verde-bosque); }

.crops-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.crop-card { background: #fff; border-radius: 14px; overflow: hidden; border: 1px solid var(--border); box-shadow: var(--shadow-sm); transition: transform .3s, box-shadow .3s; display: flex; flex-direction: column; }
.crop-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); border-color: var(--dorado-claro); }
.crop-card-media { height: 130px; background: linear-gradient(135deg, var(--verde-bosque), var(--verde-azulado-oscuro)); display: flex; align-items: center; justify-content: center; font-size: 3rem; }
.crop-card-body { padding: 18px; flex-grow: 1; display: flex; flex-direction: column; }
.crop-card-body h3 { font-size: 1.15rem; margin-bottom: 4px; }
.crop-region { font-size: .8rem; color: var(--text-muted); margin-bottom: 10px; }
.crop-result { font-size: .85rem; color: var(--verde-azulado-oscuro); font-weight: 600; margin-bottom: 14px; }
.crop-card .btn { justify-content: center; font-size: .85rem; padding: 10px 16px; }

/* Detalle de cultivo (single) */
.crop-hero { background: linear-gradient(145deg, var(--verde-fondo-2), var(--verde-bosque)); color: #fff; padding: 60px 0; }
.crop-hero h1 { color: #fff; font-size: 2.4rem; margin-bottom: 8px; }
.crop-hero .crop-region { color: var(--dorado-claro); font-weight: 700; font-size: 1rem; }
.crop-layout { display: grid; grid-template-columns: 1.3fr .7fr; gap: 35px; align-items: start; }
.crop-problem-box { background: var(--rojo-bg); border-left: 4px solid var(--rojo); padding: 18px; border-radius: 8px; margin-bottom: 15px; }
.crop-problem-box strong { color: #C53030; display: block; margin-bottom: 5px; }
.crop-solution-box { background: #F0FFF4; border-left: 4px solid var(--verde-azulado-oscuro); padding: 18px; border-radius: 8px; }
.crop-solution-box strong { color: #276749; display: block; margin-bottom: 5px; }
.result-card { background: #fff; border: 1px solid var(--dorado-claro); border-radius: 12px; padding: 22px; text-align: center; box-shadow: var(--shadow-md); }
.result-card .big-num { font-family: var(--font-heading); font-size: 2rem; font-weight: 800; color: var(--dorado-oscuro); display: block; margin: 8px 0; }
.dose-card { background: #F8FAF6; padding: 24px; border-radius: 12px; border: 1px solid var(--border); }
.dose-card h4 { margin-bottom: 12px; }
.dose-line { background: #fff; padding: 14px; border-radius: 8px; border-left: 4px solid var(--dorado-claro); margin-bottom: 10px; font-size: .95rem; }

/* Acordeón por perfil dentro del cultivo */
.audience-acc { margin-top: 8px; }
.audience-acc details { background: #fff; border: 1px solid var(--border); border-radius: 10px; margin-bottom: 10px; overflow: hidden; }
.audience-acc summary { padding: 16px 20px; font-weight: 700; cursor: pointer; font-family: var(--font-heading); color: var(--verde-bosque); display: flex; justify-content: space-between; align-items: center; }
.audience-acc summary i { color: var(--dorado-oscuro); margin-right: 8px; }
.audience-acc .acc-body { padding: 0 20px 18px; color: var(--text-muted); font-size: .95rem; }

/* ==========================================================================
   10. Tabla comparativa
   ========================================================================== */
.matrix-table { width: 100%; border-collapse: collapse; background: #fff; box-shadow: var(--shadow-sm); border-radius: 12px; overflow: hidden; }
.matrix-table th { background: var(--verde-bosque); color: #fff; padding: 16px; text-align: left; font-family: var(--font-heading); font-size: .95rem; }
.matrix-table th.highlight { background: var(--verde-azulado-oscuro); color: var(--dorado-claro); text-align: center; }
.matrix-table td { padding: 14px 16px; border-bottom: 1px solid var(--border); font-size: .9rem; }
.matrix-table td.highlight { background: #F2F8F4; text-align: center; font-weight: 700; color: var(--verde-bosque); }
.matrix-table tr:hover td { background-color: #FAFDFB; }

/* ==========================================================================
   11. Calculadora ROI
   ========================================================================== */
.calculator-section { background: linear-gradient(135deg, var(--verde-fondo-2) 0%, var(--verde-bosque) 100%); color: #fff; border-radius: 24px; padding: 50px; box-shadow: var(--shadow-lg); }
.calc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.calc-form { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.15); padding: 30px; border-radius: 16px; }
.form-group { margin-bottom: 20px; }
.form-group label { display: block; font-weight: 600; margin-bottom: 8px; color: #C8E4D6; font-size: .95rem; }
.form-control { width: 100%; padding: 12px 16px; border-radius: 8px; border: 1px solid rgba(255,255,255,.2); background: rgba(0,0,0,.2); color: #fff; font-size: 1rem; font-family: inherit; }
.form-control option { background: var(--verde-fondo); color: #fff; }
input[type=range].form-control { padding: 0; border: 0; background: transparent; accent-color: var(--dorado-claro); }
.calc-results { background: rgba(212,175,55,.1); border: 1px solid var(--dorado-claro); border-radius: 16px; padding: 30px; text-align: center; }
.calc-results .big-num { font-family: var(--font-heading); font-size: 2.7rem; font-weight: 800; color: var(--dorado-claro); display: block; margin: 10px 0; }

/* ==========================================================================
   12. Testimonios
   ========================================================================== */
.testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; }
.testi-card { background: #fff; border-radius: 12px; padding: 25px; box-shadow: var(--shadow-sm); border: 1px solid var(--border); display: flex; flex-direction: column; justify-content: space-between; }
.testi-metric { display: inline-block; background: #FFFDF3; color: var(--dorado-oscuro); font-weight: 800; padding: 4px 12px; border-radius: 50px; font-size: .82rem; margin-bottom: 12px; align-self: flex-start; border: 1px solid var(--dorado-suave); }
.testi-card p { font-style: italic; color: #334433; margin-bottom: 20px; font-size: .95rem; }
.testi-author { display: flex; align-items: center; gap: 12px; border-top: 1px solid var(--border); padding-top: 15px; }
.testi-avatar { width: 44px; height: 44px; background: var(--verde-azulado-oscuro); color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 700; flex-shrink: 0; }
.testi-info h5 { color: var(--verde-bosque); font-size: .95rem; }
.testi-info span { font-size: .8rem; color: var(--text-muted); }

/* ==========================================================================
   13. Glosario (tooltips)
   ========================================================================== */
.glossary-term { color: var(--verde-azulado-oscuro); font-weight: 600; border-bottom: 1px dashed var(--dorado-oscuro); cursor: help; position: relative; }
.glossary-term:hover::after { content: attr(data-def); position: absolute; bottom: calc(100% + 8px); left: 0; width: 240px; background: var(--verde-fondo); color: #fff; padding: 10px 12px; border-radius: 8px; font-size: .82rem; font-weight: 400; line-height: 1.4; z-index: 50; box-shadow: var(--shadow-md); }
.glossary-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.glossary-item { background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 16px; }
.glossary-item h4 { font-size: 1rem; margin-bottom: 5px; }
.glossary-item p { font-size: .88rem; color: var(--text-muted); }

/* ==========================================================================
   14. Footer
   ========================================================================== */
.site-footer { background: var(--verde-fondo-2); color: #A9D0BC; padding: 60px 0 30px; border-top: 3px solid var(--dorado-claro); }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 40px; margin-bottom: 40px; }
.footer-col h4 { color: #fff; font-size: 1.1rem; margin-bottom: 18px; position: relative; }
.footer-col h4::after { content: ''; position: absolute; bottom: -6px; left: 0; width: 30px; height: 2px; background: var(--dorado-claro); }
.footer-col li { margin-bottom: 10px; font-size: .9rem; }
.footer-col a { color: #A9D0BC; transition: color .2s; }
.footer-col a:hover { color: var(--dorado-claro); }
.footer-col i { margin-right: 6px; color: var(--dorado-claro); width: 16px; }
.copyright { text-align: center; padding-top: 25px; border-top: 1px solid rgba(255,255,255,.08); font-size: .85rem; }

/* WhatsApp FAB */
.whatsapp-fab { position: fixed; bottom: 25px; right: 25px; background: #25D366; color: #fff; width: 60px; height: 60px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 32px; box-shadow: 0 8px 24px rgba(37,211,102,.4); z-index: 2000; transition: transform .3s; }
.whatsapp-fab:hover { transform: scale(1.1); color: #fff; }

/* ==========================================================================
   15. Contenido WordPress / utilidades
   ========================================================================== */
.entry-content { max-width: 780px; margin: 0 auto; }
.entry-content h2, .entry-content h3 { margin: 1.5em 0 .5em; }
.entry-content p, .entry-content ul { margin-bottom: 1.1em; }
.entry-content ul { list-style: disc; padding-left: 1.3em; }
.page-hero { background: linear-gradient(145deg, var(--verde-fondo-2), var(--verde-bosque)); color: #fff; padding: 70px 0; text-align: center; }
.page-hero h1 { color: #fff; font-size: 2.4rem; margin-bottom: 10px; }
.page-hero p { color: #C8E4D6; font-size: 1.1rem; max-width: 640px; margin: 0 auto; }
.breadcrumbs { font-size: .85rem; color: var(--text-muted); padding: 16px 0; }
.breadcrumbs a { color: var(--verde-azulado-oscuro); }
.breadcrumbs a:hover { color: var(--dorado-oscuro); }
.pdf-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.pdf-item { background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 16px; display: flex; align-items: center; gap: 12px; transition: all .2s; }
.pdf-item:hover { border-color: var(--dorado-claro); box-shadow: var(--shadow-sm); }
.pdf-item i { color: var(--rojo); font-size: 1.5rem; }

/* ==========================================================================
   16. Responsive
   ========================================================================== */
@media (max-width: 1024px) {
  .crops-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
  .hero-grid, .profile-content-grid, .dual-hub-grid, .calc-grid, .crop-layout { grid-template-columns: 1fr; }
  .testimonials-grid, .glossary-list { grid-template-columns: 1fr; }
  .hero h1 { font-size: 2.1rem; }
  .main-nav { display: none; position: absolute; top: 100%; left: 0; right: 0; background: var(--verde-bosque); padding: 16px 20px; border-top: 1px solid rgba(255,255,255,.1); }
  .main-nav.open { display: block; }
  .main-nav ul { flex-direction: column; align-items: flex-start; gap: 14px; }
  .nav-toggle { display: block; }
  .btn-header { display: none; }
  .crop-filters { justify-content: flex-start; }
}
@media (max-width: 520px) {
  .hero-stats { grid-template-columns: 1fr; }
  .crops-grid, .pdf-list { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; }
  .dual-images { grid-template-columns: 1fr; }
  .calculator-section { padding: 26px; }
}