/* ==========================================================================
   PayStore — Kurumsal Tanıtım Sitesi (mavi-beyaz)
   Harici CDN yok, sistem font yığını.
   ========================================================================== */

:root{
    --mavi:#1657d0;
    --mavi-koyu:#0f3d94;
    --mavi-acik:#e9f1ff;
    --lacivert:#0b1f3a;
    --gok:#eaf2ff;
    --bg:#ffffff;
    --bg-yumusak:#f5f8fd;
    --metin:#48566d;
    --metin-koyu:#16233b;
    --kenar:#e4ebf5;
    --beyaz:#ffffff;
    --yesil:#12b76a;
    --golge-sm:0 1px 2px rgba(11,31,58,.06);
    --golge:0 8px 30px rgba(15,61,148,.08);
    --golge-lg:0 24px 60px rgba(15,61,148,.14);
    --radius:16px;
    --radius-sm:12px;
    --gecis:.22s cubic-bezier(.4,0,.2,1);
    --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
    margin:0;font-family:var(--font);color:var(--metin);background:var(--bg);
    line-height:1.65;font-size:16px;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
h1,h2,h3,h4{color:var(--metin-koyu);line-height:1.2;margin:0 0 .5em;font-weight:800;letter-spacing:-.02em;}
p{margin:0 0 1rem;}
a{color:var(--mavi);text-decoration:none;transition:color var(--gecis);}
a:hover{color:var(--mavi-koyu);}
img{max-width:100%;display:block;}
ul{margin:0;padding:0;list-style:none;}

.kapsayici{max-width:1180px;margin:0 auto;padding:0 24px;width:100%;}
.bolum{padding:96px 0;}
.bolum--yumusak{background:var(--bg-yumusak);}
.bolum--lacivert{background:var(--lacivert);}
.metin-orta{text-align:center;}

.rozet{
    display:inline-block;padding:7px 16px;border-radius:30px;background:var(--mavi-acik);
    color:var(--mavi);font-weight:700;font-size:13px;letter-spacing:.03em;text-transform:uppercase;margin-bottom:18px;
}
.bolum-baslik{font-size:clamp(28px,4vw,42px);margin-bottom:16px;}
.bolum-aciklama{font-size:18px;max-width:680px;margin:0 auto 8px;color:var(--metin);}
.bolum--lacivert .bolum-baslik,.bolum--lacivert h3{color:#fff;}
.bolum--lacivert .bolum-aciklama{color:#aebfd8;}

/* Butonlar */
.btn{
    display:inline-flex;align-items:center;gap:9px;padding:13px 26px;border-radius:11px;
    font-weight:700;font-size:15px;cursor:pointer;border:1px solid transparent;transition:all var(--gecis);white-space:nowrap;
}
.btn svg{width:18px;height:18px;}
.btn--birincil{background:var(--mavi);color:#fff;box-shadow:0 8px 20px rgba(22,87,208,.28);}
.btn--birincil:hover{background:var(--mavi-koyu);color:#fff;transform:translateY(-2px);box-shadow:0 12px 26px rgba(22,87,208,.36);}
.btn--ikincil{background:#fff;color:var(--mavi);border-color:var(--kenar);}
.btn--ikincil:hover{border-color:var(--mavi);color:var(--mavi-koyu);transform:translateY(-2px);}
.btn--hayalet{background:transparent;color:#fff;border-color:rgba(255,255,255,.35);}
.btn--hayalet:hover{background:rgba(255,255,255,.12);color:#fff;border-color:#fff;}
.btn--buyuk{padding:16px 34px;font-size:16px;}

/* ============ HEADER ============ */
.ust{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.86);backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--kenar);}
.ust__ic{display:flex;align-items:center;justify-content:space-between;height:72px;}
.logo{font-size:24px;font-weight:900;letter-spacing:-.03em;color:var(--lacivert);display:flex;align-items:center;gap:2px;}
.logo span{color:var(--mavi);}
.logo__nokta{width:9px;height:9px;border-radius:50%;background:var(--mavi);margin-left:3px;}
.menu{display:flex;align-items:center;gap:6px;}
.menu a{padding:9px 15px;border-radius:9px;color:var(--metin-koyu);font-weight:600;font-size:15px;}
.menu a:hover{background:var(--bg-yumusak);color:var(--mavi);}
.ust__aksiyon{display:flex;align-items:center;gap:12px;}
.ust__giris{font-weight:700;color:var(--metin-koyu);padding:9px 6px;}
.ust__giris:hover{color:var(--mavi);}
.menu-ac{display:none;background:none;border:none;cursor:pointer;padding:8px;color:var(--lacivert);}
.menu-ac svg{width:26px;height:26px;}

/* ============ HERO ============ */
.hero{position:relative;background:linear-gradient(180deg,#f5f9ff 0%,#eaf2ff 100%);overflow:hidden;padding:84px 0 96px;}
.hero::before{content:"";position:absolute;top:-160px;right:-160px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(22,87,208,.14),transparent 70%);}
.hero::after{content:"";position:absolute;bottom:-200px;left:-140px;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(18,181,229,.10),transparent 70%);}
.hero__ic{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;}
.hero__baslik{font-size:clamp(34px,4.6vw,54px);color:var(--lacivert);margin-bottom:22px;}
.hero__baslik em{font-style:normal;color:var(--mavi);}
.hero__alt{font-size:19px;line-height:1.7;margin-bottom:30px;max-width:560px;}
.hero__butonlar{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:30px;}
.hero__mini{display:flex;gap:26px;flex-wrap:wrap;}
.hero__mini div{display:flex;align-items:center;gap:9px;font-weight:600;color:var(--metin-koyu);font-size:14px;}
.hero__mini svg{width:20px;height:20px;color:var(--yesil);flex:none;}

/* Hero görsel — panel/mockup taklidi */
.hero__gorsel{position:relative;}
.mockup{background:#fff;border-radius:18px;box-shadow:var(--golge-lg);border:1px solid var(--kenar);overflow:hidden;}
.mockup__bar{display:flex;align-items:center;gap:7px;padding:14px 16px;border-bottom:1px solid var(--kenar);background:var(--bg-yumusak);}
.mockup__bar span{width:11px;height:11px;border-radius:50%;background:#d5deec;}
.mockup__bar span:nth-child(1){background:#ff6058;}
.mockup__bar span:nth-child(2){background:#ffbd2e;}
.mockup__bar span:nth-child(3){background:#28c840;}
.mockup__ic{padding:20px;}
.mockup__satir{display:flex;align-items:center;gap:14px;padding:14px;border-radius:12px;background:var(--bg-yumusak);margin-bottom:12px;}
.mockup__satir:last-child{margin-bottom:0;}
.mockup__ikon{width:42px;height:42px;border-radius:11px;background:var(--mavi-acik);color:var(--mavi);display:flex;align-items:center;justify-content:center;flex:none;}
.mockup__ikon svg{width:22px;height:22px;}
.mockup__yazi{flex:1;}
.mockup__yazi b{display:block;color:var(--metin-koyu);font-size:14px;}
.mockup__yazi small{color:#8494ad;font-size:12px;}
.mockup__tutar{font-weight:800;color:var(--yesil);font-size:15px;}
.mockup__rozet{position:absolute;background:#fff;border-radius:14px;box-shadow:var(--golge);padding:14px 18px;display:flex;align-items:center;gap:12px;border:1px solid var(--kenar);}
.mockup__rozet svg{width:26px;height:26px;color:var(--mavi);}
.mockup__rozet b{display:block;color:var(--metin-koyu);font-size:18px;line-height:1;}
.mockup__rozet small{color:#8494ad;font-size:11px;}
.mockup__rozet--ust{top:-26px;left:-26px;}
.mockup__rozet--alt{bottom:-24px;right:-20px;}

/* ============ GÜVEN / LOGO ŞERİDİ ============ */
.guven{padding:34px 0;border-bottom:1px solid var(--kenar);background:#fff;}
.guven__yazi{text-align:center;color:#8494ad;font-size:13px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;margin-bottom:18px;}
.guven__liste{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 30px;}
.guven__liste span{color:#5a6a85;font-weight:700;font-size:16px;opacity:.75;}

/* ============ İSTATİSTİK ============ */
.stat-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:20px;}
.stat{background:#fff;border:1px solid var(--kenar);border-radius:var(--radius);padding:28px 20px;text-align:center;box-shadow:var(--golge-sm);}
.stat__sayi{font-size:38px;font-weight:900;color:var(--mavi);line-height:1;letter-spacing:-.03em;}
.stat__etiket{margin-top:8px;color:var(--metin);font-size:14px;font-weight:600;}

/* ============ MODÜL KARTLARI ============ */
.kart-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:52px;}
.kart-grid--3{grid-template-columns:repeat(3,1fr);}
.modul{
    background:#fff;border:1px solid var(--kenar);border-radius:var(--radius);padding:30px 26px;
    transition:transform var(--gecis),box-shadow var(--gecis),border-color var(--gecis);position:relative;overflow:hidden;
}
.modul:hover{transform:translateY(-6px);box-shadow:var(--golge-lg);border-color:#c9d9f2;}
.modul__ikon{width:54px;height:54px;border-radius:14px;background:linear-gradient(135deg,var(--mavi),#2f80ed);display:flex;align-items:center;justify-content:center;margin-bottom:20px;}
.modul__ikon svg{width:27px;height:27px;color:#fff;}
.modul h3{font-size:19px;margin-bottom:10px;}
.modul p{font-size:14.5px;margin-bottom:14px;color:var(--metin);}
.modul__liste li{position:relative;padding-left:24px;font-size:13.5px;color:#5a6a85;margin-bottom:7px;}
.modul__liste li::before{content:"";position:absolute;left:0;top:7px;width:14px;height:14px;border-radius:50%;background:var(--mavi-acik);}
.modul__liste li::after{content:"";position:absolute;left:5px;top:11px;width:4px;height:4px;border-radius:50%;background:var(--mavi);}
.modul__etiket{position:absolute;top:18px;right:18px;background:var(--gok);color:var(--mavi);font-size:11px;font-weight:800;padding:4px 10px;border-radius:20px;letter-spacing:.03em;}
.modul__yetki{margin-top:16px;padding-top:14px;border-top:1px solid var(--kenar);font-size:12px;font-weight:600;line-height:1.45;display:flex;align-items:flex-start;gap:8px;}
.modul__yetki svg{width:15px;height:15px;flex:none;margin-top:1px;}
.modul__yetki--lisans{color:#b45309;}
.modul__yetki--lisans svg{color:#d97706;}
.modul__yetki--serbest{color:#0f7a52;}
.modul__yetki--serbest svg{color:var(--yesil);}
.modul__link{display:inline-flex;align-items:center;gap:6px;margin-top:16px;font-weight:700;font-size:14px;color:var(--mavi);}
.modul__link svg{width:16px;height:16px;transition:transform var(--gecis);}
.modul:hover .modul__link svg{transform:translateX(4px);}

/* ============ ÖZELLİK / İKİLİ BLOK ============ */
.ikili{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
.ikili--ters .ikili__gorsel{order:-1;}
.ikili__gorsel{background:var(--bg-yumusak);border:1px solid var(--kenar);border-radius:var(--radius);padding:32px;box-shadow:var(--golge);}
.ozellik-liste li{display:flex;gap:15px;margin-bottom:20px;}
.ozellik-liste li:last-child{margin-bottom:0;}
.ozellik-liste__ikon{width:44px;height:44px;border-radius:12px;background:var(--mavi-acik);color:var(--mavi);display:flex;align-items:center;justify-content:center;flex:none;}
.ozellik-liste__ikon svg{width:22px;height:22px;}
.ozellik-liste b{color:var(--metin-koyu);display:block;margin-bottom:2px;font-size:16px;}
.ozellik-liste p{margin:0;font-size:14.5px;}
.bolum--lacivert .ozellik-liste b{color:#fff;}
.bolum--lacivert .ozellik-liste p{color:#aebfd8;}
.bolum--lacivert .ozellik-liste__ikon{background:rgba(255,255,255,.1);color:#7fb0ff;}
.bolum--lacivert .ikili__gorsel{background:#0f2646;border-color:#1c3a63;}

/* akış kutucukları (çoklu API) */
.akis{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
.akis__kutu{background:#0f2646;border:1px solid #1c3a63;border-radius:12px;padding:18px;}
.akis__kutu b{color:#7fb0ff;font-size:14px;}
.akis__kutu p{color:#93a6c4;font-size:13px;margin:6px 0 0;}

/* ============ PLATFORM BİLEŞENLERİ ============ */
.bilesen-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:52px;}
.bilesen{display:flex;gap:16px;padding:26px;border:1px solid var(--kenar);border-radius:var(--radius);background:#fff;transition:box-shadow var(--gecis),transform var(--gecis);}
.bilesen:hover{box-shadow:var(--golge);transform:translateY(-4px);}
.bilesen__ikon{width:48px;height:48px;border-radius:12px;background:var(--mavi-acik);color:var(--mavi);display:flex;align-items:center;justify-content:center;flex:none;}
.bilesen__ikon svg{width:24px;height:24px;}
.bilesen b{color:var(--metin-koyu);font-size:16px;display:block;margin-bottom:4px;}
.bilesen p{font-size:14px;margin:0;}

/* ============ ENTEGRASYON DUVARI ============ */
.ent-grup{margin-bottom:34px;}
.ent-grup:last-child{margin-bottom:0;}
.ent-grup__baslik{font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--mavi);margin-bottom:16px;text-align:center;}
.ent-liste{display:flex;flex-wrap:wrap;justify-content:center;gap:11px;}
.ent-liste span{background:#fff;border:1px solid var(--kenar);border-radius:10px;padding:10px 18px;font-weight:600;color:#48566d;font-size:14px;box-shadow:var(--golge-sm);transition:all var(--gecis);}
.ent-liste span:hover{border-color:var(--mavi);color:var(--mavi);transform:translateY(-2px);}

/* ============ FARKLILAŞTIRICI ============ */
.fark-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:52px;}
.fark{display:flex;gap:16px;align-items:flex-start;background:#fff;border:1px solid var(--kenar);border-radius:var(--radius);padding:24px 26px;}
.fark__no{width:38px;height:38px;border-radius:10px;background:var(--mavi);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none;font-size:15px;}
.fark b{color:var(--metin-koyu);display:block;margin-bottom:3px;font-size:16px;}
.fark p{margin:0;font-size:14.5px;}

/* ============ CTA BANDI ============ */
.cta{background:linear-gradient(135deg,var(--mavi-koyu),var(--mavi));border-radius:24px;padding:60px;text-align:center;position:relative;overflow:hidden;box-shadow:var(--golge-lg);}
.cta::before{content:"";position:absolute;top:-80px;right:-60px;width:280px;height:280px;border-radius:50%;background:rgba(255,255,255,.08);}
.cta::after{content:"";position:absolute;bottom:-100px;left:-40px;width:240px;height:240px;border-radius:50%;background:rgba(255,255,255,.06);}
.cta h2{color:#fff;font-size:clamp(26px,3.4vw,38px);position:relative;}
.cta p{color:#d6e4ff;font-size:18px;max-width:600px;margin:0 auto 28px;position:relative;}
.cta__butonlar{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;position:relative;}

/* ============ FOOTER ============ */
.alt{background:var(--lacivert);color:#9fb0cc;padding:70px 0 30px;}
.alt__ust{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;padding-bottom:44px;border-bottom:1px solid #1c3a63;}
.alt__logo{font-size:24px;font-weight:900;color:#fff;margin-bottom:16px;display:inline-block;}
.alt__logo span{color:#5a92ff;}
.alt__marka p{color:#8fa2c0;font-size:14.5px;max-width:320px;}
.alt__sutun h4{color:#fff;font-size:15px;margin-bottom:16px;letter-spacing:.02em;}
.alt__sutun a{display:block;color:#9fb0cc;font-size:14px;padding:6px 0;}
.alt__sutun a:hover{color:#fff;}
.alt__telefon{font-size:20px;font-weight:800;color:#fff;margin-top:4px;}
.alt__alt{display:flex;justify-content:space-between;align-items:center;padding-top:26px;flex-wrap:wrap;gap:12px;font-size:13.5px;color:#7386a5;}

/* ============ MODÜL DETAY SAYFASI ============ */
.msayfa-hero{background:linear-gradient(180deg,#f5f9ff,#eaf2ff);border-bottom:1px solid var(--kenar);padding:56px 0 54px;position:relative;overflow:hidden;}
.msayfa-hero::before{content:"";position:absolute;top:-150px;right:-120px;width:440px;height:440px;border-radius:50%;background:radial-gradient(circle,rgba(22,87,208,.12),transparent 70%);}
.msayfa-hero__ic{position:relative;max-width:840px;}
.msayfa-hero__ustlink{display:inline-flex;align-items:center;gap:6px;color:var(--mavi);font-weight:600;font-size:14px;margin-bottom:16px;}
.msayfa-hero__ustlink svg{width:16px;height:16px;}
.msayfa-hero h1{font-size:clamp(30px,4.4vw,46px);color:var(--lacivert);margin:10px 0 16px;}
.msayfa-hero__alt{font-size:19px;line-height:1.7;max-width:700px;margin-bottom:26px;color:var(--metin);}
.msayfa-hero__butonlar{display:flex;gap:12px;flex-wrap:wrap;}
.msayfa-yetki{display:inline-flex;align-items:flex-start;gap:10px;padding:13px 20px;border-radius:12px;font-weight:600;font-size:14px;line-height:1.45;margin-top:26px;max-width:640px;}
.msayfa-yetki svg{width:18px;height:18px;flex:none;margin-top:1px;}
.msayfa-yetki--lisans{background:#fff7ed;border:1px solid #fed7aa;color:#b45309;}
.msayfa-yetki--lisans svg{color:#d97706;}
.msayfa-yetki--serbest{background:#ecfdf5;border:1px solid #a7f3d0;color:#0f7a52;}
.msayfa-yetki--serbest svg{color:var(--yesil);}

.adimlar{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:52px;}
.adim{position:relative;padding:28px 22px;background:#fff;border:1px solid var(--kenar);border-radius:var(--radius);box-shadow:var(--golge-sm);}
.adim__no{width:40px;height:40px;border-radius:11px;background:var(--mavi);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;margin-bottom:16px;font-size:16px;}
.adim b{color:var(--metin-koyu);display:block;margin-bottom:6px;font-size:16px;}
.adim p{margin:0;font-size:14px;}

.ozet-liste{display:grid;grid-template-columns:repeat(2,1fr);gap:12px 28px;margin-top:16px;}
.ozet-liste li{position:relative;padding-left:28px;font-size:15px;color:#48566d;}
.ozet-liste li::before{content:"";position:absolute;left:0;top:2px;width:18px;height:18px;border-radius:50%;background:rgba(91,226,194,.22);}
.ozet-liste li::after{content:"";position:absolute;left:5px;top:7px;width:8px;height:5px;border-left:2px solid #199e83;border-bottom:2px solid #199e83;transform:rotate(-45deg);}

@media(max-width:900px){ .adimlar{grid-template-columns:repeat(2,1fr);} .ozet-liste{grid-template-columns:1fr;} }
@media(max-width:560px){ .adimlar{grid-template-columns:1fr;} }

/* ============ SCROLL REVEAL ============ */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .6s ease,transform .6s ease;}
.reveal.gorundu{opacity:1;transform:none;}

/* ============ RESPONSIVE ============ */
@media(max-width:980px){
    .hero__ic{grid-template-columns:1fr;gap:44px;}
    .hero__gorsel{max-width:520px;margin:0 auto;}
    .ikili{grid-template-columns:1fr;gap:36px;}
    .ikili--ters .ikili__gorsel{order:0;}
    .stat-grid{grid-template-columns:repeat(3,1fr);}
    .kart-grid,.kart-grid--3{grid-template-columns:repeat(2,1fr);}
    .bilesen-grid{grid-template-columns:repeat(2,1fr);}
    .fark-grid{grid-template-columns:1fr;}
    .akis{grid-template-columns:1fr;}
}
@media(max-width:680px){
    .bolum{padding:64px 0;}
    .menu,.ust__giris{display:none;}
    .menu-ac{display:block;}
    .menu.acik{display:flex;position:absolute;top:72px;left:0;right:0;flex-direction:column;background:#fff;border-bottom:1px solid var(--kenar);padding:14px 24px;gap:2px;box-shadow:var(--golge);}
    .menu.acik a{padding:12px 10px;}
    .stat-grid{grid-template-columns:repeat(2,1fr);}
    .kart-grid,.kart-grid--3,.bilesen-grid{grid-template-columns:1fr;}
    .alt__ust{grid-template-columns:1fr 1fr;gap:28px;}
    .cta{padding:44px 24px;}
    .hero__butonlar .btn{flex:1;justify-content:center;}
}
@media(max-width:420px){
    .stat-grid,.alt__ust{grid-template-columns:1fr;}
}