/* Bitty — okapps.org/bitty */
:root{
  --bg:#F7F3FF; --bg2:#EFE9FC; --card:#FFFFFF; --ink:#2B2440; --ink2:#6E6689;
  --accent:#6B5EA8; --accent2:#8B7FC7; --pink:#E8A0BF; --mint:#A8D5C2;
  --radius:22px; --shadow:0 10px 30px rgba(107,94,168,.12);
}
@media (prefers-color-scheme:dark){
  :root{ --bg:#171423; --bg2:#1E1930; --card:#241F38; --ink:#F0EDFA; --ink2:#A79FC4;
         --accent:#A99BE8; --accent2:#8B7FC7; --shadow:0 10px 30px rgba(0,0,0,.35); }
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,sans-serif;
  background:var(--bg); color:var(--ink); line-height:1.6;
}
.wrap{max-width:960px;margin:0 auto;padding:0 22px}
a{color:var(--accent)}

/* hero */
header{padding:64px 0 40px;text-align:center;
  background:radial-gradient(1200px 500px at 50% -200px,var(--bg2),var(--bg))}
.app-icon{width:96px;height:96px;border-radius:22px;box-shadow:var(--shadow)}
h1{font-size:clamp(2rem,5vw,2.9rem);letter-spacing:-.02em;margin:18px 0 6px}
h1 em{font-style:italic;color:var(--accent)}
.tagline{font-size:1.15rem;color:var(--ink2);max-width:34rem;margin:0 auto}
.badge{display:inline-block;margin-top:26px;padding:12px 26px;border-radius:999px;
  background:var(--accent);color:#fff;font-weight:600;text-decoration:none}
.badge.soon{background:var(--card);color:var(--ink2);border:1px solid var(--bg2);cursor:default}

/* features */
section{padding:44px 0}
h2{font-size:1.6rem;letter-spacing:-.01em;margin-bottom:22px;text-align:center}
.grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.card{background:var(--card);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
.card .dot{width:44px;height:44px;border-radius:14px;display:flex;align-items:center;
  justify-content:center;font-size:22px;margin-bottom:12px}
.card h3{font-size:1.05rem;margin-bottom:6px}
.card p{color:var(--ink2);font-size:.95rem}
.d-pink{background:color-mix(in srgb,var(--pink) 25%,transparent)}
.d-lav{background:color-mix(in srgb,var(--accent2) 22%,transparent)}
.d-mint{background:color-mix(in srgb,var(--mint) 35%,transparent)}
.d-sun{background:#F6E7C8}
@media (prefers-color-scheme:dark){ .d-sun{background:#4a4030} }

/* shots */
.shots{display:flex;gap:20px;justify-content:center;flex-wrap:wrap}
.shots img{width:min(250px,70vw);border-radius:26px;box-shadow:var(--shadow)}

/* trust */
.trust{background:var(--card);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow);
  max-width:620px;margin:0 auto;text-align:center}
.trust p{color:var(--ink2)}
.trust strong{color:var(--ink)}

/* footer */
footer{padding:48px 0 56px;text-align:center;border-top:1px solid var(--bg2);margin-top:30px}
.links{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:20px}
.links a{display:inline-block;padding:11px 22px;border-radius:999px;background:var(--card);
  color:var(--ink);text-decoration:none;font-weight:600;box-shadow:var(--shadow);font-size:.95rem}
.links a:hover{color:var(--accent)}
.copy{color:var(--ink2);font-size:.85rem}

/* legal pages */
.legal{max-width:720px;margin:0 auto;padding:56px 22px 72px}
.legal h1{font-size:2rem;text-align:left;margin:8px 0 4px}
.legal .date{color:var(--ink2);margin-bottom:28px;display:block}
.legal h2{font-size:1.2rem;text-align:left;margin:28px 0 8px}
.legal p,.legal li{color:var(--ink);opacity:.92}
.legal ul{padding-left:22px;margin:8px 0}
.back{display:inline-block;margin-bottom:18px;text-decoration:none;font-weight:600}