/* SIDATA brand header. Scoped to the header; the CRM workspace is unchanged. */
header.top {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 82px;
  padding: 10px 24px;
  gap: 5px 3px;
  align-items: center;
  color: #243c50;
  background: linear-gradient(112deg, #f9fcff 0%, #eaf4fc 42%, #f6faff 72%, #fff9e9 100%);
  border-bottom: 1px solid #dce8f0;
  box-shadow: 0 4px 24px #224e6c08;
}
header.top::before {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  left: -70px;
  top: -100px;
  width: 440px;
  height: 300px;
  background: radial-gradient(ellipse at 35% 40%, #82c8ea38, transparent 57%), radial-gradient(ellipse at 70% 65%, #ffdc6d30, transparent 48%);
  animation: sidata-aurora 16s ease-in-out infinite alternate;
  will-change: transform;
}
header.top .logo {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-shrink: 0;
  min-width: 180px;
  height: 56px;
  margin: 0 18px 0 0;
  padding: 6px 15px;
  border: 1px solid #ffffff;
  border-radius: 16px;
  background: #ffffffec;
  box-shadow: 0 3px 16px #336a8c0a, inset 0 0 0 1px #e8f1f7;
  letter-spacing: 0;
}
header.top .logo img {display: block; width: 126px; height: 42px; object-fit: contain;}
header.top .logo .brand-crm {color: #607f94; font-size: 10px; font-weight: 600; letter-spacing: 1.7px; border-left: 1px solid #dfe9ef; padding-left: 10px;}
header.top .logo::before, header.top .logo::after {
  content: "";
  position: absolute;
  pointer-events: none;
  border-radius: 50%;
  width: 5px;
  height: 5px;
  background: #408db7;
  opacity: .5;
  left: 5px;
  top: 13px;
  animation: sidata-orbit 9s ease-in-out infinite alternate;
}
header.top .logo::after {width: 4px; height: 4px; background: #e7ba39; left: auto; right: 8px; top: auto; bottom: 9px; animation-delay: -4s;}
header.top a {
  color: #496579;
  padding: 11px 11px;
  border: 1px solid transparent;
  border-radius: 10px;
  transition: background-color .2s ease, color .2s ease;
}
header.top a:hover {color: #1e638b; background: #ffffffa3;}
header.top a.on {color: #205f83; background: #ffffffc9; border-color: #d6e7f1; box-shadow: 0 2px 7px #35698406;}
header.top a:focus-visible {outline: 2px solid #408db7; outline-offset: 3px;}
header.top .who {color: #526d80; font-size: 12px; line-height: 1.8;}
header.top .who select {background: #ffffffc9; color: #3c5a70; border: 1px solid #d4e3ed; border-radius: 9px; padding: 5px 8px; margin-right: 7px;}
header.top a.exit {padding: 6px 10px; color: #607a8d; font-size: 12px; background: #ffffff80; border-color: #dce7ee;}
@keyframes sidata-aurora {from {transform: translate3d(-12px, 0, 0) rotate(-5deg);} to {transform: translate3d(24px, 9px, 0) rotate(5deg);}}
@keyframes sidata-orbit {from {transform: translate3d(0, 0, 0); opacity: .3;} to {transform: translate3d(3px, 12px, 0); opacity: .65;}}
@media (max-width: 1200px) {
  header.top {padding: 10px 18px; gap: 5px;}
  header.top .sp {display: none;}
  header.top .logo {margin-right: 12px;}
  header.top .who {margin-left: auto;}
}
@media (max-width: 680px) {
  header.top {padding: 10px 12px; gap: 5px 3px;}
  header.top .logo {min-width: 156px; height: 50px; padding: 5px 8px; gap: 7px; margin-right: 0; order: 0; border-radius: 13px;}
  header.top .logo img {width: 108px; height: 36px;}
  header.top .logo .brand-crm {font-size: 9px; padding-left: 8px; letter-spacing: 1px;}
  header.top .who {order: 1; flex: 1 1 110px; min-width: 0; font-size: 11px; text-align: right;}
  header.top .who select {display: block; margin: 0 0 2px auto; max-width: 100%; font-size: 11px;}
  header.top::after {content: ""; flex-basis: 100%; order: 2; height: 0;}
  header.top a.exit {order: 4; margin-left: 0;}
  header.top > a:not(.exit) {order: 3; padding: 7px 9px; font-size: 12px;}
}
@media (prefers-reduced-motion: reduce) {
  header.top::before, header.top .logo::before, header.top .logo::after {animation: none; will-change: auto;}
  header.top a {transition: none;}
}

header.top .logo {border-color: transparent; background: transparent; box-shadow: none;}

/* Two clear sections, with the related tools below the header. */
header.top .primary-nav {display:flex;align-items:center;gap:6px;}
header.top .primary-nav a {display:inline-flex;align-items:center;gap:4px;}
.section-nav {display:flex;flex-wrap:wrap;gap:6px;margin:0 0 18px;padding:6px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);}
.section-nav a {display:inline-flex;align-items:center;gap:5px;padding:8px 15px;border-radius:8px;color:var(--muted);font-weight:500;text-decoration:none;}
.section-nav a:hover {background:var(--sky);color:var(--blue-d);}
.section-nav a.selected {background:var(--sky);color:var(--blue-d);box-shadow:inset 0 0 0 1px var(--line);}
.section-nav a:focus-visible {outline:2px solid var(--blue);outline-offset:2px;}
@media(max-width:680px){header.top .primary-nav{order:3;flex:1;gap:5px;}header.top .primary-nav a{padding:8px 12px;font-size:13px;} .section-nav{gap:3px;margin-bottom:14px;} .section-nav a{padding:7px 10px;font-size:12px;}}