:root{
  /* açık tema (varsayılan) */
  --bg:#F3F6FA; --bg2:#FFFFFF; --panel:#FFFFFF; --panel-2:#F6F9FC;
  --line:#E6EBF1; --line-2:#D9E0E8;
  --ink:#121A28; --ink-2:#3F4B60; --muted:#7A8699;
  --primary:#0F7A6E; --primary-2:#0C6055; --primary-deep:#0B5A50;
  --accent:#3B6FD6; --gold:#B0862F;
  --on-accent:#FFFFFF; --nav-bg:rgba(255,255,255,.82);
  --radius:20px; --radius-sm:13px; --pill:999px;
}
:root[data-theme="dark"]{
  --bg:#0E1421; --bg2:#111A28; --panel:#16202F; --panel-2:#1C283A;
  --line:#233145; --line-2:#2C3B52;
  --ink:#EAF1F8; --ink-2:#AFBCCE; --muted:#7C8BA1;
  --primary:#2DD4BF; --primary-2:#14B8A6; --primary-deep:#0D9488;
  --accent:#6C9BF5; --gold:#E3B341;
  --on-accent:#052722; --nav-bg:rgba(14,20,33,.72);
}
*{box-sizing:border-box;}
[hidden]{display:none!important;}
html,body{margin:0;padding:0;}
body.landing{background:var(--bg);color:var(--ink);font-family:'Inter',system-ui,Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden;line-height:1.6;transition:background .2s,color .2s;}
a{color:inherit;text-decoration:none;}
h1,h2,h3,h4,.brand,.sec-head h2,.hero h1,.benefit .bt{font-family:'Plus Jakarta Sans','Inter',system-ui,sans-serif;letter-spacing:-.025em;}
.container{max-width:1160px;margin:0 auto;padding:0 24px;}
.mod .ic svg{width:26px;height:26px;}
.grad{background:linear-gradient(115deg,var(--primary) 10%,var(--accent) 90%);-webkit-background-clip:text;background-clip:text;color:transparent;}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 22px;height:48px;border-radius:var(--pill);border:1.5px solid transparent;font-family:inherit;font-size:.95rem;font-weight:600;cursor:pointer;white-space:nowrap;transition:all .18s ease;}
.btn:hover{text-decoration:none;}
.btn:active{transform:translateY(1px);}
.btn.accent{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:var(--on-accent);font-weight:700;box-shadow:0 10px 26px rgba(15,122,110,.22);}
.btn.accent:hover{box-shadow:0 14px 34px rgba(15,122,110,.32);transform:translateY(-1px);}
.btn.ghost{background:var(--panel);border-color:var(--line-2);color:var(--ink);}
.btn.ghost:hover{border-color:var(--primary);color:var(--primary);}
.btn.small{height:42px;padding:0 17px;font-size:.9rem;}
.btn.icon{min-width:44px;padding:0 12px;}

/* nav */
.lnav{position:sticky;top:0;z-index:40;background:var(--nav-bg);backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid var(--line);}
.lnav .row{display:flex;align-items:center;justify-content:space-between;height:76px;gap:18px;}
.brand{display:inline-flex;align-items:center;gap:11px;font-weight:800;font-size:1.35rem;letter-spacing:-.02em;color:var(--ink);}
.brand .logo{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#2DD4BF,#14B8A6);display:flex;align-items:center;justify-content:center;color:#052722;font-weight:800;font-size:1rem;box-shadow:0 4px 14px rgba(20,184,166,.35);}
.lnav .links{display:flex;gap:6px;align-items:center;}
.lnav .links a.navlink{color:var(--ink-2);padding:9px 14px;border-radius:var(--pill);font-size:.92rem;font-weight:500;transition:all .15s;}
.lnav .links a.navlink:hover{color:var(--ink);background:var(--panel-2);}
.nav-actions{display:flex;gap:10px;align-items:center;}

/* hero */
.hero{position:relative;padding:84px 0 40px;}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:
  radial-gradient(760px 420px at 12% -6%, rgba(20,184,166,.14), transparent 70%),
  radial-gradient(700px 460px at 96% 8%, rgba(59,111,214,.12), transparent 70%);}
.hero-grid{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:54px;align-items:center;}
.pill-badge{display:inline-flex;align-items:center;gap:9px;background:var(--panel);border:1px solid var(--line-2);color:var(--primary);font-weight:600;font-size:.8rem;letter-spacing:.2px;padding:8px 15px;border-radius:var(--pill);margin-bottom:24px;box-shadow:0 2px 8px rgba(19,25,34,.05);}
.pill-badge .d{width:7px;height:7px;border-radius:50%;background:var(--primary);box-shadow:0 0 0 4px rgba(20,184,166,.18);}
.hero h1{font-size:3.35rem;line-height:1.05;letter-spacing:-.035em;margin:0 0 20px;font-weight:800;}
.hero .sub{font-size:1.14rem;color:var(--ink-2);max-width:56ch;margin:0 0 30px;}
.hero .cta{display:flex;gap:13px;flex-wrap:wrap;}
.hero .trust{margin-top:26px;display:flex;gap:20px;flex-wrap:wrap;color:var(--muted);font-size:.86rem;}
.hero .trust b{color:var(--ink-2);font-weight:600;}

/* hero preview mock — her iki temada da koyu "ürün ekranı" görünümü */
.preview{position:relative;background:linear-gradient(180deg,#16202F,#111A28);border:1px solid #2C3B52;border-radius:var(--radius);box-shadow:0 30px 70px rgba(0,0,0,.35);padding:20px;color:#EAF1F8;}
.preview .pv-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;}
.preview .pv-title{font-size:.92rem;font-weight:700;color:#EAF1F8;}
.preview .pv-live{font-size:.7rem;color:#8CE9DC;background:rgba(45,212,191,.12);border:1px solid rgba(45,212,191,.25);padding:3px 9px;border-radius:var(--pill);font-weight:600;}
.rate-row{display:grid;grid-template-columns:1.4fr .8fr .8fr .7fr;gap:10px;align-items:center;padding:11px 12px;border-radius:11px;font-size:.85rem;}
.rate-row.h{color:#7C8BA1;font-size:.68rem;text-transform:uppercase;letter-spacing:.5px;padding-bottom:6px;padding-top:0;}
.rate-row.me{background:linear-gradient(90deg,rgba(45,212,191,.14),rgba(45,212,191,.04));border:1px solid rgba(45,212,191,.3);}
.rate-row:not(.h):not(.me){background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.08);margin-top:8px;}
.rate-row .nm{font-weight:600;color:#EAF1F8;display:flex;align-items:center;gap:8px;}
.rate-row .nm .dotm{width:8px;height:8px;border-radius:50%;background:#2DD4BF;}
.rate-row .pr{color:#AFBCCE;font-variant-numeric:tabular-nums;}
.rate-row .tag{font-size:.68rem;font-weight:700;padding:2px 8px;border-radius:var(--pill);text-align:center;}
.tag.up{background:rgba(108,155,245,.16);color:#9DBBF7;}
.tag.ok{background:rgba(45,212,191,.16);color:#8CE9DC;}
.tag.dn{background:rgba(227,120,80,.18);color:#F0AD8C;}
.preview .pv-foot{margin-top:14px;font-size:.74rem;color:#7C8BA1;text-align:center;}

/* section */
.section{padding:64px 0;}
.section.alt{background:var(--panel-2);}
.sec-head{text-align:center;max-width:640px;margin:0 auto 42px;}
.sec-kicker{color:var(--primary);font-weight:700;font-size:.8rem;letter-spacing:1.2px;text-transform:uppercase;}
.sec-head h2{font-size:2.1rem;letter-spacing:-.03em;margin:10px 0 12px;font-weight:800;}
.sec-head p{color:var(--ink-2);margin:0;font-size:1.05rem;}

/* modules */
.modules{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.mod{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:26px;transition:all .18s;box-shadow:0 1px 2px rgba(19,25,34,.04);}
.mod:hover{border-color:var(--line-2);transform:translateY(-3px);box-shadow:0 20px 44px rgba(19,25,34,.12);}
.mod .ic{width:52px;height:52px;border-radius:14px;background:var(--primary-soft,rgba(20,184,166,.12));border:1px solid rgba(20,184,166,.2);color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin-bottom:16px;}
.mod h3{margin:0 0 8px;font-size:1.22rem;letter-spacing:-.01em;display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:var(--ink);}
.mod p{margin:0;color:var(--ink-2);font-size:.95rem;line-height:1.65;}
.status{font-size:.66rem;font-weight:800;letter-spacing:.4px;padding:3px 10px;border-radius:var(--pill);text-transform:uppercase;}
.status.active{background:rgba(20,184,166,.16);color:var(--primary);border:1px solid rgba(20,184,166,.3);}
.status.soon{background:rgba(176,134,47,.14);color:var(--gold);border:1px solid rgba(176,134,47,.28);}

/* steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.step{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:0 1px 2px rgba(19,25,34,.04);}
.step .n{width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,#2DD4BF,#14B8A6);color:#052722;font-weight:800;display:flex;align-items:center;justify-content:center;margin-bottom:14px;}
.step h4{margin:0 0 6px;font-size:1.08rem;color:var(--ink);}
.step p{margin:0;color:var(--ink-2);font-size:.92rem;}

/* benefits */
.benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.benefit{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-sm);padding:20px;box-shadow:0 1px 2px rgba(19,25,34,.04);}
.benefit .bt{font-size:1.7rem;font-weight:800;letter-spacing:-.03em;color:var(--primary);}
.benefit .bl{color:var(--ink-2);font-size:.88rem;margin-top:4px;}

/* cta band */
.cta-band{position:relative;background:linear-gradient(135deg,#0D9488,#14B8A6);border-radius:26px;padding:52px 40px;text-align:center;overflow:hidden;box-shadow:0 24px 60px rgba(13,148,136,.3);}
.cta-band h2{color:#04201C;font-size:2rem;letter-spacing:-.02em;margin:0 0 10px;font-weight:800;}
.cta-band p{color:#053a33;margin:0 0 24px;font-size:1.05rem;opacity:.9;}
.cta-band .btn.dark{background:#08211D;color:#fff;}
.cta-band .btn.dark:hover{background:#021512;}

/* footer */
.lfoot{border-top:1px solid var(--line);padding:34px 0;color:var(--muted);font-size:.88rem;}
.lfoot .row{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;}
.lfoot .brand{color:var(--ink);}

@media(max-width:900px){
  .hero-grid{grid-template-columns:1fr;gap:40px;}
  .modules{grid-template-columns:1fr;}
  .steps{grid-template-columns:1fr;}
  .benefits{grid-template-columns:1fr 1fr;}
  .hero h1{font-size:2.4rem;}
  .lnav .links{display:none;}
}

/* ===== Hero vurgu + ince mobil (ek) ===== */
.hero{padding-top:96px;}
.hero h1{font-size:3.6rem;}
.hero .cta .btn{height:52px;font-size:1rem;}
.preview{box-shadow:0 40px 90px rgba(0,0,0,.42), 0 0 0 1px rgba(45,212,191,.16);}
.pv-live{animation:tcpulse 1.6s infinite;}
@keyframes tcpulse{0%,100%{opacity:1}50%{opacity:.4}}
.pill-badge{background:linear-gradient(90deg,rgba(20,184,166,.12),rgba(59,111,214,.08));}
@media(max-width:640px){
  .container{padding:0 16px;}
  .lnav .row{height:auto;padding:10px 0;flex-wrap:wrap;gap:8px;}
  .brand{font-size:1.12rem;}
  .brand .logo{width:30px;height:30px;}
  .nav-actions{gap:6px;flex-wrap:wrap;justify-content:flex-end;}
  .nav-actions .btn.small{height:38px;padding:0 12px;font-size:.8rem;}
  .hero{padding-top:30px;}
  .hero h1{font-size:2.05rem;line-height:1.1;}
  .hero .sub{font-size:1rem;}
  .hero .cta{flex-direction:column;}
  .hero .cta .btn{width:100%;}
  .hero .trust{gap:10px 16px;font-size:.8rem;}
  .section{padding:42px 0;}
  .sec-head{margin-bottom:28px;}
  .sec-head h2{font-size:1.55rem;}
  .sec-head p{font-size:.96rem;}
  .benefits{grid-template-columns:1fr;}
  .aud-grid{grid-template-columns:1fr;}
  .cta-band{padding:32px 20px;}
  .cta-band h2{font-size:1.5rem;}
  .lfoot .row{flex-direction:column;text-align:center;}
}