/* OnNet Yönetim tanıtım sayfası — inline stil yok (CSP style-src 'self') */
:root{
  --mavi:#2563EB; --mavi-k:#1D4ED8; --mavi-a:#EFF4FF;
  --koyu:#0F172A; --yazi:#1E293B; --soluk:#64748B; --cizgi:#E2E8F0;
  --zemin:#FFFFFF; --gri:#F8FAFC;
  --kirmizi:#DC2626; --sari:#F59E0B; --yesil:#16A34A;
  --r:14px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--zemin);color:var(--yazi);font:400 17px/1.6 "Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif}
img{max-width:100%;height:auto}
a{color:var(--mavi)}
h1,h2,h3{color:var(--koyu);line-height:1.25;margin:0 0 .6em}
h1{font-size:clamp(1.9rem,4.2vw,2.9rem);letter-spacing:-.02em;font-weight:700}
h2{font-size:clamp(1.45rem,3vw,2rem);letter-spacing:-.01em;font-weight:700}
h3{font-size:1.08rem;font-weight:650}
p{margin:0 0 1em}
.kap{max-width:1120px;margin:0 auto;padding:0 16px}
.ust-etiket{font-size:.82rem;font-weight:650;letter-spacing:.06em;text-transform:uppercase;color:var(--mavi);margin-bottom:.8em}
.soluk{color:var(--soluk)}
.ortada{text-align:center}

/* düğmeler */
.dugme{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 22px;border-radius:10px;font-weight:600;font-size:1rem;text-decoration:none;border:1.5px solid transparent;transition:background .15s,border-color .15s,color .15s}
.dugme.kucuk{min-height:38px;padding:0 16px;font-size:.92rem}
.dugme-ana{background:var(--mavi);color:#fff}
.dugme-ana:hover{background:var(--mavi-k)}
.dugme-ikinci{border-color:var(--cizgi);color:var(--koyu);background:#fff}
.dugme-ikinci:hover{border-color:var(--mavi);color:var(--mavi)}
.dugme-beyaz{background:#fff;color:var(--koyu)}
.dugme-beyaz:hover{background:var(--mavi-a)}
.dugme-cizgi{border-color:rgba(255,255,255,.45);color:#fff}
.dugme-cizgi:hover{border-color:#fff}
.dugme:focus-visible,.ust-menu a:focus-visible,.onekran-imza:focus-visible{outline:3px solid #93C5FD;outline-offset:2px}

/* üst çubuk */
.ust{position:sticky;top:0;z-index:5;background:rgba(255,255,255,.92);backdrop-filter:saturate(1.4) blur(8px);-webkit-backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid var(--cizgi)}
.ust-ic{display:flex;align-items:center;gap:24px;min-height:64px}
.marka{display:flex;flex:none}
.marka img{width:168px;height:auto;display:block}
.ust-menu{display:flex;gap:22px;margin-left:auto}
.ust-menu a{color:var(--yazi);text-decoration:none;font-size:.95rem;font-weight:500}
.ust-menu a:hover{color:var(--mavi)}

/* giriş */
.giris{padding:64px 0 56px;background:linear-gradient(180deg,var(--mavi-a) 0%,#fff 100%)}
.giris-ic{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.giris-alt{font-size:1.1rem;color:#334155;max-width:36em}
.giris-dugmeler{display:flex;flex-wrap:wrap;gap:12px;margin-top:1.6em}
.giris-dugmeler.ortala{justify-content:center}

/* panel çizimi */
.panel-ornek{margin:0;background:#fff;border:1px solid var(--cizgi);border-radius:var(--r);box-shadow:0 20px 50px -24px rgba(15,23,42,.35);overflow:hidden;font-size:.9rem}
.po-ust{display:flex;align-items:center;gap:6px;padding:11px 14px;border-bottom:1px solid var(--cizgi);background:var(--gri)}
.po-ust span{width:9px;height:9px;border-radius:50%;background:#CBD5E1}
.po-ust b{margin-left:8px;font-weight:600;color:var(--koyu)}
.po-sayilar{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:14px}
.po-sayilar div{background:var(--gri);border-radius:10px;padding:10px 12px}
.po-sayilar small{display:block;color:var(--soluk);font-size:.78rem}
.po-sayilar strong{font-size:1.3rem;color:var(--koyu)}
.po-sayilar .kirmizi{color:var(--kirmizi)}
.po-liste{padding:0 14px 12px}
.po-baslik{font-size:.76rem;font-weight:650;text-transform:uppercase;letter-spacing:.05em;color:var(--soluk);margin:.6em 0 .4em}
.po-satir,.tel-satir{display:flex;align-items:center;gap:9px;padding:8px 0;border-top:1px solid var(--cizgi);color:var(--yazi)}
.po-satir button,.tel-satir button{margin-left:auto;font:inherit;font-size:.8rem;font-weight:600;color:#fff;background:var(--mavi);border:0;border-radius:7px;padding:4px 11px;pointer-events:none}
.nokta{width:8px;height:8px;border-radius:50%;flex:none}
.nokta.sari{background:var(--sari)} .nokta.yesil{background:var(--yesil)} .nokta.kirmizi-n{background:var(--kirmizi)}
.panel-ornek figcaption{font-size:.75rem;color:var(--soluk);padding:8px 14px;border-top:1px solid var(--cizgi);background:var(--gri)}

/* bant */
.bant{border-block:1px solid var(--cizgi);background:#fff}
.bant-ic{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;padding-block:22px}
.bant p{margin:0;color:var(--soluk);font-size:.96rem}
.bant b{color:var(--koyu);font-weight:650}

/* bölümler */
.bolum{padding:72px 0}
.bolum.gri{background:var(--gri)}
.bolum > .kap > h2{text-align:center;margin-bottom:1.4em}

.adimlar{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:28px;counter-reset:a}
.adimlar li{position:relative;padding:24px;border:1px solid var(--cizgi);border-radius:var(--r);background:#fff}
.adim-no{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--mavi);color:#fff;font-weight:700;margin-bottom:14px}
.adimlar p{color:#475569;margin:0}

.kartlar{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.kart{background:#fff;border:1px solid var(--cizgi);border-radius:var(--r);padding:24px}
.kart img{display:block;width:40px;height:40px;margin-bottom:14px}
.kart p{color:#475569;margin:0;font-size:.97rem}

.iki-sutun{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center}
.iki-sutun.ters{grid-template-columns:.85fr 1.15fr}
.akis{padding-left:1.3em;margin:0 0 1.2em}
.akis li{margin-bottom:.55em;padding-left:.2em}
.akis b{color:var(--koyu)}
.not{font-size:.92rem;color:var(--soluk);border-left:3px solid var(--cizgi);padding-left:12px}

/* telefon çizimi */
.telefon{margin:0 auto;width:min(100%,280px);background:var(--koyu);border-radius:34px;padding:12px;box-shadow:0 24px 50px -24px rgba(15,23,42,.5)}
.tel-ekran{background:#fff;border-radius:24px;padding:22px 18px 16px;text-align:center}
.tel-ust{font-weight:700;color:var(--koyu);margin-bottom:.3em}
.tel-kisi{font-size:.95rem;color:var(--yazi);margin-bottom:12px}
.tel-kisi small{color:var(--soluk)}
.tel-ekran img{display:block;margin:0 auto;width:132px;height:132px;border:1px solid var(--cizgi);border-radius:10px}
.tel-ag{font-size:.82rem;color:var(--soluk);margin:10px 0 6px}
.tel-satir{font-size:.85rem;text-align:left}

/* kayıtlar */
.kayit-kutu{background:#fff;border:1px solid var(--cizgi);border-radius:var(--r);padding:8px 22px}
.kayit-kutu dl{margin:0}
.kayit-kutu div{padding:14px 0;border-top:1px solid var(--cizgi)}
.kayit-kutu div:first-child{border-top:0}
.kayit-kutu dt{font-weight:650;color:var(--koyu)}
.kayit-kutu dd{margin:2px 0 0;color:var(--soluk);font-size:.95rem}

/* kimler */
.etiketler{list-style:none;padding:0;margin:0 auto 1.4em;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:820px}
.etiketler li{padding:9px 16px;border:1px solid var(--cizgi);border-radius:999px;background:#fff;font-size:.95rem}

/* kapanış */
.kapanis{background:var(--koyu);color:#CBD5E1;padding:72px 0}
.kapanis-ic{text-align:center;max-width:720px}
.kapanis img{width:200px;height:auto;margin-bottom:22px}
.kapanis h2{color:#fff}

/* alt bilgi + ONEkran imzası */
.alt{text-align:center;padding:1.3rem 16px 1.7rem;background:var(--koyu);border-top:1px solid rgba(255,255,255,.08)}
.onekran-imza{display:inline-flex;align-items:center;gap:7px;font-size:13px;line-height:1;color:#94A3B8;opacity:.9;text-decoration:none}
.onekran-imza:hover{opacity:1}
.onekran-imza img{width:16px;height:16px;flex:none}
.onekran-imza b{font-weight:700;background:linear-gradient(90deg,#0c74f5,#12c6f1);-webkit-background-clip:text;background-clip:text;color:transparent}

/* dar ekran */
@media (max-width:900px){
  .giris-ic,.iki-sutun,.iki-sutun.ters{grid-template-columns:1fr;gap:36px}
  .iki-sutun.ters .kayit-kutu{order:2}
  .kartlar{grid-template-columns:repeat(2,1fr)}
  .adimlar{grid-template-columns:1fr}
}
@media (max-width:640px){
  body{font-size:16px}
  .ust-menu{display:none}
  .ust-ic{justify-content:space-between;min-height:58px}
  .marka img{width:140px}
  .giris{padding:40px 0 40px}
  .giris-dugmeler .dugme{flex:1 1 100%}
  .bant-ic{grid-template-columns:1fr;gap:10px}
  .bolum,.kapanis{padding:52px 0}
  .kartlar{grid-template-columns:1fr}
  .po-sayilar strong{font-size:1.1rem}
}