:root{
  --coral:#F6C1B8;
  --coral-dark:#EBAEA6;
  --accent:#FFF6F5;
  --text:#4b4b4b;
  --font:'Poppins', Arial, sans-serif;
  --heading-font:'Playfair Display', serif;
}
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700;800&family=Poppins:wght@300;400;600&display=swap');
*{box-sizing:border-box}
body{font-family:var(--font);color:var(--text);margin:0}
.container{max-width:1100px;margin:0 auto;padding:0 1rem}

a, a:visited, a:hover, a:active {text-decoration:none;color:inherit}

/*HEADER*/
.header{background:var(--accent);border-bottom:1px solid #f1e6e6}
.header__inner{display:flex;align-items:center;justify-content:space-between;padding:1rem 0}
.brand{display:flex;align-items:center;gap:.9rem}
.brand__logo{transition:transform .4s ease}
.brand__logo img{width:76px;height:76px;object-fit:cover;border-radius:12px}
.brand__meta{margin-left:0}
.brand__title{font-family:var(--heading-font);font-size:2.2rem;font-weight:700;color:var(--coral-dark);line-height:1;margin:0}
.brand__tagline{font-family:var(--font);font-size:.95rem;color:#7b7b7b;font-style:italic;margin-top:2px}
.hamburger{background:transparent;border:0;padding:.3rem;display:inline-flex;align-items:center;justify-content:center}
.hamburger__box{width:36px;height:24px;display:inline-block;position:relative}
.hamburger__inner{display:block;top:50%;margin-top:-2px;width:100%;height:3px;background:#333;border-radius:3px;position:relative;transition:transform .35s ease}
.hamburger__inner::before,.hamburger__inner::after{content:'';position:absolute;left:0;width:100%;height:3px;background:#333;border-radius:3px;transition:transform .35s ease}
.hamburger__inner::before{top:-10px}
.hamburger__inner::after{bottom:-10px}
.hamburger.is-open .hamburger__inner{transform:rotate(45deg)}
.hamburger.is-open .hamburger__inner::before{transform:rotate(90deg) translateX(8px)}
.hamburger.is-open .hamburger__inner::after{transform:rotate(90deg) translateX(-8px)}
.nav--hidden{display:none}
.nav__list{list-style:none;margin:0;padding:0;display:flex;gap:1rem}
.nav__link{color:var(--text);padding:.5rem .75rem;border-radius:10px;display:inline-flex;align-items:center;gap:.35rem;transition:box-shadow .18s ease, transform .18s ease, background .18s ease}
.nav__link:hover{background:rgba(246,193,184,0.08);box-shadow:0 8px 20px rgba(75,75,75,0.06);transform:translateY(-3px)}
.nav__link:focus{box-shadow:0 8px 20px rgba(75,75,75,0.08);transform:none}

.hero{padding:3rem 0;background:linear-gradient(180deg,#fff,#fff)}
.hero__grid{display:grid;grid-template-columns:1fr 420px;gap:2rem;align-items:center}
.hero__title{font-family:var(--heading-font);font-size:3rem;margin:0;color:#333;letter-spacing:.2px}
.hero__lead{margin-top:.6rem;color:#6b6b6b;font-size:1.05rem}
.img-responsive{max-width:100%;height:auto}

/*PRODUCTOS GRID*/
.productos .grid--3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;padding:2rem 0}
.producto{background:#fff;border-radius:10px;padding:1rem;text-align:center;box-shadow:0 6px 18px rgba(0,0,0,0.04)}
.producto__img{height:160px;object-fit:contain}

/*ANIMACIONES Y TRANSICIONES */
.is-loaded .hero__title{animation:fadeUp .85s ease both}
.is-loaded .producto{opacity:0;transform:translateY(16px);animation:cardIn .7s ease both}
.is-loaded .producto:nth-child(1){animation-delay:.12s}
.is-loaded .producto:nth-child(2){animation-delay:.18s}
.is-loaded .producto:nth-child(3){animation-delay:.24s}
.producto{transition:transform .28s ease, box-shadow .28s ease}
.producto:hover{transform:translateY(-8px);box-shadow:0 18px 36px rgba(235,174,166,0.12)}

@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes cardIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

.site-loader{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#fff;z-index:9999}
.site-loader__spinner{width:48px;height:48px;border-radius:50%;background:linear-gradient(90deg,var(--coral),var(--coral-dark));animation:spin 1s linear infinite}
@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}

.brand__logo{transition:transform .4s ease}
.is-loaded .brand__logo{animation:logoPulse 3s ease infinite}
@keyframes logoPulse{0%{transform:scale(1)}50%{transform:scale(1.03)}100%{transform:scale(1)}}

.nav__link:focus, .btn:focus, .form__input:focus{outline:3px solid rgba(235,174,166,0.25);outline-offset:2px}

/*FLEXBOX*/
.form{display:flex;flex-direction:column;gap:.75rem}
.form__input,.form__textarea{padding:.75rem;border:1px solid #eee;border-radius:8px}
.btn--primary{background:var(--coral);color:#fff;padding:.6rem 1rem;border-radius:8px;border:0;text-decoration:none;display:inline-block}

@media (max-width:900px){
  .hero__grid{grid-template-columns:1fr}
  .productos .grid--3{grid-template-columns:1fr}
  .nav--hidden{display:none}
}

@media (min-width:901px){
  .nav--hidden{display:flex}
  .hamburger{display:none}
}

.nosotros{padding:3rem 0;text-align:center;background:linear-gradient(180deg,#fff,#fff)}
.nosotros__content{max-width:760px;margin:0 auto;padding:0 1rem}
.nosotros__title{font-family:var(--heading-font);font-size:2rem;color:var(--coral-dark);margin:0 0 .5rem}
.nosotros__text{font-family:var(--font);font-size:1.05rem;color:#575757;line-height:1.7;margin:0 auto}
.nosotros__image{display:block;margin:1.25rem auto 0;max-width:320px;width:100%;border-radius:14px;box-shadow:0 14px 30px rgba(75,75,75,0.06)}

.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1.5rem;align-items:start}
.review{background:#fff;padding:1.1rem;border-radius:12px;box-shadow:0 8px 22px rgba(75,75,75,0.06);text-align:left;transition:transform .18s ease, box-shadow .18s ease}
.review:hover{transform:translateY(-6px);box-shadow:0 20px 42px rgba(75,75,75,0.08)}
.review__quote{font-style:italic;color:#4f4f4f;margin:0}
.review__author{margin-top:.75rem;font-weight:600;color:var(--coral-dark);font-size:.95rem}

@media (max-width:900px){
  .reviews{grid-template-columns:1fr}
  .nosotros__image{max-width:220px}
  .nosotros__title{font-size:1.6rem}
}