/* assets/css/farfalla-colors.css
   Override de colores del template Arsha para Farfalla.
   Paleta institucional:
   - Azul profundo/petróleo: #225A6A
   - Verde olivo/jade:       #7BAF9E
   - Dorado/mostaza:         #D6A94A
   - Blanco/gris claro:      #F5F5F5
*/

:root{
  --far-primary: #225A6A;
  --far-secondary: #7BAF9E;
  --far-accent: #D6A94A;
  --far-light: #F5F5F5;
  --far-dark: #163B45;
}

/* Fondos principales */
#hero { background: var(--far-primary); }
.section-bg { background-color: var(--far-light); }
#preloader { background: var(--far-primary); }
#preloader:before { border-color: var(--far-primary); }

/* Títulos */
.section-title h2 { color: var(--far-primary); }
.section-title h2::after { background: var(--far-accent); }

/* Links / estados */
a { color: var(--far-primary); }
a:hover { color: var(--far-secondary); }

/* Navbar */
.navbar a:hover,
.navbar .active,
.navbar .active:focus,
.navbar li:hover > a { color: var(--far-accent); }

.navbar .getstarted,
.navbar .getstarted:focus {
  border-color: var(--far-accent);
}
.navbar .getstarted:hover,
.navbar .getstarted:focus:hover {
  background: var(--far-accent);
  border-color: var(--far-accent);
  color: #fff;
}

/* Botones del hero */
#hero .btn-get-started { background: var(--far-accent); }
#hero .btn-get-started:hover { background: var(--far-secondary); }
#hero .btn-watch-video:hover i { color: var(--far-accent); }

/* Iconos / acentos del template */
.about .content ul i,
.services .icon-box .icon i,
.why-us .accordion-list span,
.portfolio #portfolio-flters li.filter-active,
.portfolio #portfolio-flters li:hover,
.back-to-top,
.contact .info i,
.contact .info .social-links a:hover {
  color: var(--far-accent);
}

.back-to-top { background: var(--far-accent); }
.back-to-top:hover { background: var(--far-secondary); }

/* CTA overlay */
.cta .cta-btn:hover{
  background: var(--far-accent);
  border-color: var(--far-accent);
}

/* Formularios */
.contact .info,
.contact .php-email-form {
  border-top-color: var(--far-accent);
  border-bottom-color: var(--far-accent);
}
.contact .php-email-form input:focus,
.contact .php-email-form textarea:focus {
  border-color: var(--far-secondary);
}
.contact .php-email-form button[type=submit] {
  background: var(--far-accent);
}
.contact .php-email-form button[type=submit]:hover {
  background: var(--far-secondary);
}

/* Team hover */
.team .member .social a:hover { background: var(--far-accent); }
.team .member h4 { color: var(--far-primary); }