.nav{display:flex;justify-content:space-between;align-items:center;padding:10px 0}
.brand{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:.3px}
.bead{width:12px;height:12px;border-radius:50%;background:conic-gradient(from 0deg,var(--pink),var(--orange),var(--coral),var(--pink));box-shadow:0 0 18px rgba(255,104,76,.65),0 0 36px rgba(255,47,110,.35)}
.nav-cta{display:flex;gap:10px;flex-wrap:wrap}
.chip{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.05));font-weight:900;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.chip:hover{filter:saturate(120%) brightness(1.05)}

.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:22px;align-items:center;padding:28px 0}
@media (max-width:980px){
  .hero{grid-template-columns:1fr;text-align:center}
  .nav-cta{
    display:flex;           /* keep them visible */
    justify-content:center; /* center them under the brand */
    gap:8px;
    margin-top:8px;
    flex-wrap:wrap;         /* allow wrapping on small phones */
  }
}

/* 🔧 POLISH FOR SMALLER SCREENS */
@media (max-width:480px){
  .chip{
    padding:8px 12px;
    font-weight:800;
    font-size:13px;          /* a little smaller text */
  }
}
/* Hide Buy CTA on mobile */
@media (max-width: 980px) {
  .nav-cta a#buyTop {
    display: none !important;
  }
}


.eyebrow{display:inline-block;color:#0a0a0a;background:linear-gradient(90deg,var(--pink),var(--orange));padding:6px 10px;border-radius:999px;font-size:12px;letter-spacing:.35px;text-transform:uppercase;box-shadow:0 6px 26px rgba(255,104,76,.35)}
.lede{font-size:clamp(16px,2.4vw,19px);margin:0}

.cta-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.btn{padding:13px 16px;border-radius:14px;font-weight:900;letter-spacing:.2px;box-shadow:0 8px 24px rgba(0,0,0,.35)}
.btn-primary{background:linear-gradient(135deg,var(--pink),var(--orange));color:#0A0A0A;border:none;box-shadow:0 10px 30px rgba(255,47,110,.35),0 6px 22px rgba(255,116,46,.24)}
.btn-ghost{background:rgba(255,255,255,.06)}
.spark{height:3px;width:220px;margin-top:12px;background:linear-gradient(90deg,var(--pink),var(--orange));box-shadow:0 0 22px rgba(255,116,46,.35),0 0 22px rgba(255,47,110,.35)}

/* HERO CARD — no panel bg, ratio-locked image */
.hero-card{border-radius:var(--r);overflow:visible;background:none;box-shadow:none;margin:0;justify-self:center;align-self:center}
.hero-card img{display:block;width:100%;height:auto;aspect-ratio:2/3;max-width:480px;margin:0 auto;object-fit:contain;border-radius:12px;box-shadow:0 10px 40px rgba(255,47,110,.25)}
.hero-card .caption{display:none}

/* Optional legacy caption style (kept for safety if re-enabled anywhere) */
.caption{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;color:#E6E9EE;font-size:12px;background:linear-gradient(90deg,rgba(255,47,110,.18),rgba(255,63,46,.14),rgba(255,116,46,.18))}

/* STRIP + TAGS (centered, spaced, pop) */
.strip{margin:28px 0;border-radius:14px;overflow:hidden;background:linear-gradient(90deg,rgba(255,47,110,.22),rgba(255,63,46,.18),rgba(255,116,46,.22));box-shadow:0 8px 30px rgba(255,47,110,.18),inset 0 0 40px rgba(255,116,46,.12)}
.strip .inner{display:flex;flex-wrap:wrap;gap:22px;align-items:center;justify-content:center;padding:16px 10px;text-align:center}

.tag{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;background:rgba(0,0,0,.45);color:#fff;box-shadow:0 0 10px rgba(255,47,110,.3),inset 0 0 6px rgba(255,255,255,.08);transition:all .25s ease}
.tag:hover{transform:scale(1.04);filter:brightness(1.15) saturate(1.2);box-shadow:0 0 16px rgba(255,116,46,.45),0 0 10px rgba(255,47,110,.35)}

/* CARDS + GRIDS */
.card{background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.04));border-radius:var(--r);padding:18px;margin:22px 0;box-shadow:inset 0 0 0 .5px rgba(255,255,255,.18),0 8px 34px rgba(0,0,0,.35)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
@media (max-width:980px){.grid-3,.grid-2{grid-template-columns:1fr}}

/* HOW IT WORKS — equal heights + CTAs aligned */
.step{
  display:flex;flex-direction:column;justify-content:space-between;
  border-radius:12px;padding:14px;
  background:
    radial-gradient(600px 200px at 0% 0%,rgba(255,47,110,.22),transparent 60%),
    radial-gradient(600px 200px at 100% 20%,rgba(255,116,46,.18),transparent 60%),
    rgba(255,255,255,.02);
  box-shadow:inset 0 0 0 .5px rgba(255,255,255,.14);
  min-height:260px; /* equalize card height so CTAs line up */
}
.step h3{margin:.2em 0 .3em;font-size:18px}
.step p{margin:0 0 12px;color:#ECF0F6;flex-grow:1}
.step .cta-row{margin-top:auto;justify-content:center;align-items:center}

/* FOOTER */
footer{color:#D1D6DF;font-size:13px;padding:28px 0;text-align:center}