:root{
  --amarillo:#FFC21E;
  --amarillo-osc:#F5A800;
  --rojo:#E2231A;
  --rojo-osc:#B81910;
  --carbon:#2A2118;
  --crema:#FFF8E7;
  --verde:#3FA34D;
  --sombra:0 10px 30px rgba(42,33,24,.15);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Nunito',system-ui,sans-serif;
  color:var(--carbon);
  background:var(--crema);
  line-height:1.6;
}
img{display:block;max-width:100%}
h1,h2,h3{font-family:'Baloo 2',cursive;line-height:1.15}

/* NAV */
.nav{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;
  padding:.5rem 1.2rem;
  background:var(--rojo);
  box-shadow:0 4px 18px rgba(0,0,0,.18);
}
.brand img{height:48px;width:48px;object-fit:cover;border-radius:50%;border:2px solid #fff}
.nav-links{display:flex;align-items:center;gap:1.4rem}
.nav-links a{color:#fff;text-decoration:none;font-weight:700;font-size:.98rem}
.nav-links a:hover{opacity:.85}
.btn-sm{background:var(--amarillo);color:var(--carbon)!important;padding:.45rem .9rem;border-radius:30px}

/* HERO */
.hero{
  background:
    radial-gradient(1200px 500px at 50% -120px, rgba(255,255,255,.5), transparent),
    linear-gradient(160deg,var(--amarillo),var(--amarillo-osc));
  text-align:center;
  padding:3rem 1.2rem 3.5rem;
}
.hero-inner{max-width:760px;margin:0 auto}
.hero-logo{
  width:180px;height:180px;object-fit:cover;border-radius:50%;
  margin:0 auto 1.2rem;border:5px solid #fff;box-shadow:var(--sombra);
}
.hero h1{font-size:clamp(2.1rem,6vw,3.4rem);color:var(--rojo-osc);text-shadow:0 2px 0 #fff}
.lead{font-size:clamp(1.05rem,2.5vw,1.3rem);font-weight:600;margin:.8rem auto 1.4rem;max-width:620px}
.hero-tags{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-bottom:1.6rem}
.hero-tags span{
  background:#fff;border-radius:30px;padding:.4rem .9rem;font-weight:700;
  box-shadow:0 3px 8px rgba(0,0,0,.1)
}
.btn{
  display:inline-block;background:var(--rojo);color:#fff;text-decoration:none;
  font-weight:800;padding:.85rem 2rem;border-radius:40px;
  box-shadow:var(--sombra);transition:transform .15s,background .2s
}
.btn:hover{transform:translateY(-2px);background:var(--rojo-osc)}

/* SECTIONS */
.section{padding:3.5rem 1.2rem;max-width:1100px;margin:0 auto}
.section.alt{background:#fff;max-width:none}
.section.alt>*{max-width:1100px;margin-left:auto;margin-right:auto}
.section h2{font-size:clamp(1.7rem,4.5vw,2.5rem);text-align:center;color:var(--rojo)}
.section-sub{text-align:center;color:#7a6a55;font-weight:600;margin:.4rem auto 2.2rem;max-width:600px}

/* CARDS */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.2rem}
.card{
  background:#fff;border-radius:18px;padding:1.6rem;text-align:center;
  box-shadow:var(--sombra);border:2px solid #fff;transition:transform .15s,border-color .2s
}
.card:hover{transform:translateY(-4px);border-color:var(--amarillo)}
.ico{font-size:2.6rem;display:block;margin-bottom:.5rem}
.card h3{font-size:1.3rem;color:var(--carbon);margin-bottom:.3rem}
.card p{color:#6f6150;font-weight:600;font-size:.97rem}

/* GALLERY */
.gallery{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  grid-auto-rows:230px;gap:.9rem
}
.gallery figure{
  position:relative;overflow:hidden;border-radius:16px;box-shadow:var(--sombra);
  margin:0
}
.gallery .g-tall{grid-row:span 2}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.gallery figure:hover img{transform:scale(1.07)}
.gallery figcaption{
  position:absolute;left:0;right:0;bottom:0;
  background:linear-gradient(transparent,rgba(0,0,0,.75));
  color:#fff;font-weight:700;padding:1.5rem .9rem .7rem;font-size:.95rem
}

/* STOREFRONT */
.storefront{max-width:none;background:linear-gradient(160deg,var(--amarillo),var(--amarillo-osc))}
.store-grid{
  max-width:1100px;margin:0 auto;display:grid;
  grid-template-columns:1.1fr 1fr;gap:2.2rem;align-items:center
}
.store-img img{border-radius:18px;box-shadow:var(--sombra);width:100%}
.store-text h2{text-align:left;color:var(--rojo-osc)}
.store-text p{font-weight:600;margin:.6rem 0 1rem;font-size:1.08rem}
.bullets{list-style:none;display:grid;gap:.5rem;font-weight:700}

/* CONTACTO */
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.2rem}
.contact-card{
  background:#fff;border-radius:18px;padding:1.8rem 1.4rem;text-align:center;
  box-shadow:var(--sombra)
}
.contact-card h3{color:var(--rojo);font-size:1.35rem;margin-bottom:.3rem}
.contact-card p{font-weight:600;color:#5f5446}
.btn-wa{
  display:inline-block;margin-top:1rem;background:#25D366;color:#fff;text-decoration:none;
  font-weight:800;padding:.7rem 1.4rem;border-radius:30px;box-shadow:0 6px 16px rgba(37,211,102,.4)
}
.btn-wa:hover{background:#1eb858}

/* FOOTER */
.footer{
  background:var(--carbon);color:#fff;text-align:center;padding:2.5rem 1.2rem
}
.footer img{width:80px;height:80px;object-fit:cover;border-radius:50%;margin:0 auto 1rem;border:3px solid var(--amarillo)}
.footer p{font-weight:700;margin-bottom:.4rem}
.footer small{color:#bcae9a}

/* RESPONSIVE */
@media(max-width:720px){
  .nav-links{gap:.9rem}
  .nav-links a:not(.btn-sm){display:none}
  .store-grid{grid-template-columns:1fr}
  .store-text h2{text-align:center}
}