/* ───────────────────────────────────────────────────────────
   Jungla Digital — Home (front-page) + tarjetas reutilizables.
   Porteado de human-home.jsx / human-senderos.jsx.
   ─────────────────────────────────────────────────────────── */

.jd-section{padding:60px 0;border-bottom:1px solid var(--line)}
.jd-section--flush{border-bottom:0}
.jd-section__head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:32px}
.jd-section__head h2,.jd-section__head h3{margin:0}
.jd-link{font-weight:600;font-size:15px;color:var(--fg);white-space:nowrap}
.jd-link:hover{opacity:1;color:var(--primary)}

/* ── Hero ──────────────────────────────────────────────────── */
.jd-hero{padding:76px 0 56px;border-bottom:1px solid var(--line)}
.jd-hero h1{font-size:clamp(40px,8vw,84px);max-width:15ch;margin:24px 0 0;line-height:.99}
.jd-hero__row{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;flex-wrap:wrap;margin-top:38px}
.jd-hero__lead{font-size:18.5px;line-height:1.6;color:var(--dim);max-width:52ch;margin:0}
.jd-hero__lead strong{color:var(--fg);font-weight:500}
.jd-hero__cta{display:flex;gap:12px;flex-wrap:wrap}
/* Consola: hero como prompt de terminal */
:root[data-mode="consola"] .jd-kicker::before{content:"$ "}
:root[data-mode="consola"] .jd-hero h1{font-size:clamp(34px,6.5vw,68px)}

/* ── Destacado + categorías ────────────────────────────────── */
.jd-feature{display:grid;grid-template-columns:1.5fr 1fr;gap:52px;align-items:center}
.jd-feature__main{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center}
.jd-feature__main:hover .jd-feature__more{border-bottom-color:var(--primary)}
.jd-feature h2{font-size:clamp(24px,3vw,32px);margin:14px 0}
.jd-feature p{color:var(--dim);font-size:16px;margin:0 0 18px}
.jd-feature__more{font-weight:600;font-size:15.5px;color:var(--fg);border-bottom:2px solid var(--acid);padding-bottom:2px}
.jd-cats{display:flex;flex-direction:column}
.jd-cat{display:flex;align-items:center;justify-content:space-between;padding:16px 0;border-bottom:1px solid var(--line)}
.jd-cat__name{display:flex;align-items:center;gap:13px}
.jd-cat__glyph{color:var(--primary);width:24px;font-family:var(--font-mono);font-size:15px}
.jd-cat__count{font-family:var(--font-mono);color:var(--dim);font-size:14px}
.jd-cat--soon .jd-cat__label{color:var(--dim)}
.jd-soon{font-size:11px;color:var(--primary);border:1px solid var(--line);padding:2px 8px;border-radius:99px}

/* ── Imagen placeholder (mientras no haya thumbnails) ──────── */
.jd-thumb{background:var(--soft);border:1px solid var(--line);border-radius:10px;aspect-ratio:16/10;overflow:hidden;position:relative;display:flex;align-items:center;justify-content:center;
  background-image:repeating-linear-gradient(135deg,var(--line) 0,var(--line) 1px,transparent 1px,transparent 11px)}
:root[data-mode="consola"] .jd-thumb{border-radius:0}
.jd-thumb img{width:100%;height:100%;object-fit:cover}
.jd-thumb--ratio43{aspect-ratio:4/3}

/* ── Grilla de tarjetas ────────────────────────────────────── */
.jd-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:40px 48px}
.jd-card{cursor:pointer;display:block;color:inherit}
.jd-card__meta{display:flex;gap:10px;align-items:center;margin:18px 0 12px;font-size:13.5px;color:var(--dim)}
.jd-card h3{font-size:24px;line-height:1.18;margin:0 0 10px}
.jd-card:hover h3{color:var(--primary)}
.jd-card p{font-size:15.5px;line-height:1.6;color:var(--dim);margin:0}

/* ── Senderos (sección home) ───────────────────────────────── */
.jd-senderos-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:8px}
.jd-sendero-card{border:1px solid var(--line);border-radius:16px;background:var(--panel);padding:26px;display:flex;flex-direction:column;color:inherit;transition:transform .15s,border-color .15s}
:root[data-mode="consola"] .jd-sendero-card{border-radius:0}
.jd-sendero-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--primary) 40%,transparent)}
.jd-sendero-card__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.jd-sendero-card__glyph{font-family:var(--font-mono);font-size:18px;color:var(--primary)}
.jd-sendero-card h4{font-size:21px;line-height:1.2;margin:0 0 10px}
.jd-sendero-card p{font-size:14.5px;line-height:1.55;color:var(--dim);margin:0 0 18px}
.jd-sendero-card__foot{margin-top:auto}
.jd-sendero-card__foot small{font-size:13.5px;color:var(--dim);display:block;margin-top:6px}

/* ── Newsletter ────────────────────────────────────────────── */
.jd-news{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:48px;display:grid;grid-template-columns:1.2fr 1fr;gap:44px;align-items:center}
:root[data-mode="consola"] .jd-news{border-radius:0}
.jd-news h3{font-size:34px;line-height:1.06;margin:16px 0 12px}
.jd-news p{font-size:16.5px;line-height:1.6;color:var(--dim);margin:0;max-width:42ch}
/* Layout: Nombre + Apellido en 2 columnas; correo y botón a lo ancho.
   (mc4wp envuelve cada campo en un <p>; los ordenamos con grid.
   El estilo de los inputs vive en base.css — consistente con el buscador.) */
.jd-news__form .mc4wp-form-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px}
.jd-news__form .mc4wp-form-fields>p{margin:0;display:flex;flex-direction:column;gap:7px;min-width:0}
.jd-news__form .mc4wp-form-fields>p:nth-child(3),
.jd-news__form .mc4wp-form-fields>p:nth-child(4){grid-column:1 / -1}
.jd-news__form label{font-family:var(--font-mono);font-size:11px;font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:var(--dim)}
/* Submit = botón de acción del sitio (pill, igual que .jd-btn) */
.jd-news__form input[type=submit]{width:100%;margin-top:2px;cursor:pointer;font:inherit;font-weight:600;font-size:15.5px;padding:13px 26px;border:1px solid var(--fg);border-radius:var(--radius-pill);background:var(--fg);color:var(--bg);transition:transform .15s,filter .15s}
.jd-news__form input[type=submit]:hover{transform:translateY(-1px);filter:brightness(1.08)}
:root[data-mode="consola"] .jd-news__form input[type=submit]{border-radius:4px;font-family:var(--font-mono);background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
.jd-news__form .mc4wp-response{font-size:14px;color:var(--dim);margin-top:8px}
.jd-news__form .mc4wp-response .mc4wp-alert{padding:0}
@media (max-width:520px){ .jd-news__form .mc4wp-form-fields{grid-template-columns:1fr} }

/* ── Responsive ────────────────────────────────────────────── */
@media (max-width:900px){
  .jd-feature{grid-template-columns:1fr;gap:36px}
  .jd-senderos-grid{grid-template-columns:1fr}
  .jd-news{grid-template-columns:1fr;gap:24px;padding:32px}
}
@media (max-width:680px){
  .jd-cards{grid-template-columns:1fr}
  .jd-feature__main{grid-template-columns:1fr}
}