
:root{
  --bg:#020617;
  --panel-soft:rgba(255,255,255,.05);
  --panel-border:rgba(255,255,255,.10);
  --text:#ffffff;
  --muted:#cbd5e1;
  --muted-2:#94a3b8;
  --cyan:#22d3ee;
  --yellow:#facc15;
  --green:#22c55e;
  --max:80rem;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  background:#020617;
  color:#fff;
  line-height:1.6;
  overflow-x:hidden;
}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
button{font:inherit;cursor:pointer}
.container{width:min(var(--max),calc(100% - 2rem));margin:0 auto}
.page-shell{min-height:100vh}
.sticky-header{
  position:sticky;
  top:0;
  z-index:50;
  border-bottom:1px solid rgba(255,255,255,.10);
  background:rgba(2,6,23,.90);
  backdrop-filter:blur(12px);
}
.top-strip{
  background:linear-gradient(to right,#06b6d4,#2563eb);
  font-size:.75rem;
  font-weight:600;
}
.top-strip-inner{
  padding:.75rem 1rem;
}
.top-strip-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.5rem 1rem;
  text-align:center;
}
.top-strip-serve{
  margin-top:.75rem;
  text-align:center;
}
.nowrap{white-space:nowrap}
@media (min-width:640px){
  .top-strip{font-size:.875rem}
  .top-strip-inner{
    display:flex;
    justify-content:space-between;
    gap:1rem;
    flex-wrap:wrap;
    align-items:center;
  }
  .top-strip-grid{
    display:flex;
    gap:1rem;
    flex-wrap:wrap;
    text-align:left;
  }
  .top-strip-serve{
    margin-top:0;
    text-align:right;
  }
}

.main-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:1rem;
  flex-wrap:wrap;
}
.brand-title{font-size:1.5rem;font-weight:900;letter-spacing:-.03em}
.brand-title span{color:var(--cyan)}
.brand-subtitle{font-size:.75rem;color:var(--muted-2)}
.desktop-nav{
  display:none;
  align-items:center;
  gap:1.5rem;
  font-size:.875rem;
  color:#e2e8f0;
}
.desktop-nav a:hover{color:var(--cyan)}
.desktop-actions{
  display:none;
  align-items:center;
  gap:.75rem;
}
@media (min-width:640px){.desktop-actions{display:flex}}
@media (min-width:1024px){.desktop-nav{display:flex}}
.mobile-action-row{padding:0 1rem 1rem}
.mobile-actions{display:flex;gap:.75rem}
.mobile-outline-button,.mobile-primary-button,.header-outline-button,.header-primary-button,.hero-primary-button,.hero-secondary-button,.section-outline-button,.cta-whatsapp,.purchase-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:1rem;
  transition:.25s ease;
}
.mobile-outline-button,.header-outline-button,.section-outline-button{
  border:1px solid rgba(255,255,255,.10);
  background:transparent;
  color:#fff;
}
.mobile-primary-button,.header-primary-button,.hero-primary-button{
  background:#06b6d4;
  color:#020617;
  box-shadow:0 10px 24px rgba(34,211,238,.20);
  font-weight:700;
}
.mobile-outline-button{flex:1;padding:.75rem 1rem;font-size:.875rem}
.mobile-primary-button{flex:1;padding:.75rem 1rem;font-size:.875rem}
.header-outline-button{padding:.625rem 1rem;font-size:.875rem}
.header-primary-button{padding:.625rem 1rem;font-size:.875rem}
@media (min-width:640px){.mobile-action-row{display:none}}
.header-outline-button:hover,.section-outline-button:hover,.hero-secondary-button:hover,.cta-whatsapp:hover,.mobile-outline-button:hover{
  transform:translateY(-2px);
  border-color:rgba(34,211,238,.40);
  color:var(--cyan);
}
.header-primary-button:hover,.hero-primary-button:hover,.mobile-primary-button:hover{transform:translateY(-2px)}

.hero-section{position:relative;overflow:hidden}
.hero-glow{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at top left, rgba(6,182,212,.18), transparent 30%),
    radial-gradient(circle at bottom right, rgba(59,130,246,.18), transparent 28%);
}
.hero-grid{
  position:relative;
  display:grid;
  grid-template-columns:1fr;
  gap:2.5rem;
  align-items:center;
  padding:5rem 1rem;
}
@media (min-width:1024px){.hero-grid{grid-template-columns:1fr 1fr}}
.hero-pill{
  display:inline-flex;
  border-radius:999px;
  border:1px solid rgba(34,211,238,.30);
  background:rgba(34,211,238,.10);
  padding:.5rem 1rem;
  font-size:.875rem;
  color:#67e8f9;
}
.hero-copy h1{margin:1.5rem 0 0;font-size:2.5rem;line-height:1.1;font-weight:900;letter-spacing:-.04em}
.hero-copy h1 span{color:var(--cyan)}
.hero-copy p{margin-top:1.25rem;max-width:42rem;color:var(--muted);font-size:1.125rem}
@media (min-width:768px){.hero-copy h1{font-size:3.75rem}}
.hero-cta-row{margin-top:2rem;display:flex;flex-wrap:wrap;gap:1rem}
.hero-primary-button{padding:.75rem 1.5rem}
.hero-secondary-button{
  border:1px solid rgba(255,255,255,.10);
  background:transparent;
  color:#fff;
  padding:.75rem 1.5rem;
  font-weight:600;
}
.stats-grid{margin-top:2rem;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
@media (min-width:768px){.stats-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.stat-card{
  border-radius:1rem;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.05);
  padding:1rem;
  transition:.3s ease;
}
.stat-card:hover{transform:translateY(-6px) scale(1.02);border-color:rgba(34,211,238,.30);box-shadow:0 16px 30px rgba(34,211,238,.10)}
.stat-value{font-size:1.5rem;font-weight:900;color:var(--cyan)}
.stat-label{font-size:.875rem;color:var(--muted-2)}

.hero-panel{display:grid;gap:1rem}
.hero-feature-card{
  border-radius:1.5rem;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.05);
  padding:1.5rem;
  box-shadow:0 25px 60px rgba(34,211,238,.08);
  transition:.3s ease;
}
.hero-feature-card:hover{transform:translateY(-4px);border-color:rgba(34,211,238,.30)}
.hero-feature-head{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.hero-feature-label{font-size:.875rem;color:var(--muted-2)}
.hero-feature-title{margin-top:.25rem;font-size:2rem;font-weight:900;line-height:1.1}
.hero-feature-pill{
  border-radius:999px;
  background:rgba(74,222,128,.20);
  color:#86efac;
  padding:.5rem .75rem;
  font-size:.875rem;
  font-weight:700;
  white-space:nowrap;
}
.hero-feature-media{
  margin-top:1.5rem;
  overflow:hidden;
  border-radius:1.5rem;
  border:1px solid rgba(255,255,255,.10);
  background:#020617;
}
.hero-feature-image{height:13rem;background-size:cover;background-position:center;transition:transform .5s ease}
.hero-feature-card:hover .hero-feature-image{transform:scale(1.04)}
.hero-feature-body{padding:1.25rem}
.hero-feature-row{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem}
.deal-label{font-size:.75rem;color:var(--muted-2);letter-spacing:.3em;text-transform:uppercase}
.deal-price{margin-top:.5rem;color:var(--cyan);font-size:2.5rem;font-weight:900;line-height:1}
.deal-side{text-align:right}
.deal-old-price{color:#64748b;text-decoration:line-through;font-size:.875rem}
.deal-sub-text{color:#86efac;font-size:.875rem}
.mini-badge-row{margin-top:1.5rem;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}
.mini-badge-row div{border-radius:1rem;background:#0f172a;padding:.75rem;text-align:center;font-size:.875rem}
.mini-panel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.mini-panel{border-radius:1rem;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.05);padding:1.25rem;transition:.3s ease}
.mini-panel:hover{transform:translateY(-6px) scale(1.02);border-color:rgba(34,211,238,.30)}
.mini-panel-label{font-size:.875rem;color:var(--muted-2)}
.mini-panel-title{margin-top:.5rem;font-size:1.25rem;font-weight:900}

.deals-section{padding:2rem 1rem}
.deals-box{border-radius:2rem;border:1px solid rgba(250,204,21,.20);background:linear-gradient(to right, rgba(234,179,8,.10), rgba(249,115,22,.10), rgba(239,68,68,.10));padding:2rem;text-align:center}
.flash-pill{display:inline-flex;border-radius:999px;background:rgba(250,204,21,.20);color:#fde68a;padding:.625rem 1rem;font-size:.875rem;font-weight:700}
.deals-box h2{margin:1rem 0 0;font-size:2.2rem;font-weight:900;line-height:1.1}
.deals-box p{max-width:42rem;margin:.75rem auto 0;color:var(--muted)}
@media (min-width:768px){.deals-box h2{font-size:3rem}}

.featured-section{padding:4rem 1rem}
.section-head{margin-bottom:2rem;display:flex;align-items:flex-end;justify-content:space-between;gap:1rem}
.section-kicker{font-weight:700;color:var(--cyan)}
.section-head h2{margin:.5rem 0 0;font-size:2.2rem;line-height:1.1;font-weight:900}
.section-outline-button{display:none;padding:.625rem 1rem;font-size:.875rem}
@media (min-width:768px){.section-outline-button{display:inline-flex}}
.products-grid{display:grid;grid-template-columns:1fr;gap:1.5rem}
@media (min-width:640px){.products-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.products-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1280px){.products-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.product-card{display:flex;flex-direction:column;height:100%;overflow:hidden;border-radius:2rem;background:#041f45;box-shadow:0 20px 50px rgba(0,0,0,.22);transition:.3s ease}
.product-card:hover{transform:translateY(-10px) scale(1.02);box-shadow:0 24px 55px rgba(34,211,238,.12)}
.product-top{position:relative;height:18rem;display:flex;align-items:center;justify-content:center}
.from-cyan-200.to-blue-300{background:linear-gradient(135deg,#bae6fd,#93c5fd)}
.from-green-200.to-green-400{background:linear-gradient(135deg,#bbf7d0,#86efac)}
.from-neutral-100.to-zinc-300{background:linear-gradient(135deg,#f5f5f5,#d4d4d8)}
.from-slate-100.to-stone-200{background:linear-gradient(135deg,#f1f5f9,#e7e5e4)}
.from-cyan-100.to-slate-200{background:linear-gradient(135deg,#cffafe,#e2e8f0)}
.from-emerald-200.to-emerald-400{background:linear-gradient(135deg,#bbf7d0,#86efac)}
.from-teal-900.to-cyan-900{background:linear-gradient(135deg,#134e4a,#164e63)}
.from-indigo-900.to-violet-900{background:linear-gradient(135deg,#312e81,#5b21b6)}
.product-ribbon{position:absolute;left:-2.5rem;top:1.5rem;transform:rotate(-45deg);background:#ef4444;color:#fff;padding:.6rem 3.2rem;font-size:.75rem;font-weight:700;box-shadow:0 10px 24px rgba(0,0,0,.20)}
.product-logo-shell{display:flex;align-items:center;justify-content:center;width:10rem;height:10rem;border-radius:2rem;background:rgba(255,255,255,.72);box-shadow:0 12px 40px rgba(0,0,0,.12);backdrop-filter:blur(6px);transition:.3s ease}
.product-card:hover .product-logo-shell{transform:scale(1.05)}
.product-logo{width:6rem;height:6rem;object-fit:contain;transition:.3s ease}
.product-card:hover .product-logo{transform:scale(1.1)}
.product-body{display:flex;flex:1;flex-direction:column;padding:1.25rem;text-align:center}
.product-body h3{min-height:3.5rem;margin:0;font-size:1.6rem;line-height:1.15;font-weight:800}
.product-subtitle{min-height:2.5rem;margin-top:.25rem;font-size:.875rem;color:#cbd5e1}
.product-details{min-height:6rem;margin-top:.75rem;font-size:.875rem;line-height:1.75;color:var(--muted)}
.product-price-row{margin-top:.75rem;display:flex;align-items:center;justify-content:center;gap:.75rem}
.current-price{font-size:1.75rem;font-weight:900;color:var(--yellow)}
.old-price{font-size:.875rem;color:#94a3b8;text-decoration:line-through}
.purchase-button-wrap{margin-top:auto;padding-top:1.25rem}
.purchase-button{width:100%;border:1px solid rgba(74,222,128,.30);background:rgba(34,197,94,.10);color:#86efac;padding:.75rem 1.25rem;font-weight:600}
.product-card:hover .purchase-button{background:rgba(34,197,94,.20)}

.original-section{padding:2rem 1rem}
.original-grid{display:grid;grid-template-columns:1fr;gap:1.5rem}
@media (min-width:768px){.original-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.original-card{overflow:hidden;border-radius:2rem;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.05);transition:.3s ease}
.original-card:hover{transform:translateY(-8px) scale(1.01);border-color:rgba(34,211,238,.30);box-shadow:0 20px 40px rgba(34,211,238,.10)}
.original-image-wrap{height:14rem;overflow:hidden}
.original-image-wrap img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.original-card:hover .original-image-wrap img{transform:scale(1.05)}
.original-body{padding:1.25rem}
.small-kicker{font-size:.75rem;letter-spacing:.3em;text-transform:uppercase;color:var(--cyan)}
.original-body h3{margin:.5rem 0 0;font-size:1.5rem;font-weight:900}
.original-body p:last-child{margin-top:.5rem;color:var(--muted)}

.why-section{padding:4rem 1rem}
.why-grid{display:grid;grid-template-columns:1fr;gap:2rem}
@media (min-width:1024px){.why-grid{grid-template-columns:1fr 1fr}}
.why-card{border-radius:2rem;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.05);padding:2rem}
.why-card h2{margin:.75rem 0 0;font-size:2.2rem;line-height:1.1;font-weight:900}
.reasons-grid{margin-top:1.5rem;display:grid;grid-template-columns:1fr;gap:1rem}
@media (min-width:640px){.reasons-grid{grid-template-columns:1fr 1fr}}
.reason-item{border-radius:1rem;background:#0f172a;padding:1rem;color:var(--muted);transition:.25s ease}
.reason-item:hover{transform:translateY(-4px);background:#172033}
.why-side{display:grid;gap:1rem}
.growth-card{border-radius:2rem;background:linear-gradient(to right,#22d3ee,#2563eb);color:#0f172a;padding:2rem}
.growth-small{font-size:.75rem;text-transform:uppercase;letter-spacing:.24em;font-weight:800}
.growth-big{margin-top:.5rem;font-size:3rem;line-height:1;font-weight:900}
.growth-copy{margin-top:.25rem;font-size:.95rem;font-weight:500}
.metric-grid{display:grid;grid-template-columns:1fr;gap:1rem}
@media (min-width:640px){.metric-grid{grid-template-columns:1fr 1fr}}
.metric-card{border-radius:1.5rem;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.05);padding:1.5rem}
.metric-label{font-size:.875rem;color:var(--muted-2)}
.metric-value{margin-top:.5rem;font-size:1.75rem;font-weight:900}

.cta-section{padding:0 1rem 5rem}
.cta-card{border-radius:2rem;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.05);padding:2rem;text-align:center}
.cta-card h2{margin:.75rem auto 0;max-width:56rem;font-size:2.3rem;line-height:1.05;font-weight:900}
.cta-copy{max-width:42rem;margin:1rem auto 0;color:var(--muted)}
.cta-row{margin-top:2rem;display:flex;flex-wrap:wrap;justify-content:center;gap:1rem}
.cta-whatsapp{border:1px solid rgba(74,222,128,.30);background:rgba(34,197,94,.10);color:#86efac;padding:.75rem 1.5rem;font-weight:600}

.floating-whatsapp{
  position:fixed;
  bottom:1.5rem;
  right:1.5rem;
  z-index:50;
  display:flex;
  width:4rem;
  height:4rem;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:var(--green);
  color:#fff;
  box-shadow:0 24px 50px rgba(34,197,94,.35);
  animation:wa-bounce 1.2s infinite ease-in-out;
}
.floating-whatsapp-icon{width:2rem;height:2rem}
@keyframes wa-bounce{
  0%{transform:translateY(0)}
  50%{transform:translateY(-12px)}
  100%{transform:translateY(0)}
}

.reveal{opacity:0;transform:translateY(24px);transition:opacity .45s ease, transform .45s ease}
.reveal.is-visible{opacity:1;transform:translateY(0)}
