.phone-stage{--phone-bright:167 139 250;--phone-mid:139 92 246;--phone-deep:124 77 255;--phone-cool:41 163 255;perspective:1400px;width:min(100%,65rem);height:clamp(17.5rem,56vw,35rem);transform-style:preserve-3d;margin:0 auto;position:relative}.phone-stage.is-paused,.phone-stage.is-paused *{animation-play-state:paused}.phone-row{transform-style:preserve-3d;grid-template-columns:repeat(3,1fr);align-items:stretch;gap:clamp(.7rem,5vw,4.5rem);display:grid;position:absolute;inset:9% 4% 14%}.phone-card{--lift:0px;--offset-x:0px;aspect-ratio:9/18;max-width:100%;height:100%;transform:translate3d(var(--offset-x), var(--lift), 0) translateZ(var(--depth)) rotateY(var(--tilt));transform-style:preserve-3d;animation:phoneFloat 6s ease-in-out var(--delay) infinite;justify-self:center;transition:transform .55s cubic-bezier(.22,1,.36,1);position:relative}.phone-card:hover{--lift:-22px;transform:translate3d(var(--offset-x), var(--lift), 0) translateZ(calc(var(--depth) + 40px)) rotateY(calc(var(--tilt) * .18)) scale(1.05);z-index:3}.phone-body{border:1px solid rgb(var(--phone-bright) / 28%);background:radial-gradient(circle at 50% 28%, rgb(var(--phone-mid) / 22%), transparent 38%), linear-gradient(145deg, #191430 0%, #0a0714 60%, #050507 100%);width:100%;height:100%;box-shadow:inset 0 1px 0 #ffffff29, inset -18px 0 28px #00000080, inset 12px 0 22px rgb(var(--phone-bright) / 4%), 0 24px 48px #0000008c, 0 0 30px rgb(var(--phone-mid) / 16%);border-radius:clamp(.9rem,1.4vw,1.3rem);flex-direction:column;align-items:center;padding:8% 8% 6%;display:flex;position:relative;overflow:hidden}.phone-card:hover .phone-body{border-color:rgb(var(--phone-bright) / 60%);box-shadow:inset 0 1px 0 #ffffff3d, inset -18px 0 28px #0000007a, 0 30px 70px #0009, 0 0 60px rgb(var(--phone-bright) / 40%)}.phone-notch{z-index:2;align-items:center;gap:.35rem;margin-bottom:6%;display:flex;position:relative}.phone-notch-bar{background:linear-gradient(90deg, rgb(var(--phone-bright) / 60%), rgb(var(--phone-mid) / 85%));width:clamp(1.6rem,3vw,2.4rem);height:clamp(.25rem,.5vw,.32rem);box-shadow:0 0 8px rgb(var(--phone-mid) / 60%);border-radius:999px}.phone-notch-dot{background:rgb(var(--phone-bright));width:clamp(.3rem,.6vw,.4rem);height:clamp(.3rem,.6vw,.4rem);box-shadow:0 0 10px rgb(var(--phone-bright));border-radius:999px;animation:1.6s ease-in-out infinite phoneDotPulse}.phone-signal{z-index:2;align-items:flex-end;gap:2px;height:clamp(.5rem,1vw,.7rem);display:flex;position:absolute;top:7%;right:10%}.phone-signal span{background:rgb(var(--phone-bright) / 70%);width:clamp(.12rem,.3vw,.18rem);box-shadow:0 0 6px rgb(var(--phone-mid) / 55%);border-radius:1px}.phone-signal span:first-child{height:30%}.phone-signal span:nth-child(2){height:55%}.phone-signal span:nth-child(3){height:78%}.phone-signal span:nth-child(4){height:100%}.phone-texture{opacity:.7;pointer-events:none;background:linear-gradient(170deg, transparent 0 14%, #ffffff14 15%, transparent 16%), linear-gradient(25deg, transparent 0 54%, rgb(var(--phone-bright) / 6%) 55%, transparent 56%);position:absolute;inset:0}.phone-gloss{pointer-events:none;animation:phoneGloss 6s ease-in-out var(--delay) infinite;background:linear-gradient(115deg,#0000 0%,#ffffff38 48%,#0000 58%);position:absolute;inset:-1px;transform:translate(-130%)}.phone-icon{z-index:1;border:1px solid rgb(var(--phone-bright) / 50%);background:radial-gradient(circle at 35% 28%, rgb(var(--phone-bright) / 70%) 0%, rgb(var(--phone-mid) / 42%) 30%, #080612eb 72%);color:#f0edff;width:clamp(2.8rem,4.4vw,4rem);height:clamp(2.8rem,4.4vw,4rem);box-shadow:inset 0 1px 4px #ffffff73, inset 0 -4px 10px #0006, 0 0 24px rgb(var(--phone-mid) / 60%), 0 0 50px rgb(var(--phone-deep) / 35%);border-radius:999px;place-items:center;display:grid;position:relative}.phone-icon svg{width:45%;height:45%}.phone-icon-halo{background:radial-gradient(circle, rgb(var(--phone-bright) / 32%), transparent 65%);filter:blur(4px);border-radius:999px;animation:3s ease-in-out infinite phoneHalo;position:absolute;inset:-22%}.phone-copy{z-index:1;text-align:center;flex-direction:column;align-items:center;gap:clamp(.25rem,.6vw,.42rem);margin-top:clamp(.5rem,1.4vw,.9rem);padding:0 2%;display:flex;position:relative}.phone-label{color:#fff;letter-spacing:.16em;text-transform:uppercase;text-shadow:0 1px 10px rgb(var(--phone-mid) / 55%);font-size:clamp(.62rem,1.05vw,.92rem);font-weight:800;line-height:1.1}.phone-tagline{color:#e6e2f5c7;max-width:16ch;font-size:clamp(.46rem,.75vw,.66rem);font-weight:500;line-height:1.35}.phone-screen{z-index:1;flex:auto;width:84%;min-height:0;margin-top:clamp(.4rem,1vw,.7rem);position:relative}.phone-screen img{object-fit:contain;object-position:center}.phone-chart,.phone-pulse,.phone-rows{z-index:1;width:78%;margin-top:auto;margin-bottom:8%;position:relative}.phone-chart{justify-content:space-between;align-items:flex-end;gap:4%;height:clamp(2rem,4vw,3rem);display:flex}.phone-bar{height:var(--bar-height);background:linear-gradient(180deg, rgb(var(--phone-bright)) 0%, rgb(var(--phone-deep)) 100%);box-shadow:0 0 8px rgb(var(--phone-mid) / 60%);transform-origin:bottom;animation:phoneBar 2.6s ease-in-out var(--bar-delay) infinite alternate;border-radius:2px 2px 0 0;flex:1}.phone-pulse{flex-direction:column;align-items:center;gap:.4rem;display:flex}.phone-pulse svg{width:100%;height:clamp(1.4rem,3vw,2.2rem);overflow:visible}.phone-pulse path{fill:none;stroke:rgb(var(--phone-bright));stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 6px rgb(var(--phone-bright) / 85%));stroke-dasharray:140;stroke-dashoffset:140px;animation:2.4s linear infinite phonePulseDraw}.phone-pulse-dots{gap:.4rem;display:flex}.phone-pulse-dots span{background:rgb(var(--phone-bright) / 85%);width:clamp(.3rem,.6vw,.42rem);height:clamp(.3rem,.6vw,.42rem);box-shadow:0 0 8px rgb(var(--phone-mid) / 70%);border-radius:999px;animation:1.4s ease-in-out infinite phoneDotPulse}.phone-rows{flex-direction:column;gap:clamp(.32rem,.7vw,.5rem);display:flex}.phone-row-track{background:rgb(var(--phone-mid) / 18%);border-radius:999px;width:100%;height:clamp(.34rem,.7vw,.48rem);position:relative;overflow:hidden}.phone-row-track>span{width:var(--row-width);background:linear-gradient(90deg, rgb(var(--phone-deep)) 0%, rgb(var(--phone-cool)) 100%);box-shadow:0 0 8px rgb(var(--phone-mid) / 55%);animation:phoneRowFill 3s ease-in-out var(--row-delay) infinite alternate;border-radius:999px;position:absolute;inset:0}.phone-home-bar{background:rgb(var(--phone-bright) / 55%);width:28%;height:clamp(.18rem,.4vw,.26rem);box-shadow:0 0 8px rgb(var(--phone-bright) / 45%);border-radius:999px;position:absolute;bottom:3%;left:50%;transform:translate(-50%)}.phone-shadow{pointer-events:none;background:radial-gradient(ellipse at center, rgb(var(--phone-mid) / 50%), transparent 70%);filter:blur(14px);opacity:.8;height:22%;position:absolute;bottom:-12%;left:10%;right:10%}@keyframes phoneFloat{0%,to{translate:0}50%{translate:0 -8px}}@keyframes phoneGloss{0%,24%{opacity:0;transform:translate(-130%)}38%,58%{opacity:.75}82%,to{opacity:0;transform:translate(130%)}}@keyframes phoneHalo{0%,to{opacity:.85;transform:scale(1)}50%{opacity:1;transform:scale(1.06)}}@keyframes phoneBar{0%{opacity:.7;transform:scaleY(.6)}to{opacity:1;transform:scaleY(1)}}@keyframes phonePulseDraw{0%{stroke-dashoffset:140px}60%,to{stroke-dashoffset:0}}@keyframes phoneRowFill{0%{opacity:.7;transform:translate(-30%)}to{opacity:1;transform:translate(0)}}@keyframes phoneDotPulse{0%,to{opacity:.5;transform:scale(.9)}50%{opacity:1;transform:scale(1.1)}}@media (max-width:720px){.phone-stage{height:clamp(16rem,58vw,22rem)}.phone-row{gap:.5rem;inset:6% 2% 12%}.phone-icon{width:2.2rem;height:2.2rem}}@media (max-width:460px){.phone-stage{height:15rem}.phone-row{gap:.4rem}.phone-icon{width:1.9rem;height:1.9rem}}@media (max-width:380px){.phone-stage{height:13rem}.phone-row{gap:.3rem;inset:5% 2% 16%}.phone-body{padding:7% 5% 5%}.phone-icon{width:1.6rem;height:1.6rem}.phone-tagline{max-width:15ch;font-size:.42rem}.phone-screen{display:none}.phone-chart{height:1.6rem}.phone-pulse svg{height:1.1rem}.phone-chart,.phone-pulse,.phone-rows{width:84%;margin-bottom:6%}}@media (prefers-reduced-motion:reduce){.phone-card,.phone-gloss,.phone-icon-halo,.phone-bar,.phone-pulse path,.phone-row-track>span,.phone-notch-dot,.phone-pulse-dots span{animation:none}.phone-gloss{opacity:0}.phone-pulse path{stroke-dashoffset:0}}
.reel-gallery{--stage-w:clamp(10.5rem, 21vw, 15rem);--thumb-w:calc(var(--stage-w) * .45);flex-direction:column;align-items:center;gap:1.25rem;display:flex}.reel-gallery-side{flex-wrap:wrap;justify-content:center;gap:.6rem;display:flex}.reel-gallery-outer,.reel-gallery-inner{display:contents}.reel-stage{width:var(--stage-w);aspect-ratio:9/19;background:linear-gradient(160deg,#2b2842 0%,#14121f 45%,#0b0a12 100%);border:1px solid #ffffff38;border-radius:2rem;flex:none;order:-1;padding:.34rem;position:relative;box-shadow:inset 0 1px #ffffff2e,0 28px 70px #0000008c}.reel-stage-screen{background:#0b0a12;border-radius:1.72rem;width:100%;height:100%;position:relative;overflow:hidden}.reel-stage-notch{z-index:2;background:#06060a;border-radius:999px;width:30%;height:.85rem;position:absolute;top:.4rem;left:50%;transform:translate(-50%)}.reel-stage-home{z-index:2;background:#ffffff8c;border-radius:999px;width:30%;height:.22rem;position:absolute;bottom:.5rem;left:50%;transform:translate(-50%)}.reel-thumb{width:var(--thumb-w);aspect-ratio:9/16.5;cursor:pointer;background:#0b0a12;border:1px solid #ffffff29;border-radius:1.1rem;flex:none;transition:transform .22s ease-out,border-color .22s ease-out,box-shadow .22s ease-out;position:relative;overflow:hidden;box-shadow:0 14px 34px #0000006b}@media (hover:hover){.reel-thumb:hover{transform:translateY(-4px)scale(1.04)}}.reel-gallery.is-posts{--thumb-w:calc(var(--stage-w) * .5)}.reel-gallery.is-posts .reel-thumb{aspect-ratio:4/5}.reel-stage.is-framed{aspect-ratio:1392/2840;box-shadow:none;background:0 0;border:0;border-radius:0;padding:0;overflow:visible}.reel-stage-frame{object-fit:contain;object-position:center}.reel-stage-well{z-index:1;background:#fff;align-items:center;display:flex;position:absolute;overflow:hidden}.reel-stage-post{aspect-ratio:4/5;width:100%;position:relative;overflow:hidden}.reel-stage-media{object-fit:cover;object-position:top;width:100%;height:100%;position:absolute;inset:0}.is-framed .reel-stage-media{object-position:center;transform:scale(1.08)}.reel-stage:not(.is-framed) img.reel-stage-media{object-fit:contain;object-position:center}.reel-thumb-play{color:#fff;opacity:0;background:#00000059;place-items:center;transition:opacity .2s ease-out;display:grid;position:absolute;inset:0}.reel-thumb:hover .reel-thumb-play,.reel-thumb:focus-visible .reel-thumb-play{opacity:1}.reel-thumb:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media (min-width:1024px){.reel-gallery{flex-direction:row;justify-content:center;gap:.8rem}.reel-stage{order:0}.reel-gallery-side{flex-wrap:nowrap;align-items:center;gap:.7rem}.reel-gallery-outer,.reel-gallery-inner{flex-direction:column;align-items:center;gap:.85rem;display:flex}.is-left .reel-gallery-outer .reel-thumb{top:.7rem}.is-right .reel-gallery-outer .reel-thumb{top:-.7rem}}@media (prefers-reduced-motion:reduce){.reel-thumb{transition:border-color .22s ease-out,box-shadow .22s ease-out}.reel-thumb:hover{transform:none}}
.client-marquee{--logo-gap:1rem;--tilt:-2deg;width:100%;padding-block:clamp(1rem,1.6vw,3.5rem);overflow-x:clip;-webkit-mask-image:linear-gradient(90deg,#0000 0%,#000 6% 94%,#0000 100%);mask-image:linear-gradient(90deg,#0000 0%,#000 6% 94%,#0000 100%)}.client-marquee-tilt{transform:rotate(var(--tilt))}.client-marquee-track{will-change:transform;width:max-content;animation:clientMarquee var(--marquee-duration,45s) linear infinite;display:flex}@media (hover:hover){.client-marquee:hover .client-marquee-track{animation-play-state:paused}}.client-logo-card{width:clamp(9.5rem,17vw,13rem);height:clamp(3.5rem,6.5vw,4.5rem);margin-right:var(--logo-gap);flex:none}.client-logo-card.border-glow-card{-webkit-backdrop-filter:none}.client-logo-card>.border-glow-inner{justify-content:center;align-items:center;padding:0 1.15rem}.client-logo-card img{object-fit:contain;object-position:center;width:100%;height:100%}@media (max-width:640px){.client-marquee{--logo-gap:.65rem}}@media (prefers-reduced-motion:reduce){.client-marquee-track{animation:none;transform:translate(-25%)}}@keyframes clientMarquee{0%{transform:translate(0,0)}to{transform:translate(-50%)}}
