/* Alumni OS Design System v1
   Tenant-neutral product layer. Organization identity belongs in tokens. */
:root {
  --aos-brand: #0b2f63;
  --aos-brand-strong: #071f45;
  --aos-action: #1558c9;
  --aos-gold: #c79a52;
  --aos-canvas: #f6f7f9;
  --aos-surface: #ffffff;
  --aos-surface-soft: #f1f3f6;
  --aos-text: #182230;
  --aos-muted: #667085;
  --aos-line: rgba(17,24,39,.09);
  --aos-glass: rgba(255,255,255,.78);
  --aos-radius: 14px;
  --aos-shadow: 0 12px 34px rgba(15,23,42,.07);

  --brand: var(--aos-action);
  --brand-dark: var(--aos-brand);
  --heading: var(--aos-brand-strong);
  --ink: var(--aos-text);
  --muted: var(--aos-muted);
  --gold: var(--aos-gold);
  --bg: var(--aos-canvas);
  --panel: var(--aos-surface);
  --glass: var(--aos-glass);
  --glass-strong: rgba(255,255,255,.92);
  --glass-line: var(--aos-line);
  --line: var(--aos-line);
  --shadow: var(--aos-shadow);
}

body {
  background: var(--aos-canvas);
  color: var(--aos-text);
  letter-spacing: 0;
}
body::before { display:none; }

/* App shell: glass is reserved for navigation chrome. */
.topbar {
  border-bottom:1px solid rgba(17,24,39,.07);
  background:var(--aos-glass);
  -webkit-backdrop-filter:saturate(150%) blur(22px);
  backdrop-filter:saturate(150%) blur(22px);
  box-shadow:0 1px 0 rgba(255,255,255,.72) inset;
}

.mobile-dock {
  border:1px solid rgba(255,255,255,.76) !important;
  background:rgba(250,250,252,.82) !important;
  -webkit-backdrop-filter:saturate(160%) blur(24px);
  backdrop-filter:saturate(160%) blur(24px);
  box-shadow:0 12px 34px rgba(15,23,42,.14) !important;
}
.mobile-dock a { color:#505866 !important; background:transparent !important; box-shadow:none !important; }
.mobile-dock a.active,.mobile-dock a[aria-current="page"] {
  color:var(--aos-action) !important;
  background:rgba(21,88,201,.10) !important;
  box-shadow:none !important;
}

/* Content surfaces stay solid and readable. */
.card,.panel,.row-card,.event-hub-panel,.event-browser-bar,
.today-card-strip article,.today-lanes section,.today-demo-strip,
.admin-ops-strip div,.ops-health-card,.ops-brief-card,.ops-pulse-card,
.member-directory-row,.member-search-bar,.event-pass,.invite-card,
.registration-card,.pass-card,.admin-registration-mobile-card {
  background:var(--aos-surface);
  border-color:var(--aos-line);
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
  box-shadow:var(--aos-shadow);
}

/* Institutional hero: one deep-blue material, no purple/orange wash. */
.nccu-hero,.event-hub-hero,.today-hero,.admin-hero,.pass-hero,.invite-hero {
  border-color:rgba(255,255,255,.18) !important;
  background:
    linear-gradient(90deg,rgba(5,23,52,.90),rgba(8,42,86,.64) 62%,rgba(7,31,69,.76)),
    url("/assets/nccu-emaba-bg.png") center/cover no-repeat,
    var(--aos-brand) !important;
  box-shadow:0 18px 44px rgba(7,31,69,.14) !important;
  text-shadow:none !important;
}
.nccu-hero::after,.event-hub-hero::after { display:none !important; }
.nccu-hero-art,.event-hub-art { opacity:.24 !important; filter:saturate(.55) contrast(.95); }

/* Hero typography must always pass contrast. */
.nccu-hero .nccu-hero-copy,
.nccu-hero .nccu-hero-copy h1,
.nccu-hero .nccu-hero-copy h2,
.nccu-hero .nccu-hero-copy h3,
.event-hub-hero h1,.today-hero h1,.admin-hero h1,.pass-hero h1,.invite-hero h1 {
  color:#fff !important;
}
.nccu-hero .nccu-hero-copy .eyebrow,
.nccu-hero .nccu-hero-copy p:not(.eyebrow),
.event-hub-hero p,.today-hero p,.admin-hero p,.pass-hero p,.invite-hero p {
  color:rgba(255,255,255,.82) !important;
}
.nccu-hero-copy h1,.event-hub-hero h1,.today-hero h1,.admin-hero h1,.pass-hero h1,.invite-hero h1 {
  line-height:1.14 !important;
  letter-spacing:-.02em !important;
}
.nccu-hero-copy p:not(.eyebrow),.event-hub-hero p:not(.eyebrow),.today-hero p:not(.eyebrow),.admin-hero p:not(.eyebrow) {
  line-height:1.75 !important;
}

/* Gold is accent only. Primary actions stay white/blue. */
.nccu-hero .gateway-actions .hero-primary,
.event-hub .event-hero-actions .button.warm,
.admin-hero .button {
  border-color:rgba(255,255,255,.18) !important;
  background:#fff !important;
  color:var(--aos-brand-strong) !important;
  box-shadow:none !important;
}
.nccu-hero .gateway-actions .hero-quiet {
  border-color:rgba(255,255,255,.24) !important;
  background:rgba(255,255,255,.10) !important;
  color:#fff !important;
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
}
.eyebrow { color:var(--aos-gold); }

/* KPI inside hero is calm, neutral glass rather than colored gradient. */
.nccu-hero-proof {
  border-color:rgba(255,255,255,.18) !important;
  background:rgba(255,255,255,.10) !important;
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
}
.nccu-hero-proof div { background:transparent !important; }
.nccu-hero-proof b { color:#fff !important; }
.nccu-hero-proof small { color:rgba(255,255,255,.72) !important; }

/* Global typography and reusable shapes. */
h1,h2,h3 { text-wrap:balance; }
p { text-wrap:pretty; }
.button { border-radius:10px; }
.card,.panel,.row-card { border-radius:var(--aos-radius); }

/* Product/legal responsibility is part of the product, not demo decoration. */
.site-footer {
  display:block !important;
  color:var(--aos-muted);
  border-top:1px solid var(--aos-line);
  background:transparent;
}
.site-footer strong { color:var(--aos-brand-strong); }
.site-footer nav a { color:var(--aos-muted); }
.site-footer nav a:hover,.site-footer nav a:focus-visible { color:var(--aos-action); }

@media (max-width:860px) {
  main { width:min(100% - 24px,1180px); }
  .topbar { padding:10px 12px; }

  /* Home is a dashboard, not a full-screen landing page. */
  .nccu-home { padding-top:12px; }
  .nccu-hero {
    min-height:0 !important;
    height:auto !important;
    padding:0 !important;
  }
  .nccu-hero-copy {
    min-height:0 !important;
    max-width:none !important;
    padding:28px 22px 24px !important;
    align-content:start !important;
  }
  .nccu-hero-copy h1 {
    max-width:10em !important;
    font-size:clamp(31px,8.4vw,40px) !important;
  }
  .nccu-hero-copy p:not(.eyebrow) {
    margin-top:12px !important;
    font-size:15px !important;
  }
  .nccu-hero .gateway-actions {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:9px !important;
    margin-top:20px !important;
  }
  .nccu-hero .gateway-actions .hero-primary {
    grid-column:1/-1;
  }
  .nccu-hero .gateway-actions .button {
    min-height:46px !important;
  }
  .nccu-hero-proof {
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    width:100% !important;
    margin-top:18px !important;
  }
  .nccu-hero-proof div { padding:10px 8px !important; }
  .nccu-hero-proof b { font-size:19px !important; }
  .nccu-hero-proof small { font-size:11px !important; }

  .event-hub-hero { min-height:240px !important; padding:24px 20px !important; }
  .today-hero,.admin-hero,.pass-hero,.invite-hero { min-height:220px !important; padding:24px 20px !important; }
  .event-hub-hero h1,.today-hero h1,.admin-hero h1,.pass-hero h1,.invite-hero h1 {
    max-width:11em;
    font-size:clamp(30px,8.6vw,38px) !important;
  }

  .mobile-dock {
    position:fixed !important;
    right:12px !important;
    bottom:calc(10px + env(safe-area-inset-bottom,0px)) !important;
    left:12px !important;
    z-index:100 !important;
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:4px;
    padding:6px;
    border-radius:18px !important;
  }
  .mobile-dock a { min-height:46px; border-radius:13px; }

  .site-footer {
    width:calc(100% - 32px);
    margin:36px auto calc(104px + env(safe-area-inset-bottom,0px));
    padding:22px 0 16px;
  }
  .site-footer-primary,.site-footer-meta { display:grid; gap:14px; }
  .site-footer nav {
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    justify-content:start;
    gap:10px 14px;
  }
}

@media (max-width:520px) {
  body { font-size:16px; line-height:1.68; }
  .brand b { color:var(--aos-brand-strong); }
  .section,.panel { margin-top:18px; }
  .event-hub-hero,.today-hero,.admin-hero,.pass-hero,.invite-hero,.nccu-hero { border-radius:14px; }
}

@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    scroll-behavior:auto !important;
    transition-duration:.01ms !important;
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
  }
}
