/* Web pública de Xequea. Paleta corporativa del producto. */
:root{
  --dorado:#F5B11B;--dorado-osc:#E6A015;--dorado-claro:#FFC857;
  --oscuro:#2C3E50;--tinta:#22313f;--gris:#5b6b7a;--borde:#e3e7ea;--fondo:#fff;--suave:#f7f9fa;
  --radio:12px;--ancho:1140px;
}
*{box-sizing:border-box}
body{margin:0;color:var(--tinta);background:var(--fondo);font:16px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.caja{max-width:var(--ancho);margin:0 auto;padding:0 1.2rem}
a{color:var(--dorado-osc)}
h1,h2,h3,h4{line-height:1.25;margin:0 0 .6rem;color:var(--oscuro)}
h1{font-size:2.6rem;letter-spacing:-.02em}
h2{font-size:1.7rem}
h3{font-size:1.15rem}
p{margin:0 0 1rem}
.sub{color:var(--gris)}

.cab{border-bottom:1px solid var(--borde);background:#fff;position:sticky;top:0;z-index:20}
.cab-fila{display:flex;align-items:center;gap:1.4rem;padding-top:.7rem;padding-bottom:.7rem;flex-wrap:wrap}
.logo{display:flex;align-items:center}
.menu{display:flex;gap:1.3rem;flex:1}
.menu a{color:var(--tinta);text-decoration:none;font-weight:500;padding:.2rem 0;border-bottom:2px solid transparent}
.menu a:hover,.menu a.activo{border-bottom-color:var(--dorado)}

.btn{display:inline-block;padding:.75rem 1.4rem;border-radius:10px;text-decoration:none;font-weight:600;border:2px solid var(--dorado);background:var(--dorado);color:#2b2200;cursor:pointer;font-size:1rem}
.btn:hover{background:var(--dorado-osc);border-color:var(--dorado-osc)}
.btn-borde{background:transparent;color:var(--oscuro);border-color:var(--borde)}
.btn-borde:hover{background:var(--suave);border-color:var(--dorado)}
.btn-grande{padding:.95rem 1.8rem;font-size:1.05rem}

.heroe{padding:4.5rem 0 3.5rem;background:linear-gradient(180deg,#fffdf7 0%,#fff 100%);border-bottom:1px solid var(--borde)}
.heroe .caja{display:grid;grid-template-columns:1.1fr .9fr;gap:2.5rem;align-items:center}
.heroe p.lead{font-size:1.2rem;color:var(--gris);max-width:46ch}
.acciones{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.4rem}
.apunte{margin-top:1rem;font-size:.92rem;color:var(--gris)}

.pantalla{background:#fff;border:1px solid var(--borde);border-radius:var(--radio);box-shadow:0 18px 40px rgba(44,62,80,.1);overflow:hidden}
.pantalla .barra{background:var(--oscuro);height:34px;display:flex;align-items:center;gap:.4rem;padding:0 .8rem}
.pantalla .barra i{width:10px;height:10px;border-radius:50%;background:#56657a;display:block}
.pantalla .cuerpo{padding:1rem}
.fichaje{display:flex;justify-content:space-between;align-items:center;padding:.55rem .2rem;border-bottom:1px solid var(--borde);font-size:.92rem}
.fichaje:last-child{border-bottom:0}
.fichaje b{color:var(--oscuro)}
.pill{background:#fdf3dc;color:#8a6200;border-radius:999px;padding:.1rem .6rem;font-size:.78rem;font-weight:600}

section{padding:3.5rem 0}
section.suave{background:var(--suave);border-top:1px solid var(--borde);border-bottom:1px solid var(--borde)}
.titular{max-width:62ch;margin-bottom:2rem}
.rejilla{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(265px,100%),1fr));gap:1.4rem}
.rejilla.dos{grid-template-columns:repeat(auto-fit,minmax(min(420px,100%),1fr))}
.ficha{background:#fff;border:1px solid var(--borde);border-radius:var(--radio);padding:1.4rem}
.ficha .ico{width:42px;height:42px;border-radius:10px;background:#fdf3dc;display:flex;align-items:center;justify-content:center;margin-bottom:.8rem;color:#8a6200;font-weight:700}
.ficha p{margin:0;color:var(--gris);font-size:.95rem}

.precios{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:1.4rem;align-items:stretch}
.plan{background:#fff;border:1px solid var(--borde);border-radius:var(--radio);padding:1.6rem;display:flex;flex-direction:column}
.plan.destacado{border:2px solid var(--dorado);box-shadow:0 14px 34px rgba(245,177,27,.18)}
.plan .precio{font-size:2.2rem;font-weight:700;color:var(--oscuro);margin:.4rem 0}
.plan .precio small{font-size:.95rem;font-weight:400;color:var(--gris)}
.plan ul{list-style:none;padding:0;margin:1rem 0 1.2rem;flex:1}
.plan li{padding:.35rem 0;border-bottom:1px solid var(--borde);font-size:.94rem}
.plan li:last-child{border-bottom:0}
.plan li::before{content:"·";color:var(--dorado);font-weight:700;margin-right:.5rem}
.cinta{display:inline-block;background:var(--dorado);color:#2b2200;font-size:.76rem;font-weight:700;border-radius:999px;padding:.12rem .7rem;margin-bottom:.4rem}

.cta{background:var(--oscuro);color:#fff;text-align:center}
.cta h2,.cta p{color:#fff}
.cta p{color:#c7d2dc;max-width:52ch;margin:0 auto 1.4rem}

table.tabla{width:100%;max-width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--borde);border-radius:var(--radio);overflow:hidden}
table.tabla th,table.tabla td{padding:.7rem .9rem;border-bottom:1px solid var(--borde);text-align:left}
table.tabla th{background:var(--suave);font-size:.82rem;text-transform:uppercase;letter-spacing:.02em;color:var(--gris)}

form.caja-form{background:#fff;border:1px solid var(--borde);border-radius:var(--radio);padding:1.6rem;max-width:620px}
label{display:block;margin-bottom:.9rem}
label span{display:block;font-size:.88rem;color:var(--gris);margin-bottom:.25rem}
input,select,textarea{font:inherit;width:100%;padding:.65rem .75rem;border:1px solid var(--borde);border-radius:9px}
.aviso{padding:.8rem 1rem;border-radius:9px;margin-bottom:1rem;border:1px solid}
.aviso-ok{background:#e9f7ee;border-color:#bfe3cd;color:#1b6b3a}
.aviso-error{background:#fdecea;border-color:#f3c2bd;color:#b3261e}

.pie{background:var(--oscuro);color:#c7d2dc;padding:2.5rem 0 1.2rem;margin-top:3rem}
.pie-fila{display:grid;grid-template-columns:2fr 1fr 1fr;gap:1.6rem}
.pie h4{color:#fff;font-size:.95rem;margin-bottom:.5rem}
.pie a{display:block;color:#c7d2dc;text-decoration:none;padding:.15rem 0;font-size:.93rem}
.pie a:hover{color:var(--dorado-claro)}
.pie .sub{color:#93a3b2;font-size:.9rem;max-width:40ch}
.pie-fin{border-top:1px solid #3c5367;margin-top:1.6rem;padding-top:.9rem;color:#93a3b2}

@media (max-width:860px){
  h1{font-size:2rem}
  .heroe .caja{grid-template-columns:1fr}
  .menu{order:3;width:100%;flex:none;gap:1rem;font-size:.95rem;padding-top:.3rem}
  .cab-fila{gap:.8rem}
  .btn-grande{padding:.8rem 1.2rem;font-size:1rem}
  table.tabla{display:block;overflow-x:auto;white-space:normal}
  table.tabla th,table.tabla td{padding:.55rem .6rem}
  .pie-fila{grid-template-columns:1fr}
}
