:root{
  --tono1:#4F7302;--tono2:#462207;--tono3:#EAE8E8;
  --tono4:#F2811D;--tono5:#BF2604;--tono6:#0D8FA1;--tono7:#FED246;
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Comic Neue',sans-serif;background:linear-gradient(to bottom,var(--tono3),var(--tono1));color:var(--tono2);}
.topbar{background:var(--tono6);}
.topbar .topbar-inner{display:flex;justify-content:flex-end;gap:12px;padding:10px 20px}
.social-icons a{color:#fff;margin:0 8px;font-size:18px}
.navbar{background:var(--tono7);display:flex;justify-content:space-between;align-items:center;padding:15px 40px;flex-wrap:wrap}
.navbar h1{color:var(--tono5)}
.navbar a{text-decoration:none;color:var(--tono2);font-weight:bold}
.section{padding:22px 20px}
.section-title{text-align:center}
.center{text-align:center;margin-bottom:16px}
.grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(240px,1fr));gap:16px}
.card{background:rgba(255,255,255,.20);backdrop-filter:blur(6px);border-radius:16px;padding:12px;box-shadow:0 4px 14px rgba(0,0,0,.12);display:flex;flex-direction:column}
.card img{width:100%;height:260px;object-fit:contain;border-radius:12px;background:rgba(255,255,255,.5)}
.card-body{display:flex;flex-direction:column;gap:10px;margin-top:10px}
.leyenda{background:rgba(255,255,255,.18);padding:10px 12px;border-radius:12px;text-align:center;font-size:1.06rem;backdrop-filter:blur(6px)}
.talla{padding:8px;border-radius:8px;font-size:1rem;margin-top:10px}

/* MATCH BOTÓN DE LIBROS EXACTO */
.buy-link{
  background:#25D366;color:#fff;text-decoration:none;
  padding:12px;border-radius:14px;font-weight:900;text-align:center;display:block;font-size:1.15rem;
  box-shadow:0 8px 20px rgba(37,211,102,.33),inset 0 -2px 0 rgba(0,0,0,.08);border:2px solid rgba(0,0,0,.05);
}
.buy-link i{font-size:1.15rem;margin-right:8px}
.buy-link:hover{filter:saturate(1.08) brightness(1.07)}

.btn.outline{padding:10px 14px;border:2px solid var(--tono2);border-radius:12px;text-decoration:none;font-weight:700;color:var(--tono2)}
footer{background:var(--tono2);color:var(--tono3);padding:20px 40px}
.footer-content{display:flex;justify-content:space-between;flex-wrap:wrap}
.footer-social a{color:var(--tono3);margin:0 6px;font-size:18px}