:root { --verde:#1f5933; --madera:#6b3a1a; --madera2:#9a5a2a; --crema:#f7edcc; --rojo:#c9322b; --amarillo:#f2b630; --azul:#2f5f9f; --tinta:#14100a; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; font:17px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; color:var(--tinta); background:var(--crema); }
a { color:var(--azul); }
header.hero { background:linear-gradient(180deg,var(--madera),#44240f); color:var(--crema); text-align:center; padding:48px 20px 56px; border-bottom:6px solid var(--amarillo); }
header.hero img.icono { width:120px; height:120px; border-radius:26px; box-shadow:0 6px 18px rgba(0,0,0,.4); border:3px solid var(--tinta); }
header.hero h1 { margin:18px 0 6px; font-size:2.4rem; letter-spacing:.02em; color:var(--amarillo); text-shadow:2px 2px 0 var(--tinta); }
header.hero p { margin:0 auto; max-width:34em; font-size:1.15rem; }
main { max-width:860px; margin:0 auto; padding:30px 20px 60px; }
section { margin:0 0 34px; }
h2 { color:var(--verde); border-bottom:3px solid var(--amarillo); padding-bottom:6px; }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; }
.card { background:#fff8e3; border:2px solid var(--madera); border-radius:14px; padding:16px 18px; }
.card h3 { margin:0 0 6px; color:var(--rojo); }
.captura { display:block; max-width:300px; width:100%; margin:0 auto; border-radius:18px; border:3px solid var(--tinta); box-shadow:0 8px 24px rgba(0,0,0,.3); }
.boton { display:inline-block; background:var(--rojo); color:#fff; text-decoration:none; font-weight:700; padding:12px 22px; border-radius:12px; border:3px solid var(--tinta); }
footer { background:var(--tinta); color:var(--crema); text-align:center; padding:22px 16px; font-size:.95rem; }
footer a { color:var(--amarillo); }
.legal h2 { font-size:1.3rem; }
.legal table { border-collapse:collapse; width:100%; margin:10px 0; }
.legal td, .legal th { border:1px solid var(--madera2); padding:6px 10px; text-align:left; vertical-align:top; }
@media (max-width:520px) { header.hero h1 { font-size:1.9rem; } }