@import "tailwindcss";

:root {
  --ink: #19182c;
  --muted: #69687b;
  --indigo: #5b5bd6;
  --indigo-dark: #4545bd;
  --mint: #78d7ba;
  --orange: #eea05a;
  --ivory: #faf9f5;
  --line: rgba(31, 30, 58, .1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--ivory); font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "PingFang SC", "Microsoft YaHei", sans-serif; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
main { overflow: hidden; }

.nav { height: 76px; width: min(1180px, calc(100% - 48px)); margin: 0 auto; display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 20; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 760; letter-spacing: -.03em; }
.brand img { border-radius: 9px; box-shadow: 0 5px 13px rgba(45, 42, 125, .13); }
.navLinks { display: flex; gap: 34px; font-size: 14px; color: #555467; }
.navLinks a { transition: color .2s; }
.navLinks a:hover { color: var(--indigo); }
.navActions { display: flex; align-items: center; gap: 12px; }
.languageSwitch { display: inline-flex; align-items: center; padding: 3px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.7); font-size: 11px; font-weight: 700; color: #777586; }
.languageSwitch a, .languageSwitch span { min-width: 29px; padding: 6px 7px; border-radius: 7px; text-align: center; }
.languageSwitch [aria-current="page"] { color: white; background: var(--indigo); box-shadow: 0 4px 10px rgba(91,91,214,.2); }
.languageSwitch a:hover { color: var(--indigo); }
.navDownload { padding: 10px 15px; border-radius: 12px; color: white; background: var(--ink); font-size: 13px; font-weight: 650; display: flex; gap: 8px; align-items: center; box-shadow: 0 8px 24px rgba(25,24,44,.14); }

.hero { min-height: 760px; width: min(1260px, calc(100% - 36px)); margin: 0 auto; padding: 100px 50px 80px; position: relative; display: grid; grid-template-columns: .86fr 1.14fr; align-items: center; }
.heroGlow { position: absolute; border-radius: 50%; filter: blur(2px); pointer-events: none; }
.heroGlowOne { width: 620px; height: 620px; right: -140px; top: -120px; background: radial-gradient(circle, rgba(105,104,234,.17), rgba(105,104,234,0) 69%); }
.heroGlowTwo { width: 500px; height: 500px; right: 240px; bottom: -130px; background: radial-gradient(circle, rgba(113,222,184,.17), rgba(113,222,184,0) 70%); }
.heroCopy { position: relative; z-index: 2; padding-left: 10px; }
.eyebrow { display: inline-flex; gap: 10px; align-items: center; color: #5c5a70; font-size: 13px; font-weight: 650; letter-spacing: .08em; }
.eyebrow > span, .eyebrow > i { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 0 5px rgba(120,215,186,.18); }
.hero h1 { margin: 25px 0 24px; font-size: clamp(56px, 5vw, 80px); line-height: 1.05; letter-spacing: -.065em; font-weight: 780; }
html[lang="en"] .hero h1 { font-size: clamp(50px, 4.4vw, 70px); letter-spacing: -.055em; }
.hero h1 em { color: var(--indigo); font-style: normal; }
.heroLead { color: var(--muted); font-size: 17px; line-height: 1.85; margin: 0 0 34px; }
.heroActions { display: flex; align-items: center; gap: 24px; }
.primaryButton { min-height: 56px; padding: 0 18px; color: white; background: var(--indigo); border-radius: 16px; display: inline-flex; align-items: center; gap: 11px; font-size: 14px; font-weight: 700; box-shadow: 0 16px 30px rgba(69,69,189,.23); transition: transform .2s, box-shadow .2s; }
.primaryButton:hover { transform: translateY(-2px); box-shadow: 0 20px 36px rgba(69,69,189,.28); }
.primaryButton > :last-child { margin-left: 5px; font-size: 17px; }
.apple { font-size: 10px; border: 1.5px solid currentColor; border-radius: 50%; width: 17px; height: 17px; display: grid; place-content: center; color: transparent; }
.textButton { font-size: 14px; font-weight: 650; }
.textButton span { margin-left: 6px; color: var(--indigo); }
.compatibility { display: flex; align-items: center; gap: 10px; margin-top: 25px; color: #858394; font-size: 11px; }
.compatibility span { color: var(--indigo); background: #edecfb; padding: 4px 8px; border-radius: 99px; font-weight: 700; }
.compatibility i { width: 3px; height: 3px; border-radius: 50%; background: #bbb9c5; }

.heroVisual { position: relative; z-index: 2; height: 570px; display: flex; align-items: center; justify-content: center; perspective: 1400px; }
.heroScreenshot { width: 690px; border-radius: 23px; padding: 7px; background: rgba(255,255,255,.76); border: 1px solid rgba(255,255,255,.92); box-shadow: 0 38px 78px rgba(45,43,87,.20), 0 5px 18px rgba(45,43,87,.10); backdrop-filter: blur(18px); transform: rotateY(-4deg) rotateX(2deg); overflow: hidden; }
.heroScreenshot img { display: block; width: 100%; height: auto; border-radius: 17px; }
.realBadge { position: absolute; z-index: 5; padding: 10px 14px; border-radius: 999px; background: rgba(255,255,255,.9); border: 1px solid rgba(255,255,255,.95); box-shadow: 0 12px 30px rgba(42,39,78,.13); backdrop-filter: blur(12px); font-size: 10px; font-weight: 700; color: #58566a; }
.realBadge span { display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; background: #45ca78; box-shadow: 0 0 0 4px rgba(69,202,120,.15); }.realBadge b { margin-left: 7px; color: var(--indigo); }
.badgeTop { right: 0; top: 45px; }.badgeBottom { left: 15px; bottom: 45px; }
.appWindow { width: 670px; height: 440px; border: 1px solid rgba(255,255,255,.9); border-radius: 22px; background: rgba(251,251,253,.87); box-shadow: 0 36px 80px rgba(45,43,87,.18), 0 4px 18px rgba(45,43,87,.09); backdrop-filter: blur(18px); transform: rotateY(-4deg) rotateX(2deg); overflow: hidden; }
.windowBar { height: 54px; display: flex; align-items: center; justify-content: space-between; padding: 0 18px; border-bottom: 1px solid rgba(52,49,100,.07); background: rgba(255,255,255,.5); }
.traffic { display: flex; gap: 7px; }
.traffic span { width: 10px; height: 10px; border-radius: 50%; background: #ff6b62; }
.traffic span:nth-child(2) { background: #ffc24b; }.traffic span:nth-child(3) { background: #45ca64; }
.segmented { display: flex; gap: 4px; font-size: 10px; padding: 4px; border-radius: 9px; background: rgba(231,230,240,.66); color: #7a788a; }
.segmented span, .segmented b { padding: 5px 14px; border-radius: 6px; font-weight: 550; }
.segmented b { color: var(--ink); background: white; box-shadow: 0 2px 7px rgba(29,28,55,.09); }
.coffee { color: var(--orange); font-size: 13px; }
.windowBody { height: calc(100% - 54px); display: grid; grid-template-columns: 42% 58%; align-items: center; padding: 28px 34px; background: linear-gradient(135deg, rgba(92,91,214,.06), rgba(120,215,186,.08) 52%, rgba(255,255,255,.55)); }
.appIntro { padding-left: 8px; }
.appLabel { color: var(--indigo); font-size: 10px; letter-spacing: .08em; font-weight: 780; }.appLabel span { margin-right: 5px; }
.appIntro h2 { margin: 18px 0 10px; font-size: 35px; line-height: 1.08; letter-spacing: -.055em; }
.appIntro > p { color: #8a8898; font-size: 11px; }
.miniStats { display: flex; gap: 24px; margin-top: 35px; }
.miniStats div { display: flex; flex-direction: column; gap: 5px; }.miniStats b { font-size: 18px; }.miniStats span { color: #9593a1; font-size: 9px; }
.timerCard { height: 310px; border-radius: 23px; background: rgba(255,255,255,.86); box-shadow: 0 16px 38px rgba(60,56,112,.11); border: 1px solid rgba(255,255,255,.95); display: flex; flex-direction: column; align-items: center; padding: 27px 25px; }
.timerCard .sun { color: var(--indigo); font-size: 22px; line-height: 1; }.timerCard > small { margin-top: 6px; color: #8c899b; font-size: 9px; font-weight: 700; letter-spacing: .1em; }
.timer { margin: 15px 0 18px; font-size: 58px; letter-spacing: -.06em; font-variant-numeric: tabular-nums; }
.timerCard button { width: 180px; height: 38px; border: 0; border-radius: 10px; color: white; background: var(--indigo); font-weight: 700; font-size: 11px; box-shadow: 0 8px 18px rgba(91,91,214,.24); }
.timerCard button span { margin-right: 7px; font-size: 9px; }
.durationRow { width: 100%; margin-top: 24px; padding-top: 15px; border-top: 1px solid #eeeef2; display: flex; justify-content: space-between; font-size: 8px; color: #9492a0; }
.durationRow span { display: flex; flex-direction: column; gap: 3px; }.durationRow b { color: #555365; font-size: 9px; }
.floatingNote { position: absolute; z-index: 5; display: flex; gap: 11px; align-items: center; padding: 13px 16px; border-radius: 14px; background: rgba(255,255,255,.9); box-shadow: 0 14px 35px rgba(40,38,75,.14); border: 1px solid rgba(255,255,255,.9); backdrop-filter: blur(10px); }
.floatingNote b, .floatingNote small { display: block; }.floatingNote b { font-size: 11px; }.floatingNote small { font-size: 8px; color: #9a97a5; margin-top: 3px; }
.noteIcon { width: 30px; height: 30px; border-radius: 9px; display: grid; place-content: center; font-size: 13px; }.noteIcon.mint { background: #e4f7f0; color: #2d9b79; }.noteIcon.orange { background: #fff0e2; color: #d67b2d; }
.noteTop { right: -10px; top: 30px; animation: float 5s ease-in-out infinite; }.noteBottom { left: 4px; bottom: 35px; animation: float 5s ease-in-out 1s infinite; }
@keyframes float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }

.promise { text-align: center; padding: 120px 24px 110px; background: white; }
.promise p { color: var(--indigo); font-size: 12px; font-weight: 700; letter-spacing: .12em; }
.promise h2 { font-family: "Songti SC", "STSong", serif; font-weight: 540; font-size: clamp(38px, 4.4vw, 62px); line-height: 1.32; letter-spacing: -.045em; margin: 22px auto 42px; }
.promiseRule { width: 54px; height: 3px; margin: auto; background: linear-gradient(90deg, var(--indigo) 0 47%, transparent 47% 55%, var(--mint) 55%); border-radius: 5px; }

.features { background: white; padding: 0 24px 130px; }
.feature { max-width: 1120px; min-height: 570px; margin: 0 auto 28px; border-radius: 28px; display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; position: relative; }
.featureCopy { padding: 78px 70px; position: relative; }.number { position: absolute; right: 32px; top: 30px; font-size: 11px; color: #aaa8b4; font-weight: 700; }
.featureIcon { width: 42px; height: 42px; border-radius: 12px; display: grid; place-content: center; margin-bottom: 27px; font-weight: 800; }.featureIcon.orange { color: #d37829; background: #fff0e4; }.featureIcon.indigo { color: var(--indigo); background: #ecebfc; }.featureIcon.mint { color: #188967; background: #e1f6ee; }
.featureCopy h3 { font-size: clamp(32px, 3vw, 44px); line-height: 1.18; letter-spacing: -.055em; margin: 0 0 22px; }
.featureCopy > p { color: var(--muted); line-height: 1.8; font-size: 14px; max-width: 410px; }
.featureCopy ul { list-style: none; padding: 0; margin: 27px 0 0; display: grid; gap: 10px; font-size: 12px; color: #514f60; }.featureCopy li span { color: var(--indigo); margin-right: 8px; }
.featureBreak { background: #f7f4f0; }.featureStats { background: #f0f1fb; }.featureFlow { background: #edf7f3; }
.realShot { position: relative; align-self: center; overflow: hidden; border: 7px solid rgba(255,255,255,.75); box-shadow: 0 28px 58px rgba(42,37,76,.20); }
.realShot img { width: 100%; height: 100%; object-fit: cover; display: block; }.breakShot { height: 430px; margin: 55px 52px 55px 0; border-radius: 22px; background: #11101f; }.breakShot img { object-position: center; }.statsShot { height: 430px; margin: 55px 0 55px 52px; border-radius: 22px; background: white; }.statsShot img { object-position: top center; }
.shotLabel { position: absolute; left: 18px; bottom: 18px; padding: 9px 12px; border-radius: 999px; color: #454354; background: rgba(255,255,255,.9); backdrop-filter: blur(10px); box-shadow: 0 8px 20px rgba(26,25,50,.15); font-size: 9px; font-weight: 700; }.shotLabel i { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #45ca78; margin-right: 6px; }
.screenshotStack { min-height: 455px; margin: 55px 55px 55px 0; position: relative; }.screenshotStack img { width: 100%; height: 100%; object-fit: cover; display: block; }.stackBack, .stackFront { position: absolute; overflow: hidden; border: 6px solid rgba(255,255,255,.88); border-radius: 18px; box-shadow: 0 24px 48px rgba(41,70,61,.18); }.stackBack { width: 80%; height: 64%; right: 0; top: 10px; transform: rotate(3deg); background: white; }.stackFront { width: 86%; height: 68%; left: 0; bottom: 5px; transform: rotate(-2deg); background: #12111e; }.stackBack img { object-position: top center; }.stackFront img { object-position: center; transform: scale(1.34); }.stackBack span, .stackFront span { position: absolute; z-index: 2; left: 14px; top: 14px; padding: 8px 11px; border-radius: 999px; background: rgba(255,255,255,.9); color: #454354; box-shadow: 0 8px 18px rgba(26,25,50,.14); backdrop-filter: blur(10px); font-size: 9px; font-weight: 700; }.flowArrow { position: absolute; z-index: 3; right: 20px; bottom: 18px; padding: 9px 12px; color: white; background: #25233b; border-radius: 999px; font-size: 9px; font-weight: 700; box-shadow: 0 10px 24px rgba(30,28,54,.2); }
.breakMock { margin: 54px 55px 54px 0; border-radius: 22px; background: radial-gradient(circle at 50% 35%, #423c70, #1e1c35 68%); color: white; display: flex; flex-direction: column; align-items: center; justify-content: center; box-shadow: 0 30px 55px rgba(42,37,76,.25); position: relative; overflow: hidden; }
.breakMock::before { content: ""; position: absolute; width: 250px; height: 250px; border: 1px solid rgba(145,134,255,.14); border-radius: 50%; box-shadow: 0 0 0 70px rgba(120,215,186,.025), 0 0 0 140px rgba(145,134,255,.025); }
.breakMock > * { position: relative; z-index: 1; }.breakMock .lock { width: 36px; height: 36px; border-radius: 50%; display: grid; place-content: center; color: transparent; border: 1px solid rgba(255,255,255,.35); }.breakMock p { margin: 14px 0 6px; font-size: 12px; color: #cdc9df; }.breakMock > b { font-size: 64px; letter-spacing: -.055em; font-weight: 500; }.breakMock > small { text-align: center; color: #aaa6bf; line-height: 1.7; font-size: 9px; }
.breakpoint { position: absolute; bottom: 24px; left: 25px; right: 25px; background: rgba(255,255,255,.09); border: 1px solid rgba(255,255,255,.1); border-radius: 10px; padding: 10px 13px; font-size: 9px; }.breakpoint span { float: right; color: #8fddc4; }
.statsMock { margin: 58px 0 58px 55px; background: white; border-radius: 22px; box-shadow: 0 25px 50px rgba(62,62,126,.13); padding: 42px 36px 30px; display: flex; flex-direction: column; }.statsHeader span { display: block; font-size: 11px; color: #858396; }.statsHeader b { font-size: 38px; letter-spacing: -.05em; display: block; margin-top: 8px; }
.bars { height: 230px; margin: 24px 0 10px; display: flex; align-items: end; gap: 15px; border-bottom: 1px solid #e9e9f0; background: repeating-linear-gradient(to top, transparent, transparent 54px, #f0f0f4 55px); padding: 0 10px; }.bars i { flex: 1; background: linear-gradient(180deg, #7775e5, #aaa9ee); border-radius: 6px 6px 2px 2px; }.bars i:nth-child(4) { background: linear-gradient(180deg, #5b5bd6, #7775e5); box-shadow: 0 5px 14px rgba(91,91,214,.25); }
.days { display: flex; justify-content: space-around; font-size: 9px; color: #9b99a7; }
.menuMock { margin: 55px 55px 55px 0; min-height: 455px; position: relative; background: linear-gradient(145deg, #dfece8, #f8f8f6); border-radius: 22px; box-shadow: 0 28px 50px rgba(48,85,73,.14); overflow: hidden; }.menuBar { height: 31px; padding: 0 15px; background: rgba(255,255,255,.72); display: flex; justify-content: space-between; align-items: center; font-size: 8px; color: #474653; }
.menuPanel { position: absolute; top: 38px; right: 17px; width: 190px; padding: 15px; display: flex; flex-direction: column; gap: 9px; background: rgba(255,255,255,.88); backdrop-filter: blur(12px); border-radius: 10px; box-shadow: 0 14px 35px rgba(45,67,60,.16); font-size: 9px; }.menuPanel strong { font-size: 27px; font-weight: 500; }.menuPanel hr { width: 100%; border: 0; border-top: 1px solid #e8e8e8; margin: 1px 0; }.menuPanel span { color: #53525d; }
.breakpointCard { position: absolute; left: 35px; bottom: 42px; width: 265px; background: rgba(255,255,255,.92); padding: 19px; border-radius: 14px; box-shadow: 0 16px 36px rgba(42,70,62,.14); display: flex; flex-direction: column; gap: 8px; }.breakpointCard small { color: #239172; font-weight: 700; }.breakpointCard b { font-size: 13px; }.breakpointCard span { color: #96939e; font-size: 9px; }

.wakeUp { background: #1d1c32; color: white; padding: 130px max(24px, calc((100vw - 1120px)/2)) 110px; }
.sectionHeading { display: flex; justify-content: space-between; align-items: end; gap: 80px; margin-bottom: 55px; }.sectionHeading > div { flex: 1; }.sectionHeading > p { max-width: 410px; color: #aaa7ba; line-height: 1.9; font-size: 14px; margin: 0 0 8px; }
.versionPill { display: inline-block; color: #9ce1cc; background: rgba(120,215,186,.1); border: 1px solid rgba(120,215,186,.2); border-radius: 99px; padding: 7px 11px; font-size: 10px; font-weight: 700; }.sectionHeading h2 { font-size: clamp(42px, 4.4vw, 62px); line-height: 1.14; letter-spacing: -.055em; margin: 22px 0 0; }
.wakeScreenshot { position: relative; margin: 0 0 24px; border-radius: 24px; overflow: hidden; border: 1px solid rgba(255,255,255,.1); box-shadow: 0 32px 70px rgba(0,0,0,.34); background: #080711; }.wakeScreenshot > img { display: block; width: 100%; height: auto; }.wakeScreenshot > div { position: absolute; left: 24px; right: 24px; bottom: 20px; display: flex; align-items: center; justify-content: space-between; padding: 13px 16px; border-radius: 13px; color: #aaa7ba; background: rgba(26,24,43,.78); border: 1px solid rgba(255,255,255,.08); backdrop-filter: blur(16px); font-size: 10px; }.wakeScreenshot > div span i { display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: #f4a052; }.wakeScreenshot > div b { color: white; font-size: 11px; }
.movementGrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }.movementGrid figure { margin: 0; background: #29273f; border: 1px solid rgba(255,255,255,.06); border-radius: 20px; overflow: hidden; }.movementGrid figure > div { height: 260px; background: radial-gradient(circle at center, #e7f5f0, #dce9e6); display: flex; justify-content: center; overflow: hidden; }.movementGrid img { width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; }.movementGrid figcaption { display: grid; grid-template-columns: auto 1fr; padding: 20px; column-gap: 12px; }.movementGrid figcaption span { grid-row: 1/3; color: #78758d; font-size: 11px; padding-top: 3px; }.movementGrid figcaption b { font-size: 14px; }.movementGrid figcaption small { color: #908da1; margin-top: 4px; }
.timeline { margin-top: 44px; border-top: 1px solid rgba(255,255,255,.1); padding-top: 28px; display: flex; align-items: center; gap: 17px; font-size: 11px; color: #8e8b9e; }.timeline span b { color: white; font-size: 14px; margin-right: 5px; }.timeline i { width: 34px; height: 1px; background: #535064; }.timeline strong { margin-left: auto; color: #9ce1cc; font-size: 15px; }
.evidenceBlock { margin-top: 80px; padding-top: 72px; border-top: 1px solid rgba(255,255,255,.1); }.evidenceIntro { display: grid; grid-template-columns: 1fr 1.25fr; column-gap: 70px; align-items: end; }.evidenceIntro > span { grid-column: 1 / -1; color: #9ce1cc; font-size: 10px; font-weight: 800; letter-spacing: .14em; margin-bottom: 18px; }.evidenceIntro h3 { margin: 0; font-size: clamp(34px, 3.6vw, 50px); line-height: 1.16; letter-spacing: -.05em; }.evidenceIntro p { margin: 0 0 4px; color: #aaa7ba; font-size: 13px; line-height: 1.9; }.evidenceGrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 38px; }.evidenceGrid article { min-height: 280px; display: flex; flex-direction: column; padding: 28px 26px 24px; border-radius: 18px; background: #29273f; border: 1px solid rgba(255,255,255,.07); }.evidenceGrid strong { color: #9ce1cc; font-size: 30px; letter-spacing: -.04em; }.evidenceGrid article > span { margin-top: 7px; color: white; font-size: 12px; font-weight: 700; }.evidenceGrid p { color: #aaa7ba; font-size: 11px; line-height: 1.8; margin: 22px 0; }.evidenceGrid a { margin-top: auto; color: #c9c6d5; font-size: 10px; text-decoration: underline; text-decoration-color: rgba(201,198,213,.35); text-underline-offset: 4px; }.evidenceGrid a:hover { color: white; }.evidenceNote { margin: 20px 2px 0; color: #747185; font-size: 9px; line-height: 1.7; }

.downloadSection { min-height: 630px; position: relative; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center; background: white; }.downloadGlow { position: absolute; width: 800px; height: 500px; background: radial-gradient(ellipse, rgba(91,91,214,.12), rgba(120,215,186,.06) 45%, transparent 70%); }.downloadSection > *:not(.downloadGlow) { position: relative; }.downloadSection > img { border-radius: 25px; box-shadow: 0 18px 40px rgba(64,58,160,.2); margin-bottom: 25px; }.eyebrow.light { font-size: 10px; color: var(--indigo); }.downloadSection h2 { font-size: clamp(44px, 5vw, 68px); letter-spacing: -.06em; margin: 18px 0 14px; }.downloadSection > p { color: var(--muted); font-size: 14px; }.downloadButton { margin-top: 27px; min-width: 310px; min-height: 65px; padding: 11px 17px; border-radius: 17px; background: var(--ink); color: white; display: grid; grid-template-columns: 34px 1fr 24px; text-align: left; align-items: center; box-shadow: 0 17px 38px rgba(25,24,44,.22); transition: transform .2s; }.downloadButton:hover { transform: translateY(-2px); }.downloadButton > span { grid-row: 1/3; width: 21px; height: 21px; border: 1.5px solid white; border-radius: 50%; color: transparent; }.downloadButton b { font-size: 14px; align-self: end; }.downloadButton small { grid-column: 2; color: #a5a3b2; font-size: 9px; align-self: start; margin-top: 2px; }.downloadButton > :last-child { grid-column: 3; grid-row: 1/3; text-align: center; }.downloadNotes { margin-top: 24px; display: flex; gap: 24px; color: #8b8997; font-size: 10px; }
footer { height: 110px; max-width: 1180px; margin: auto; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--line); color: #8e8c99; font-size: 10px; }.footer .brand, footer .brand { color: var(--ink); font-size: 13px; }.footer p, footer p { color: #747280; }

@media (max-width: 1050px) {
  .hero { grid-template-columns: 1fr; padding-top: 70px; text-align: center; }.heroCopy { padding: 0; }.heroActions, .compatibility { justify-content: center; }.heroVisual { margin-top: 30px; }.heroScreenshot { width: min(690px, 90vw); }.hero h1 { font-size: 68px; }
  .featureCopy { padding: 60px 45px; }.breakShot, .screenshotStack { margin-right: 30px; }.statsShot { margin-left: 30px; }.sectionHeading { align-items: flex-start; }
}

@media (max-width: 760px) {
  .nav { width: calc(100% - 32px); height: 66px; }.navLinks { display: none; }.navActions { gap: 7px; }.languageSwitch { font-size: 10px; }.languageSwitch a, .languageSwitch span { min-width: 25px; padding: 5px; }.navDownload { padding: 9px 10px; font-size: 11px; }.brand span { font-size: 14px; }
  .hero { width: 100%; min-height: auto; padding: 70px 20px 40px; }.hero h1, html[lang="en"] .hero h1 { font-size: clamp(44px, 13vw, 60px); }.heroLead { font-size: 15px; }.desktopBreak { display: none; }.heroActions { flex-direction: column; gap: 18px; }.compatibility { flex-wrap: wrap; }
  .heroVisual { height: 390px; margin-top: 25px; transform: scale(.88); transform-origin: center; width: 114%; margin-left: -7%; }.heroScreenshot { min-width: 620px; }.badgeTop { right: 0; top: 25px; }.badgeBottom { left: 0; bottom: 25px; }
  .promise { padding: 90px 20px; }.promise h2 { font-size: 38px; }
  .features { padding: 0 15px 80px; }.feature { grid-template-columns: 1fr; }.featureCopy { padding: 50px 30px; }.featureCopy h3 { font-size: 34px; }.featureBreak .breakShot, .featureFlow .screenshotStack { margin: 0 20px 20px; min-height: 380px; height: 380px; }.featureStats .statsShot { grid-row: 2; margin: 0 20px 20px; min-height: 390px; height: 390px; }
  .wakeUp { padding: 90px 18px 75px; }.sectionHeading { display: block; }.sectionHeading > p { margin-top: 28px; }.wakeScreenshot > div { position: static; border-radius: 0; }.wakeScreenshot > div b { display: none; }.movementGrid { grid-template-columns: 1fr; }.movementGrid figure > div { height: 300px; }.timeline { flex-wrap: wrap; }.timeline strong { width: 100%; margin-top: 10px; }
  .evidenceBlock { margin-top: 60px; padding-top: 55px; }.evidenceIntro { display: block; }.evidenceIntro > span { display: block; }.evidenceIntro p { margin-top: 24px; }.evidenceGrid { grid-template-columns: 1fr; }.evidenceGrid article { min-height: 230px; }
  .downloadSection { min-height: 590px; padding: 70px 18px; }.downloadSection h2 { font-size: 44px; }.downloadNotes { gap: 12px; flex-wrap: wrap; justify-content: center; }
  footer { height: auto; padding: 35px 20px; margin: 0 15px; flex-direction: column; gap: 15px; text-align: center; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .floatingNote { animation: none; } * { transition-duration: .01ms !important; } }