/* ============================================================
   TRADESOFT — Estilo CLARO para el contenido original de la web
   Selectores por patrón: valen para tss-/sda-/tst-/ts-/pb-
   ============================================================ */
.tspage{--p:#0FA697;--p2:#0B8578;--ink:#0B1F3A;--soft:#3f5168;--gray:#5f7185;--line:#e5e9f0;--mint:#e9f6f4;--bg:#f7f9fc;
  background:#fff;color:var(--soft);font-family:'Inter',sans-serif;overflow-x:hidden;}
.tspage h1,.tspage h2,.tspage h3,.tspage h4{color:var(--ink);letter-spacing:-.02em;line-height:1.15}
.tspage a{color:var(--p)}

/* wrappers / secciones */
.tspage [class*="-wrapper"]{max-width:1160px;margin:0 auto;padding:26px 20px 70px}
.tspage section{margin-bottom:14px}

/* HERO */
.tspage [class*="-hero"]{position:relative;background:#fff;border:1px solid var(--line);border-radius:20px;padding:46px 44px;margin-bottom:34px;overflow:hidden}
.tspage [class*="-hero"]:before{content:"";position:absolute;inset:0;
  background-image:linear-gradient(rgba(11,31,58,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(11,31,58,.03) 1px,transparent 1px);
  background-size:40px 40px;mask-image:radial-gradient(600px 300px at 75% 20%,#000,transparent 75%);pointer-events:none}
.tspage [class*="-hero"]>*{position:relative}
.tspage [class*="-hero-top"]{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.tspage [class*="-hero"] h1{font-size:clamp(1.9rem,3.8vw,3rem);font-weight:850;margin:.2rem 0}
.tspage [class*="-hero"] p{font-size:1.12rem;color:var(--soft);max-width:760px}
.tspage [class*="-hero-cta"]{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0 8px}

/* BADGES / CHIPS */
.tspage [class*="-badge"]{display:inline-flex;align-items:center;gap:8px;font-size:.8rem;font-weight:700;
  color:var(--p2);background:var(--mint);border:1px solid #cfeae5;padding:.42rem .9rem;border-radius:8px}
.tspage [class*="-chips"]{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.tspage [class*="-chip"]{display:inline-flex;align-items:center;gap:8px;font-size:.84rem;font-weight:600;color:var(--soft);
  background:#fff;border:1px solid var(--line);padding:.45rem .8rem;border-radius:8px}
.tspage [class*="-chip"] i,.tspage [class*="-badge"] i{color:var(--p)}

/* BOTONES */
.tspage [class*="-btn"]{display:inline-flex;align-items:center;gap:9px;font-weight:650;text-decoration:none;
  padding:.72rem 1.4rem;border-radius:12px;border:1.5px solid var(--line);color:var(--ink);background:#fff;transition:.2s}
.tspage [class*="-btn"]:hover{border-color:var(--p);color:#0A6E64;background:var(--mint)}
.tspage [class*="-btn"].primary,.tspage [class*="-btn"][class*="primary"]{
  background:var(--ink);border:0;color:#fff}
.tspage [class*="-btn"].primary:hover{background:var(--p2);color:#fff}

/* GRID de tarjetas */
.tspage [class*="-grid"]{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;margin:12px 0 8px}
.tspage [class*="-card"]{background:#fff;border:1px solid var(--line);border-radius:14px;padding:26px;box-shadow:0 1px 2px rgba(11,31,58,.05);transition:.2s}
.tspage [class*="-card"]:hover{transform:translateY(-4px);box-shadow:0 10px 30px rgba(11,31,58,.08);border-color:#d4dbe8}
.tspage [class*="-card"]>i:first-child,.tspage [class*="-card"] .fa-solid:first-child{
  display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:14px;
  background:var(--ink);color:#fff;font-size:1.2rem;margin-bottom:14px}
.tspage [class*="-card"] h2,.tspage [class*="-card"] h3,.tspage [class*="-card"] h4{font-size:1.2rem;margin:.2rem 0 .6rem}

/* LISTAS con viñeta (title + desc) */
.tspage [class*="-list"]{list-style:none;padding:0;margin:0}
.tspage [class*="-bullet"]{position:relative;padding:14px 0 14px 34px;border-top:1px solid var(--line)}
.tspage [class*="-bullet"]:first-child{border-top:0}
.tspage [class*="-bullet"]:before{content:"\f00c";font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;left:0;top:15px;
  color:#0A6E64;background:var(--mint);width:22px;height:22px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:.72rem}
.tspage [class*="-li-title"]{font-weight:700;color:var(--ink);margin-bottom:3px}
.tspage [class*="-li-desc"]{color:var(--gray);margin:0;font-size:.96rem}

/* KPIs / métricas */
.tspage [class*="-kpis"]{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin:18px 0}
.tspage [class*="-kpi"]{background:linear-gradient(160deg,#0c2242,#0a1830);border:1px solid #13294a;border-radius:14px;padding:18px 20px;text-align:center}
.tspage [class*="-kpi"] .lbl{color:#9fb0c8;font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.tspage [class*="-kpi"] .val{color:#5fe3cf;font-size:1.7rem;font-weight:850;font-family:ui-monospace,Menlo,monospace}

/* Reseñas (Opiniones) */
.tspage [class*="-review-card"]{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:0 6px 20px rgba(12,33,41,.05)}
.tspage [class*="-review-stars"]{color:#00b67a}
.tspage [class*="-avatar"]{width:44px;height:44px;border-radius:50%;background:linear-gradient(120deg,#0FB6A2,#0891B2);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700}
.tspage [class*="-review-top"],.tspage [class*="-review-user"]{display:flex;align-items:center;gap:12px}
.tspage [class*="-review-title"]{font-weight:700;color:var(--ink);margin:.5rem 0 .3rem}
.tspage [class*="-review-text"]{color:var(--gray)}
.tspage [class*="-user-name"]{font-weight:700;color:var(--ink)}
.tspage [class*="-review-date"],.tspage [class*="-review-quote"]{color:var(--gray)}
.tspage [class*="-review-quote"]{opacity:.12}

/* pills / features varias */
.tspage [class*="-pill"]{display:inline-flex;align-items:center;gap:8px;background:var(--mint);color:#0A6E64;border:1px solid #cfeae5;padding:.4rem .8rem;border-radius:999px;font-size:.82rem;font-weight:600;margin:.15rem}

/* titulares de sección sueltos */
.tspage h2{font-size:clamp(1.5rem,2.6vw,2rem);font-weight:800;margin:34px 0 14px}
.tspage h3{font-size:1.25rem;margin:22px 0 10px}
.tspage p{margin:0 0 1rem}
.tspage [class*="-disclaimer"],.tspage small{color:var(--gray);font-size:.85rem}
.tspage img{max-width:100%;border-radius:16px}
.tspage iframe{max-width:100%;border-radius:16px;border:0}
@media(max-width:640px){.tspage [class*="-hero"]{padding:28px 20px}}

/* Fix: los "-hero-icon" no son tarjetas hero, son iconos pequeños */
.tspage [class*="-hero-icon"]{background:linear-gradient(120deg,#12406e,#0b8578)!important;border:0!important;border-radius:16px!important;width:58px!important;height:58px!important;min-height:0!important;padding:0!important;margin:0 0 1.1rem!important;display:flex!important;align-items:center;justify-content:center;overflow:visible;position:relative}
.tspage [class*="-hero-icon"]:before{content:"\f135"!important;font-family:"Font Awesome 6 Free"!important;font-weight:900!important;color:#fff!important;font-size:1.5rem!important;position:static!important;inset:auto!important;background:none!important;width:auto!important;height:auto!important;mask:none!important;-webkit-mask:none!important}
.tspage [class*="-hero-icon"]:after{display:none!important}