:root { --texto:#1f2328; --suave:#57606a; --fondo:#ffffff; --tarjeta:#f6f8fa; --borde:#d0d7de; --acento:#0090C9; --acento2:#00709A; }
@media (prefers-color-scheme: dark) {
  :root { --texto:#e6edf3; --suave:#9da7b1; --fondo:#0d1117; --tarjeta:#161b22; --borde:#30363d; --acento:#33B5E8; --acento2:#7FD0F0; }
}
* { box-sizing:border-box; }
body { margin:0; background:var(--fondo); color:var(--texto); font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; }
header { border-bottom:1px solid var(--borde); }
.contenedor { max-width:960px; margin:0 auto; padding:0 16px; }
.barra { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:14px 0; flex-wrap:wrap; }
.logo { font-weight:800; font-size:1.4rem; letter-spacing:.04em; color:var(--texto); text-decoration:none; }
.logo { display:inline-flex; }
.logo img { height:56px; width:auto; display:block; background:#fff; border-radius:8px; padding:2px 6px; }
nav a { color:var(--suave); text-decoration:none; margin-left:16px; font-size:.95rem; }
nav a:hover { color:var(--acento); }
.portada { padding:56px 0 40px; }
.portada h1 { font-size:clamp(1.8rem, 5vw, 2.6rem); line-height:1.15; margin:0 0 12px; }
.portada p { color:var(--suave); font-size:1.1rem; max-width:640px; margin:0 0 24px; }
.boton { display:inline-block; background:#0090C9; color:#fff; padding:12px 22px; border-radius:8px; text-decoration:none; font-weight:600; border:0; cursor:pointer; font-size:1rem; }
.boton:hover { background:#00709A; }
h2 { font-size:1.4rem; margin:40px 0 16px; }
.rejilla { display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:16px; }
.tarjeta { background:var(--tarjeta); border:1px solid var(--borde); border-radius:10px; padding:18px; }
.tarjeta h3 { margin:0 0 6px; font-size:1.05rem; }
.tarjeta p { margin:0; color:var(--suave); font-size:.95rem; }
.precio { color:var(--acento); font-weight:700; margin-top:8px !important; }
table { border-collapse:collapse; width:100%; }
td, th { border:1px solid var(--borde); padding:8px 10px; text-align:left; vertical-align:top; }
th { font-weight:600; width:40%; }
.documento { max-width:760px; padding:32px 16px 64px; margin:0 auto; }
.documento h1 { font-size:1.6rem; line-height:1.25; }
.sub { color:var(--suave); }
footer { border-top:1px solid var(--borde); margin-top:56px; padding:24px 0 40px; color:var(--suave); font-size:.9rem; }
footer a { color:var(--suave); }
.aviso { border:1px solid var(--borde); border-radius:8px; padding:12px 16px; margin:16px 0; background:var(--tarjeta); }

.grupo { font-size:1.1rem; margin:28px 0 12px; color:var(--suave); text-transform:uppercase; letter-spacing:.05em; }
.catalogo { display:grid; grid-template-columns:repeat(auto-fill, minmax(230px, 1fr)); gap:18px; }
.producto { background:var(--tarjeta); border:1px solid var(--borde); border-radius:12px; overflow:hidden; display:flex; flex-direction:column; }
.producto img { width:100%; height:auto; aspect-ratio:1/1; object-fit:cover; display:block; background:#fff; }
.producto-info { padding:14px 16px 16px; display:flex; flex-direction:column; gap:6px; flex:1; }
.producto-info h3 { margin:0; font-size:1rem; line-height:1.3; }
.producto-info p { margin:0; color:var(--suave); font-size:.92rem; }
.producto-info .precio { margin-top:auto !important; padding-top:6px; }
.pedir { display:inline-block; margin-top:8px; text-align:center; background:#0090C9; color:#fff; text-decoration:none; font-weight:600; font-size:.92rem; padding:9px 12px; border-radius:8px; }
.pedir:hover { background:#00709A; }