:root {
  --accent: #4de4ff;
  --accent-dark: #0f9bd8;
  --navy: #06131f;
  --navy-mid: #0a1a2c;
  --navy-light: #173a5b;
  --text-on-dark: #b6c9dc;
  --sigla-gold: #f6c860;
  --sigla-royal: #2563eb;
  --sigla-ink: #07111f;
}

body {
  background:
    radial-gradient(circle at 8% 18%, rgba(77, 228, 255, 0.08), transparent 26rem),
    radial-gradient(circle at 96% 8%, rgba(246, 200, 96, 0.09), transparent 24rem),
    #ffffff;
}

nav {
  border-bottom-color: rgba(180, 198, 216, 0.36) !important;
  background: rgba(255, 255, 255, 0.9) !important;
  box-shadow: 0 14px 32px rgba(7, 17, 31, 0.055);
}

.logo,
.brand {
  gap: 13px !important;
}

.brand-shield,
.logo-img,
.brand img {
  width: 48px !important;
  height: 48px !important;
  border-radius: 15px !important;
  object-fit: contain !important;
  background: #06131f !important;
  box-shadow:
    0 14px 30px rgba(7, 17, 31, 0.22),
    0 0 0 1px rgba(77, 228, 255, 0.18) !important;
}

.logo-text .name,
.brand strong,
.brand-name {
  color: #0b1624 !important;
  display: block !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  line-height: 1.05 !important;
  text-transform: none !important;
}

.logo-text .sub,
.brand span {
  color: #77889c !important;
  display: block !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.025em !important;
  line-height: 1.35 !important;
  text-transform: none !important;
}

footer .logo-text .name,
footer .brand strong,
footer .brand-name {
  color: #dcedff !important;
}

footer .logo-text .sub,
footer .brand span {
  color: #91a6bb !important;
}

.nav-cta,
.links .cta,
.cta {
  background: linear-gradient(135deg, #06131f 0%, #123a5d 58%, #0e7490 100%) !important;
  border: 1px solid rgba(77, 228, 255, 0.22) !important;
  box-shadow: 0 12px 26px rgba(7, 17, 31, 0.14);
}

.nav-cta:hover,
.links .cta:hover,
.cta:hover {
  background: linear-gradient(135deg, #0a1a2c 0%, #155486 58%, #0f9bd8 100%) !important;
}

.profile-head,
.page-head,
header.hero,
body > header:not(.profile-head):not(.page-head) {
  background:
    radial-gradient(circle at 74% 17%, rgba(77, 228, 255, 0.18), transparent 24rem),
    radial-gradient(circle at 18% 20%, rgba(246, 200, 96, 0.13), transparent 18rem),
    linear-gradient(126deg, #06131f 0%, #0a1a2c 52%, #14395a 100%) !important;
}

.profile-head .seal {
  background:
    linear-gradient(145deg, rgba(77, 228, 255, 0.18), rgba(246, 200, 96, 0.12)),
    rgba(6, 19, 31, 0.56) !important;
  border-color: rgba(77, 228, 255, 0.24) !important;
}

.profile-head .seal img {
  object-fit: contain !important;
  border-radius: 18px !important;
  background: #06131f !important;
}

.profile-head h1,
.page-head h1,
header.hero h1 {
  letter-spacing: 0 !important;
}

.accent,
.profile-head .tagline,
.page-head h1 .accent,
.hero h1 .accent {
  color: var(--accent) !important;
}

.eyebrow,
.badge,
.section-label,
.label {
  border-color: rgba(77, 228, 255, 0.28) !important;
}

@media (max-width: 640px) {
  .brand-shield,
  .logo-img,
  .brand img {
    width: 44px !important;
    height: 44px !important;
  }

  .logo-text .name,
  .brand strong,
  .brand-name {
    font-size: 16px !important;
  }

  .logo-text .sub,
  .brand span {
    font-size: 10px !important;
    max-width: 190px;
    white-space: normal;
  }
}

@media (max-width: 420px) {
  .logo,
  .brand {
    gap: 10px !important;
  }

  .brand-shield,
  .logo-img,
  .brand img {
    width: 40px !important;
    height: 40px !important;
    border-radius: 13px !important;
  }

  .logo-text .name,
  .brand strong,
  .brand-name {
    font-size: 15px !important;
  }

  .logo-text .sub,
  .brand span {
    display: none !important;
  }
}
