:root{color-scheme:dark;--bg:#10151d;--panel:#18212c;--ink:#f4f7fb;--muted:#a9b8c7;--line:#34404c;--aqua:#72ddc5;--blue:#7ac6fa;font-family:Inter,"Segoe UI",Arial,sans-serif;font-synthesis:none}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;background:var(--bg);color:var(--ink);line-height:1.5}
button,a{font:inherit}
button{color:inherit;cursor:pointer}
a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible{outline:3px solid var(--aqua);outline-offset:5px}
img{display:block;max-width:100%}
svg{display:block}
[hidden]{display:none!important}
.shell{width:min(1264px,calc(100% - clamp(40px,9vw,144px)));margin-inline:auto}
.skip{position:absolute;z-index:9;left:10px;top:-60px;padding:10px 16px;background:white;color:black}
.skip:focus{top:8px}
.header{height:80px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid #ffffff19}
.brand{display:inline-flex;align-items:center;gap:11px;font-size:24px;font-weight:700;letter-spacing:-1.2px}
.brand img{width:36px;height:36px;border-radius:11px}
.header nav,.footer nav{display:flex;align-items:center;gap:28px}
.header nav a{font-size:14px;color:var(--muted)}
.header nav a:hover,.footer nav a:hover,.credits a:hover{color:var(--aqua)}
.header nav .nav-download{border:1px solid #536170;border-radius:24px;padding:8px 17px;color:var(--ink)}
.nav-download span{margin-left:5px;color:var(--aqua)}
.hero{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);align-items:center;gap:5%;padding-block:64px 66px}
h1,h2,h3,p,figure{margin:0}
h1{font-size:clamp(45px,4.9vw,76px);font-weight:650;line-height:1.02;letter-spacing:-.067em}
h1 em{font-style:normal;background:linear-gradient(110deg,var(--blue),var(--aqua));background-clip:text;color:transparent}
.hero-copy>p{margin-block:24px 30px;font-size:clamp(15px,1.15vw,18px);max-width:38ch;color:var(--muted)}
.store-row{display:flex;align-items:stretch;gap:8px;flex-wrap:wrap}
.store{display:inline-flex;align-items:center;gap:8px;min-height:45px;padding:10px 13px;border:1px solid #475463;border-radius:12px;font-size:14px;font-weight:600;white-space:nowrap}
.store:hover,.gallery-tabs button:hover{background:#293440}
.store.primary{background:var(--ink);color:#151d26;border-color:var(--ink)}
.store.primary:hover{background:#d3f1ea}
.store svg{width:17px;height:19px}
.hero-art{position:relative;isolation:isolate;overflow:hidden;min-width:0;aspect-ratio:1.6;background:radial-gradient(ellipse at 89% 7%,#8de0c9 0,transparent 54%),linear-gradient(125deg,#6389c0,#8ebad8 49%,#468b9b);border-radius:24px}
.hero-art::before,.hero-art::after{content:"";position:absolute;pointer-events:none;z-index:-1;inset:-33% -15% 26% 18%;border:1px solid #ecfffc65;border-radius:48%;transform:rotate(-27deg)}
.hero-art::after{inset:25% -34% -50% -15%;border-width:15px;border-color:#ffffff14;transform:rotate(-27deg)}
.hero-device{position:absolute;box-shadow:0 17px 34px #12233a43;overflow:hidden;margin:0}
.hero-device img{width:100%;height:auto}
.hero-device.desktop{width:87%;left:5%;top:10%;border-radius:9px;border:4px solid #26343e;background:#26343e}
.hero-device.phone{width:25.6%;right:4%;bottom:5%;border:4px solid #172029;border-radius:clamp(13px,1.7vw,28px);background:#172029}
.section{padding-block:49px 55px;border-top:1px solid #ffffff1d}
.head-row{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:25px}
h2{font-weight:620;font-size:clamp(31px,3.3vw,51px);line-height:1.09;letter-spacing:-.052em}
.gallery-tabs{display:flex;align-items:center;gap:3px;border:1px solid var(--line);padding:4px;border-radius:28px}
.gallery-tabs button{border:0;background:transparent;border-radius:22px;padding:7px 15px;color:var(--muted);font-size:14px;font-weight:550}
.gallery-tabs [aria-selected=true]{background:var(--ink);color:#14202a}
.gallery-tabs [aria-selected=true]:hover{background:#e1eff3}
.gallery-grid{display:grid;gap:16px}
.gallery-grid.mobile-shots{grid-template-columns:repeat(auto-fit,minmax(min(100%,195px),1fr))}
.gallery-grid.desktop-shots{grid-template-columns:repeat(3,minmax(0,1fr))}
.shot{min-width:0}
.shot button{display:block;position:relative;border:1px solid #ffffff18;background:#202d38;border-radius:18px;overflow:hidden;width:100%;padding:0}
.shot button:hover,.shot button:focus-visible{border-color:#9addd5}
.mobile-shots .shot button{height:clamp(230px,24vw,350px);display:flex;justify-content:center;align-items:flex-start;padding:22px 8px 0}
.mobile-shots .shot:nth-child(3n + 1) button{background:linear-gradient(138deg,#33485e,#243442)}
.mobile-shots .shot:nth-child(3n + 2) button{background:linear-gradient(138deg,#304d4b,#23363a)}
.mobile-shots .shot:nth-child(3n + 3) button{background:linear-gradient(138deg,#45445d,#2a3040)}
.mobile-shots .shot img{width:auto;height:117%;max-width:86%;object-fit:contain;object-position:top;border-radius:10px 10px 0 0}
.desktop-shots .shot button{aspect-ratio:1.54;display:grid;align-items:center;padding:10px;background:linear-gradient(135deg,#628591,#385063)}
.desktop-shots .shot img{width:100%;border-radius:5px}
.shot .expand{position:absolute;right:8px;bottom:8px;border-radius:50%;background:#13202dd9;color:white;display:grid;place-items:center;width:31px;height:31px;font-size:17px;line-height:1}
.shot figcaption{font-size:16px;font-weight:570;padding:11px 2px 0}
.features{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.feature{padding:clamp(19px,2.3vw,30px);border:1px solid var(--line);background:var(--panel);border-radius:17px}
.feature h3{font-size:22px;line-height:1.2;letter-spacing:-.035em;margin:13px 0 6px}
.feature p,.download-info,.credits,.footer{color:var(--muted)}
.feature p{max-width:49ch;font-size:15px}
.ico{width:25px;height:25px;color:var(--aqua)}
.download-row{display:flex;justify-content:space-between;align-items:center;gap:24px}
.download-info{font-size:14px;margin-top:9px}
.credits{font-size:12px;margin-top:27px;max-width:88ch}
.credits a,.footer a:not(.brand){text-decoration:underline;text-underline-offset:3px}
.footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px 0 34px;font-size:13px}
.footer .brand{font-size:18px;color:var(--ink)}
.footer .brand img{width:25px;height:25px}
.footer nav{gap:18px;flex-wrap:wrap}
.viewer{max-width:calc(100vw - 24px);max-height:96dvh;border:1px solid #667585;border-radius:15px;padding:12px;background:#121b25;color:white}
.viewer::backdrop{background:#05090ee6}
.viewer img{max-height:calc(93dvh - 68px);max-width:100%;width:auto;object-fit:contain;margin:auto}
.viewer-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 0 9px 4px}
.viewer-bar button{padding:5px 12px;border:1px solid #536170;background:transparent;border-radius:18px;font-size:13px}
@media(max-width:970px){.hero{gap:4%;grid-template-columns:1fr 1.08fr}.store{padding:9px 10px;font-size:13px}.hero{padding-block:50px}.shell{width:calc(100% - 52px)}.header nav,.footer nav{gap:15px}.hero-art{aspect-ratio:1.26}.hero-device.desktop{top:18%}.hero-device.phone{width:29%}.gallery-grid.mobile-shots{grid-template-columns:repeat(4,minmax(0,1fr))}.gallery-grid.mobile-shots:has(figure:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.shell{width:calc(100% - 36px)}.header{height:62px}.brand{font-size:21px}.brand img{width:30px;height:30px}.header nav a:not(.nav-download){display:none}.header nav .nav-download{padding:6px 13px}.hero{grid-template-columns:1fr;gap:28px;padding:35px 0}.hero-copy>p{margin:16px 0 19px}.hero-art{aspect-ratio:1.62}.hero-device.desktop{top:10%}.hero-device.phone{width:25.6%;border-width:3px}.head-row,.download-row{align-items:flex-start;flex-direction:column}.section{padding-block:32px}.head-row{margin-bottom:18px;gap:15px}.gallery-grid.mobile-shots,.gallery-grid.mobile-shots:has(figure:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}.gallery-grid.desktop-shots{grid-template-columns:1fr}.mobile-shots .shot button{height:clamp(175px,52vw,285px);padding-top:14px}.gallery-grid{gap:14px 10px}.shot figcaption{font-size:14px;padding-top:6px}.features{grid-template-columns:1fr}.footer{align-items:flex-start;flex-direction:column}.credits{margin-top:17px}.footer nav{gap:8px 15px}.download-row{gap:16px}.store-row{gap:6px}.hero-device.desktop{border-width:3px}}
@media(max-width:370px){h1{font-size:40px}.store{gap:5px;padding:8px;font-size:12px}.store svg{width:14px}.hero-art{border-radius:16px}.gallery-tabs button{padding:6px 13px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}