/* ===== PRODUCT PAGE V2 (16 Oct 2026) =====
   Same look as the homepage v2: night tokens, mint CTA (nm.css pill + the
   homepage's glow/shimmer), reveals, grain. Every selector starts with
   .snubblz-landing.snv2p; class names avoid the substrings nm.css restyles
   (card, pill, chip, kicker, eyebrow, shipping, guarantee, refund, delivery-date). */
.snubblz-landing.snv2p{--p2-night:#14111E;--p2-mint:#9EE0C4;--p2-lav:#B8ADDB;--p2-text:#D4D0E8;--p2-muted:#9990B8;--p2-mist:#EDE8F8;--p2-r:22px;--p2-pad:20px;--p2-ease:cubic-bezier(.16,1,.3,1);
  position:relative;color:var(--p2-text);font-family:Figtree,Inter,system-ui,sans-serif;line-height:1.55;overflow-x:clip}
.snubblz-landing.snv2p *{box-sizing:border-box}
.snubblz-landing.snv2p img{max-width:100%;height:auto;display:block}
.snubblz-landing.snv2p h1,.snubblz-landing.snv2p h2,.snubblz-landing.snv2p h3{color:#fff;margin:0}
.snubblz-landing.snv2p p{margin:0}
.snubblz-landing.snv2p svg.p2-i{width:1em;height:1em;flex:none}
.snubblz-landing.snv2p .p2-wrap{max-width:560px;margin:0 auto;padding:0 var(--p2-pad)}
.snubblz-landing.snv2p .p2-grid{display:grid;gap:22px}
.snubblz-landing.snv2p .p2-grid>*{min-width:0}

/* CTA: the live mint pill (nm.css) + the homepage glow and shimmer */
@keyframes p2-shimmer{0%{transform:translateX(-110%)}100%{transform:translateX(110%)}}
@keyframes p2-glow{0%,100%{box-shadow:0 4px 30px rgba(158,224,196,.2)}50%{box-shadow:0 8px 60px rgba(158,224,196,.45)}}
.snubblz-landing.snv2p .p2-cta{position:relative;overflow:hidden;white-space:normal!important;display:flex;align-items:center;justify-content:center;width:100%;min-height:56px;padding:8px 22px;border:0;border-radius:999px;background:var(--p2-mint);color:#14111E;font:700 1.02rem/1.2 Figtree,Inter,sans-serif;text-align:center;cursor:pointer;animation:p2-glow 5s ease-in-out infinite}
.snubblz-landing.snv2p .p2-cta::after{content:"";position:absolute;top:0;left:0;width:50%;height:100%;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.35),transparent 70%);transform:translateX(-110%);animation:p2-shimmer 3.6s ease-in-out infinite;pointer-events:none}
.snubblz-landing.snv2p .p2-cta:hover{background:#b2f0d6}
.snubblz-landing.snv2p .p2-risk{margin:12px 0 0;max-width:none;color:var(--p2-muted)}

/* 1 GALLERY */
.snubblz-landing.snv2p .p2-top{padding:8px 0 30px}
.snubblz-landing.snv2p .p2-gal{position:relative}
.snubblz-landing.snv2p .p2-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;scrollbar-width:none;border-radius:var(--p2-r);outline:none}
.snubblz-landing.snv2p .p2-track::-webkit-scrollbar{display:none}
.snubblz-landing.snv2p .p2-item{flex:0 0 100%;scroll-snap-align:center;aspect-ratio:4/5;max-height:58vh;position:relative;border-radius:var(--p2-r);overflow:hidden;background:#000}
.snubblz-landing.snv2p .p2-item img,.snubblz-landing.snv2p .p2-item video,.snubblz-landing.snv2p .p2-item picture{width:100%;height:100%;object-fit:cover;display:block}
.snubblz-landing.snv2p .p2-app{background:#0b0a10;display:grid;place-items:center}
.snubblz-landing.snv2p .p2-app img{width:auto;height:90%;object-fit:contain;border-radius:22px;box-shadow:0 0 0 6px #0b0a10,0 0 0 7px #ffffff1a}
.snubblz-landing.snv2p .p2-tag{position:absolute;left:14px;top:12px;z-index:2;font-size:11px;letter-spacing:.04em;color:#ffffffb0;pointer-events:none}
.snubblz-landing.snv2p .p2-play{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);display:flex;align-items:center;gap:10px;min-height:48px;padding:0 20px;border-radius:999px;border:0;background:#14111ecc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--p2-mint);font:600 15px/1 Figtree,Inter,sans-serif;box-shadow:inset 0 0 0 1px #9ee0c455;cursor:pointer;white-space:nowrap;transition:opacity .3s}
.snubblz-landing.snv2p .p2-play.p2-hide{opacity:0;pointer-events:none}
.snubblz-landing.snv2p .p2-dots{display:flex;justify-content:center;gap:6px;margin-top:12px}
.snubblz-landing.snv2p .p2-dots button{width:7px;height:7px;border-radius:50%;border:0;background:#ffffff30;padding:0;cursor:pointer;transition:width .3s}
.snubblz-landing.snv2p .p2-dots button.p2-on{background:var(--p2-mint);width:18px;border-radius:999px}
.snubblz-landing.snv2p .p2-thumbs{display:none}

/* 2 BUY BOX */
.snubblz-landing.snv2p .p2-flag{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:var(--p2-mint);padding:5px 12px;border-radius:999px;background:#9ee0c414;box-shadow:inset 0 0 0 1px #9ee0c430;margin-bottom:14px}
.snubblz-landing.snv2p .p2-buy h1{margin-bottom:12px}
.snubblz-landing.snv2p .p2-sub{color:var(--p2-text);margin-bottom:18px}
.snubblz-landing.snv2p .p2-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;margin-bottom:4px}
.snubblz-landing.snv2p .p2-price b{font:500 3.2rem/1 Fraunces,Georgia,serif;color:var(--p2-mist);letter-spacing:-.03em}
.snubblz-landing.snv2p .p2-price span{color:var(--p2-mint);font-size:1.05rem}
.snubblz-landing.snv2p .p2-legal{font-size:13px;color:var(--p2-muted);margin-bottom:18px}
.snubblz-landing.snv2p .p2-buyrow{display:flex;gap:10px;align-items:center}
.snubblz-landing.snv2p .p2-buyrow .p2-cta{flex:1;min-width:0}
.snubblz-landing.snv2p .p2-qty{display:flex;align-items:center;height:56px;border-radius:999px;box-shadow:inset 0 0 0 1px #ffffff1f;flex:none}
.snubblz-landing.snv2p .p2-qty button{width:34px;height:56px;border:0;background:none;color:var(--p2-muted);font-size:18px;cursor:pointer}
.snubblz-landing.snv2p .p2-qty input{width:28px;border:0;background:none;color:var(--p2-text);text-align:center;font:500 1rem Figtree,Inter,sans-serif;-moz-appearance:textfield;appearance:textfield;padding:0}
.snubblz-landing.snv2p .p2-qty input::-webkit-outer-spin-button,.snubblz-landing.snv2p .p2-qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
@media (max-width:620px){.snubblz-landing.snv2p .p2-qty{display:none}} /* phones: quantity stays 1 (the field still submits 1), the button gets the full width */
.snubblz-landing.snv2p .p2-fine{font-size:12.5px;color:var(--p2-muted);margin-top:6px}

/* SECTIONS */
.snubblz-landing.snv2p .p2-sec{padding:60px 0 6px}
.snubblz-landing.snv2p .p2-sec h2{margin-bottom:22px}
.snubblz-landing.snv2p .p2-steps{list-style:none;margin:0;padding:0}
.snubblz-landing.snv2p .p2-steps li{display:grid;grid-template-columns:42px 1fr;gap:14px;padding:0 0 22px;position:relative}
.snubblz-landing.snv2p .p2-steps li::before{content:"";position:absolute;left:20px;top:44px;bottom:0;width:1px;background:linear-gradient(#9ee0c466,#b8addb22)}
.snubblz-landing.snv2p .p2-steps li:last-child::before{display:none}
.snubblz-landing.snv2p .p2-steps svg.p2-i{width:42px;height:42px;padding:10px;border-radius:50%;color:var(--p2-mint);background:#9ee0c414;box-shadow:inset 0 0 0 1px #9ee0c433}
.snubblz-landing.snv2p .p2-steps h3{font:600 1.1rem/1.3 Figtree,Inter,sans-serif;color:var(--p2-mist);margin:8px 0 2px}
.snubblz-landing.snv2p .p2-steps p{font-size:.95rem;color:var(--p2-muted)}
.snubblz-landing.snv2p .p2-goal{margin-top:6px;font-size:.92rem;color:var(--p2-lav)}
.snubblz-landing.snv2p .p2-night{display:grid;grid-template-columns:112px 1fr;gap:18px;align-items:center;padding:12px 0}
.snubblz-landing.snv2p .p2-spr{width:112px;height:56px;background:#000;border-radius:12px;display:grid;place-items:center;overflow:hidden;box-shadow:0 0 0 1px #ffffff10}
.snubblz-landing.snv2p .p2-spr img{height:100%;width:auto;image-rendering:pixelated}
.snubblz-landing.snv2p .p2-night h3{font-size:1.1rem;color:var(--p2-mist);margin:0 0 3px}
.snubblz-landing.snv2p .p2-night p{font-size:.95rem;color:var(--p2-muted)}
.snubblz-landing.snv2p .p2-box{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.snubblz-landing.snv2p .p2-box>div{padding:18px;border-radius:var(--p2-r);background:#1b1729b3;box-shadow:inset 0 0 0 1px #ffffff0f}
.snubblz-landing.snv2p .p2-box svg.p2-i{width:24px;height:24px;color:var(--p2-lav);margin-bottom:10px;display:block}
.snubblz-landing.snv2p .p2-box img{height:26px;width:auto;margin-bottom:10px;image-rendering:pixelated}
.snubblz-landing.snv2p .p2-box b,.snubblz-landing.snv2p .p2-specs b{display:block;color:var(--p2-mist);font-weight:600}
.snubblz-landing.snv2p .p2-box span{font-size:.85rem;color:var(--p2-muted)}
.snubblz-landing.snv2p .p2-specs>div{display:grid;grid-template-columns:28px 1fr;gap:14px;padding:16px 0;border-top:1px solid #ffffff10}
.snubblz-landing.snv2p .p2-specs svg.p2-i{width:22px;height:22px;color:var(--p2-lav);margin-top:2px}
.snubblz-landing.snv2p .p2-specs span{font-size:.92rem;color:var(--p2-muted)}
.snubblz-landing.snv2p .p2-maker{display:grid;grid-template-columns:64px 1fr;gap:16px;align-items:center;padding:20px;border-radius:var(--p2-r);background:#1b1729b3;box-shadow:inset 0 0 0 1px #ffffff0f}
.snubblz-landing.snv2p .p2-maker img{width:64px;height:auto;image-rendering:pixelated}
.snubblz-landing.snv2p .p2-maker p{font:500 1.2rem/1.35 Fraunces,Georgia,serif;color:var(--p2-mist);margin-bottom:4px}
.snubblz-landing.snv2p .p2-maker a{color:var(--p2-mint);text-decoration:underline;text-underline-offset:3px}
.snubblz-landing.snv2p .p2-q{border-top:1px solid #ffffff10}
.snubblz-landing.snv2p .p2-q button{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;padding:16px 0;border:0;background:none;color:var(--p2-mist);font:600 1rem/1.4 Figtree,Inter,sans-serif;text-align:start;cursor:pointer}
.snubblz-landing.snv2p .p2-q button::after{content:"+";color:var(--p2-mint);font-size:1.3rem;line-height:1;flex:none}
.snubblz-landing.snv2p .p2-q button[aria-expanded=true]::after{content:"\2212"}
.snubblz-landing.snv2p .p2-q p{color:var(--p2-muted);font-size:.95rem;padding:0 0 16px;max-width:62ch}
.snubblz-landing.snv2p .p2-end{padding:60px 0 120px}
.snubblz-landing.snv2p .p2-end h2{margin-bottom:20px}

/* sticky bar: below 1080px, whenever the buy button itself is off screen, hidden at the end block and while the cookie bar shows */
.snubblz-landing.snv2p .p2-sticky{position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:990;display:flex;align-items:center;gap:8px;padding:6px 6px 6px 12px;border-radius:999px;background:#1b1729eb;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px #ffffff14,0 20px 40px -10px #000;transform:translateY(160%);transition:transform .45s var(--p2-ease);visibility:hidden}
.snubblz-landing.snv2p .p2-sticky.p2-on{transform:none;visibility:visible}
.snubblz-landing.snv2p .p2-sticky img{height:36px;width:auto;flex:none;image-rendering:pixelated}
.snubblz-landing.snv2p .p2-sticky .p2-cta{min-height:46px;font-size:.92rem;flex:1;min-width:0;padding:4px 14px}

/* reveals (same as the homepage; the theme's reduced-motion and print nets cover these class names) */
.snubblz-landing.snv2p .sn-reveal,.snubblz-landing.snv2p .sn-reveal-left,.snubblz-landing.snv2p .sn-reveal-scale{opacity:0;transition:opacity .8s cubic-bezier(.22,1,.36,1),transform .8s cubic-bezier(.22,1,.36,1)}
.snubblz-landing.snv2p .sn-reveal{transform:translateY(30px)}.snubblz-landing.snv2p .sn-reveal-left{transform:translateX(-40px)}.snubblz-landing.snv2p .sn-reveal-scale{transform:scale(.94)}
.snubblz-landing.snv2p .sn-visible{opacity:1!important;transform:none!important}
.snubblz-landing.snv2p .sn-reveal-delay-1{transition-delay:.08s}.snubblz-landing.snv2p .sn-reveal-delay-2{transition-delay:.18s}.snubblz-landing.snv2p .sn-reveal-delay-3{transition-delay:.28s}
.snubblz-landing.snv2p::after{content:"";position:fixed;inset:0;background-image:radial-gradient(rgba(255,255,255,.012) 1px,transparent 1px);background-size:3px 3px;pointer-events:none;z-index:-1;mix-blend-mode:overlay;opacity:.4}

/* a translation is being swapped in (max ~0.9 s, see the inline script) */
html.p2-lang-wait .snubblz-landing.snv2p{opacity:0}
.snubblz-landing.snv2p{transition:opacity .2s}

/* compact cookie bar: same wording and buttons, text left, buttons stacked right, <=72px on phones */
@media (max-width:767px){
  .cookie-permission-container{padding:6px 8px!important}
  .cookie-permission-container .container{padding:0!important}
  .cookie-permission-container .row{flex-wrap:nowrap!important;align-items:center!important;margin:0!important;gap:8px}
  .cookie-permission-container .cookie-permission-content,.cookie-permission-container .cookie-permission-content p{flex:1 1 auto!important;width:auto!important;padding:0!important;margin:0!important;font-size:11px!important;line-height:1.3!important}
  .cookie-permission-container .cookie-permission-actions{flex:0 0 auto!important;width:auto!important;flex-direction:column!important;flex-wrap:nowrap!important;gap:4px;padding:0!important}
  .cookie-permission-container .cookie-permission-actions>span{margin:0!important;display:block!important}
  .cookie-permission-container .cookie-permission-actions .btn{display:block!important;width:100%!important;padding:5px 10px!important;font-size:11.5px!important;line-height:1.3!important;min-height:0!important;white-space:nowrap}
}

/* the quiz pill and the old breadcrumb stay off this page */
#sn-quiz-popup{display:none!important}
body:has(.snv2p) .scroll-up-button,body:has(.snv2p) .cms-breadcrumb{display:none!important}

@media (max-width:479px){.snubblz-landing.snv2p .p2-cta svg{display:none}}
@media (min-width:1080px){
  .snubblz-landing.snv2p .p2-wrap{max-width:1180px;padding:0 40px}
  .snubblz-landing.snv2p .p2-top{padding:28px 0 40px}
  .snubblz-landing.snv2p .p2-grid{grid-template-columns:1.15fr .85fr;gap:56px;align-items:start}
  .snubblz-landing.snv2p .p2-buy{position:sticky;top:96px}
  .snubblz-landing.snv2p .p2-track{overflow:hidden}
  .snubblz-landing.snv2p .p2-dots{display:none}
  .snubblz-landing.snv2p .p2-thumbs{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:10px}
  .snubblz-landing.snv2p .p2-thumbs button{aspect-ratio:4/5;border-radius:10px;overflow:hidden;border:0;padding:0;background:#000;cursor:pointer;opacity:.55;transition:opacity .2s;box-shadow:inset 0 0 0 1px #ffffff14}
  .snubblz-landing.snv2p .p2-thumbs button.p2-on,.snubblz-landing.snv2p .p2-thumbs button:hover{opacity:1;box-shadow:0 0 0 2px var(--p2-mint)}
  .snubblz-landing.snv2p .p2-thumbs img{width:100%;height:100%;object-fit:cover}
  .snubblz-landing.snv2p .p2-sec .p2-wrap>*{max-width:760px}
  .snubblz-landing.snv2p .p2-box{grid-template-columns:repeat(4,1fr)}
  .snubblz-landing.snv2p .p2-cta{width:auto;padding:8px 32px}
  .snubblz-landing.snv2p .p2-buyrow .p2-cta{width:auto}
  .snubblz-landing.snv2p .p2-sticky{display:none}
}
@media (prefers-reduced-motion:reduce){
  .snubblz-landing.snv2p .p2-cta,.snubblz-landing.snv2p .p2-cta::after{animation:none}
  .snubblz-landing.snv2p .sn-reveal,.snubblz-landing.snv2p .sn-reveal-left,.snubblz-landing.snv2p .sn-reveal-scale{opacity:1;transform:none;transition:none}
}

/* the theme styles every number input with !important padding, border and min-height: undo it for the quantity field */
.snubblz-landing.snv2p .p2-qty input[type=number]{width:32px!important;min-width:0!important;height:auto!important;min-height:0!important;padding:0!important;margin:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:var(--p2-mist)!important;text-align:center!important;font:600 1rem/1 Figtree,Inter,sans-serif!important;-moz-appearance:textfield!important;appearance:textfield!important}
.snubblz-landing.snv2p .p2-qty input[type=number]:focus-visible{outline:2px solid var(--p2-mint)!important;outline-offset:2px!important;border-radius:6px!important}
