/* Perspective scene: local CSS geometry, no external rendering dependency. */
body{background:#080d0b;background-image:radial-gradient(ellipse at 80% 4%,#23412a55,transparent 40%)}header{background:#0b100dd9}.hero{min-height:640px;grid-template-columns:1.1fr 1fr;gap:10px;padding-top:50px}.hero>div:first-child{position:relative;z-index:2}h1{font-size:clamp(38px,4.5vw,62px)}.art{height:500px;perspective:1100px;isolation:isolate;background:none;--rx:0deg;--ry:0deg}.art:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse,#89d73b25,transparent 62%);filter:blur(20px)}.scene3d{width:100%;height:100%;transform-style:preserve-3d;transform:rotateX(var(--rx)) rotateY(var(--ry));transition:transform .35s ease-out;position:relative}.sceneGrid{position:absolute;left:-15%;bottom:-40px;width:130%;height:270px;background-image:linear-gradient(#b3ef5622 1px,transparent 1px),linear-gradient(90deg,#b3ef5622 1px,transparent 1px);background-size:40px 40px;transform:rotateX(73deg) translateZ(-120px);mask-image:radial-gradient(ellipse,#000,transparent 65%)}.core{position:absolute;left:50%;top:50%;width:260px;height:320px;margin:-160px 0 0 -130px;transform-style:preserve-3d;animation:cardFloat 8s ease-in-out infinite}.cardBody{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateY(-24deg) rotateX(12deg) rotateZ(-9deg)}.face{position:absolute;inset:0;border-radius:21px;backface-visibility:hidden;border:1px solid #ddffc2;box-shadow:0 0 35px #b8e75b20}.front{transform:translateZ(9px);padding:25px;background:linear-gradient(120deg,#e5ffac,#adce65 65%,#759c40);color:#122207;overflow:hidden}.front:after{content:'';position:absolute;inset:-100%;background:linear-gradient(120deg,transparent 43%,#ffffff66 50%,transparent 57%);animation:cardShine 9s ease-in-out infinite;pointer-events:none}.front .cardTitle{font-size:37px;font-weight:800;line-height:1.15;position:relative;z-index:1;margin-top:35px;letter-spacing:-1.5px}.front .cardLabel{font-size:9px;letter-spacing:2px}.cardChip{display:block;width:37px;height:28px;border:1px solid #48622c;border-radius:6px;background:repeating-linear-gradient(90deg,#8aaf57 0 10px,#688942 10px 11px);margin-top:27px}.cardArrow{position:absolute;right:25px;bottom:40px;font-size:66px;font-weight:800}.cardBottom{position:absolute;bottom:23px;font-size:8px;letter-spacing:2px}.back{background:linear-gradient(150deg,#83a348,#354d21);transform:rotateY(180deg) translateZ(9px);display:grid;place-items:center;color:#dfffac;font-size:90px}.edge{position:absolute;background:#678a35;border:1px solid #a5c86d}.edge.left,.edge.right{width:18px;height:285px;top:18px}.edge.left{left:-9px;transform:rotateY(90deg)}.edge.right{right:-9px;transform:rotateY(90deg)}.edge.top,.edge.bottom{height:18px;width:222px;left:19px;transform:rotateX(90deg)}.edge.top{top:-9px}.edge.bottom{bottom:-9px}.sceneRing{position:absolute;left:50%;top:50%;border:2px solid #bef58177;border-radius:50%;width:430px;height:430px;margin:-215px 0 0 -215px;transform-style:preserve-3d;transform:rotateX(65deg) rotateY(-20deg);box-shadow:0 0 20px #a4e73c18,inset 0 0 12px #a4e73c18;animation:ringDrift 14s ease-in-out infinite}.sceneRing.second{width:380px;height:380px;margin:-190px 0 0 -190px;border-color:#7bb2ff44;transform:rotateX(-45deg) rotateY(35deg);animation:ringDrift2 18s ease-in-out infinite}.sceneRing:before{content:'';position:absolute;left:12%;top:12%;width:12px;height:12px;border-radius:50%;background:#d9ff8d;box-shadow:0 0 20px #c4ff66}.sphere{position:absolute;width:70px;height:70px;left:6%;top:12%;border-radius:50%;background:radial-gradient(circle at 30% 25%,#f4ffd7,#8eb543 35%,#25371b 74%);box-shadow:8px 14px 22px #0008,inset -3px -5px 10px #0007;transform:translateZ(80px);animation:bob 6s ease-in-out infinite}.sphere.smallSphere{width:38px;height:38px;left:auto;top:auto;right:7%;bottom:12%;background:radial-gradient(circle at 28% 25%,#d7eaff,#6f96bc 35%,#172c39 75%);animation-delay:-3s}.floatTag{position:absolute;display:flex;gap:12px;align-items:center;border:1px solid #b0e17844;background:linear-gradient(130deg,#283426e8,#152019cc);box-shadow:0 18px 30px #0008,inset 0 1px 0 #ffffff22;backdrop-filter:blur(10px);border-radius:13px;padding:14px 18px;transform:translateZ(110px) rotateZ(6deg);animation:tagBob 7s ease-in-out infinite}.floatTag.one{right:0;top:45px}.floatTag.two{left:-12px;bottom:60px;animation-delay:-3s}.floatTag .tagIcon{font-size:25px;color:#c9f58a}.floatTag small{display:block;font-size:8px;letter-spacing:1px;color:#a2b19b;margin-top:4px}.floatTag strong{font-size:12px}.sceneFoot{position:absolute;bottom:0;left:50%;transform:translateX(-50%);font-size:8px;letter-spacing:3px;color:#7e916f;white-space:nowrap}.product{background:linear-gradient(140deg,#20271c,#131913);box-shadow:0 15px 30px #0002;transition:transform .3s,border-color .3s,box-shadow .3s}.product:hover{transform:translateY(-8px);box-shadow:0 25px 50px #0006;border-color:#a3d86877}.cover{height:195px;perspective:700px}.cover>div,.cover>.symbol{position:relative;z-index:1;transform:rotateY(-12deg) rotateX(8deg) translateZ(20px);text-shadow:3px 5px 0 #0002,0 10px 20px #0005;transition:transform .4s}.product:hover .cover>div,.product:hover .symbol{transform:rotateY(0deg) translateZ(35px)}.cover:after{border-width:30px;box-shadow:inset 0 0 30px #fff1,0 0 30px #0002;transform:rotateX(25deg) rotateY(-30deg)}.cover:before{content:'';position:absolute;width:230px;height:230px;right:-60px;top:-130px;border:1px solid #ffffff26;border-radius:50%;transform:rotateX(30deg)}.primary{box-shadow:0 6px 0 #5e7c31,0 15px 35px #b4e66a15;transition:transform .2s,box-shadow .2s}.primary:hover{transform:translateY(-2px);box-shadow:0 8px 0 #5e7c31,0 20px 40px #b4e66a25}.primary:active{transform:translateY(4px);box-shadow:0 2px 0 #5e7c31}.how{box-shadow:0 25px 80px #0004}body:after{content:'';position:fixed;inset:0;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.5' filter='url(%23n)'/%3E%3C/svg%3E");z-index:20}
@keyframes cardFloat{0%,100%{transform:translateY(0) rotateY(-5deg)}50%{transform:translateY(-20px) rotateY(14deg)}}@keyframes cardShine{0%,30%{transform:translateX(-35%)}60%,100%{transform:translateX(35%)}}@keyframes ringDrift{0%,100%{transform:rotateX(65deg) rotateY(-20deg) rotateZ(0)}50%{transform:rotateX(72deg) rotateY(15deg) rotateZ(45deg)}}@keyframes ringDrift2{0%,100%{transform:rotateX(-45deg) rotateY(35deg)}50%{transform:rotateX(-60deg) rotateY(-15deg)}}@keyframes bob{0%,100%{transform:translateY(0) translateZ(80px)}50%{transform:translateY(-18px) translateZ(80px)}}@keyframes tagBob{0%,100%{transform:translateY(0) translateZ(110px) rotateZ(6deg)}50%{transform:translateY(-12px) translateZ(110px) rotateZ(3deg)}}
@media(max-width:850px){.hero{grid-template-columns:1fr;min-height:0;padding-top:25px}.art{height:440px;max-width:470px;margin-top:20px}.floatTag.two{left:0}.hero>div:first-child{max-width:620px}.sceneGrid{left:0;width:100%}}@media(max-width:520px){h1{font-size:40px}.art{height:380px;perspective:900px}.core{width:210px;height:270px;margin:-135px 0 0 -105px}.front{padding:20px}.front .cardTitle{font-size:31px;margin-top:24px}.cardChip{margin-top:22px}.edge.left,.edge.right{height:235px}.edge.top,.edge.bottom{width:172px}.cardArrow{font-size:55px;bottom:36px}.sceneRing{width:310px;height:310px;margin:-155px 0 0 -155px}.sceneRing.second{width:290px;height:290px;margin:-145px 0 0 -145px}.floatTag{padding:10px 12px;gap:8px}.floatTag.one{top:20px;right:0}.floatTag.two{bottom:30px}.floatTag strong{font-size:10px}.floatTag small{font-size:7px}.sphere{width:50px;height:50px;left:2%}.sphere.smallSphere{right:2%}.sceneFoot{bottom:-15px;font-size:7px}.cover{height:175px}}
@media(prefers-reduced-motion:reduce){.core,.sceneRing,.sphere,.floatTag,.front:after{animation:none}.scene3d,.product,.cover>div,.cover>.symbol,.primary{transition:none}.scene3d{transform:none}.product:hover,.primary:hover{transform:none}}