/**
 * Ketin 2.0 — Cards · kem2-cards.css · v1.0.0 · 2026-07-20
 * Defaults derivados de .leaf-panel del design system estático (grid
 * 50/50, media a sangre completa, texto 56/60, kicker serif itálico
 * "0.1 ——", border-bottom con el último sin línea). SIN !important:
 * Design gana siempre. Identidades ZIHT (preset propio) y PTF (kicker
 * dorado del prototipo) como carga inicial editable.
 */

/* ---------- Variables por identidad ---------- */
.kem2-cards{
  --kem2-cd-ink: #12131c;
  --kem2-cd-gray: #40424f;
  --kem2-cd-accent: #4800fe;
  --kem2-cd-serif: 'Source Serif 4', Georgia, serif;
  --kem2-cd-line: #dbdde6;
  --kem2-cd-box-bg: #ffffff;
}
.kem2-cards.kem-ptf{
  --kem2-cd-ink: #0e2015;
  --kem2-cd-accent: #a9781f;
  --kem2-cd-serif: 'Newsreader', Georgia, serif;
  --kem2-cd-gray: #3c4a3e;
  --kem2-cd-line: #d7ddca;
}

/* ---------- Lista ---------- */
.kem2-cd-list{ position: relative; }
.kem2-cd-style-boxed .kem2-cd-list{
  display: flex;
  flex-direction: column;
  gap: var(--kem2-cd-gap, 24px);
}

/* ---------- Panel: grid base ---------- */
.kem2-card-panel{
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
  gap: var(--kem2-cd-mgap, 0);
}
.kem2-cd-layout-stacked .kem2-card-panel{
  grid-template-columns: 1fr;
}

/* Separador (solo spread) */
.kem2-cd-divider .kem2-card-panel{ border-bottom: var(--kem2-cd-dw, 1px) var(--kem2-cd-ds, solid) var(--kem2-cd-dc, var(--kem2-cd-line)); }
.kem2-cd-divider .kem2-card-panel:last-child{ border-bottom: none; }

/* Caja (boxed) */
.kem2-cd-style-boxed .kem2-card-panel{
  background: var(--kem2-cd-panelbg, var(--kem2-cd-box-bg));
  border: 1px solid var(--kem2-cd-bc, var(--kem2-cd-line));
  border-radius: var(--kem2-cd-radius, 6px);
  overflow: hidden;
}
.kem2-cd-shadow-soft .kem2-card-panel{ box-shadow: 0 2px 10px rgba(18,19,28,.06); }
.kem2-cd-shadow-medium .kem2-card-panel{ box-shadow: 0 8px 24px rgba(18,19,28,.10); }

/* ---------- Alternancia ---------- */
/* Por defecto (sin alternar): media siempre según start_side */
.kem2-cd-start-right .kem2-card-panel{ direction: rtl; }
.kem2-cd-start-right .kem2-card-panel > *{ direction: ltr; }

/* Alternada: invierte el orden en paneles pares */
.kem2-cd-alternate.kem2-cd-start-left .kem2-card-panel:nth-child(even){ direction: rtl; }
.kem2-cd-alternate.kem2-cd-start-left .kem2-card-panel:nth-child(even) > *{ direction: ltr; }
.kem2-cd-alternate.kem2-cd-start-right .kem2-card-panel:nth-child(even){ direction: ltr; }
.kem2-cd-alternate.kem2-cd-start-right .kem2-card-panel:nth-child(even) > *{ direction: ltr; }

/* Override manual por panel: gana por ir después en la hoja */
.kem2-card-panel.kem2-cd-side-left{ direction: ltr; }
.kem2-card-panel.kem2-cd-side-left > *{ direction: ltr; }
.kem2-card-panel.kem2-cd-side-right{ direction: rtl; }
.kem2-card-panel.kem2-cd-side-right > *{ direction: ltr; }

@media (max-width: 900px){
  .kem2-card-panel,
  .kem2-cd-start-right .kem2-card-panel,
  .kem2-cd-alternate .kem2-card-panel:nth-child(even),
  .kem2-card-panel.kem2-cd-side-left,
  .kem2-card-panel.kem2-cd-side-right{
    grid-template-columns: 1fr;
    direction: ltr;
  }
}

/* ---------- Media ---------- */
.kem2-cd-media{ position: relative; }
.kem2-cd-hmode-stretch .kem2-cd-media{ min-height: var(--kem2-cd-minh, 280px); height: 100%; }
.kem2-cd-hmode-ratio .kem2-cd-media{ aspect-ratio: var(--kem2-cd-ratio, 4/3); }
.kem2-cd-layout-stacked .kem2-cd-media{ min-height: 0; height: auto; aspect-ratio: var(--kem2-cd-ratio, 16/9); }
.kem2-cd-single, .kem2-cd-img{ width: 100%; height: 100%; display: block; object-fit: cover; }

/* Galería / carrusel */
.kem2-cd-gallery{ position: relative; width: 100%; height: 100%; overflow: hidden; }
.kem2-cd-slide{ position: absolute; inset: 0; opacity: 0; transition: opacity .35s ease; }
.kem2-cd-slide:first-child{ opacity: 1; position: relative; }
.kem2-cd-gallery[data-kem2-active] .kem2-cd-slide{ position: absolute; opacity: 0; }
.kem2-cd-gallery[data-kem2-active] .kem2-cd-slide.kem2-cd-slide-active{ opacity: 1; }
.kem2-cd-dots{ position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%); display: flex; gap: 6px; z-index: 2; }
.kem2-cd-dot{
  width: 7px; height: 7px; border-radius: 50%;
  background: rgba(255,255,255,.55);
  border: none; padding: 0; cursor: pointer;
}
.kem2-cd-dot.kem2-cd-dot-active{ background: #fff; }
/* Sin JS: todas las imágenes de la galería se apilan, siempre visibles */
.kem2-cd-gallery:not([data-kem2-active]) .kem2-cd-slide{ position: relative; opacity: 1; }
.kem2-cd-gallery:not([data-kem2-active]) .kem2-cd-dots{ display: none; }

/* ---------- Columna de texto ---------- */
.kem2-cd-textcol{
  padding: var(--kem2-cd-textpv, 56px) var(--kem2-cd-textph, 60px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  color: var(--kem2-cd-panelc, var(--kem2-cd-gray));
}
.kem2-cd-custombg .kem2-cd-textcol{ color: var(--kem2-cd-panelc, var(--kem2-cd-gray)); }
@media (max-width: 900px){
  .kem2-cd-textcol{ padding: 40px 32px; }
}

/* ---------- Kicker ---------- */
.kem2-cd-kicker-manual, .kem2-cd-kicker-auto{
  font-family: var(--kem2-cd-serif);
  font-style: italic;
  font-size: 15px;
  color: var(--kem2-cd-accent);
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.kem2-cd-kicker-manual{ display: flex; }
.kem2-cd-kicker-line .kem2-cd-kicker-manual::after,
.kem2-cd-kicker-line .kem2-cd-kicker-auto::after{
  content: '';
  width: 34px; height: 1px;
  background: var(--kem2-cd-accent);
  display: inline-block;
}
.kem2-cd-noline .kem2-cd-kicker-manual::after,
.kem2-cd-noline .kem2-cd-kicker-auto::after{ display: none; }

/* Kicker automático: contador CSS con estilo elegido */
.kem2-cd-kicker-auto .kem2-cd-list{ counter-reset: kem2cd; }
.kem2-cd-kicker-auto .kem2-card-panel{ counter-increment: kem2cd; }
.kem2-cd-kicker-auto .kem2-cd-textcol::before{
  content: var(--kem2-cd-kpre, '') '0.' counter(kem2cd);
  font-family: var(--kem2-cd-serif);
  font-style: italic;
  font-size: 15px;
  color: var(--kem2-cd-accent);
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.kem2-cd-kicker-auto.kem2-cd-kstyle-dlz .kem2-cd-textcol::before{ content: var(--kem2-cd-kpre, '') counter(kem2cd, decimal-leading-zero); }
.kem2-cd-kicker-auto.kem2-cd-kstyle-dec .kem2-cd-textcol::before{ content: var(--kem2-cd-kpre, '') counter(kem2cd, decimal); }
.kem2-cd-kicker-auto.kem2-cd-kstyle-uroman .kem2-cd-textcol::before{ content: var(--kem2-cd-kpre, '') counter(kem2cd, upper-roman); }
.kem2-cd-kicker-auto .kem2-cd-title{ margin-top: 0; }

/* ---------- Título / texto ---------- */
.kem2-cd-title{ font-family: var(--kem2-cd-serif); font-size: 23px; color: var(--kem2-cd-panelc, var(--kem2-cd-ink)); margin: 0 0 14px; }
.kem2-cd-text{ font-size: 15px; line-height: 1.65; }
.kem2-cd-text p{ margin: 0 0 10px; }
.kem2-cd-text p:last-child{ margin-bottom: 0; }
.kem2-cd-text a{ color: var(--kem2-cd-accent); }

/* ---------- Footer: labels + botones ---------- */
.kem2-cd-footer{ display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.kem2-cd-labels, .kem2-cd-buttons{ display: flex; flex-wrap: wrap; gap: 8px; }
.kem2-cd-label{ display: inline-block; font-size: 12px; color: var(--kem2-cd-gray); }
.kem2-cd-label-1{ background: var(--kem2-cd-l1-bg, #eceef4); border: var(--kem2-cd-l1-bw,1px) var(--kem2-cd-l1-bs,solid) var(--kem2-cd-l1-bc,transparent); border-radius: var(--kem2-cd-l1-br,30px); padding: var(--kem2-cd-l1-pv,4px) var(--kem2-cd-l1-ph,12px); }
.kem2-cd-label-2{ background: var(--kem2-cd-l2-bg, #eceef4); border: var(--kem2-cd-l2-bw,1px) var(--kem2-cd-l2-bs,solid) var(--kem2-cd-l2-bc,transparent); border-radius: var(--kem2-cd-l2-br,30px); padding: var(--kem2-cd-l2-pv,4px) var(--kem2-cd-l2-ph,12px); }
.kem2-cd-label-3{ background: var(--kem2-cd-l3-bg, #eceef4); border: var(--kem2-cd-l3-bw,1px) var(--kem2-cd-l3-bs,solid) var(--kem2-cd-l3-bc,transparent); border-radius: var(--kem2-cd-l3-br,30px); padding: var(--kem2-cd-l3-pv,4px) var(--kem2-cd-l3-ph,12px); }
.kem2-cd-btn{ display: inline-block; font-size: 13px; font-weight: 600; text-decoration: none; color: #fff; }
.kem2-cd-btn-1{ background: var(--kem2-cd-b1-bg, var(--kem2-cd-accent)); border: var(--kem2-cd-b1-bw,1px) var(--kem2-cd-b1-bs,solid) var(--kem2-cd-b1-bc,transparent); border-radius: var(--kem2-cd-b1-br,4px); padding: var(--kem2-cd-b1-pv,8px) var(--kem2-cd-b1-ph,18px); }
.kem2-cd-btn-2{ background: var(--kem2-cd-b2-bg, var(--kem2-cd-accent)); border: var(--kem2-cd-b2-bw,1px) var(--kem2-cd-b2-bs,solid) var(--kem2-cd-b2-bc,transparent); border-radius: var(--kem2-cd-b2-br,4px); padding: var(--kem2-cd-b2-pv,8px) var(--kem2-cd-b2-ph,18px); }
.kem2-cd-btn-3{ background: var(--kem2-cd-b3-bg, var(--kem2-cd-accent)); border: var(--kem2-cd-b3-bw,1px) var(--kem2-cd-b3-bs,solid) var(--kem2-cd-b3-bc,transparent); border-radius: var(--kem2-cd-b3-br,4px); padding: var(--kem2-cd-b3-pv,8px) var(--kem2-cd-b3-ph,18px); }
