
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
:root {
  --red:     #FF6B3D;
  --purple:  #5046E5;
  --pink:    #E5447B;
  --teal:    #12B5A6;
  --ink:     #101218;
  --ink2:    #1C1F28;
  --muted:   #5B6270;
  --border:  rgba(16,18,24,.08);
  --border2: rgba(16,18,24,.05);
  --white:   #FFFFFF;
  --off:     #F6F7F9;
  --off2:    #EEEEF2;
  --green:   #17B26A;
  --amber:   #F5A524;
  --display: 'Schibsted Grotesk', system-ui, sans-serif;
  --body:    'Figtree', system-ui, sans-serif;
  --mono:    'DM Mono', monospace;
}
body {
  font-family: var(--body);
  background: var(--white);
  color: var(--ink);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
h1,h2,h3,h4,h5 { font-family: var(--display); letter-spacing: -.03em; }

/* ── NAV ── */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 500;
  height: 60px;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 6%;
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(20px) saturate(1.6);
  border-bottom: 1px solid var(--border);
}
.logo {
  font-family: var(--display); font-size: 18px; font-weight: 800;
  color: var(--ink); text-decoration: none; letter-spacing: -.04em;
}
nav ul { display: flex; gap: 32px; list-style: none; }
nav ul a {
  font-size: 14px; font-weight: 500; color: var(--muted);
  text-decoration: none; transition: color .18s; letter-spacing: -.01em;
}
nav ul a:hover, nav ul a.active { color: var(--ink); }
.nav-right { display: flex; align-items: center; gap: 12px; }
.lang-toggle {
  display: flex; gap: 2px;
  background: var(--off); border-radius: 100px; padding: 3px;
  border: 1px solid var(--border);
}
.lang-btn {
  padding: 4px 11px; border-radius: 100px; border: none;
  font-family: var(--body); font-size: 12px; font-weight: 600;
  cursor: pointer; background: transparent; color: var(--muted);
  transition: all .18s;
}
.lang-btn.active { background: var(--white); color: var(--ink); box-shadow: 0 1px 4px rgba(0,0,0,.08); }
.nav-cta {
  background: var(--ink); color: var(--white);
  padding: 8px 20px; border-radius: 100px;
  font-family: var(--display); font-weight: 700; font-size: 13px;
  text-decoration: none; letter-spacing: -.02em; transition: opacity .18s;
}
.nav-cta:hover { opacity: .8; }

/* ── HERO ── */
.hero {
  min-height: 100svh;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  padding: 100px 6% 60px;
  position: relative; overflow: hidden;
  background: var(--white);
}
.hero-inner {
  position: relative; z-index: 2;
  display: flex; align-items: center; gap: 60px;
  max-width: 1200px; width: 100%;
}
.hero-left {
  flex: 1; min-width: 280px; text-align: left;
}
.hero-right {
  flex: 1; min-width: 280px; display: flex; justify-content: center; align-items: center;
  overflow: hidden;
}
/* slide-in from right */
@keyframes slideInRight {
  from { opacity: 0; transform: translateX(80px); }
  to   { opacity: 1; transform: translateX(0); }
}
.hero-right img {
  animation: slideInRight 0.9s cubic-bezier(0.22,1,0.36,1) 0.3s both;
}
@media (max-width: 768px) {
  .hero-inner { flex-direction: column; text-align: center; }
  .hero-left { text-align: center; }
  .hero-right { width: 100%; }
}
/* Soft aurora — light version */
.hero-aurora {
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 70% 55% at 15% 0%,   rgba(80,70,229,.09) 0%, transparent 60%),
    radial-gradient(ellipse 55% 45% at 85% 5%,   rgba(229,68,123,.07) 0%, transparent 55%),
    radial-gradient(ellipse 50% 40% at 50% 105%,  rgba(18,181,166,.07) 0%, transparent 60%);
  animation: aurora 14s ease-in-out infinite alternate;
}
@keyframes aurora {
  0%   { opacity:.7; transform:scale(1); }
  50%  { opacity:1;  transform:scale(1.03); }
  100% { opacity:.65; transform:scale(.98); }
}
/* hero-inner handled above */

/* Eyebrow */
.hero-pill {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--off); border: 1px solid var(--border);
  border-radius: 100px; padding: 6px 16px;
  font-size: 12px; font-weight: 600; color: var(--muted);
  letter-spacing: .04em; text-transform: uppercase; margin-bottom: 36px;
}
.hero-pill-dot {
  width: 6px; height: 6px; border-radius: 50%; background: var(--green);
  animation: blink 2.4s ease-in-out infinite;
}
@keyframes blink { 0%,100%{opacity:1;} 50%{opacity:.25;} }

/* Headline */
.hero h1 {
  font-size: clamp(48px, 7vw, 96px);
  font-weight: 800; line-height: .94; letter-spacing: -.05em;
  margin-bottom: 28px; text-align: left;
}
.h1-flew {
  display: block;
  background: linear-gradient(135deg,
    #101218 0%,
    #5046E5 30%,
    #E5447B 50%,
    #FF6B3D 68%,
    #12B5A6 85%,
    #101218 100%);
  background-size: 200% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: shine 7s linear infinite;
}
@keyframes shine {
  0%   { background-position: 0% center; }
  100% { background-position: 200% center; }
}
.h1-sub {
  display: block;
  color: rgba(16,18,24,.18);
  font-size: clamp(50px, 8vw, 96px);
}

/* Tagline */
.hero-tagline {
  font-size: clamp(17px, 2vw, 21px); font-weight: 400; line-height: 1.65;
  color: var(--muted); max-width: 500px; margin: 0 0 44px;
}
.hero-tagline b { color: var(--ink); font-weight: 600; }

/* CTAs */
.hero-ctas { display: flex; gap: 12px; justify-content: flex-start; flex-wrap: wrap; margin-bottom: 40px; }
.cta-primary {
  background: var(--ink); color: var(--white);
  padding: 16px 36px; border-radius: 100px;
  font-family: var(--display); font-weight: 700; font-size: 16px;
  letter-spacing: -.02em; text-decoration: none; transition: all .2s;
}
.cta-primary:hover { opacity: .82; transform: translateY(-2px); }
.cta-ghost {
  background: var(--off); border: 1px solid var(--border);
  color: var(--muted); padding: 16px 32px; border-radius: 100px;
  font-family: var(--display); font-weight: 600; font-size: 16px;
  letter-spacing: -.02em; text-decoration: none; transition: all .2s;
}
.cta-ghost:hover { color: var(--ink); border-color: rgba(16,18,24,.2); }

/* Proof */
.proof {
  display: flex; align-items: center; gap: 24px; flex-wrap: wrap;
  justify-content: flex-start; font-size: 13px; color: var(--muted);
}
.proof strong { color: var(--ink); font-weight: 600; }
.proof-sep { width: 3px; height: 3px; border-radius: 50%; background: var(--off2); }

/* ── PHONE ── */
.phone-section {
  padding: 4px 6% 100px;
  display: flex; justify-content: center;
  background: var(--white);
}
.phone-frame {
  width: 300px;
  background: #F0F1F5;
  border-radius: 50px;
  padding: 16px 12px 0;
  border: 1px solid rgba(16,18,24,.1);
  box-shadow:
    0 2px 0 rgba(255,255,255,.9) inset,
    0 40px 100px rgba(16,18,24,.12),
    0 0 0 1px rgba(16,18,24,.06),
    0 0 60px rgba(80,70,229,.08);
}
.phone-notch {
  width: 88px; height: 26px;
  background: #E8E9EE;
  border-radius: 0 0 16px 16px;
  margin: 0 auto;
  border: 1px solid rgba(16,18,24,.07); border-top: none;
  position: relative; z-index: 3;
}
.phone-screen {
  background: var(--white);
  border-radius: 38px 38px 0 0;
  overflow: hidden; padding: 20px 16px 0;
  margin-top: -12px;
  border: 1px solid rgba(16,18,24,.06);
  border-bottom: none;
}
.ps-status { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:18px; }
.ps-greeting { font-size:11px; color:var(--muted); font-family:var(--body); }
.ps-date { font-family:var(--display); font-size:18px; font-weight:800; color:var(--ink); letter-spacing:-.03em; margin-top:2px; }
.ps-time { font-family:var(--mono); font-size:14px; font-weight:500; color:var(--ink); }

.tl { display:flex; flex-direction:column; gap:7px; padding-bottom:28px; }
.tl-block {
  border-radius:12px; padding:11px 13px;
  display:flex; align-items:center; gap:11px;
  position:relative; overflow:hidden;
  border-left: 3px solid transparent;
  transition: transform .2s;
}
.tl-block:hover { transform: translateX(2px); }
.tl-info { flex:1; }
.tl-name { font-family:var(--display); font-size:11.5px; font-weight:700; margin-bottom:2px; letter-spacing:-.01em; }
.tl-meta { font-family:var(--mono); font-size:9px; color:var(--muted); }
.tl-time { font-family:var(--mono); font-size:10px; color:var(--muted); }
.tb-routine { background:rgba(18,181,166,.08); border-left-color:var(--teal); } .tb-routine .tl-name { color:#0A8F84; }
.tb-goal    { background:rgba(80,70,229,.08); border-left-color:var(--purple); } .tb-goal .tl-name { color:var(--purple); }
.tb-event   { background:rgba(229,68,123,.08); border-left-color:var(--pink); } .tb-event .tl-name { color:var(--pink); }
.tb-now     { background:rgba(255,107,61,.1); border-left-color:var(--red); border:1px solid rgba(255,107,61,.2); border-left-width:3px; } .tb-now .tl-name { color:var(--red); }
.ps-prog-top { display:flex; justify-content:space-between; margin-bottom:5px; font-family:var(--body); font-size:10px; color:var(--muted); }
.ps-prog-track { height:4px; background:var(--off2); border-radius:2px; overflow:hidden; }
.ps-prog-fill { height:100%; border-radius:2px; background:linear-gradient(90deg,var(--purple),var(--pink)); width:58%; }

/* ── MANIFESTO ── */
.manifesto {
  padding: 120px 6%; text-align: center;
  background: var(--off);
  position: relative; overflow: hidden;
}
.manifesto::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background: radial-gradient(ellipse 60% 50% at 50% 50%, rgba(80,70,229,.06) 0%, transparent 70%);
}
.manifesto-inner { position:relative; z-index:1; max-width:860px; margin:0 auto; }
.manifesto-tag { font-size:11px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-bottom:24px; }
.manifesto h2 {
  font-size: clamp(36px,5.5vw,68px);
  font-weight:800; line-height:1.07; letter-spacing:-.04em;
  color:var(--ink); margin-bottom:22px;
}
.manifesto h2 em { font-style:normal; color:transparent;
  background:linear-gradient(135deg,var(--red),var(--pink));
  -webkit-background-clip:text; background-clip:text;
}
.manifesto h2 .dim { color:rgba(16,18,24,.2); }
.manifesto > .manifesto-inner > p {
  font-size:clamp(17px,2vw,20px); line-height:1.72;
  color:var(--muted); max-width:580px; margin:0 auto 64px;
}
.manifesto > .manifesto-inner > p b { color:var(--ink); font-weight:500; }

/* Stats */
.stats-row {
  display:flex; gap:0; flex-wrap:wrap;
  border:1px solid var(--border); border-radius:20px; overflow:hidden;
  max-width:700px; margin:0 auto; background:var(--white);
  box-shadow: 0 4px 24px rgba(16,18,24,.06);
}
.stat-block {
  flex:1; min-width:150px; padding:28px 18px; text-align:center;
  border-right:1px solid var(--border);
}
.stat-block:last-child { border-right:none; }
.stat-num { font-family:var(--display); font-size:40px; font-weight:800; line-height:1; letter-spacing:-.04em; margin-bottom:7px; }
.stat-label { font-size:12.5px; color:var(--muted); line-height:1.4; }

/* ── FEATURES ── */
.feat-row-wrap { background:var(--white); }
.feat-row-wrap.alt { background:var(--off); }
.feat-row {
  display:flex; align-items:center; gap:80px;
  padding:96px 6%; max-width:1200px; margin:0 auto;
}
.feat-row.rev { flex-direction:row-reverse; }
.feat-text { flex:1; min-width:280px; }
.feat-tag {
  display:inline-block; font-size:11px; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase;
  padding:4px 12px; border-radius:100px; margin-bottom:18px;
}
.feat-text h2 { font-size:clamp(30px,3.5vw,46px); font-weight:800; line-height:1.08; margin-bottom:14px; color:var(--ink); }
.feat-text p { font-size:17px; line-height:1.72; color:var(--muted); margin-bottom:24px; max-width:400px; }
.feat-text p b { color:var(--ink); font-weight:600; }
.feat-list { list-style:none; display:flex; flex-direction:column; gap:11px; }
.feat-list li {
  display:flex; align-items:flex-start; gap:10px;
  font-size:15px; color:var(--muted); line-height:1.5;
}
.feat-list li::before {
  content:'';
  width:18px; height:18px; border-radius:50%; flex-shrink:0; margin-top:2px;
  background: var(--off2)
    url("data:image/svg+xml,%3Csvg width='10' height='8' viewBox='0 0 10 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 4L3.5 6.5L9 1' stroke='%235B6270' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")
    no-repeat center;
}
.feat-visual { flex:1; min-width:260px; display:flex; justify-content:center; align-items:center; }
.feat-visual-inner {
  position:relative; display:flex; justify-content:center; align-items:center;
  border-radius:40px; padding:48px 40px;
}
/* Feature 01 — teal glow */
.glow-teal .feat-visual-inner {
  background:
    radial-gradient(circle 260px at 60% 65%, rgba(18,181,166,.16) 0%, rgba(18,181,166,.04) 60%, transparent 80%),
    radial-gradient(circle 120px at 20% 20%, rgba(18,181,166,.10) 0%, transparent 70%);
}
/* Feature 02 — pink glow */
.glow-pink .feat-visual-inner {
  background:
    radial-gradient(circle 260px at 50% 62%, rgba(229,68,123,.16) 0%, rgba(229,68,123,.04) 60%, transparent 80%),
    radial-gradient(circle 100px at 75% 18%, rgba(255,107,61,.12) 0%, transparent 65%);
}
/* Feature 03 — purple glow */
.glow-purple .feat-visual-inner {
  background:
    radial-gradient(circle 340px at 55% 55%, rgba(80,70,229,.13) 0%, transparent 70%),
    radial-gradient(circle 200px at 20% 25%, rgba(80,70,229,.08) 0%, transparent 60%);
}
/* Geometric decorator SVGs */
.feat-deco {
  position:absolute; pointer-events:none; z-index:0;
}
.feat-visual-inner > img { position:relative; z-index:1; }
.feat-card {
  background:var(--white); border:1px solid var(--border);
  border-radius:24px; padding:28px; width:100%; max-width:360px;
  box-shadow: 0 8px 40px rgba(16,18,24,.07);
}
.feat-card.on-off { background:var(--off); }

/* Conflict card */
.conf-badge {
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(229,68,123,.1); border:1px solid rgba(229,68,123,.25);
  border-radius:100px; padding:4px 12px;
  font-size:11px; font-weight:700; color:var(--pink);
  font-family:var(--body); margin-bottom:12px;
}
.conf-title { font-family:var(--display); font-size:16px; font-weight:700; color:var(--ink); margin-bottom:6px; line-height:1.3; }
.conf-sub { font-size:13px; color:var(--muted); margin-bottom:16px; line-height:1.5; }
.conf-opts { display:flex; flex-direction:column; gap:8px; }
.conf-opt {
  display:flex; justify-content:space-between; align-items:center;
  background:var(--off); border:1px solid var(--border);
  border-radius:12px; padding:12px 14px;
}
.conf-opt.sel { border-color:rgba(255,107,61,.35); background:rgba(255,107,61,.06); }
.conf-opt-l { font-family:var(--display); font-size:13px; font-weight:700; color:var(--ink); }
.conf-opt-s { font-size:11px; color:var(--muted); margin-top:2px; }
.conf-opt-arr { font-size:13px; color:rgba(16,18,24,.25); }
.conf-opt.sel .conf-opt-arr { color:var(--red); }

/* Stat bars */
.stat-bars { display:flex; flex-direction:column; gap:11px; }
.sbar { display:flex; align-items:center; gap:12px; }
.sbar-label { font-size:12px; color:var(--muted); min-width:60px; font-family:var(--body); }
.sbar-track { flex:1; height:7px; background:var(--off2); border-radius:4px; overflow:hidden; }
.sbar-fill { height:100%; border-radius:4px; }
.sbar-pct { font-family:var(--mono); font-size:11px; color:var(--muted); min-width:28px; text-align:right; }

/* ── TESTIMONIALS ── */
.testis-section { padding:100px 6%; background:var(--off); }
.section-head { text-align:center; margin-bottom:52px; }
.section-eyebrow { font-size:11px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-bottom:12px; }
.section-head h2 { font-size:clamp(32px,4vw,52px); font-weight:800; color:var(--ink); line-height:1.1; }
.testis-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; max-width:1100px; margin:0 auto; }
.testi {
  background:var(--white); border:1px solid var(--border);
  border-radius:20px; padding:28px 24px;
  box-shadow:0 2px 16px rgba(16,18,24,.05);
  transition:box-shadow .22s;
}
.testi:hover { box-shadow:0 8px 36px rgba(16,18,24,.1); }
.testi-stars { color:var(--amber); font-size:14px; letter-spacing:2px; margin-bottom:14px; }
.testi-quote { font-size:15px; line-height:1.72; color:var(--muted); margin-bottom:22px; font-style:italic; }
.testi-author { display:flex; align-items:center; gap:12px; }
.testi-av { width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:var(--display); font-weight:700; font-size:13px; color:white; flex-shrink:0; }
.testi-name { font-weight:700; font-size:14px; color:var(--ink); font-family:var(--display); }
.testi-role { font-size:12px; color:var(--muted); margin-top:1px; }

/* ── WAITLIST ── */
.waitlist-section {
  padding:120px 6%; text-align:center;
  background:var(--white);
  position:relative; overflow:hidden;
}
.waitlist-section::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(ellipse 70% 60% at 50% 100%, rgba(80,70,229,.07) 0%, transparent 65%),
    radial-gradient(ellipse 40% 40% at 20% 0%, rgba(229,68,123,.05) 0%, transparent 60%);
}
.waitlist-inner { position:relative; z-index:1; max-width:560px; margin:0 auto; }
.waitlist-section h2 {
  font-size:clamp(38px,6vw,68px);
  font-weight:800; line-height:1.06; color:var(--ink); margin-bottom:14px; letter-spacing:-.04em;
}
.waitlist-section h2 em { font-style:normal; color:transparent;
  background:linear-gradient(135deg,var(--purple),var(--pink));
  -webkit-background-clip:text; background-clip:text;
}
.waitlist-section > .waitlist-inner > p { font-size:18px; color:var(--muted); margin-bottom:40px; line-height:1.65; }
.email-form { display:flex; gap:8px; max-width:440px; margin:0 auto 14px; flex-wrap:wrap; justify-content:center; }
.email-input {
  flex:1; min-width:200px; padding:14px 20px; border-radius:100px;
  background:var(--off); border:1.5px solid var(--border);
  font-family:var(--body); font-size:15px; color:var(--ink); outline:none;
  transition:border-color .18s;
}
.email-input::placeholder { color:var(--muted); }
.email-input:focus { border-color:rgba(16,18,24,.3); }
.email-btn {
  background:var(--ink); color:var(--white);
  padding:14px 26px; border-radius:100px;
  font-family:var(--display); font-weight:700; font-size:15px;
  border:none; cursor:pointer; white-space:nowrap;
  letter-spacing:-.02em; transition:opacity .18s;
}
.email-btn:hover { opacity:.8; }
.form-note { font-size:12px; color:rgba(16,18,24,.35); }
.store-row { display:flex; gap:12px; justify-content:center; margin-top:28px; }
.store-badge {
  display:flex; align-items:center; gap:8px;
  background:var(--off); border:1px solid var(--border);
  color:var(--muted); padding:10px 18px; border-radius:14px;
  font-size:13px; font-weight:600; text-decoration:none;
  transition:all .18s; font-family:var(--body);
}
.store-badge:hover { color:var(--ink); border-color:rgba(16,18,24,.2); }

/* ── FOOTER ── */
footer { background:var(--off); border-top:1px solid var(--border); padding:52px 6% 36px; }
.footer-top { display:flex; justify-content:space-between; flex-wrap:wrap; gap:40px; margin-bottom:40px; }
.footer-brand .logo { display:inline-block; margin-bottom:10px; color:var(--ink); text-decoration:none; font-family:var(--display); font-size:18px; font-weight:800; letter-spacing:-.04em; }
.footer-brand p { font-size:13.5px; color:var(--muted); max-width:200px; line-height:1.6; }
.fc h5 { font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:rgba(16,18,24,.35); margin-bottom:14px; font-family:var(--body); }
.fc a { display:block; font-size:14px; color:var(--muted); text-decoration:none; margin-bottom:9px; transition:color .18s; font-family:var(--body); }
.fc a:hover { color:var(--ink); }
.footer-bottom { border-top:1px solid var(--border); padding-top:22px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; }
.footer-bottom p, .footer-bottom a { font-size:12px; color:rgba(16,18,24,.35); text-decoration:none; font-family:var(--body); }

/* ── REVEAL ── */
.sr   { opacity:0; transform:translateY(28px); transition:opacity .7s ease,transform .7s ease; }
.sr-l { opacity:0; transform:translateX(-28px); transition:opacity .7s ease,transform .7s ease; }
.sr-r { opacity:0; transform:translateX(28px); transition:opacity .7s ease,transform .7s ease; }
.sr.on,.sr-l.on,.sr-r.on { opacity:1; transform:none; }

/* ── LANG TOGGLE (cookie banner compat) ── */
.lang-toggle { display:flex;align-items:center;gap:2px;background:var(--off);border-radius:100px;padding:3px;border:1px solid var(--border); }

@media(max-width:900px){
  nav ul{ display:none; }
  .feat-row,.feat-row.rev{ flex-direction:column; gap:48px; padding:72px 5%; }
  .testis-grid{ grid-template-columns:1fr; }
  .footer-top{ flex-direction:column; }
  .stats-row{ border-radius:16px; }
  .stat-block{ border-right:none; border-bottom:1px solid var(--border); }
}
