/* ---------- VARIABLES ---------- */
    :root{
      --rose-light: #FCE7F3;
      --rose: #F9A8D4;
      --rose-dark: #EC4899;
      --violet: #D8B4FE;
      --violet-dark: #A855F7;
      --text: #3B2242;
      --muted: #6B5A6E;
      --bg: #FFF9FB;
      --glass: rgba(255,255,255,0.6);
      --shadow: 0 8px 25px rgba(172,82,140,0.08);
      --radius: 20px;
      --maxw: 1200px;
    }

    *{box-sizing:border-box;margin:0;padding:0}
    html,body{height:100%;scroll-behavior:smooth}
    body{
      font-family:'Poppins',sans-serif;
      background:var(--bg);
      color:var(--text);
      line-height:1.6;
      -webkit-font-smoothing:antialiased;
    }

    a{color:inherit}

    /* ---------- HEADER ---------- */
    header{
      position:sticky;
      top:0;
      z-index:1200;
      backdrop-filter: blur(10px);
      background: rgba(255,255,255,0.84);
      box-shadow: 0 6px 22px rgba(0,0,0,0.04);
      border-bottom:1px solid rgba(230,190,210,0.12);
    }

    .nav-container{
      max-width:var(--maxw);
      margin:0 auto;
      display:flex;
      justify-content:space-between;
      align-items:center;
      padding:0.9rem 1.25rem;
      gap:1rem;
    }

    .logo{
      font-family:'Playfair Display',serif;
      font-size:1.5rem;
      color:var(--rose-dark);
      font-weight:700;
      letter-spacing:0.3px;
    }

    nav ul{
      display:flex;
      gap:1.25rem;
      list-style:none;
      align-items:center;
      margin:0;
    }

    nav a{
      text-decoration:none;
      color:var(--muted);
      font-weight:500;
      padding:0.45rem 0.6rem;
      border-radius:10px;
      transition:all .22s ease;
    }

    nav a:hover{
      color:var(--rose-dark);
      background:linear-gradient(90deg, rgba(236,72,153,0.08), rgba(216,148,200,0.05));
      transform:translateY(-2px);
    }

    .cta{
      background:linear-gradient(90deg,var(--rose),var(--violet));
      color:white;
      padding:0.55rem 0.95rem;
      border-radius:12px;
      display:inline-flex;
      gap:.5rem;
      align-items:center;
      font-weight:600;
      box-shadow:0 10px 26px rgba(240,140,180,0.18);
    }

    .cta i{font-size:1rem}

    /* hamburger */
    .menu-btn{
      display:none;
      background:none;
      border:none;
      font-size:1.6rem;
      color:var(--rose-dark);
      cursor:pointer;
    }

#mobile-menu {
  display: none;
  position: absolute;
  left: 0;
  top: 100%;
  width: 100%;
  background: rgba(255,255,255,0.96);
  backdrop-filter: blur(8px);
  border-top: 1px solid rgba(236,72,153,0.08);
  box-shadow: 0 12px 30px rgba(172,82,140,0.06);
  padding: 1rem 1.25rem;
  z-index: 2000; 
  flex-direction: column;
  gap: .35rem;
  animation: slideDown .28s ease;
}

#mobile-menu a {
  padding: .75rem 0;
  color: var(--muted);
  border-bottom: 1px dashed rgba(220,160,190,0.08);
  text-decoration: none;
  display: block;
}

    #mobile-menu a:last-child{border-bottom:none}

    @keyframes slideDown{
      from{opacity:0;transform:translateY(-8px)}
      to{opacity:1;transform:none}
    }

    @media(max-width:920px){
      nav ul{display:none}
      .menu-btn{display:block}
    }
header {
  position: sticky;
  top: 0;
  z-index: 1200;
  background: rgba(255,255,255,0.95);
  box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}

.nav-container {
  max-width: var(--maxw);
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem;
}

.logo {
  font-family: 'Playfair Display', serif;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--rose-dark);
}

/* Botón hamburguesa */
.menu-btn {
  display: none;
  background: none;
  border: none;
  font-size: 1.8rem;
  color: var(--rose-dark);
  cursor: pointer;
}

/* Nav desktop */
.desktop-nav ul {
  list-style: none;
  display: flex;
  gap: 1rem;
  margin: 0;
  padding: 0;
}

.desktop-nav a {
  text-decoration: none;
  color: var(--muted);
  font-weight: 500;
}

.desktop-nav a:hover {
  color: var(--rose-dark);
}

/* Menú móvil oculto por defecto */
#mobile-menu {
  display: none;
  flex-direction: column;
  background: white;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  z-index: 2000;
  padding: 1rem;
  box-shadow: 0 8px 20px rgba(0,0,0,0.1);
}

#mobile-menu a {
  text-decoration: none;
  color: var(--muted);
  padding: .75rem 0;
  border-bottom: 1px solid #eee;
}

/* Mostrar en móvil */
@media (max-width: 920px) {
  .desktop-nav { display: none; }
  .menu-btn { display: block; }
}
    /* ---------- HERO ---------- */
    .hero{
      max-width:var(--maxw);
      margin:0 auto;
      padding:4rem 1.25rem;
      display:grid;
      grid-template-columns:1fr 480px;
      gap:2rem;
      align-items:center;
    }

    .hero-text h1{
      font-family:'Playfair Display',serif;
      font-size:clamp(2rem,4vw,2.8rem);
      margin-bottom:1rem;
      color:var(--text);
    }

    .hero-text p{
      color:var(--muted);
      margin-bottom:1.5rem;
      font-size:1.03rem;
    }

    .btn-group{display:flex;gap:1rem;flex-wrap:wrap}

    .btn{
      padding:.85rem 1.2rem;border-radius:12px;border:0;font-weight:700;cursor:pointer;
    }
    .btn-primary{background:linear-gradient(90deg,var(--rose),var(--violet));color:white;box-shadow:var(--shadow)}
    .btn-outline{background:transparent;border:1px solid rgba(200,140,170,0.12);color:var(--muted)}

    .hero-card{
      background:linear-gradient(180deg, rgba(255,255,255,0.9), rgba(255,255,255,0.85));
      border-radius:18px;padding:1.2rem;box-shadow:var(--shadow);
      display:flex;flex-direction:column;align-items:center;gap:.6rem;
    }

    .hero-img img{width:100%; max-height: 50dvh;border-radius:18px;object-fit:cover;box-shadow:0 22px 44px rgba(172,82,140,0.06)}

    @media(max-width:980px){
      .hero{grid-template-columns:1fr; padding:3rem 1.25rem; text-align:center}
      .hero-img{order:-1}
    }

    /* ---------- SECTIONS GENERALES ---------- */
    section{max-width:var(--maxw);margin:0 auto;padding:4rem 1.25rem}
    h2{font-family:'Playfair Display',serif;color:var(--rose-dark);font-size:1.8rem;margin-bottom:.6rem;text-align:center}
    p.lead{color:var(--muted);text-align:center;max-width:780px;margin:0 auto 1.2rem}

    /* ---------- SERVICIOS ---------- */
    .servicios-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.6rem;margin-top:1.6rem}
    .servicio{
      background:var(--glass);backdrop-filter:blur(8px);border-radius:16px;padding:1.3rem;box-shadow:var(--shadow);text-align:center;transition:transform .28s;
    }
    .servicio:hover{transform:translateY(-8px)}
    .servicio i{font-size:1.8rem;color:var(--rose-dark);margin-bottom:.6rem}

    /* ---------- PRECIOS ---------- */
    .precios-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.6rem;margin-top:1.6rem}
    .precio-card{background:white;border-radius:16px;padding:1.25rem;box-shadow:var(--shadow);text-align:center;border:1px solid rgba(220,170,200,0.06)}
    .precio-card .precio{font-weight:800;color:var(--rose-dark);font-size:1.4rem;margin:0.6rem 0}

    .recommended{background:linear-gradient(90deg,#FFF0F6,#FDE9F4);border:2px solid rgba(236,72,153,0.08)}

    /* ---------- TESTIMONIOS ---------- */
    .testimonios{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.6rem;margin-top:1.6rem}
    .testimonio{background:white;border-radius:16px;padding:1.25rem;box-shadow:var(--shadow);position:relative;font-style:italic}
    .testimonio .autor{text-align:right;margin-top:.8rem;font-weight:700;color:var(--rose-dark)}

    /* ---------- CONTACTO ---------- */
    .contacto{
      display:flex;gap:2rem;align-items:flex-start;flex-wrap:wrap;justify-content:center;margin-top:1.2rem; align-items: center;
    }
    .contacto .info{flex:1;min-width:260px; justify-content: center; align-items: center ;}
    .contacto .form{flex:1;min-width:260px;max-width:560px}
    .contacto input,.contacto textarea{width:100%;padding:.8rem 1rem;border-radius:10px;border:1px solid rgba(200,140,170,0.12);margin-bottom:.8rem}
    .contacto button{padding:.85rem 1.2rem;border-radius:12px;border:0;background:linear-gradient(90deg,var(--rose),var(--violet));color:white;font-weight:700;cursor:pointer}

    /* ---------- FOOTER ---------- */
    footer{padding:2rem 1.25rem;background:rgba(255,255,255,0.9);text-align:center;color:var(--muted);border-top:1px solid rgba(220,180,200,0.06)}

    /* ---------- RESPONSIVE ---------- */
    @media(max-width:640px){
      .nav-container{padding:.8rem 1rem}
      header{border-bottom:1px solid rgba(236,72,153,0.06)}
      .logo{font-size:1.35rem}
      .hero{padding:2.4rem 1rem}
      section{padding:2.4rem 1rem}
      .menu-btn{font-size:1.4rem}
      #mobile-menu{padding:.8rem 1rem}
    }