:root { --ink:#12334c; --muted:#56788d; --blue:#117da7; --line:rgba(22,113,151,.15); --max:1140px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; overflow-x:hidden; color:var(--ink); background:#f8fdff; font-family:Manrope,Arial,sans-serif; }
.sky { position:fixed; inset:0; z-index:-2; overflow:hidden; background:linear-gradient(155deg,#eefaff,#fbfeff 48%,#edf9fa); }
.sky i { position:absolute; display:block; border-radius:50%; opacity:.52; }
.sky i:first-child { width:580px; height:580px; top:-270px; right:-150px; background:#b8eaf5; }
.sky i:nth-child(2) { width:500px; height:500px; bottom:2%; left:-290px; background:#d7f2ed; }
.sky i:nth-child(3) { width:16px; height:16px; top:30%; left:10%; background:#9bdce9; box-shadow:270px 160px 0 6px #d5f0ed,720px 38px 0 2px #c8ecf5; }
.nav { height:82px; max-width:var(--max); padding:0 28px; margin:auto; display:flex; align-items:center; justify-content:space-between; }
.brand { display:flex; align-items:center; gap:11px; color:var(--ink); font-weight:800; letter-spacing:-.035em; text-decoration:none; }
.brand img { border-radius:13px; box-shadow:0 7px 16px rgba(14,105,146,.18); }
.nav-download { padding:10px 17px; border:1px solid var(--line); border-radius:999px; color:var(--blue); background:rgba(255,255,255,.65); font-size:.84rem; font-weight:800; text-decoration:none; }
.hero { max-width:var(--max); min-height:660px; margin:auto; padding:82px 28px 106px; display:grid; grid-template-columns:1fr .92fr; gap:34px; align-items:center; }
.eyebrow { display:flex; align-items:center; gap:9px; margin:0 0 17px; color:#3384a5; font-size:.74rem; font-weight:800; letter-spacing:.11em; text-transform:uppercase; }
.eyebrow span { width:25px; height:1px; background:currentColor; } h1,h2,h3,p { margin-top:0; }
h1 { margin-bottom:25px; font-size:clamp(3.45rem,6.1vw,5.7rem); font-weight:800; line-height:.98; letter-spacing:-.075em; }
h1 em { color:#1688ae; font-style:normal; }.intro { max-width:470px; margin-bottom:31px; color:var(--muted); font-size:1.06rem; line-height:1.7; }
.download-panel { max-width:430px; padding:13px; border:1px solid rgba(255,255,255,.95); border-radius:21px; background:rgba(255,255,255,.78); box-shadow:0 16px 40px rgba(37,114,144,.1); }
.device-note { margin:0 4px 11px; color:#5a8094; font-size:.75rem; font-weight:700; }.store-grid { display:grid; grid-template-columns:1fr; gap:9px; }
.store-badge { display:flex; align-items:center; gap:12px; min-height:64px; padding:10px 15px; border-radius:14px; position:relative; text-decoration:none; transition:transform .2s,box-shadow .2s; }.store-badge[hidden] { display:none; }.store-badge:hover { transform:translateY(-2px); }
.apple-badge { color:#fff; background:linear-gradient(135deg,#0a84ff,#5856d6); box-shadow:0 7px 17px rgba(32,103,215,.22); }.play-badge { color:#123d54; background:#fff; border:1px solid #d7eaf0; box-shadow:0 7px 17px rgba(33,104,132,.09); }.alternative-store { display:block; width:max-content; max-width:100%; margin:11px auto 1px; color:#47778d; font-size:.72rem; font-weight:700; text-decoration:underline; text-underline-offset:3px; }
.apple-logo,.play-logo { width:29px; height:29px; flex:0 0 29px; }.store-badge span { display:grid; gap:1px; }.store-badge small { font-size:.58rem; font-weight:800; letter-spacing:.07em; text-transform:uppercase; opacity:.72; }.store-badge strong { font-size:.91rem; letter-spacing:-.03em; }
.hero-art { height:510px; position:relative; display:grid; place-items:center; }.halo { width:410px; height:410px; position:absolute; border-radius:50%; background:linear-gradient(145deg,#c6f0f6,#e8fbf8); box-shadow:inset 0 0 0 1px rgba(255,255,255,.8); }
.phone { width:247px; height:490px; padding:8px; position:relative; z-index:1; overflow:hidden; border:6px solid #12354b; border-radius:37px; background:#12354b; box-shadow:0 30px 45px rgba(19,72,93,.25); transform:rotate(3deg); }.phone-speaker { width:76px; height:19px; position:absolute; z-index:2; top:0; left:50%; border-radius:0 0 12px 12px; background:#12354b; transform:translateX(-50%); }.phone img { width:100%; height:100%; object-fit:cover; border-radius:26px; }
.float-card { position:absolute; z-index:2; padding:12px 15px; border:1px solid rgba(255,255,255,.9); border-radius:16px; color:#39728a; background:rgba(255,255,255,.83); box-shadow:0 12px 28px rgba(37,114,144,.13); }.float-card span { display:block; margin-bottom:3px; font-size:.65rem; font-weight:700; }.float-card strong { font-size:.77rem; color:#174964; }.card-progress { bottom:16%; left:1%; }.card-progress i { position:absolute; top:14px; right:13px; color:#50c9b4; font-size:13px; font-style:normal; }.card-wave { top:16%; right:-1%; }.card-wave b { color:#54b6cb; font-size:22px; line-height:12px; }
.calm-section { max-width:var(--max); margin:auto; padding:82px 28px 103px; }.section-heading h2,.closing h2 { margin-bottom:0; font-size:clamp(2rem,3.4vw,3.35rem); line-height:1.04; letter-spacing:-.06em; }.benefits { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:41px; }.benefits article { min-height:175px; padding:26px; border:1px solid rgba(255,255,255,.95); border-radius:21px; background:rgba(255,255,255,.63); }.benefit-icon { margin-bottom:26px; color:#1688ae; font-size:.7rem; font-weight:800; }.benefits h3 { margin-bottom:8px; font-size:1.07rem; letter-spacing:-.04em; }.benefits p { margin-bottom:0; color:var(--muted); font-size:.88rem; }
.screens { overflow:hidden; padding:96px 28px 82px; border-top:1px solid rgba(255,255,255,.8); background:linear-gradient(180deg,rgba(212,242,247,.42),rgba(255,255,255,.74)); }.screen-heading { max-width:var(--max); margin:auto; }.screen-row { height:440px; max-width:1000px; margin:42px auto 0; display:flex; align-items:end; justify-content:center; gap:40px; }.screen-card { width:174px; height:340px; flex:0 0 auto; margin:0; overflow:hidden; border:5px solid #194055; border-radius:27px; background:#194055; box-shadow:0 20px 34px rgba(36,92,113,.16); }.screen-card img { width:100%; height:100%; object-fit:cover; border-radius:20px; }.active-screen { width:211px; height:416px; z-index:2; box-shadow:0 25px 47px rgba(28,97,122,.26); }.tilt-left { transform:rotate(-8deg) translateY(17px); }.tilt-right { transform:rotate(8deg) translateY(17px); }
.closing { max-width:var(--max); margin:76px auto; padding:57px 58px; display:flex; align-items:center; justify-content:space-between; border-radius:32px; color:#fff; background:linear-gradient(135deg,#0b5e89,#148ca8); box-shadow:0 25px 52px rgba(15,105,142,.22); }.closing .eyebrow { color:#c1edf5; }.round-download { min-height:52px; padding:0 20px; display:inline-flex; align-items:center; justify-content:center; gap:9px; flex:0 0 auto; border-radius:999px; color:#107ca0; background:#fff; font-size:.9rem; font-weight:800; text-decoration:none; }.round-download span { font-size:1.25rem; font-weight:400; }footer { max-width:var(--max); margin:auto; padding:0 28px 35px; display:flex; justify-content:space-between; color:#6f909e; font-size:.74rem; }footer div { display:flex; gap:20px; }footer a { color:inherit; text-decoration:none; }
@media (max-width:760px) { .nav { height:70px; padding:0 20px; }.brand img { width:37px; height:37px; }.nav-download { padding:8px 14px; }.hero { min-height:0; padding:40px 20px 48px; grid-template-columns:1fr; gap:24px; }.hero-copy { order:0; }h1 { margin-bottom:19px; font-size:clamp(3rem,14vw,4.15rem); }.intro { max-width:35ch; margin-bottom:22px; font-size:.95rem; }.download-panel { max-width:none; padding:11px; }.store-badge { min-height:61px; padding:9px 13px; }.hero-art { height:310px; order:1; }.halo { width:270px; height:270px; }.phone { width:156px; height:309px; padding:5px; border-width:5px; border-radius:28px; transform:rotate(2deg); }.phone img { border-radius:18px; }.phone-speaker { width:55px; height:14px; }.float-card { padding:8px 9px; }.card-progress { bottom:4%; left:5px; }.card-wave { top:4%; right:5px; }.card-wave span,.card-progress span { font-size:.56rem; }.calm-section { padding:62px 20px 74px; }.benefits { grid-template-columns:1fr; gap:10px; margin-top:29px; }.benefits article { min-height:0; padding:19px 20px; display:grid; grid-template-columns:50px 1fr; column-gap:4px; align-items:center; }.benefit-icon { grid-row:span 2; margin:0; }.benefits h3 { margin:0; }.benefits p { font-size:.8rem; }.screens { padding:69px 0 49px; }.screen-heading { padding:0 20px; }.screen-row { width:100%; height:326px; gap:0; margin-top:30px; }.screen-card { width:124px; height:246px; border-width:4px; border-radius:21px; }.active-screen { width:162px; height:320px; }.tilt-left { transform:rotate(-7deg) translate(15px,10px); }.tilt-right { transform:rotate(7deg) translate(-15px,10px); }.closing { margin:42px 20px; padding:35px 27px; border-radius:25px; }.closing h2 { font-size:2.2rem; }.round-download { width:48px; height:48px; font-size:1.5rem; }footer { padding:0 20px 25px; font-size:.68rem; }footer div { gap:13px; } }
@media (max-width:375px) { .screen-card { width:117px; }.active-screen { width:150px; }.closing { padding:29px 23px; }.closing h2 { font-size:2rem; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }

@media (max-width:760px) { .round-download { width:auto; height:auto; min-height:46px; padding:0 15px; font-size:.8rem; } }