/* Wallet Watcher Landing - Basit ve Sade Tasarım */
:root {
  --bg: #f5f7fa;
  --surface: #ffffff;
  --border: #e2e8f0;
  --text: #1f2933;
  --text-light: #5a6875;
  --primary: #0d84eb;
  --primary-accent: #0a6ec2;
  --radius-sm: 6px;
  --radius: 14px;
  --radius-lg: 28px;
  --shadow-sm: 0 2px 4px rgba(0,0,0,.05);
  --shadow: 0 6px 18px -4px rgba(0,0,0,.12);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

* { box-sizing: border-box; }
html, body { margin:0; padding:0; }
body { background: var(--bg); color: var(--text); -webkit-font-smoothing: antialiased; }

img { max-width:100%; display:block; }

.container { width:100%; max-width:1080px; margin:0 auto; padding:0 1.4rem; }

/* Header */
.site-header { position:sticky; top:0; background:rgba(255,255,255,.85); backdrop-filter: blur(12px); border-bottom:1px solid var(--border); z-index:10; }
.nav { display:flex; align-items:center; justify-content:space-between; min-height:60px; }
.logo-wrap { display:flex; align-items:center; gap:.6rem; font-weight:600; font-size:1.05rem; }
.logo { width:38px; height:38px; object-fit:contain; }
.primary-nav a { text-decoration:none; color:var(--text); margin-left:1.2rem; font-size:.95rem; position:relative; }
.primary-nav a:hover { color:var(--primary); }
.download-link { font-weight:600; }

/* Hero */
.hero { padding:5rem 0 3rem; }
.hero-inner { display:grid; gap:3rem; align-items:center; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); }
.hero-text h1 { margin:0 0 1rem; font-size:clamp(2.1rem,4vw,3rem); line-height:1.1; }
.lead { font-size:1.1rem; max-width:520px; color:var(--text-light); }
.cta-group { display:flex; gap:1rem; margin-top:1.6rem; }
.mockup { width:260px; margin:0 auto; border-radius:2rem; box-shadow: var(--shadow); border:1px solid var(--border); }

/* Buttons */
.btn { --btn-bg: var(--primary); --btn-bg-hover: var(--primary-accent); --btn-color:#fff; display:inline-flex; align-items:center; justify-content:center; text-decoration:none; font-weight:600; font-size:.95rem; padding:.9rem 1.4rem; border-radius: var(--radius-lg); background:var(--btn-bg); color:var(--btn-color); box-shadow: var(--shadow-sm); transition:.25s; }
.btn:hover { background:var(--btn-bg-hover); transform:translateY(-2px); }
.btn.large { padding:1.1rem 2rem; font-size:1.05rem; }

/* Section base */
.section { padding:3.5rem 0; }
.section-title { margin:0 0 2rem; font-size:1.9rem; text-align:center; letter-spacing:-.5px; }

/* Features */
.feature-grid { display:grid; gap:1.4rem; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
.feature-card { background:var(--surface); padding:1.2rem 1.2rem 1.4rem; border:1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); transition:.25s; }
.feature-card h3 { margin:.2rem 0 .6rem; font-size:1.05rem; }
.feature-card p { margin:0; font-size:.9rem; line-height:1.4; color:var(--text-light); }
.feature-card:hover { transform:translateY(-4px); box-shadow: var(--shadow); }

/* Screens */
.screen-grid { display:grid; gap:1rem; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); }
.screen-item { margin:0; background:var(--surface); border:1px solid var(--border); border-radius:1.2rem; padding:.6rem; box-shadow: var(--shadow-sm); cursor:zoom-in; position:relative; overflow:hidden; }
.screen-item img { border-radius:.9rem; aspect-ratio:9/19.5; object-fit:cover; width:100%; height:auto; }
.screen-item:hover { box-shadow: var(--shadow); }

/* Download */
.download { background:linear-gradient(135deg,#0d84eb,#1091ff); color:#fff; text-align:center; }
.download-inner h2 { font-size:2.2rem; margin:0 0 1rem; }
.download-inner p { margin:0 0 1.6rem; font-size:1.05rem; opacity:.92; }
.download .btn { --btn-bg:#fff; --btn-bg-hover:#ffffffd9; --btn-color:#0d84eb; box-shadow:none; }

/* Footer */
.site-footer { padding:2.2rem 0 2.4rem; background:#fff; border-top:1px solid var(--border); margin-top:2rem; font-size:.8rem; color:var(--text-light); }
.footer-inner { text-align:center; }

/* Lightbox (basit) */
#lightbox { position:fixed; inset:0; background:rgba(0,0,0,.72); display:none; align-items:center; justify-content:center; z-index:50; padding:2rem 1rem; }
#lightbox img { max-width:400px; width:100%; height:auto; border-radius:1.6rem; box-shadow:0 12px 40px -8px rgba(0,0,0,.5); }
#lightbox.closeable { cursor:zoom-out; }

/* Responsive tweaks */
@media (max-width: 640px) {
  .hero { padding:3.5rem 0 2rem; }
  .hero-inner { gap:2rem; }
  .screen-grid { grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); }
}

@media (prefers-color-scheme: dark) {
  :root { --bg:#0f1419; --surface:#162028; --border:#25313b; --text:#f1f5f9; --text-light:#9aa6b1; }
  .site-header { background: rgba(15,20,25,.75); }
  .feature-card { background:var(--surface); }
  .screen-item { background:var(--surface); }
  .download { background:linear-gradient(135deg,#0d84eb,#065792); }
  .site-footer { background:#121a21; }
}
