/* Colors CSS - Paleta de cores da marca MaisWifi */

:root {
    /* Cores principais da marca */
    --primary-green: #38ad11;
    --accent-yellow: #ffcc2a;
    --support-blue: #2e76c2;
    
    /* Variações das cores principais */
    --primary-green-light: #4bc91a;
    --primary-green-dark: #2d8a0d;
    --accent-yellow-light: #ffd54f;
    --accent-yellow-dark: #f9a825;
    --support-blue-light: #42a5f5;
    --support-blue-dark: #1565c0;
    
    /* Cores neutras */
    --white: #ffffff;
    --light-gray: #f8f9fa;
    --medium-gray: #e0e0e0;
    --dark-gray: #666666;
    --text-dark: #333333;
    --text-light: #666666;
    
    /* Cores de estado */
    --success: #28a745;
    --warning: #ffc107;
    --error: #dc3545;
    --info: #17a2b8;
    
    /* Gradientes */
    --gradient-primary: linear-gradient(135deg, var(--primary-green), var(--primary-green-light));
    --gradient-accent: linear-gradient(135deg, var(--accent-yellow), var(--accent-yellow-light));
    --gradient-support: linear-gradient(135deg, var(--support-blue), var(--support-blue-light));
}

/* Aplicação das cores nos elementos */

/* Texto */
body {
    color: var(--text-dark);
}

.text-primary {
    color: var(--primary-green);
}

.text-accent {
    color: var(--accent-yellow-dark);
}

.text-support {
    color: var(--support-blue);
}

.text-light {
    color: var(--text-light);
}

/* Links */
a {
    color: var(--support-blue);
}

a:hover {
    color: var(--support-blue-dark);
}

.nav-link {
    color: var(--text-dark);
}

.nav-link:hover {
    color: var(--primary-green);
}

.footer-link {
    color: var(--text-light);
}

.footer-link:hover {
    color: var(--primary-green);
}

.contact-item a {
    color: var(--support-blue);
}

.contact-item a:hover {
    color: var(--support-blue-dark);
}

.cookie-text a {
    color: var(--support-blue);
}

.cookie-text a:hover {
    color: var(--support-blue-dark);
}

/* Seções com backgrounds */
.stats-section {
    background: var(--light-gray);
}

.social-impact-section {
    background: var(--light-gray);
}

/* Cards e widgets */
.step-card {
    background: var(--white);
    border: 1px solid var(--medium-gray);
}

.step-card:hover {
    border-color: var(--primary-green);
}

.stat-card {
    background: var(--white);
}

.impact-card {
    background: var(--white);
}

/* Ícones coloridos */
.step-icon {
    background: var(--light-gray);
}

.step-card:nth-child(1) .step-icon {
    background: rgba(56, 173, 17, 0.1);
}

.step-card:nth-child(2) .step-icon {
    background: rgba(255, 204, 42, 0.1);
}

.step-card:nth-child(3) .step-icon {
    background: rgba(46, 118, 194, 0.1);
}

.impact-icon {
    background: rgba(46, 118, 194, 0.1);
}

/* Estatísticas coloridas */
.stat-card:nth-child(1) .stat-number {
    color: var(--primary-green);
}

.stat-card:nth-child(2) .stat-number {
    color: var(--support-blue);
}

.stat-card:nth-child(3) .stat-number {
    color: var(--accent-yellow-dark);
}

/* Formulários */
.form {
    background: var(--light-gray);
}

.form-input,
.form-textarea {
    background: var(--white);
    border-color: var(--medium-gray);
}

.form-input:focus,
.form-textarea:focus {
    border-color: var(--primary-green);
}

/* Estados de hover e focus */
.step-card:hover {
    box-shadow: 0 4px 12px rgba(56, 173, 17, 0.15);
}

.stat-card:hover {
    transform: translateY(-2px);
}

.impact-card:hover {
    box-shadow: 0 4px 12px rgba(46, 118, 194, 0.15);
}

/* Cores específicas para elementos especiais */
.hero-section {
    background: linear-gradient(135deg, rgba(56, 173, 17, 0.05), rgba(255, 255, 255, 1));
}

.business-section {
    background: rgba(46, 118, 194, 0.02);
}

.browser-connection-section {
    background: rgba(255, 204, 42, 0.05);
}

/* Sombras coloridas */
.shadow-primary {
    box-shadow: 0 4px 12px rgba(56, 173, 17, 0.15);
}

.shadow-accent {
    box-shadow: 0 4px 12px rgba(255, 204, 42, 0.15);
}

.shadow-support {
    box-shadow: 0 4px 12px rgba(46, 118, 194, 0.15);
}