*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#fff9d6;color:#222;line-height:1.4}
header{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;flex-wrap:wrap;gap:12px}.logo{height:120px;width:auto;max-width:90vw}
@media(max-width:768px){.logo{height:90px}}
nav a{margin-left:10px;padding:10px 16px;border-radius:25px;text-decoration:none;font-weight:bold;display:inline-block}
.btn-primary{background:linear-gradient(to right,#e60000,#ffcc00);color:#fff;border:none}
.btn-danger{background:linear-gradient(to right,#e60000,#ffcc00);color:#fff;padding:12px 20px;border-radius:25px;text-decoration:none;font-weight:bold;display:inline-block}
.btn-outline{border:2px solid #ffcc00;padding:12px 20px;border-radius:25px;text-decoration:none;color:#222;background:#fff;font-weight:bold;display:inline-block}
.hero{display:flex;justify-content:space-between;align-items:center;padding:40px 20px;gap:20px;flex-wrap:wrap}.hero-text{flex:1 1 320px;max-width:600px}
.hero-text h1{margin:0 0 12px;font-size:clamp(28px,5vw,44px)}.hero-text p{margin:0 0 16px;font-size:clamp(16px,2.5vw,18px)}.hero-buttons a{margin-right:10px}
.hero-image{flex:1 1 280px;text-align:center}.hero-image img{max-width:420px;width:100%;height:auto;border-radius:16px}
@media(max-width:768px){.hero-image img{max-width:300px}}
#productos{padding:30px 20px}#productos h2,#contacto h2,#nosotros h2{text-align:center;font-size:clamp(22px,3.5vw,32px);margin-top:0}
.toolbar{max-width:1100px;margin:10px auto 20px;display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}.toolbar input[type=search],.toolbar select{padding:10px;border:1px solid #ddd;border-radius:10px;min-width:220px}
.productos-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;max-width:1100px;margin:0 auto}
.producto{background:rgba(255,255,255,.6);border-radius:12px;padding:12px;text-align:center;box-shadow:0 2px 6px rgba(0,0,0,.06)}.producto img{max-width:100%;border-radius:12px;height:auto}
.section-alt{background:rgba(255,255,255,.5);padding:30px 20px}.split{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:1100px;margin:0 auto;align-items:center}
.photo-card img{width:100%;height:auto;border-radius:14px;box-shadow:0 2px 8px rgba(0,0,0,.08)}.checks{list-style:none;padding:0;margin:12px 0 0}.checks li::before{content:"✔ ";color:#e60000}
#contacto{padding:30px 20px;text-align:center}#contacto form{max-width:520px;margin:0 auto;text-align:left;background:rgba(255,255,255,.7);padding:16px;border-radius:12px}
#contacto input,#contacto textarea{width:100%;padding:10px;margin:6px 0 12px;border:1px solid #ddd;border-radius:8px}footer{text-align:center;padding:16px 20px;background:#eee;font-size:14px}