/* ===================================================================
   Brown Insight wrapper overrides for the Radix radiculopathy engine.
   Loaded LAST (after dept-styles.css and styles.css) so these win.
   Keeps the Radix tool intact while making the Brown Insight page
   chrome (top bar, header, banner, footer, disclaimer) authoritative.
   NOTE: <dept-header>/<dept-footer> upgrade into real <header>/<footer>
   elements, so overrides target those real tags, not the custom tags.
   =================================================================== */

/* The Brown dept-header replaces the Radix top navigation bar. The Radix
   bottom tab-bar is kept — it is the guaranteed mobile route to the drawer. */
.nav-bar { display: none !important; }

/* Radix's body rule restyles the whole document (system font + tight
   letter-spacing + tinted gradient). Restore the Insight look. */
body {
  background: #ffffff !important;
  font-family: 'Inter', sans-serif !important;
  letter-spacing: normal !important;
  color: #1a2332;
}

/* ---- Make the Brown chrome authoritative (font + tokens Radix overrides) ---- */
.topbar, .division-strip, .brown-radic-intro,
header, header *, footer, footer *, .disclaimer-bar {
  font-family: 'Inter', sans-serif;
  letter-spacing: normal;
}
.logo-text .dept, .brown-radic-intro h1 { font-family: 'Playfair Display', serif; }

/* Restore the Brown header look (Radix redefines --shadow-sm, which the
   header box-shadow references). Re-assert the exact Brown styling. */
body > header {
  display: block !important;
  position: sticky; top: 0; z-index: 500;
  background: #ffffff !important;
  border-bottom: 3px solid #c8102e !important;
  box-shadow: 0 2px 8px rgba(28,53,87,0.07) !important;
}
body > header nav a { color: #3d4450; }
body > header nav a:hover, body > header nav a.active { background: #eaf0f8; color: #1c3557; }

/* Keep the Brown topbar and teal division strip above app content. */
.topbar { position: relative; z-index: 500; }
.division-strip { position: relative; z-index: 500; }

/* Brown intro band above the tool. */
.brown-radic-intro { max-width: 1200px; margin: 0 auto; padding: 34px 24px 6px; }
.brown-radic-intro .tag {
  display: inline-block; background: #e8f5f3; color: #00897b;
  font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em;
  text-transform: uppercase; padding: 4px 14px; border-radius: 20px; margin-bottom: 12px;
}
.brown-radic-intro h1 { color: #1c3557; font-size: 2rem; line-height: 1.15; margin: 0 0 12px; }
.brown-radic-intro p { color: #4b5563; font-size: 1rem; line-height: 1.7; max-width: 780px; margin: 0; }
.brown-radic-intro a { color: #00897b; }

/* Anchor offset so in-page hash jumps clear the sticky Brown header. */
#main { scroll-margin-top: 84px; }

@media (max-width: 600px) {
  .brown-radic-intro { padding-top: 22px; }
  .brown-radic-intro h1 { font-size: 1.6rem; }
}