:root{
  --bg:#0f1218;
  --text:#0f172a;
  --muted:#6b7280;
  --brand:#b94436;
  --brand-2:#d35445;
  --light:#ffffff;
  --card:#ffffff;
  --border:rgba(0,0,0,.08);
  --radius:14px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);background:#fff;line-height:1.6}

/* Containers */
.container{width:min(1140px,92%);margin:0 auto}
.flex{display:flex}
.center{align-items:center}
.between{justify-content:space-between}

/* Header */
.site-header{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid var(--border)}
.logo{font-weight:900;font-size:22px;color:#111;text-decoration:none}
.logo span{color:var(--brand)}
.nav{display:flex;gap:20px;align-items:center}
.nav a{color:#111;text-decoration:none;font-weight:600}
.nav a.active{color:var(--brand)}
.btn{background:linear-gradient(90deg,var(--brand),var(--brand-2));color:#fff;padding:12px 18px;border-radius:999px;text-decoration:none;font-weight:800;display:inline-block}
.btn:hover{filter:brightness(.95)}
.btn.ghost{background:#fff;color:var(--brand);border:2px solid var(--brand)}
.btn.small{padding:8px 14px;font-size:14px}
.btn.full{display:block;text-align:center}
.hamb{display:none;border:0;background:transparent;font-size:26px}

/* Hero */
.hero{background:linear-gradient(180deg,#0b0f1a,#1c2230);color:#fff;padding:72px 0}
.hero h1{font-size:clamp(28px,4vw,44px);line-height:1.2;margin:0 0 10px}
.hero h1 span{color:#ffd9d4}
.hero p{opacity:.92;margin:0 0 16px}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin:12px 0 6px}
.trust{display:flex;gap:20px;flex-wrap:wrap;margin:12px 0 0;padding:0;list-style:none;opacity:.9}

/* Sections */
section{padding:56px 0}
section h2{font-size:clamp(22px,3vw,32px);margin:0 0 18px;font-weight:900}
.grid{display:grid;gap:18px}
.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){.grid.two,.grid.three{grid-template-columns:1fr}}

.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:18px;box-shadow:0 10px 26px rgba(0,0,0,.06)}
.check{padding:0;list-style:none}
.check li{padding-left:26px;position:relative;margin:8px 0}
.check li::before{content:"✓";position:absolute;left:0;top:0;color:var(--brand);font-weight:900}
.note{background:#fff4f3;border:1px solid #ffd9d4;border-radius:var(--radius);padding:18px}

/* Pricing */
.pricing .price{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:20px}
.pricing .price.featured{border-color:var(--brand);box-shadow:0 18px 36px rgba(185,68,54,.18)}

/* Page hero & page body */
.page-hero{background:#f7f7f9;padding:56px 0;border-bottom:1px solid var(--border)}
.page h2{margin-top:0}
.steps{padding-left:18px}
.cta-center{margin-top:12px;text-align:center}

/* Contact form */
.contact{display:grid;gap:12px}
.contact label{display:grid;gap:8px;font-weight:700}
.contact input,.contact textarea{border:1px solid var(--border);border-radius:12px;padding:12px;font:inherit}
.contact input:focus,.contact textarea:focus{outline:none;border-color:#e5a39a;box-shadow:0 0 0 3px rgba(185,68,54,.15)}
.muted{color:var(--muted);font-size:14px}

/* Footer */
.site-footer{background:#0b0f1a;color:#e5e7eb;padding:20px 0}
.site-footer .mini a{color:#cfd2d6;text-decoration:none}
.site-footer .mini a:hover{text-decoration:underline}

/* WhatsApp floating */
.wa-float{position:fixed;left:14px;bottom:18px;background:#25D366;color:#fff;padding:10px 14px;border-radius:999px;text-decoration:none;font-weight:900;box-shadow:0 8px 20px rgba(0,0,0,.25);z-index:50}

/* Mobile nav */
@media (max-width:820px){
  .nav{position:fixed;inset:62px 0 auto 0;background:#fff;border-top:1px solid var(--border);padding:14px;flex-direction:column;gap:12px;display:none}
  .nav.open{display:flex}
  .hamb{display:block}
}


/* === Gösterişli Header / Menü ============================ */
.site-header{
  position: sticky; top: 0; z-index: 50;
  background: rgba(255,255,255,.85);
  backdrop-filter: saturate(180%) blur(16px);
  border-bottom: 1px solid var(--border);
  transition: background .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.site-header.scrolled{
  background: rgba(255,255,255,.95);
  box-shadow: 0 12px 28px rgba(0,0,0,.08);
  border-color: rgba(0,0,0,.06);
}

/* Logo biraz daha güçlü */
.logo{ font-weight: 1000; letter-spacing: .2px; }
.logo span{ background: linear-gradient(90deg,var(--brand),var(--brand-2)); -webkit-background-clip:text; background-clip:text; color: transparent; }

/* Menü linkleri: pill + gradient alt çizgi animasyonu */
.nav{ display:flex; gap: 10px; align-items:center; }
.nav a{
  position: relative;
  color:#111; text-decoration:none; font-weight:800;
  padding: 10px 14px; border-radius: 999px;
  transition: color .2s ease, background .2s ease, transform .15s ease;
}
.nav a:not(.btn)::after{
  content:""; position:absolute; left:14px; right:14px; bottom:6px; height:2px;
  background: linear-gradient(90deg, var(--brand), var(--brand-2));
  transform: scaleX(0); transform-origin: left; transition: transform .25s ease; border-radius:2px;
}
.nav a:hover:not(.btn){ color:#000; }
.nav a:hover:not(.btn)::after{ transform: scaleX(1); }

/* Aktif link: hafif “pill” */
.nav a.active:not(.btn){
  background: rgba(211,84,69,.10);
  color: var(--brand-2);
}

/* Header'daki butonlar daha premium görünsün */
.nav .btn.small{
  padding: 9px 16px; font-size: 14px;
  box-shadow: 0 8px 18px rgba(211,84,69,.25);
}

/* WhatsApp stili (menüde kullanırsan) */
.btn.whats{ background: linear-gradient(90deg,#25D366,#1ebe57); box-shadow: 0 8px 18px rgba(37,211,102,.25); }
.btn.whats:hover{ filter: brightness(.97); }

/* Hamburger'i kabarcık gibi yap */
.hamb{
  display:none; border:0; background:#fff; width:40px; height:40px; border-radius:999px;
  box-shadow: 0 6px 16px rgba(0,0,0,.12);
}

/* Mobil nav paneli: kart gibi */
@media (max-width:820px){
  .nav{
    position: fixed; inset: 62px 12px auto 12px;
    background:#fff; border:1px solid var(--border); border-radius:16px;
    padding:14px; flex-direction:column; gap:8px; display:none;
    box-shadow: 0 16px 40px rgba(0,0,0,.12);
  }
  .nav.open{ display:flex; }
  .hamb{ display:block; }
  .nav a{ width:100%; text-align:center; }
}


/* ==========================================================
   İLETİŞİM (formsuz) — Telefon + WhatsApp odaklı sayfa
   ========================================================== */

/* Hero biraz daha canlı olsun */
.page-hero{
  background: linear-gradient(135deg,#fff4f3 0%, #f6f7fb 50%, #ffffff 100%);
  border-bottom: 1px solid rgba(0,0,0,.06);
}

/* Sol sütun kartı (contact) */
.page .contact{
  display:block;                     /* güvence */
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius:16px;
  padding:24px clamp(18px,2.6vw,28px);
  box-shadow: 0 18px 40px rgba(0,0,0,.08);
  backdrop-filter: saturate(140%) blur(4px);
}
.page .contact h2{ margin-top:0; font-weight:900; color:#0f172a }

/* Telefon & WhatsApp butonları (ikonlu) */
.page .contact a.btn.full{
  position: relative;
  text-align:center;
  padding-left:48px;                 /* ikon için boşluk */
  font-size:16px;
  border-radius:14px;
  box-shadow: 0 14px 30px rgba(185,68,54,.18);
}
.page .contact a.btn.full::before{
  content:""; position:absolute; left:16px; top:50%; transform:translateY(-50%);
  width:22px; height:22px; background-repeat:no-repeat; background-size:22px 22px;
}

/* Telefon butonu */
.page .contact a[href^="tel:"].btn.full{
  background: linear-gradient(90deg,#111,#2b2b2b);
  box-shadow: 0 14px 30px rgba(0,0,0,.20);
}
.page .contact a[href^="tel:"].btn.full::before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.6 11.6 0 0 0 3.6.6 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 7a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1 11.6 11.6 0 0 0 .6 3.6 1 1 0 0 1-.25 1Z'/%3E%3C/svg%3E");
}

/* WhatsApp butonu */
.page .contact a[href*="wa.me"].btn.full{
  background: linear-gradient(90deg,#25D366,#1ebe57);
  box-shadow: 0 14px 30px rgba(37,211,102,.25);
}
.page .contact a[href*="wa.me"].btn.full::before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 24 24'%3E%3Cpath d='M20 12a8 8 0 1 1-15.3 3.6L3 21l5.5-1.6A8 8 0 1 1 20 12Zm-11.7-.8c.2-.5.3-.5.6-.5h.5c.2 0 .4 0 .5.4.2.5.6 1.6.6 1.6s.1.3-.1.5l-.4.5c-.1.1 0 .3 0 .4.2.2.7.9 1.6 1.4.8.4 1.4.5 1.6.4.2-.1.5-.6.7-.9.1-.2.3-.2.5-.1l1.6.8c.2.1.4.2.3.5-.1.5-.6 1.4-1.4 1.6-.7.2-1.9.2-3.3-.4-1.4-.6-3.1-2-3.6-2.7-.5-.7-1.2-1.9-1.3-3-.1-.9.3-1.6.5-1.9Z'/%3E%3C/svg%3E");
}

/* Hızlı maddeler listesi */
.page .contact .check{ margin-top:16px }
.page .contact .check li{ margin:8px 0 }

/* Sağ sütun kart/nota stilini güçlendir (HTML aynı kalabilir) */
.page .contact + div{
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius:16px;
  padding:24px clamp(18px,2.6vw,28px);
  box-shadow: 0 12px 26px rgba(0,0,0,.07);
}
.page .contact + div h2{ margin-top:0; font-weight:900 }

/* Grid hizalama ve boşluklar */
.page .container.grid.two{
  align-items: flex-start;
  gap: clamp(18px,2.5vw,28px);
}

/* Yüzen WhatsApp üstte kalsın */
.wa-float{ z-index: 9999; }

/* Küçük ekran uyumu */
@media (max-width: 780px){
  .page .contact,
  .page .contact + div{ padding:18px }
}

/* 4 sütunlu pricing grid */
.grid.four{ grid-template-columns: 1fr; }                /* mobil */
@media (min-width: 640px){ .grid.four{ grid-template-columns: repeat(2,1fr); } }   /* tablet dikey */
@media (min-width: 900px){ .grid.four{ grid-template-columns: repeat(3,1fr); } }   /* tablet yatay */
@media (min-width: 1200px){ .grid.four{ grid-template-columns: repeat(4,1fr); } }  /* masaüstü: 4 yan yana */



/* --- SEO/UX: Breadcrumbs & long-form typography --- */
.breadcrumbs{background:transparent;margin:12px 0 18px}
.breadcrumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:0;color:var(--muted)}
.breadcrumbs a{color:inherit;text-decoration:none}
.breadcrumbs li::after{content:"/";margin-left:8px;opacity:.5}
.breadcrumbs li:last-child::after{content:""}
.page .content-prose{max-width:900px}
.content-prose p{line-height:1.75}
.content-prose h2{margin-top:26px}
.content-prose h3{margin-top:18px}
.content-prose ul{line-height:1.7}