/* Kâr Paneli — SaaS vitrini (yeşil + lacivert; finansal güven havası) */
:root{
  --yesil:#16a34a; --yesil-koyu:#15803d; --yesil-acik:#dcfce7;
  --lacivert:#0f2747; --lacivert-2:#1c3a5e;
  --kirmizi:#dc2626; --kirmizi-acik:#fee2e2;
  --turuncu:#ea580c; --turuncu-acik:#ffedd5;
  --bg:#f5f8fc; --kart:#fff; --cizgi:#e6ecf4;
  --metin:#14213d; --soluk:#5c6b7e;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--metin);background:#fff;line-height:1.55;-webkit-font-smoothing:antialiased}
.kap{max-width:1160px;margin:0 auto;padding:0 22px}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.renk-yesil{color:var(--yesil)} .renk-kirmizi{color:var(--kirmizi)}
.vurgu{color:var(--yesil)} .vurgu-acik{color:#86efac}

/* Butonlar */
.btn{display:inline-flex;align-items:center;gap:7px;font-weight:700;font-size:15px;padding:11px 20px;border-radius:10px;transition:.15s;cursor:pointer;border:1px solid transparent;white-space:nowrap}
.btn-yesil{background:var(--yesil);color:#fff;box-shadow:0 6px 16px rgba(22,163,74,.25)}
.btn-yesil:hover{background:var(--yesil-koyu)}
.btn-dis{background:#fff;color:var(--lacivert);border-color:var(--cizgi)}
.btn-dis:hover{border-color:var(--lacivert)}
.btn-beyaz{background:#fff;color:var(--yesil-koyu)}
.btn-beyaz:hover{background:var(--yesil-acik)}
.btn-buyuk{padding:14px 26px;font-size:16px}

/* Üst menü */
.ust{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--cizgi)}
.ust-ic{display:flex;align-items:center;justify-content:space-between;height:66px}
.logo{display:flex;align-items:center;gap:9px;font-weight:800;font-size:19px;color:var(--lacivert)}
.logo-im{width:30px;height:30px;border-radius:8px;background:linear-gradient(135deg,var(--yesil),#22c55e);padding:5px}
.menu{display:flex;gap:24px}
.menu a{color:var(--soluk);font-weight:600;font-size:15px}
.menu a:hover{color:var(--yesil)}
.ust-btn{display:flex;gap:10px;align-items:center}

/* Hero */
.hero{background:linear-gradient(180deg,#eef5fb 0%,#fff 70%);padding:60px 0 70px;overflow:hidden}
.hero-ic{display:grid;grid-template-columns:1fr 1.05fr;gap:50px;align-items:center}
.rozet{display:inline-block;background:#fff;border:1px solid var(--cizgi);color:var(--lacivert-2);font-weight:600;font-size:13px;padding:6px 14px;border-radius:999px;margin-bottom:20px;box-shadow:0 2px 8px rgba(15,39,71,.05)}
.hero h1{font-size:46px;line-height:1.1;letter-spacing:-.7px;color:var(--lacivert);margin-bottom:18px}
.hero p{font-size:17px;color:var(--soluk);max-width:540px;margin-bottom:26px}
.hero-btn{display:flex;gap:13px;flex-wrap:wrap}
.hero-plat{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--soluk);margin-top:20px}
.hero-plat .ayrac{color:var(--cizgi)}
.nokta{width:8px;height:8px;border-radius:50%;display:inline-block}
.nokta.yesil{background:var(--yesil)} .nokta.turuncu{background:var(--turuncu)} .nokta.kirmizi{background:var(--kirmizi)}

/* Hero composite */
.hero-gorsel{position:relative;min-height:340px}
.komp-ana{background:#fff;border:1px solid var(--cizgi);border-radius:16px;padding:18px 18px 8px;box-shadow:0 24px 60px rgba(15,39,71,.16);position:relative;z-index:1}
.komp-bas{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:700;color:var(--lacivert);margin-bottom:14px}
.komp-rozet{font-size:11px;font-weight:700;color:var(--yesil);background:var(--yesil-acik);padding:3px 9px;border-radius:999px}
.komp-metrik{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:6px}
.komp-metrik div{background:var(--bg);border-radius:10px;padding:10px}
.komp-metrik span{display:block;font-size:10px;color:var(--soluk);text-transform:uppercase;letter-spacing:.3px}
.komp-metrik b{font-size:15px;color:var(--lacivert)}
.komp-metrik .m-kar{background:var(--yesil-acik)}
.komp-metrik .m-kar b{color:var(--yesil-koyu)}
.komp-grafik{width:100%;height:80px;display:block;margin-top:6px}
.komp-zarar{position:absolute;left:-14px;bottom:-26px;width:230px;background:#fff;border:1px solid var(--cizgi);border-radius:14px;padding:13px 14px;box-shadow:0 18px 40px rgba(15,39,71,.18);z-index:2}
.kz-bas{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:800;color:var(--lacivert);margin-bottom:9px}
.kz-satir{display:flex;justify-content:space-between;font-size:12px;padding:4px 0;border-top:1px solid var(--cizgi)}
.kz-satir span{color:var(--soluk)} .kz-satir b{font-weight:700}
.komp-fiyat{position:absolute;right:-18px;top:40px;width:178px;background:#fff;border:1px solid var(--cizgi);border-radius:14px;padding:13px 14px;box-shadow:0 18px 40px rgba(15,39,71,.18);z-index:3}
.kf-row{display:flex;justify-content:space-between;font-size:12.5px;padding:4px 0;color:var(--soluk)}
.kf-row b{color:var(--lacivert)}
.kf-btn{margin-top:8px;background:var(--yesil);color:#fff;font-size:12px;font-weight:700;text-align:center;padding:8px;border-radius:8px}

/* Bölüm başlığı / etiket */
.bolum-bas{text-align:center;max-width:660px;margin:0 auto 42px}
.bolum-bas h2{font-size:33px;letter-spacing:-.5px;color:var(--lacivert);margin-bottom:12px}
.bolum-bas p{color:var(--soluk);font-size:17px}
.etiket{display:inline-block;font-size:13px;font-weight:700;color:var(--yesil-koyu);background:var(--yesil-acik);padding:5px 13px;border-radius:999px;margin-bottom:14px}
.etiket.ortala{margin-inline:auto}

/* 3 fayda */
.faydalar{padding:66px 0}
.fayda-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.fayda{background:#fff;border:1px solid var(--cizgi);border-radius:16px;padding:30px 26px;transition:.15s}
.fayda:hover{box-shadow:0 14px 34px rgba(15,39,71,.09);transform:translateY(-3px)}
.fayda-im{width:54px;height:54px;border-radius:14px;display:grid;place-items:center;margin-bottom:18px}
.fayda-im svg{width:26px;height:26px}
.kirmizi-im{background:var(--kirmizi-acik);color:var(--kirmizi)}
.lacivert-im{background:#e6edf6;color:var(--lacivert)}
.yesil-im{background:var(--yesil-acik);color:var(--yesil)}
.fayda h3{font-size:19px;color:var(--lacivert);margin-bottom:8px}
.fayda p{color:var(--soluk);font-size:15px}

/* Vitrin: fiyat düşürmeden önce kârını gör */
.vitrin{padding:66px 0;background:var(--lacivert);color:#fff}
.vitrin-ic{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.vitrin .etiket{background:rgba(134,239,172,.15);color:#86efac}
.vitrin h2{font-size:34px;letter-spacing:-.5px;margin-bottom:16px;color:#fff}
.vitrin h2 .vurgu{color:#86efac}
.vitrin-sol>p{color:#b9c6d6;font-size:16px;margin-bottom:20px}
.vitrin-sol b{color:#fff}
.vitrin-list{list-style:none;display:flex;flex-direction:column;gap:11px}
.vitrin-list li{display:flex;align-items:center;gap:10px;font-size:15px;color:#dbe4ee}
.vitrin-list svg{width:20px;height:20px;flex-shrink:0}
.ornek-kart{background:#fff;color:var(--metin);border-radius:18px;padding:24px;box-shadow:0 24px 60px rgba(0,0,0,.3)}
.ok-bas{font-weight:800;color:var(--lacivert);font-size:15px;padding-bottom:12px;margin-bottom:6px;border-bottom:1px solid var(--cizgi)}
.ok-row{display:flex;justify-content:space-between;align-items:center;padding:9px 0;font-size:15px;color:var(--soluk)}
.ok-row b{color:var(--lacivert);font-size:16px}
.ok-sonuc{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;margin:8px 0;border-radius:10px;font-weight:700;background:var(--kirmizi-acik);color:var(--kirmizi)}
.ok-sonuc b{color:var(--kirmizi);font-size:18px}
.ok-row.onerilen{border-top:1px dashed var(--cizgi);margin-top:4px;padding-top:12px}
.ok-row.onerilen b{font-size:19px}

/* Ekran çerçevesi + callout */
.motor{padding:66px 0}
.urun{padding:66px 0;background:var(--bg)}
.ss-cerceve{position:relative;max-width:920px;margin:0 auto;border-radius:18px;padding:14px;background:linear-gradient(135deg,#eef5fb,#e7f6ee);border:1px solid var(--cizgi)}
.ss-cerceve img{border-radius:12px;box-shadow:0 18px 44px rgba(15,39,71,.16);border:1px solid var(--cizgi)}
.callout{position:absolute;background:#fff;border:1px solid var(--cizgi);border-radius:999px;padding:7px 13px;font-size:13px;font-weight:700;color:var(--lacivert);box-shadow:0 8px 22px rgba(15,39,71,.16);white-space:nowrap}
.callout.c1{top:24px;left:-10px}
.callout.c2{top:64px;right:-10px}
.callout.c3{bottom:30px;left:30px}

/* Toplu fiyatlandırma demo mockup */
.demo-tablo{max-width:860px;margin:0 auto;background:#fff;border:1px solid var(--cizgi);border-radius:16px;box-shadow:0 20px 50px rgba(15,39,71,.12);overflow:hidden}
.dt-bar{display:flex;justify-content:space-between;align-items:center;padding:15px 20px;background:var(--lacivert);color:#fff;font-size:14px}
.dt-mod{font-size:12.5px;font-weight:700;background:rgba(134,239,172,.2);color:#86efac;padding:4px 11px;border-radius:999px}
.dt-grid{display:grid;grid-template-columns:2.2fr 1fr 1fr 1fr 1fr 1.2fr;align-items:center;gap:8px;padding:13px 20px;font-size:14px;border-top:1px solid var(--cizgi)}
.dt-grid span:not(.dt-ad):not(.risk-rozet){text-align:right;color:var(--lacivert);font-weight:600}
.dt-head{background:var(--bg);border-top:none;font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--soluk)}
.dt-head span{color:var(--soluk)!important;font-weight:700}
.dt-ad{font-weight:700;color:var(--lacivert)}
.risk-rozet{justify-self:end;font-size:11px;font-weight:700;padding:3px 10px;border-radius:999px}
.risk-rozet.dusuk{background:var(--yesil-acik);color:var(--yesil-koyu)}
.risk-rozet.orta{background:#fef9c3;color:#a16207}
.risk-rozet.yuksek{background:var(--turuncu-acik);color:var(--turuncu)}
.dt-alt{display:flex;justify-content:space-between;align-items:center;padding:15px 20px;background:var(--bg);border-top:1px solid var(--cizgi);font-size:13.5px;color:var(--soluk)}
.dt-btn{background:var(--yesil);color:#fff;font-weight:700;padding:8px 18px;border-radius:9px}

/* Şeffaf hesap kırılımı (iade vurgulu) */
.kirilim{padding:66px 0}
.kirilim-ic{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.kirilim-sol h2{font-size:32px;letter-spacing:-.5px;color:var(--lacivert);margin-bottom:14px}
.kirilim-sol h2 .vurgu{color:var(--kirmizi)}
.kirilim-sol>p{color:var(--soluk);font-size:16px;margin-bottom:14px}
.kirilim-sol b{color:var(--lacivert)}
.kirilim-not{display:inline-block;background:var(--turuncu-acik);color:#9a3412;font-size:14px;padding:9px 14px;border-radius:10px}
.kirilim-not b{color:#9a3412}
.kirilim-kart{background:#fff;border:1px solid var(--cizgi);border-radius:18px;padding:24px;box-shadow:0 20px 50px rgba(15,39,71,.12);max-width:420px;margin-left:auto}
.kk-bas{font-weight:800;color:var(--lacivert);font-size:14px;padding-bottom:12px;margin-bottom:6px;border-bottom:1px solid var(--cizgi)}
.kk-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;font-size:15px;color:var(--soluk)}
.kk-row b{color:var(--lacivert)}
.kk-row em{font-style:normal;font-size:12px;color:var(--turuncu)}
.kk-row.neg b{color:var(--kirmizi)}
.kk-net{display:flex;justify-content:space-between;align-items:center;margin-top:10px;padding:13px 16px;border-radius:12px;background:var(--yesil-acik)}
.kk-net span{font-weight:700;color:var(--yesil-koyu)}
.kk-net b{font-size:20px;color:var(--yesil-koyu)}

/* Kâr Paneli temiz mockup */
.panel-mockup{max-width:880px;margin:0 auto;background:#fff;border:1px solid var(--cizgi);border-radius:18px;box-shadow:0 20px 50px rgba(15,39,71,.12);padding:22px}
.pm-kartlar{display:grid;grid-template-columns:1fr 1fr 1.3fr;gap:14px;margin-bottom:16px}
.pm-kart{background:var(--bg);border:1px solid var(--cizgi);border-radius:13px;padding:15px}
.pm-kart.vurgu{background:linear-gradient(135deg,#eef5fb,#e7f6ee);border-color:var(--yesil)}
.pm-bas{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:700;color:var(--soluk);text-transform:uppercase;letter-spacing:.3px;margin-bottom:10px}
.pm-rozet{font-size:10px;color:var(--yesil);text-transform:none;letter-spacing:0}
.pm-satis{font-size:13px;color:var(--soluk)}
.pm-kar{font-size:19px;font-weight:800;color:var(--yesil-koyu);margin:3px 0}
.pm-alt{font-size:12px;color:var(--soluk)}
.pm-list{border-top:1px solid var(--cizgi);padding-top:14px}
.pm-list-bas{font-size:12px;font-weight:700;color:var(--soluk);text-transform:uppercase;letter-spacing:.3px;margin-bottom:8px}
.pm-row{display:flex;justify-content:space-between;align-items:center;padding:7px 0;font-size:14.5px;color:var(--lacivert)}
.pm-row b{font-weight:700}

/* Nasıl çalışır */
.nasil{padding:66px 0}
.adim.adim-vurgu{background:var(--lacivert);border-radius:16px;padding:22px 16px;color:#fff}
.adim.adim-vurgu .adim-im{background:rgba(134,239,172,.18);color:#86efac}
.adim.adim-vurgu h4{color:#fff}
.adim.adim-vurgu p{color:#c8d6e6}
.adim-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.adim{text-align:center;padding:8px}
.adim-im{width:56px;height:56px;border-radius:16px;background:var(--yesil-acik);color:var(--yesil-koyu);display:grid;place-items:center;margin:0 auto 14px}
.adim-im svg{width:26px;height:26px}
.adim h4{font-size:17px;color:var(--lacivert);margin-bottom:6px}
.adim p{color:var(--soluk);font-size:14px}

/* Güvenlik */
.guven{padding:66px 0;background:var(--bg)}
.guven-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.guven-kart{background:#fff;border:1px solid var(--cizgi);border-radius:14px;padding:22px}
.gk-im{font-size:24px;margin-bottom:10px}
.guven-kart h4{font-size:16px;color:var(--lacivert);margin-bottom:6px}
.guven-kart p{font-size:14px;color:var(--soluk)}

/* Platformlar */
.platform{padding:66px 0}
.plat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:760px;margin:0 auto}
.plat-kart{background:#fff;border:1px solid var(--cizgi);border-radius:14px;padding:24px;text-align:center}
.plat-kart.aktif{border-color:var(--yesil);box-shadow:0 10px 26px rgba(22,163,74,.12)}
.plat-ad{font-weight:800;color:var(--lacivert);font-size:18px;margin-bottom:10px}
.durum{font-size:13px;font-weight:700}
.durum.yesil{color:var(--yesil)} .durum.turuncu{color:var(--turuncu)} .durum.gri{color:var(--soluk)}

/* SSS */
.sss{padding:66px 0;background:var(--bg)}
.sss-list{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
.sss-q{background:#fff;border:1px solid var(--cizgi);border-radius:12px;padding:4px 18px}
.sss-q summary{cursor:pointer;font-weight:700;color:var(--lacivert);padding:14px 0;list-style:none;display:flex;justify-content:space-between;align-items:center}
.sss-q summary::-webkit-details-marker{display:none}
.sss-q summary::after{content:"+";font-size:22px;color:var(--yesil);font-weight:400}
.sss-q[open] summary::after{content:"−"}
.sss-q p{color:var(--soluk);font-size:15px;padding:0 0 16px;line-height:1.6}

/* CTA */
.cta{background:linear-gradient(135deg,var(--lacivert),var(--yesil-koyu));padding:66px 0}
.cta-ic{text-align:center}
.cta h2{color:#fff;font-size:32px;letter-spacing:-.5px;margin-bottom:12px}
.cta p{color:#c8d6e6;font-size:17px;margin-bottom:26px}

/* Footer */
.alt{background:#0b1d33;color:#aebfd0;padding:50px 0 28px}
.alt-ic{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;padding-bottom:28px;border-bottom:1px solid rgba(255,255,255,.1)}
.logo-acik{color:#fff}
.alt-marka p{color:#8da3ba;font-size:14px;margin:10px 0 14px;max-width:340px}
.alt-sosyal{display:flex;gap:10px}
.alt-sosyal a{width:34px;height:34px;border-radius:9px;border:1px solid rgba(255,255,255,.14);display:grid;place-items:center;color:#aebfd0}
.alt-sosyal a:hover{color:#fff;border-color:#fff}
.alt-sosyal svg{width:18px;height:18px}
.alt-link{display:flex;flex-direction:column;gap:11px}
.alt-link a{color:#aebfd0;font-size:14px}
.alt-link a:hover{color:#fff}
.alt-telif{padding-top:20px;font-size:13px;color:#6f86a0}

/* Yasal sayfalar */
.yasal{max-width:820px;margin:0 auto;padding:46px 22px 64px}
.yasal h1{font-size:32px;color:var(--lacivert);margin-bottom:6px;letter-spacing:-.4px}
.yasal-tarih{color:var(--soluk);font-size:14px;margin-bottom:26px}
.yasal h2{font-size:20px;color:var(--lacivert);margin:28px 0 10px}
.yasal h3{font-size:16px;color:var(--lacivert);margin:18px 0 6px}
.yasal p,.yasal li{color:#28384a;font-size:15px;line-height:1.7;margin-bottom:10px}
.yasal ul{padding-left:22px;margin-bottom:12px}
.yasal a{color:var(--yesil-koyu);font-weight:600}
.yasal .uyari{background:var(--turuncu-acik);color:#9a3412;padding:12px 16px;border-radius:10px;font-size:14px;margin:18px 0}
.yasal .iletisim-kart{background:var(--bg);border:1px solid var(--cizgi);border-radius:14px;padding:22px 24px;margin-top:14px}
.yasal .iletisim-kart b{color:var(--lacivert)}

/* Responsive */
@media (max-width:920px){
  .hero-ic,.vitrin-ic,.kirilim-ic{grid-template-columns:1fr;gap:40px}
  .hero h1{font-size:36px}
  .hero-gorsel{margin-top:10px}
  .komp-fiyat{right:0}
  .fayda-grid,.guven-grid{grid-template-columns:1fr 1fr}
  .adim-grid{grid-template-columns:1fr 1fr}
  .plat-grid{grid-template-columns:1fr}
  .kirilim-kart{margin:0 auto}
  .demo-tablo{overflow-x:auto}
  .dt-grid{min-width:620px}
  .pm-kartlar{grid-template-columns:1fr}
  .menu{display:none}
}
@media (max-width:560px){
  .ust-btn .btn-dis{display:none}
  .fayda-grid,.guven-grid,.adim-grid{grid-template-columns:1fr}
  .hero h1{font-size:30px}
  .komp-zarar{display:none}
  .callout.c2,.callout.c3{display:none}
}
