:root{
  --header-bg: #ffffff;
  --header-fg: #0f1720;
  --muted: #6b7280;
  --primary: #512DA8;
  --glass: rgba(255,255,255,0.6);
  --shadow: 0 6px 24px rgba(16,24,40,0.06);
}

.site-header{
  background: var(--header-bg);
  color: var(--header-fg);
  position: sticky;
  top: 0;
  z-index: 60;
  backdrop-filter: blur(6px);
  box-shadow: var(--shadow);
}

.container { max-width: 1180px; margin: 0 auto; padding: 10px 20px; }

.header-inner{
  display:flex; align-items:center; gap:20px; min-height:72px; }
.header-left{ flex:0 0 auto; }

.logo { display:inline-block; text-decoration:none; }
.logo-img{ height:44px; display:block; }

.mobile-toggle{ display:none; background:transparent; border:0; padding:8px; cursor:pointer; }
.mobile-toggle .hamburger{ width:22px; height:2px; background:var(--header-fg); display:block; position:relative; }
.mobile-toggle .hamburger::before, .mobile-toggle .hamburger::after{ content:""; position:absolute; left:0; right:0; height:2px; background:var(--header-fg); }
.mobile-toggle .hamburger::before{ top:-6px; }
.mobile-toggle .hamburger::after{ top:6px; }

.main-nav{ flex:1 1 auto; }
.nav-links{ list-style:none; margin:0; padding:0; display:flex; gap:22px; align-items:center; justify-content:center; }
.nav-links li{ position:relative; }
.nav-links a{ color:var(--header-fg); text-decoration:none; padding:8px 12px; border-radius:8px; font-weight:500; }
.nav-links a:hover{ background: #f1f5f9; color:var(--header-fg); }

.btn-primary{ display:inline-block; background:var(--primary); color:#fff; padding:9px 14px; border-radius:10px; text-decoration:none; font-weight:600; box-shadow: 0 6px 18px rgba(81,45,168,0.12); }

.header-right{ display:flex; align-items:center; gap:14px; }
.contacts-vertical{ display:flex; flex-direction:column; gap:4px; font-size:0.92rem; color:var(--muted); }
.contact-item{ display:flex; gap:8px; align-items:center; }
.contact-item a{ color:var(--primary); font-weight:600; text-decoration:none; }
/* Make contact icons the same color as the contact text */
.contact-item i{ color:var(--primary); font-size:0.98rem; line-height:1; }

/* dropdown caret */
.has-dropdown > a::after{ content:"▾"; margin-left:8px; font-size:0.78em; color:var(--muted); }

/* dropdown styles */
.dropdown{ display:none; position:absolute; top:calc(100% + 10px); left:0; background:#fff; box-shadow:0 10px 30px rgba(2,6,23,0.08); padding:8px 6px; min-width:220px; border-radius:10px; z-index:50; list-style:none; margin:0; }
.dropdown li{ padding:0; list-style:none; margin:0; }
.dropdown a{ display:block; padding:10px 14px; color:#0f1720; font-weight:500; text-decoration:none; }
.dropdown a:hover{ background:#f8fafc; }
.has-dropdown:hover > .dropdown{ display:block; }

/* mobile / small screens */
@media (max-width: 900px){
  .mobile-toggle{ display:block; }
  .nav-links{ flex-direction:column; gap:0; align-items:stretch; width:100%; }
  .main-nav{ position:relative; }
  .main-nav .dropdown{ position:relative; box-shadow:none; top:0; left:0; border-radius:6px; overflow:hidden; }

  /* hidden by default, visible when nav has .open */
  .main-nav{ display:none; }
  .main-nav.open{ display:block; padding:12px 0; }

  .header-inner{ align-items:center; }
  .header-right{ order:3; width:100%; justify-content:space-between; }
  .logo-img{ height:40px; }
  .btn-primary{ padding:8px 12px; }

  /* dropdowns on mobile when parent has .open */
  .has-dropdown .dropdown{ display:none; }
  .has-dropdown.open .dropdown{ display:block; }
  .has-dropdown > a::after{ display:none; }
  
}

/* small polish */
.nav-links a, .btn-primary{ transition: all 160ms ease; }

/* Footer styles */
.site-footer{ background:#0b1220; color:#dbeafe; padding:36px 0 18px; }
.footer-grid{ display:grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap:28px; align-items:start; padding:18px 0; }
.footer-col{ text-align:left; }
.footer-col h4{ color:#fff; margin:0 0 8px; font-size:1rem; }
.footer-col ul{ list-style:none; margin:0; padding:0; }
.footer-col ul li{ margin:8px 0; }
.footer-col a{ color: #cfe8ff; text-decoration:none; font-weight:500; }
.footer-col a:hover{ color:#fff; text-decoration:underline; }
.footer-col--brand .company-info{ margin-top:10px; color: #9fb0c9; font-size:0.95rem; line-height:1.5; }
.footer-logo-img{ height:44px; display:block; filter:brightness(0) invert(1); }
.footer-bottom{ border-top:1px solid rgba(255,255,255,0.04); margin-top:18px; padding-top:12px; text-align:center; color:#92a6c6; }

@media (max-width: 900px){
  /* Stack all footer columns vertically and allow footer container to use full width */
  .footer-grid{ grid-template-columns: 1fr; gap:18px; }
  .site-footer .container{ max-width: none; padding-left:20px; padding-right:20px; }
  .footer-logo-img{ margin:0 0 8px 0; }
}