/* ── Base ── */
html { scroll-behavior: smooth; }
body { overflow-x: hidden; }

/* ── Hero Slider ── */
.hero-slider { position: relative; height: 85vh; min-height: 500px; overflow: hidden; }
.hero-slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1s ease-in-out; }
.hero-slide.active { opacity: 1; }
.hero-slide img { width: 100%; height: 100%; object-fit: cover; }
.hero-overlay { position: absolute; inset: 0; background: linear-gradient(135deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 100%); }
.hero-content { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; color: white; padding: 2rem; z-index: 2; }
.hero-dots { position: absolute; bottom: 2rem; left: 50%; transform: translateX(-50%); display: flex; gap: 0.5rem; z-index: 3; }
.hero-dot { width: 12px; height: 12px; border-radius: 50%; background: rgba(255,255,255,0.5); cursor: pointer; transition: all 0.3s; }
.hero-dot.active { background: white; transform: scale(1.2); }

/* ── Navigation ── */
.nav-scrolled { box-shadow: 0 4px 20px rgba(0,0,0,0.1); }

/* ── Service Cards ── */
.service-card { position: relative; overflow: hidden; border-radius: 1rem; transition: transform 0.3s, box-shadow 0.3s; }
.service-card:hover { transform: translateY(-8px); box-shadow: 0 20px 40px rgba(0,0,0,0.15); }
.service-card img { transition: transform 0.5s; }
.service-card:hover img { transform: scale(1.1); }
.service-card .overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, transparent 60%); }

/* ── Package Cards ── */
.package-card { border-radius: 1rem; border: 2px solid #e5e7eb; padding: 2rem; transition: all 0.3s; position: relative; }
.package-card:hover { border-color: var(--color-primary); transform: translateY(-4px); box-shadow: 0 10px 30px rgba(0,0,0,0.1); }
.package-card.popular { border-color: var(--color-primary); box-shadow: 0 10px 30px rgba(14,165,233,0.2); }

/* ── Testimonial Slider ── */
.testimonial-slider { display: flex; transition: transform 0.5s ease-in-out; }
.testimonial-card { min-width: 100%; padding: 0 1rem; }
@media (min-width: 768px) { .testimonial-card { min-width: 50%; } }
@media (min-width: 1024px) { .testimonial-card { min-width: 33.333%; } }

/* ── Gallery Lightbox ── */
.lightbox { position: fixed; inset: 0; background: rgba(0,0,0,0.9); z-index: 100; display: none; align-items: center; justify-content: center; }
.lightbox.active { display: flex; }
.lightbox img { max-width: 90%; max-height: 90vh; border-radius: 0.5rem; }

/* ── FAQ Accordion ── */
.faq-item .faq-answer { max-height: 0; overflow: hidden; transition: max-height 0.4s ease, padding 0.4s ease; }
.faq-item.open .faq-answer { max-height: 500px; }
.faq-item .faq-icon { transition: transform 0.3s; }
.faq-item.open .faq-icon { transform: rotate(180deg); }

/* ── Counter Animation ── */
.counter-number { font-variant-numeric: tabular-nums; }

/* ── Page Banner ── */
.page-banner { background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-secondary) 100%); padding: 4rem 0; color: white; text-align: center; }

/* ── Blog Card ── */
.blog-card { transition: transform 0.3s, box-shadow 0.3s; border-radius: 1rem; overflow: hidden; }
.blog-card:hover { transform: translateY(-4px); box-shadow: 0 10px 30px rgba(0,0,0,0.1); }
.blog-card img { transition: transform 0.5s; }
.blog-card:hover img { transform: scale(1.05); }

/* ── Scroll Top ── */
#scrollTopBtn.visible { opacity: 1; visibility: visible; }

/* ── WhatsApp Pulse ── */
@keyframes waPulse {
    0% { box-shadow: 0 0 0 0 rgba(37,211,102,0.5); }
    70% { box-shadow: 0 0 0 15px rgba(37,211,102,0); }
    100% { box-shadow: 0 0 0 0 rgba(37,211,102,0); }
}
.fixed a[aria-label="WhatsApp"] { animation: waPulse 2s infinite; }

/* ── Loading skeleton ── */
.skeleton { background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%); background-size: 200% 100%; animation: skeleton 1.5s infinite; }
@keyframes skeleton { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }

/* ── Responsive fixes ── */
@media (max-width: 768px) {
    .hero-slider { height: 60vh; min-height: 400px; }
    .hero-content h1 { font-size: 1.5rem !important; }
}

/* ══════════════════════════════════════════
   DARK MODE
   ══════════════════════════════════════════ */
body.dark-mode {
    background: #0f172a;
    color: #e2e8f0;
}

/* Topbar */
.dark-mode .topbar {
    background: #020617 !important;
}

/* Navigation */
.dark-mode .main-nav {
    background: #1e293b !important;
    border-bottom: 1px solid #334155;
}
.dark-mode .main-nav .nav-link,
.dark-mode .main-nav a:not(.bg-primary) {
    color: #cbd5e1 !important;
}
.dark-mode .main-nav a:not(.bg-primary):hover {
    color: var(--color-primary) !important;
    background: rgba(255,255,255,0.05) !important;
}
.dark-mode .main-nav .text-2xl.font-bold {
    color: var(--color-primary) !important;
}
.dark-mode #mobileMenuBtn {
    color: #e2e8f0 !important;
}
.dark-mode .mobile-menu {
    background: #1e293b !important;
    border-color: #334155 !important;
}
.dark-mode .mobile-menu a:not(.bg-primary) {
    color: #cbd5e1 !important;
}
.dark-mode .mobile-menu a:not(.bg-primary):hover {
    background: rgba(255,255,255,0.05) !important;
}

/* Section backgrounds */
.dark-mode section:not([class*="bg-gradient"]):not([class*="bg-primary"]):not([class*="bg-secondary"]):not([class*="bg-gray-900"]):not([class*="bg-green"]) {
    background: #0f172a !important;
}
.dark-mode .bg-gray-50, .dark-mode .bg-white {
    background: #1e293b !important;
}

/* Text */
.dark-mode .text-gray-900, .dark-mode .text-gray-800 {
    color: #f1f5f9 !important;
}
.dark-mode .text-gray-700, .dark-mode .text-gray-600 {
    color: #94a3b8 !important;
}
.dark-mode .text-gray-500, .dark-mode .text-gray-400 {
    color: #64748b !important;
}

/* Cards */
.dark-mode .bg-white.rounded-2xl,
.dark-mode .bg-white.rounded-xl,
.dark-mode .bg-white.shadow-sm,
.dark-mode article.blog-card,
.dark-mode .package-card {
    background: #1e293b !important;
    border-color: #334155 !important;
}

/* Service cards overlay */
.dark-mode .service-card { border: 1px solid #334155; }

/* Advantages cards */
.dark-mode .bg-gray-50.rounded-2xl {
    background: #1e293b !important;
    border: 1px solid #334155;
}
.dark-mode .bg-primary\/10 {
    background: rgba(var(--color-primary-rgb, 249,115,22), 0.15) !important;
}

/* FAQ */
.dark-mode .faq-item {
    background: #1e293b !important;
    border: 1px solid #334155;
}
.dark-mode .faq-question {
    color: #f1f5f9 !important;
}
.dark-mode .faq-answer {
    color: #94a3b8 !important;
}

/* Testimonials */
.dark-mode .testimonial-card .bg-white {
    background: #1e293b !important;
    border: 1px solid #334155;
}

/* Page Banner */
.dark-mode .page-banner {
    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%) !important;
    border-bottom: 2px solid var(--color-primary);
}

/* Breadcrumb */
.dark-mode .bg-gray-50.py-3 {
    background: #1a2332 !important;
}
.dark-mode .breadcrumb a {
    color: #94a3b8 !important;
}

/* Forms */
.dark-mode input, .dark-mode textarea, .dark-mode select {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}
.dark-mode input::placeholder, .dark-mode textarea::placeholder {
    color: #475569 !important;
}
.dark-mode input:focus, .dark-mode textarea:focus {
    border-color: var(--color-primary) !important;
}

/* Blog cards */
.dark-mode .blog-card {
    background: #1e293b !important;
    border-color: #334155 !important;
}

/* Gallery */
.dark-mode .gallery-filter {
    border-color: #334155 !important;
    color: #94a3b8 !important;
}
.dark-mode .gallery-filter.active {
    color: white !important;
}

/* Footer - already dark so just darken more */
.dark-mode footer {
    background: #020617 !important;
}

/* Prose / blog content */
.dark-mode .prose { color: #cbd5e1; }
.dark-mode .prose h1, .dark-mode .prose h2, .dark-mode .prose h3, .dark-mode .prose h4 { color: #f1f5f9; }
.dark-mode .prose a { color: var(--color-primary); }
.dark-mode .prose strong { color: #f1f5f9; }

/* Border overrides */
.dark-mode .border-gray-100, .dark-mode .border-gray-200, .dark-mode .border-gray-300 {
    border-color: #334155 !important;
}

/* Checkout */
.dark-mode .bg-gray-50.rounded-2xl.sticky {
    background: #1e293b !important;
    border: 1px solid #334155;
}

/* 404 */
.dark-mode .text-primary\/20 {
    color: rgba(var(--color-primary-rgb, 249,115,22), 0.15) !important;
}

/* Scroll to top */
.dark-mode #scrollTopBtn {
    background: #334155 !important;
}
.dark-mode #scrollTopBtn:hover {
    background: var(--color-primary) !important;
}

/* Hero stronger overlay in dark mode */
.dark-mode .hero-overlay {
    background: linear-gradient(135deg, rgba(0,0,0,0.85) 0%, rgba(15,23,42,0.6) 100%) !important;
}

/* Counters section in dark mode */
.dark-mode .bg-gradient-to-r.from-primary.to-secondary {
    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%) !important;
    border-top: 2px solid var(--color-primary);
    border-bottom: 2px solid var(--color-primary);
}

/* Testimonial nav buttons */
.dark-mode #testPrev, .dark-mode #testNext {
    background: #1e293b !important;
    border-color: #475569 !important;
    color: #94a3b8 !important;
}
.dark-mode #testPrev:hover, .dark-mode #testNext:hover {
    border-color: var(--color-primary) !important;
    color: var(--color-primary) !important;
}

/* Package card non-popular hover bg */
.dark-mode .bg-gray-100.text-gray-700 {
    background: #334155 !important;
    color: #cbd5e1 !important;
}

/* Contact form section keeps gradient but darker */
.dark-mode section.bg-gradient-to-r.from-primary.to-secondary:has(#iletisim-form),
.dark-mode #iletisim-form {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%) !important;
    border-top: 2px solid var(--color-primary);
}

/* Skeleton in dark mode */
.dark-mode .skeleton {
    background: linear-gradient(90deg, #1e293b 25%, #334155 50%, #1e293b 75%);
    background-size: 200% 100%;
}

/* Sub-page sections */
.dark-mode section.py-16, .dark-mode section.py-20 {
    background-color: #0f172a;
}

/* Dividers */
.dark-mode hr, .dark-mode .divide-y > * + * {
    border-color: #334155 !important;
}