/* GENEL GÖVDE ve FONT */
body {
    font-family: 'Roboto', sans-serif;
    font-size: 16px; /* OKUNABİLİRLİK İÇİN EKLENDİ */
    line-height: 1.6; /* SATIR ARALIĞI DAHA RAHAT OKUNSUN */
    margin:0;
    padding:0;
    color:#333;
    background:#fff;
}

/* Linkler */
a { text-decoration:none; color:#333; }

/* Container */
.container {
    max-width:1200px;
    margin:0 auto;
    padding:20px;
}

/* --------- TİPOGRAFİ (TUTARLI) --------- */
h1 { font-size: 2.2rem; line-height: 1.2; margin: 0 0 16px; }
h2 { font-size: 1.7rem; line-height: 1.3; margin: 0 0 16px; }
h3 { font-size: 1.25rem; line-height: 1.35; margin: 0 0 12px; }

/* HEADER */
header {
    background:#fff;
    border-bottom:2px solid #f2f2f2;
}
header .container {
    display:flex;
    align-items:center;
    justify-content:space-between;
}
header .logo img { max-height:60px; }

/* Menü */
header nav ul {
    list-style:none;
    display:flex;
    margin:0;
    padding:0;
}
header nav ul li { margin-left:20px; }
header nav ul li a {
    color:#333;
    padding:8px;
    font-weight:500;
    transition:all 0.3s;
    font-size:1em; /* EKLENDİ */
}
header nav ul li a:hover {
    color:#FF6F00;
    border-bottom:2px solid #FF6F00;
}

/* HERO */
.hero {
    background:#f9f9f9 url('/assets/uploads/hero-home.jpg') center/cover no-repeat;
    text-align:center;
    padding:80px 20px;
    color:#fff;
    position:relative;
}
.hero::after {
    content:"";
    position:absolute;
    top:0; left:0; width:100%; height:100%;
    background:rgba(0,0,0,0.4);
}
.hero .container { position:relative; z-index:2; }
.hero h1 { font-size:2.5em; margin:0; color:#fff; }
.hero p { font-size:1.2em; margin:10px 0 0 0; }

/* BUTON */
.button{
    display:inline-block;
    background:#FF6F00;
    color:#fff;
    padding:10px 20px;
    border-radius:4px;
    margin-top:10px;
    transition:0.3s;
    font-weight:500;
    font-size:1em;
}
.button:hover { background:#e65c00; }

/* ABOUT */
.about { padding:40px 0; background:#fff; }
.about h2 { color:#FF6F00; margin-bottom:24px; }
.about p { font-size:1.05em; }

/* HİZMETLER */
.services { background:#f9f9f9; padding:40px 0; }
.services h2 { color:#FF6F00; text-align:center; margin-bottom:24px; }

/* Hizmet Kartları - Klasik Grid */
.service-cards {
    display:flex; flex-wrap:wrap; gap:20px; justify-content:center;
}
.service-card {
    background:#fff; border:1px solid #ddd; padding:20px; width:280px;
    box-sizing:border-box; text-align:center; transition:0.3s;
}
.service-card:hover { box-shadow:0 2px 10px rgba(0,0,0,0.1); }
.service-card h3 { color:#FF6F00; margin:0 0 10px 0; }
.service-card p { font-size:1em; }

/* PROJE ve BLOG */
.project-list, .blog-list {
    display:flex; flex-wrap:wrap; gap:20px; justify-content:center;
}
.project-card, .blog-card {
    width:280px; border:1px solid #ddd; padding:15px; background:#fff; box-sizing:border-box;
}
.project-card img, .blog-card img { width:100%; height:auto; margin-bottom:10px; }

/* FAQ */
.faq-item { border-bottom:1px solid #ddd; padding:10px 0; }
.faq-item h3 { color:#FF6F00; margin:0 0 5px 0; }

/* FOOTER */
footer { background:#333; color:#fff; text-align:center; padding:20px; font-size:1em; }

/* CONTACT FORM */
.modern-contact-form{
    background:#f9f9f9; padding:20px; border:1px solid #ddd; border-radius:6px;
    box-shadow:0 2px 6px rgba(0,0,0,0.1);
}
.modern-contact-form .form-group{ margin-bottom:15px; }
.modern-contact-form input,
.modern-contact-form textarea{
    width:100%; padding:12px; border:1px solid #ccc; border-radius:4px; box-sizing:border-box; font-size:1em;
}
.modern-contact-form input:focus,
.modern-contact-form textarea:focus{ border-color:#FF6F00; outline:none; }
.modern-contact-form button{
    background:#FF6F00; color:#fff; padding:12px 20px; border:none; border-radius:4px;
    font-size:1em; cursor:pointer; transition:background 0.3s; display:flex; align-items:center; gap:6px;
}
.modern-contact-form button:hover{ background:#e65c00; }

/* SUBCATEGORY YAPISI */
.subcategory-item{
    display:flex; gap:20px; margin-bottom:40px; align-items:flex-start;
    background:#f9f9f9; padding:20px; border:1px solid #ddd; border-radius:6px;
}
.subcategory-item img{
    width:300px; height:auto; border-radius:6px; box-shadow:0 2px 6px rgba(0,0,0,0.1);
}
.subcategory-content h2{ color:#FF6F00; margin-top:0; margin-bottom:24px; }
.subcategory-content p, .subcategory-content div{ font-size:1em; line-height:1.6; }

/* MENU TOGGLE */
.menu-toggle{ display:none; }

@media (max-width:768px){
    header .container{ flex-direction:column; align-items:flex-start; }
    header nav ul{
        display:none; flex-direction:column; width:100%; background:#fff; border-top:1px solid #eee;
    }
    header nav ul.active{ display:flex; }
    header nav ul li{
        margin:0; border-bottom:1px solid #eee; padding:10px 20px; width:100%;
    }
    .menu-toggle{ display:block; font-size:24px; cursor:pointer; padding:10px; }

    .service-cards, .project-list, .blog-list{
        flex-direction:column; align-items:center;
    }
    .subcategory-item{ flex-direction:column; align-items:center; text-align:center; }
    .subcategory-item img{ width:100%; max-width:100%; }
}

/* HİZMET SLIDER (tekilleştirilmiş) */
.service-slider{
    display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:20px; padding-bottom:10px;
}
.service-slider::-webkit-scrollbar{ display:none; }
.service-slider .service-card{ flex:0 0 280px; scroll-snap-align:start; }

/* MAP WRAPPER */
.map-wrapper{ display:flex; justify-content:center; }
.map-container{
  position:relative; width:80%; max-width:800px; padding-bottom:45%; height:0;
  overflow:hidden; border-radius:6px; box-shadow:0 2px 6px rgba(0,0,0,0.2);
}
.map-container iframe{ position:absolute; top:0; left:0; width:100%; height:100%; border:0; }

form.modern-contact-form select{
  width:100%; padding:12px; border:1px solid #ccc; border-radius:4px; font-size:16px; height:45px;
  box-sizing:border-box; background-color:white; appearance:none; -webkit-appearance:none; -moz-appearance:none;
  background-image:url('data:image/svg+xml;utf8,<svg fill="gray" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>');
  background-repeat:no-repeat; background-position:right 10px center; background-size:16px;
}

/* Mobil uyum */
@media (max-width:768px){
  .map-container{ width:100%; padding-bottom:60%; }
}

/* SOSYAL */
.social-footer{ display:flex; justify-content:center; gap:15px; padding:20px 0; }
.social-icon{
  width:40px; height:40px; display:inline-block; background-size:cover; background-position:center;
  border-radius:50%; transition:transform 0.3s ease;
}
.social-icon:hover{ transform:scale(1.1); }
.social-icon.instagram{ background-image:url('https://cdn-icons-png.flaticon.com/512/2111/2111463.png'); }
.social-icon.facebook{  background-image:url('https://cdn-icons-png.flaticon.com/512/733/733547.png'); }

/* ========= DEĞERLERİMİZ ========= */
.values-section{ background:#fff8f0; padding:40px 0; }
.values-section h2{
  text-align:center; color:#ff6f00; font-size:inherit; margin-bottom:32px;
}

/* ---- TEK VE SAĞLAM GRID TANIMI ---- */
.values-grid{
  list-style:none; margin:0; padding:0;
  display:grid;
  grid-template-columns:repeat(6, minmax(0,1fr));
  gap:24px;
  place-items:stretch;
}
.value-item{
  box-sizing:border-box;
  background:#ffffff; border:1px solid #ffe0c2; border-radius:14px;
  padding:22px 16px;
  width:100%;
  display:flex; flex-direction:column; align-items:center; text-align:center;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s;
}
.value-item:hover{
  transform:translateY(-3px);
  box-shadow:0 8px 18px rgba(255,111,0,0.15);
  border-color:#ffc38f;
}
.value-icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:70px; height:70px; border-radius:50%;
  background:#fff2e6; color:#ff6f00; margin-bottom:12px;
}
.value-text{ font-weight:600; color:#1f2937; font-size:1.06rem; }

/* Responsive */
@media (max-width:1100px){
  .values-grid{ grid-template-columns:repeat(3, minmax(0,1fr)); gap:20px; }
}
@media (max-width:640px){
  .values-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:16px; }
  .value-item{ padding:18px 14px; width:100%; }
}


.service-card {
    background:#fff;
    border:1px solid #ddd;
    padding:20px;
    width:280px;
    box-sizing:border-box;
    text-align:center;
    transition:0.3s;

    /* YENİ EKLEMELER */
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.service-card .button {
    margin-top: auto;  /* KARTTA ALTA İTER */
    align-self: center;
}


/* ==========================
   FOOTER STYLES
   ========================== */
.site-footer {
  background: #111;           /* koyu arka plan */
  color: #ddd;
  font-size: 15px;
  line-height: 1.6;
  margin-top: 40px;
}

.site-footer a {
  color: #ddd;
  text-decoration: none;
  transition: color 0.3s ease;
}
.site-footer a:hover {
  color: #fff;
}

.footer-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 30px;
  padding: 50px 20px;
  max-width: 1200px;
  margin: 0 auto;
}

.footer-col {
  display: flex;
  flex-direction: column;
}

.footer-logo img {
  max-width: 160px;
  height: auto;
  margin-bottom: 15px;
}

.footer-desc {
  font-size: 14px;
  color: #aaa;
  margin-bottom: 20px;
}

.footer-social {
  display: flex;
  gap: 12px;
}
.footer-social .si {
  display: inline-flex;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #222;
  align-items: center;
  justify-content: center;
  transition: background 0.3s ease;
}
.footer-social .si:hover {
  background: #0a66c2; /* mavi hover */
}
.footer-social svg {
  width: 18px;
  height: 18px;
  fill: #ddd;
}

.footer-title {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 15px;
  color: #fff;
  text-transform: uppercase;
}

.footer-nav ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.footer-nav li {
  margin-bottom: 8px;
}
.footer-nav a {
  font-size: 14px;
  color: #bbb;
}
.footer-nav a:hover {
  color: #fff;
}

.btn-ghost {
  display: inline-block;
  padding: 6px 12px;
  border: 1px solid #bbb;
  border-radius: 4px;
  font-size: 14px;
  margin-top: 10px;
}
.btn-ghost:hover {
  background: #fff;
  color: #111;
  border-color: #fff;
}

.footer-contact {
  font-style: normal;
  font-size: 14px;
  color: #bbb;
}
.footer-contact a {
  display: inline-block;
  margin-top: 5px;
  color: #ddd;
}
.footer-contact a:hover {
  color: #fff;
}
.footer-contact .hours {
  margin-top: 8px;
  font-size: 13px;
  color: #888;
}

/* Sub-footer */
.sub-footer {
  border-top: 1px solid #222;
  text-align: center;
  padding: 15px 20px;
  font-size: 13px;
  color: #888;
}
.sub-footer p {
  margin: 0;
}
.sub-footer .legal {
  list-style: none;
  display: flex;
  justify-content: center;
  gap: 15px;
  padding: 8px 0 0;
  margin: 0;
}
.sub-footer .legal a {
  color: #aaa;
  font-size: 13px;
}
.sub-footer .legal a:hover {
  color: #fff;
}

/* WhatsApp butonu (sabit sağ-alt) */
#whatsapp-button {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 1000;
}
#whatsapp-button img {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
  transition: transform 0.3s ease;
}
#whatsapp-button img:hover {
  transform: scale(1.1);
}

/* Responsive */
@media (max-width: 768px) {
  .footer-grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 500px) {
  .footer-grid {
    grid-template-columns: 1fr;
  }
  .footer-social {
    justify-content: center;
  }
  .sub-footer .legal {
    flex-direction: column;
    gap: 5px;
  }
}


header { position: relative; z-index: 1000; }
.menu-toggle { position: relative; z-index: 1100; cursor: pointer; }
header nav { position: relative; z-index: 1050; }
.hero { position: relative; z-index: 1; } /* olası üstte kalma sorunlarını kesmek için */

/* Mobilde UL gizlenir */
@media (max-width:768px){
  header nav ul{ display:none; flex-direction:column; width:100%; background:#fff; border-top:1px solid #eee; }

  /* toggleMenu class ekleyince kesin görünsün */
  header nav ul.active{ display:flex !important; }

  /* hamburger tıklanabilirliği garanti */
  .menu-toggle{ display:block; cursor:pointer; padding:10px; position:relative; z-index:1100; pointer-events:auto; }
}

/* =========================
   KÜRESEL — LEGAL PAGES CSS
   (Sadece legal.php'yi etkiler)
   ========================= */

body.legal-page {
  background:#fff;
  color:#333;
  font-family:'Roboto', sans-serif;
  line-height:1.6;
}

/* HERO */
body.legal-page .legal-hero{
  background:#111;
  color:#fff;
  padding:48px 0 36px;
  border-bottom:1px solid #1e1e1e;
}
body.legal-page .legal-hero .container{ max-width:1200px; margin:0 auto; padding:0 20px; }
body.legal-page .legal-hero h1{
  margin:10px 0 6px;
  font-size:clamp(22px, 3.6vw, 34px);
  line-height:1.25;
  color:#fff;
}
body.legal-page .legal-hero .legal-sub{
  margin:0;
  font-size:14px;
  color:#cfcfcf;
}

/* Breadcrumb */
body.legal-page .legal-breadcrumb{
  display:flex; align-items:center; gap:8px;
  font-size:14px;
  color:#bbb;
}
body.legal-page .legal-breadcrumb a{
  color:#ffd7b0; text-decoration:none;
}
body.legal-page .legal-breadcrumb a:hover{
  color:#FF6F00; text-decoration:underline;
}

/* LAYOUT */
body.legal-page .legal-layout{
  display:grid;
  grid-template-columns:280px 1fr;
  gap:28px;
  max-width:1200px;
  margin:26px auto 60px;
  padding:0 20px;
}

/* TOC (Aside) */
body.legal-page .legal-aside{ min-width:0; }
body.legal-page .toc-card{
  position:sticky; top:20px;
  background:#fff; border:1px solid #eee; border-radius:12px;
  padding:16px 14px;
  box-shadow:0 2px 10px rgba(0,0,0,.04);
}
body.legal-page .toc-card h3{
  margin:0 0 10px; font-size:15px; font-weight:700; color:#111;
}
body.legal-page .toc-card ul{
  list-style:none; margin:0; padding:0; display:grid; gap:8px;
}
body.legal-page .toc-card a{
  color:#444; text-decoration:none; font-size:14px;
}
body.legal-page .toc-card a:hover{ color:#FF6F00; text-decoration:underline; }

/* CONTENT */
body.legal-page .legal-content{ min-width:0; }
body.legal-page .section-card{
  background:#fff; border:1px solid #eee; border-radius:12px;
  padding:18px 18px;
  box-shadow:0 2px 10px rgba(0,0,0,.04);
  margin-bottom:16px;
}
body.legal-page .section-card h2{
  margin:0 0 10px;
  font-size:clamp(18px, 2.6vw, 22px);
  line-height:1.3;
  color:#FF6F00;
}
body.legal-page .section-card p{ margin:8px 0; }
body.legal-page .section-card ul{ padding-left:18px; margin:8px 0; }
body.legal-page .section-card li{ margin:4px 0; }

/* Intro ve CTA hafif vurgulu */
body.legal-page .legal-intro{ border-left:4px solid #FF6F00; }
body.legal-page .legal-cta{
  border-left:4px solid #0ea5e9;
}

/* Linkler */
body.legal-page .section-card a{
  color:#0ea5e9; text-decoration:none;
}
body.legal-page .section-card a:hover{
  color:#075985; text-decoration:underline;
}

/* Tablo (Çerezler) */
body.legal-page .cookie-table{
  width:100%; border-collapse:collapse; font-size:14px;
  margin:8px 0 0;
}
body.legal-page .cookie-table th,
body.legal-page .cookie-table td{
  border:1px solid #eee; padding:10px; text-align:left; vertical-align:top;
}
body.legal-page .cookie-table thead th{
  background:#fafafa; font-weight:700; color:#111;
}

/* Responsive */
@media (max-width: 992px){
  body.legal-page .legal-layout{
    grid-template-columns:1fr;
  }
  body.legal-page .toc-card{ position:static; }
}

@media (max-width: 560px){
  body.legal-page .legal-hero{ padding:36px 0 26px; }
  body.legal-page .section-card{ padding:16px 14px; }
  body.legal-page .cookie-table th, 
  body.legal-page .cookie-table td{ padding:8px; }
}


/* Projeler gridini satır içinde eşit yükseklik yap */
.project-list{
  /* mevcut flex düzenine dokunmuyoruz, sadece esnetiyoruz */
  align-items: stretch;
}

/* Kart: dikey esnek kolon; buton alta yapışsın */
.project-card{
  display: flex;
  flex-direction: column;
}

/* Görsel yükseklik farkları kart boyunu bozmasın */
.project-card img{
  width: 100%;
  aspect-ratio: 16/9;
  object-fit: cover;
  margin-bottom: 10px;
}

/* Özet boşluğu alsın; buton her zaman en altta dursun */
.project-card p:last-of-type{ flex-grow: 1; }
.project-card .button{ margin-top: auto; }



/* Kart kolon; çocuklar gerilmesin */
.project-card{
  display:flex;
  flex-direction:column;
  align-items:flex-start; /* stretch yerine */
}

/* Buton alta insin ve genişlemesin */
.project-card .button{
  margin-top:auto;
  align-self:center;   /* istersen flex-start: sola yaslar, center: ortalar */
  width:auto;          /* garanti */
}




/* Evrensel font-size desteği EKLENDİ */
html { font-size:16px; }

/* Başlıklardan ÇIKARILDI (1em zorlaması yok) */
body, p, ul, ol, li, a, button, input, textarea, select, label { font-size:1em; }