/*
Theme Name: Surgeryes Neumorphism
Theme URI: https://surgeryes.com
Description: Child theme with Neumorphism (Soft UI) design for medical equipment company
Author: Surgeryes Design Team
Author URI: https://surgeryes.com
Template: hello-elementor
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: surgeryes-child
*/

@import url('https://fonts.googleapis.com/css2?family=Lexend:wght@300;400;500;600;700&family=Source+Sans+3:wght@300;400;500;600;700&display=swap');

:root {
    --neu-bg: #F0F2F5;
    --neu-bg-light: #F8FAFC;
    --neu-bg-dark: #E2E8F0;
    --neu-shadow-dark: rgba(209, 213, 219, 0.8);
    --neu-shadow-light: rgba(255, 255, 255, 0.9);
    --primary-blue: #2563EB;
    --primary-blue-light: #3B82F6;
    --primary-green: #059669;
    --accent-orange: #F59E0B;
    --accent-purple: #8B5CF6;
    --text-primary: #1F2937;
    --text-secondary: #4B5563;
    --text-muted: #6B7280;
    --font-heading: 'Lexend', sans-serif;
    --font-body: 'Source Sans 3', sans-serif;
    --radius-lg: 24px;
    --radius-md: 16px;
    --radius-sm: 12px;
    --radius-xl: 30px;
}

body {
    font-family: var(--font-body) !important;
    background-color: var(--neu-bg) !important;
    color: var(--text-secondary);
    line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading) !important;
    color: var(--text-primary);
    font-weight: 600;
    line-height: 1.2;
}

h1 { font-size: 3rem; font-weight: 700; }
h2 { font-size: 2.25rem; }
h3 { font-size: 1.5rem; }
h4 { font-size: 1.25rem; }

a {
    color: var(--primary-blue);
    text-decoration: none;
    transition: color 0.2s ease;
}

a:hover {
    color: var(--primary-blue-light);
}

.neu-card, .neu-card-lg {
    background: var(--neu-bg);
    border-radius: var(--radius-lg);
    box-shadow: 10px 10px 20px var(--neu-shadow-dark), -10px -10px 20px var(--neu-shadow-light);
    padding: 32px;
    border: none !important;
    transition: all 0.3s ease;
}

.neu-card:hover {
    box-shadow: 12px 12px 24px var(--neu-shadow-dark), -12px -12px 24px var(--neu-shadow-light);
}

.neu-card-md {
    background: var(--neu-bg);
    border-radius: var(--radius-md);
    box-shadow: 8px 8px 16px var(--neu-shadow-dark), -8px -8px 16px var(--neu-shadow-light);
    padding: 24px;
    border: none !important;
}

.neu-card-sm {
    background: var(--neu-bg);
    border-radius: var(--radius-sm);
    box-shadow: 6px 6px 12px var(--neu-shadow-dark), -6px -6px 12px var(--neu-shadow-light);
    padding: 16px;
    border: none !important;
}

.neu-pressed {
    background: var(--neu-bg);
    border-radius: var(--radius-md);
    box-shadow: inset 4px 4px 8px var(--neu-shadow-dark), inset -4px -4px 8px var(--neu-shadow-light);
    border: none !important;
}

.neu-gradient-blue {
    background: linear-gradient(145deg, rgba(37, 99, 235, 0.15), rgba(59, 130, 246, 0.1));
    border-radius: var(--radius-lg);
    box-shadow: 10px 10px 20px var(--neu-shadow-dark), -10px -10px 20px var(--neu-shadow-light);
    padding: 32px;
    border: none !important;
}

.neu-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--neu-bg) !important;
    color: var(--primary-blue) !important;
    font-family: var(--font-heading);
    font-weight: 600;
    font-size: 1rem;
    padding: 16px 32px;
    border-radius: var(--radius-xl);
    border: none !important;
    box-shadow: 6px 6px 12px var(--neu-shadow-dark), -6px -6px 12px var(--neu-shadow-light);
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
}

.neu-btn:hover {
    box-shadow: 4px 4px 8px var(--neu-shadow-dark), -4px -4px 8px var(--neu-shadow-light);
    transform: translateY(-2px);
}

.neu-btn:active {
    box-shadow: inset 4px 4px 8px var(--neu-shadow-dark), inset -4px -4px 8px var(--neu-shadow-light);
    transform: translateY(0);
}

.neu-btn-primary {
    background: linear-gradient(145deg, var(--primary-blue), var(--primary-blue-light)) !important;
    color: #FFFFFF !important;
    box-shadow: 6px 6px 12px rgba(37, 99, 235, 0.3), -6px -6px 12px rgba(255, 255, 255, 0.8);
}

.neu-btn-secondary {
    background: var(--neu-bg) !important;
    color: var(--text-secondary) !important;
}

.neu-input, .neu-input input, .neu-input textarea, .neu-input select {
    background: var(--neu-bg) !important;
    border: none !important;
    border-radius: var(--radius-sm);
    padding: 16px 20px;
    font-family: var(--font-body);
    font-size: 1rem;
    color: var(--text-primary);
    box-shadow: inset 4px 4px 8px var(--neu-shadow-dark), inset -4px -4px 8px var(--neu-shadow-light);
    width: 100%;
    transition: all 0.2s ease;
}

.neu-input:focus, .neu-input input:focus, .neu-input textarea:focus, .neu-input select:focus {
    outline: none !important;
    box-shadow: inset 6px 6px 12px var(--neu-shadow-dark), inset -6px -6px 12px var(--neu-shadow-light);
}

.neu-nav {
    background: rgba(240, 242, 245, 0.95) !important;
    backdrop-filter: blur(10px);
    border-radius: var(--radius-md);
    box-shadow: 6px 6px 12px rgba(209, 213, 219, 0.6), -6px -6px 12px rgba(255, 255, 255, 0.7);
    padding: 16px 24px;
}

.neu-circle {
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(145deg, var(--neu-bg-light), var(--neu-bg-dark));
    border-radius: 50%;
    box-shadow: 8px 8px 16px var(--neu-shadow-dark), -8px -8px 16px var(--neu-shadow-light);
}

.neu-circle-sm { width: 48px; height: 48px; }
.neu-circle-md { width: 64px; height: 64px; }
.neu-circle-lg { width: 120px; height: 120px; }

.neu-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    background: linear-gradient(145deg, var(--neu-bg-light), var(--neu-bg-dark));
    border-radius: var(--radius-md);
    box-shadow: 6px 6px 12px var(--neu-shadow-dark), -6px -6px 12px var(--neu-shadow-light);
}

.text-primary-blue { color: var(--primary-blue) !important; }
.text-primary-green { color: var(--primary-green) !important; }
.text-accent-orange { color: var(--accent-orange) !important; }
.text-primary { color: var(--text-primary) !important; }
.text-secondary { color: var(--text-secondary) !important; }
.font-heading { font-family: var(--font-heading) !important; }
.font-body { font-family: var(--font-body) !important; }

.elementor-section, .elementor-container, .elementor-widget-wrap, .elementor-element {
    border: none !important;
}

.elementor-widget-heading h1, .elementor-widget-heading h2, .elementor-widget-heading h3,
.elementor-widget-heading h4, .elementor-widget-heading h5, .elementor-widget-heading h6 {
    font-family: var(--font-heading) !important;
}

.elementor-widget-text-editor p, .elementor-widget-text-editor span {
    font-family: var(--font-body) !important;
}

@media (max-width: 768px) {
    .neu-card, .neu-card-lg, .neu-gradient-blue {
        border-radius: var(--radius-md);
        padding: 24px;
    }
    .neu-card-md, .neu-card-sm {
        border-radius: var(--radius-sm);
        padding: 16px;
    }
    .neu-btn {
        padding: 12px 24px;
        font-size: 0.9rem;
    }
    .neu-nav {
        border-radius: 0;
        margin: 0;
    }
    h1 { font-size: 2rem; }
    h2 { font-size: 1.75rem; }
    h3 { font-size: 1.25rem; }
}

.neu-stat-number {
    font-family: var(--font-heading);
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--primary-blue);
    line-height: 1;
}

.neu-stat-label {
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: var(--text-secondary);
    margin-top: 4px;
}

.neu-testimonial {
    background: var(--neu-bg);
    border-radius: var(--radius-lg);
    box-shadow: 10px 10px 20px var(--neu-shadow-dark), -10px -10px 20px var(--neu-shadow-light);
    padding: 32px;
}

.neu-testimonial-avatar {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: linear-gradient(145deg, var(--neu-bg-light), var(--neu-bg-dark));
    box-shadow: 6px 6px 12px var(--neu-shadow-dark), -6px -6px 12px var(--neu-shadow-light);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-heading);
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--primary-blue);
}

.neu-stars {
    display: flex;
    gap: 4px;
}

.neu-stars svg, .neu-stars i {
    width: 20px;
    height: 20px;
    color: #FBBF24;
    fill: #FBBF24;
}

.neu-team-card {
    background: var(--neu-bg);
    border-radius: var(--radius-lg);
    box-shadow: 10px 10px 20px var(--neu-shadow-dark), -10px -10px 20px var(--neu-shadow-light);
    padding: 40px 32px;
    text-align: center;
}

.neu-team-avatar {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: linear-gradient(145deg, var(--neu-bg-light), var(--neu-bg-dark));
    box-shadow: 8px 8px 16px var(--neu-shadow-dark), -8px -8px 16px var(--neu-shadow-light);
    margin: 0 auto 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-heading);
    font-size: 2rem;
    font-weight: 700;
}

.neu-footer {
    background: var(--neu-bg);
    border-radius: var(--radius-lg);
    box-shadow: 10px 10px 20px var(--neu-shadow-dark), -10px -10px 20px var(--neu-shadow-light);
    padding: 64px 48px;
    margin: 32px;
}

.neu-social-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: var(--neu-bg);
    border-radius: 50%;
    box-shadow: 4px 4px 8px var(--neu-shadow-dark), -4px -4px 8px var(--neu-shadow-light);
    color: var(--text-secondary);
    transition: all 0.2s ease;
}

.neu-social-icon:hover {
    color: var(--primary-blue);
    box-shadow: 6px 6px 12px var(--neu-shadow-dark), -6px -6px 12px var(--neu-shadow-light);
}
