/*
Theme Name: Kadence Child - Tu Método SaaS
Template: kadence
Description: Child theme de Kadence con el rediseño oscuro de Tu Método SaaS (azul noche / verde esmeralda).
Version: 2.0.0
Author: Tu Método SaaS
*/

/* ============================================================
   TOKENS — ver design/design_handoff_tumetodosaas_redesign/README.md
   ============================================================ */
:root{
  --tms-paper:#0a1628;
  --tms-card:rgba(20,36,58,.7);
  --tms-card-hover:rgba(24,44,68,.9);
  --tms-ink:#f0f4f8;
  --tms-ink2:#b8c6d6;
  --tms-ink3:#8fa3b8;
  --tms-faint:#5f7590;
  --tms-line:rgba(143,163,184,.14);
  --tms-line-strong:rgba(143,163,184,.3);
  --tms-teal:#34d399;
  --tms-accent:#10b981;
  --tms-accent-hover:#34d399;
  --tms-accent-soft:rgba(16,185,129,.12);
  --tms-accent-border:rgba(16,185,129,.3);
  --tms-on-accent:#04120c;
  --tms-navy:#0a2a3f;
  --tms-mint:linear-gradient(135deg,#0d3b2e,#0a2a3f);
  --tms-cta:#10b981;
  --tms-chip:rgba(16,185,129,.12);
  --tms-good:#34d399;
  --tms-danger:#f87171;
  --tms-stars:#fbbf24;
  --tms-font-display:'Sora',sans-serif;
  --tms-font-body:'Manrope',sans-serif;
}

@keyframes tmsHeroIn{ from{opacity:0; transform:translateY(18px);} to{opacity:1; transform:translateY(0);} }
@keyframes tmsPulse{ 0%,100%{box-shadow:0 0 0 0 rgba(16,185,129,.45);} 50%{box-shadow:0 0 0 10px rgba(16,185,129,0);} }

body{background:var(--tms-paper);color:var(--tms-ink);font-family:var(--tms-font-body)}
h1,h2,h3,h4{letter-spacing:-.02em;font-weight:800;font-family:var(--tms-font-display);color:var(--tms-ink)}
a{color:var(--tms-teal)}
a:hover{color:#6ee7b7}

/* ---------- cabecera de Kadence (sticky, cristal) ---------- */
#masthead.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(10,22,40,.85) !important;
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--tms-line);
}
#masthead .site-container{max-width:1120px}
#masthead .site-title, #masthead .site-title a{
  font-family:var(--tms-font-display); font-weight:700; color:var(--tms-ink) !important; letter-spacing:-.02em;
}
#masthead .main-navigation ul li a{
  color:var(--tms-ink2) !important; font-family:var(--tms-font-body); font-weight:600; font-size:14px;
}
#masthead .main-navigation ul li a:hover{color:var(--tms-teal) !important}
#masthead .main-navigation ul ul{
  background:var(--tms-navy) !important; border:1px solid var(--tms-line);
}

/* ---------- título de página por defecto (hero automático en artículos/hubs) ---------- */
.entry-header.page-title{
  position:relative; background:var(--tms-paper) !important; padding:44px 20px 28px !important;
  border-bottom:none !important;
}
.entry-header.page-title::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(ellipse 80% 55% at 50% -10%, rgba(16,185,129,.14), transparent 65%);
  pointer-events:none;
}
.entry-header.page-title .page-title-heading,
.entry-header.page-title h1{
  font-family:var(--tms-font-display); font-weight:800; letter-spacing:-.03em;
  font-size:clamp(27px,5.5vw,44px); line-height:1.15; color:var(--tms-ink) !important;
  position:relative; max-width:820px; margin:0 auto;
}
.entry-header.page-title .kt-breadcrumbs,
.entry-header.page-title .kadence-breadcrumbs{
  max-width:820px; margin:0 auto 14px; position:relative; font-size:13px; font-weight:600; color:var(--tms-faint) !important;
}
.entry-header.page-title .kt-breadcrumbs a{color:var(--tms-ink3) !important}

/* ---------- fondo global y contenedor de contenido ---------- */
.site, .content-container, .site-container{background:var(--tms-paper)}
/* Kadence pinta la caja de contenido (.content-bg) en blanco vía su paleta
   global (--global-palette9); la sobreescribimos aquí para que herede el
   fondo oscuro en vez de quedar blanca con texto casi invisible encima. */
.content-bg, .entry.content-bg{background:var(--tms-paper) !important}
.entry-content{color:var(--tms-ink2); font-size:16px; line-height:1.65}
.entry-content p{color:var(--tms-ink2)}

/* ---------- botones ---------- */
.wp-block-button.tms-cta .wp-block-button__link{
  background:var(--tms-cta);color:var(--tms-on-accent);border-radius:14px;
  padding:15px 28px;font-weight:800;min-height:48px;font-family:var(--tms-font-body);
  box-shadow:0 8px 24px rgba(16,185,129,.35); transition:background .2s, transform .2s, box-shadow .2s;
}
.wp-block-button.tms-cta .wp-block-button__link:hover{
  background:var(--tms-accent-hover); transform:translateY(-2px); box-shadow:0 12px 28px rgba(16,185,129,.45);
}
.wp-block-button.tms-ghost .wp-block-button__link{
  background:transparent;color:var(--tms-ink);border:1px solid var(--tms-line-strong);
  border-radius:14px;padding:15px 24px;font-weight:700;min-height:48px;
}
.wp-block-button.tms-ghost .wp-block-button__link:hover{border-color:var(--tms-teal); color:var(--tms-teal)}

/* ---------- kicker / eyebrow con punto pulsante ---------- */
.tms-kicker{
  display:inline-flex; align-items:center; gap:8px;
  font-size:13px;font-weight:700; color:var(--tms-teal);
  background:var(--tms-accent-soft); border:1px solid var(--tms-accent-border);
  border-radius:99px; padding:6px 14px;
}
.tms-kicker::before{
  content:""; width:7px; height:7px; border-radius:50%; background:var(--tms-accent);
  animation:tmsPulse 2s infinite; flex-shrink:0;
}

/* ---------- grid de sectores ---------- */
.tms-sectors{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:12px;
}
.tms-sector-item{
  display:flex !important; flex-direction:column; gap:8px;
  background:var(--tms-card) !important; border:1px solid var(--tms-line) !important; border-radius:16px !important;
  padding:18px 16px !important; min-height:44px; text-decoration:none;
  transition:border-color .25s, transform .25s, background .25s;
}
.tms-sector-item:hover{border-color:rgba(16,185,129,.55) !important; transform:translateY(-3px); background:var(--tms-card-hover) !important}
.tms-sector-item .tms-sicon{font-size:26px; line-height:1}
.tms-sector-item .tms-sname{font-family:var(--tms-font-display); font-weight:700; font-size:15px; color:var(--tms-ink)}
.tms-sector-item .tms-sdesc{font-size:12.5px; color:var(--tms-ink3); line-height:1.45}
.tms-sector-item .tms-slink{font-size:12.5px; font-weight:800; color:var(--tms-teal); margin-top:auto}

/* ---------- selector de sectores en lista (compatibilidad con contenido antiguo) ---------- */
.tms-picker{
  background:var(--tms-card);border:1px solid var(--tms-line);border-radius:16px;
  overflow:hidden;padding:0 !important;
}
.tms-picker .wp-block-group__inner-container{display:flex;flex-direction:column}
.tms-picker-item{
  display:flex;align-items:center;gap:14px;padding:15px 18px !important;
  border-top:1px solid var(--tms-line);min-height:56px;margin:0 !important;
  text-decoration:none;
}
.tms-picker-item:first-child{border-top:none}
.tms-picker-item:hover{background:var(--tms-card-hover)}
.tms-picker-item a{text-decoration:none;color:var(--tms-ink);font-weight:700}
.tms-picker-item .tms-sub{font-size:13px;color:var(--tms-ink3);display:block;font-weight:400}
@media(min-width:900px){
  .tms-picker .wp-block-group__inner-container{display:grid;grid-template-columns:1fr 1fr}
}

/* ---------- franja de estadísticas ---------- */
.tms-stats{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:14px;
  background:linear-gradient(135deg, rgba(16,185,129,.1), rgba(16,185,129,.02));
  border:1px solid var(--tms-accent-border); border-radius:20px; padding:24px 22px;
}
.tms-stats .tms-stat{display:flex; flex-direction:column; gap:4px; text-align:center}
.tms-stats .tms-stat-value{font-family:var(--tms-font-display); font-weight:800; font-size:clamp(26px,4vw,36px); color:var(--tms-teal)}
.tms-stats .tms-stat-label{font-size:13px; font-weight:600; color:var(--tms-ink2)}

/* ---------- píldoras de confianza ---------- */
.tms-pill{
  display:inline-flex; align-items:center; gap:7px;
  font-size:13.5px;font-weight:600;color:var(--tms-ink3);
  margin:0 22px 6px 0;
}
.tms-pill::before{content:"✓"; color:var(--tms-teal); font-weight:800}

/* ---------- tarjetas (comparativas / sectores) ---------- */
.tms-card{
  background:var(--tms-card) !important;border:1px solid var(--tms-line) !important;border-radius:18px !important;
  padding:22px !important;height:100%; transition:border-color .25s, transform .25s;
}
.tms-card:hover{border-color:rgba(16,185,129,.55) !important; transform:translateY(-3px)}
.tms-card h3{font-family:var(--tms-font-display); font-weight:700; font-size:18px;line-height:1.3;margin:6px 0; color:var(--tms-ink)}
.tms-card .tms-cat{
  display:inline-block; font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--tms-teal);
  background:var(--tms-accent-soft); border-radius:99px; padding:4px 11px;
}
.tms-card .tms-meta{font-size:12.5px;color:var(--tms-faint)}

/* ---------- franja "cómo trabajamos" ---------- */
.tms-num{
  display:inline-grid; place-items:center; font-family:var(--tms-font-display); font-weight:800; font-size:15px;
  color:var(--tms-on-accent); background:var(--tms-accent); width:32px; height:32px; border-radius:10px;
}
.tms-afiliados{
  font-size:13.5px;color:var(--tms-ink3);border-top:none;
  background:var(--tms-card); border:1px solid var(--tms-line); border-radius:14px;
  padding:14px 18px;margin-top:16px;
}
.tms-afiliados a{color:var(--tms-teal)}

/* ---------- newsletter ---------- */
.tms-news{
  background:var(--tms-mint) !important;color:#E7EFF8;border-radius:24px;
  border:1px solid var(--tms-accent-border);
  padding:clamp(28px,5vw,48px) !important; text-align:center;
}
.tms-news h2, .tms-news h3{color:#fff}
.tms-news p{color:var(--tms-ink2); max-width:520px; margin-left:auto; margin-right:auto}

/* ---------- hub: empieza aquí / veredicto rápido ---------- */
.tms-start, .tms-quick{
  background:var(--tms-mint) !important;border:1px solid var(--tms-accent-border) !important;
  border-radius:20px;padding:clamp(20px,4vw,30px) !important;
}
.tms-start .tms-k2{
  font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:var(--tms-teal);
}
.tms-quick h3,.tms-quick h4{
  font-family:var(--tms-font-display); font-size:18px;color:var(--tms-ink);text-transform:none;letter-spacing:0;margin-bottom:12px;
  display:flex; align-items:center; gap:10px;
}
.tms-quick ul{margin:0;padding:0; list-style:none}
.tms-quick li{margin-bottom:10px;font-size:15px; color:#d5e0ea; line-height:1.6; padding-left:0}
.tms-quick li strong{color:var(--tms-ink)}

/* ---------- hub: item de guía con precio ---------- */
.tms-guide{
  background:var(--tms-card);border:1px solid var(--tms-line);border-radius:14px;
  padding:16px 18px !important;height:100%;
}
.tms-guide .tms-price{font-size:13px;font-weight:700;color:var(--tms-good);white-space:nowrap;font-variant-numeric:tabular-nums}
.tms-guide p{font-size:13.5px;color:var(--tms-ink3);margin-bottom:0}

/* ---------- artículo: nota de afiliados ---------- */
.tms-aff{
  font-size:13.5px;color:var(--tms-ink3);background:var(--tms-card);border:1px solid var(--tms-line);
  border-radius:14px;padding:14px 18px !important;margin:16px 0;
}
.tms-aff a{color:var(--tms-teal)}

/* ---------- artículo: tarjeta de producto ---------- */
.tms-prod{
  background:var(--tms-card);border:1px solid var(--tms-line);border-radius:20px;
  padding:clamp(20px,4vw,28px) !important;height:100%;
}
.tms-prod .tms-win{
  display:inline-block;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;
  color:var(--tms-teal); background:none; padding:0; margin-bottom:8px;
}
.tms-prod .tms-price{font-weight:800;color:var(--tms-ink);font-size:20px;font-variant-numeric:tabular-nums}
.tms-prod ul{padding-left:18px;font-size:14px;color:#d5e0ea}
.tms-prod .wp-block-button{margin-top:14px}
.tms-prod .wp-block-button .wp-block-button__link{width:100%;text-align:center}

/* ---------- artículo: caja CTA de afiliado ---------- */
.tms-ctabox{
  background:rgba(10,22,40,.6) !important;border:1px solid var(--tms-line);border-radius:14px;
  padding:14px 16px !important;margin:16px 0; display:flex; flex-wrap:wrap; align-items:center; gap:12px;
}

/* ---------- tablas comparativas ---------- */
.tms-tabla{
  overflow-x:auto; -webkit-overflow-scrolling:touch;
  border:1px solid var(--tms-line); border-radius:16px; background:var(--tms-card);
}
.tms-tabla table{border-collapse:collapse;width:100%;min-width:640px;font-size:14px}
.tms-tabla th{
  text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.06em;
  color:var(--tms-ink3);border-bottom:1px solid var(--tms-line);padding:14px 16px;
}
.tms-tabla td{padding:14px 16px;border-bottom:1px solid var(--tms-line);font-variant-numeric:tabular-nums; color:var(--tms-ink2)}
.tms-tabla tr:last-child td{border-bottom:none}

/* ---------- FAQ acordeón ---------- */
.tms-faq{display:flex; flex-direction:column; gap:10px}
.tms-faq details{
  background:var(--tms-card); border:1px solid var(--tms-line); border-radius:14px;
  padding:0; overflow:hidden;
}
.tms-faq summary{
  font-family:var(--tms-font-body); font-weight:700;font-size:15px;cursor:pointer; color:var(--tms-ink);
  padding:16px 18px; min-height:52px; display:flex; align-items:center; justify-content:space-between; gap:12px;
  list-style:none;
}
.tms-faq summary::-webkit-details-marker{display:none}
.tms-faq summary::after{content:"+"; color:var(--tms-teal); font-size:18px; font-weight:700; flex-shrink:0}
.tms-faq details[open] summary::after{content:"−"}
.tms-faq details p{margin:0; padding:0 18px 16px; font-size:14.5px; line-height:1.65; color:var(--tms-ink2)}

/* ---------- migas y meta ---------- */
.tms-crumb{font-size:13px;color:var(--tms-faint)}
.tms-crumb a{color:var(--tms-ink3);text-decoration:none}
.tms-artmeta{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--tms-ink3);border-bottom:1px solid var(--tms-line);padding-bottom:16px}

/* ---------- responsive: carrusel de tarjetas en móvil ---------- */
@media(max-width:799px){
  .tms-rail{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-bottom:14px}
  .tms-rail > *{flex:0 0 82%;scroll-snap-align:start}
  .tms-rail.wp-block-columns{flex-wrap:nowrap !important}
}

/* ---------- revelado al hacer scroll ---------- */
[data-reveal]{transition:opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1)}
[data-reveal].tms-pre{opacity:0; transform:translateY(24px)}
@media (prefers-reduced-motion: reduce){
  [data-reveal].tms-pre{opacity:1; transform:none}
}

/* ---------- CTA sticky móvil ---------- */
.tms-sticky-cta{
  position:fixed; left:16px; right:16px; bottom:16px; z-index:60;
  display:none; place-items:center; min-height:52px;
  background:var(--tms-accent); color:var(--tms-on-accent); font-weight:800; font-size:15.5px;
  border-radius:16px; box-shadow:0 10px 30px rgba(4,18,12,.6); text-align:center; padding:0 18px;
}
.tms-sticky-cta.tms-show{display:grid}
@media(min-width:721px){ .tms-sticky-cta{display:none !important} }

/* ---------- footer ---------- */
footer.site-footer, #colophon{
  background:var(--tms-paper) !important; border-top:1px solid var(--tms-line);
  color:var(--tms-faint);
}
footer.site-footer a, #colophon a{color:var(--tms-ink3)}
footer.site-footer a:hover, #colophon a:hover{color:var(--tms-teal)}
