:root{
  --bg:#f6f8fc;
  --text:#0f172a;
  --muted:#475569;
  --card:#ffffff;
  --border:#e5e7eb;

  --navy:#0f172a;
  --blue:#1e3a8a;

  --orange:#ff7a00;
  --orange2:#ffb347;

  --shadow: 0 20px 60px rgba(2,6,23,.12);
  --shadow2: 0 12px 28px rgba(2,6,23,.10);
  --shadowPremium: 0 40px 120px rgba(2,6,23,.20);

  --radius:22px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:"Inter",system-ui,Arial;
  background:var(--bg);
  color:var(--text);
}

/* CONTAINER */
.container{width:min(1100px, 92vw);margin:0 auto}

/* TOPBAR */
.topbar{
  position:sticky;top:0;z-index:50;
  backdrop-filter: blur(12px);
  background: rgba(246,248,252,.75);
  border-bottom:1px solid rgba(229,231,235,.7);
}
.topbar__inner{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 0;gap:16px;
}

/* BRAND */
.brand{
  display:flex;align-items:center;gap:10px;
  text-decoration:none;color:var(--text);font-weight:800;
}
.brand__mark{
  width:40px;height:40px;border-radius:14px;
  display:grid;place-items:center;
  background:linear-gradient(135deg,var(--navy),var(--blue));
  color:#fff;box-shadow: var(--shadow2);
  letter-spacing:.5px;font-weight:900;
}
.brand__mark--small{width:32px;height:32px;border-radius:12px}
.brand__name{font-weight:800}

/* NAV */
.nav{display:flex;gap:18px}
.nav a{
  text-decoration:none;color:var(--muted);
  font-weight:600;font-size:14px;transition:.2s;
}
.nav a:hover{color:var(--text)}

/* ACTIONS */
.topbar__actions{display:flex;align-items:center;gap:10px}

/* BUTTONS */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  border-radius:999px;padding:12px 16px;text-decoration:none;
  font-weight:700;border:1px solid transparent;transition:.25s;cursor:pointer;
}
.btn--lg{padding:14px 20px}
.btn--primary{
  background:linear-gradient(135deg,var(--orange),var(--orange2));
  color:#fff;box-shadow: var(--shadow2);
  position:relative;overflow:hidden;
}
.btn--primary:hover{transform:translateY(-2px);filter:saturate(1.05)}
.btn--primary::after{
  content:"";position:absolute;top:0;left:-100%;
  width:100%;height:100%;
  background:linear-gradient(120deg,transparent,rgba(255,255,255,.4),transparent);
  transition:.6s;
}
.btn--primary:hover::after{left:100%}
.btn--ghost{
  background:rgba(255,255,255,.85);
  border-color:rgba(229,231,235,.9);
  color:var(--text);
}
.btn--ghost:hover{transform:translateY(-2px);box-shadow: var(--shadow2)}

/* HAMBURGER */
.hamburger{
  display:none;width:44px;height:44px;border-radius:14px;
  border:1px solid rgba(229,231,235,.9);
  background:rgba(255,255,255,.8);
}
.hamburger span{
  display:block;width:18px;height:2px;background:var(--text);
  margin:5px auto;border-radius:2px;
}
.mobileNav{
  display:none;padding:10px 0 14px;
  border-top:1px solid rgba(229,231,235,.7);
}
.mobileNav a{
  display:block;padding:10px 0;
  text-decoration:none;color:var(--muted);font-weight:700;
}

/* HERO */
.hero{
  position:relative;
  background:
    radial-gradient(1100px 500px at 20% 20%, rgba(30,58,138,.35), transparent 60%),
    radial-gradient(900px 500px at 80% 40%, rgba(255,122,0,.18), transparent 55%),
    linear-gradient(135deg,var(--navy),#111827);
  color:#fff;padding:90px 0 70px;overflow:hidden;
}
.hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(circle at 20% 30%, rgba(255,255,255,.12), transparent 40%),
    radial-gradient(circle at 80% 60%, rgba(255,122,0,.18), transparent 40%);
}
.hero__grid{
  display:grid;grid-template-columns: 1.1fr .9fr;
  gap:34px;align-items:center;
}
.badge{
  display:inline-flex;background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.18);
  padding:8px 12px;border-radius:999px;
  font-weight:700;font-size:12px;margin-bottom:16px;
}
.hero h1{
  font-size:54px;line-height:1.05;letter-spacing:-1px;margin-bottom:14px;
}
.hero__subhead{
  font-size:16px;color:#cbd5e1;font-weight:700;display:inline-block;margin-top:10px
}
.grad{
  background:linear-gradient(135deg,#93c5fd,#ffb347);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.lead{
  font-size:18px;line-height:1.6;opacity:.92;margin-bottom:22px;max-width:560px;
}
.hero__cta{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.hero__note{margin-top:18px;color:#cbd5e1;font-size:14px;font-weight:600}

/* TRUST */
.trust{display:flex;gap:16px;flex-wrap:wrap;opacity:.95}
.trust__item{display:flex;gap:8px;align-items:center;font-weight:700;font-size:13px}
.dot{width:10px;height:10px;border-radius:999px}
.dot--blue{background:#60a5fa}
.dot--orange{background:#fb923c}
.dot--green{background:#34d399}

/* PHONE */
.hero__right{position:relative}
.phone{
  width:min(360px, 86%);margin:0 auto;border-radius:36px;padding:14px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  box-shadow: var(--shadowPremium);
}
.phone__screen{
  border-radius:28px;overflow:hidden;background:#0b1220;
  border:1px solid rgba(255,255,255,.12);
}
.screen__header{display:flex;gap:8px;padding:12px;background:rgba(255,255,255,.06)}
.pill{width:34px;height:8px;border-radius:999px;background:rgba(255,255,255,.18)}
.screen__body{padding:18px}
.mock__title{font-weight:800;font-size:18px;color:#fff;margin-bottom:4px}
.mock__subtitle{color:rgba(255,255,255,.72);font-weight:600;font-size:12px;margin-bottom:14px}
.mock__cards{display:grid;gap:12px}
.mock__card{
  height:64px;border-radius:18px;
  background:linear-gradient(135deg,rgba(96,165,250,.22),rgba(255,122,0,.14));
  border:1px solid rgba(255,255,255,.10);
}
.mock__footer{
  height:40px;margin-top:14px;border-radius:16px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.10);
}

/* FLOATING */
.floating{
  position:absolute;padding:10px 12px;border-radius:999px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.18);
  font-weight:800;font-size:12px;
  backdrop-filter: blur(10px);
  animation: float 4.2s ease-in-out infinite;
}
.floating--1{left:-8px; top:18px}
.floating--2{right:-10px; top:84px; animation-delay:.6s}
.floating--3{left:12px; bottom:24px; animation-delay:1.1s}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

/* STATS */
.stats{margin-top:-22px;padding:0 0 30px}
.stats__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.stat{
  background:rgba(255,255,255,.9);
  border:1px solid rgba(229,231,235,.9);
  border-radius:20px;padding:18px 16px;
  box-shadow: var(--shadow2);
}
.stat__num{font-weight:900;font-size:30px}
.stat__label{margin-top:6px;color:var(--muted);font-weight:700;font-size:13px}
.stats__note{margin-top:10px;color:var(--muted);font-size:12px}

/* WHY */
.why{padding:70px 0}
.why h2{text-align:center;font-size:38px;margin-bottom:30px}
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.why-card{
  background:#fff;padding:24px;border-radius:var(--radius);
  box-shadow: var(--shadow2);
  border:1px solid rgba(229,231,235,.9);
  transition:.25s;
}
.why-card:hover{transform:translateY(-6px);box-shadow:var(--shadowPremium)}

/* SECTION + HEAD (EK) */
.section{padding:76px 0}
.section--alt{background:rgba(255,255,255,.55);border-top:1px solid rgba(229,231,235,.75);border-bottom:1px solid rgba(229,231,235,.75)}
.section__head{text-align:center;margin-bottom:28px}
.section__head h2{font-size:38px;letter-spacing:-.6px}
.section__head p{color:var(--muted);font-weight:700;margin-top:10px;max-width:780px;margin-left:auto;margin-right:auto;line-height:1.55}

/* FEATURES */
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.feature{
  background:var(--card);
  border:1px solid rgba(229,231,235,.95);
  border-radius:var(--radius);
  padding:22px;
  box-shadow: var(--shadow2);
  transition:.25s;
}
.feature:hover{transform:translateY(-6px);box-shadow:0 25px 60px rgba(30,58,138,.18)}
.icon{
  width:44px;height:44px;border-radius:16px;
  display:grid;place-items:center;
  background:linear-gradient(135deg,rgba(30,58,138,.12),rgba(255,122,0,.12));
  margin-bottom:12px;font-size:18px;
}

/* PROMO (EK) */
.promoGrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:stretch}
.promoCard{
  background:#fff;border:1px solid rgba(229,231,235,.95);
  border-radius:var(--radius);padding:26px;
  box-shadow: var(--shadow2);
}
.promoCard--accent{
  background:linear-gradient(135deg, rgba(15,23,42,.06), rgba(255,122,0,.06));
  border-color:rgba(255,122,0,.18);
}
.checklist{margin-top:12px;display:grid;gap:10px}
.checklist li{list-style:none;position:relative;padding-left:26px;color:var(--text);font-weight:700}
.checklist li::before{
  content:"✓";
  position:absolute;left:0;top:0;
  width:18px;height:18px;border-radius:6px;
  display:grid;place-items:center;
  background:rgba(34,197,94,.14);
  color:#16a34a;font-weight:900;
}
.promoActions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.tinyNote{margin-top:12px;color:var(--muted);font-weight:700;font-size:12px}

/* STEPS (EK) */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.step{
  background:#fff;border:1px solid rgba(229,231,235,.95);
  border-radius:var(--radius);padding:22px;
  box-shadow: var(--shadow2);
}
.step__no{
  width:38px;height:38px;border-radius:14px;
  display:grid;place-items:center;
  background:linear-gradient(135deg, rgba(30,58,138,.12), rgba(255,122,0,.14));
  font-weight:900;margin-bottom:10px;
}

/* SLIDER (EK) */
.slider{
  position:relative;
  display:grid;
  grid-template-columns:48px 1fr 48px;
  gap:12px;
  align-items:center;
}
.slider__btn{
  width:48px;height:48px;border-radius:16px;
  border:1px solid rgba(229,231,235,.95);
  background:rgba(255,255,255,.9);
  box-shadow: var(--shadow2);
  cursor:pointer;
  font-size:26px;
  font-weight:900;
  color:var(--text);
  transition:.2s;
}
.slider__btn:hover{transform:translateY(-2px)}
.slider__track{position:relative;min-height:260px}
.slide{display:none}
.slide.is-active{display:block}
.shot{
  background:linear-gradient(135deg, rgba(15,23,42,.06), rgba(30,58,138,.06));
  border:1px solid rgba(229,231,235,.95);
  border-radius:var(--radius);
  padding:18px;
  box-shadow: var(--shadow2);
}
.shot__top{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.tag{
  display:inline-flex;align-items:center;justify-content:center;
  padding:8px 12px;border-radius:999px;
  font-weight:900;font-size:12px;
  background:rgba(255,122,0,.12);
  border:1px solid rgba(255,122,0,.18);
}
.tag--soft{
  background:rgba(30,58,138,.10);
  border-color:rgba(30,58,138,.16);
}
.shot__body{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.shot__mock{
  height:140px;border-radius:18px;
  background:linear-gradient(135deg, rgba(96,165,250,.18), rgba(255,122,0,.10));
  border:1px solid rgba(15,23,42,.08);
}
.dots{display:flex;gap:10px;justify-content:center;margin-top:14px}
.dotBtn{
  width:10px;height:10px;border-radius:999px;
  border:none;cursor:pointer;
  background:rgba(15,23,42,.22);
  transition:.2s;
}
.dotBtn.is-active{width:26px;background:rgba(255,122,0,.75)}

/* FAQ (EK) */
.faq{display:grid;gap:12px}
.faqItem{
  background:#fff;border:1px solid rgba(229,231,235,.95);
  border-radius:var(--radius);
  box-shadow: var(--shadow2);
  overflow:hidden;
}
.faqItem summary{
  cursor:pointer;
  padding:18px 18px;
  font-weight:900;
  list-style:none;
}
.faqItem summary::-webkit-details-marker{display:none}
.faqBody{
  padding:0 18px 18px;
  color:var(--muted);
  font-weight:700;
  line-height:1.6;
}
.centerCTA{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:18px}

/* CONTACT CARD (EK) */
.contactCard{
  background:#fff;
  border:1px solid rgba(229,231,235,.95);
  border-radius:var(--radius);
  padding:22px;
  box-shadow: var(--shadow2);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
}
.contactActions{display:flex;gap:10px;flex-wrap:wrap}
a{color:inherit}
.muted{color:var(--muted);font-weight:700}
.contactCard a{color:var(--blue);font-weight:900;text-decoration:none}
.contactCard a.btn{color:#fff}
.contactCard a.btn.btn--ghost{color:var(--text)}

/* PAGE / PAGECARD (privacy/terms/contact sayfaları için EK) */
.page{padding:42px 0 70px}
.pageCard{
  background:#fff;border:1px solid rgba(229,231,235,.95);
  border-radius:var(--radius);
  padding:26px;
  box-shadow: var(--shadow2);
}
.pageCard h1{font-size:34px;letter-spacing:-.6px;margin-bottom:8px}
.pageCard h2{font-size:18px;margin-top:18px;margin-bottom:8px}
.pageCard p{line-height:1.7}
.pageCard ul{padding-left:18px;line-height:1.8}
.pageCard a{color:var(--blue);font-weight:900;text-decoration:none}

/* FOOTER */
.footer{background:#0b1220;color:#fff;padding:44px 0}
.footer__grid{
  display:grid;grid-template-columns:1fr 1fr 1fr;
  gap:18px;align-items:center;
}
.footer__brand{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.footer__links{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.footer__links a{color:#93c5fd;text-decoration:none;font-weight:800}
.footer__meta{display:flex;justify-content:flex-end}
.footer .muted{color:#cbd5e1}

/* RESPONSIVE */
@media (max-width:980px){
  .hero__grid{grid-template-columns:1fr}
  .stats__grid{grid-template-columns:repeat(2,1fr)}
  .features{grid-template-columns:repeat(2,1fr)}
  .why-grid{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}
  .promoGrid{grid-template-columns:1fr}
  .nav{display:none}
  .hamburger{display:block}
  .mobileNav.is-open{display:block}
  .footer__grid{grid-template-columns:1fr;text-align:center}
  .footer__meta{justify-content:center}
  .slider{grid-template-columns:44px 1fr 44px}
  .slider__btn{width:44px;height:44px}
}

@media (max-width:560px){
  .hero h1{font-size:40px}
  .features{grid-template-columns:1fr}
  .stats__grid{grid-template-columns:1fr}
  .why-grid{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .shot__body{grid-template-columns:1fr}
}