/* Groovstacks homepage: 3D glass stack experience. Markup lives in the Elementor HTML widget on the homepage. */
body.page-id-5771,body.page-id-5771 #page,body.page-id-5771 #content,body.page-id-5771 .site-content{background:#070A14}
html{scroll-behavior:smooth}
#gsh{--bg:#070A14;--ink:#EAF0FF;--mut:#A3B0D0;--line:rgba(150,180,255,.16);--acc:#0693E3;--acc2:#3DBBFF;--pur:#9B51E0;--pur2:#C7A0FF;--glow:#7CCBFF;--r:20px;--hd:'Bricolage Grotesque',system-ui,sans-serif;--bd:'Public Sans',system-ui,sans-serif;position:relative;color:var(--ink);font:400 17px/1.7 var(--bd);background:var(--bg);overflow-x:clip;
*{box-sizing:border-box}
a{color:inherit}
p{margin:0 0 1em}
figure{margin:0}
img{display:block;max-width:100%;height:auto}
h1,h2,h3{font-family:var(--hd);font-weight:700;letter-spacing:-.02em;line-height:1.08;margin:0;color:var(--ink);text-wrap:balance}
h2{font-size:clamp(2rem,4.4vw,3.6rem)}
h3{font-size:1.3rem;line-height:1.2}
#gsh-cv{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:0}
section{position:relative;z-index:1;padding:clamp(5rem,10vw,9rem) clamp(1.25rem,5vw,4.5rem)}
.wrap{max-width:1240px;margin-inline:auto}
.eb{display:block;margin-bottom:1.1rem;font:600 .78rem/1.2 var(--bd);letter-spacing:.14em;text-transform:uppercase;color:var(--glow)}
.lead{color:var(--mut);max-width:58ch;margin-top:1.25rem}
.ar,.tr svg{width:1.05em;height:1.05em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.btn{display:inline-flex;align-items:center;gap:.6rem;padding:.95rem 1.7rem;border-radius:999px;font:600 .98rem/1 var(--bd);text-decoration:none;white-space:nowrap;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,background .35s,border-color .35s}
.btn-p{background:linear-gradient(135deg,#6AD0FF,#0693E3 60%,#3F86FF);color:#031225;box-shadow:0 12px 40px -12px rgba(6,147,227,.9),inset 0 1px 0 rgba(255,255,255,.55)}
.btn-p:hover{transform:translateY(-3px);box-shadow:0 20px 50px -12px rgba(61,187,255,.95),inset 0 1px 0 rgba(255,255,255,.6)}
.btn-p:hover .ar{transform:translateX(3px)}
.ar{transition:transform .3s}
.btn-g{border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--ink);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.btn-g:hover{border-color:var(--glow);background:rgba(124,203,255,.1);transform:translateY(-3px)}
.btn:focus-visible,a:focus-visible,summary:focus-visible,.tab:focus-visible,.cb:focus-visible{outline:2px solid var(--glow);outline-offset:3px}
.gl{position:relative;border-radius:var(--r);background:linear-gradient(160deg,rgba(255,255,255,.075),rgba(255,255,255,.014));border:1px solid var(--line);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);box-shadow:0 30px 80px -40px rgba(3,10,60,.9),inset 0 1px 0 rgba(255,255,255,.09);overflow:hidden}
.gl::before{content:'';position:absolute;inset:0;background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(124,203,255,.17),transparent 60%);opacity:0;transition:opacity .4s;pointer-events:none}
.gl:hover::before{opacity:1}
.gl>*{position:relative}
.gl p:last-child{margin-bottom:0}
.gl p{color:var(--mut)}
.hu{opacity:0;transform:translateY(30px);animation:gshup .95s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:var(--d,0s)}
&.js .rv{opacity:0;transform:translateY(28px);transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1);transition-delay:var(--d,0s)}
&.js .rv.in{opacity:1;transform:none}
.hero{min-height:calc(100svh - 80px);display:flex;align-items:center;padding-top:clamp(3rem,9vh,6rem);padding-bottom:4rem}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.6fr);gap:2rem;align-items:center;width:100%}
.hero h1{font-size:clamp(2rem,3.25vw,3.05rem);line-height:1.05}
.gx{background:linear-gradient(100deg,#7CCBFF,#C7A0FF 85%);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .lead{font-size:1.05rem;max-width:54ch}
.cta-row{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:2rem}
.tr{display:flex;flex-wrap:wrap;gap:.6rem 1.6rem;list-style:none;margin:2rem 0 0;padding:0;color:var(--mut);font-size:.92rem}
.tr li{display:flex;align-items:center;gap:.5rem}
.tr svg{stroke:var(--acc2)}
.hcard{justify-self:end;align-self:end;width:min(270px,100%);border-radius:var(--r);overflow:hidden;border:1px solid rgba(124,203,255,.35);box-shadow:0 40px 90px -30px rgba(6,147,227,.65);transform:perspective(900px) rotateY(-16deg) rotateX(6deg) rotate(1.5deg);animation:gshup .95s cubic-bezier(.2,.8,.2,1) .5s both,gshfl 8s ease-in-out 1.5s infinite}
.fb{display:none;position:absolute;right:8%;top:50%;width:min(340px,38vw);aspect-ratio:1.5;transform:translateY(-50%) perspective(900px) rotateX(58deg) rotateZ(-34deg);transform-style:preserve-3d}
&.no-gl .fb{display:block}
.fb i{position:absolute;inset:0;border-radius:18px;border:1px solid rgba(124,203,255,.55);background:linear-gradient(135deg,rgba(6,147,227,.35),rgba(155,81,224,.25));transform:translateZ(calc(var(--i)*36px));box-shadow:0 0 40px rgba(6,147,227,.3)}
.logos{padding-block:3rem;border-block:1px solid var(--line);background:rgba(7,10,20,.62);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.logos .hd{display:flex;align-items:baseline;gap:1.25rem;flex-wrap:wrap;margin-bottom:1.75rem}
.logos .eb{margin:0}
.logos h3{font-size:1.15rem;color:var(--mut);font-weight:500}
.mqw{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.mq{display:flex;width:max-content;animation:gshmq 55s linear infinite}
.mq:hover{animation-play-state:paused}
.mqs{display:flex;gap:1.1rem;padding-right:1.1rem}
.lg{flex:none;width:172px;height:84px;border-radius:var(--r);background:#EEF3FF;display:grid;place-items:center;padding:14px}
.lg.dk{background:#101A33}
.lg img{max-height:100%;max-width:100%;object-fit:contain}
.sv .wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(2rem,6vw,6rem);align-items:start}
.side{position:sticky;top:6.5rem}
.side h2{font-size:clamp(1.8rem,3.2vw,2.8rem)}
.fig{margin-top:2.25rem;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);box-shadow:0 40px 80px -30px rgba(6,147,227,.4);transform:perspective(1000px) rotateY(9deg) rotateX(2deg);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.fig:hover{transform:perspective(1000px) rotateY(0) rotateX(0)}
.rows{border-top:1px solid var(--line)}
.row{position:relative;padding:2rem 0;border-bottom:1px solid var(--line);transition:padding .45s cubic-bezier(.2,.8,.2,1)}
.row::before{content:'';position:absolute;left:0;top:2rem;bottom:2rem;width:3px;border-radius:3px;background:linear-gradient(var(--acc2),var(--pur));transform:scaleY(0);transform-origin:top;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.row:hover{padding-left:1.4rem}
.row:hover::before{transform:scaleY(1)}
.row h3{font-size:clamp(1.35rem,2.1vw,1.85rem);margin-bottom:.7rem}
.row h3 a{text-decoration:none;display:inline-flex;align-items:center;gap:.6rem}
.row h3 a:hover{color:var(--glow)}
.row p{color:var(--mut);margin:0;max-width:62ch}
.row p a,.fine a,.lead a,.row+.row p a{color:var(--glow);text-underline-offset:3px}
.wh .hd{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:3rem;align-items:end;margin-bottom:3.5rem}
.wh .fig{margin:0;max-width:340px;justify-self:end}
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:1rem}
.bento .gl{padding:2.1rem}
.bento h3{margin-bottom:.8rem;font-size:1.4rem}
.b1{grid-column:1/5;background:linear-gradient(135deg,rgba(6,147,227,.3),rgba(6,147,227,.04))}
.b2{grid-column:5/7}
.b3{grid-column:1/3}
.b4{grid-column:3/7;background:linear-gradient(135deg,rgba(155,81,224,.28),rgba(155,81,224,.03))}
.b5{grid-column:1/4}
.b6{grid-column:4/7;background:linear-gradient(135deg,rgba(61,187,255,.2),rgba(155,81,224,.12))}
.rs .nums{display:grid;grid-template-columns:repeat(4,1fr);margin:3rem 0 4rem;border-block:1px solid var(--line)}
.num{padding:2.5rem 1.5rem;border-left:1px solid var(--line)}
.num:first-child{border-left:0;padding-left:0}
.num b{display:block;font:700 clamp(3rem,6.5vw,6rem)/1 var(--hd);letter-spacing:-.04em;background:linear-gradient(180deg,#fff,#8FC7FF 60%,#A97BFF);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:tabular-nums}
.num span{display:block;margin-top:.6rem;color:var(--mut);font-size:.95rem}
.cs-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}
.cs-h h3{font-size:1.1rem;color:var(--mut);font-weight:500}
.cbs{display:flex;gap:.6rem}
.cb{width:48px;height:48px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--ink);cursor:pointer;display:grid;place-items:center;transition:background .3s,border-color .3s}
.cb:hover{border-color:var(--glow);background:rgba(124,203,255,.12)}
.cb svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cases{display:flex;gap:1.25rem;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:1.5rem;scrollbar-width:none}
.cases::-webkit-scrollbar{display:none}
.case{flex:0 0 min(430px,82vw);scroll-snap-align:start;padding:2.1rem}
.case:nth-child(2n){background:linear-gradient(160deg,rgba(155,81,224,.16),rgba(255,255,255,.012))}
.case h3{margin-bottom:1rem;font-size:1.3rem}
.res{margin-top:1.1rem;padding-top:1.1rem;border-top:1px solid var(--line);color:var(--ink)!important}
.res strong{color:var(--glow)}
.pr .tl{position:relative;margin-top:4.5rem;display:grid;gap:3rem}
.tl::before,.tl::after{content:'';position:absolute;left:50%;top:0;width:2px;transform:translateX(-50%)}
.tl::before{bottom:0;background:var(--line)}
.tl::after{height:calc(var(--p,0)*100%);background:linear-gradient(var(--acc2),var(--pur));box-shadow:0 0 18px rgba(61,187,255,.8)}
.st{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:5rem}
.st .gl{grid-column:1;padding:2rem 2.2rem}
.st:nth-child(even) .gl{grid-column:2}
.st::before{content:'';position:absolute;left:50%;top:2.6rem;width:16px;height:16px;border-radius:50%;background:var(--bg);border:2px solid rgba(150,180,255,.4);transform:translateX(-50%);transition:all .5s;z-index:2}
.st.on::before{background:var(--acc2);border-color:var(--acc2);box-shadow:0 0 0 7px rgba(61,187,255,.18),0 0 24px rgba(61,187,255,.9)}
.st .n{display:block;font:700 4rem/1 var(--hd);color:transparent;-webkit-text-stroke:1px rgba(124,203,255,.55);margin-bottom:.6rem}
.st h3{margin-bottom:.8rem;font-size:1.45rem}
.pc .tiers{display:grid;grid-template-columns:1fr 1.1fr 1fr;gap:1.25rem;align-items:stretch;margin-top:3.5rem;perspective:1400px}
.tw{display:flex}
.tier{flex:1;padding:2.25rem;display:flex;flex-direction:column;gap:1rem;transform-style:preserve-3d;transition:transform .25s ease-out;overflow:hidden}
.tier.ft{padding-block:3.2rem;background:linear-gradient(160deg,rgba(61,187,255,.24),rgba(155,81,224,.2));border-color:rgba(124,203,255,.55);box-shadow:0 50px 110px -30px rgba(6,147,227,.6),inset 0 1px 0 rgba(255,255,255,.18)}
.tier h3{font-size:1.35rem}
.price{font:700 clamp(1.7rem,2.5vw,2.3rem)/1.1 var(--hd);letter-spacing:-.02em}
.price small{font:500 1rem var(--bd);color:var(--mut);letter-spacing:0;white-space:nowrap}
.badge{align-self:flex-start;padding:.4rem .85rem;border-radius:999px;background:var(--glow);color:#041024;font:700 .72rem/1 var(--bd);letter-spacing:.08em;text-transform:uppercase}
.tier .btn{margin-top:auto;align-self:flex-start}
.tier .txt p{margin:0}
.pc .fine{margin-top:2.5rem;color:var(--mut);max-width:70ch}
.ts .hd{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:3rem;align-items:end}
.ts .fig{margin:0;max-width:340px;justify-self:end}
.qs{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;margin-top:3.5rem;padding-bottom:3.5rem}
.qw:nth-child(even){margin-top:3.5rem;margin-bottom:-3.5rem}
.q{padding:2.2rem;height:100%}
.stars{display:flex;gap:.2rem}
.stars svg{width:18px;height:18px;fill:var(--glow)}
.q blockquote{margin:1.1rem 0 1.5rem;font:500 1.12rem/1.65 var(--bd);color:var(--ink)}
.q blockquote p{color:var(--ink);margin:0}
.q cite{display:block;font:600 1.1rem/1.2 var(--hd);font-style:normal}
.q .meta{display:block;margin-top:.3rem;color:var(--mut);font-size:.9rem}
.in .wrap{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(2rem,6vw,5rem);align-items:start}
.tabs{margin-top:2.5rem;border-top:1px solid var(--line)}
.tab{text-transform:none;display:block;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--line);color:var(--mut);cursor:pointer;padding:1.05rem 0;font:600 clamp(1.4rem,2.6vw,2.2rem)/1.15 var(--hd);letter-spacing:-.02em;transition:color .3s,padding .4s cubic-bezier(.2,.8,.2,1)}
.tab:hover{color:var(--ink)}
.tab[aria-selected=true]{color:var(--ink);padding-left:1.2rem;box-shadow:inset 3px 0 0 var(--acc2)}
.pans{position:sticky;top:6.5rem}
.panel{padding:2.6rem}
.panel h3{font-size:1.7rem;margin-bottom:1rem}
.panel p{font-size:1.05rem}
.fq .wrap{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:clamp(2rem,6vw,5rem);align-items:start}
.fq .side{top:6.5rem}
details{border-bottom:1px solid var(--line)}
details:first-child{border-top:1px solid var(--line)}
summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1.5rem;padding:1.5rem 0;font:600 1.15rem/1.35 var(--hd);letter-spacing:-.01em}
summary::-webkit-details-marker{display:none}
summary:hover{color:var(--glow)}
summary i{flex:none;position:relative;width:22px;height:22px}
summary i::before,summary i::after{content:'';position:absolute;left:50%;top:50%;width:14px;height:2px;margin:-1px 0 0 -7px;background:var(--glow);transition:transform .35s}
summary i::after{transform:rotate(90deg)}
details[open] summary i::after{transform:rotate(0)}
details p{color:var(--mut);padding:0 3rem 1.6rem 0;max-width:68ch;margin:0}
details a{color:var(--glow);text-underline-offset:3px}
.tm .ppl{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;margin-top:3.5rem;align-items:start}
.pw:nth-child(2){margin-top:3.5rem}
.pw:nth-child(3){margin-top:1.75rem}
.ph{border-radius:var(--r);overflow:hidden;border:1px solid var(--line);aspect-ratio:4/5}\n.pp img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;transform:scale(1.1)}
.pp h3{margin-top:1.1rem;font-size:1.3rem}
.pp p{margin:.35rem 0 0;color:var(--mut);font-size:.95rem;line-height:1.55}
.ct .box{max-width:760px}
.ct h2{font-size:clamp(2.4rem,5.5vw,4.8rem);line-height:1.02}
.ct .lead{max-width:56ch}
.ct .fine{margin-top:1.5rem;color:var(--mut);font-size:.92rem;font-style:italic}
.info{margin-top:6rem;padding-top:3.5rem;border-top:1px solid var(--line)}
.info h2{font-size:clamp(1.8rem,3vw,2.4rem);margin-bottom:2.25rem}
.icn{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
.icn h3{font-size:.85rem;font-family:var(--bd);font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--glow);margin-bottom:.5rem}
.icn p{margin:0;color:var(--ink);word-break:break-word}
.icn a{text-decoration:none}
.icn a:hover{color:var(--glow)}
@media(max-width:1000px){
.hero .wrap,.sv .wrap,.wh .hd,.ts .hd,.in .wrap,.fq .wrap{grid-template-columns:1fr}
.hcard{justify-self:start;margin-top:1.5rem;width:min(280px,70%)}
.side,.pans{position:static}
.wh .fig,.ts .fig{justify-self:start;margin-top:1rem}
.bento{grid-template-columns:1fr 1fr}
.b1,.b2,.b3,.b4,.b5,.b6{grid-column:auto}
.b1,.b4{grid-column:1/-1}
.rs .nums{grid-template-columns:1fr 1fr}
.num:nth-child(3){border-left:0;padding-left:0}
.num:nth-child(n+3){border-top:1px solid var(--line)}
.tl::before,.tl::after{left:8px}
.st{grid-template-columns:1fr;gap:0;padding-left:2.6rem}
.st .gl,.st:nth-child(even) .gl{grid-column:1}
.st::before{left:8px}
.pc .tiers{grid-template-columns:1fr}
.tier.ft{padding-block:2.25rem}
.qs{grid-template-columns:1fr;padding-bottom:0}
.qw:nth-child(even){margin:0}
.tm .ppl{grid-template-columns:1fr 1fr}
.pw:nth-child(n){margin-top:0}
.icn{grid-template-columns:1fr 1fr}
.hero{min-height:0}
}
@media(max-width:600px){
font-size:16px;
.tm .ppl,.icn{grid-template-columns:1fr}
.bento{grid-template-columns:1fr}
.row:hover{padding-left:0}
.cta-row .btn{width:100%;justify-content:center;white-space:normal}
.panel{padding:1.8rem}
}
}
@media(min-width:1025px){body.page-id-5771 #masthead .hfe-nav-menu .hfe-menu-item{color:#EAF0FF}
body.page-id-5771 #masthead .hfe-nav-menu .menu-item:hover>.hfe-menu-item{color:#7CCBFF}
body.page-id-5771 #masthead .hfe-nav-menu .sub-menu .hfe-sub-menu-item{color:#0C223F}}
body.page-id-5771 #masthead .hfe-site-logo-img{filter:brightness(0) invert(1)}
body.page-id-5771 #masthead .hfe-nav-menu__toggle{color:#EAF0FF}
body.page-id-5771 #masthead .hfe-nav-menu__toggle svg,body.page-id-5771 #masthead .hfe-nav-menu__toggle i{fill:#EAF0FF;color:#EAF0FF}
@keyframes gshup{to{opacity:1;transform:none}}
@keyframes gshfl{0%,100%{transform:perspective(900px) rotateY(-16deg) rotateX(6deg) rotate(1.5deg)}50%{transform:perspective(900px) rotateY(-12deg) rotateX(4deg) rotate(1.5deg) translateY(-14px)}}
@keyframes gshmq{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){#gsh *,#gsh *::before{animation:none!important;transition:none!important}#gsh .hu,#gsh.js .rv{opacity:1!important;transform:none!important}html{scroll-behavior:auto}}