/* ================================================
   UV PREMIUM THEME — iPhone-style soft premium
   Default: dark. Toggle: body.theme-light
   Philosophy: minimal noise, pure surfaces, UV
   accent only as subtle hint, not decoration.
================================================ */

:root {
    /* UV accent — used sparingly */
    --uv-blue:     #D87B36;      /* lighter, softer */
    --uv-purple:   #D87B36;      /* lavender */
    /* NOT TOUCHING --accent here — let style.css :root drive it (#D87B36) */
}

/* =============================================================
   DARK MODE — endüstriyel grafit + bakır (kullanıcı seçimi)
============================================================= */
body:not(.theme-light) {
    --bg:         #2A2F36;
    --surface:    #353B43;
    --surface-2:  #2F343B;
    --surface-3:  #3D434B;
    --text:       #ffffff;
    --muted:      #ABB1B9;
    --dim:        #6E7681;
    --border:     rgba(255, 255, 255, 0.08);
    --border-md:  rgba(255, 255, 255, 0.16);
    --navy:       #0F1419;
    /* Flip "white" so hardcoded var(--white) backgrounds go dark */
    --white:      #353B43;

    background: var(--bg);
    color: var(--text);
}

/* Header — kullanıcı seçimi: rgba(14,17,22,0.92) */
body:not(.theme-light) #header {
    background: rgba(14, 17, 22, 0.92);
    backdrop-filter: blur(24px) saturate(180%);
    -webkit-backdrop-filter: blur(24px) saturate(180%);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
body:not(.theme-light) #header.scrolled {
    background: rgba(14, 17, 22, 0.96);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06);
}
body:not(.theme-light) .nav-links a { color: rgba(255, 255, 255, 0.7) !important; }
body:not(.theme-light) .nav-links a:hover { color: #fff !important; }
body:not(.theme-light) .nav-links a::after { background: var(--accent) !important; }
/* Logo filtresi yok — orijinal görsel olduğu gibi */
body:not(.theme-light) .nav-logo-img { filter: none; }
body:not(.theme-light) .hamburger span { background: #fff !important; }
body:not(.theme-light) .nav-more-trigger { color: rgba(255, 255, 255, 0.7) !important; }
body:not(.theme-light) .nav-more-trigger:hover { color: #fff !important; }
body:not(.theme-light) .nav-dropdown {
    background: rgba(22, 22, 28, 0.96) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.55) !important;
    backdrop-filter: blur(24px);
}
body:not(.theme-light) .nav-dropdown a { color: rgba(255, 255, 255, 0.85) !important; }
body:not(.theme-light) .nav-dropdown a:hover { color: #fff !important; background: rgba(255, 255, 255, 0.05) !important; }
body:not(.theme-light) .lang-switch {
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
    background: transparent !important;
}
body:not(.theme-light) .lang-switch:hover { background: rgba(255, 255, 255, 0.06) !important; }

/* Hero — minimal, no lens flares */
body:not(.theme-light) .hero-bg-word { color: rgba(255, 255, 255, 0.025); }
body:not(.theme-light) .hero-badge { color: var(--muted); }
body:not(.theme-light) .hero-badge::before,
body:not(.theme-light) .hero-badge::after { background: rgba(255, 255, 255, 0.18); }
body:not(.theme-light) #hero h1,
body:not(.theme-light) .hero-title { color: var(--text); }
body:not(.theme-light) #hero h1 em,
body:not(.theme-light) .hero-title em,
body:not(.theme-light) h1 em {
    color: var(--accent);
    background: none;
    -webkit-text-fill-color: var(--accent);
}
body:not(.theme-light) .hero-desc { color: rgba(245, 245, 247, 0.65); }

/* Primary CTA — keep orange, clean shadow */
body:not(.theme-light) .btn-primary {
    background: #D87B36 !important;
    color: #fff !important;
    box-shadow: 0 2px 10px rgba(249, 115, 22, 0.22);
}
body:not(.theme-light) .btn-primary:hover {
    background: #B8651F !important;
    box-shadow: 0 4px 18px rgba(249, 115, 22, 0.35);
    transform: translateY(-1px);
}
body:not(.theme-light) .btn-outline,
body:not(.theme-light) .hero-cta-secondary {
    color: rgba(255, 255, 255, 0.92) !important;
    border-color: rgba(255, 255, 255, 0.22) !important;
}
body:not(.theme-light) .btn-outline:hover {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.45) !important;
}

/* Section tags (01 — HİZMETLER) */
body:not(.theme-light) .section-tag { color: var(--accent); }
body:not(.theme-light) .section-tag::before { background: var(--accent); opacity: 0.5; }

/* Section italic ems → lavender */
body:not(.theme-light) .section-title em,
body:not(.theme-light) h2 em, body:not(.theme-light) h3 em {
    color: var(--accent);
    background: none;
    -webkit-text-fill-color: var(--accent);
}
body:not(.theme-light) .section-title,
body:not(.theme-light) h2, body:not(.theme-light) h3 {
    color: var(--text);
    font-weight: 500;                              /* 300 too thin on dark — bump to medium */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
body:not(.theme-light) #hero h1,
body:not(.theme-light) .hero-title { font-weight: 500; }
body:not(.theme-light) .section-title em,
body:not(.theme-light) h1 em, body:not(.theme-light) h2 em, body:not(.theme-light) h3 em {
    font-weight: 400;                              /* italic ems can stay lighter for elegance */
}
body:not(.theme-light) .section-desc,
body:not(.theme-light) .section-sub { color: rgba(245, 245, 247, 0.58); }

/* Service cards — flat, subtle */
body:not(.theme-light) .svc-card {
    background: var(--surface);
    border: 1px solid var(--border);
    box-shadow: none;
}
body:not(.theme-light) .svc-card::before {
    background: var(--accent) !important;
    opacity: 0.6;
}
body:not(.theme-light) .svc-card:hover {
    border-color: rgba(255, 255, 255, 0.15);
    background: var(--surface-2);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
}
body:not(.theme-light) .card-body h3 { color: #fff; }
body:not(.theme-light) .card-body p  { color: rgba(245, 245, 247, 0.6); }
body:not(.theme-light) .card-ico { color: var(--accent); opacity: 0.9; }
body:not(.theme-light) .card-no { color: rgba(255, 255, 255, 0.22); }
body:not(.theme-light) .card-arrow { color: var(--accent); }

/* Kill the card-glow radial — too noisy for iPhone aesthetic */
body:not(.theme-light) .card-glow { opacity: 0 !important; }

/* Product cards */
body:not(.theme-light) .prod-card {
    background: var(--surface);
    border: 1px solid var(--border);
}
body:not(.theme-light) .prod-card:hover {
    border-color: rgba(255, 255, 255, 0.15);
    background: var(--surface-2);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
    transform: translateY(-2px);
}
body:not(.theme-light) .prod-card-body h3 { color: #fff; }
body:not(.theme-light) .prod-card-body p  { color: rgba(245, 245, 247, 0.6); }
body:not(.theme-light) .prod-tag {
    background: rgba(167, 139, 250, 0.1);
    color: var(--accent);
    border: 1px solid rgba(167, 139, 250, 0.18);
}
body:not(.theme-light) .prod-detail-link { color: var(--accent); }
body:not(.theme-light) .prod-detail-link:hover { color: #fff; }
body:not(.theme-light) .prod-card-img { background-color: var(--surface-2); }
body:not(.theme-light) .prod-card-placeholder { color: rgba(255, 255, 255, 0.12); }

body:not(.theme-light) .prod-tabs { background: var(--surface); border: 1px solid var(--border); }
body:not(.theme-light) .prod-tab { color: rgba(255, 255, 255, 0.6); background: transparent; border: none; }
body:not(.theme-light) .prod-tab:hover { color: #fff; }
body:not(.theme-light) .prod-tab.active {
    background: rgba(167, 139, 250, 0.14);
    color: #fff;
    box-shadow: inset 0 0 0 1px rgba(167, 139, 250, 0.3);
}
body:not(.theme-light) .prod-tab-dot { background: var(--accent); }

/* More section */
body:not(.theme-light) .prod-more-toggle {
    background: var(--surface);
    border: 1px solid var(--border);
    color: #fff;
}
body:not(.theme-light) .prod-more-toggle:hover {
    background: var(--surface-2);
    border-color: rgba(167, 139, 250, 0.3);
}
body:not(.theme-light) .toggle-text strong { color: #fff; }
body:not(.theme-light) .toggle-sub { color: rgba(255, 255, 255, 0.55); }
body:not(.theme-light) .toggle-badge {
    background: rgba(167, 139, 250, 0.18);
    color: var(--accent);
    border: 1px solid rgba(167, 139, 250, 0.3);
}
body:not(.theme-light) .more-cat h5 { color: rgba(255, 255, 255, 0.75); border-bottom-color: rgba(255, 255, 255, 0.08); }
body:not(.theme-light) .more-tags a {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.72);
}
body:not(.theme-light) .more-tags a:hover {
    background: rgba(255, 255, 255, 0.04) !important;
    border-color: rgba(255, 255, 255, 0.25) !important;
    color: #fff !important;
}
body:not(.theme-light) .more-cta a { border-color: rgba(255, 255, 255, 0.2); color: rgba(255, 255, 255, 0.85); }
body:not(.theme-light) .more-cta a:hover { background: rgba(255, 255, 255, 0.05); border-color: rgba(255, 255, 255, 0.4); color: #fff; }

/* Stats */
body:not(.theme-light) .stats-row {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 2rem;
}
body:not(.theme-light) .stat-num { color: var(--text); }
body:not(.theme-light) .stat-label { color: var(--muted); }

/* About */
body:not(.theme-light) .about-card img { filter: brightness(0.92) contrast(1.02); }
body:not(.theme-light) .about-badge-pill {
    background: rgba(22, 22, 28, 0.9);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: #fff;
    backdrop-filter: blur(10px);
}
body:not(.theme-light) .pill-num { color: #fff !important; }
body:not(.theme-light) .pill-txt { color: rgba(255, 255, 255, 0.65) !important; }
body:not(.theme-light) .about-stats .as-val { color: #fff; }
body:not(.theme-light) .about-stats .as-lbl { color: var(--muted); }
body:not(.theme-light) .about-desc { color: rgba(245, 245, 247, 0.68); }

/* Story section */
body:not(.theme-light) .story-section {
    background: var(--surface);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}
body:not(.theme-light) .story-badge { color: var(--accent); }
body:not(.theme-light) .story-badge::before { background: var(--accent); opacity: 0.5; }
body:not(.theme-light) .story-title { color: #fff; }
body:not(.theme-light) .story-title em {
    color: var(--accent);
    background: none;
    -webkit-text-fill-color: var(--accent);
}
body:not(.theme-light) .story-body { color: rgba(245, 245, 247, 0.65); }
body:not(.theme-light) .story-video-placeholder {
    background: var(--surface-2);
    border-color: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.45);
}

/* Process */
body:not(.theme-light) .process-step {
    background: var(--surface);
    border: 1px solid var(--border);
}
body:not(.theme-light) .process-step:hover {
    border-color: rgba(255, 255, 255, 0.15);
    background: var(--surface-2);
}
body:not(.theme-light) .process-num { color: var(--accent); }
body:not(.theme-light) .process-step h4 { color: #fff; }
body:not(.theme-light) .process-step p  { color: rgba(245, 245, 247, 0.62); }

/* Contact */
body:not(.theme-light) .cinfo-block {
    background: var(--surface);
    border: 1px solid var(--border);
    color: #fff;
}
body:not(.theme-light) .cinfo-ico { color: var(--accent); }
body:not(.theme-light) .cinfo-lbl { color: var(--muted); }
body:not(.theme-light) .cinfo-val, body:not(.theme-light) .cinfo-val a { color: #fff; }
body:not(.theme-light) .contact-form-wrap form {
    background: var(--surface);
    border: 1px solid var(--border);
}
body:not(.theme-light) .form-field label { color: rgba(255, 255, 255, 0.82); }
body:not(.theme-light) .form-field input,
body:not(.theme-light) .form-field textarea,
body:not(.theme-light) .form-field select {
    background: var(--surface-2);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #fff;
}
body:not(.theme-light) .form-field input::placeholder,
body:not(.theme-light) .form-field textarea::placeholder { color: rgba(255, 255, 255, 0.3); }
body:not(.theme-light) .form-field input:focus,
body:not(.theme-light) .form-field textarea:focus,
body:not(.theme-light) .form-field select:focus {
    border-color: rgba(167, 139, 250, 0.5);
    box-shadow: 0 0 0 3px rgba(167, 139, 250, 0.12);
}
body:not(.theme-light) .btn-submit {
    background: #D87B36;
    color: #fff;
    box-shadow: 0 2px 10px rgba(249, 115, 22, 0.25);
    border: none;
}
body:not(.theme-light) .btn-submit:hover { background: #B8651F; box-shadow: 0 4px 18px rgba(249, 115, 22, 0.4); transform: translateY(-1px); }

/* Footer */
body:not(.theme-light) #footer { background: #050507; border-top: 1px solid rgba(255, 255, 255, 0.06); }

/* FABs */
body:not(.theme-light) .fab-main {
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(20px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
    color: #fff;
}
body:not(.theme-light) .fab-main:hover {
    background: rgba(255, 255, 255, 0.14) !important;
    border-color: rgba(255, 255, 255, 0.3);
}
body:not(.theme-light) .fab-btn.fab-quote {
    background: #D87B36 !important;
    color: #fff;
    border: none;
}

/* Quote modal */
body:not(.theme-light) .quote-modal {
    background: var(--surface);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: var(--text);
}
body:not(.theme-light) .quote-modal h2 { color: #fff; }
body:not(.theme-light) .quote-sub { color: rgba(255, 255, 255, 0.62); }
body:not(.theme-light) .qf-field label { color: rgba(255, 255, 255, 0.82); }
body:not(.theme-light) .qf-field input,
body:not(.theme-light) .qf-field textarea,
body:not(.theme-light) .qf-field select {
    background: var(--surface-2);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #fff;
}
body:not(.theme-light) .qf-field input::placeholder,
body:not(.theme-light) .qf-field textarea::placeholder { color: rgba(255, 255, 255, 0.3); }
body:not(.theme-light) .qf-submit {
    background: #D87B36;
    color: #fff;
    border: none;
}

/* Cursor */
body:not(.theme-light) .cursor-dot  { background: var(--accent); }
body:not(.theme-light) .cursor-ring { border-color: rgba(167, 139, 250, 0.35); }
body:not(.theme-light) .cursor-explore {
    background: #fff;
    color: var(--navy);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}
body:not(.theme-light) .cursor-explore em { color: var(--accent); }

/* Scroll-top */
body:not(.theme-light) .scroll-top-btn {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(20px);
    color: #fff;
}
body:not(.theme-light) .scroll-top-btn:hover {
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.3);
}

/* Intro screen */
body:not(.theme-light) #intro { background: #050507; }
body:not(.theme-light) .intro-name { color: #fff; }
body:not(.theme-light) .intro-est  { color: rgba(255, 255, 255, 0.5); }
body:not(.theme-light) .intro-bar-fill { background: var(--accent); }

/* Mobile menu */
body:not(.theme-light) #mob-menu { background: rgba(11, 11, 15, 0.98); }
body:not(.theme-light) .mob-link { color: rgba(255, 255, 255, 0.85); border-bottom-color: rgba(255, 255, 255, 0.06); }
body:not(.theme-light) .mob-link:hover { color: #fff; background: rgba(255, 255, 255, 0.04); }

/* Wide media overlay darker */
body:not(.theme-light) .card-hover-media::after { background: rgba(5, 5, 7, var(--mdim, 0.45)) !important; }

/* Support bubble */
body:not(.theme-light) .support-panel { background: var(--surface); border: 1px solid rgba(255,255,255,0.1); color: #fff; }
body:not(.theme-light) .support-panel h3 { color: #fff; }
body:not(.theme-light) .support-panel p  { color: rgba(255,255,255,0.65); }

/* -------- Marquee strip (was white — fix for dark mode) -------- */
body:not(.theme-light) .marquee-wrap {
    background: var(--surface);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}
body:not(.theme-light) .marquee-reel { color: rgba(245, 245, 247, 0.55); }

/* -------- Hero background word (BASKI) — more visible -------- */
body:not(.theme-light) .hero-bg-word { color: rgba(255, 255, 255, 0.04); }

/* -------- Contact info blocks — better contrast + subtle highlight -------- */
body:not(.theme-light) .cinfo-block {
    background: var(--surface);
    border: 1px solid var(--border);
    border-top: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.3) inset;
}
body:not(.theme-light) .cinfo-lbl { color: var(--accent); font-weight: 600; letter-spacing: 0.12em; }

/* -------- Contact form — distinct lighter card -------- */
body:not(.theme-light) .contact-form-wrap form {
    background: var(--surface);
    border: 1px solid var(--border);
    border-top: 1px solid rgba(255, 255, 255, 0.14);
    padding: 2rem;
    border-radius: 14px;
}

/* -------- Section background heads (Konuşalım, Nasıl Çalışıyoruz etc.) -------- */
body:not(.theme-light) .section-bg-word,
body:not(.theme-light) .about-bg-word,
body:not(.theme-light) .contact-bg-word { color: rgba(255, 255, 255, 0.04) !important; }

/* -------- Give cards a subtle top-edge highlight (Apple-like depth) -------- */
body:not(.theme-light) .svc-card,
body:not(.theme-light) .prod-card,
body:not(.theme-light) .process-step,
body:not(.theme-light) .work-card {
    border-top-color: rgba(255, 255, 255, 0.14);
}

/* -------- Inputs inside quote modal & contact: lighter fill -------- */
body:not(.theme-light) .form-field input,
body:not(.theme-light) .form-field textarea,
body:not(.theme-light) .form-field select,
body:not(.theme-light) .qf-field input,
body:not(.theme-light) .qf-field textarea,
body:not(.theme-light) .qf-field select {
    background: var(--surface-2);
    border-color: rgba(255, 255, 255, 0.12);
}

/* -------- Stats row: slightly lifted -------- */
body:not(.theme-light) .stats-row {
    background: var(--surface);
    border: 1px solid var(--border);
    border-top: 1px solid rgba(255, 255, 255, 0.14);
}

/* -------- Story section: distinct panel -------- */
body:not(.theme-light) .story-section {
    background: var(--bg);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}
body:not(.theme-light) .story-video-placeholder {
    background: var(--surface);
    border: 1px solid var(--border);
}

/* -------- Intro loader -------- */
body:not(.theme-light) #intro { background: #050509; }

/* -------- Marquee strip text in light mode should also be adjusted -------- */

/* ==========================================================
   FIX: STATS section — #stats uses background: var(--text)
   which in dark mode flips to near-white. Force dark surface.
========================================================== */
body:not(.theme-light) #stats {
    background: transparent !important;
}
body:not(.theme-light) .stats-row {
    background: var(--surface);
    border: 1px solid var(--border);
    border-top: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 18px;
    padding: 3rem 2rem;
}
body:not(.theme-light) .stat-num { color: #F5F5F7 !important; }
body:not(.theme-light) .stat-lbl { color: rgba(255, 255, 255, 0.55); }
body:not(.theme-light) .stat-divider { background: rgba(255, 255, 255, 0.1); }

/* Light mode — keep stats section DARK (design intent), ensure readable */
body.theme-light #stats { background: #1D1D1F; }
body.theme-light .stat-num { color: #fff !important; }
body.theme-light .stat-lbl { color: rgba(255, 255, 255, 0.6); }

/* ==========================================================
   FIX: About section — "Neden" title + "2007 yılında..."
   paragraph are too thin in dark mode
========================================================== */
body:not(.theme-light) .about-lead {
    color: var(--text);
    font-weight: 400;
}
body:not(.theme-light) .about-body {
    color: rgba(245, 245, 247, 0.72);
    font-weight: 400;
}
body:not(.theme-light) .about-feats li { color: rgba(245, 245, 247, 0.85); }

/* ==========================================================
   FIX: Contact info blocks — minimal, elegant redesign
   (no more "square pasted on square" look)
========================================================== */
body:not(.theme-light) .cinfo-block {
    background: transparent;
    border: none;
    border-top: 1px solid var(--border);
    border-radius: 0;
    padding: 1.25rem 0 1.25rem 2.75rem;
    margin-bottom: 0;
    position: relative;
    box-shadow: none;
}
body:not(.theme-light) .cinfo-block:last-child { border-bottom: 1px solid var(--border); }
body:not(.theme-light) .cinfo-block::before {
    content: '';
    position: absolute;
    left: 0; top: 1.35rem;
    width: 22px; height: 1px;
    background: var(--accent);
    opacity: 0.6;
}
body:not(.theme-light) .cinfo-lbl {
    color: var(--accent);
    font-size: 0.65rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    display: block;
    margin-bottom: 0.4rem;
    opacity: 0.85;
}
body:not(.theme-light) .cinfo-val {
    color: var(--text);
    font-family: var(--serif);
    font-size: 1.05rem;
}

/* ==========================================================
   FIX: Contact form panel — elegant surface, not heavy card
========================================================== */
body:not(.theme-light) .contact-form-wrap form {
    background: linear-gradient(180deg, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.01) 100%);
    border: 1px solid var(--border);
    border-top: 1px solid rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(20px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25);
    border-radius: 16px;
    padding: 2.25rem;
}

/* ==========================================================
   FIX: Floating buttons — always visible on ANY background
   Use strong backdrop-blur + visible border
========================================================== */
body:not(.theme-light) .fab-main {
    background: rgba(22, 22, 28, 0.85) !important;
    border: 1px solid rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(30px) saturate(180%);
    -webkit-backdrop-filter: blur(30px) saturate(180%);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.5);
    color: #fff;
}
body:not(.theme-light) .fab-main:hover {
    background: rgba(40, 40, 50, 0.9) !important;
    border-color: rgba(255, 255, 255, 0.35);
}
body:not(.theme-light) .scroll-top-btn {
    background: rgba(22, 22, 28, 0.85);
    border: 1px solid rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(30px) saturate(180%);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.5);
    color: #fff;
}
body:not(.theme-light) .scroll-top-btn:hover {
    background: rgba(40, 40, 50, 0.9);
    border-color: rgba(255, 255, 255, 0.35);
}

/* ==========================================================
   FIX: Remove thin circle around "Teklif Al →" on wide card (svc-7)
   Inherited from .card-arrow (32×32 border:1px border-radius:50%)
========================================================== */
.svc-card--wide .card-arrow {
    width: auto !important;
    height: auto !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    color: var(--accent) !important;
    font-weight: 500;
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
body:not(.theme-light) .svc-card--wide .card-arrow { color: var(--accent) !important; }

/* ==========================================================
   FIX: Section "kavram" background word (Hakkımızda/İletişim arkasındaki soluk büyük yazı)
========================================================== */
body:not(.theme-light) .section-bg-word,
body:not(.theme-light) .about-bg-word,
body:not(.theme-light) .contact-bg-word,
body:not(.theme-light) [class*="bg-word"] { color: rgba(255, 255, 255, 0.025) !important; }

/* ==========================================================
   COMPREHENSIVE DARK OVERRIDES — catches any hardcoded
   white/light backgrounds and dim borders
========================================================== */

/* Expandable "Daha Fazla" panel — was hardcoded var(--white) */
body:not(.theme-light) .prod-more-body {
    background: var(--surface) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-top: none !important;
}
body:not(.theme-light) #body-uv { border-color: rgba(255, 255, 255, 0.1) !important; }
body:not(.theme-light) .more-cat h5 {
    color: rgba(255, 255, 255, 0.78);
    border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

/* Mobile menu solid panel */
body:not(.theme-light) #mob-menu,
body:not(.theme-light) .mobile-menu {
    background: var(--surface) !important;
}

/* Quote modal overlay */
body:not(.theme-light) .quote-overlay { background: rgba(0, 0, 0, 0.6); }

/* Sliders/tabs and any remaining white surfaces */
body:not(.theme-light) .tabs-bar,
body:not(.theme-light) .filter-bar,
body:not(.theme-light) .toolbar { background: var(--surface) !important; }

/* All places using rgba(0,0,0,0.xx) border become rgba(255,255,255,0.xx) */
body:not(.theme-light) .svc-card,
body:not(.theme-light) .prod-card,
body:not(.theme-light) .work-card,
body:not(.theme-light) .process-step,
body:not(.theme-light) .cinfo-block,
body:not(.theme-light) .about-feats,
body:not(.theme-light) .prod-tabs,
body:not(.theme-light) .prod-more-toggle { box-shadow: none; }

/* Prevent any forced #fff backgrounds from appearing */
body:not(.theme-light) [style*="background: #fff"],
body:not(.theme-light) [style*="background:#fff"],
body:not(.theme-light) [style*="background: white"] { background: var(--surface) !important; }

/* Contact section outer bg was becoming a dark heavy frame — make it transparent */
body:not(.theme-light) #iletisim {
    background: transparent !important;
    border-top: 1px solid var(--border);
}

/* =============================================================
   LIGHT MODE — soft premium, iPhone-style too
============================================================= */
body.theme-light {
    --bg:        #F5F5F7;          /* Apple light gray */
    --surface:   #ffffff;
    --surface-2: #ECECEE;
    --text:      #1D1D1F;
    --muted:     #6E6E73;
    --dim:       #86868B;
    --border:    rgba(0, 0, 0, 0.08);
    --border-md: rgba(0, 0, 0, 0.16);
    --navy:      #1D1D1F;

    background: var(--bg);
    color: var(--text);
}
body.theme-light #header {
    background: rgba(245, 245, 247, 0.82);
    backdrop-filter: blur(24px) saturate(180%);
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
body.theme-light #header.scrolled {
    background: rgba(245, 245, 247, 0.96);
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
}
body.theme-light .hero-badge { color: var(--muted); }
body.theme-light h1 em, body.theme-light h2 em, body.theme-light h3 em, body.theme-light .section-title em {
    color: var(--accent);
    -webkit-text-fill-color: var(--accent);
}
body.theme-light .section-tag { color: var(--accent); }
body.theme-light .section-tag::before { background: var(--accent); opacity: 0.6; }
body.theme-light .btn-primary {
    background: #D87B36 !important;
    color: #fff !important;
    box-shadow: 0 2px 10px rgba(249, 115, 22, 0.22);
}
body.theme-light .btn-primary:hover { background: #B8651F !important; }
body.theme-light .svc-card, body.theme-light .prod-card {
    background: #fff;
    border: 1px solid var(--border);
}
body.theme-light .svc-card:hover, body.theme-light .prod-card:hover {
    border-color: rgba(0, 0, 0, 0.15);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);
}
body.theme-light .card-ico { color: var(--accent); }
body.theme-light .prod-tag { background: rgba(167, 139, 250, 0.1); color: var(--accent); border: 1px solid rgba(167, 139, 250, 0.22); }
/* Light mode tabs — original is dark navy pill; flip to light */
body.theme-light .prod-tabs {
    background: #fff !important;
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04);
}
body.theme-light .prod-tab { color: var(--muted); }
body.theme-light .prod-tab:hover { color: var(--text); }
body.theme-light .prod-tab.active {
    background: var(--accent);
    color: #fff;
    box-shadow: 0 4px 14px rgba(139, 92, 246, 0.35);
}
body.theme-light .prod-tab-dot { background: var(--accent); opacity: 0.45; }
body.theme-light .prod-tab.active .prod-tab-dot { background: #fff; opacity: 1; }
body.theme-light .stat-num { color: var(--text); }
body.theme-light .fab-main {
    background: rgba(255, 255, 255, 0.9) !important;
    border: 1px solid rgba(0, 0, 0, 0.08);
    backdrop-filter: blur(20px);
    color: var(--text);
}
body.theme-light .scroll-top-btn {
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(0, 0, 0, 0.08);
    color: var(--text);
}

/* =============================================================
   THEME TOGGLE BUTTON
============================================================= */
.theme-toggle {
    position: fixed;
    top: 1.5rem;
    right: 7rem;
    z-index: 600;
    width: 40px; height: 40px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.15);
    color: #fff;
    cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    backdrop-filter: blur(20px);
}
.theme-toggle:hover {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.3);
}
.theme-toggle svg { width: 18px; height: 18px; }
.theme-toggle .icon-sun  { display: none; }
.theme-toggle .icon-moon { display: block; }
body.theme-light .theme-toggle {
    background: rgba(0, 0, 0, 0.04);
    border-color: rgba(0, 0, 0, 0.1);
    color: var(--navy);
}
body.theme-light .theme-toggle:hover { background: rgba(0, 0, 0, 0.08); }
body.theme-light .theme-toggle .icon-sun  { display: block; }
body.theme-light .theme-toggle .icon-moon { display: none; }

@media (max-width: 768px) {
    .theme-toggle { right: 5rem; top: 1.25rem; width: 36px; height: 36px; }
    .theme-toggle svg { width: 16px; height: 16px; }
}
