/* ===========================================================
   PyME-Commerce — sistema de diseño
   Paleta: navy #0F2740 · teal #0D9488 · slate #F4F6FB · amber #F59E0B
   Display: Bricolage Grotesque · Texto: Inter
   =========================================================== */

:root{
  --navy:#0b2350; --navy-700:#0f2c63; --navy-600:#143a7e;
  --teal:#0a6fe0; --teal-600:#0a5fc4; --teal-50:#e7f1fd;
  --amber:#f5821f; --amber-50:#ffe9d3;
  --slate:#f4f6fb; --slate-200:#e6eaf2; --line:#e2e8f0;
  --ink:#0b2350; --muted:#5b6b80; --muted-2:#8493a6;
  --white:#ffffff;
  --ok:#15803d; --err:#c0392b;
  --radius:18px; --radius-sm:12px; --radius-lg:26px;
  --shadow-sm:0 1px 2px rgba(15,39,64,.06), 0 2px 8px rgba(15,39,64,.05);
  --shadow:0 10px 30px rgba(15,39,64,.08);
  --shadow-lg:0 30px 60px rgba(15,39,64,.14);
  --maxw:1140px;
  --display:"Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --body:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} *{animation:none!important;transition:none!important} }
body{
  margin:0; font-family:var(--body); color:var(--ink); background:var(--white);
  font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block}
a{color:var(--teal-600); text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{font-family:var(--display); font-weight:700; line-height:1.08; letter-spacing:-.02em; color:var(--navy); margin:0 0 .4em}
h1{font-size:clamp(2.1rem,5.2vw,3.6rem)}
h2{font-size:clamp(1.7rem,3.6vw,2.5rem)}
h3{font-size:1.25rem}
p{margin:0 0 1rem}
.lead{font-size:1.18rem; color:var(--muted)}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 22px}
.narrow{max-width:760px; margin-inline:auto}
section{padding:74px 0}
.eyebrow{display:inline-flex; align-items:center; gap:8px; font-family:var(--body); font-weight:700;
  text-transform:uppercase; letter-spacing:.12em; font-size:.72rem; color:var(--teal-600); margin-bottom:14px}
.eyebrow::before{content:"\25C6"; color:var(--amber); font-size:.7rem}
.center{text-align:center}
.muted{color:var(--muted)}

/* ---------- botones ---------- */
.btn{display:inline-flex; align-items:center; gap:9px; font-family:var(--body); font-weight:700;
  font-size:1rem; border-radius:999px; padding:14px 26px; cursor:pointer; border:2px solid transparent;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease; text-decoration:none; line-height:1}
.btn:hover{text-decoration:none; transform:translateY(-2px)}
.btn-primary{background:var(--amber); color:#3a2400; box-shadow:0 8px 22px rgba(245,130,31,.32)}
.btn-primary:hover{box-shadow:0 12px 30px rgba(245,130,31,.42)}
.btn-dark{background:var(--navy); color:#fff}
.btn-dark:hover{background:var(--navy-700)}
.btn-teal{background:var(--teal); color:#fff}
.btn-teal:hover{background:var(--teal-600)}
.btn-ghost{background:transparent; color:var(--navy); border-color:var(--line)}
.btn-ghost:hover{border-color:var(--teal); color:var(--teal-600)}
.btn-lg{padding:17px 32px; font-size:1.08rem}
.btn:focus-visible, a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
  outline:3px solid var(--teal); outline-offset:2px}

/* ---------- header ---------- */
.site-header{position:sticky; top:0; z-index:100; background:rgba(255,255,255,.86);
  backdrop-filter:saturate(160%) blur(10px); border-bottom:1px solid var(--line)}
.nav{display:flex; align-items:center; gap:20px; height:68px}
.brand{display:flex; align-items:center; gap:10px; flex:0 0 auto; font-family:var(--display); font-weight:800;
  font-size:1.18rem; color:var(--navy); letter-spacing:-.02em}
.brand:hover{text-decoration:none}
.brand .mark{width:30px; height:30px; flex:0 0 auto}
.brand .logo-img{height:38px; width:120px; max-width:none; flex:0 0 auto; object-fit:contain; display:block}
@media (max-width:480px){ .brand .logo-img{height:32px; width:101px} }
.foot-logo{display:inline-block; background:#fff; border-radius:12px; padding:10px 14px; margin-bottom:14px; box-shadow:var(--shadow-sm)}
.foot-logo img{height:40px; width:auto; display:block}
.nav-links{display:flex; gap:2px; margin-left:auto; align-items:center}
.nav-links a{color:var(--navy); font-weight:600; font-size:.93rem; padding:9px 11px; border-radius:10px; white-space:nowrap}
.nav-links a:hover{background:var(--slate); text-decoration:none}
.nav-links a[aria-current="page"]{color:var(--teal-600)}
.nav-cta{margin-left:6px}
.nav-toggle{display:none; margin-left:auto; background:none; border:1px solid var(--line); border-radius:10px;
  width:44px; height:44px; cursor:pointer; align-items:center; justify-content:center}
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{content:""; display:block; width:20px; height:2px;
  background:var(--navy); position:relative; transition:.2s}
.nav-toggle span::before{position:absolute; top:-6px} .nav-toggle span::after{position:absolute; top:6px}

@media (max-width:1040px){
  .nav-toggle{display:inline-flex}
  .nav-links{position:fixed; inset:68px 0 auto 0; background:#fff; flex-direction:column; align-items:stretch;
    gap:2px; padding:14px 22px 22px; border-bottom:1px solid var(--line); box-shadow:var(--shadow);
    transform:translateY(-12px); opacity:0; pointer-events:none; transition:.2s}
  .nav-links.open{transform:none; opacity:1; pointer-events:auto}
  .nav-links a{padding:13px; font-size:1.05rem}
  .nav-cta{margin:8px 0 0}
  .nav-cta .btn{width:100%; justify-content:center}
}

/* ---------- hero ---------- */
.hero{position:relative; overflow:hidden; background:
   radial-gradient(1100px 500px at 85% -10%, var(--teal-50), transparent 60%),
   radial-gradient(900px 500px at -10% 10%, #eef2fb, transparent 55%), var(--white)}
.hero .wrap{display:grid; grid-template-columns:1.05fr .95fr; gap:46px; align-items:center; padding-top:64px; padding-bottom:64px}
.hero h1{margin-bottom:.35em}
.hero .pill{display:inline-flex; gap:8px; align-items:center; background:#fff; border:1px solid var(--line);
  border-radius:999px; padding:7px 14px; font-size:.82rem; font-weight:600; color:var(--navy); box-shadow:var(--shadow-sm); margin-bottom:20px}
.hero .pill b{color:var(--teal-600)}
.hero-cta{display:flex; gap:12px; flex-wrap:wrap; margin:26px 0 16px}
.trust-line{display:flex; gap:18px; flex-wrap:wrap; color:var(--muted); font-size:.9rem; margin-top:10px}
.trust-line span{display:inline-flex; gap:7px; align-items:center}
.trust-line svg{color:var(--teal)}
.hero-art{position:relative}
.hero-art img{width:100%; border-radius:var(--radius-lg); }
@media (max-width:900px){ .hero .wrap{grid-template-columns:1fr; gap:30px} .hero-art{order:-1} }

/* ---------- secciones de color ---------- */
.section-slate{background:var(--slate)}
.section-navy{background:var(--navy); color:#cdd9e6}
.section-navy h2,.section-navy h3{color:#fff}
.section-navy .eyebrow{color:#5ee3d3}
.section-navy .muted{color:#9fb2c6}

/* ---------- grid utilitario ---------- */
.grid{display:grid; gap:22px}
.g-2{grid-template-columns:repeat(2,1fr)} .g-3{grid-template-columns:repeat(3,1fr)} .g-4{grid-template-columns:repeat(4,1fr)}
@media (max-width:880px){ .g-3,.g-4{grid-template-columns:repeat(2,1fr)} }
@media (max-width:560px){ .g-2,.g-3,.g-4{grid-template-columns:1fr} }
.section-head{max-width:720px; margin:0 auto 42px; text-align:center}

/* ---------- tarjetas ---------- */
.card{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:26px; box-shadow:var(--shadow-sm);
  transition:transform .18s ease, box-shadow .18s ease}
.card:hover{transform:translateY(-4px); box-shadow:var(--shadow)}
.card .ic{width:54px; height:54px; border-radius:14px; background:var(--teal-50); display:flex; align-items:center;
  justify-content:center; margin-bottom:16px; color:var(--teal-600)}
.card .ic svg{width:28px; height:28px}
.card h3{margin-bottom:.35em}
.card p{color:var(--muted); margin:0; font-size:.97rem}

/* ---------- problema/solución ---------- */
.split{display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center}
@media (max-width:820px){ .split{grid-template-columns:1fr; gap:26px} }
.checklist{list-style:none; padding:0; margin:0; display:grid; gap:12px}
.checklist li{display:flex; gap:12px; align-items:flex-start}
.checklist .tick{flex:0 0 auto; width:24px; height:24px; border-radius:50%; background:var(--teal-50); color:var(--teal-600);
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:.85rem; margin-top:2px}
.crosslist .tick{background:#fdecec; color:#c0392b}

/* ---------- pasos ---------- */
.steps{counter-reset:step; display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
@media (max-width:760px){ .steps{grid-template-columns:1fr} }
.step{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:28px; position:relative}
.step .n{font-family:var(--display); font-weight:800; font-size:1.05rem; color:var(--teal-600);
  display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:50%;
  background:var(--teal-50); margin-bottom:14px}
.step img{width:84px; height:84px; margin-bottom:10px}

/* ---------- mockup ---------- */
.showcase{display:grid; grid-template-columns:1fr 1fr; gap:34px; align-items:center}
@media (max-width:820px){ .showcase{grid-template-columns:1fr} }
.frame{background:#fff; border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden}

/* ---------- planes ---------- */
.plans{display:grid; grid-template-columns:repeat(4,1fr); gap:18px; align-items:stretch}
@media (max-width:1040px){ .plans{grid-template-columns:repeat(2,1fr)} }
@media (max-width:540px){ .plans{grid-template-columns:1fr} }
.plan{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:26px 24px; display:flex; flex-direction:column}
.plan.feat{border:2px solid var(--teal); box-shadow:var(--shadow); position:relative}
.plan.feat::before{content:"Recomendado"; position:absolute; top:-12px; left:24px; background:var(--teal); color:#fff;
  font-size:.72rem; font-weight:700; padding:4px 12px; border-radius:999px; letter-spacing:.04em}
.plan .pname{font-family:var(--display); font-weight:800; font-size:1.3rem; color:var(--navy)}
.plan .price{font-family:var(--display); font-weight:800; font-size:2rem; color:var(--navy); margin:8px 0 2px}
.plan .price small{font-size:.85rem; font-weight:600; color:var(--muted)}
.plan .who{color:var(--muted); font-size:.9rem; min-height:42px; margin-bottom:14px}
.plan ul{list-style:none; padding:0; margin:0 0 20px; display:grid; gap:9px; font-size:.93rem}
.plan ul li{display:flex; gap:9px; align-items:flex-start}
.plan ul li::before{content:"\2713"; color:var(--teal-600); font-weight:800}
.plan ul li.off{color:var(--muted-2)}
.plan ul li.off::before{content:"\2014"; color:var(--muted-2)}
.plan .btn{margin-top:auto; width:100%; justify-content:center}

/* ---------- tabla comparativa ---------- */
.table-wrap{overflow-x:auto; border:1px solid var(--line); border-radius:var(--radius)}
table.cmp{width:100%; border-collapse:collapse; background:#fff; min-width:640px}
table.cmp th, table.cmp td{padding:13px 16px; text-align:left; border-bottom:1px solid var(--line); font-size:.95rem}
table.cmp thead th{background:var(--slate); font-family:var(--display); color:var(--navy)}
table.cmp td.c, table.cmp th.c{text-align:center}
table.cmp .yes{color:var(--teal-600); font-weight:800}
table.cmp .no{color:var(--muted-2)}

/* ---------- rubros ---------- */
.chips{display:flex; flex-wrap:wrap; gap:10px; justify-content:center}
.chip{background:#fff; border:1px solid var(--line); border-radius:999px; padding:10px 18px; font-weight:600; font-size:.95rem; color:var(--navy)}
.chip:hover{border-color:var(--teal); color:var(--teal-600)}

/* ---------- testimonios ---------- */
.quote{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:26px; box-shadow:var(--shadow-sm)}
.quote p{font-size:1.02rem; color:var(--ink)}
.quote .who{display:flex; align-items:center; gap:12px; margin-top:14px}
.quote .who img{width:46px; height:46px; border-radius:50%}
.quote .who b{display:block; color:var(--navy); font-family:var(--display)}
.quote .who span{color:var(--muted); font-size:.85rem}

/* ---------- FAQ ---------- */
.faq{max-width:820px; margin:0 auto; display:grid; gap:10px}
.faq details{background:#fff; border:1px solid var(--line); border-radius:var(--radius-sm); padding:4px 20px}
.faq summary{font-family:var(--display); font-weight:700; color:var(--navy); cursor:pointer; padding:16px 0; list-style:none;
  display:flex; justify-content:space-between; align-items:center; gap:14px; font-size:1.05rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; font-size:1.4rem; color:var(--teal-600); transition:.2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--muted); margin:0 0 16px}

/* ---------- CTA band ---------- */
.cta-band{background:linear-gradient(120deg, var(--navy), var(--teal-600)); color:#fff; border-radius:var(--radius-lg);
  padding:54px; text-align:center; position:relative; overflow:hidden}
.cta-band h2{color:#fff}
.cta-band p{color:#d6e6e2; max-width:560px; margin-inline:auto}
.cta-band .btn-primary{margin-top:8px}

/* ---------- formularios ---------- */
.field{margin-bottom:16px}
.field label{display:block; font-weight:600; font-size:.92rem; margin-bottom:6px; color:var(--navy)}
.field .req{color:var(--err)}
.field input, .field select, .field textarea{width:100%; padding:13px 14px; border:1px solid var(--line);
  border-radius:12px; font-size:1rem; font-family:var(--body); background:#fff}
.field small{color:var(--muted); font-size:.82rem}
.field .error{color:var(--err); font-size:.85rem; margin-top:4px; display:none}
.field.invalid input, .field.invalid select{border-color:var(--err)}
.field.invalid .error{display:block}
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:0 18px}
@media (max-width:620px){ .form-grid{grid-template-columns:1fr} }
.form-card{background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:30px; box-shadow:var(--shadow)}
.plan-pick{display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:6px}
@media (max-width:680px){ .plan-pick{grid-template-columns:repeat(2,1fr)} }
.plan-pick label{border:2px solid var(--line); border-radius:14px; padding:12px; cursor:pointer; text-align:center; font-weight:700; color:var(--navy); display:block}
.plan-pick input{position:absolute; opacity:0}
.plan-pick input:checked + .pp{outline:2px solid var(--teal); border-radius:10px}
.plan-pick label:has(input:checked){border-color:var(--teal); background:var(--teal-50)}
.plan-pick small{display:block; font-weight:500; color:var(--muted); font-size:.78rem}

/* ---------- footer ---------- */
.site-footer{background:var(--navy); color:#aebfd2; padding:56px 0 28px; font-size:.93rem}
.site-footer a{color:#cdd9e6}
.site-footer a:hover{color:#fff}
.foot-grid{display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:30px; margin-bottom:34px}
@media (max-width:760px){ .foot-grid{grid-template-columns:1fr 1fr} }
@media (max-width:460px){ .foot-grid{grid-template-columns:1fr} }
.site-footer h4{color:#fff; font-size:.95rem; margin-bottom:14px; font-family:var(--display)}
.site-footer ul{list-style:none; padding:0; margin:0; display:grid; gap:9px}
.foot-brand .brand{color:#fff; margin-bottom:12px}
.foot-bottom{border-top:1px solid rgba(255,255,255,.12); padding-top:20px; display:flex; justify-content:space-between;
  gap:14px; flex-wrap:wrap; color:#8aa0ba; font-size:.85rem}

/* ---------- artículo / legal ---------- */
.article{max-width:760px; margin:0 auto}
.article h2{margin-top:1.6em} .article h3{margin-top:1.3em}
.article ul, .article ol{padding-left:1.2em} .article li{margin-bottom:.4em}
.breadcrumbs{font-size:.85rem; color:var(--muted); margin-bottom:18px}
.page-hero{padding:64px 0 30px; background:
  radial-gradient(900px 400px at 100% -20%, var(--teal-50), transparent 60%), var(--slate)}
.page-hero .eyebrow{justify-content:flex-start}
.tag{display:inline-block; background:var(--teal-50); color:var(--teal-600); border-radius:999px; padding:4px 12px; font-size:.78rem; font-weight:700}

/* ---------- detalle de funcionalidad ---------- */
.feature-row{display:grid; grid-template-columns:1fr 1fr; gap:36px; align-items:center; padding:30px 0; border-bottom:1px solid var(--line)}
.feature-row:nth-child(even) .fr-art{order:-1}
@media (max-width:820px){ .feature-row{grid-template-columns:1fr; gap:18px} .feature-row:nth-child(even) .fr-art{order:0} }
.fr-art img{border-radius:var(--radius); border:1px solid var(--line)}

.reveal{opacity:0; transform:translateY(16px); transition:opacity .6s ease, transform .6s ease}
.reveal.in{opacity:1; transform:none}

.note{background:var(--amber-50); border:1px solid #fcd97a; border-radius:12px; padding:14px 16px; font-size:.92rem; color:#7a5500}
.skip-link{position:absolute; left:-9999px}
.skip-link:focus{left:14px; top:10px; z-index:200; background:#fff; padding:10px 16px; border-radius:10px; box-shadow:var(--shadow)}

/* ===================== Landing "¿Por qué nosotros?" ===================== */
.vs-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:10px}
@media(max-width:880px){.vs-cards{grid-template-columns:1fr}}
.altc{border:1px solid var(--line);border-radius:var(--radius);padding:24px;background:var(--white);box-shadow:var(--shadow-sm);position:relative;overflow:hidden}
.altc::before{content:"";position:absolute;inset:0 0 auto 0;height:5px}
.altc .tagline{font-family:var(--body);font-weight:700;font-size:.74rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted-2)}
.altc h3{margin:8px 0 4px;font-size:1.18rem}
.altc ul{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:9px}
.altc ul li{display:flex;gap:9px;align-items:flex-start;color:var(--muted);font-size:.95rem;line-height:1.45}
.altc ul li::before{content:"–";color:var(--muted-2);font-weight:800;flex:0 0 auto}
.altc .cost{margin-top:16px;padding-top:14px;border-top:1px dashed var(--line);font-size:.92rem;font-weight:600;color:var(--err);display:flex;gap:8px;align-items:flex-start}
.altc--mkt::before{background:#f4b400} .altc--mkt .tagline{color:#a9790a}
.altc--social::before{background:#25c366} .altc--social .tagline{color:#178a47}
.altc--foreign::before{background:#7c5cff} .altc--foreign .tagline{color:#5a3ed6}
.altc--us{background:linear-gradient(180deg,#fff 0%,var(--teal-50) 100%);border:2px solid var(--teal);box-shadow:var(--shadow)}
.altc--us::before{background:linear-gradient(90deg,var(--teal),var(--amber))}
.altc--us .tagline{color:var(--teal-600)}
.altc--us ul li{color:var(--ink);font-weight:500}
.altc--us ul li::before{content:"✓";color:var(--teal-600);font-weight:900}
.altc--us .win{margin-top:16px;padding-top:14px;border-top:1px dashed rgba(10,111,224,.25);color:var(--ok);font-weight:700;display:flex;gap:8px;align-items:flex-start}

.vs-wrap{overflow-x:auto;margin-top:12px;-webkit-overflow-scrolling:touch}
.vs-table{width:100%;border-collapse:separate;border-spacing:0;min-width:700px;font-family:var(--body);background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow-sm)}
.vs-table th,.vs-table td{padding:15px 16px;text-align:center;border-bottom:1px solid var(--line)}
.vs-table thead th{font-size:.84rem;font-weight:700;color:var(--muted)}
.vs-table tbody th{text-align:left;font-weight:600;color:var(--ink);font-size:.95rem}
.vs-table thead .h-mkt{color:#a9790a} .vs-table thead .h-social{color:#178a47} .vs-table thead .h-foreign{color:#5a3ed6}
.vs-table .col-us{background:var(--teal-50)}
.vs-table thead .col-us{color:var(--teal-600);font-weight:900;border-top:2px solid var(--teal);border-left:2px solid var(--teal);border-right:2px solid var(--teal);border-top-left-radius:12px;border-top-right-radius:12px}
.vs-table tbody .col-us{border-left:2px solid var(--teal);border-right:2px solid var(--teal)}
.vs-table tbody tr:last-child .col-us{border-bottom:2px solid var(--teal);border-bottom-left-radius:12px;border-bottom-right-radius:12px}
.vs-dot{font-weight:900;font-size:1.05rem}
.vs-yes{color:var(--ok)} .vs-no{color:var(--err)} .vs-mid{color:#a9790a}
.vs-foot{font-size:.82rem;color:var(--muted-2);margin-top:12px;text-align:center}

/* ===================== Demo chat Vendedor IA ===================== */
.chat-demo{background:var(--white);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);overflow:hidden;max-width:440px;margin-inline:auto}
.chat-demo .cd-head{display:flex;align-items:center;gap:10px;padding:13px 16px;background:var(--navy);color:#fff}
.chat-demo .cd-head .dot{width:9px;height:9px;border-radius:50%;background:#37d67a;box-shadow:0 0 0 3px rgba(55,214,122,.25);flex:0 0 auto}
.chat-demo .cd-head b{font-size:.95rem;line-height:1.1}
.chat-demo .cd-head small{opacity:.75;font-size:.72rem;display:block;font-weight:500}
.chat-demo .cd-body{padding:16px;display:flex;flex-direction:column;gap:10px;background:var(--slate)}
.bub{max-width:84%;padding:10px 13px;border-radius:14px;font-size:.9rem;line-height:1.45}
.bub.user{align-self:flex-end;background:var(--teal);color:#fff;border-bottom-right-radius:4px}
.bub.bot{align-self:flex-start;background:#fff;color:var(--ink);border:1px solid var(--line);border-bottom-left-radius:4px}
.cd-card{align-self:flex-start;background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px;display:flex;gap:11px;align-items:center;max-width:94%;box-shadow:var(--shadow-sm)}
.cd-card .thumb{width:54px;height:54px;border-radius:10px;object-fit:cover;flex:0 0 auto}
.cd-card .cd-info{flex:1;min-width:0}
.cd-card .cd-info b{display:block;font-size:.86rem}
.cd-card .cd-info .price{color:var(--teal-600);font-weight:800;font-size:.96rem}
.cd-card .cd-info .stock{font-size:.72rem;color:var(--ok);font-weight:700}
.cd-card .cd-add{flex:0 0 auto;background:var(--amber);color:#fff;border:none;border-radius:9px;padding:9px 11px;font-size:.78rem;font-weight:700;cursor:pointer;font:inherit}
.cd-foot{padding:10px 14px;border-top:1px solid var(--line);background:#fff;font-size:.76rem;color:var(--muted-2);display:flex;align-items:center;gap:7px}

/* Qué vender hoy */
.qvh{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:10px}
@media(max-width:640px){.qvh{grid-template-columns:1fr}}
.qvh .q{background:var(--white);border:1px solid var(--line);border-left:4px solid var(--teal);border-radius:12px;padding:15px 16px;box-shadow:var(--shadow-sm)}
.qvh .q .tag{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted-2)}
.qvh .q h4{margin:5px 0 4px;font-size:1rem}
.qvh .q p{margin:0;font-size:.86rem;color:var(--muted);line-height:1.45}
.qvh .q.alert{border-left-color:var(--amber)}
.qvh .q.good{border-left-color:var(--ok)}
.ai-badge{display:inline-flex;align-items:center;gap:7px;background:var(--teal-50);color:var(--teal-600);border:1px solid var(--teal);border-radius:999px;padding:6px 13px;font-weight:700;font-size:.82rem}

/* Enlace Administrador (discreto) */
.nav-admin{font-size:.82rem;color:var(--muted-2);font-weight:700;white-space:nowrap;padding:9px 9px;border-radius:10px}
.nav-admin:hover{background:var(--slate);text-decoration:none;color:var(--navy)}

/* Artículos de blog enriquecidos */
.article table{width:100%;border-collapse:collapse;margin:18px 0;font-size:.92rem}
.article th,.article td{border:1px solid var(--line);padding:9px 12px;text-align:left;vertical-align:top}
.article thead th{background:var(--slate);color:var(--navy)}
.article h3{margin-top:18px;font-size:1.05rem}
.ai-resumen{background:var(--teal-50);border:1px solid var(--teal);border-radius:14px;padding:18px 22px;margin:24px 0}
.ai-resumen h2{margin-top:0}
.ai-resumen ul{margin:8px 0}