/* ICEROOM's original diamond, snow and letter reveal, with Pritti Grip accents. */
:root{--brand-accent:#9484fc;--brand-accent-hover:#aa9aff;--brand-accent-ink:#b7aaff;--brand-accent-line:#9484fc6b;--brand-accent-wash:#9484fc11}
::selection{background:var(--brand-accent);color:#100c20}
header .logo{display:inline-flex;align-items:center;gap:9px}
.brand-mark{width:.68em;height:.66em;flex:none;fill:currentColor}
header .logo .brand-mark{width:15px;height:15px;color:var(--brand-accent-ink)}
header .hcta{padding:10px 15px;border:1px solid var(--brand-accent-line);border-radius:999px;background:var(--brand-accent-wash);color:var(--brand-accent-ink);transition:background .25s,border-color .25s}
header .hcta:hover{background:#9484fc26;border-color:var(--brand-accent)}
section.cat{scroll-margin-top:0}
.hnav a::after{background:var(--brand-accent-ink)}
.hnav a[aria-current="location"]{color:var(--brand-accent-ink)}
.news-head .live{background:var(--brand-accent);box-shadow:0 0 0 4px #9484fc19}
.news-item:hover{border-color:var(--brand-accent-line)}
.news-item .arrow{color:var(--brand-accent-ink)}
.news-tag,.news-tag.purple,.section-index,.bundle-inner .tag,.preview-eyebrow,.kit-eyebrow{color:var(--brand-accent-ink)}

/* Keep the wordmark white. Colour belongs to the atmosphere and the actions. */
.hero{padding-top:clamp(60px,7vw,92px);padding-bottom:58px;position:relative;overflow:hidden}
.hero::before{inset:0 -8%;background:radial-gradient(ellipse at 50% 35%,#9484fc14,transparent 60%);opacity:1}
.hero>canvas#brand-snow{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1;animation:none;transform:none;opacity:1}
.hero .kicker{display:inline-flex;align-items:center;gap:11px;border:1px solid var(--brand-accent-line);background:#9484fc0d;color:var(--brand-accent-ink);border-radius:999px;padding:8px 14px;margin-bottom:32px;font-size:10px;letter-spacing:.15em}
.hero .kicker::before{content:'';width:5px;height:5px;rotate:45deg;background:var(--brand-accent-ink)}
.hero h1.hero-lockup{display:flex;align-items:center;justify-content:center;gap:.23em;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:clamp(76px,12.3vw,154px);font-weight:800;line-height:1.08;letter-spacing:-.055em;margin:0;color:#f5f4f1;transform:translateY(var(--brand-y,0px)) scale(var(--brand-scale,1));animation:none;text-shadow:none;filter:none;transform-origin:center}
.hero-lockup .brand-mark{width:.61em;height:.62em;margin-top:.1em}
.hero-word{display:inline-flex;white-space:nowrap;line-height:1.08;padding-right:.03em}
.brand-letter{display:inline-block;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em}
.brand-letter>span{display:inline-block;animation:ice-letter-in .95s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--letter-index)*45ms + 100ms)}
.hero-lockup .brand-mark{animation:ice-mark-in 1.1s cubic-bezier(.16,1,.3,1) both}
.hero p{position:relative;max-width:575px;margin-top:23px}
.hero-cta{position:relative;margin-top:26px}
.hero .hero-trust{position:relative;margin-top:24px}
.hero-motion{position:absolute;right:5px;bottom:10px;display:inline-flex;align-items:center;gap:8px;padding:8px 10px;min-height:36px;border:1px solid #383838;background:#111b;color:#999;border-radius:999px;font-size:10px;cursor:pointer;animation:none}
.hero-motion:hover{color:#fff;border-color:var(--brand-accent-line)}
.hero-motion svg{width:12px;height:12px;fill:currentColor}
.hero-motion .motion-play,.hero-motion[aria-pressed=true] .motion-pause{display:none}
.hero-motion[aria-pressed=true] .motion-play{display:block}
@keyframes ice-letter-in{from{transform:translateY(115%) rotate(5deg)}to{transform:none}}
@keyframes ice-mark-in{from{opacity:0;transform:translateY(30px) rotate(-18deg) scale(.8)}to{opacity:1;transform:none}}

/* The accent consistently identifies the next purchase action. */
a.buy:not(.ghost),.kit-footer #kit-buy{background:var(--brand-accent);color:#100c20;border-color:transparent;box-shadow:0 5px 25px #9484fc13}
a.buy:not(.ghost):hover,.kit-footer #kit-buy:hover{background:var(--brand-accent-hover);color:#100c20;box-shadow:0 8px 28px #9484fc2b}
a.buy:not(.ghost)::after,#kit-buy::after{content:'';position:absolute;inset:-50% auto -50% -60%;width:34%;rotate:22deg;background:linear-gradient(90deg,transparent,#ffffff28,transparent);pointer-events:none;transition:left .65s cubic-bezier(.2,.7,.2,1)}
a.buy:not(.ghost):hover::after,#kit-buy:hover::after{left:130%}
.hero-cta .buy.ghost{background:#111c;color:#f5f4f1;border:1px solid #555}
.hero-cta .buy.ghost:hover{border-color:var(--brand-accent-ink);background:#1c1928}
.card-media>.badge,.product-art~.badge{background:var(--brand-accent);color:#100c20}
.template-filters button[aria-pressed=true],#kit-tabs button[aria-selected=true]{background:var(--brand-accent);color:#100c20}
.explore-kit{border-color:#554d70;background:#1a1820}
.explore-kit>span:last-child{color:var(--brand-accent-ink)}
.explore-kit:hover{border-color:var(--brand-accent);background:#211d30}
.demo-trigger:hover,.preview-trigger:hover{background:#221e30;color:#fff;border-color:var(--brand-accent-ink)}
.demo-play{background:var(--brand-accent);color:#100c20;border-color:transparent}
.feature-compat a,.about-socials a:hover{color:var(--brand-accent-ink)}
.art-registration{color:var(--brand-accent-ink);opacity:.8;transition:rotate .7s cubic-bezier(.2,.8,.2,1)}
.card:hover .art-registration,.bundle-inner:hover .art-registration{rotate:90deg}
.art-top{border-bottom-color:#9484fc43}.art-bottom{border-top-color:#ffffff24}
.art-grip .art-heading{color:var(--brand-accent-ink)}
.art-grip{background:radial-gradient(ellipse at 50% 65%,#251d49,transparent 65%),#131217}
.template-feature{border-color:#63577e}
.card:hover,.card:focus-within,.bundle-inner.has-art:hover{border-color:#8d7cc0}
.card::after{display:block;content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;background:radial-gradient(360px circle at var(--pointer-x,50%) var(--pointer-y,0%),#9484fc12,transparent 65%);transition:opacity .4s}
.card:hover::after{opacity:1}
.bundle-inner.has-art{border-color:#584b77;background:radial-gradient(ellipse at 95% 100%,#9484fc0d,transparent 60%),#191919}
.bundle-inner.has-art .txt h2{color:#fff}
.fmark{display:flex;justify-content:center;align-items:center;gap:.22em}
.fmark .brand-mark{color:var(--brand-accent-ink);width:.6em;height:.58em}
@media(min-width:681px){.hero{padding-top:50px;padding-bottom:50px}.hero h1.hero-lockup{font-size:clamp(76px,10.6vw,134px)}.hero .kicker{margin-bottom:20px}.hero p{margin-top:18px}.hero-cta{margin-top:20px}.motion-ready .grid>.card.reveal:nth-child(even){transition-delay:65ms,65ms,0ms,0ms,0ms}.motion-ready .grid>.card.reveal.is-visible:hover{transition-delay:0ms}}
@media(max-width:680px){.hero{padding-top:55px;padding-bottom:58px}.hero h1.hero-lockup{font-size:clamp(45px,13vw,84px);gap:.2em;letter-spacing:-.055em}.hero .kicker{font-size:8px;padding:8px 12px;letter-spacing:.12em;margin-bottom:24px}.hero p{font-size:.9rem;margin-top:23px;max-width:340px}.hero-motion{right:50%;translate:50% 0;bottom:8px;font-size:9px;min-height:32px}.hero-cta{margin-top:22px}header .hcta{padding:8px 10px;font-size:.55rem}header .logo .brand-mark{width:12px;height:12px}header .logo{gap:7px}.art-top{border-bottom-color:#9484fc3a}}
@media(prefers-reduced-motion:reduce){.hero h1.hero-lockup{transform:none}.hero>canvas#brand-snow,.hero-motion{display:none}.brand-letter>span,.hero-lockup .brand-mark{animation:none}.card::after,a.buy::after,#kit-buy::after{display:none}.card:hover .art-registration,.bundle-inner:hover .art-registration{rotate:0deg}}
