/* Basic, clean, responsive styles for Dotzle */
:root{
  --bg:#0f0f12;
  --surface:#16181d;
  --text:#e8eaf0;
  --muted:#a2a7b4;
  --brand:#7c5cff;
  --brand-2:#5cd2ff;
  --ring:rgba(124,92,255,0.4);
  --border:#232730;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  color:var(--text);
  background:radial-gradient(1200px 800px at 10% -10%, rgba(124,92,255,0.25), transparent 60%),
             radial-gradient(1200px 800px at 110% 10%, rgba(92,210,255,0.18), transparent 60%),
             var(--bg);
}
.container{max-width:1040px;margin:0 auto;padding:0 20px}
.nav{display:flex;align-items:center;justify-content:space-between;padding:20px 0}
.brand{font-weight:700;letter-spacing:0.4px;font-size:20px}
.link{color:var(--muted);text-decoration:none}
.link:hover{color:var(--text)}

.hero{display:flex;align-items:center;min-height:70vh}
.hero-content{padding:48px 0}
.hero h1{font-size: clamp(32px, 6vw, 64px);line-height:1.05;margin:0 0 12px}
.tagline{font-size: clamp(16px, 2.2vw, 22px);color:var(--muted);margin:0 0 28px;max-width:720px}

.badges{display:flex;gap:16px;flex-wrap:wrap}
.store-badge{
  display:inline-flex;align-items:center;gap:12px;padding:14px 18px;border-radius:14px;
  background:linear-gradient(180deg, #1a1c22, #14171c);
  border:1px solid var(--border);color:var(--text);text-decoration:none;position:relative;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 10px 30px rgba(0,0,0,0.25);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.store-badge .logo{width:28px;height:28px;flex:0 0 auto;filter: drop-shadow(0 2px 6px rgba(0,0,0,0.35));}
.store-badge .text{display:flex;flex-direction:column;line-height:1}
.store-badge .text .small{font-size:11px;color:var(--muted);letter-spacing:.2px}
.store-badge .text .big{font-size:17px;font-weight:700;letter-spacing:.2px}
.store-badge:hover{transform:translateY(-2px);border-color:#2a2f39;box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 14px 34px rgba(0,0,0,0.35)}
.store-badge:focus{outline:none;box-shadow:0 0 0 4px var(--ring)}
.store-badge.disabled{cursor:default;opacity:.96}

/* Subtle per-store accents */
.badge-apple{background:linear-gradient(180deg, #1b1d22, #14161b)}
.badge-google{background:linear-gradient(180deg, #1b1e24, #14171b)}

.footer{padding:28px 0;border-top:1px solid var(--border);margin-top:40px}
.footer-inner{display:flex;justify-content:space-between;align-items:center;color:var(--muted)}

/* Privacy page */
.main{padding:40px 0}
.main h1{font-size:36px;margin:0 0 8px}
.main .subtitle{color:var(--muted);margin:0 0 24px}
.section{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0));
  border:1px solid var(--border);border-radius:12px;padding:20px;margin:16px 0}
.section h2{font-size:20px;margin:0 0 8px}
.section p, .section ul{color:#cfd3df;line-height:1.6}
.section ul{padding-left:18px}

code, pre {background:#1b1e25;border:1px solid var(--border);border-radius:6px;padding:2px 6px}
