/**
 * === SÖNMEZAY BİLİŞİM - LIGHT THEME V2 ===
 * Bold, Clean, Premium Design
 * Refined: Strong text, colored sections, visible footer
 */

/* =========================================
   CSS VARIABLES - REFINED
   ========================================= */

:root {
    /* Background - With colored sections */
    --bg-primary: #ffffff;
    --bg-secondary: #f5f7fa;
    --bg-tertiary: #eef1f5;
    --bg-card: #ffffff;
    --bg-accent-light: #fef7f7;
    --bg-accent-blue: #f0f4ff;

    /* Text - BOLD & READABLE */
    --text-primary: #111827;
    --text-secondary: #374151;
    --text-tertiary: #6b7280;
    --text-muted: #9ca3af;

    /* Borders */
    --border-color: rgba(0, 0, 0, 0.1);
    --border-hover: rgba(0, 0, 0, 0.2);

    /* Accent - Brand Red */
    --accent-primary: #E53935;
    --accent-secondary: #c62828;
    --accent-light: rgba(229, 57, 53, 0.08);

    /* Cards - Stronger Shadow */
    --card-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
    --card-shadow-hover: 0 16px 48px rgba(0, 0, 0, 0.14);

    /* Footer - VISIBLE */
    --footer-bg: #111827;
    --footer-text: #ffffff;
}

/* =========================================
   BODY & MAIN
   ========================================= */

body {
    background-color: var(--bg-primary) !important;
    color: var(--text-primary) !important;
}

main {
    background-color: var(--bg-primary);
}

/* Remove dark mode artifacts */
body::before {
    display: none !important;
}

.particles-bg {
    display: none !important;
}

/* =========================================
   HEADER
   ========================================= */

.site-header {
    background: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--border-color);
    box-shadow: 0 1px 10px rgba(0, 0, 0, 0.06);
}

.site-header .logo-main,
.site-header .logo-sub {
    color: var(--text-primary) !important;
}

.site-nav a {
    color: var(--text-secondary) !important;
    font-weight: 500 !important;
}

.site-nav a:hover {
    color: var(--accent-primary) !important;
}

/* =========================================
   TYPOGRAPHY - BOLD & CLEAR
   ========================================= */

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--text-primary) !important;
    font-weight: 700 !important;
}

p {
    color: var(--text-secondary) !important;
    font-weight: 400 !important;
}

strong {
    color: var(--text-primary) !important;
    font-weight: 600 !important;
}

span {
    color: inherit;
}

/* =========================================
   SECTION BACKGROUNDS - RED/BLACK BRAND
   ========================================= */

section {
    background-color: var(--bg-primary) !important;
}

/* Hero section - Red accent gradient */
.hero-section {
    background: linear-gradient(135deg, #ffffff 0%, #fff8f8 50%, #ffffff 100%) !important;
    position: relative;
}

.hero-section::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 60%;
    height: 100%;
    background: radial-gradient(ellipse at 80% 20%, rgba(229, 57, 53, 0.1) 0%, transparent 60%);
    pointer-events: none;
}

/* Stats section - Warm red tint */
.stats-section,
section.stats {
    background: linear-gradient(135deg, #fff5f5 0%, #fef8f8 100%) !important;
}

/* CTA/Conversion sections - BOLD RED Class Only */
.conversion-section {
    background: linear-gradient(135deg, #E53935 0%, #c62828 100%) !important;
}

.conversion-section h2,
.conversion-section h3,
.conversion-section p,
.conversion-section span {
    color: #ffffff !important;
}

/* Alternating - soft gray/red tint */
.bg-alternating {
    background: linear-gradient(180deg, #fafafa 0%, #ffffff 100%) !important;
}

/* =========================================
   GLASSMORPHISM CARDS
   ========================================= */

.glass-card,
.bento-card,
.service-card,
.blog-card,
.portfolio-card {
    background: rgba(255, 255, 255, 0.7) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border: 1px solid rgba(255, 255, 255, 0.8) !important;
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
    border-radius: 20px !important;
}

.glass-card:hover,
.bento-card:hover,
.service-card:hover,
.blog-card:hover,
.portfolio-card:hover {
    background: rgba(255, 255, 255, 0.85) !important;
    box-shadow:
        0 20px 60px rgba(229, 57, 53, 0.1),
        0 12px 40px rgba(0, 0, 0, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 1) !important;
    border-color: rgba(229, 57, 53, 0.2) !important;
    transform: translateY(-6px);
}

/* Red Glass Card for CTA */
.glass-card-red {
    background: linear-gradient(135deg, #E53935 0%, #c62828 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    box-shadow: 0 20px 60px rgba(229, 57, 53, 0.3) !important;
    border-radius: 20px !important;
    color: #ffffff !important;
}

.glass-card-red h2,
.glass-card-red h3,
.glass-card-red p,
.glass-card-red span,
.glass-card-red i,
.glass-card-red div {
    color: #ffffff !important;
}

/* Fix button text inside Red Card */
.glass-card-red a span,
.glass-card-red a i {
    color: #E53935 !important;
}

/* FORCE REMOVE BLUE GLOW */
body,
html {
    box-shadow: none !important;
    background-image: none !important;
}

body::before,
body::after {
    display: none !important;
    content: none !important;
}

/* Bento cards - Gradient glass */
.bento-card {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.8) 0%, rgba(248, 250, 252, 0.9) 100%) !important;
    border: 1px solid rgba(229, 57, 53, 0.1) !important;
}

.bento-card:hover {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 1) 100%) !important;
    border-color: rgba(229, 57, 53, 0.3) !important;
}

/* Timeline cards */
.timeline-card {
    background: rgba(255, 255, 255, 0.75) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    border: 1px solid rgba(255, 255, 255, 0.8) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06) !important;
}

/* Wow/Quote cards - Premium glass */
.wow-card {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.9) 0%, rgba(254, 247, 247, 0.95) 100%) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border: 1px solid rgba(229, 57, 53, 0.08) !important;
    box-shadow:
        0 12px 40px rgba(229, 57, 53, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

.wow-card:hover {
    background: linear-gradient(135deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 100%) !important;
    box-shadow:
        0 24px 60px rgba(229, 57, 53, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 1) !important;
}

/* =========================================
   BUTTONS
   ========================================= */

.btn-glow,
.btn-primary {
    background: var(--accent-primary) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 20px rgba(229, 57, 53, 0.3) !important;
    font-weight: 600 !important;
}

.btn-glow:hover,
.btn-primary:hover {
    background: var(--accent-secondary) !important;
    box-shadow: 0 8px 30px rgba(229, 57, 53, 0.4) !important;
}

.btn-secondary {
    border: 2px solid var(--text-primary) !important;
    color: var(--text-primary) !important;
    background: transparent !important;
    font-weight: 600 !important;
}

.btn-secondary:hover {
    background: var(--text-primary) !important;
    color: #ffffff !important;
}

.site-cta {
    background: var(--accent-primary) !important;
    color: #ffffff !important;
}

/* =========================================
   STATS - SOLID COLORS (NO GRADIENT)
   ========================================= */

.stat-number {
    color: var(--text-primary) !important;
    background: none !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
    -webkit-text-fill-color: var(--text-primary) !important;
}

.stat-label {
    color: var(--text-tertiary) !important;
    font-weight: 500 !important;
}

/* =========================================
   HERO SECTION
   ========================================= */

.hero-title {
    color: var(--text-primary) !important;
}

.hero-subtitle {
    color: var(--text-secondary) !important;
    font-weight: 400 !important;
}

.hero-badge {
    background: var(--accent-light) !important;
    color: var(--accent-primary) !important;
    border: 1px solid rgba(229, 57, 53, 0.2) !important;
    font-weight: 600 !important;
}

.text-accent {
    color: var(--accent-primary) !important;
}

/* GRADIENT TEXT -> SOLID COLOR */
.gradient-text {
    background: none !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
    -webkit-text-fill-color: var(--accent-primary) !important;
    color: var(--accent-primary) !important;
}

/* =========================================
   FOOTER - DARK & VISIBLE (MANDATORY)
   ========================================= */

.site-footer {
    background: #111827 !important;
    color: #ffffff !important;
    border-top: 4px solid var(--accent-primary) !important;
}

/* ALL footer containers must be dark */
.site-footer .container,
.site-footer .footer-grid,
.site-footer .footer-col,
.site-footer .footer-local-seo,
.site-footer .footer-bottom {
    background: transparent !important;
}

/* ALL footer text must be white/light */
.site-footer p,
.site-footer span,
.site-footer a,
.site-footer h4,
.site-footer address,
.site-footer li,
.site-footer strong,
.site-footer em,
.site-footer div {
    color: rgba(255, 255, 255, 0.85) !important;
    opacity: 1 !important;
}

.site-footer h4 {
    color: #ffffff !important;
    font-weight: 700 !important;
}

.site-footer a:hover {
    color: var(--accent-primary) !important;
}

/* Footer logo */
.site-footer .footer-logo span {
    color: #ffffff !important;
}

/* Footer Local SEO */
.site-footer .footer-local-seo {
    border-color: rgba(255, 255, 255, 0.1) !important;
}

.site-footer .footer-local-seo p {
    color: rgba(255, 255, 255, 0.6) !important;
}

/* Footer Bottom */
.site-footer .footer-bottom {
    border-color: rgba(255, 255, 255, 0.1) !important;
}

.site-footer .footer-bottom p,
.site-footer .footer-bottom .powered-by {
    color: rgba(255, 255, 255, 0.5) !important;
}

.site-footer .footer-bottom strong {
    color: #ffffff !important;
}

/* =========================================
   MOBILE MENU
   ========================================= */

.mobile-menu-overlay {
    background: rgba(255, 255, 255, 0.98) !important;
}

.mobile-link {
    color: var(--text-primary) !important;
    font-weight: 600 !important;
}

.mobile-menu-toggle span {
    background: var(--text-primary) !important;
}

/* =========================================
   INLINE STYLE OVERRIDES (EXCLUDE FOOTER)
   ========================================= */

/* Fix white/transparent backgrounds - NOT in footer */
:not(.site-footer)>[style*="rgba(255,255,255,0.02)"],
:not(.site-footer)>[style*="rgba(255,255,255,0.03)"],
:not(.site-footer)>[style*="rgba(255,255,255,0.05)"],
:not(.site-footer)>[style*="rgba(255,255,255,0.06)"],
main [style*="rgba(255,255,255,0.02)"],
main [style*="rgba(255,255,255,0.03)"],
main [style*="rgba(255,255,255,0.05)"],
main [style*="rgba(255,255,255,0.06)"] {
    background: var(--bg-secondary) !important;
}

/* Fix white text on light bg - NOT in footer AND NOT in Red CTA AND NOT in Black Section */
main :not(.glass-card-red):not(.btn-primary):not(.site-cta):not(.black-section)[style*="color: #fff"],
main :not(.glass-card-red):not(.btn-primary):not(.site-cta):not(.black-section)[style*="color: white"],
main :not(.glass-card-red):not(.btn-primary):not(.site-cta):not(.black-section)[style*="color:#fff"],
.hero-section [style*="color: #fff"],
.hero-section [style*="color: white"],
section:not(.site-footer):not(.conversion-section):not(.black-section) [style*="color: #fff"] {
    color: var(--text-primary) !important;
}

/* Fix muted colors - NOT in footer */
main :not(.glass-card-red) [style*="color: #888"],
main :not(.glass-card-red) [style*="color: #aaa"],
main :not(.glass-card-red) [style*="color: #bbb"],
main :not(.glass-card-red) [style*="color: #999"] {
    color: var(--text-secondary) !important;
}

/* Fix opacity text - NOT in footer */
main [style*="opacity: 0.6"],
main [style*="opacity: 0.5"],
main [style*="opacity: 0.4"] {
    opacity: 1 !important;
    color: var(--text-secondary) !important;
}

/* Fix border colors - NOT in footer */
main [style*="rgba(255,255,255,0.05)"],
main [style*="rgba(255,255,255,0.06)"],
main [style*="rgba(255,255,255,0.08)"] {
    border-color: var(--border-color) !important;
}

/* =========================================
   ICONS
   ========================================= */

.bento-card i,
.service-card i {
    color: var(--accent-primary) !important;
}

/* =========================================
   SMOOTH TRANSITIONS
   ========================================= */

body,
main,
section,
.site-header,
.glass-card,
.bento-card,
.wow-card,
.timeline-card,
.portfolio-card {
    transition: background-color 0.3s ease,
        color 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        transform 0.3s ease;
}

/* =========================================
   BLACK SECTION OVERRIDES (FORCE DARK)
   ========================================= */
section.black-section {
    background-color: #000000 !important;
    color: #ffffff !important;
}

section.black-section h1,
section.black-section h2,
section.black-section h3,
section.black-section h4,
section.black-section h5,
section.black-section h6,
section.black-section p,
section.black-section span,
section.black-section strong,
section.black-section i,
section.black-section li {
    color: #ffffff !important;
}

section.black-section .text-accent-red,
section.black-section .text-accent-red *,
section.black-section i.fa-location-dot,
section.black-section i.fa-mug-hot,
section.black-section i.fa-car {
    color: #E53935 !important;
}

section.black-section .glass-card {
    background: #111111 !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
}

/* =========================================
   BLOG CONTENT COMPONENTS (ADDED FOR VISIBILITY)
   ========================================= */

/* Alert Box */
.alert-box {
    background: rgba(229, 57, 53, 0.08);
    /* Light red tint */
    border-left: 4px solid var(--accent-primary);
    padding: 20px;
    margin: 25px 0;
    border-radius: 4px;
    color: var(--text-primary);
    font-weight: 500;
}

/* Check List */
ul.check-list {
    list-style: none;
    padding-left: 0;
}

ul.check-list li {
    position: relative;
    padding-left: 30px;
    margin-bottom: 12px;
    color: var(--text-secondary);
}

ul.check-list li::before {
    content: '\f00c';
    /* FontAwesome Check */
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    position: absolute;
    left: 0;
    top: 2px;
    color: var(--accent-primary);
}

/* Stats List */
ul.stats-list {
    list-style: none;
    padding-left: 0;
    display: grid;
    gap: 15px;
}

ul.stats-list li {
    background: var(--bg-secondary);
    padding: 15px;
    border-radius: 8px;
    border-left: 4px solid var(--accent-primary);
    color: var(--text-primary);
    font-weight: 600;
}

/* Ordered List Customization */
.content-body ol {
    padding-left: 20px;
    color: var(--text-primary);
}

.content-body ol li {
    margin-bottom: 15px;
    padding-left: 10px;
    color: var(--text-secondary);
}

.content-body ol li::marker {
    color: var(--accent-primary);
    font-weight: 700;
}