:root{
  --bg:#050812;--bg2:#09101d;--card:#10192b;--card2:#121e33;--text:#f5f7fb;--muted:#aeb7c8;
  --blue:#45a8ff;--cyan:#4de2ff;--red:#ff4f75;--pink:#ff6d93;--green:#49db91;--line:rgba(255,255,255,.10);
  --shadow:0 28px 80px rgba(0,0,0,.34);--radius:28px;--max:1180px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 15% 0%,rgba(39,137,255,.12),transparent 35%),radial-gradient(circle at 90% 14%,rgba(255,51,90,.10),transparent 30%),var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.58}
a{color:inherit}.wrap{width:min(var(--max),calc(100% - 40px));margin:auto}.topbar{position:sticky;top:0;z-index:30;background:rgba(5,8,18,.78);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.nav{min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-weight:750;letter-spacing:.2px}.brand img{width:42px;height:42px;border-radius:12px}.navlinks{display:flex;align-items:center;gap:26px}.navlinks a{text-decoration:none;color:var(--muted);font-weight:620;font-size:.95rem}.navlinks a:hover{color:#fff}.menu{display:none;background:none;border:0;color:#fff;font-size:1.55rem}
.hero{padding:64px 0 54px}.hero-card{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:36px;background:linear-gradient(145deg,rgba(22,35,57,.80),rgba(8,12,23,.92));box-shadow:var(--shadow)}.hero-card:after{content:"";position:absolute;inset:auto -8% -40% 25%;height:70%;background:radial-gradient(circle,rgba(255,62,98,.19),transparent 65%);pointer-events:none}.banner{width:100%;display:block;aspect-ratio:2.285/1;object-fit:cover}.hero-copy{display:grid;grid-template-columns:1.4fr .8fr;gap:42px;align-items:end;padding:38px 42px 42px}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:.78rem;color:var(--cyan);font-weight:800}.hero h1{font-size:clamp(2rem,5vw,4.6rem);line-height:1.04;margin:.5rem 0 1rem;letter-spacing:-.045em}.hero p{color:var(--muted);font-size:1.08rem;margin:0;max-width:760px}.cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 19px;border-radius:14px;text-decoration:none;font-weight:760;border:1px solid var(--line);transition:.2s}.btn.primary{background:linear-gradient(135deg,#168cff,#5cc9ff);color:#03101c;border:0}.btn.secondary{background:rgba(255,255,255,.04)}.btn.disabled{opacity:.62;cursor:not-allowed}.mini-note{font-size:.82rem;color:#8e98ab;margin-top:10px}
.section{padding:68px 0}.section-head{max-width:760px;margin-bottom:34px}.section h2{font-size:clamp(1.8rem,3vw,3rem);line-height:1.08;letter-spacing:-.03em;margin:.25rem 0 12px}.section p.lead{color:var(--muted);font-size:1.05rem;margin:0}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature{border:1px solid var(--line);border-radius:24px;padding:25px;background:linear-gradient(145deg,rgba(18,30,51,.83),rgba(10,15,27,.87));min-height:205px}.feature .icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:#14294a;font-size:1.3rem;margin-bottom:18px}.feature h3{margin:0 0 9px;font-size:1.18rem}.feature p{margin:0;color:var(--muted);font-size:.96rem}.feature.accent .icon{background:rgba(255,79,117,.13);color:var(--pink)}
.showcase{display:grid;grid-template-columns:.95fr 1.05fr;gap:46px;align-items:center}.shot-stack{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}.phone{position:relative;border-radius:29px;overflow:hidden;background:#070b12;border:1px solid rgba(255,255,255,.12);box-shadow:0 20px 55px rgba(0,0,0,.38)}.phone img{width:100%;display:block}.phone.tall{grid-row:span 2}.bullets{display:grid;gap:17px;margin-top:26px}.bullet{display:flex;gap:14px}.dot{flex:0 0 10px;width:10px;height:10px;border-radius:50%;background:var(--cyan);margin-top:.55rem;box-shadow:0 0 20px rgba(77,226,255,.7)}.bullet b{display:block;margin-bottom:3px}.bullet span{color:var(--muted);font-size:.96rem}
.intelligence{border:1px solid rgba(73,219,145,.23);background:linear-gradient(145deg,rgba(10,38,34,.65),rgba(10,15,27,.86));border-radius:30px;padding:36px}.intelligence-grid{display:grid;grid-template-columns:1fr .74fr;gap:38px;align-items:center}.intelligence .phone{max-width:390px;margin-left:auto}.badge{display:inline-flex;gap:8px;align-items:center;border:1px solid rgba(73,219,145,.28);background:rgba(73,219,145,.08);color:#9ef2c2;border-radius:999px;padding:7px 12px;font-weight:700;font-size:.84rem}
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:17px}.gallery .phone:nth-child(2){transform:translateY(24px)}.gallery .phone:nth-child(4){transform:translateY(24px)}
.privacy-strip{display:grid;grid-template-columns:1.1fr .9fr;gap:30px;padding:32px;border:1px solid rgba(69,168,255,.20);border-radius:28px;background:linear-gradient(135deg,rgba(19,39,69,.74),rgba(10,15,27,.88))}.privacy-strip h3{font-size:1.65rem;margin:0 0 10px}.privacy-strip p{color:var(--muted);margin:0}.privacy-list{display:grid;gap:12px}.privacy-list div{padding:11px 14px;border-radius:13px;background:rgba(255,255,255,.035);border:1px solid var(--line);color:#d7deea;font-size:.92rem}
.footer{border-top:1px solid var(--line);padding:34px 0 44px;color:#8f99aa;font-size:.9rem}.footer-grid{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.footer-links{display:flex;gap:18px;flex-wrap:wrap}.footer a{color:#b6c2d4;text-decoration:none}.footer a:hover{color:#fff}
.page{padding:64px 0 90px}.page-card{max-width:900px;margin:auto;border:1px solid var(--line);border-radius:30px;background:linear-gradient(145deg,rgba(17,29,49,.90),rgba(9,14,25,.94));padding:clamp(24px,5vw,54px);box-shadow:var(--shadow)}.page-card h1{font-size:clamp(2.2rem,5vw,4rem);letter-spacing:-.04em;line-height:1.05;margin:0 0 12px}.page-card h2{margin-top:34px;font-size:1.35rem}.page-card p,.page-card li{color:#c2cada}.page-card strong{color:#f5f7fb}.meta{color:#8d98ac;margin-bottom:30px}.notice{padding:18px 20px;border:1px solid rgba(255,153,70,.28);background:rgba(255,153,70,.07);border-radius:16px;color:#d7deea;margin:24px 0}.contact-card{display:grid;gap:12px;margin-top:28px}.contact-line{padding:16px 18px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.03)}.contact-line a{color:#8edfff;text-decoration:none}.small{font-size:.88rem;color:#929daf}
@media(max-width:900px){.hero-copy,.showcase,.intelligence-grid,.privacy-strip{grid-template-columns:1fr}.hero-copy{padding:28px}.grid3{grid-template-columns:1fr 1fr}.gallery{grid-template-columns:1fr 1fr}.intelligence .phone{margin:0 auto}.showcase .copy{order:-1}}@media(max-width:640px){.wrap{width:min(100% - 26px,var(--max))}.navlinks{display:none}.menu{display:block}.navlinks.open{position:absolute;display:flex;flex-direction:column;align-items:flex-start;right:13px;top:64px;padding:17px 18px;background:#0c1423;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}.hero{padding-top:28px}.hero-card{border-radius:24px}.hero-copy{padding:22px}.grid3{grid-template-columns:1fr}.gallery{grid-template-columns:1fr 1fr;gap:12px}.gallery .phone:nth-child(2),.gallery .phone:nth-child(4){transform:none}.section{padding:52px 0}.phone{border-radius:22px}.shot-stack{gap:12px}.footer-grid{display:grid}}
.easy-showcase{align-items:center}.easy-stack{grid-template-columns:1.22fr .78fr}.easy-phone{max-height:820px}.easy-phone img{width:100%;height:auto}.disclaimer-section{padding-top:14px}.disclaimer-card{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;padding:26px 30px;border:1px solid rgba(255,173,91,.24);border-radius:24px;background:linear-gradient(145deg,rgba(56,38,20,.42),rgba(10,15,27,.88))}.disclaimer-icon{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(255,173,91,.12);border:1px solid rgba(255,173,91,.25);color:#ffc381;font-weight:800}.disclaimer-card h3{margin:1px 0 6px;font-size:1.2rem}.disclaimer-card p{margin:0;color:var(--muted)}
@media(max-width:900px){.easy-stack{grid-template-columns:1fr 1fr;max-width:620px;margin:auto}}
@media(max-width:640px){.easy-stack{grid-template-columns:1fr 1fr}.disclaimer-card{grid-template-columns:1fr;padding:22px}}

/* V4 responsive polish: preserve the V1 look, but constrain desktop visuals and enlarge mobile screenshots. */
@media (min-width: 901px){
  :root{--max:1240px}
  body{font-size:17px}
  .section{padding:76px 0}
  .section-head{max-width:820px;margin-bottom:42px}
  .section p.lead{font-size:1.12rem;line-height:1.72}
  .showcase{grid-template-columns:minmax(360px,520px) minmax(0,1fr);gap:86px;align-items:center}
  .showcase .copy{max-width:600px}
  .showcase .copy h2,.intelligence h2{font-size:clamp(2.15rem,3.1vw,3.15rem);line-height:1.08;margin:.35rem 0 16px}
  .bullets{gap:20px;margin-top:30px}
  .bullet span{font-size:1rem;line-height:1.62}
  .shot-stack{width:100%;max-width:500px;gap:16px}
  .shot-stack .phone{max-width:235px;justify-self:center}
  .shot-stack .phone.tall{max-width:248px}
  .shot-stack .phone img{max-height:565px;object-fit:contain}
  .intelligence{padding:46px 52px}
  .intelligence-grid{grid-template-columns:minmax(0,1fr) 340px;gap:72px}
  .intelligence .phone{width:100%;max-width:315px;margin-left:auto}
  .intelligence .phone img{max-height:650px;object-fit:contain}
  .easy-showcase{grid-template-columns:minmax(360px,500px) minmax(0,1fr)}
  .easy-stack{width:100%;max-width:500px;grid-template-columns:1.18fr .82fr;gap:18px}
  .easy-stack .phone{max-width:none}
  .easy-stack .easy-phone{width:100%}
  .easy-stack .phone:not(.easy-phone){width:100%;align-self:start}
  .gallery{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;max-width:1040px;margin:0 auto}
  .gallery .phone{width:100%;max-width:235px;justify-self:center}
  .gallery .phone img{max-height:520px;object-fit:contain}
  .gallery .phone:nth-child(2),.gallery .phone:nth-child(4){transform:translateY(14px)}
  .privacy-strip{gap:56px;padding:42px 46px}
  .disclaimer-card{padding:30px 36px}
}

@media (min-width: 1200px){
  .hero-copy{padding:42px 48px 46px}
  .hero p{font-size:1.14rem;line-height:1.65}
  .feature{padding:28px;min-height:215px}
  .feature p{font-size:1rem;line-height:1.6}
}

@media (max-width: 900px){
  .showcase{gap:34px}
  .showcase .copy{max-width:680px;margin:0 auto;width:100%}
  .shot-stack{max-width:620px;margin:0 auto}
  .intelligence{padding:30px}
}

@media (max-width: 640px){
  .section-head{margin-bottom:26px}
  .section h2{font-size:clamp(1.85rem,9vw,2.55rem)}
  .section p.lead{font-size:1.04rem;line-height:1.62}
  .showcase{gap:30px}
  .showcase .copy{padding:0 4px}
  .bullets{gap:20px}
  .bullet span{font-size:1rem;line-height:1.6}

  /* Daily overview: one clear primary screen, with the two secondary screens below it. */
  .showcase:not(.easy-showcase) .shot-stack{grid-template-columns:1fr 1fr;max-width:390px;gap:14px}
  .showcase:not(.easy-showcase) .shot-stack .phone.tall{grid-column:1 / -1;grid-row:auto;max-width:300px;width:78%;justify-self:center}
  .showcase:not(.easy-showcase) .shot-stack .phone:not(.tall){width:100%;max-width:180px;justify-self:center}

  /* Easy must be genuinely readable on a phone, not two postage stamps side by side. */
  .easy-stack{grid-template-columns:1fr;max-width:340px;gap:18px;margin:0 auto}
  .easy-stack .easy-phone{width:100%;max-width:315px;justify-self:center}
  .easy-stack .phone:not(.easy-phone){width:76%;max-width:255px;justify-self:center}

  .intelligence{padding:25px 20px;border-radius:24px}
  .intelligence-grid{gap:26px}
  .intelligence .phone{width:86%;max-width:320px;margin:0 auto}

  /* Real screenshots should be readable. Stack them instead of squeezing two into a row. */
  .gallery{grid-template-columns:1fr;gap:20px;max-width:340px;margin:0 auto}
  .gallery .phone{width:88%;max-width:315px;justify-self:center}
  .gallery .phone:nth-child(2),.gallery .phone:nth-child(4){transform:none}
  .gallery .phone img{width:100%;height:auto;max-height:none}

  .privacy-strip{padding:26px 22px;gap:24px}
}

/* Keep medium laptop/tablet landscape widths from falling into a phone-like single-column page. */
@media (min-width: 720px) and (max-width: 900px){
  .wrap{width:min(var(--max),calc(100% - 48px))}
  .showcase{grid-template-columns:minmax(280px,.85fr) minmax(0,1.15fr);gap:48px;align-items:center}
  .showcase .copy{order:initial;max-width:560px}
  .showcase .shot-stack{max-width:390px}
  .intelligence-grid{grid-template-columns:minmax(0,1fr) 280px;gap:42px;align-items:center}
  .intelligence .phone{max-width:260px;margin-left:auto}
  .privacy-strip{grid-template-columns:1.05fr .95fr;gap:34px}
  .easy-showcase{grid-template-columns:minmax(300px,.9fr) minmax(0,1.1fr)}
  .easy-stack{max-width:360px}
}


/* V5 desktop refinements requested after laptop review. No generated imagery: these are layout-only crops of the original screenshots. */
.phone.crop-status{overflow:hidden}

@media (min-width: 901px){
  /* Hide the Android status bar area from original screenshots on desktop. */
  .crop-status img{
    margin-top:-5.4%;
  }

  /* Everyday overview: a little larger, while preserving breathing room around the copy. */
  .showcase:not(.easy-showcase){
    grid-template-columns:minmax(440px,575px) minmax(0,1fr);
    gap:78px;
  }
  .showcase:not(.easy-showcase) .shot-stack{
    max-width:560px;
    gap:18px;
  }
  .showcase:not(.easy-showcase) .shot-stack .phone{
    max-width:265px;
  }
  .showcase:not(.easy-showcase) .shot-stack .phone.tall{
    max-width:288px;
  }

  /* Tutine Insight: keep the current visual size; only the status area is hidden. */
  .intelligence .phone.crop-status{
    max-width:315px;
  }

  /* Tutine Easy: make the experience selector large enough to read without zooming. */
  .easy-showcase{
    grid-template-columns:minmax(500px,590px) minmax(0,1fr);
    gap:72px;
  }
  .easy-stack{
    max-width:570px;
    grid-template-columns:1fr 1fr;
    gap:28px;
    align-items:start;
  }
  .easy-stack .easy-phone,
  .easy-stack .phone:not(.easy-phone){
    width:100%;
    max-width:270px;
    justify-self:center;
  }

  /* Inside Tutine: every screenshot keeps its natural height. No stretched empty phone shells. */
  .gallery{
    align-items:start;
    max-width:1120px;
    gap:28px;
  }
  .gallery .phone{
    align-self:start;
    height:auto;
    max-width:245px;
  }
  .gallery .phone img{
    width:100%;
    height:auto;
    max-height:none;
    object-fit:initial;
  }
  .gallery .phone:nth-child(2),
  .gallery .phone:nth-child(4){
    transform:none;
  }
}

/* Do not apply the desktop status-bar crop on phones, where vertical space is already limited. */
@media (max-width: 900px){
  .crop-status img{margin-top:0}
}

/* V6 — language selector and final desktop screenshot layout. */
.nav-actions{display:flex;align-items:center;gap:10px;margin-left:auto}
.lang-switch{position:relative}
.lang-switch summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:7px;min-height:40px;padding:0 11px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.035);color:#eaf2ff;font-size:.82rem;font-weight:800;letter-spacing:.05em;user-select:none}
.lang-switch summary::-webkit-details-marker{display:none}
.lang-switch summary svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.lang-switch[open] summary{border-color:rgba(77,226,255,.32);background:#0d1828}
.lang-menu{position:absolute;right:0;top:48px;min-width:175px;padding:7px;border:1px solid var(--line);border-radius:14px;background:#0b1321;box-shadow:var(--shadow);z-index:60}
.lang-menu a{display:flex;align-items:center;gap:11px;padding:10px 11px;border-radius:9px;text-decoration:none;color:#c5cfde;font-size:.9rem}
.lang-menu a span{display:inline-flex;width:28px;color:#69dcff;font-weight:800;font-size:.78rem}
.lang-menu a:hover,.lang-menu a.active{background:rgba(69,168,255,.10);color:#fff}

/* The four Inside Tutine shots use their own natural height. Flex avoids a shared grid-row height. */
.inside-gallery-v6{display:flex;align-items:flex-start;justify-content:space-between;gap:28px;max-width:1160px;margin:0 auto}
.inside-gallery-v6 .phone{flex:0 0 auto;align-self:flex-start;height:max-content!important;min-height:0!important;margin:0}
.inside-gallery-v6 .phone img{display:block;width:100%;height:auto!important;max-height:none!important;object-fit:initial!important;margin:0!important}
.inside-gallery-v6 .modules-shot{width:245px}
.inside-gallery-v6 .experience-shot{width:270px}
.inside-gallery-v6 .report-shot{width:245px}
.inside-gallery-v6 .calendar-shot{width:245px}

/* Tutine Easy: two genuinely readable screenshots instead of one large + one thumbnail. */
.easy-stack-v6{display:flex;align-items:flex-start;justify-content:center;gap:30px;max-width:675px;width:100%}
.easy-stack-v6 .phone{flex:0 0 auto;height:max-content!important;align-self:flex-start}
.easy-stack-v6 .easy-phone-v6{width:310px}
.easy-stack-v6 .easy-experience-v6{width:310px;margin-top:20px}
.easy-stack-v6 img{display:block;width:100%;height:auto!important;max-height:none!important;object-fit:initial!important}

@media (min-width:901px){
  .nav{gap:18px}.navlinks{gap:20px}
  .easy-showcase{grid-template-columns:minmax(610px,680px) minmax(0,1fr);gap:68px;align-items:center}
  .everyday-stack .phone{height:max-content!important;align-self:flex-start}
  .intelligence .insight-phone{height:max-content!important}
}

@media (max-width:1050px) and (min-width:901px){
  .navlinks{gap:14px}.navlinks a{font-size:.88rem}
  .inside-gallery-v6{gap:18px}
  .inside-gallery-v6 .modules-shot{width:210px}.inside-gallery-v6 .experience-shot{width:225px}.inside-gallery-v6 .report-shot{width:210px}.inside-gallery-v6 .calendar-shot{width:210px}
  .easy-showcase{grid-template-columns:minmax(500px,570px) minmax(0,1fr);gap:48px}
  .easy-stack-v6{gap:22px}.easy-stack-v6 .easy-phone-v6,.easy-stack-v6 .easy-experience-v6{width:260px}
}

@media (max-width:900px){
  .nav{position:relative}.nav-actions{margin-left:auto}
  .lang-menu{right:0}
  .inside-gallery-v6{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:620px}
  .inside-gallery-v6 .phone{width:100%!important;max-width:280px;justify-self:center}
  .easy-stack-v6{max-width:620px;margin:0 auto;gap:22px}
  .easy-stack-v6 .easy-phone-v6,.easy-stack-v6 .easy-experience-v6{width:min(46vw,285px)}
}

@media (max-width:640px){
  .brand span{font-size:1.05rem}.nav{min-height:70px;gap:8px}.nav-actions{gap:7px}.lang-switch summary{padding:0 9px;min-height:39px}.lang-switch summary span{display:none}
  .navlinks.open{right:13px;top:62px}
  .inside-gallery-v6{grid-template-columns:1fr;max-width:350px;gap:22px}
  .inside-gallery-v6 .phone{width:88%!important;max-width:315px}
  .easy-stack-v6{display:grid;grid-template-columns:1fr;max-width:350px;gap:22px}
  .easy-stack-v6 .easy-phone-v6,.easy-stack-v6 .easy-experience-v6{width:88%;max-width:315px;justify-self:center;margin-top:0}
}


/* V7: reminders and doctor-ready report section */
.routine-section{padding-top:58px}
.routine-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.routine-card{display:grid;grid-template-columns:auto 1fr;gap:20px;padding:28px;border:1px solid var(--line);border-radius:26px;background:linear-gradient(145deg,rgba(18,30,51,.82),rgba(10,15,27,.9));box-shadow:0 18px 50px rgba(0,0,0,.18)}
.routine-icon{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:rgba(77,226,255,.08);border:1px solid rgba(77,226,255,.18);color:var(--cyan);font-weight:850;font-size:1.05rem}
.routine-card h3{margin:2px 0 8px;font-size:1.25rem}
.routine-card p{margin:0;color:var(--muted)}
.routine-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.routine-tags span{padding:7px 10px;border-radius:999px;background:rgba(69,168,255,.08);border:1px solid rgba(69,168,255,.16);color:#cfeaff;font-size:.82rem;font-weight:700}
@media(max-width:760px){
  .routine-grid{grid-template-columns:1fr}
  .routine-card{grid-template-columns:1fr;padding:24px}
}