/* Slay Shay Slimes: candy pop site styles */
:root{
  --pink:#FF7EB6; --pink-soft:#FFE3EF; --hot:#E0457B;
  --mint:#7FE0C9; --mint-soft:#E2F8F2;
  --lemon:#FFE066; --lemon-soft:#FFF7D6;
  --lilac:#B89CFF; --lilac-soft:#EEE7FF;
  --sky:#7EC8FF; --sky-soft:#E3F3FF;
  --peach:#FFB28C; --peach-soft:#FFEDE3;
  --grape:#3B1F4A; --grape-2:#6B4F7A;
  --cream:#FFFBF5; --white:#fff;
  --radius:24px; --radius-sm:14px;
  --shadow:0 6px 0 rgba(59,31,74,.12);
  --head:"Baloo 2",system-ui,sans-serif;
  --body:"Nunito",system-ui,-apple-system,"Segoe UI",sans-serif;
  --wrap:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--grape);font-family:var(--body);font-size:17px;line-height:1.6;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--hot);font-weight:700}
a:hover{color:var(--grape)}
:focus-visible{outline:3px solid var(--sky);outline-offset:3px;border-radius:6px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 16px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--grape);color:#fff;padding:8px 14px;border-radius:10px;z-index:99}
.skip:focus{left:8px}

/* Headings */
h1,h2,h3{font-family:var(--head);line-height:1.1;margin:0 0 .4em;font-weight:800}
h1{font-size:clamp(2.3rem,6vw,4.1rem)}
h2{font-size:clamp(1.8rem,4.2vw,2.8rem)}
h3{font-size:1.35rem}
.puffy{color:var(--pink);-webkit-text-stroke:7px #fff;paint-order:stroke fill;
  filter:drop-shadow(2px 0 0 var(--grape)) drop-shadow(-2px 0 0 var(--grape)) drop-shadow(0 2px 0 var(--grape)) drop-shadow(0 -2px 0 var(--grape)) drop-shadow(3px 6px 0 rgba(59,31,74,.22));
  letter-spacing:.5px}
.puffy.mint{color:var(--mint)} .puffy.lilac{color:var(--lilac)} .puffy.lemon{color:var(--lemon)} .puffy.sky{color:var(--sky)} .puffy.peach{color:var(--peach)}
.eyebrow{display:inline-block;font-family:var(--head);font-weight:700;font-size:.95rem;letter-spacing:.06em;text-transform:uppercase;background:var(--white);border:2px solid var(--grape);border-radius:999px;padding:2px 14px;margin-bottom:12px}
.lead{font-size:1.18rem;max-width:40em}
.center{text-align:center} .center .lead{margin-left:auto;margin-right:auto}

/* Top bar and header */
.topbar{background:linear-gradient(90deg,var(--pink),var(--lilac),var(--sky),var(--mint));color:var(--grape);text-align:center;font-weight:800;font-size:.92rem;padding:7px 16px}
.site-head{position:sticky;top:0;z-index:50;background:rgba(255,251,245,.94);backdrop-filter:blur(8px);border-bottom:3px solid var(--pink-soft)}
.head-in{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:70px}
.logo{display:flex;align-items:center;gap:8px;text-decoration:none}
.logo img{width:46px;height:auto}
.logo span{font-family:var(--head);font-weight:800;font-size:1.45rem;line-height:1;color:var(--pink);-webkit-text-stroke:4px #fff;paint-order:stroke fill;filter:drop-shadow(1px 0 0 var(--grape)) drop-shadow(-1px 0 0 var(--grape)) drop-shadow(0 1px 0 var(--grape)) drop-shadow(0 -1px 0 var(--grape))}
.nav{display:flex;align-items:center;gap:6px}
.nav a{font-family:var(--head);font-weight:700;font-size:1.02rem;color:var(--grape);text-decoration:none;padding:6px 14px;border-radius:999px;border:2px solid transparent}
.nav a:hover{border-color:var(--grape)}
.nav a[aria-current="page"]{background:var(--lemon);border-color:var(--grape)}
.nav a.nav-cta{background:var(--pink);color:#fff;border-color:var(--grape);box-shadow:0 3px 0 var(--grape)}
.menu-btn{display:none;font-family:var(--head);font-weight:800;font-size:1rem;background:var(--lemon);color:var(--grape);border:2px solid var(--grape);border-radius:999px;padding:6px 16px;cursor:pointer}
@media (max-width:900px){
  .menu-btn{display:block}
  .nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;background:var(--cream);padding:10px 16px 18px;border-bottom:3px solid var(--pink-soft)}
  .nav.open{display:flex}
  .nav a{padding:10px 14px}
}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--head);font-weight:800;font-size:1.12rem;text-decoration:none;color:var(--grape);background:var(--lemon);border:3px solid var(--grape);border-radius:999px;padding:10px 26px;box-shadow:0 5px 0 var(--grape);transition:transform .12s,box-shadow .12s;cursor:pointer}
.btn:hover{transform:translateY(-2px);box-shadow:0 7px 0 var(--grape);color:var(--grape)}
.btn:active{transform:translateY(3px);box-shadow:0 2px 0 var(--grape)}
.btn.pink{background:var(--pink);color:#fff} .btn.mint{background:var(--mint)} .btn.lilac{background:var(--lilac);color:#fff} .btn.white{background:#fff}
.btn[aria-disabled="true"]{background:#eee;color:var(--grape-2);box-shadow:0 5px 0 #bbb;border-color:#bbb;cursor:not-allowed}
.btn-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:22px}
.center .btn-row,.btn-row.center{justify-content:center}

/* Sections, drips and scallops */
section{position:relative}
.band{padding:64px 0}
.band.pink{background:var(--pink-soft)} .band.mint{background:var(--mint-soft)} .band.lemon{background:var(--lemon-soft)} .band.lilac{background:var(--lilac-soft)} .band.sky{background:var(--sky-soft)} .band.peach{background:var(--peach-soft)}
.drip{height:46px;margin-bottom:-1px;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 46' preserveAspectRatio='none'%3E%3Cpath d='M0 0H600V14C584 14 580 20 579 30C578 40 568 42 566 30C564 18 556 14 540 14C520 14 514 18 512 26C510 34 500 34 498 26C496 18 486 14 466 14C446 14 440 22 439 36C438 46 424 46 423 36C422 22 414 14 394 14C374 14 368 18 366 24C364 30 356 30 354 24C352 18 344 14 324 14C304 14 300 20 299 32C298 42 286 42 285 32C284 20 276 14 256 14C236 14 230 18 228 28C226 38 214 38 212 28C210 18 202 14 182 14C162 14 158 22 157 34C156 44 142 44 141 34C140 22 132 14 112 14C92 14 88 18 86 24C84 30 76 30 74 24C72 18 64 14 44 14C24 14 20 20 19 30C18 40 6 40 5 30C4 20 2 14 0 14Z'/%3E%3C/svg%3E") 0 0/600px 46px repeat-x;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 46' preserveAspectRatio='none'%3E%3Cpath d='M0 0H600V14C584 14 580 20 579 30C578 40 568 42 566 30C564 18 556 14 540 14C520 14 514 18 512 26C510 34 500 34 498 26C496 18 486 14 466 14C446 14 440 22 439 36C438 46 424 46 423 36C422 22 414 14 394 14C374 14 368 18 366 24C364 30 356 30 354 24C352 18 344 14 324 14C304 14 300 20 299 32C298 42 286 42 285 32C284 20 276 14 256 14C236 14 230 18 228 28C226 38 214 38 212 28C210 18 202 14 182 14C162 14 158 22 157 34C156 44 142 44 141 34C140 22 132 14 112 14C92 14 88 18 86 24C84 30 76 30 74 24C72 18 64 14 44 14C24 14 20 20 19 30C18 40 6 40 5 30C4 20 2 14 0 14Z'/%3E%3C/svg%3E") 0 0/600px 46px repeat-x}
.drip.pink{background:var(--pink)} .drip.mint{background:var(--mint)} .drip.lemon{background:var(--lemon)} .drip.lilac{background:var(--lilac)} .drip.sky{background:var(--sky)}
.scallop{height:22px;background:radial-gradient(circle at 22px 0,transparent 21px,currentColor 22px) 0 0/44px 22px repeat-x}

/* Hero */
.hero{padding:44px 0 30px;background:radial-gradient(circle at 12% 18%,var(--lilac-soft) 0 140px,transparent 141px),radial-gradient(circle at 92% 8%,var(--mint-soft) 0 170px,transparent 171px),var(--cream)}
.hero-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:34px;align-items:center}
.hero-art{border:4px solid var(--grape);border-radius:var(--radius);overflow:hidden;box-shadow:8px 10px 0 var(--pink);transform:rotate(1.2deg)}
.page-hero{padding:46px 0 26px;text-align:center;background:radial-gradient(circle at 10% 30%,var(--pink-soft) 0 120px,transparent 121px),radial-gradient(circle at 90% 20%,var(--lemon-soft) 0 150px,transparent 151px),var(--cream)}
.page-hero .lead{margin:0 auto}
.page-hero .gloop{width:110px;margin:0 auto 6px}
@media (max-width:860px){.hero-grid{grid-template-columns:1fr}.hero-art{transform:none}}

/* Trust strip */
.trust{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:26px 0 0}
.trust div{display:flex;align-items:center;gap:12px;background:#fff;border:3px solid var(--grape);border-radius:var(--radius-sm);padding:12px 16px;box-shadow:var(--shadow);font-weight:800;line-height:1.25}
.trust b{display:block;font-family:var(--head);font-size:1.1rem}
.trust small{font-weight:600;color:var(--grape-2)}
.trust .ico{flex:0 0 46px;height:46px;border-radius:50%;display:grid;place-items:center;font-size:1.4rem;border:2px solid var(--grape)}
@media (max-width:760px){.trust{grid-template-columns:1fr}}

/* Cards and grids */
.grid{display:grid;gap:22px}
.g2{grid-template-columns:repeat(2,1fr)} .g3{grid-template-columns:repeat(3,1fr)} .g4{grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){.g3,.g4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.g2,.g3,.g4{grid-template-columns:1fr}}
.card{background:#fff;border:3px solid var(--grape);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
.card.pink{background:var(--pink-soft)} .card.mint{background:var(--mint-soft)} .card.lemon{background:var(--lemon-soft)} .card.lilac{background:var(--lilac-soft)} .card.sky{background:var(--sky-soft)} .card.peach{background:var(--peach-soft)}
.card h3{margin-top:0}
.card p:last-child{margin-bottom:0}
.art{border:4px solid var(--grape);border-radius:var(--radius);overflow:hidden;box-shadow:8px 10px 0 var(--mint)}
.art.tilt-l{transform:rotate(-1deg)} .art.tilt-r{transform:rotate(1deg)}
.art.lemon{box-shadow:8px 10px 0 var(--lemon)} .art.lilac{box-shadow:8px 10px 0 var(--lilac)} .art.pink{box-shadow:8px 10px 0 var(--pink)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.split.wide-art{grid-template-columns:1.2fr 1fr}
@media (max-width:860px){.split,.split.wide-art{grid-template-columns:1fr}.art.tilt-l,.art.tilt-r{transform:none}}

/* Texture tiles */
.tex{text-align:center;padding-top:16px}
.tex .jar{width:150px;margin:0 auto 4px;transition:transform .2s}
.tex:hover .jar{transform:rotate(-6deg) scale(1.05)}
.tex h3{font-size:1.7rem;margin:4px 0}
.feel{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin:8px 0 12px;padding:0;list-style:none}
.feel li{background:#fff;border:2px solid var(--grape);border-radius:999px;padding:1px 12px;font-weight:800;font-size:.9rem}
.badge{display:inline-block;font-family:var(--head);font-weight:800;font-size:.85rem;background:var(--grape);color:#fff;border-radius:999px;padding:2px 12px;margin-bottom:8px}
.badge.mint{background:var(--mint);color:var(--grape)} .badge.lemon{background:var(--lemon);color:var(--grape)} .badge.pink{background:var(--hot)}
.price{font-family:var(--head);font-weight:800;font-size:1.15rem;margin-top:8px}
.soon{opacity:.92}
.soon .jar{filter:grayscale(.35)}

/* Steps */
.steps{counter-reset:s;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;list-style:none;padding:0;margin:0}
.steps li{counter-increment:s;background:#fff;border:3px solid var(--grape);border-radius:var(--radius);padding:26px 22px 22px;box-shadow:var(--shadow);position:relative}
.steps li::before{content:counter(s);position:absolute;top:-20px;left:20px;width:42px;height:42px;border-radius:50%;background:var(--pink);color:#fff;font-family:var(--head);font-weight:800;font-size:1.4rem;display:grid;place-items:center;border:3px solid var(--grape)}
.steps li:nth-child(2)::before{background:var(--mint);color:var(--grape)} .steps li:nth-child(3)::before{background:var(--lilac)}
.steps h3{margin-top:6px}
@media (max-width:760px){.steps{grid-template-columns:1fr;gap:30px}}

/* Mia's turn sticky notes */
.mia-turn{position:relative;background:var(--lemon-soft);border:3px dashed var(--hot);border-radius:var(--radius);padding:22px 22px 22px 108px;margin:20px 0;min-height:110px}
.mia-turn img{position:absolute;left:14px;top:16px;width:80px}
.mia-turn .tag{display:inline-block;font-family:var(--head);font-weight:800;background:var(--hot);color:#fff;border-radius:999px;padding:1px 12px;font-size:.9rem;margin-bottom:6px}
.mia-turn p{margin:.3em 0}
.mia-turn ul{margin:.4em 0 0;padding-left:1.2em}
@media (max-width:560px){.mia-turn{padding:96px 18px 18px}.mia-turn img{left:50%;transform:translateX(-50%)}}
.ph{background:var(--lemon);border-radius:6px;padding:0 6px;font-weight:800;white-space:nowrap}

/* Builder */
.builder{display:grid;grid-template-columns:1.5fr 1fr;gap:28px;align-items:start}
@media (max-width:900px){.builder{grid-template-columns:1fr}}
.step-box{background:#fff;border:3px solid var(--grape);border-radius:var(--radius);padding:20px 22px;margin-bottom:20px;box-shadow:var(--shadow)}
.step-box legend{font-family:var(--head);font-weight:800;font-size:1.3rem;padding:0 8px;background:var(--cream);border:3px solid var(--grape);border-radius:999px}
.step-box p.hint{margin:4px 0 10px;color:var(--grape-2);font-weight:600}
fieldset.step-box{min-width:0}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{position:relative}
.chip input{position:absolute;opacity:0;width:1px;height:1px}
.chip label{display:inline-flex;align-items:center;gap:8px;cursor:pointer;background:var(--cream);border:2px solid var(--grape);border-radius:999px;padding:6px 14px;font-weight:800;font-size:.98rem;user-select:none}
.chip label .dot{width:18px;height:18px;border-radius:50%;border:2px solid var(--grape)}
.chip input:checked+label{background:var(--pink);color:#fff;box-shadow:0 3px 0 var(--grape)}
.chip input:focus-visible+label{outline:3px solid var(--sky);outline-offset:2px}
.chip.off label{opacity:.55;cursor:not-allowed;border-style:dashed}
.chip.big label{border-radius:var(--radius-sm);padding:10px 16px;flex-direction:column;align-items:flex-start;gap:0}
.chip.big label small{font-weight:600}
.chip.big input:checked+label small{color:#fff}
.summary{position:sticky;top:92px;background:var(--lilac-soft);border:3px solid var(--grape);border-radius:var(--radius);padding:22px;box-shadow:8px 10px 0 var(--lilac)}
.summary .gloop{width:96px;margin:-58px auto 0}
.summary dl{margin:10px 0 16px;display:grid;grid-template-columns:auto 1fr;gap:6px 12px}
.summary dt{font-weight:800}
.summary dd{margin:0}
.combo{font-family:var(--head);font-weight:800;font-size:1.05rem;background:#fff;border:2px solid var(--grape);border-radius:var(--radius-sm);padding:8px 12px;text-align:center;margin-bottom:14px}
.combo b{font-size:1.6rem;color:var(--hot);display:block;line-height:1.1}

/* Forms */
.form{display:grid;gap:16px}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:640px){.form .row{grid-template-columns:1fr}}
.form label{font-weight:800;display:block;margin-bottom:4px}
.form label small{font-weight:600;color:var(--grape-2)}
.form input[type=text],.form input[type=email],.form input[type=number],.form input[type=date],.form select,.form textarea{width:100%;font:inherit;color:var(--grape);background:#fff;border:3px solid var(--grape);border-radius:var(--radius-sm);padding:10px 12px}
.form textarea{min-height:110px;resize:vertical}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:700}
.check input{width:22px;height:22px;margin-top:3px;accent-color:var(--hot);flex:0 0 22px}
.party-only[hidden]{display:none}
.note{background:var(--sky-soft);border:3px solid var(--grape);border-radius:var(--radius-sm);padding:12px 16px;font-weight:700}
.note.warn{background:var(--peach-soft)}
.form-status{display:none;margin-top:6px}
.form-status.show{display:block}

/* FAQ */
details{background:#fff;border:3px solid var(--grape);border-radius:var(--radius-sm);margin-bottom:12px;box-shadow:0 4px 0 rgba(59,31,74,.1)}
summary{cursor:pointer;list-style:none;font-family:var(--head);font-weight:800;font-size:1.15rem;padding:14px 52px 14px 18px;position:relative}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:16px;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:50%;background:var(--mint);border:2px solid var(--grape);display:grid;place-items:center;font-size:1.2rem;line-height:1}
details[open] summary::after{content:"\2212";background:var(--pink);color:#fff}
details .ans{padding:0 18px 16px}
details .ans p:first-child{margin-top:0}

/* Lists */
.ticks{list-style:none;padding:0;margin:0}
.ticks li{position:relative;padding-left:34px;margin:10px 0}
.ticks li::before{content:"";position:absolute;left:0;top:4px;width:22px;height:22px;border-radius:50%;background:var(--mint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%233B1F4A' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat;border:2px solid var(--grape)}
.ticks.no li::before{background:var(--peach) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 7l10 10M17 7L7 17' fill='none' stroke='%233B1F4A' stroke-width='3.2' stroke-linecap='round'/%3E%3C/svg%3E") center/14px no-repeat}

/* Packing layers */
.layers{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.layers li{display:flex;align-items:center;gap:14px;background:#fff;border:3px solid var(--grape);border-radius:var(--radius-sm);padding:10px 16px;font-weight:800}
.layers li span{flex:0 0 38px;height:38px;border-radius:50%;display:grid;place-items:center;font-family:var(--head);border:2px solid var(--grape)}
.layers li:nth-child(1) span{background:var(--pink)} .layers li:nth-child(2) span{background:var(--lemon)} .layers li:nth-child(3) span{background:var(--mint)} .layers li:nth-child(4) span{background:var(--sky)} .layers li:nth-child(5) span{background:var(--lilac)}
.layers small{display:block;font-weight:600;color:var(--grape-2)}

/* Sticker callouts */
.sticker{display:inline-block;font-family:var(--head);font-weight:800;background:var(--lemon);border:3px solid var(--grape);border-radius:14px;padding:4px 14px;transform:rotate(-4deg);box-shadow:0 4px 0 var(--grape)}
.sticker.pink{background:var(--pink);color:#fff;transform:rotate(3deg)} .sticker.mint{background:var(--mint)}

/* Footer */
.site-foot{background:var(--grape);color:#fff;padding:0 0 30px;margin-top:0}
.site-foot .drip{background:var(--cream);transform:scaleY(-1);margin-bottom:24px}
.foot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:28px}
@media (max-width:760px){.foot-grid{grid-template-columns:1fr}}
.site-foot a{color:#fff;font-weight:700;text-decoration:none}
.site-foot a:hover{color:var(--lemon);text-decoration:underline}
.site-foot ul{list-style:none;padding:0;margin:0;columns:2;column-gap:18px}
.site-foot li{margin:4px 0;break-inside:avoid}
.site-foot h3{color:var(--lemon);font-size:1.2rem}
.foot-safe{margin-top:26px;padding-top:16px;border-top:2px solid rgba(255,255,255,.2);font-size:.92rem;color:#e9def0}
.foot-logo{font-family:var(--head);font-weight:800;font-size:1.7rem;color:var(--pink);-webkit-text-stroke:5px #fff;paint-order:stroke fill}

/* Helpers */
.mt0{margin-top:0}.mt2{margin-top:2rem}.mb0{margin-bottom:0}
.maxw{max-width:780px;margin-left:auto;margin-right:auto}
.float-gloop{width:120px;animation:bob 3.2s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.split h2{font-size:clamp(1.7rem,3.4vw,2.5rem)}
.drip.mint,.drip.sky,.drip.lemon{margin-top:-1px}
