:root{--bg:#000;--ink:#fff;--mute:#a3a3b8;--dim:#6e6e85;--ind:#4f46f0;--ind2:#7b72ff;--ind3:#b4aeff;--glass:rgba(255,255,255,.045);--line:rgba(160,150,255,.16);--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.65 Inter,system-ui,sans-serif;overflow-x:clip;-webkit-font-smoothing:antialiased}
h1,h2,h3,p,ul{margin:0}
h1,h2,h3{font-family:Poppins,Inter,sans-serif;font-weight:500;line-height:1.15;letter-spacing:-.02em}
h1{font-size:clamp(40px,6.4vw,76px)}
h2{font-size:clamp(30px,4.2vw,48px)}
h3{font-size:20px}
p{color:var(--mute)}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}
:focus-visible{outline:2px solid var(--ind3);outline-offset:4px;border-radius:6px}
.ic{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.wrap{width:min(1160px,calc(100% - 40px));margin-inline:auto}
.narrow{max-width:820px}
.section{padding-block:clamp(64px,9vw,120px)}
.skip{position:fixed;left:16px;top:-80px;background:#fff;color:#000;padding:10px 14px;z-index:99;border-radius:8px}.skip:focus{top:12px}
#dust{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:.8}
main,.nav-wrap{position:relative;z-index:1}

/* nav */
.nav-wrap{position:fixed;top:14px;left:0;right:0;z-index:50;padding-inline:16px}
.nav{max-width:1100px;margin:auto;display:flex;align-items:center;gap:20px;padding:9px 10px 9px 18px;border:1px solid var(--line);border-radius:999px;background:rgba(8,8,18,.7);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.brand{display:flex;align-items:center;gap:9px;font:500 18px Poppins,sans-serif}
.nav-links{display:flex;gap:2px;margin-inline:auto}
.nav-links a{padding:7px 12px;border-radius:999px;font-size:14px;color:var(--mute);transition:.2s}
.nav-links a:hover{color:#fff;background:var(--glass)}
.menu-toggle{display:none;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);position:relative}
.menu-toggle span{position:absolute;left:12px;right:12px;height:1.5px;background:#fff;transition:.25s}
.menu-toggle span:first-child{top:16px}.menu-toggle span:last-child{top:23px}
.menu-toggle[aria-expanded=true] span:first-child{top:19.5px;transform:rotate(45deg)}
.menu-toggle[aria-expanded=true] span:last-child{top:19.5px;transform:rotate(-45deg)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;padding:13px 24px;border-radius:999px;background:linear-gradient(180deg,#6358ff,#4338e6);border:1px solid #8a82ff;box-shadow:0 8px 30px -8px #5a4fff,inset 0 1px 0 #ffffff40;font:500 15px Poppins,sans-serif;transition:transform .25s var(--ease),box-shadow .25s}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 40px -6px #6a5fff,inset 0 1px 0 #ffffff50}
.btn .ic{width:18px;height:18px}
.btn-sm{padding:9px 18px;font-size:14px}
.btn-ghost{background:var(--glass);border-color:var(--line);box-shadow:none}
.btn-glow{padding:15px 34px;font-size:16px;box-shadow:0 0 60px 6px #5a4fff99,inset 0 1px 0 #ffffff60}

/* hero */
.hero{position:relative;padding-top:150px;text-align:center;overflow:hidden}
.hero-glow{position:absolute;left:50%;top:-10%;width:1100px;height:700px;transform:translateX(-50%);background:radial-gradient(closest-side,#4f46f055,transparent 70%);pointer-events:none}
.hero-copy{position:relative;width:min(860px,calc(100% - 40px));margin:auto}
.pill{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border:1px solid var(--line);border-radius:999px;background:var(--glass);font-size:13px;color:var(--ind3);margin-bottom:26px}
.dot{width:7px;height:7px;border-radius:50%;background:#7b72ff;box-shadow:0 0 10px #7b72ff;animation:pulse 2s infinite}
@keyframes pulse{50%{opacity:.35}}
.grad{background:linear-gradient(90deg,#fff,#a79fff 60%,#7b72ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{margin:24px auto 34px;max-width:620px;font-size:18px}
.cta-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.hero-stage{position:relative;margin-top:64px;height:clamp(360px,52vw,640px)}
.spot{position:absolute;left:50%;bottom:-40px;width:900px;max-width:130%;height:420px;transform:translateX(-50%);background:radial-gradient(ellipse at 50% 100%,#6a5fff99,#4f46f033 40%,transparent 70%);filter:blur(10px)}
.phones{position:absolute;inset:0;display:flex;justify-content:center;align-items:flex-start;gap:clamp(8px,2vw,28px)}
.phone{margin:0;border-radius:34px;padding:6px;background:linear-gradient(160deg,#3a3a52,#0c0c16);border:1px solid #ffffff22;box-shadow:0 30px 80px -20px #000,0 0 0 1px #000;overflow:hidden}
.phone img{display:block;width:100%;height:auto;border-radius:28px}
.phones .phone{width:clamp(120px,22vw,260px)}
.p-mid{transform:translateY(-30px);width:clamp(140px,26vw,300px)!important}
.p-left,.p-right{margin-top:40px}
.p-left{transform:rotate(-5deg)}.p-right{transform:rotate(5deg)}
.hero-stage::after{content:"";position:absolute;left:0;right:0;bottom:0;height:160px;background:linear-gradient(transparent,#000);pointer-events:none}

/* logos */
.logos{text-align:center;padding-block:20px 10px}
.logos p{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:16px}
.logos div{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 34px}
.logos span{font:500 17px Poppins,sans-serif;color:#d8d6f0;opacity:.7}

/* stats */
.stats{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;margin-block:70px 0;border:1px solid var(--line);border-radius:22px;background:var(--line);overflow:hidden}
.stat{background:#05050c;padding:28px 12px;text-align:center}
.stat b{display:block;font:500 clamp(30px,4vw,46px)/1.1 Poppins,sans-serif;background:linear-gradient(#fff,#8d85ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat span{font-size:13.5px;color:var(--mute)}

.head{text-align:center;max-width:720px;margin:0 auto 56px}
.head p:not(.eyebrow){margin-top:16px;font-size:17px}
.eyebrow{font:500 13px Poppins,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--ind2);margin-bottom:14px}

/* flow diagram */
.flow{display:grid;grid-template-columns:1fr minmax(180px,.9fr) 1fr;align-items:center;gap:0}
.flow-col{display:grid;gap:14px}
.node{padding:18px 20px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(160deg,#14142a,#080812);transition:.3s var(--ease)}
.node:hover{border-color:#7b72ff88;transform:translateY(-2px)}
.node .ic{color:var(--ind3);margin-bottom:8px}
.node h3{font-size:16px}.node p{font-size:13.5px;margin-top:2px}
.chip-wrap{position:relative;height:300px;display:grid;place-items:center}
.traces{position:absolute;inset:0;width:100%;height:100%}
.traces path{fill:none;stroke:#7b72ff;stroke-width:1.4;stroke-dasharray:6 8;opacity:.75;animation:dash 1.6s linear infinite;vector-effect:non-scaling-stroke}
@keyframes dash{to{stroke-dashoffset:-14}}
.chip{position:relative;width:128px;height:128px;border-radius:30px;display:grid;place-items:center;align-content:center;background:linear-gradient(150deg,#8a82ff,#4338e6 55%,#3a30c8);border:1px solid #c3beff;box-shadow:0 0 0 10px #4f46f022,0 0 80px 10px #5a4fffaa,inset 0 2px 0 #fff6;font-family:Poppins,sans-serif}
.chip span{font-size:56px;font-weight:600;line-height:1;text-shadow:0 4px 18px #0006}
.chip small{font-size:10px;letter-spacing:.22em;opacity:.85}

/* bento */
.bento{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.card{position:relative;border:1px solid var(--line);border-radius:24px;padding:28px;background:linear-gradient(165deg,#12122a,#05050d);overflow:hidden;transition:transform .35s var(--ease),border-color .3s;display:flex;flex-direction:column;gap:10px}
.card:hover{transform:translateY(-4px);border-color:#7b72ff77}
.card h3{font-size:21px}.card p{font-size:14.5px}
.card .link{margin-top:auto;padding-top:14px;display:inline-flex;align-items:center;gap:6px;color:var(--ind3);font-size:14px}
.card .link .ic{width:16px;height:16px;transition:.25s}.card .link:hover .ic{transform:translateX(4px)}
.c-blue{grid-column:span 4;grid-row:span 2;background:radial-gradient(circle at 80% 90%,#ffffff55 0 1px,transparent 2px) 0 0/34px 34px,linear-gradient(160deg,#5a50ff,#3b31d8);border-color:#8f88ff}
.c-blue h3{font-size:30px}.c-blue p{color:#dedbff;font-size:15.5px}
.tag{margin-top:auto;font-size:12.5px;padding:5px 12px;border-radius:999px;background:#0003;align-self:flex-start}
.c-shot{grid-column:span 4;grid-row:span 2;flex-direction:row;align-items:flex-end;padding:0;background:radial-gradient(circle at 50% 100%,#5a50ff66,#05050d 70%)}
.c-shot img{width:46%;margin:30px 0 -50px 22px;border-radius:26px;border:5px solid #1a1a2e;box-shadow:0 20px 50px #000}
.c-shot div{padding:26px 22px 26px 0;flex:1;align-self:center}
.c-wide{grid-column:span 4;grid-row:span 2}
.mini-list{display:grid;gap:8px;margin-bottom:12px}
.mini-list div{display:flex;align-items:center;gap:10px;padding:10px 13px;border-radius:12px;background:var(--glass);border:1px solid var(--line);font-size:13.5px;color:#e5e3ff}
.mini-list .ic{width:18px;height:18px;color:var(--ind3)}
.c-dark{grid-column:span 4}

/* connectors */
.filters{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-bottom:34px}
.filters button{padding:8px 18px;border:1px solid var(--line);border-radius:999px;color:var(--mute);font-size:14px;transition:.2s}
.filters button:hover{color:#fff}
.filters button.on{background:linear-gradient(180deg,#6358ff,#4338e6);border-color:#8a82ff;color:#fff}
.conn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.conn{position:relative;padding:22px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(165deg,#10101f,#06060d);transition:.3s var(--ease)}
.conn:hover{transform:translateY(-3px);border-color:#7b72ff77}
.conn[hidden]{display:none}
.ci{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(150deg,#6a60ff,#3a30c8);box-shadow:inset 0 1px 0 #fff5,0 8px 22px -6px #5a4fff;margin-bottom:14px}
.conn h3{font-size:17px}.conn p{font-size:13.5px;margin-top:6px}
.on-badge{display:inline-block;margin-top:12px;font-size:11.5px;padding:3px 10px;border-radius:999px;color:#9fe9b8;background:#2fbf6a1f;border:1px solid #2fbf6a40}
.fine{text-align:center;font-size:13px;margin-top:26px;color:var(--dim)}

/* split */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,6vw,80px);align-items:center}
.split.rev{grid-template-columns:.95fr 1.05fr}
.split h2{margin-bottom:16px}
.ticks,.plain{list-style:none;padding:0;display:grid;gap:11px;margin-top:22px}
.ticks li{display:flex;gap:12px;color:#d4d2ea;font-size:15.5px}
.ticks .ic{width:20px;height:20px;color:#8f88ff;margin-top:3px}
.glow-panel{position:relative;display:grid;place-items:center;padding:40px 20px;border-radius:30px;border:1px solid var(--line);background:radial-gradient(ellipse at 50% 100%,#5a50ff77,transparent 65%),linear-gradient(#0b0b1c,#030308)}
.glow-panel .phone{width:min(260px,70%)}
.chat{position:absolute;max-width:190px;padding:11px 15px;border-radius:16px;font-size:13.5px;border:1px solid var(--line);backdrop-filter:blur(12px);animation:float 6s ease-in-out infinite}
.c1{left:-4%;top:18%;background:#1c1c3acc;color:#fff;border-bottom-left-radius:4px}
.c2{right:-4%;bottom:20%;background:#4f46f0dd;color:#fff;border-bottom-right-radius:4px;animation-delay:-3s}
@keyframes float{50%{transform:translateY(-10px)}}

.langs{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:900px;margin:auto}
.langs span{padding:10px 20px;border:1px solid var(--line);border-radius:999px;background:var(--glass);font-size:15.5px}

.duo{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.panel{padding:34px;border:1px solid var(--line);border-radius:26px;background:linear-gradient(165deg,#12122a,#05050d)}
.panel h3{font-size:26px;margin-bottom:8px}
.plain li{position:relative;padding-left:22px;color:#cfcde6;font-size:15px}
.plain li::before{content:"";position:absolute;left:2px;top:.7em;width:7px;height:7px;border-radius:50%;background:#7b72ff;box-shadow:0 0 8px #7b72ff}

/* app screens */
.screens{width:min(1160px,calc(100% - 40px));margin:0 auto;display:grid;grid-template-columns:repeat(5,1fr);gap:28px 20px}
.screens figure{margin:0;text-align:center}
.screens .phone{transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.screens figure:hover .phone{transform:translateY(-8px);box-shadow:0 30px 70px -18px #000,0 0 50px -10px #5a4fff99}
.screens figcaption{margin-top:14px;font-size:13.5px;color:var(--mute)}
.screens figcaption b{display:block;color:#fff;font:500 16px Poppins,sans-serif}
.phone img{transition:opacity .35s}
.phone img.swap{opacity:0}
.reveal{will-change:opacity,transform}
.reveal.in{will-change:auto}
.hero-stage .phone{animation:bob 7s ease-in-out infinite}
.p-left{animation-delay:-2s!important}.p-right{animation-delay:-4s!important}
@keyframes bob{50%{translate:0 -10px}}
@media(max-width:980px){.screens{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.screens{grid-template-columns:repeat(2,1fr);gap:24px 14px}}

/* foundation */
.tilt-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:18px}
.tcard{width:min(228px,100%);padding:22px;border-radius:22px;border:1px solid var(--line);background:linear-gradient(165deg,#1b1b36,#0a0a16);transform:rotate(var(--r,0));transition:transform .4s var(--ease)}
.tcard:hover{transform:rotate(0) translateY(-6px)}
.tcard.hl{background:linear-gradient(165deg,#5a50ff,#3a30c8);border-color:#8f88ff}
.tcard.hl p{color:#e3e0ff}
.ti{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;margin-bottom:14px;background:linear-gradient(150deg,#9b94ff,#5148f0);box-shadow:inset 0 1px 0 #fff7,0 10px 24px -8px #000}
.tcard h3{font-size:17px;margin-bottom:6px}.tcard p{font-size:13.5px}

/* faq */
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;display:flex;justify-content:space-between;align-items:center;padding:22px 0;font:500 18px Poppins,sans-serif;cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ic{color:var(--ind2);transition:.3s;transform:rotate(90deg)}
.faq details[open] summary .ic{transform:rotate(-90deg)}
.faq details p{padding:0 40px 22px 0}

/* CTA */
.cta{position:relative;text-align:center;padding-top:110px;overflow:hidden}
.cta-in{position:relative;padding-bottom:90px}
.cta-in h2{font-size:clamp(34px,5.5vw,64px);margin-bottom:14px}
.cta-in .btn{margin-top:30px}
.foot{position:relative;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;padding-block:26px;border-top:1px solid var(--line);font-size:13.5px;color:var(--dim)}
.foot nav{display:flex;gap:20px}.foot a:hover{color:#fff}
.motion{padding:6px 14px;border:1px solid var(--line);border-radius:999px;font-size:12.5px;color:var(--mute)}

/* reveal */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.reveal.in{opacity:1;transform:none}
.paused *,.paused *::before,.paused *::after{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}html{scroll-behavior:auto}}

/* responsive */
@media(max-width:980px){
.bento{grid-template-columns:repeat(6,1fr)}
.c-blue,.c-shot,.c-wide{grid-column:span 6;grid-row:auto}.c-dark{grid-column:span 3}
.split,.split.rev{grid-template-columns:1fr}.split.rev .split-art{order:2}
.stats{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:760px){
.nav-links{position:absolute;top:62px;left:16px;right:16px;flex-direction:column;padding:10px;border:1px solid var(--line);border-radius:20px;background:#0a0a16f2;backdrop-filter:blur(18px);display:none}
.nav-links.open{display:flex}
.nav-links a{padding:12px}
.nav .btn-sm{margin-left:auto}
.menu-toggle{display:block}
.flow{grid-template-columns:1fr}.chip-wrap{height:170px}.traces{display:none}
.duo{grid-template-columns:1fr}
.c-dark{grid-column:span 6}
.stats{grid-template-columns:repeat(2,1fr)}.stat:last-child{grid-column:span 2}
.hero{padding-top:120px}
.p-left,.p-right{display:none}
.phones .p-mid{width:min(62vw,280px)!important;transform:none}
.hero-stage{height:min(112vw,560px)}
.c-shot{flex-direction:column}.c-shot img{width:60%;margin:24px auto -40px;order:2}.c-shot div{padding:26px 26px 0}
.chat{display:none}
.faq details p{padding-right:0}
.foot{justify-content:center;text-align:center}
}

/* real app icon + theme switch */
.hero-icon,.cta-icon{display:block;margin:0 auto 22px;border-radius:22%;box-shadow:0 0 0 1px #ffffff22,0 14px 40px -8px #000,0 0 60px -6px #ff3b3055}
.cta-icon{width:84px;height:84px}
.brand img{border-radius:7px}
.theme-switch{display:inline-flex;margin-top:22px;padding:4px;border:1px solid var(--line);border-radius:999px;background:var(--glass)}
.theme-switch button{padding:7px 22px;border-radius:999px;font-size:14px;color:var(--mute);transition:.2s}
.theme-switch button.on{background:linear-gradient(180deg,#6358ff,#4338e6);color:#fff}
.phone img{background:#0d0e12}

/* ===== motion v2: modelled on the reference video ===== */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}

/* hero: diagonal light streak from the top-left, mockup rises into view */
.hero-copy>*{opacity:0;transform:translateY(22px);filter:blur(6px);animation:up .9s var(--ease) forwards}
.hero-copy>:nth-child(1){animation-delay:.05s}.hero-copy>:nth-child(2){animation-delay:.15s}.hero-copy>:nth-child(3){animation-delay:.3s}.hero-copy>:nth-child(4){animation-delay:.42s}.hero-copy>:nth-child(5){animation-delay:.55s}
@keyframes up{to{opacity:1;transform:none;filter:none}}
.phones{transform-origin:50% 100%;opacity:0;animation:rise 1.5s .55s var(--ease) forwards}
@keyframes rise{from{opacity:0;transform:perspective(1200px) translateY(140px) rotateX(18deg)}to{opacity:1;transform:perspective(1200px) none}}
.hero-icon{animation:up .9s var(--ease) forwards}

/* headings: masked rise, like the video's line reveal */
.head.reveal h2{clip-path:inset(0 0 100% 0);transform:translateY(34px);filter:blur(8px);transition:clip-path 1s var(--ease) .1s,transform 1s var(--ease) .1s,filter 1s var(--ease) .1s}
.head.reveal.in h2{clip-path:inset(-10% -5% -25% -5%);transform:none;filter:none}

/* chip + traces pulse */
.chip{animation:chipPulse 3.2s ease-in-out infinite}
@keyframes chipPulse{50%{box-shadow:0 0 0 16px #4f46f01a,0 0 120px 24px #6a5fffcc,inset 0 2px 0 #fff6}}
.traces path{stroke:#a79fff}

/* hanging tags (the "Issues arise every day" card) */
.hang-card{position:relative;display:grid;grid-template-columns:1fr 1.1fr;align-items:center;gap:20px;min-height:340px;padding:clamp(26px,4vw,56px);border:1px solid var(--line);border-radius:28px;overflow:hidden;background:radial-gradient(ellipse at 80% 0,#4f46f055,transparent 60%),linear-gradient(160deg,#14143a,#06060f)}
.hang-card h2{font-size:clamp(26px,3.6vw,40px)}
.hang-card p{margin-top:14px}
.hang{position:relative;height:300px}
.hang span{position:absolute;top:-6px;left:var(--x);transform-origin:50% -20px;padding:9px 15px;border-radius:10px;font-size:13px;white-space:nowrap;color:#e9e7ff;background:linear-gradient(160deg,#4f46f0,#3a30c8);border:1px solid #9a93ff;box-shadow:0 8px 24px -8px #5a4fff;animation:sway var(--d,5s) ease-in-out infinite;animation-delay:var(--dl,0s);margin-top:var(--y)}
.hang span::before{content:"";position:absolute;left:50%;bottom:100%;width:1px;height:var(--y);background:linear-gradient(#ffffff00,#9a93ffaa)}
@keyframes sway{0%,100%{rotate:-4deg}50%{rotate:4deg}}

/* foundation: real tilt (rotate property), scroll-driven spread from a stack */
.tilt-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.tcard{width:auto;transform:none;rotate:var(--r,0deg);translate:calc(var(--tx,0)*(1 - var(--s,1))*1px) calc(var(--ty,0)*(1 - var(--s,1))*1px);will-change:translate}
.tcard.reveal{transition:opacity .8s var(--ease),transform .8s var(--ease),rotate .5s var(--ease),scale .4s var(--ease)}
.tcard:hover{transform:none;rotate:0deg;scale:1.04}
.tcard:nth-child(1){--tx:300;--ty:50}.tcard:nth-child(2){--tx:150;--ty:-10}.tcard:nth-child(3){--tx:0;--ty:70}.tcard:nth-child(4){--tx:-150;--ty:-10}.tcard:nth-child(5){--tx:-300;--ty:50}

/* CTA: hot spotlight cone + glowing button */
.cta-in .btn-glow{animation:btnGlow 3s ease-in-out infinite}
@keyframes btnGlow{50%{box-shadow:0 0 90px 14px #6a5fffcc,inset 0 1px 0 #ffffff60}}

@media(max-width:980px){.tilt-grid{display:flex;flex-wrap:wrap;justify-content:center}.tcard{width:min(228px,100%);translate:none}.hang-card{grid-template-columns:1fr}.hang{height:230px}}
@media(prefers-reduced-motion:reduce){.hero-copy>*,.phones,.hero-icon{opacity:1!important;transform:none!important;filter:none!important}.head.reveal h2{clip-path:none;transform:none;filter:none}}

/* scrolling up: elements enter from above */
.reveal.from-top:not(.in){transform:translateY(-28px)}
.head.reveal.from-top:not(.in) h2{transform:translateY(-34px)}
.reveal:not(.in){transition-delay:0s!important}
.foot>span{line-height:1.6}.foot>span a{color:var(--ind3);text-decoration:underline;text-underline-offset:3px}.foot>span a:hover{color:#fff}

/* team credits */
.people{display:flex;justify-content:center;gap:clamp(28px,6vw,72px);flex-wrap:wrap}
.people figure{margin:0;text-align:center}
.people img{width:150px;height:150px;border-radius:50%;object-fit:cover;border:2px solid #7b72ff66;box-shadow:0 0 0 6px #4f46f01f,0 18px 50px -12px #5a4fff99;transition:transform .5s var(--ease),box-shadow .5s}
.people figure:hover img{transform:translateY(-6px) scale(1.03);box-shadow:0 0 0 6px #4f46f033,0 24px 60px -10px #6a5fffcc}
.people figcaption{margin-top:16px;font:500 17px Poppins,sans-serif}
.team .head{margin-bottom:40px}