/* Frost & Sprinkle — site styles */
:root{
  --pink:#0b7c88; --pink-dark:#075a63; --pink-soft:#d9f3f4; --blush:#eefafa;
  --cream:#f7fbfd; --milk:#ffffff; --choc:#1f2a4a; --choc-soft:#56627e;
  --mint:#7fd8b0; --sky:#8fd3e8; --butter:#f7e3a1;
  --radius:22px; --shadow:0 14px 40px rgba(7,90,99,.14);
  --font-script:'Pacifico',cursive; --font-head:'Fredoka',sans-serif; --font-body:'Nunito',sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);color:var(--choc);background:var(--cream);line-height:1.65;font-size:17px;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{width:min(1140px,100% - 32px);margin-inline:auto}

/* Announcement bar */
.topbar{background:var(--choc);color:#fff;text-align:center;font-size:14px;padding:8px 12px;font-weight:700;letter-spacing:.3px}
.topbar span{color:var(--butter)}

/* Header / nav */
header.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(255,250,244,.94);backdrop-filter:blur(10px);border-bottom:1px solid #cdeef0}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0}
.logo{text-decoration:none;line-height:1}
.logo .l1{font-family:var(--font-script);color:var(--pink);font-size:30px;display:block}
.logo .l2{font-family:var(--font-head);font-weight:600;font-size:13px;letter-spacing:2.5px;text-transform:uppercase;color:var(--choc)}
.menu{display:flex;gap:6px;list-style:none;align-items:center}
.menu a{text-decoration:none;font-family:var(--font-head);font-weight:500;padding:8px 14px;border-radius:999px;transition:.2s}
.menu a:hover,.menu a.active{background:var(--pink-soft);color:var(--pink-dark)}
.menu a.cta{background:var(--pink);color:#fff}
.menu a.cta:hover{background:var(--pink-dark);color:#fff}
.burger{display:none;background:none;border:0;cursor:pointer;width:44px;height:44px;border-radius:12px}
.burger span{display:block;width:24px;height:3px;background:var(--choc);margin:5px auto;border-radius:3px;transition:.3s}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-head);font-weight:600;font-size:17px;text-decoration:none;padding:14px 28px;border-radius:999px;border:2px solid var(--pink);transition:.2s;cursor:pointer}
.btn-primary{background:var(--pink);color:#fff;box-shadow:0 8px 20px rgba(214,36,110,.3)}
.btn-primary:hover{background:var(--pink-dark);border-color:var(--pink-dark);transform:translateY(-2px)}
.btn-ghost{background:#fff;color:var(--pink)}
.btn-ghost:hover{background:var(--pink-soft)}

/* Typography */
h1,h2,h3{font-family:var(--font-head);line-height:1.15;color:var(--choc)}
h1{font-size:clamp(40px,6vw,68px);font-weight:700}
h2{font-size:clamp(30px,4vw,44px);font-weight:700}
h3{font-size:22px;font-weight:600}
.script{font-family:var(--font-script);color:var(--pink);font-weight:400}
.eyebrow{display:inline-block;background:var(--pink);color:#fff;font-family:var(--font-head);font-weight:600;font-size:14px;letter-spacing:1.5px;text-transform:uppercase;padding:6px 16px;border-radius:999px;transform:rotate(-2deg);margin-bottom:18px}
.lead{font-size:19px;color:var(--choc-soft);max-width:560px}
.center{text-align:center}.center .lead{margin-inline:auto}
section{padding:90px 0;position:relative}
.section-head{margin-bottom:48px}

/* Hero */
.hero{background:radial-gradient(circle at 85% 20%,#d4f4f5 0,transparent 45%),radial-gradient(circle at 10% 90%,#fff 0,transparent 40%),var(--blush);padding:70px 0 110px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:50px;align-items:center}
.hero h1 .script{display:block;font-size:1.15em;margin-bottom:4px}
.hero .tags{font-family:var(--font-head);font-weight:600;font-size:20px;color:var(--pink-dark);margin:14px 0 10px}
.hero .btns{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.hero-art{position:relative;aspect-ratio:1/1}
.splash{position:absolute;inset:4%;background:#fff;border-radius:58% 42% 51% 49%/45% 55% 45% 55%;box-shadow:var(--shadow);animation:blob 12s ease-in-out infinite}
@keyframes blob{50%{border-radius:42% 58% 45% 55%/55% 45% 55% 45%}}
.tray{position:absolute;inset:16% 10%;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;transform:rotate(-8deg)}
.badge-round{position:absolute;right:-4%;bottom:-6%;width:150px;height:150px;border-radius:50%;background:#fff;border:3px dashed var(--pink);display:grid;place-items:center;text-align:center;font-family:var(--font-head);font-weight:700;color:var(--pink);font-size:15px;line-height:1.15;transform:rotate(10deg);box-shadow:var(--shadow);padding:12px}
.badge-round b{font-family:var(--font-script);font-weight:400;font-size:26px;display:block}
.wave{position:absolute;left:0;right:0;bottom:-1px;height:70px;width:100%}

/* The pop (CSS ice-lolly wrapper) */
.pop{--c:#bfe9ec;position:relative;background:var(--c);border-radius:14px;min-height:62px;display:grid;place-items:center;text-align:center;padding:12px 18px;font-family:var(--font-head);font-weight:600;font-size:14px;color:#1f2a4a;box-shadow:inset 0 -6px 0 rgba(0,0,0,.06),0 6px 14px rgba(31,42,74,.12)}
.pop::before,.pop::after{content:"";position:absolute;top:6px;bottom:6px;width:8px;background:repeating-linear-gradient(0deg,rgba(255,255,255,.55) 0 3px,transparent 3px 6px)}
.pop::before{left:4px}.pop::after{right:4px}
.pop .shine{position:absolute;left:18px;right:18px;top:7px;height:6px;border-radius:6px;background:rgba(255,255,255,.45)}
.pop.speckle{background:radial-gradient(circle,#c98b6b 1.5px,transparent 2px) 0 0/14px 14px,var(--c)}
.pop.speckle-color{background:radial-gradient(circle,#14a0ac 1.5px,transparent 2px) 0 0/16px 16px,radial-gradient(circle,#6cc4e6 1.5px,transparent 2px) 8px 8px/16px 16px,var(--c)}

/* Features */
.features{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.feature{background:#fff;border-radius:var(--radius);padding:30px 24px;text-align:center;box-shadow:var(--shadow);transition:.25s}
.feature:hover{transform:translateY(-6px)}
.feature .ico{width:70px;height:70px;border-radius:50%;background:var(--pink-soft);display:grid;place-items:center;margin:0 auto 16px;color:var(--pink)}
.feature p{color:var(--choc-soft);font-size:15.5px;margin-top:6px}

/* Flavour grid */
.flavour-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:22px}
.flavour-card{background:#fff;border-radius:var(--radius);padding:18px;box-shadow:var(--shadow);transition:.25s}
.flavour-card:hover{transform:translateY(-5px) rotate(-1deg)}
.flavour-card .pop{min-height:96px;font-size:17px;margin-bottom:14px}
.flavour-card h3{font-size:19px}
.flavour-card p{font-size:14.5px;color:var(--choc-soft);margin-top:4px}
.chip{display:inline-block;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:1px;padding:3px 10px;border-radius:999px;background:var(--pink-soft);color:var(--pink-dark);margin-top:10px}
.filters{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-bottom:36px}
.filters button{font-family:var(--font-head);font-weight:600;font-size:15px;border:2px solid var(--pink);background:#fff;color:var(--pink);padding:9px 20px;border-radius:999px;cursor:pointer;transition:.2s}
.filters button.on,.filters button:hover{background:var(--pink);color:#fff}

/* Split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.panel{background:#fff;border-radius:30px;padding:40px;box-shadow:var(--shadow)}
.checklist{list-style:none;margin-top:20px;display:grid;gap:12px}
.checklist li{display:flex;gap:12px;align-items:flex-start}
.checklist li::before{content:"♥";color:var(--pink);font-size:18px;line-height:1.4}

/* Band */
.band{background:var(--pink);color:#fff;padding:70px 0;text-align:center;overflow:hidden}
.band h2{color:#fff}
.band p{opacity:.92;max-width:600px;margin:12px auto 26px;font-size:18px}
.band .btn-ghost{border-color:#fff}
.dark{background:var(--choc);color:#fff}
.dark h2,.dark h3{color:#fff}
.dark .lead{color:#d9e6ef}

/* Steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;counter-reset:s}
.step{background:#fff;border-radius:var(--radius);padding:32px 26px;box-shadow:var(--shadow);position:relative}
.step::before{counter-increment:s;content:counter(s);position:absolute;top:-20px;left:24px;width:44px;height:44px;border-radius:50%;background:var(--pink);color:#fff;display:grid;place-items:center;font-family:var(--font-head);font-weight:700;font-size:20px}
.step h3{margin-top:10px}
.step p{color:var(--choc-soft);font-size:15.5px;margin-top:6px}

/* Notice */
.notice{background:#fff;border:3px dashed var(--pink);border-radius:var(--radius);padding:26px 30px;display:flex;gap:20px;align-items:center}
.notice .ico{flex:none;width:64px;height:64px;border-radius:50%;background:var(--pink-soft);color:var(--pink);display:grid;place-items:center}
.notice h3{color:var(--pink-dark)}

/* Testimonials */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.quote{background:#fff;border-radius:var(--radius);padding:28px;box-shadow:var(--shadow)}
.quote .stars{color:#f5a623;letter-spacing:2px;margin-bottom:8px}
.quote cite{display:block;margin-top:14px;font-style:normal;font-weight:800;color:var(--pink-dark)}

/* Page hero (inner) */
.page-hero{background:var(--blush);padding:70px 0 90px;text-align:center;overflow:hidden}
.page-hero h1 .script{font-size:1.1em}

/* Forms */
form .row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}
.field label{font-weight:800;font-size:14.5px}
.field input,.field select,.field textarea{font:inherit;padding:13px 16px;border-radius:14px;border:2px solid #c7ecee;background:var(--cream);color:var(--choc);transition:.2s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--pink);background:#fff}
.qty-list{display:grid;grid-template-columns:repeat(2,1fr);gap:8px 18px;background:var(--blush);padding:16px;border-radius:14px}
.qty-list label{display:flex;justify-content:space-between;align-items:center;gap:10px;font-weight:600;font-size:15px}
.qty-list input{width:64px;padding:6px 8px;border-radius:10px;border:2px solid #c7ecee;font:inherit;text-align:center}
.contact-cards{display:grid;gap:16px}
.contact-card{display:flex;gap:16px;align-items:center;background:#fff;border-radius:18px;padding:18px 20px;box-shadow:var(--shadow);text-decoration:none}
.contact-card .ico{flex:none;width:52px;height:52px;border-radius:50%;background:var(--pink-soft);color:var(--pink);display:grid;place-items:center}
.contact-card small{display:block;color:var(--choc-soft);font-size:13px;text-transform:uppercase;letter-spacing:1px;font-weight:800}
.contact-card strong{font-family:var(--font-head);font-size:18px}

/* FAQ */
details{background:#fff;border-radius:16px;padding:18px 22px;box-shadow:0 6px 18px rgba(7,90,99,.08);margin-bottom:12px}
summary{cursor:pointer;font-family:var(--font-head);font-weight:600;font-size:18px;list-style:none;display:flex;justify-content:space-between;gap:12px}
summary::after{content:"+";color:var(--pink);font-size:24px;line-height:1}
details[open] summary::after{content:"–"}
details p{margin-top:10px;color:var(--choc-soft)}

/* Age gate */
.agegate{position:fixed;inset:0;z-index:100;background:rgba(31,42,74,.85);backdrop-filter:blur(6px);display:grid;place-items:center;padding:16px}
.agegate .box{background:#fff;border-radius:28px;padding:40px 32px;max-width:440px;text-align:center}
.agegate .box p{color:var(--choc-soft);margin:10px 0 24px}
.agegate .btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.agegate.hide{display:none}
.adult-theme{--c-bg:#121a33}
.adult-hero{background:radial-gradient(circle at 80% 10%,#123a52 0,transparent 50%),#121a33;color:#fff}
.adult-hero h1,.adult-hero h2{color:#fff}
.adult-hero .lead{color:#d3eef0}
.small-print{font-size:13.5px;color:var(--choc-soft);margin-top:18px}

/* Footer */
footer.site{background:var(--choc);color:#dde9f1;padding:64px 0 28px;font-size:15.5px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:36px}
footer .logo .l1{color:#5fd0d8}
footer .logo .l2{color:#fff}
footer h4{font-family:var(--font-head);color:#fff;font-size:18px;margin-bottom:12px}
footer ul{list-style:none;display:grid;gap:8px}
footer a{text-decoration:none;opacity:.9}
footer a:hover{opacity:1;color:#5fd0d8}
.socials{display:flex;gap:10px;margin-top:16px}
.socials a{width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.1);display:grid;place-items:center}
.copy{border-top:1px solid rgba(255,255,255,.12);margin-top:40px;padding-top:22px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:13.5px;opacity:.75}

/* Floating WhatsApp */
.float-wa{position:fixed;right:18px;bottom:18px;z-index:60;width:60px;height:60px;border-radius:50%;background:#25d366;color:#fff;display:grid;place-items:center;box-shadow:0 10px 24px rgba(0,0,0,.25);transition:.2s}
.float-wa:hover{transform:scale(1.08)}

/* Reveal */
.reveal{}

/* Responsive */
@media (max-width:960px){
  .hero-grid,.split{grid-template-columns:1fr}
  .hero-art{max-width:460px;margin:0 auto;width:100%}
  .features{grid-template-columns:repeat(2,1fr)}
  .steps,.quotes{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  .burger{display:block}
  .menu{position:absolute;top:100%;left:0;right:0;background:var(--cream);flex-direction:column;align-items:stretch;padding:12px 16px 20px;border-bottom:1px solid #cdeef0;display:none}
  .menu.open{display:flex}
  .menu a{display:block;padding:12px 16px}
  .burger.x span:nth-child(1){transform:translateY(8px) rotate(45deg)}
  .burger.x span:nth-child(2){opacity:0}
  .burger.x span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
  section{padding:64px 0}
  .features{grid-template-columns:1fr}
  form .row,.qty-list{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr}
  .badge-round{width:118px;height:118px;font-size:12px}.badge-round b{font-size:20px}
  .notice{flex-direction:column;text-align:center}
  .pop{font-size:12px;padding:10px 14px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}

.wa-ready{margin-top:16px;padding:16px;border-radius:14px;background:var(--pink-soft);text-align:center}
.form-msg{color:var(--pink-dark);font-weight:800;margin-top:12px}