/* Financore Platform — Guías co-branded para clientes
   Uso: <link rel="stylesheet" href="/assets/guia-cliente.css">
   El bloque .cobrand se rellena automáticamente con los datos del partner. */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Merriweather:wght@700;900&display=swap');

:root{
  --navy:#0D2B55; --navy-pale:#E8EFF9;
  --blue:#1565C0; --blue-pale:#E3F0FD;
  --gold:#E8A020; --gold-light:#F5BC4A; --gold-pale:#FEF6E4;
  --gray-100:#F4F6FA; --gray-200:#E8ECF3; --gray-400:#9BA8BB;
  --gray-600:#5A6680; --gray-800:#1E2A3A;
  --red:#C62828; --red-pale:#FDECEA;
  --green:#2E7D32; --green-pale:#E8F5E9;
  --sh:0 2px 10px rgba(13,43,85,.07);
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Inter',sans-serif;background:var(--gray-100);color:var(--gray-800);line-height:1.68;-webkit-font-smoothing:antialiased}
.wrap{max-width:740px;margin:0 auto;padding:0 24px}

/* Barra co-brand — se rellena con los datos del partner */
.cobrand{background:#fff;border-bottom:1px solid var(--gray-200);padding:16px 0}
.cobrand-in{max-width:740px;margin:0 auto;padding:0 24px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.cobrand .partner{display:flex;align-items:center;gap:12px}
.cobrand .partner img{max-height:38px;width:auto}
.cobrand .partner .txt strong{display:block;font-size:15px;color:var(--navy);font-weight:800;line-height:1.3}
.cobrand .partner .txt span{font-size:12.5px;color:var(--gray-400)}
.cobrand .powered{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.cobrand .powered .lbl{font-size:10px;color:var(--gray-400);letter-spacing:1.2px;text-transform:uppercase;font-weight:600}
.cobrand .powered img{height:26px;width:auto;display:block}

/* Hero */
.hero{background:linear-gradient(150deg,#0D2B55 0%,#1565C0 100%);padding:56px 24px 48px;color:#fff}
.kick{display:inline-block;background:rgba(255,255,255,.13);color:var(--gold-light);font-size:10.5px;font-weight:800;letter-spacing:2.4px;text-transform:uppercase;padding:6px 14px;border-radius:100px;margin-bottom:18px}
.hero h1{font-family:'Merriweather',serif;font-weight:900;font-size:clamp(27px,4.2vw,38px);line-height:1.2;letter-spacing:-.8px;margin-bottom:14px}
.hero h1 em{color:var(--gold-light);font-style:italic}
.hero .sub{font-weight:300;font-size:16.5px;color:rgba(255,255,255,.84);max-width:580px}

/* Secciones */
section{padding:48px 0}
.w{background:#fff} .g{background:var(--gray-100)}
h2{font-family:'Merriweather',serif;font-weight:900;font-size:clamp(21px,3vw,28px);color:var(--navy);line-height:1.26;letter-spacing:-.4px;margin-bottom:12px}
h2 em{color:var(--blue);font-style:italic}
h3{font-size:17.5px;font-weight:800;color:var(--navy);margin:26px 0 9px;line-height:1.35}
h3:first-child{margin-top:0}
p{font-size:15.5px;color:var(--gray-600);margin-bottom:13px}
p strong{color:var(--gray-800);font-weight:700}
.lead{font-size:16.5px;margin-bottom:20px}

/* Tablas */
table{width:100%;border-collapse:collapse;background:#fff;border-radius:11px;overflow:hidden;box-shadow:var(--sh);font-size:14.5px;margin:18px 0}
th{background:var(--navy);color:#fff;text-align:left;padding:12px 15px;font-size:11px;letter-spacing:1.3px;text-transform:uppercase;font-weight:700}
td{padding:12px 15px;border-bottom:1px solid var(--gray-200);color:var(--gray-600);vertical-align:top}
tr:last-child td{border-bottom:none}
td:first-child{font-weight:700;color:var(--gray-800)}
.ok{color:var(--green);font-weight:800}
.no{color:var(--red);font-weight:800}
.care{color:#9A6B0F;font-weight:800}

/* Bloques */
.blk{border-radius:11px;padding:18px 22px;margin:18px 0;font-size:15.5px;line-height:1.6}
.b-red{background:var(--red-pale);border-left:4px solid var(--red)}
.b-green{background:var(--green-pale);border-left:4px solid var(--green)}
.b-gold{background:var(--gold-pale);border-left:4px solid var(--gold)}
.b-gray{background:var(--gray-100);border-left:4px solid var(--gray-400)}
.blk b.t{display:block;font-size:10.5px;letter-spacing:1.7px;text-transform:uppercase;margin-bottom:7px;font-weight:800}
.b-red b.t{color:var(--red)} .b-green b.t{color:var(--green)}
.b-gold b.t{color:#9A6B0F} .b-gray b.t{color:var(--gray-600)}
.blk p{margin-bottom:8px;color:inherit;font-size:15.5px}
.blk p:last-child{margin-bottom:0}

/* Listas */
ul.cl{list-style:none;margin:12px 0 16px}
ul.cl li{position:relative;padding-left:24px;margin-bottom:9px;font-size:15.5px;color:var(--gray-600)}
ul.cl li::before{content:'';position:absolute;left:0;top:10px;width:6px;height:6px;border-radius:50%;background:var(--gold)}
ul.cl li strong{color:var(--gray-800)}

/* Pasos numerados */
.steps{counter-reset:s;list-style:none;margin:18px 0}
.steps li{counter-increment:s;position:relative;padding-left:46px;margin-bottom:20px}
.steps li::before{content:counter(s);position:absolute;left:0;top:0;width:32px;height:32px;border-radius:50%;background:var(--navy);color:var(--gold-light);font-family:'Merriweather',serif;font-weight:900;font-size:14px;display:flex;align-items:center;justify-content:center}
.steps li strong{display:block;font-size:16.5px;color:var(--navy);font-weight:800;margin-bottom:4px}
.steps li span{font-size:15.5px;color:var(--gray-600)}

/* Destacado numérico */
.hl{background:var(--navy);border-radius:12px;padding:26px;text-align:center;color:#fff;margin:20px 0}
.hl b{display:block;font-family:'Merriweather',serif;font-size:38px;font-weight:900;color:var(--gold-light);line-height:1}
.hl span{display:block;font-size:15px;color:rgba(255,255,255,.82);margin-top:8px}

/* CTA final del partner */
.cta{background:var(--gold-pale);border-top:1px solid rgba(232,160,32,.25);padding:48px 24px;text-align:center}
.cta h2{margin-bottom:10px}
.cta p{max-width:520px;margin:0 auto 8px}
.cta .contact{margin-top:18px;font-size:15px;color:var(--gray-800);font-weight:600}

footer{background:var(--navy);color:rgba(255,255,255,.6);padding:34px 24px 24px;font-size:13.5px}
.fin{max-width:740px;margin:0 auto}
.fb{margin-bottom:10px}
.fb img{height:30px;width:auto;display:block}
.fbot{margin-top:18px;padding-top:15px;border-top:1px solid rgba(255,255,255,.1);font-size:11.5px;color:rgba(255,255,255,.36);line-height:1.6}

@media(max-width:640px){
  .hero{padding:44px 20px 38px} section{padding:36px 0}
  table{font-size:13px} th,td{padding:9px 11px}
  .cobrand-in{flex-direction:column;align-items:flex-start;gap:10px}
  .cobrand .powered{align-items:flex-start}
}
@media print{
  body{background:#fff}
  .hero{background:var(--navy)!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  section{page-break-inside:avoid}
}
