/* Centro de recursos SEO · UI template de v2.alobri.com (claro / oscuro grafito) */
:root{--bg:#F7F7FA;--card:#FFFFFF;--sub:#F3F4F8;--hover:#F0F1F6;--tx:#0A0F1F;--tx2:#4B5368;--tx3:#8A90A3;--ln:#E7E8EF;--ln2:#D6D9E4;
  --ac:#3D3FE0;--acs:#EFEFFF;--p:#0A0F1F;--ptx:#FFFFFF;--ok:#0C7A50;--oks:#E7F6EF;--wa:#1FAF38;
  --f1:Manrope,Inter,system-ui,sans-serif;--f2:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;--fm:"JetBrains Mono",ui-monospace,monospace;
  --sombra:0 1px 2px rgba(16,20,48,.04),0 12px 32px -12px rgba(16,20,48,.12)}
html.dark{--bg:#0B0D12;--card:#13161D;--sub:#171A22;--hover:#1B1F28;--tx:#F3F4F7;--tx2:#AEB4C2;--tx3:#7C8494;--ln:#22262F;--ln2:#2E333E;
  --ac:#9EA5FF;--acs:#1A1D2E;--p:#F3F4F7;--ptx:#0B0D12;--ok:#5FD3A1;--oks:#0F261C;--sombra:0 1px 2px rgba(0,0,0,.4),0 12px 32px -12px rgba(0,0,0,.6)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:var(--f2);font-size:16px;line-height:1.65;color:var(--tx);background:var(--bg);-webkit-font-smoothing:antialiased}
a{color:var(--ac)}img,video{max-width:100%;display:block}
:focus-visible{outline:3px solid #8A8CFF;outline-offset:2px;border-radius:8px}
.ico{width:18px;height:18px;flex:none;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.cnt{max-width:1180px;margin:0 auto;padding:0 24px}
/* Barra */
.top{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:saturate(170%) blur(16px);-webkit-backdrop-filter:saturate(170%) blur(16px);border-bottom:1px solid var(--ln)}
.top .cnt{display:flex;align-items:center;gap:14px;height:68px}
.marca{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--tx)}
.marca img{height:26px;width:auto}.logo-o{display:none}html.dark .logo-o{display:block}html.dark .logo-c{display:none}
.chip{font-family:var(--fm);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--ln);color:var(--tx2);padding:3px 7px;border-radius:7px;white-space:nowrap}
.nav{display:flex;gap:4px;margin-left:auto;align-items:center}
.nav a.l{color:var(--tx2);text-decoration:none;font-size:14px;font-weight:600;padding:8px 10px;border-radius:10px}.nav a.l:hover{background:var(--hover);color:var(--tx)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:42px;padding:0 16px;border-radius:11px;border:1px solid transparent;font:650 14px var(--f2);text-decoration:none;cursor:pointer;white-space:nowrap}
.btn.p{background:var(--p);color:var(--ptx)}.btn.p:hover{background:color-mix(in srgb,var(--p) 86%,var(--ac))}
.btn.s{background:var(--card);border-color:var(--ln2);color:var(--tx)}.btn.s:hover{background:var(--hover)}
.btn.wa{background:var(--wa);color:#fff}.btn.wa:hover{filter:brightness(1.05)}
.btn.lg{height:50px;padding:0 22px;font-size:15px;border-radius:13px}
.tb{width:40px;height:40px;border-radius:11px;border:1px solid var(--ln);background:var(--card);color:var(--tx);display:grid;place-items:center;cursor:pointer}
/* Migas */
.migas{font-size:13px;color:var(--tx3);margin:22px 0 10px;display:flex;flex-wrap:wrap;gap:6px}.migas a{color:var(--tx2);text-decoration:none}.migas a:hover{text-decoration:underline}
/* Héroe */
.heroe{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:40px;align-items:center;padding:8px 0 36px}
.eb{font-family:var(--fm);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ac);margin-bottom:12px}
h1{font-family:var(--f1);font-size:46px;line-height:1.05;letter-spacing:-.04em;font-weight:800;margin:0 0 16px;text-wrap:balance}
.lead{font-size:18px;color:var(--tx2);margin:0 0 22px}
.acc{display:flex;flex-wrap:wrap;gap:10px}
.heroe figure{margin:0;border-radius:22px;overflow:hidden;box-shadow:var(--sombra);aspect-ratio:4/3;background:var(--sub)}
.heroe figure img{width:100%;height:100%;object-fit:cover}
/* Cuerpo */
.cuerpo{display:grid;grid-template-columns:260px minmax(0,1fr);gap:48px;padding:12px 0 40px;align-items:start}
.indice-lat{position:sticky;top:92px;border:1px solid var(--ln);border-radius:16px;padding:16px;background:var(--card)}
.indice-lat b{display:block;font-family:var(--fm);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--tx3);margin-bottom:8px}
.indice-lat a{display:block;color:var(--tx2);text-decoration:none;font-size:13.5px;padding:6px 8px;border-radius:8px;overflow-wrap:anywhere}.indice-lat a:hover{background:var(--hover);color:var(--tx)}
article{min-width:0;font-size:17px}
article h2{font-family:var(--f1);font-size:30px;letter-spacing:-.03em;line-height:1.15;margin:46px 0 14px;scroll-margin-top:90px}
article h3{font-family:var(--f1);font-size:21px;letter-spacing:-.02em;margin:26px 0 8px}
article p{margin:0 0 16px;color:color-mix(in srgb,var(--tx) 88%,var(--tx2))}
article ul,article ol{margin:0 0 18px;padding-left:22px}article li{margin:6px 0}
.figura{margin:30px 0;border-radius:18px;overflow:hidden;box-shadow:var(--sombra)}.figura img,.figura video{width:100%;height:auto}
.figura figcaption{font-size:13px;color:var(--tx3);padding:10px 14px;background:var(--card)}
/* Bandas y tarjetas */
.banda{margin:34px 0;padding:24px;border-radius:20px;background:var(--p);color:var(--ptx);display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between}
.banda b{font-family:var(--f1);font-size:20px;letter-spacing:-.02em}.banda p{margin:4px 0 0;opacity:.75;font-size:15px;color:inherit}
.banda .btn.s{background:transparent;color:inherit;border-color:color-mix(in srgb,var(--ptx) 35%,transparent)}
.banda .btn.p{background:var(--ptx);color:var(--p)}
.caja{border:1px solid var(--ln);border-radius:18px;background:var(--card);padding:22px;box-shadow:var(--sombra);margin:30px 0}
.caja h3{margin-top:0}
.herr{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:14px 0}
.herr label{display:grid;gap:6px;font-size:13px;font-weight:600;color:var(--tx2)}
.herr input,.herr select,.frm input,.frm select,.frm textarea{height:46px;padding:0 12px;border:1px solid var(--ln2);border-radius:11px;background:var(--bg);color:var(--tx);font:500 15px var(--f2);width:100%}
.frm textarea{height:90px;padding:10px 12px;resize:vertical}
.res{margin-top:14px;padding:16px;border-radius:14px;background:var(--acs);color:var(--tx);font-size:15px}
.res strong{font-family:var(--f1);font-size:26px;letter-spacing:-.02em;display:block;color:var(--ac)}
.faq details{border:1px solid var(--ln);border-radius:14px;background:var(--card);margin:10px 0;padding:0 18px}
.faq summary{cursor:pointer;font-weight:700;padding:16px 0;list-style:none;display:flex;gap:12px;justify-content:space-between}
.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:"+";color:var(--tx3);font-size:20px;line-height:1}
.faq details[open] summary::after{content:"–"}.faq details p{margin:0 0 16px}
.etiquetas{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.etiquetas span{border:1px solid var(--ln);border-radius:999px;padding:6px 12px;font-size:13px;color:var(--tx2);background:var(--card)}
.rejilla{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.tarjeta{display:flex;flex-direction:column;border:1px solid var(--ln);border-radius:18px;background:var(--card);overflow:hidden;text-decoration:none;color:var(--tx);box-shadow:var(--sombra);transition:transform .12s}
.tarjeta:hover{transform:translateY(-2px)}.tarjeta img{aspect-ratio:16/9;object-fit:cover;width:100%}
.tarjeta div{padding:14px 16px 18px}.tarjeta b{font-family:var(--f1);font-size:16px;letter-spacing:-.01em;display:block;overflow-wrap:anywhere}
.tarjeta small{color:var(--tx3);font-size:12.5px;display:block;margin-top:6px}
/* Final */
.final{margin:56px 0 0;padding:44px 0;border-top:1px solid var(--ln)}
.final .cnt{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:40px;align-items:start}
.final h2{font-family:var(--f1);font-size:34px;letter-spacing:-.035em;margin:0 0 12px}
.vias{display:grid;gap:10px;margin-top:18px}.vias a{display:flex;align-items:center;gap:12px;padding:14px 16px;border:1px solid var(--ln);border-radius:14px;background:var(--card);color:var(--tx);text-decoration:none;font-weight:600}
.vias a:hover{background:var(--hover)}.vias small{display:block;font-weight:400;color:var(--tx3);font-size:13px}
.frm{display:grid;gap:12px}.frm .dos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.frm .ok{display:none;padding:14px;border-radius:12px;background:var(--oks);color:var(--ok);font-weight:600}
.pie{padding:28px 0 90px;color:var(--tx3);font-size:13px;border-top:1px solid var(--ln)}.pie .cnt{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between}.pie a{color:var(--tx2);text-decoration:none}
.paises{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.paises a{display:flex;justify-content:space-between;gap:10px;padding:14px 16px;border:1px solid var(--ln);border-radius:14px;background:var(--card);text-decoration:none;color:var(--tx);font-weight:600}
.paises a small{color:var(--tx3);font-weight:400}
.wa-flota{position:fixed;left:18px;bottom:18px;z-index:60;width:54px;height:54px;border-radius:50%;background:var(--wa);display:grid;place-items:center;box-shadow:0 12px 30px -8px rgba(31,175,56,.6)}
.wa-flota svg{width:28px;height:28px;fill:#fff}
@media (max-width:960px){
  h1{font-size:34px}.heroe,.cuerpo,.final .cnt{grid-template-columns:1fr}.indice-lat{display:none}
  .nav a.l{display:none}article h2{font-size:25px}.frm .dos{grid-template-columns:1fr}
}
@media print{.top,.wa-flota,.final,.banda{display:none}}
