@charset "UTF-8";

:root {
  --default-font: "Georgia", "Times New Roman", Times, serif;
  --heading-font: "Work Sans", sans-serif;
  --nav-font: "Poppins", sans-serif;
}

body {
  color: var(--default-color);
  background-color: var(--background-color);
  font-family: var(--default-font);
}

a { color: var(--accent-color); text-decoration: none; transition: 0.3s; }
a:hover { color: color-mix(in srgb, var(--accent-color), transparent 25%); }

h1, h2, h3, h4, h5, h6 { color: var(--heading-color); font-family: var(--heading-font); }
h1 { font-weight: 900; }
h2, h3 { font-weight: 600; }

/*--------------------------------------------------------------
# Global Header
--------------------------------------------------------------*/
.header {
  --background-color: #14335e;
  --default-color: #ffffff;
  --heading-color: #ffffff;
  color: var(--default-color);
  background-color: var(--background-color);
  padding: 10px 0;
  transition: all 0.5s;
  z-index: 997;
}
.header .logo { line-height: 1; }
.header .logo img { max-height: 32px; margin-right: 8px; }
.header .logo i { font-size: 24px; margin-right: 6px; }
.header .logo h1 { font-size: 28px; margin: 0; font-weight: 400; color: var(--heading-color); }
.scrolled .header { box-shadow: 0px 0 18px rgba(0,0,0,0.1); }

/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
@media (min-width: 1200px) {
  .navmenu { padding: 0; }
  .navmenu ul { margin: 0; padding: 0; display: flex; list-style: none; align-items: center; }
  .navmenu li { position: relative; }
  .navmenu a, .navmenu a:focus {
    color: var(--nav-color); padding: 18px 15px; font-size: 14px; font-family: var(--nav-font);
    font-weight: 400; display: flex; align-items: center; justify-content: space-between; white-space: nowrap; transition: 0.3s;
  }
  .navmenu a i, .navmenu a:focus i { font-size: 12px; line-height: 0; margin-left: 5px; transition: 0.3s; }
  .navmenu li:last-child a { padding-right: 0; }
  .navmenu li:hover > a, .navmenu .active, .navmenu .active:focus { color: var(--nav-hover-color); }
  .navmenu .dropdown ul {
    margin: 0; padding: 10px 0; background: var(--nav-dropdown-background-color); display: block; position: absolute;
    visibility: hidden; left: 14px; top: 130%; opacity: 0; transition: 0.3s; border-radius: 4px; z-index: 99;
    box-shadow: 0px 0px 30px rgba(0,0,0,0.1);
  }
  .navmenu .dropdown ul li { min-width: 200px; }
  .navmenu .dropdown ul a { padding: 10px 20px; font-size: 15px; text-transform: none; color: var(--nav-dropdown-color); }
  .navmenu .dropdown ul a i { font-size: 12px; }
  .navmenu .dropdown ul a:hover, .navmenu .dropdown ul .active:hover, .navmenu .dropdown ul li:hover > a { color: var(--nav-dropdown-hover-color); }
  .navmenu .dropdown:hover > ul { opacity: 1; top: 100%; visibility: visible; }
  .navmenu .dropdown .dropdown ul { top: 0; left: -90%; visibility: hidden; }
  .navmenu .dropdown .dropdown:hover > ul { opacity: 1; top: 0; left: -100%; visibility: visible; }
}

@media (max-width: 1199px) {
  .mobile-nav-toggle { color: var(--nav-color); font-size: 28px; line-height: 0; margin-right: 10px; cursor: pointer; transition: color 0.3s; }
  .navmenu { padding: 0; z-index: 9997; }
  .navmenu ul {
    display: none; list-style: none; position: absolute; inset: 60px 20px 20px 20px; padding: 10px 0; margin: 0;
    border-radius: 6px; background-color: var(--nav-mobile-background-color); overflow-y: auto; transition: 0.3s; z-index: 9998;
    box-shadow: 0px 0px 30px rgba(0,0,0,0.1);
  }
  .navmenu a, .navmenu a:focus {
    color: var(--nav-dropdown-color); padding: 10px 20px; font-family: var(--nav-font); font-size: 17px; font-weight: 500;
    display: flex; align-items: center; justify-content: space-between; white-space: nowrap; transition: 0.3s;
  }
  .navmenu a i, .navmenu a:focus i {
    font-size: 12px; line-height: 0; margin-left: 5px; width: 30px; height: 30px; display: flex; align-items: center;
    justify-content: center; border-radius: 50%; transition: 0.3s; background-color: color-mix(in srgb, var(--accent-color), transparent 90%);
  }
  .navmenu a i:hover, .navmenu a:focus i:hover { background-color: var(--accent-color); color: var(--contrast-color); }
  .navmenu a:hover, .navmenu .active, .navmenu .active:focus { color: var(--nav-dropdown-hover-color); }
  .navmenu .active i, .navmenu .active:focus i { background-color: var(--accent-color); color: var(--contrast-color); transform: rotate(180deg); }
  .navmenu .dropdown ul {
    position: static; display: none; z-index: 99; padding: 10px 0; margin: 10px 20px;
    background-color: var(--nav-dropdown-background-color); border: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
    box-shadow: none; transition: all 0.5s ease-in-out;
  }
  .navmenu .dropdown ul ul { background-color: rgba(33,37,41,0.1); }
  .navmenu .dropdown > .dropdown-active { display: block; background-color: rgba(33,37,41,0.03); }
  .mobile-nav-active { overflow: hidden; }
  .mobile-nav-active .mobile-nav-toggle { color: #fff; position: absolute; font-size: 32px; top: 15px; right: 15px; margin-right: 0; z-index: 9999; }
  .mobile-nav-active .navmenu { position: fixed; overflow: hidden; inset: 0; background: rgba(33,37,41,0.8); transition: 0.3s; }
  .mobile-nav-active .navmenu > ul { display: block; }
}

/*--------------------------------------------------------------
# Global Footer
--------------------------------------------------------------*/
.footer-16 {
  background: var(--background-color); color: var(--default-color); font-size: 15px; padding: 100px 0 0;
  border-top: 1px solid color-mix(in srgb, var(--default-color), transparent 92%);
}
.footer-16 .footer-main { margin-bottom: 80px; }
.footer-16 .brand-section .logo { text-decoration: none; }
.footer-16 .brand-section .logo .sitename { font-family: var(--heading-font); font-size: 32px; font-weight: 300; color: var(--heading-color); letter-spacing: -0.5px; }
.footer-16 .brand-section .brand-description { font-size: 18px; line-height: 1.7; color: color-mix(in srgb, var(--default-color), transparent 25%); font-weight: 300; max-width: 380px; margin: 0; }
.footer-16 .brand-section .contact-info .contact-item { display: flex; align-items: flex-start; margin-bottom: 16px; font-size: 15px; color: color-mix(in srgb, var(--default-color), transparent 20%); }
.footer-16 .brand-section .contact-info .contact-item i { font-size: 16px; color: var(--accent-color); margin-right: 12px; margin-top: 3px; flex-shrink: 0; }
.footer-16 .brand-section .contact-info .contact-item span { line-height: 1.6; }
.footer-16 .footer-nav-wrapper { padding-left: 60px; }
@media (max-width: 991px) { .footer-16 .footer-nav-wrapper { padding-left: 0; margin-top: 50px; } }
.footer-16 .nav-column { margin-bottom: 40px; }
.footer-16 .nav-column h6 { font-family: var(--heading-font); font-size: 16px; font-weight: 400; color: var(--heading-color); margin-bottom: 24px; letter-spacing: 0.3px; }
.footer-16 .nav-column .footer-nav { display: flex; flex-direction: column; gap: 12px; }
.footer-16 .nav-column .footer-nav a { color: color-mix(in srgb, var(--default-color), transparent 30%); text-decoration: none; font-size: 15px; font-weight: 300; transition: all 0.3s ease; line-height: 1.4; }
.footer-16 .nav-column .footer-nav a:hover { color: var(--accent-color); transform: translateX(4px); }
.footer-16 .footer-social { padding: 50px 0; border-top: 1px solid color-mix(in srgb, var(--default-color), transparent 94%); border-bottom: 1px solid color-mix(in srgb, var(--default-color), transparent 94%); }
.footer-16 .footer-social .newsletter-section h5 { font-family: var(--heading-font); font-size: 20px; font-weight: 300; color: var(--heading-color); margin-bottom: 12px; letter-spacing: -0.2px; }
.footer-16 .footer-social .newsletter-section p { font-size: 16px; color: color-mix(in srgb, var(--default-color), transparent 35%); margin: 0; line-height: 1.6; max-width: 340px; }
.footer-16 .footer-social .social-section { display: flex; justify-content: flex-end; }
@media (max-width: 991px) { .footer-16 .footer-social .social-section { justify-content: flex-start; margin-top: 30px; } }
.footer-16 .footer-social .social-links { display: flex; gap: 32px; align-items: center; }
@media (max-width: 576px) { .footer-16 .footer-social .social-links { gap: 20px; flex-wrap: wrap; } }
.footer-16 .footer-social .social-links .social-link { display: flex; align-items: center; gap: 8px; text-decoration: none; color: color-mix(in srgb, var(--default-color), transparent 40%); font-size: 14px; font-weight: 400; transition: all 0.3s ease; }
.footer-16 .footer-social .social-links .social-link i { font-size: 18px; transition: all 0.3s ease; }
.footer-16 .footer-social .social-links .social-link:hover { color: var(--accent-color); transform: translateY(-2px); }
.footer-16 .footer-bottom { padding: 30px 0; }
.footer-16 .footer-bottom .copyright p { margin: 0; font-size: 14px; color: color-mix(in srgb, var(--default-color), transparent 45%); font-weight: 300; }
.footer-16 .footer-bottom .copyright p .sitename { color: var(--heading-color); font-weight: 400; }
.footer-16 .footer-bottom .legal-links { display: flex; align-items: center; justify-content: flex-end; gap: 24px; }
@media (max-width: 991px) { .footer-16 .footer-bottom .legal-links { justify-content: flex-start; margin-top: 20px; flex-wrap: wrap; } }
.footer-16 .footer-bottom .legal-links a { font-size: 13px; color: color-mix(in srgb, var(--default-color), transparent 50%); text-decoration: none; font-weight: 300; transition: color 0.3s ease; }
.footer-16 .footer-bottom .legal-links a:hover { color: var(--accent-color); }
@media (max-width: 768px) { .footer-16 .footer-bottom { text-align: center; } .footer-16 .footer-bottom .legal-links { justify-content: center; } }

/*--------------------------------------------------------------
# Scroll Top Button
--------------------------------------------------------------*/
.scroll-top {
  position: fixed; visibility: hidden; opacity: 0; right: 15px; bottom: 15px; z-index: 99999;
  background-color: var(--accent-color); width: 40px; height: 40px; border-radius: 4px; transition: all 0.4s;
}
.scroll-top i { font-size: 24px; color: var(--contrast-color); line-height: 0; }
.scroll-top:hover { background-color: color-mix(in srgb, var(--accent-color), transparent 20%); }
.scroll-top.active { visibility: visible; opacity: 1; }

/*--------------------------------------------------------------
# Valdez Educational Services - brand color overrides
--------------------------------------------------------------*/
:root {
  --background-color: #ffffff;
  --default-color: #263241;
  --heading-color: #14335e;
  --accent-color: #f2a922;
  --surface-color: #ffffff;
  --contrast-color: #ffffff;
  --nav-color: rgba(255,255,255,0.75);
  --nav-hover-color: #ffffff;
  --nav-mobile-background-color: #ffffff;
  --nav-dropdown-background-color: #ffffff;
  --nav-dropdown-color: #14335e;
  --nav-dropdown-hover-color: #f2a922;
}
.header {
  --background-color: #ffffff;
  --default-color: #14335e;
  --heading-color: #14335e;
  --nav-color: #14335e;
  --nav-hover-color: #f2a922;
  box-shadow: 0 2px 12px rgba(20,51,94,0.08);
}
.footer-16 { --background-color: #0d2140; --default-color: rgba(255,255,255,0.85); --heading-color: #ffffff; }