/* DOA Phone Management — ortak site stili (ana sayfa + alt sayfalar).
   Yazi tipi laixi.app ile ayni: Windows'un Segoe UI'si. */
:root {
  --bg:#ffffff; --band:#f4f6f9; --line:#e3e8ef;
  --text:#10161d; --muted:#55636f; --faint:#8795a3;
  --brand:#1565d8; --brand-hover:#1d7bf2; --brand-soft:rgba(21,101,216,0.10);
  --gold:#b57a06; --gold-soft:rgba(232,168,35,0.16); --dark:#0f141b;
  --ok:#178a57; --err:#d64545;
  --font:"Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono:ui-monospace, "Cascadia Mono", Consolas, monospace;
}
* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { background:var(--bg); color:var(--text); font-family:var(--font); line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
button, input, select { font-family:inherit; }
img { display:block; max-width:100%; }
.wrap { max-width:1200px; margin:0 auto; padding:0 24px; }
[hidden] { display:none !important; }

/* ---------- Ust menu ---------- */
.site-header { position:sticky; top:0; z-index:50; background:rgba(255,255,255,0.94); backdrop-filter:blur(12px); border-bottom:1px solid var(--line); }
.site-header .wrap { display:flex; align-items:center; height:68px; gap:24px; }
.brand { display:flex; align-items:center; gap:10px; font-weight:700; font-size:1.3rem; letter-spacing:-0.01em; white-space:nowrap; }
.brand img { height:34px; width:auto; }
.brand b { color:var(--brand); font-weight:700; }
.brand small { font-size:0.68em; font-weight:600; color:var(--muted); }
nav.top { display:flex; gap:22px; margin-left:8px; }
nav.top a { font-size:0.95rem; font-weight:600; color:#565656; transition:color .2s; white-space:nowrap; }
nav.top a:hover, nav.top a.on { color:var(--brand); }
nav.top a.nav-rent { color:var(--gold); }
nav.top a.nav-rent:hover { color:#8f6005; }
.hdr-right { margin-left:auto; display:flex; align-items:center; gap:10px; }
.lang-btn { border:0; background:none; font-size:0.88rem; color:var(--muted); font-weight:700; cursor:pointer; padding:6px 8px; border-radius:8px; }
.lang-btn:hover { color:var(--brand); background:var(--brand-soft); }
.menu-btn { display:none; border:1px solid var(--line); background:#fff; width:40px; height:40px; border-radius:10px; cursor:pointer; align-items:center; justify-content:center; }
.menu-btn svg { width:20px; height:20px; stroke:var(--text); stroke-width:2; fill:none; stroke-linecap:round; }
.mnav { display:none; border-top:1px solid var(--line); background:#fff; padding:8px 16px 16px; }
.mnav a { display:block; padding:11px 4px; font-weight:600; color:#444; border-bottom:1px solid var(--line); }
.mnav a:last-child { border-bottom:0; }
.mnav.open { display:block; }

/* ---------- Butonlar ---------- */
.pill { display:inline-flex; align-items:center; justify-content:center; gap:10px; background:var(--brand); color:#fff; font-weight:600; font-size:0.95rem; border-radius:999px; padding:9px 22px; border:1.5px solid var(--brand); cursor:pointer; transition:background .2s, transform .2s, color .2s; white-space:nowrap; }
.pill:hover { background:var(--brand-hover); border-color:var(--brand-hover); transform:translateY(-1px); }
.pill.ghost { background:transparent; color:var(--brand); }
.pill.ghost:hover { background:var(--brand-soft); }
.pill:disabled { opacity:.55; cursor:default; transform:none; }
.pill.big { font-size:1.1rem; padding:0 36px; height:62px; }
.pill.big:not(.ghost) { box-shadow:0 10px 30px rgba(21,101,216,0.28); }
.pill svg { width:22px; height:22px; flex-shrink:0; }
.pill small { font-size:0.72em; font-weight:600; opacity:0.75; }

/* ---------- Alt sayfa basligi ---------- */
.page-hero { background:var(--band); border-bottom:1px solid var(--line); padding:64px 0 52px; text-align:center; }
.page-hero .kicker { display:inline-block; font-size:0.8rem; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--brand); background:var(--brand-soft); border-radius:999px; padding:5px 14px; margin-bottom:18px; }
.page-hero h1 { font-size:clamp(2rem, 4vw, 2.8rem); font-weight:600; letter-spacing:-0.02em; line-height:1.2; }
.page-hero h1 span { color:var(--brand); }
.page-hero p { color:var(--muted); font-size:1.1rem; max-width:680px; margin:16px auto 0; }
.page-body { padding:56px 0 96px; }

/* ---------- Kartlar ---------- */
.card { background:#fff; border:1px solid var(--line); border-radius:16px; padding:28px; box-shadow:0 1px 2px rgba(16,22,29,0.04); transition:border-color .2s, box-shadow .2s, transform .2s; }
.card.hover:hover { border-color:rgba(21,101,216,0.4); box-shadow:0 14px 36px rgba(21,101,216,0.12); transform:translateY(-2px); }
.card h3 { font-size:1.3rem; font-weight:600; margin-bottom:8px; }
.card p { color:var(--muted); }
.ic-box { width:52px; height:52px; border-radius:14px; background:var(--brand-soft); color:var(--brand); display:grid; place-items:center; margin-bottom:18px; }
.ic-box svg { width:26px; height:26px; stroke:currentColor; stroke-width:1.8; fill:none; stroke-linecap:round; stroke-linejoin:round; }
.ic-box.fill svg { fill:currentColor; stroke:none; }
.muted-c { color:var(--muted); text-align:center; padding:24px 0; }
.msg { min-height:20px; font-size:0.88rem; margin-top:10px; line-height:1.5; }
.msg.ok { color:var(--ok); } .msg.err { color:var(--err); }

/* ---------- Footer ---------- */
.site-footer { border-top:1px solid var(--line); padding:28px 0; font-size:0.86rem; color:var(--faint); }
.site-footer .wrap { display:flex; flex-wrap:wrap; gap:10px 24px; justify-content:space-between; }
.site-footer a { color:var(--muted); }
.site-footer a:hover { color:var(--brand); }
.site-footer .links { display:flex; flex-wrap:wrap; gap:6px 16px; }

/* ---------- Uye ol / giris penceresi ---------- */
.modal { position:fixed; inset:0; z-index:100; background:rgba(10,14,20,0.55); display:none; align-items:center; justify-content:center; padding:16px; }
.modal.open { display:flex; }
.auth { background:#fff; border-radius:16px; width:100%; max-width:430px; max-height:calc(100vh - 32px); overflow:auto; padding:28px; position:relative; box-shadow:0 30px 80px rgba(0,0,0,0.3); }
.auth .x { position:absolute; right:14px; top:12px; border:0; background:none; font-size:1.6rem; line-height:1; color:var(--faint); cursor:pointer; }
.auth .tabs { display:flex; gap:6px; background:var(--band); border-radius:10px; padding:4px; margin-bottom:20px; }
.auth .tabs button { flex:1; border:0; background:transparent; padding:9px; border-radius:8px; font-weight:600; font-size:0.95rem; color:var(--muted); cursor:pointer; }
.auth .tabs button.on { background:#fff; color:var(--text); box-shadow:0 1px 3px rgba(0,0,0,0.08); }
.auth h2 { font-size:1.4rem; font-weight:600; margin-bottom:6px; }
.auth .hint { font-size:0.85rem; color:var(--muted); margin-bottom:16px; }
.auth .hint b { color:var(--text); }
.auth input[type=text], .auth input[type=tel], .auth input[type=email], .auth input[type=password] { width:100%; border:1px solid var(--line); background:#f8fafc; border-radius:8px; padding:11px 14px; font-size:0.95rem; margin-bottom:9px; color:var(--text); }
.auth input:focus { outline:2px solid rgba(21,101,216,0.35); border-color:var(--brand); }
.auth label.accept { display:flex; gap:8px; font-size:0.82rem; color:var(--muted); margin:6px 0 14px; align-items:flex-start; cursor:pointer; }
.auth label.accept input { margin-top:3px; accent-color:var(--brand); }
.auth a { color:var(--brand); }
.auth .pill { width:100%; height:46px; }
.auth .forgot { font-size:0.85rem; margin-top:12px; text-align:center; }
.auth .sep { font-size:0.78rem; color:var(--faint); text-align:center; margin-top:14px; }

@media (max-width:1100px) {
  nav.top { display:none; }
  .menu-btn { display:inline-flex; }
}
@media (max-width:560px) {
  .wrap { padding:0 16px; }
  .brand span { display:none; }
  .hdr-right .ghost { display:none; }
  .pill.big { width:100%; height:56px; font-size:1rem; padding:0 20px; }
  .page-hero { padding:44px 0 36px; }
  .card { padding:22px; }
}