:root {
    --accent-cyan: #14bfc7;
    --accent-blue: #1976d2;
    --gradient-main: linear-gradient(120deg, #1976d2, #14bfc7);
    --brand-canvas: #f2f4f5;
    --brand-paper: #ffffff;
    --brand-ink: #101316;
    --brand-muted: #6f777c;
}

body.light-mode {
    --bg-dark: var(--brand-canvas);
    --bg-card: var(--brand-paper);
    --white: var(--brand-ink);
    --silver: #394248;
    --nav-bg-scrolled: rgba(255,255,255,.98);
}

body.light-mode {
    background: var(--brand-canvas);
    color: var(--brand-ink);
    font-family: 'Inter', 'Montserrat', ui-sans-serif, system-ui, sans-serif;
}
body.light-mode nav,
body.light-mode nav.scrolled {
    background: rgba(255,255,255,.97);
    border: 0;
    box-shadow: 0 2px 10px rgba(16,19,22,.05);
    backdrop-filter: none;
}
body.light-mode .logo { color: var(--brand-ink); }
body.light-mode .logo img { height: 42px; width: auto; }
body.light-mode .logo span,
body.light-mode .team-role,
body.light-mode .stat-number,
body.light-mode .cart-total span { color: var(--accent-blue); }
body.light-mode .nav-links a { color: var(--brand-ink); }
body.light-mode .nav-links a:hover { background: #e9f4fc; color: var(--accent-blue); box-shadow: none; transform: none; }
body.light-mode #adpanel-btn,
body.light-mode #adpanel-btn:hover { background: var(--accent-blue); color: #fff !important; border: 0; box-shadow: none; letter-spacing: 0; }
body.light-mode .user-btn { color: var(--brand-ink); border: 1px solid #dce1e4; background: #fff; }
body.light-mode .user-btn:hover { background: #e9f4fc; color: var(--accent-blue); box-shadow: none; transform: none; }
body.light-mode .cart-icon-wrapper { color: var(--brand-ink); }
body.light-mode .cart-badge { background: var(--accent-blue); }

body.light-mode .hero,
body.light-mode .page-header {
    background: var(--brand-canvas);
}
body.light-mode .hero::after,
body.light-mode .page-header::after { display: none; }
body.light-mode .title-animate,
body.light-mode .header-content h1 { color: var(--brand-ink); }
body.light-mode .hero p,
body.light-mode .section-header p { color: var(--brand-muted); }
body.light-mode .text-gradient,
body.light-mode .text-gradient-dynamic {
    background: none;
    color: var(--accent-blue);
    -webkit-text-fill-color: var(--accent-blue);
    animation: none;
}
body.light-mode .btn-primary,
body.light-mode .auth-btn {
    background: var(--accent-blue);
    color: #fff;
    box-shadow: none;
}
body.light-mode .btn-primary:hover,
body.light-mode .auth-btn:hover { background: #1265b6; box-shadow: 0 4px 18px rgba(25,118,210,.22); transform: translateY(-1px); }

body.light-mode .tech-section { background: var(--brand-paper); border: 0; }
body.light-mode .tech-badge {
    border: 0;
    border-radius: 999px;
    background: #f2f4f5;
    color: #394248;
}
body.light-mode .tech-badge:hover { background: #e9f4fc; color: var(--accent-blue); box-shadow: none; }
body.light-mode .section-header h2,
body.light-mode .service-card h3,
body.light-mode .exp-text h2,
body.light-mode .team-member h4,
body.light-mode .contact-info h3 { color: var(--brand-ink); }
body.light-mode .service-card,
body.light-mode .stat-card,
body.light-mode .team-member,
body.light-mode .contact-wrapper,
body.light-mode .auth-content,
body.light-mode .cart-sidebar,
body.light-mode .user-menu {
    border: 0;
    border-radius: 28px;
    background: var(--brand-paper);
    box-shadow: 0 4px 6px -1px rgba(0,0,0,.08), 0 2px 4px -2px rgba(0,0,0,.08);
}
body.light-mode .service-card:hover,
body.light-mode .stat-card:hover,
body.light-mode .team-member:hover { border-color: transparent; box-shadow: 0 6px 16px rgba(0,0,0,.09); }
body.light-mode .service-card::before,
body.light-mode .service-card:hover::before,
body.light-mode .card-image-wrapper::after { display: none; }
body.light-mode .card-image-wrapper { background: #e9f4fc; }
body.light-mode .card-content { padding: 24px; }
body.light-mode .service-card p,
body.light-mode .contact-info p { color: #394248; }
body.light-mode .experience { background: #e9f4fc; }
body.light-mode .stat-card { background: #fff; }
body.light-mode .stat-card:hover { border-color: transparent; box-shadow: 0 6px 16px rgba(0,0,0,.08); }
body.light-mode .team-member img { border: 3px solid #d9f3f3; box-shadow: none; }
body.light-mode .contact-wrapper { border: 0; box-shadow: 0 4px 6px -1px rgba(0,0,0,.08), 0 2px 4px -2px rgba(0,0,0,.08); }
body.light-mode .info-icon { background: #e9f4fc; color: var(--accent-blue); }
body.light-mode form input,
body.light-mode form textarea,
body.light-mode .auth-input {
    background: #f7f8f9;
    border: 1px solid #e2e6e8;
    border-radius: 999px;
    color: var(--brand-ink);
}
body.light-mode form textarea { border-radius: 20px; }
body.light-mode form input:focus,
body.light-mode form textarea:focus,
body.light-mode .auth-input:focus { border-color: var(--accent-blue); }
body.light-mode .cart-sidebar { border-radius: 28px 0 0 28px; }
body.light-mode .cart-header,
body.light-mode .cart-footer { border-color: #e6e9eb; }
body.light-mode .cart-footer { background: #fff; }
body.light-mode .cart-item { border-color: #e6e9eb; }
body.light-mode .cart-item-info h4,
body.light-mode .cart-total { color: var(--brand-ink); }
body.light-mode .cart-item-info p { color: var(--accent-blue); }
body.light-mode .cart-remove { color: #6f777c; }
body.light-mode .btn-checkout { border-radius: 999px; background: var(--accent-blue); }
body.light-mode footer { background: var(--brand-ink); color: rgba(255,255,255,.72); border: 0; }
body.light-mode .auth-title { color: var(--brand-ink); }
body.light-mode .auth-close { color: var(--brand-muted); }
body.light-mode .auth-content { border: 0; }
body.light-mode .auth-switch { color: var(--brand-muted); }
body.light-mode .auth-switch:hover { color: var(--accent-blue); }
body.light-mode .auth-error { color: #b42318; }
body.light-mode .btn-small,
body.light-mode .service-card:hover .btn-small {
    border: 0;
    border-radius: 999px;
    background: #e9f4fc;
    color: var(--accent-blue);
    text-transform: none;
}

@media (max-width: 768px) {
    body.light-mode .nav-links {
        background: #fff;
        border: 0;
        box-shadow: -8px 0 24px rgba(0,0,0,.08);
    }
    body.light-mode .nav-links a { color: var(--brand-ink); }
}
@media (prefers-reduced-motion: reduce) {
    body.light-mode *, body.light-mode *::before, body.light-mode *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
    }
}