/* =====================================================
   CAN ISITICI — Frontend stil
   ===================================================== */

:root {
  --brand: #c8102e;
  --brand-dark: #a40d24;
  --dark: #1a1a1a;
  --muted: #666;
}

html { scroll-behavior: smooth; }
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; color: #222; line-height: 1.65; }
img { max-width: 100%; height: auto; }
a { color: var(--brand); text-decoration: none; }
a:hover { color: var(--brand-dark); text-decoration: underline; }

/* Header */
.site-header { border-bottom: 1px solid #eee; background: #fff; position: sticky; top: 0; z-index: 100; }
.site-header .logo img { max-height: 60px; width: auto; }
.main-nav ul { list-style: none; padding: 0; margin: 0; display: flex; justify-content: center; gap: 1.5rem; }
.main-nav a { color: #222; font-weight: 600; padding: .5rem 0; border-bottom: 2px solid transparent; }
.main-nav a:hover { color: var(--brand); border-color: var(--brand); text-decoration: none; }
.btn-call { font-size: 1rem; }
.mobile-nav { display: flex; gap: 1rem; padding: .5rem 0; border-top: 1px solid #eee; overflow-x: auto; }
.mobile-nav a { white-space: nowrap; color: #222; font-weight: 600; }

/* Floating buttons */
.float-whatsapp, .float-call {
  position: fixed; z-index: 9999; bottom: 20px;
  width: 56px; height: 56px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 12px rgba(0,0,0,.25); transition: transform .15s;
}
.float-whatsapp { right: 20px; background: #25d366; }
.float-call { right: 90px; background: var(--brand); }
.float-whatsapp:hover, .float-call:hover { transform: scale(1.08); text-decoration: none; }

/* Mobil: butonlar gozuksun + alt safe-area icin biraz yukari + biraz kucult */
@media (max-width: 576px) {
  .float-whatsapp, .float-call {
    width: 52px; height: 52px;
    bottom: calc(20px + env(safe-area-inset-bottom, 0px));
  }
  .float-whatsapp { right: 14px; }
  .float-call { right: 76px; }
}

/* Hero */
.hero { background: linear-gradient(135deg, #fff 0%, #fdf3f4 100%); }
.hero-summary { font-size: 1.1rem; max-width: 800px; margin: 0 auto; color: #444; }
.btn-danger { background: var(--brand); border-color: var(--brand); }
.btn-danger:hover { background: var(--brand-dark); border-color: var(--brand-dark); }

/* Sehir grid */
.city-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: .5rem; margin: .75rem 0; }
.city-chip {
  display: flex; align-items: center; gap: .35rem;
  padding: .55rem .75rem; border: 1px solid #e3e3e3; border-radius: 6px;
  background: #fff; color: #222; font-size: .92rem; font-weight: 500;
  transition: all .15s;
}
.city-chip:hover { border-color: var(--brand); background: var(--brand); color: #fff; text-decoration: none; transform: translateY(-1px); }
.city-chip .plate {
  font-size: .72rem; background: #f3c0c8; color: var(--brand-dark);
  padding: 2px 6px; border-radius: 4px; font-weight: 700;
}
.city-chip:hover .plate { background: rgba(255,255,255,.25); color: #fff; }
.region-title { color: var(--brand-dark); border-bottom: 2px solid var(--brand); padding-bottom: .25rem; }

/* Service card */
.service-card {
  background: #fff; padding: 2rem; border-radius: 10px; border: 1px solid #eee;
  height: 100%; text-align: center; transition: all .2s;
}
.service-card:hover { border-color: var(--brand); transform: translateY(-3px); box-shadow: 0 4px 16px rgba(200,16,46,.1); }
.service-card h3 { color: var(--brand-dark); }

/* Page content */
.page-summary {
  background: #fef9f9; border-left: 4px solid var(--brand);
  padding: .9rem 1.25rem; margin: 1rem 0; border-radius: 0 6px 6px 0; font-size: 1.05rem;
}
.content h2, .content h3 { color: var(--brand-dark); margin-top: 1.5rem; }
.content ul li { margin-bottom: .4rem; }
.cta-box { background: #fdf3f4; padding: 2rem; border-radius: 10px; border: 2px dashed var(--brand); }

/* Breadcrumb */
.breadcrumb { background: transparent; padding: 0; font-size: .9rem; }
.breadcrumb a { color: var(--brand); }

/* Galeri */
.city-gallery figure { margin-bottom: 1rem; }
.city-hero img { border-radius: 0; }

/* Icerik icindeki <figure>'ler */
.content-figure { margin: 1.5rem 0; text-align: center; }
.content-figure img { max-width: 100%; height: auto; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,.08); }
.content-fig-caption { font-size: .9rem; color: var(--muted); margin-top: .5rem; font-style: italic; }

/* Static page */
.static-page .content { font-size: 1.05rem; }
.contact-big-btn {
  display: block; padding: 1.5rem; text-align: center;
  background: var(--brand); color: #fff; border-radius: 10px;
  font-size: 1.1rem; transition: all .2s; text-decoration: none;
}
.contact-big-btn.btn-success { background: #25d366; }
.contact-big-btn:hover { color: #fff; text-decoration: none; transform: translateY(-2px); box-shadow: 0 6px 14px rgba(0,0,0,.15); }
.contact-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px,1fr)); gap: 1.5rem; margin: 1.5rem 0; }
.contact-item { background: #f8f9fa; padding: 1.25rem; border-radius: 8px; }
.contact-item h3 { font-size: 1rem; color: var(--brand-dark); margin-bottom: .3rem; }

/* Footer */
.site-footer { background: #1a1a1a; color: #ccc; }
.site-footer h3 { color: #fff; margin-bottom: 1rem; }
.site-footer a { color: #ccc; }
.site-footer a:hover { color: #fff; }
.city-footer-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px,1fr)); gap: .4rem .8rem; font-size: .85rem; }
.footer-bottom { background: #000; color: #aaa; font-size: .85rem; }

/* Accordion */
.accordion-button:not(.collapsed) { background: var(--brand); color: #fff; }
.accordion-button:focus { box-shadow: none; }

/* Responsive */
@media (max-width: 768px) {
  .site-header .logo img { max-height: 40px; }
  .btn-call { font-size: .85rem; padding: .35rem .6rem; }
  .hero h1 { font-size: 1.75rem; }
  .city-grid { grid-template-columns: repeat(auto-fill, minmax(150px,1fr)); }
}