/* ═══════════════════════════════════════════════
   INDEX.CSS — Diseñoverde
   Estilos EXCLUSIVOS de la portada (index.html):
   #hero, #metodologia, #trabajo, #siembra-idea,
   #estudio, #contacto y sus media queries.
   Requiere base.css cargado ANTES que esta hoja.
   Tokens, reset, nav, footer, botones y .reveal
   viven en base.css — no se redefinen aquí.
   ═══════════════════════════════════════════════ */

/* ── HERO ── */
#hero { min-height:100vh; background:var(--verde-oscuro); display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; padding:120px 48px 80px; position:relative; overflow:hidden; }
#hero::before { content:''; position:absolute; top:-300px; right:-200px; width:700px; height:700px; border-radius:50%; background:radial-gradient(circle, rgba(82,168,76,0.12) 0%, transparent 65%); pointer-events:none; }
#hero::after { content:''; position:absolute; bottom:-200px; left:15%; width:500px; height:500px; border-radius:50%; background:radial-gradient(circle, rgba(82,168,76,0.07) 0%, transparent 65%); pointer-events:none; }
.hero-left { position:relative; z-index:2; }
.hero-h1 { font-size:62px; font-weight:800; color:var(--blanco); line-height:1.04; letter-spacing:-2.5px; animation:fadeUp .9s ease .2s both; }
.hero-h1 .ghost { font-weight:200; color:rgba(255,255,255,0.45); display:block; }
.hero-h1 .cultivar { color:var(--acento); }
.hero-body { font-size:17px; font-weight:300; color:rgba(255,255,255,0.62); line-height:1.9; margin:38px 0 44px; max-width:420px; animation:fadeUp .9s ease .45s both; }
.hero-ctas { display:flex; gap:14px; align-items:center; animation:fadeUp .9s ease .65s both; }
.hero-visual { position:relative; z-index:2; height:520px; border-radius:var(--radio-hoja); overflow:hidden; background:rgba(255,255,255,0.03); border:1px solid rgba(82,168,76,0.18); display:flex; align-items:center; justify-content:center; animation:fadeIn 1.2s ease .3s both; }
/* ── METODOLOGÍA ── */
#metodologia { background:var(--fondo); padding:120px 48px; position:relative; overflow:hidden; }
#metodologia::before { content:''; position:absolute; inset:0; background-image:radial-gradient(circle 1.5px at 1px 1px, rgba(48,102,45,0.08) 0%, transparent 100%); background-size:48px 48px; pointer-events:none; }
/* HERO METODOLOGÍA */
.met-hero { display:flex; flex-direction:column; align-items:center; text-align:center; gap:32px; margin-bottom:80px; position:relative; z-index:2; }
/* SEMILLA */
.semilla-wrap { position:relative; width:220px; height:220px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
@keyframes halo {
  0%   {
    transform:scale(1);
    opacity:.65;
    box-shadow: 0 0 18px 9px rgba(82,168,76,0.28),
                inset 0 0 12px 5px rgba(82,168,76,0.14);
  }
  65%  {
    opacity:.08;
    box-shadow: 0 0 12px 6px rgba(82,168,76,0.06),
                inset 0 0 0 0 rgba(82,168,76,0);
  }
  100% {
    transform:scale(1.9);
    opacity:0;
    box-shadow: 0 0 0 0 rgba(82,168,76,0),
                inset 0 0 0 0 rgba(82,168,76,0);
  }
}
.semilla-anillo {
  position:absolute; border-radius:50%;
  width:108px; height:108px;
  background:transparent;
  border:1px solid rgba(82,168,76,0.32);
  box-shadow: 0 0 18px 9px rgba(82,168,76,0.28),
              inset 0 0 12px 5px rgba(82,168,76,0.14);
  animation:halo 5s ease-in-out infinite;
}
.semilla-anillo-1 { animation-delay:0s; }
.semilla-anillo-2 { animation-delay:1.25s; }
.semilla-anillo-3 { animation-delay:2.5s; }
.semilla-anillo-4 { animation-delay:3.75s; }
.semilla-circulo { width:100px; height:100px; border-radius:50%; overflow:hidden; position:relative; z-index:2; border:2px solid rgba(48,102,45,0.2); background:var(--verde-oscuro); flex-shrink:0; }
.semilla-img { width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
/* TEXTO HERO MET */
.met-hero-texto { display:flex; flex-direction:column; align-items:center; }
.met-titulo { font-size:58px; font-weight:800; color:var(--verde-oscuro); letter-spacing:-2.5px; line-height:1.0; margin-bottom:36px; }
.met-bajada { font-size:29px; font-weight:100; color:var(--texto); line-height:1.45; max-width:560px; margin:0 auto 36px; }
.met-descripcion { font-size:18px; font-weight:300; color:var(--texto); line-height:1.6; text-align:left; width:100%; max-width:560px; margin:0 auto; }
.met-descripcion strong { font-weight:700; color:var(--texto); }
/* ACORDEÓN */
.acordeon { position:relative; z-index:2; border-top:1px solid var(--gris-2); }
.acord-item { border-bottom:1px solid var(--gris-2); }
.acord-header { width:100%; background:none; border:none; cursor:pointer; padding:36px 0; display:flex; align-items:center; justify-content:space-between; gap:40px; font-family:inherit; text-align:left; transition:background .15s; }
.acord-header:hover .acord-nombre { color:var(--acento); }
.acord-left { display:flex; align-items:center; gap:32px; }
.acord-num { font-size:12px; font-weight:300; letter-spacing:4px; color:var(--gris-3); width:28px; flex-shrink:0; }
.acord-titles { display:flex; flex-direction:column; gap:4px; }
.acord-etapa { font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:3px; color:var(--verde); }
.acord-nombre { font-size:28px; font-weight:800; color:var(--texto); letter-spacing:-0.8px; line-height:1; transition:color .2s; }
.acord-right { display:flex; align-items:center; gap:24px; flex-shrink:0; }
.acord-resumen { font-size:15px; font-weight:400; color:var(--gris-4); font-style:italic; max-width:280px; text-align:right; transition:opacity .2s; }
.acord-icon { width:36px; height:36px; border-radius:50%; border:1px solid var(--gris-2); display:flex; align-items:center; justify-content:center; font-size:18px; font-weight:300; color:var(--gris-4); flex-shrink:0; transition:all .25s; }
.acord-item.open .acord-icon { background:var(--verde); border-color:var(--verde); color:var(--blanco); transform:rotate(45deg); }
.acord-item.open .acord-resumen { opacity:0; }
.acord-item.open .acord-nombre { color:var(--verde); }
.acord-body { max-height:0; overflow:hidden; transition:max-height .45s cubic-bezier(0.4,0,0.2,1); }
.acord-item.open .acord-body { max-height:400px; }
.acord-content { display:grid; grid-template-columns:1fr auto; gap:60px; padding:0 0 48px 60px; align-items:start; }
.acord-col-texto p { font-size:17px; font-weight:300; color:var(--texto); line-height:1.9; }
.acord-col-texto p + p { margin-top:14px; }
.acord-col-tags { display:flex; flex-direction:column; gap:8px; padding-top:4px; }
.acord-tag { font-size:11px; font-weight:400; letter-spacing:0.5px; color:var(--verde); background:rgba(48,102,45,0.07); border:1px solid rgba(48,102,45,0.15); padding:8px 16px; border-radius:999px; white-space:nowrap; text-align:center; }
.met-puente { margin-top:72px; padding-top:56px; display:flex; align-items:center; justify-content:center; gap:32px; position:relative; z-index:2; }
.met-puente p { font-size:20px; font-weight:400; font-style:italic; color:var(--texto); line-height:1.65; }
/* ── TRABAJO ── */
#trabajo { background:var(--blanco); padding:0 48px 120px; position:relative; }
.trabajo-header {
  background:linear-gradient(to bottom, rgba(15,42,13,0.92) 0%, rgba(15,42,13,0.6) 50%, var(--blanco) 100%),
             url('../img/header-trabajo.raices.jpg') center/cover no-repeat;
  margin:0 -48px;
  padding:80px 48px 120px;
}
.trabajo-intro { max-width:780px; }
.trabajo-intro h2 { font-size:40px; font-weight:800; color:var(--blanco); letter-spacing:-1.5px; line-height:1.1; margin-top:10px; white-space:nowrap; }
.trabajo-intro p { font-size:16px; font-weight:300; color:rgba(255,255,255,0.65); line-height:1.9; margin-top:25px; }
.trabajo-stats {
  display:flex; gap:0;
  margin-top:32px;
  background:rgba(255,255,255,0.92);
  border-radius:var(--radio-hoja);
  overflow:hidden;
  display:inline-flex;
}
.trabajo-stat {
  padding:20px 36px;
  border-right:1px solid var(--gris-1);
}
.trabajo-stat:last-child { border-right:none; }
.trabajo-stat-num { font-size:32px; font-weight:800; color:var(--verde-oscuro); letter-spacing:-1px; line-height:1; }
.trabajo-stat-label { font-size:12px; font-weight:300; color:var(--gris-4); margin-top:4px; letter-spacing:0.5px; }
.caso { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; padding:72px 0; border-top:1px solid var(--gris-1); }
.caso:nth-child(even) .caso-visual { order:-1; }
.caso-tag { display:inline-flex; align-items:center; font-size:10px; font-weight:500; text-transform:uppercase; letter-spacing:2.5px; color:var(--verde); border:1px solid rgba(48,102,45,0.25); padding:4px 10px; border-radius:999px; margin-bottom:16px; }
.caso-mirada { font-size:32px; font-weight:800; color:var(--verde-oscuro); letter-spacing:-0.8px; line-height:1.12; margin-bottom:10px; }
.caso-mirada .light { font-weight:200; color:var(--gris-3); }
.caso-desc { font-size:15px; font-weight:300; color:var(--texto); line-height:1.9; margin-bottom:28px; }
.caso-link { display:inline-flex; align-items:center; gap:10px; font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:2px; color:var(--verde); border-bottom:2px solid rgba(48,102,45,0.35); padding-bottom:4px; transition:gap .2s, border-color .2s; }
.caso-link:hover { gap:16px; border-color:var(--verde); }
.caso-link::after { content:'→'; }
.caso-visual { height:380px; background:var(--gris-1); border-radius:var(--radio-hoja); overflow:hidden; position:relative; transition:transform .3s; display:block; }
.caso-visual:hover { transform:scale(1.01); }
.caso-visual img { width:100%; height:100%; object-fit:cover; display:block; }
/* ── OTROS CULTIVOS GRILLA ── */
.otros-cultivos-grilla { padding:80px 0 0; border-top:1px solid var(--gris-1); }
.oc-titulo { font-size:12px; font-weight:300; text-transform:uppercase; letter-spacing:4px; color:var(--gris-3); margin-bottom:28px; }
.oc-grilla { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:12px; }
.oc-card { position:relative; height:200px; border-radius:var(--radio-hoja); overflow:hidden; }
.oc-overlay { position:absolute; inset:0; background:linear-gradient(to bottom, rgba(15,42,13,0.55) 0%, transparent 45%, rgba(15,42,13,0.92) 100%); }
.oc-top { position:absolute; top:0; left:0; right:0; padding:14px 16px; }
.oc-nombre { font-size:14px; font-weight:700; color:#ffffff; letter-spacing:-0.2px; line-height:1.2; }
.oc-bottom { position:absolute; bottom:0; left:0; right:0; padding:10px 14px; }
.oc-pill { display:inline-flex; font-size:10px; font-weight:400; letter-spacing:1.5px; color:rgba(82,168,76,0.95); border:1px solid rgba(82,168,76,0.35); padding:3px 9px; border-radius:999px; }
/* ── SIEMBRA ── */
#siembra-idea { background:var(--verde-oscuro); padding:120px 48px; position:relative; overflow:hidden; }
#siembra-idea::before { content:''; position:absolute; bottom:-200px; right:-150px; width:600px; height:600px; border-radius:50%; background:radial-gradient(circle, rgba(82,168,76,0.09) 0%, transparent 65%); pointer-events:none; }
#siembra-idea::after { content:''; position:absolute; top:-100px; left:-100px; width:400px; height:400px; border-radius:50%; background:radial-gradient(circle, rgba(82,168,76,0.06) 0%, transparent 65%); pointer-events:none; }
.siembra-top { display:flex; flex-direction:column; margin-bottom:60px; position:relative; z-index:2; }
.siembra-top h2 { font-size:44px; font-weight:800; color:var(--blanco); letter-spacing:-1.5px; line-height:1.05; margin-bottom:27px; }
.siembra-top h2 span { font-weight:200; color:rgba(255,255,255,0.45); display:block; }
.siembra-intro { font-size:16px; font-weight:300; color:rgba(255,255,255,0.7); line-height:1.9; max-width:520px; }
.siembra-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:3px; position:relative; z-index:2; }
.s-card { position:relative; overflow:hidden; padding:40px 32px; border-radius:var(--radio-hoja); transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; display:flex; flex-direction:column; cursor:pointer; }
.s-card.reveal { transition-delay:0s; }
.s-card.reveal:hover { transform:translateY(-4px); box-shadow:0 16px 28px rgba(0,0,0,0.22); border-color:rgba(82,168,76,0.5); z-index:2; }
.s-card.reveal:focus-visible { outline:3px solid var(--acento); outline-offset:3px; transform:translateY(-4px); z-index:2; }
.s-num { position:absolute; top:-10px; right:16px; font-size:88px; font-weight:800; opacity:.10; line-height:1; pointer-events:none; }
.s-tag { align-self:flex-start; font-size:11px; font-weight:700; letter-spacing:2.5px; text-transform:uppercase; padding:5px 14px; border-radius:999px; margin-bottom:18px; }
.s-nombre { font-size:22px; font-weight:800; margin-bottom:10px; }
.s-desc { font-size:14px; font-weight:300; line-height:1.7; margin-bottom:0; flex:1; }
.s-cta { align-self:flex-start; display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:700; letter-spacing:.3px; padding:12px 22px; border-radius:999px; margin-top:24px; transition:gap .2s; }
.s-card:hover .s-cta { gap:12px; }
/* Nivel 1 — Siembra: claro, discreto */
.s-card.siembra { background:radial-gradient(ellipse 400px 300px at 100% 0%, rgba(82,168,76,0.35) 0%, transparent 60%), linear-gradient(160deg, #eef5e8 0%, #dfebd4 100%); border:1px solid rgba(48,102,45,0.12); }
.s-card.siembra .s-num { color:var(--verde); }
.s-card.siembra .s-tag { background:rgba(48,102,45,0.08); color:var(--verde); }
.s-card.siembra .s-nombre { color:var(--texto); }
.s-card.siembra .s-desc { color:rgba(26,61,24,0.75); }
.s-card.siembra .s-cta { background:var(--verde); color:var(--blanco); }
/* Nivel 2 — Brote: medio, más elegido */
.s-card.brote { background:radial-gradient(ellipse 400px 300px at 100% 0%, rgba(82,168,76,0.3) 0%, transparent 60%), rgba(82,168,76,0.14); border:1px solid rgba(82,168,76,0.3); }
.s-card.brote:hover { background:radial-gradient(ellipse 400px 300px at 100% 0%, rgba(82,168,76,0.35) 0%, transparent 60%), rgba(82,168,76,0.19); }
.s-card.brote .s-num { color:var(--acento); }
.s-card.brote .s-tag { background:var(--acento); color:var(--verde-oscuro); }
.s-card.brote .s-nombre { color:var(--blanco); }
.s-card.brote .s-desc { color:rgba(255,255,255,0.65); }
.s-card.brote .s-cta { background:var(--verde-oscuro); color:var(--blanco); }
/* Nivel 3 — Cosecha: oscuro, máxima presencia */
.s-card.cosecha { background:radial-gradient(ellipse 400px 300px at 100% 0%, rgba(82,168,76,0.32) 0%, transparent 60%), var(--verde-oscuro); border:1px solid rgba(82,168,76,0.22); }
.s-card.cosecha .s-num { color:var(--acento); }
.s-card.cosecha .s-tag { background:var(--acento); color:var(--verde-oscuro); }
.s-card.cosecha .s-nombre { color:var(--blanco); }
.s-card.cosecha .s-desc { color:rgba(255,255,255,0.6); }
.s-card.cosecha .s-cta { background:var(--acento); color:var(--verde-oscuro); }
.siembra-cta { margin-top:60px; display:flex; align-items:center; gap:20px; position:relative; z-index:2; }
.siembra-cta p { font-size:13px; font-weight:300; color:rgba(255,255,255,0.25); }
.siembra-ritmo { margin-bottom:32px; position:relative; z-index:2; }
.ritmo-label { font-size:11px; font-weight:300; text-transform:uppercase; letter-spacing:3px; color:rgba(255,255,255,0.55); margin-bottom:14px; }
.ritmo-row { display:grid; grid-template-columns:repeat(3,1fr); gap:3px; }
.ritmo-chip { display:flex; align-items:center; justify-content:space-between; gap:16px; background:rgba(255,255,255,0.03); border:1px dashed rgba(255,255,255,0.15); border-radius:var(--radio-hoja-sm); padding:18px 22px; transition:border-color .2s, transform .2s, background .2s; }
.ritmo-chip:hover { border-color:rgba(82,168,76,0.4); transform:translateY(-3px); }
.ritmo-chip:focus-visible { outline:3px solid var(--acento); outline-offset:3px; border-color:rgba(82,168,76,0.4); }
.ritmo-chip-texto { display:flex; flex-direction:column; gap:2px; }
.ritmo-chip-nombre { font-size:14px; font-weight:700; color:var(--blanco); }
.ritmo-chip-desc { font-size:12px; font-weight:300; color:rgba(255,255,255,0.55); }
.ritmo-chip-precio { font-size:13px; font-weight:800; color:var(--acento); white-space:nowrap; }
.siembra-divisor { margin:6px 0 32px; display:flex; align-items:center; gap:16px; position:relative; z-index:2; }
.siembra-divisor::before, .siembra-divisor::after { content:''; flex:1; height:1px; background:rgba(255,255,255,0.12); }
.siembra-divisor span { font-size:11px; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:var(--acento); white-space:nowrap; }
/* ── ESTUDIO ── */
#estudio { background:var(--fondo-calido); padding:120px 48px; }
.estudio-grid { display:grid; grid-template-columns:380px 1fr; gap:80px; align-items:start; margin-top:56px; }
.estudio-foto { height:480px; border-radius:var(--radio-hoja); overflow:hidden; }
.estudio-content h2 { font-size:36px; font-weight:800; color:var(--verde-oscuro); letter-spacing:-0.8px; line-height:1.2; }
.estudio-content p { font-size:16px; font-weight:300; color:var(--texto); line-height:1.9; margin-top:22px; }
.estudio-datos { margin-top:44px; display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.dato { padding:18px 22px; background:var(--blanco); border-radius:var(--radio-hoja-sm); }
.dato-label { font-size:11px; font-weight:300; text-transform:uppercase; letter-spacing:2px; color:var(--gris-3); margin-bottom:6px; }
.dato-valor { font-size:14px; font-weight:700; color:var(--verde); }
/* ── CONTACTO ── */
#contacto { background:var(--verde-oscuro); min-height:62vh; display:flex; align-items:center; justify-content:center; text-align:center; padding:120px 48px; position:relative; overflow:hidden; }
#contacto::before { content:''; position:absolute; top:-200px; left:50%; transform:translateX(-50%); width:800px; height:500px; background:radial-gradient(ellipse, rgba(82,168,76,0.1) 0%, transparent 65%); pointer-events:none; }
.contacto-inner { position:relative; z-index:2; }
.contacto-h { font-size:52px; font-weight:800; color:var(--blanco); letter-spacing:-2px; line-height:1.05; margin-bottom:32px; }
.contacto-h span { font-weight:200; color:rgba(255,255,255,0.45); display:block; }
.contacto-sub { font-size:17px; font-weight:300; color:rgba(255,255,255,0.55); line-height:1.8; margin-bottom:48px; max-width:380px; margin-left:auto; margin-right:auto; }
.contacto-email { font-size:13px; font-weight:300; color:rgba(255,255,255,0.55); margin-top:22px; letter-spacing:1px; }
/* ── RESPONSIVE ── */
@media (max-width: 900px) {
  /* HERO */
  #hero { grid-template-columns:1fr; gap:40px; padding:100px 24px 60px; min-height:auto; }
  #hero::before, #hero::after { display:none; }
  .hero-h1 { font-size:40px; letter-spacing:-1.5px; }
  .hero-body { font-size:16px; margin:20px 0 32px; max-width:100%; }
  .hero-ctas { flex-direction:column; align-items:flex-start; gap:12px; }
  .hero-visual { height:260px; order:2; }
  .hero-left { order:1; }
  /* METODOLOGÍA */
  #metodologia { padding:72px 24px; }
  .met-hero { gap:24px; margin-bottom:48px; }
  .semilla-wrap { margin:0 auto; }
  .met-titulo { font-size:40px; letter-spacing:-1.5px; }
  .met-bajada { font-size:24px; }
  .met-descripcion { font-size:15px; }
  .acord-header { padding:24px 0; gap:16px; }
  .acord-nombre { font-size:24px; }
  .acord-resumen { display:none; }
  .acord-content { grid-template-columns:1fr; gap:24px; padding:0 0 32px 0; }
  .acord-col-tags { flex-direction:row; flex-wrap:wrap; }
  .met-puente { flex-direction:column; gap:20px; text-align:center; margin-top:48px; padding-top:40px; }
  .met-puente p { font-size:17px; }
  /* TRABAJO */
  #trabajo { padding:0 24px 80px; }
  .trabajo-header { margin:0 -24px; padding:60px 24px 80px; }
  .trabajo-intro h2 { font-size:26px; white-space:normal; }
  .trabajo-stats { display:flex; flex-wrap:wrap; width:100%; }
  .trabajo-stat { padding:16px 20px; flex:1; min-width:80px; }
  .trabajo-stat-num { font-size:24px; }
  .caso { grid-template-columns:1fr; gap:28px; padding:48px 0; }
  .caso:nth-child(even) .caso-visual { order:0; }
  .caso-visual { height:240px; }
  .caso-mirada { font-size:24px; }
  .oc-grilla { grid-template-columns:1fr 1fr; }
  .otros-cultivos-grilla { padding:48px 0 0; }
  /* SIEMBRA */
  #siembra-idea { padding:72px 24px; }
  .siembra-top { margin-bottom:40px; }
  .siembra-top h2 { font-size:30px; margin-bottom:18px; }
  .siembra-cards { grid-template-columns:1fr; gap:12px; }
  .s-card { padding:28px 24px; }
  .siembra-cta { flex-direction:column; align-items:flex-start; gap:10px; }
  .ritmo-row { grid-template-columns:1fr; gap:14px; }
  .ritmo-chip { background:rgba(82,168,76,0.16); border:1.5px solid rgba(82,168,76,0.4); padding:22px 24px; }
  .ritmo-chip-nombre { font-size:16px; }
  .ritmo-chip-desc { font-size:13px; }
  .ritmo-chip-precio { font-size:15px; }
  .siembra-divisor { margin:4px 0 22px; }
  /* ESTUDIO */
  #estudio { padding:72px 24px; }
  .estudio-grid { grid-template-columns:1fr; gap:40px; margin-top:40px; }
  .estudio-foto { height:300px; }
  .estudio-content h2 { font-size:28px; }
  .estudio-datos { grid-template-columns:1fr 1fr; }
  /* CONTACTO */
  #contacto { padding:80px 24px; min-height:auto; }
  .contacto-h { font-size:36px; letter-spacing:-1.2px; }
  .contacto-sub { font-size:16px; }
}
@media (max-width: 480px) {
  .hero-h1 { font-size:32px; }
  .met-titulo { font-size:32px; }
  .oc-grilla { grid-template-columns:1fr; }
  .trabajo-stats { flex-direction:column; }
  .trabajo-stat { border-right:none; border-bottom:1px solid var(--gris-1); }
  .trabajo-stat:last-child { border-bottom:none; }
  .estudio-datos { grid-template-columns:1fr; }
  .contacto-h { font-size:28px; }
}