:root{
  --bg:#fff7fb;
  --card:#ffffff;
  --ink:#2b1b2a;
  --muted:rgba(43,27,42,.68);
  --brand:#ff4fa2;
  --brand2:#4a298d;
  --ring:rgba(255,79,162,.28);
  --shadow:0 18px 45px rgba(35,22,45,.12);
  --radius:26px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,Helvetica,Arial;
  color:var(--ink);
  background:
    radial-gradient(1200px 700px at 15% 10%, rgba(255,79,162,.15), transparent 60%),
    radial-gradient(900px 650px at 85% 5%, rgba(74,41,141,.14), transparent 55%),
    radial-gradient(900px 650px at 55% 95%, rgba(255,170,214,.22), transparent 55%),
    linear-gradient(180deg, #fff, var(--bg));
  overflow-x:hidden;
}

/* candy background texture */
.bgSprinkles{
  position:fixed; inset:0; pointer-events:none; opacity:.22;
  background-image:
    radial-gradient(circle at 10px 10px, rgba(255,79,162,.35) 2px, transparent 3px),
    radial-gradient(circle at 40px 25px, rgba(74,41,141,.25) 2px, transparent 3px),
    radial-gradient(circle at 70px 45px, rgba(255,170,214,.35) 2px, transparent 3px);
  background-size:90px 70px;
  filter: blur(.2px);
}

.container{max-width:1180px;margin:0 auto;padding:22px 18px 48px}

.topbar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:10px 0;
}
.brandRow{display:flex;gap:14px;align-items:center}
.logo{
  width:86px;height:86px;border-radius:22px;background:#fff;
  box-shadow:0 14px 35px rgba(35,22,45,.14);
  border:1px solid rgba(255,79,162,.18);
  overflow:hidden;
}
.logo img{width:100%;height:100%;object-fit:contain;padding:10px}
.brandText .t1{font-weight:1000;font-size:20px;letter-spacing:.2px}
.brandText .t2{color:var(--muted);font-weight:800;font-size:12.5px;margin-top:2px}
.chip{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 12px;border-radius:999px;
  border:1px solid rgba(74,41,141,.18);
  background:rgba(255,255,255,.75);
  backdrop-filter: blur(10px);
  font-weight:900;font-size:12px;
}
.chip .dot{width:8px;height:8px;border-radius:999px;background:var(--brand)}
.langBtn{
  display:inline-flex;align-items:center;gap:10px;
  padding:10px 14px;border-radius:999px;
  background:linear-gradient(135deg, var(--brand), var(--brand2));
  color:#fff;border:none;cursor:pointer;
  font-weight:1000;
  box-shadow:0 10px 24px rgba(255,79,162,.22);
}
.langBtn:active{transform:translateY(1px)}
.langBtn .mini{opacity:.9;font-weight:900;font-size:12px}
.langBtn .pill{
  background:rgba(255,255,255,.18);
  padding:5px 9px;border-radius:999px;
  border:1px solid rgba(255,255,255,.22);
  font-size:12px;
}

.grid{
  display:grid;grid-template-columns:420px 1fr;gap:18px;align-items:start;
}
@media (max-width:980px){
  .grid{grid-template-columns:1fr}
  .logo{width:100px;height:100px}
}

.card{
  background:rgba(255,255,255,.76);
  border:1px solid rgba(255,79,162,.14);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  backdrop-filter: blur(12px);
}
.cardPad{padding:18px}
.heroTitle{
  font-size:36px;line-height:1.08;margin:6px 0 10px;font-weight:1100;
  letter-spacing:-.6px;
}
.heroSub{color:var(--muted);font-weight:750;font-size:15px;line-height:1.5}
.badgeVal{
  display:inline-flex;gap:8px;align-items:center;
  padding:8px 12px;border-radius:999px;
  background:rgba(255,79,162,.10);
  border:1px solid rgba(255,79,162,.22);
  font-weight:1000;color:#8f1d66;font-size:12px;
}

.actions{
  display:flex;gap:10px;flex-wrap:wrap;margin-top:14px
}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:12px 14px;border-radius:16px;
  border:1px solid rgba(74,41,141,.14);
  background:#fff;
  font-weight:1000;color:var(--ink);
  cursor:pointer;text-decoration:none;
  box-shadow:0 10px 24px rgba(35,22,45,.06);
}
.btnPrimary{
  border:none;
  background:linear-gradient(135deg,var(--brand),var(--brand2));
  color:#fff;
}
.btnSoft{
  background:rgba(255,79,162,.09);
  border:1px solid rgba(255,79,162,.20);
  color:#7b2358;
}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}

.socialCard{
  display:grid;gap:12px
}
.socialGrid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:10px;
}
@media (max-width:520px){ .socialGrid{grid-template-columns:1fr} }
.socialBtn{
  display:flex;gap:12px;align-items:center;justify-content:space-between;
  padding:12px 14px;border-radius:18px;text-decoration:none;
  border:1px solid rgba(74,41,141,.14);
  background:rgba(255,255,255,.82);
}
.socialBtn .left{display:flex;gap:12px;align-items:center}
.iconBubble{
  width:42px;height:42px;border-radius:16px;
  display:grid;place-items:center;
  background:linear-gradient(135deg, rgba(255,79,162,.16), rgba(74,41,141,.12));
  border:1px solid rgba(255,79,162,.16);
}
.socialBtn .name{font-weight:1000}
.socialBtn .hint{font-size:12px;color:var(--muted);font-weight:800}
.socialBtn .arrow{opacity:.7}

.rightCol{display:grid;gap:18px}

.sectionTitle{
  font-weight:1100;font-size:16px;margin:0 0 10px;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
}
.sectionTitle small{color:var(--muted);font-weight:900}

.miniGrid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;
}
@media (max-width:980px){ .miniGrid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:520px){ .miniGrid{grid-template-columns:1fr} }

.prod{
  border:1px solid rgba(255,79,162,.14);
  background:rgba(255,255,255,.82);
  border-radius:22px;
  overflow:hidden;
}
.prod img{width:100%;height:150px;object-fit:cover}
.prod .p{padding:12px}
.prod .n{font-weight:1000}
.prod .d{color:var(--muted);font-weight:750;font-size:12.5px;margin-top:4px;line-height:1.35}
.prod .price{margin-top:10px;font-weight:1100;color:#7b2358}

.gallery{
  display:grid;grid-template-columns:repeat(4,1fr);gap:10px;
}
@media (max-width:980px){ .gallery{grid-template-columns:repeat(3,1fr)} }
@media (max-width:720px){ .gallery{grid-template-columns:repeat(2,1fr)} }
.gallery a{
  display:block;border-radius:18px;overflow:hidden;
  border:1px solid rgba(74,41,141,.12);
  background:#fff;
}
.gallery img{width:100%;height:140px;object-fit:cover;display:block}

.formGrid{
  display:grid;grid-template-columns:1fr 1fr;gap:10px;
}
@media (max-width:720px){ .formGrid{grid-template-columns:1fr} }
input,select,textarea{
  width:100%;
  padding:12px 12px;
  border-radius:16px;
  border:1px solid rgba(74,41,141,.14);
  outline:none;
  background:rgba(255,255,255,.86);
  font-weight:800;
}
textarea{min-height:110px;resize:vertical}
label{font-weight:1000;font-size:12px;color:rgba(35,22,45,.7)}
.helper{font-size:12px;color:var(--muted);font-weight:800;margin-top:6px}

.footer{
  margin-top:22px;
  color:rgba(35,22,45,.62);
  font-weight:850;
  font-size:12px;
  text-align:center;
}

/* WhatsApp floating */
.waFloat{
  position:fixed;right:18px;bottom:18px;z-index:50;
  display:flex;align-items:center;gap:10px;
  padding:12px 14px;border-radius:999px;
  background:linear-gradient(135deg,#25D366,#128C7E);
  color:#fff;text-decoration:none;
  font-weight:1100;
  box-shadow:0 18px 40px rgba(18,140,126,.25);
  border:1px solid rgba(255,255,255,.18);
}
.waFloat .bubble{
  width:36px;height:36px;border-radius:999px;
  background:rgba(255,255,255,.18);
  display:grid;place-items:center;
  border:1px solid rgba(255,255,255,.20);
}
.waFloat:hover{transform:translateY(-1px)}
.waFloat:active{transform:translateY(0)}

/* Hearts (Valentine effect) */
#hearts{position:fixed;inset:0;pointer-events:none;z-index:5}
.heart{
  position:absolute;
  width:12px;height:12px;
  transform:rotate(45deg);
  opacity:.95;
  filter: drop-shadow(0 10px 14px rgba(255,79,162,.12));
}
.heart:before,.heart:after{
  content:"";
  position:absolute;
  width:12px;height:12px;
  background:currentColor;
  border-radius:50%;
}
.heart{
  background:currentColor;
}
.heart:before{left:-6px;top:0}
.heart:after{left:0;top:-6px}

