/* Real app screenshots, displayed without alteration. */
.hero{grid-template-columns:1.1fr 1fr;min-height:760px;padding-block:58px}.hero h1{font-size:clamp(48px,5.4vw,76px);letter-spacing:-3px}.app-hero-art{height:630px;display:flex;align-items:center;justify-content:center;padding:20px;isolation:isolate}.hero-orbit{position:absolute;width:490px;height:490px;border:1px solid #65b8ff1e;border-radius:50%;background:radial-gradient(ellipse,#106ce53b,transparent 65%);z-index:-2}.phone-device{padding:7px;border-radius:27px;background:linear-gradient(125deg,#607287,#182134 30%,#304660 70%,#131d2c);border:1px solid #6f83975c;width:250px;box-shadow:0 25px 60px #0005;position:relative;margin-inline:auto;overflow:hidden}.app-screenshot{width:100%;height:auto;display:block;border-radius:20px}.hero-phone{transform:rotate(-7deg);margin:0 88px 0 0;width:260px;z-index:2}.hero-back-phone{position:absolute;right:0;top:50px;width:240px;transform:rotate(10deg);z-index:1;filter:brightness(.8)}.app-hero-art .floating-note{bottom:15px;right:0;width:278px;z-index:6}.app-hero-art .note-icon{font-size:25px}.real-gallery{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.app-preview{padding:18px 10px 0;border:1px solid #ffffff13;border-radius:15px;background:radial-gradient(ellipse at 50% 40%,#14365666,transparent 70%),#0c1421;min-width:0}.app-preview .phone-device{max-width:100%;width:240px;padding:5px;border-radius:23px}.app-preview .app-screenshot{border-radius:17px}.app-preview .preview-caption{margin:20px 0;padding:0 2px;font-size:10px;align-items:center;gap:5px}.app-preview .preview-caption b{margin-right:6px}.app-preview:hover .phone-device{transform:translateY(-5px);transition:transform .25s}.app-preview .phone-device:after{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 1px #ffffff15;border-radius:inherit}dialog:has(.app-screenshot){width:min(520px,calc(100% - 32px))}dialog .app-screenshot{width:100%;max-width:350px;margin:25px auto 0;border-radius:13px;height:auto}
@media(max-width:1100px){.hero h1{font-size:57px}.hero-phone{width:240px;margin-right:65px}.hero-back-phone{width:220px;right:-5px;top:65px}.app-hero-art{height:580px}.hero{min-height:710px}.real-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px}.app-preview .phone-device{width:265px}.app-preview .preview-caption{font-size:12px}.app-preview{padding:24px 20px 0}}
@media(max-width:800px){.hero{min-height:640px;gap:12px}.hero h1{font-size:43px;letter-spacing:-2px}.app-hero-art{height:510px;padding:15px 0}.hero-phone{width:205px;margin-right:45px}.hero-back-phone{width:190px;right:-8px;top:75px}.app-hero-art .floating-note{width:240px;bottom:3px;right:-5px}.app-preview:last-child{grid-column:auto;max-width:none;margin:0}.hero-orbit{width:370px;height:370px}.real-gallery{gap:18px}.app-preview{padding:20px 15px 0}}
@media(max-width:580px){.hero{grid-template-columns:1fr;padding-top:40px;padding-bottom:45px}.hero h1{font-size:58px;letter-spacing:-2.7px}.hero-actions .button{white-space:nowrap;font-size:11px}.hero-actions .text-button{font-size:10px}.hero-actions{gap:14px}.app-hero-art{width:100%;height:590px;margin:15px auto 0}.hero-phone{width:240px;margin-right:65px}.hero-back-phone{right:0;top:55px;width:218px}.app-hero-art .floating-note{right:0;bottom:12px;width:258px}.app-preview{max-width:350px;width:100%;padding:24px 15px 0}.app-preview:last-child{max-width:350px;margin:auto}.app-preview .phone-device{width:275px}.hero-orbit{width:335px;height:335px}.hero-meta strong{font-size:10px}.real-gallery{grid-template-columns:1fr;gap:24px}.app-preview .preview-caption{font-size:12px}}
@media(prefers-reduced-motion:reduce){.app-preview:hover .phone-device{transform:none}}
