/* Has Karot — Ana CSS
   Tailwind CDN kullandığımız için burası sadece özel stiller içerir */

/* ─── Temel ─────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

:root {
    --primary: #E63946;
    --primary-dark: #c1121f;
    --dark: #1a1a2e;
}

html { scroll-behavior: smooth; }

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    -webkit-font-smoothing: antialiased;
}

/* ─── Container ──────────────────────────────────────────── */
.container { max-width: 1200px; margin-inline: auto; }

/* ─── Prose (TinyMCE çıktısı) ────────────────────────────── */
.prose h2 {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin: 2rem 0 1rem;
}
.prose h3 {
    font-size: 1.2rem;
    font-weight: 600;
    color: #1f2937;
    margin: 1.5rem 0 0.75rem;
}
.prose p  { margin-bottom: 1rem; }
.prose ul { list-style: disc; padding-left: 1.5rem; margin-bottom: 1rem; }
.prose li { margin-bottom: 0.4rem; }
.prose strong { color: var(--primary); }

/* ─── Breadcrumb ─────────────────────────────────────────── */
.breadcrumb {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    font-size: 0.8rem;
    color: #6b7280;
    padding: 0.75rem 0;
    list-style: none;
}
.breadcrumb-item + .breadcrumb-item::before { content: '›'; margin-right: 0.25rem; }
.breadcrumb-item a { color: #6b7280; text-decoration: none; }
.breadcrumb-item a:hover { color: var(--primary); }
.breadcrumb-item.active { color: #374151; font-weight: 500; }

/* ─── Animasyonlar ───────────────────────────────────────── */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}

.fade-in-up { animation: fadeInUp 0.5s ease forwards; }

/* ─── WhatsApp Pulse ─────────────────────────────────────── */
.wa-pulse { animation: pulse 2s infinite; }
@keyframes pulse {
    0%  { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.6); }
    70% { box-shadow: 0 0 0 12px rgba(34, 197, 94, 0); }
    100%{ box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); }
}

/* ─── Form Focus ─────────────────────────────────────────── */
input:focus, select:focus, textarea:focus {
    outline: none;
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 3px rgba(230, 57, 70, 0.15);
}

/* ─── Scroll to top ──────────────────────────────────────── */
#scroll-top {
    position: fixed;
    bottom: 5rem;
    right: 1.5rem;
    width: 2.5rem;
    height: 2.5rem;
    background: var(--dark);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.3s;
    z-index: 40;
}
#scroll-top.visible { opacity: 1; }