:root{--bg:#060a16;--navy:#071335;--blue:#2f6bff;--cyan:#22d3ee;--cyan-soft:#7fe9ff;--ink:#eef3ff;--dim:#93a2c4;--line:rgba(148,168,220,.14)}
*{box-sizing:border-box;margin:0;padding:0}body{min-height:100vh;overflow-x:hidden;background:var(--bg);color:var(--ink);font-family:"Inter",sans-serif}a{color:inherit;text-decoration:none}.page-grid{position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(47,107,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(47,107,255,.04) 1px,transparent 1px);background-size:70px 70px;mask-image:linear-gradient(#000,transparent 90%)}
main{position:relative;z-index:2;padding-top:84px}.detail-hero{display:grid;width:min(1120px,calc(100% - 48px));min-height:calc(100vh - 84px);margin:auto;padding:75px 0;grid-template-columns:1.05fr .95fr;align-items:center;gap:clamp(45px,7vw,95px)}.hero-copy{animation:copy-in 1s cubic-bezier(.16,1,.3,1) both}.eyebrow{display:inline-flex;align-items:center;gap:10px;color:var(--cyan-soft);font:500 11px/1 "JetBrains Mono",monospace;letter-spacing:.14em}.eyebrow i{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 14px var(--cyan);animation:pulse 1.8s infinite}.hero-copy h1{margin-top:24px;font:600 clamp(48px,6.3vw,84px)/1 "Space Grotesk",sans-serif;letter-spacing:-.05em}.hero-copy h1 span{display:block;background:linear-gradient(100deg,var(--cyan),var(--blue),var(--cyan-soft));background-clip:text;color:transparent}.hero-copy>p{max-width:620px;margin-top:26px;color:var(--dim);font-size:17px;line-height:1.75}.hero-actions{display:flex;margin-top:34px;align-items:center;flex-wrap:wrap;gap:14px}.primary-link{padding:13px 22px;border-radius:999px;background:linear-gradient(135deg,var(--blue),var(--cyan));color:#04101f;font-size:14px;font-weight:700}.secondary-link{padding:12px 20px;border:1px solid var(--line);border-radius:999px;color:var(--cyan-soft);font-size:13px}
.visual{position:relative;width:min(43vw,500px);aspect-ratio:1;margin:auto;perspective:900px;animation:visual-in 1.2s .12s cubic-bezier(.16,1,.3,1) both}.visual::before{content:"";position:absolute;inset:12%;border-radius:50%;background:radial-gradient(circle,rgba(34,211,238,.17),rgba(47,107,255,.08) 42%,transparent 70%);filter:blur(12px);animation:breathe 4s ease-in-out infinite}.orbit{position:absolute;inset:5%;border:1px solid rgba(126,233,255,.2);border-radius:50%;animation:spin 12s linear infinite}.orbit::after{content:"";position:absolute;top:13%;left:18%;width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 15px var(--cyan)}.orbit.two{inset:20%;border-style:dashed;animation-direction:reverse;animation-duration:8s}
.object{position:absolute;inset:22%;transform-style:preserve-3d;animation:float 5s ease-in-out infinite}.browser-object{display:grid;padding:12px;border:1px solid rgba(126,233,255,.3);border-radius:18px;background:linear-gradient(145deg,rgba(17,39,88,.95),rgba(6,12,29,.98));box-shadow:0 25px 55px rgba(0,0,0,.35)}.browser-bar{display:flex;gap:5px}.browser-bar i{width:6px;height:6px;border-radius:50%;background:var(--cyan)}.browser-screen{display:grid;margin-top:10px;padding:13px;grid-template-columns:.65fr 1fr;gap:10px;border-radius:10px;background:rgba(255,255,255,.045)}.browser-screen span{border-radius:6px;background:linear-gradient(145deg,rgba(34,211,238,.18),rgba(47,107,255,.12))}.browser-lines{display:grid;gap:7px}.browser-lines i{height:6px;border-radius:5px;background:rgba(126,233,255,.2)}
.shop-object{display:grid;place-items:center}.shop-bag{position:relative;width:67%;height:72%;border:3px solid var(--cyan-soft);border-radius:15px 15px 25px 25px;background:linear-gradient(145deg,rgba(47,107,255,.24),rgba(6,12,29,.9));box-shadow:0 0 35px rgba(34,211,238,.15)}.shop-bag::before{content:"";position:absolute;width:43%;height:26%;top:-21%;left:27%;border:3px solid var(--cyan-soft);border-bottom:0;border-radius:40px 40px 0 0}.shop-bag b{position:absolute;inset:0;display:grid;place-items:center;color:var(--cyan);font:700 38px/1 "Space Grotesk",sans-serif}.product-dot{position:absolute;width:15px;height:15px;border-radius:50%;background:var(--cyan);box-shadow:0 0 14px var(--cyan);animation:product-fly 3s ease-in-out infinite}.product-dot.one{top:8%;left:5%}.product-dot.two{right:3%;bottom:18%;animation-delay:1s}
.calendar-object{padding:12px;border:1px solid rgba(126,233,255,.3);border-radius:20px;background:linear-gradient(145deg,rgba(17,39,88,.96),rgba(6,12,29,.98));box-shadow:0 25px 55px rgba(0,0,0,.35)}.calendar-head{height:20%;border-radius:9px;background:linear-gradient(90deg,var(--blue),var(--cyan))}.calendar-grid{display:grid;height:72%;padding-top:12px;grid-template-columns:repeat(4,1fr);gap:8px}.calendar-grid i{border-radius:6px;background:rgba(126,233,255,.09)}.calendar-grid i.active{background:var(--cyan);box-shadow:0 0 14px rgba(34,211,238,.65);animation:slot-pulse 2s infinite}
.seo-object{display:grid;padding:16px;border:1px solid rgba(126,233,255,.3);border-radius:20px;background:linear-gradient(145deg,rgba(17,39,88,.96),rgba(6,12,29,.98));box-shadow:0 25px 55px rgba(0,0,0,.35)}.search-bar{height:20%;border:1px solid rgba(126,233,255,.2);border-radius:999px;background:rgba(255,255,255,.04)}.chart{display:flex;height:65%;padding:16px 8px 0;align-items:flex-end;gap:9px}.chart i{flex:1;border-radius:5px 5px 0 0;background:linear-gradient(var(--cyan),var(--blue));animation:bars 2.4s ease-in-out infinite alternate}.chart i:nth-child(1){height:32%}.chart i:nth-child(2){height:51%;animation-delay:.2s}.chart i:nth-child(3){height:45%;animation-delay:.4s}.chart i:nth-child(4){height:74%;animation-delay:.6s}.chart i:nth-child(5){height:94%;animation-delay:.8s}
.phone-object{display:grid;inset:18% 29%;padding:10px;border:2px solid rgba(126,233,255,.5);border-radius:30px;background:linear-gradient(145deg,rgba(17,39,88,.98),rgba(6,12,29,.98));box-shadow:0 25px 55px rgba(0,0,0,.4),0 0 30px rgba(34,211,238,.12)}.phone-speaker{width:34%;height:5px;margin:2px auto 8px;border-radius:999px;background:rgba(126,233,255,.35)}.phone-screen{display:grid;padding:16px 12px;grid-template-rows:1fr auto;gap:14px;border-radius:21px;background:linear-gradient(155deg,rgba(47,107,255,.28),rgba(34,211,238,.07))}.app-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.app-cards i{border-radius:10px;background:linear-gradient(145deg,rgba(126,233,255,.26),rgba(47,107,255,.12))}.app-cards i:first-child{grid-column:1/-1}.app-nav{display:grid;height:22px;grid-template-columns:repeat(3,1fr);gap:12px}.app-nav i{border-radius:999px;background:rgba(126,233,255,.22)}.app-nav i:nth-child(2){background:var(--cyan);box-shadow:0 0 12px rgba(34,211,238,.6)}
.detail-content{width:min(980px,calc(100% - 48px));margin:auto;padding:40px 0 125px}.intro-block{display:grid;padding:75px 0;grid-template-columns:170px 1fr;gap:45px;border-top:1px solid var(--line)}.section-label{color:var(--cyan-soft);font:500 10px/1.4 "JetBrains Mono",monospace;letter-spacing:.12em}.intro-block h2,.feature-card h2,.process h2{font:600 clamp(30px,4vw,48px)/1.13 "Space Grotesk",sans-serif;letter-spacing:-.035em}.intro-block p,.feature-card p,.process p{margin-top:20px;color:var(--dim);font-size:16px;line-height:1.8}.feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.feature-card{padding:clamp(28px,4vw,45px);border:1px solid var(--line);border-radius:21px;background:rgba(255,255,255,.025)}.feature-card h2{font-size:clamp(25px,3vw,36px)}.feature-card b{color:rgba(126,233,255,.35);font:600 13px/1 "JetBrains Mono",monospace}.process{margin-top:75px;padding:clamp(35px,6vw,65px);border:1px solid rgba(126,233,255,.15);border-radius:25px;background:radial-gradient(circle at 100% 0,rgba(34,211,238,.09),transparent 35%),rgba(8,17,40,.88)}.steps{display:grid;margin-top:35px;grid-template-columns:repeat(4,1fr);gap:15px}.step{padding-top:18px;border-top:1px solid rgba(126,233,255,.2)}.step span{color:var(--cyan);font:500 10px/1 "JetBrains Mono",monospace}.step strong{display:block;margin-top:9px;font-size:13px}.detail-cta{display:grid;margin-top:75px;padding:clamp(38px,7vw,75px);justify-items:center;border:1px solid rgba(126,233,255,.15);border-radius:26px;text-align:center;background:radial-gradient(circle at 50% -20%,rgba(47,107,255,.25),transparent 55%)}.detail-cta h2{max-width:760px;font:600 clamp(34px,5vw,58px)/1.1 "Space Grotesk",sans-serif;letter-spacing:-.04em}.detail-cta a{margin-top:27px;padding:13px 22px;border-radius:999px;background:linear-gradient(135deg,var(--blue),var(--cyan));color:#04101f;font-weight:700}
.reveal{opacity:0;transform:translateY(-55px);filter:blur(6px);transition:opacity .85s ease,transform .85s cubic-bezier(.16,1,.3,1),filter .85s ease}.reveal.visible{opacity:1;transform:none;filter:none}
@keyframes copy-in{from{opacity:0;transform:translateX(-60px);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}@keyframes visual-in{from{opacity:0;transform:translateY(-55px) scale(.92);filter:blur(9px)}to{opacity:1;transform:none;filter:none}}@keyframes pulse{50%{opacity:.45;transform:scale(.7)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes breathe{50%{transform:scale(1.12);opacity:.65}}@keyframes float{50%{transform:translateY(-12px) rotateY(4deg)}}@keyframes product-fly{50%{transform:translate(25px,-25px);opacity:.45}}@keyframes slot-pulse{50%{opacity:.45;transform:scale(.8)}}@keyframes bars{to{filter:brightness(1.5);transform:scaleY(.74);transform-origin:bottom}}
@keyframes desktop-object-motion{0%,100%{transform:translate3d(0,0,0) rotateX(0) rotateY(-3deg)}50%{transform:translate3d(0,-22px,32px) rotateX(3deg) rotateY(6deg)}}
@keyframes desktop-orbit-one{to{transform:rotate(360deg)}}
@keyframes desktop-orbit-two{to{transform:rotate(-360deg)}}
@keyframes browser-screen-pulse{0%,100%{opacity:.55;transform:scale(.96)}50%{opacity:1;transform:scale(1)}}
@keyframes shop-bag-motion{0%,100%{transform:rotate(-3deg) scale(.97)}50%{transform:rotate(4deg) scale(1.04)}}
@keyframes calendar-motion{0%,100%{box-shadow:0 25px 55px rgba(0,0,0,.35)}50%{box-shadow:0 30px 75px rgba(34,211,238,.22)}}

@media(min-width:901px){
  .visual .object{animation-name:desktop-object-motion!important;animation-duration:5s!important;animation-timing-function:ease-in-out!important;animation-iteration-count:infinite!important;animation-play-state:running!important}
  .visual .orbit{animation-name:desktop-orbit-one!important;animation-duration:12s!important;animation-timing-function:linear!important;animation-iteration-count:infinite!important;animation-play-state:running!important}
  .visual .orbit.two{animation-name:desktop-orbit-two!important;animation-duration:8s!important}
  .browser-object .browser-screen{animation:browser-screen-pulse 2.8s ease-in-out infinite}
  .shop-object .shop-bag{animation:shop-bag-motion 3.6s ease-in-out infinite}
  .visual .calendar-object{animation:desktop-object-motion 5s ease-in-out infinite,calendar-motion 2.8s ease-in-out infinite!important}
  .seo-object .chart i{animation-play-state:running!important}
}
@media(max-width:900px){main{padding-top:72px}.detail-hero{width:min(100% - 32px,720px);min-height:auto;padding:70px 0 95px;grid-template-columns:1fr}.visual{width:min(84vw,460px)}.detail-content{width:min(100% - 32px,720px)}.intro-block{grid-template-columns:1fr;gap:25px}.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.detail-hero,.detail-content{width:calc(100% - 28px)}.detail-hero{padding-top:55px;gap:40px}.hero-copy h1{font-size:clamp(39px,12vw,58px);overflow-wrap:anywhere}.hero-copy>p{font-size:15px}.visual{width:min(92vw,370px)}.feature-grid{grid-template-columns:1fr}.steps{grid-template-columns:1fr}.intro-block{padding:60px 0}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important}}