/* ============================================================
   iMedic — Apple/Tesla design language
   Premium minimalism. Massive typography. Generous whitespace.
   Pure black on pure white. One accent. Confidence through restraint.
   ============================================================ */

:root {
  /* Pure palette */
  --imd-bg:           #ffffff;
  --imd-bg-soft:      #fbfbfd;     /* Apple-page background */
  --imd-bg-dark:      #000000;
  --imd-bg-dark-soft: #1d1d1f;

  --imd-text:         #000000;     /* Pure black for confidence */
  --imd-text-soft:    #1d1d1f;     /* Apple body text */
  --imd-text-muted:   #4a4a4f;     /* Darker secondary for stronger contrast */
  --imd-text-tertiary:#6e6e73;
  --imd-text-on-dark: #f5f5f7;

  /* Single accent — Apple blue */
  --imd-accent:       #0071e3;     /* Apple "buy" blue */
  --imd-accent-hover: #0077ed;
  --imd-accent-soft:  #e8f0fe;

  /* Semantic only when essential */
  --imd-success:      #1d8e44;
  --imd-warning:      #b25c00;
  --imd-danger:       #b3261e;

  /* Hairlines */
  --imd-line:         #d2d2d7;
  --imd-line-soft:    rgba(0,0,0,0.05);

  /* Override site variables */
  --primary-color:    #000000;
  --secondary-color:  #0071e3;
  --accent-color:     #0071e3;
  --danger-color:     #b3261e;
  --text-color:       #1d1d1f;
  --text-muted:       #6e6e73;
  --light-bg:         #fbfbfd;
  --border-color:     #d2d2d7;

  /* Spacing — Apple uses big values */
  --imd-pad-section:  120px;
  --imd-pad-section-mobile: 80px;
  --imd-content-w:    1320px;
  --imd-prose-w:      760px;

  /* Radii — Apple rectangular preference, only modest rounding */
  --imd-r-sm: 6px;
  --imd-r-md: 12px;
  --imd-r-lg: 18px;
  --imd-r-xl: 28px;

  /* Shadows — barely there, dimensional */
  --imd-shadow-sm: 0 1px 2px rgba(0,0,0,0.04);
  --imd-shadow-md: 0 8px 30px rgba(0,0,0,0.06);
  --imd-shadow-lg: 0 30px 80px rgba(0,0,0,0.08);
}

/* ====== Breadcrumbs: canonical site-wide reset ======
   Older article/category templates ship local breadcrumb styles and inline
   list spacing. Keep every breadcrumb small, quiet, and aligned to the
   content column. */
nav.breadcrumb,
nav[aria-label="Breadcrumb"],
nav[aria-label="Breadcrumbs"],
nav[aria-label="Breadcrumb navigation"],
nav[aria-label="Breadcrumb Navigation"] {
  display: block !important;
  width: 100% !important;
  max-width: 760px !important;
  margin: 0 0 16px 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--imd-text-muted, #6b7280) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-align: left !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  white-space: normal !important;
}

nav.breadcrumb ol,
nav.breadcrumb ul,
nav[aria-label="Breadcrumb"] ol,
nav[aria-label="Breadcrumb"] ul,
nav[aria-label="Breadcrumbs"] ol,
nav[aria-label="Breadcrumbs"] ul,
nav[aria-label="Breadcrumb navigation"] ol,
nav[aria-label="Breadcrumb navigation"] ul,
nav[aria-label="Breadcrumb Navigation"] ol,
nav[aria-label="Breadcrumb Navigation"] ul {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  gap: 4px 6px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
  white-space: normal !important;
}

nav.breadcrumb li,
nav[aria-label="Breadcrumb"] li,
nav[aria-label="Breadcrumbs"] li,
nav[aria-label="Breadcrumb navigation"] li,
nav[aria-label="Breadcrumb Navigation"] li {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
  text-transform: none !important;
  white-space: normal !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}

nav.breadcrumb li::before,
nav.breadcrumb li::marker,
nav[aria-label="Breadcrumb"] li::before,
nav[aria-label="Breadcrumb"] li::marker,
nav[aria-label="Breadcrumbs"] li::before,
nav[aria-label="Breadcrumbs"] li::marker,
nav[aria-label="Breadcrumb navigation"] li::before,
nav[aria-label="Breadcrumb navigation"] li::marker,
nav[aria-label="Breadcrumb Navigation"] li::before,
nav[aria-label="Breadcrumb Navigation"] li::marker {
  content: none !important;
}

nav.breadcrumb a,
nav[aria-label="Breadcrumb"] a,
nav[aria-label="Breadcrumbs"] a,
nav[aria-label="Breadcrumb navigation"] a,
nav[aria-label="Breadcrumb Navigation"] a {
  display: inline !important;
  color: var(--imd-text-muted, #6b7280) !important;
  font-size: inherit !important;
  line-height: inherit !important;
  font-weight: inherit !important;
  letter-spacing: inherit !important;
  text-transform: none !important;
  text-decoration: none !important;
  padding: 0 !important;
  min-height: 0 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

nav.breadcrumb a:hover,
nav[aria-label="Breadcrumb"] a:hover,
nav[aria-label="Breadcrumbs"] a:hover,
nav[aria-label="Breadcrumb navigation"] a:hover,
nav[aria-label="Breadcrumb Navigation"] a:hover {
  color: var(--imd-text, #111827) !important;
  text-decoration: underline !important;
  background: transparent !important;
}

nav.breadcrumb [aria-current="page"],
nav[aria-label="Breadcrumb"] [aria-current="page"],
nav[aria-label="Breadcrumbs"] [aria-current="page"],
nav[aria-label="Breadcrumb navigation"] [aria-current="page"],
nav[aria-label="Breadcrumb Navigation"] [aria-current="page"] {
  color: var(--imd-text-soft, #4b5563) !important;
  font-size: inherit !important;
  font-weight: 500 !important;
  line-height: inherit !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  white-space: normal !important;
}

nav.breadcrumb li[aria-current="page"],
nav[aria-label="Breadcrumb"] li[aria-current="page"],
nav[aria-label="Breadcrumbs"] li[aria-current="page"],
nav[aria-label="Breadcrumb navigation"] li[aria-current="page"],
nav[aria-label="Breadcrumb Navigation"] li[aria-current="page"] {
  flex: 1 1 14rem !important;
  display: inline !important;
}

@media (max-width: 900px) {
  nav.breadcrumb,
  nav[aria-label="Breadcrumb"],
  nav[aria-label="Breadcrumbs"],
  nav[aria-label="Breadcrumb navigation"],
  nav[aria-label="Breadcrumb Navigation"] {
    max-width: none !important;
    margin-bottom: 14px !important;
    font-size: 0.72rem !important;
  }
}

/* ====== Typography — Apple/Tesla scale ====== */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html, body {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text",
               "Helvetica Neue", "Inter", "Segoe UI", system-ui, sans-serif !important;
  font-size: 19px;
  line-height: 1.47;
  color: var(--imd-text-soft);
  background: var(--imd-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  letter-spacing: -0.005em;
}

/* Reserve scrollbar space on every page so navigation doesn't cause
   horizontal layout shift between short and long pages. */
html { scrollbar-gutter: stable; overflow-y: scroll; }

@media (max-width: 768px) {
  html, body { font-size: 17px; line-height: 1.5; }
}

p, li {
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--imd-text-soft);
  font-weight: 400;
}

h1, h2, h3, h4, h5, h6 {
  font-family: inherit;
  color: var(--imd-text);
  font-weight: 600;
  line-height: 1.07;
}

h1, main h1, body h1 {
  font-size: clamp(1.5rem, 2vw, 1.75rem) !important;
  letter-spacing: -0.022em !important;
  font-weight: 600 !important;
  line-height: 1.15 !important;
  margin: 0.5rem 0 1rem !important;
}

main > article > h1,
article[role="article"] > h1 {
  font-size: clamp(1.5rem, 2vw, 1.75rem) !important;
  letter-spacing: -0.022em !important;
  font-weight: 600 !important;
  margin: 0 0 1rem !important;
}

/* Hero h1 — same size as everywhere else for consistency */
.hero h1 {
  font-size: clamp(1.5rem, 2vw, 1.75rem) !important;
  letter-spacing: -0.022em !important;
  font-weight: 600 !important;
  margin: 0 0 12px !important;
  line-height: 1.25 !important;
  max-width: 640px !important;
}
.hero p, .hero .subtitle {
  font-size: 0.98rem !important;
  margin: 0 0 16px !important;
  line-height: 1.5 !important;
  max-width: 640px !important;
}

h2 {
  font-size: clamp(1.45rem, 2.2vw, 1.75rem);
  letter-spacing: -0.02em;
  font-weight: 600;
  margin: 2.5rem 0 0.75rem;
  line-height: 1.2;
}

article h2,
main > article h2 {
  font-size: clamp(1.4rem, 2vw, 1.6rem) !important;
  margin: 2.2rem 0 0.75rem !important;
  font-weight: 600 !important;
}

h3 {
  font-size: clamp(1.3rem, 2vw, 1.55rem);
  letter-spacing: -0.018em;
  font-weight: 600;
  margin: 2rem 0 0.75rem;
}

h4 {
  font-size: 1.1rem;
  font-weight: 600;
  letter-spacing: -0.01em;
}

/* Lead paragraph */
main > p:first-of-type, .lead, #tool-summary {
  font-size: 1.25rem;
  line-height: 1.45;
  letter-spacing: -0.01em;
  color: var(--imd-text-soft);
  font-weight: 400;
}

/* ====== Links — minimal, no underline by default ====== */
a {
  color: var(--imd-accent);
  text-decoration: none;
  transition: color 0.18s ease;
}
a:hover { color: var(--imd-accent-hover); text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
a:focus-visible {
  outline: 2px solid var(--imd-accent);
  outline-offset: 4px;
  border-radius: 3px;
}

/* ====== Header — Apple-style sticky translucent ====== */
header {
  background: rgba(255,255,255,0.72) !important;
  backdrop-filter: saturate(200%) blur(24px);
  -webkit-backdrop-filter: saturate(200%) blur(24px);
  border-bottom: 1px solid var(--imd-line-soft) !important;
  padding: 0 !important;
  position: sticky !important;
  top: 0;
  z-index: 1000;
}

header > nav, header > div {
  max-width: var(--imd-content-w) !important;
  margin: 0 auto !important;
  padding: 18px 32px !important;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

header a, header .logo {
  color: var(--imd-text) !important;
  font-weight: 600 !important;
  font-size: 1.4rem !important;
  letter-spacing: -0.022em !important;
  text-decoration: none !important;
}
header a:hover, header .logo:hover {
  text-decoration: none !important;
  color: var(--imd-text) !important;
}
.nav-links a { text-decoration: none !important; }
.nav-links a:hover { text-decoration: none !important; }

header a span {
  color: var(--imd-accent) !important;
  font-weight: 600;
}

.nav-links {
  display: flex !important;
  gap: 0 !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  align-items: center;
}

.nav-links a {
  color: var(--imd-text-soft) !important;
  font-weight: 400 !important;
  font-size: 0.92rem !important;
  padding: 8px 18px !important;
  letter-spacing: -0.01em !important;
  border-radius: 6px;
  transition: all 0.15s ease;
}

.nav-links a:hover {
  color: var(--imd-text) !important;
  background: transparent !important;
  text-decoration: none !important;
}

.search-box input {
  background: var(--imd-bg-soft) !important;
  border: 1px solid var(--imd-line) !important;
  border-radius: var(--imd-r-sm) !important;
  padding: 8px 14px !important;
  font-size: 0.9rem !important;
  font-family: inherit !important;
  transition: all 0.15s ease;
  width: 220px;
}
.search-box input:focus {
  background: white !important;
  border-color: var(--imd-accent) !important;
  box-shadow: 0 0 0 4px rgba(0,113,227,0.1);
}

/* ====== Mobile menu button — hidden on desktop ====== */
.mobile-menu-btn {
  display: none;
  background: transparent !important;
  border: 0 !important;
  padding: 8px 12px !important;
  margin: 0 !important;
  cursor: pointer;
  font-size: 1.5rem !important;
  line-height: 1 !important;
  color: var(--imd-text) !important;
  font-family: inherit !important;
  border-radius: 8px;
  min-height: 40px;
  min-width: 40px;
  -webkit-tap-highlight-color: transparent;
}
.mobile-menu-btn:hover { background: var(--imd-bg-soft) !important; }
.mobile-menu-btn:focus-visible {
  outline: 2px solid var(--imd-accent);
  outline-offset: 2px;
}
.mobile-menu-btn span {
  display: inline-block;
  font-size: 1.5rem;
  line-height: 1;
}

/* ====== Mobile menu — kicks in at 900px ====== */
@media (max-width: 900px) {
  header > nav,
  header > div {
    padding: 14px 20px !important;
    flex-wrap: wrap;
  }
  header a, header .logo { font-size: 1.2rem !important; }

  .mobile-menu-btn { display: inline-flex !important; align-items: center; justify-content: center; }

  .nav-links {
    display: none !important;
    width: 100% !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    padding: 12px 0 8px !important;
    margin: 12px 0 0 !important;
    border-top: 1px solid var(--imd-line-soft) !important;
    order: 3;
  }
  .nav-links.mobile-open {
    display: flex !important;
  }
  .nav-links li {
    list-style: none !important;
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
  }
  .nav-links li::before { content: none !important; }
  .nav-links a {
    display: block !important;
    width: 100%;
    padding: 14px 8px !important;
    font-size: 1rem !important;
    border-bottom: 1px solid var(--imd-line-soft);
    border-radius: 0 !important;
  }
  .nav-links li:last-child a { border-bottom: 0; }

  .search-box {
    display: block;
    width: 100%;
    padding: 12px 0 4px !important;
  }
  .search-box input { width: 100% !important; }
}

@media (max-width: 768px) {
  .nav-links a { font-size: 0.98rem !important; }
}

/* ====== Main content — wider Apple proportions ====== */
main {
  max-width: var(--imd-content-w) !important;
  margin: 0 auto !important;
  padding: 0 32px !important;
  overflow-x: hidden;
}

@media (max-width: 768px) {
  main { padding: 0 20px !important; }
}

/* ====== Article layout: content-wrapper holds <main> + <aside class="toc-sidebar"> ====== */
.content-wrapper {
  max-width: var(--imd-content-w);
  margin: 0 auto;
  padding: 32px 32px 0;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 280px !important;
  column-gap: 48px;
  align-items: start;
  position: relative;
}

/* When inside content-wrapper, main no longer needs its own max-width/margin */
.content-wrapper > main {
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  min-width: 0;
  overflow-x: visible;
}

/* Breadcrumb above article */
.content-wrapper > main > nav.breadcrumb {
  margin: 0 0 16px;
  padding: 0;
  background: none;
  border: none;
  font-size: 0.85rem;
}
.content-wrapper > main > nav.breadcrumb a { color: var(--imd-text-muted); text-decoration: none; }
.content-wrapper > main > nav.breadcrumb a:hover { color: var(--imd-text); text-decoration: underline; }
.content-wrapper > main > nav.breadcrumb ol,
.content-wrapper > main > nav.breadcrumb ol li { list-style: none !important; }

/* Article — single column reading flow, prose-width content */
.content-wrapper > main > article {
  display: block;
  max-width: 760px;
  margin: 0;
}

/* Info boxes inside article = inline boxes at prose-width (NOT floated) */
.content-wrapper > main > article > .quick-facts,
.content-wrapper > main > article > .key-takeaways,
.content-wrapper > main > article > .meta-info,
.content-wrapper > main > article > div[style*="667eea"],
.content-wrapper > main > article > .summary,
.content-wrapper > main > article > p,
.content-wrapper > main > article > ul,
.content-wrapper > main > article > ol,
.content-wrapper > main > article > h1,
.content-wrapper > main > article > h2,
.content-wrapper > main > article > h3,
.content-wrapper > main > article > aside {
  max-width: 100% !important;
  float: none !important;
  clear: none !important;
  width: auto !important;
}

/* ====== TOC sidebar — sticky right column ====== */
.toc-sidebar {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 88px !important;
  align-self: start !important;
  padding: 24px 0 24px 24px;
  border-left: 1px solid var(--imd-line-soft);
  font-size: 0.9rem;
  background: transparent;
}
.toc-sidebar .toc-title {
  font-size: 0.72rem !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 600 !important;
  color: var(--imd-text-muted) !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  border: none !important;
}
.toc-sidebar .toc-list,
.toc-sidebar ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.toc-sidebar .toc-list li,
.toc-sidebar ul li {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.toc-sidebar .toc-list li::before { content: none !important; }
.toc-sidebar a {
  display: block;
  padding: 7px 0 7px 12px;
  color: var(--imd-text-soft) !important;
  text-decoration: none !important;
  font-size: 0.88rem !important;
  line-height: 1.4;
  border-left: 2px solid transparent;
  margin-left: -14px;
  transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}
.toc-sidebar a:hover,
.toc-sidebar a:focus-visible {
  color: var(--imd-accent) !important;
  border-left-color: var(--imd-accent);
  background: var(--imd-bg-soft);
}

/* Custom scrollbar inside TOC */
.toc-sidebar::-webkit-scrollbar { width: 4px; }
.toc-sidebar::-webkit-scrollbar-thumb { background: var(--imd-line); border-radius: 2px; }

/* Related links block below TOC */
.toc-sidebar .related-links {
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px solid var(--imd-line-soft);
}
.toc-sidebar .related-links-title {
  font-size: 0.72rem !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 600 !important;
  color: var(--imd-text-muted) !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  border: none !important;
}
.toc-sidebar .related-links ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.toc-sidebar .related-links li { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.toc-sidebar .related-links li::before { content: none !important; }
.toc-sidebar .related-links a {
  display: block;
  padding: 7px 0 7px 12px;
  margin-left: -14px;
  color: var(--imd-text-soft) !important;
  font-size: 0.86rem !important;
  line-height: 1.4;
  border-left: 2px solid transparent;
  text-decoration: none !important;
  transition: color 0.15s, border-color 0.15s, background 0.15s;
}
.toc-sidebar .related-links a:hover {
  color: var(--imd-accent) !important;
  border-left-color: var(--imd-accent);
  background: var(--imd-bg-soft);
}

/* ====== Mobile: stack TOC below content ====== */
@media (max-width: 1024px) {
  .content-wrapper {
    grid-template-columns: 1fr !important;
    column-gap: 0;
    padding: 24px 20px 0;
  }
  .toc-sidebar {
    position: static !important;
    max-height: none;
    border-left: 0;
    border-top: 1px solid var(--imd-line-soft);
    padding: 24px 0;
    margin-top: 32px;
  }
  .toc-sidebar a { padding: 10px 0; margin-left: 0; border-left: 0; }
}

/* ====== Medicines landing page — clean directory layout ====== */
/* Hero on /en/medicines/ — compact, search-focused */
body > section.hero[aria-label*="Medicine"],
section.hero[aria-label*="medicine"] {
  padding: 36px 32px 24px !important;
}
.hero .hero-content { max-width: 880px; }
input#medicine-search {
  width: 100%;
  max-width: 540px;
  padding: 12px 18px !important;
  font-size: 0.98rem !important;
  border: 1px solid var(--imd-line) !important;
  border-radius: 10px !important;
  background-color: var(--imd-bg) !important;
  font-family: inherit !important;
  color: var(--imd-text) !important;
  margin: 14px 0 12px !important;
}
input#medicine-search:focus {
  border-color: var(--imd-accent) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(0,113,227,0.12);
}
/* Medicines page autocomplete dropdown — absolutely positioned under input.
   Scoped to #search-results inside .hero-search so it doesn't collide with
   the /en/search.html results page that uses id="searchResults". */
.hero-search > #search-results,
.hero-search > .search-results {
  position: absolute;
  z-index: 50;
  max-width: 540px;
  width: 100%;
}

/* Search results page — normal block flow, footer stays below */
#searchResults {
  position: static !important;
  z-index: auto !important;
  max-width: 760px;
  margin: 24px 0;
  display: block;
}
#searchResults .loading,
#searchResults .no-results {
  padding: 24px 0;
  color: var(--imd-text-muted);
}
#searchResults > * {
  margin-bottom: 18px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--imd-line-soft);
}
#searchResults > *:last-child { border-bottom: 0; }
#searchResults h3 a,
#searchResults h2 a,
#searchResults a.pagefind-result-title {
  color: var(--imd-accent);
  text-decoration: none;
}
#searchResults mark {
  background: #fff3a3;
  color: inherit;
  padding: 0 2px;
}
.search-query {
  color: var(--imd-text-muted);
  margin-bottom: 16px;
}
.search-page-form {
  display: flex;
  gap: 10px;
  max-width: 760px;
  margin: 22px 0 18px;
}
.search-page-form input[type="search"] {
  flex: 1;
  min-width: 0;
  min-height: 48px;
  padding: 12px 14px;
  border: 1px solid var(--imd-line);
  border-radius: 8px;
  font: inherit;
}
.search-page-form button {
  min-height: 48px;
  padding: 0 18px;
  border: 0;
  border-radius: 8px;
  background: var(--imd-accent);
  color: #fff;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}
.search-result-meta,
.result-url {
  color: var(--imd-text-muted);
  font-size: 0.86rem;
}
.search-result-category {
  display: inline-block;
  color: var(--imd-text-muted);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 6px;
}
#searchResults .result-item h2 {
  font-size: 1.2rem !important;
  line-height: 1.3 !important;
  margin: 0 0 8px !important;
}
#searchResults .result-item p {
  margin: 0 0 8px !important;
}
@media (max-width: 640px) {
  .search-page-form {
    display: block;
  }
  .search-page-form button {
    width: 100%;
    margin-top: 10px;
  }
}
.article-count-badge {
  display: inline-block;
  font-size: 0.78rem !important;
  color: var(--imd-text-muted) !important;
  font-weight: 500;
  padding: 4px 10px;
  background: var(--imd-bg-soft);
  border: 1px solid var(--imd-line-soft);
  border-radius: 980px;
}

/* A-Z picker */
.az-section {
  max-width: var(--imd-content-w);
  margin: 8px auto 0;
  padding: 0 32px;
}
.az-picker {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 0;
  padding: 14px 0;
  border-top: 1px solid var(--imd-line-soft);
  border-bottom: 1px solid var(--imd-line-soft);
}
.az-btn {
  background: transparent !important;
  border: 1px solid transparent !important;
  color: var(--imd-text-soft) !important;
  font-family: inherit !important;
  font-size: 0.88rem !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 34px;
  height: 34px;
  min-height: auto !important;
  border-radius: 8px !important;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.az-btn:hover {
  background: var(--imd-bg-soft) !important;
  color: var(--imd-text) !important;
  border-color: var(--imd-line) !important;
}
.az-btn.active {
  background: transparent !important;
  color: var(--imd-text) !important;
}
.az-btn[aria-pressed="true"],
.az-btn.selected {
  background: var(--imd-text) !important;
  color: white !important;
  border-color: var(--imd-text) !important;
}
.az-btn:disabled,
.az-btn[aria-disabled="true"] {
  color: var(--imd-line) !important;
  cursor: default;
}
.az-results {
  max-width: var(--imd-content-w);
  margin: 0 auto;
  padding: 0 32px;
}
.az-results-inner:empty { display: none; }

/* Two-column layout — main + sidebar */
.medicines-page .content-wrapper,
body > .content-wrapper:has(.main-content) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 300px !important;
  column-gap: 40px;
  max-width: var(--imd-content-w);
  margin: 24px auto 0;
  padding: 0 32px;
  align-items: start;
}
.content-wrapper > .main-content { min-width: 0; }
.content-wrapper > aside.sidebar {
  position: -webkit-sticky;
  position: sticky;
  top: 88px;
  align-self: start;
}

@media (max-width: 1024px) {
  .medicines-page .content-wrapper,
  body > .content-wrapper:has(.main-content) {
    grid-template-columns: 1fr !important;
    padding: 0 20px;
  }
  .content-wrapper > aside.sidebar { position: static; margin-top: 32px; }
}

/* Section blocks within main-content */
.main-content > section.section {
  margin: 0 0 36px;
}
.main-content > section.section h2 {
  font-size: 1.05rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.012em !important;
  margin: 0 0 14px !important;
  padding: 0 0 10px !important;
  border-bottom: 1px solid var(--imd-line-soft);
  text-transform: none !important;
}

/* Popular medicines grid */
.popular-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  list-style: none !important;
  padding: 0;
  margin: 0;
}
@media (max-width: 900px) { .popular-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .popular-grid { grid-template-columns: 1fr; } }
.popular-card {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  background: var(--imd-bg) !important;
  border: 1px solid var(--imd-line) !important;
  border-radius: 10px !important;
  padding: 16px 18px !important;
  min-height: 88px !important;
  text-decoration: none !important;
  color: var(--imd-text) !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
  box-sizing: border-box !important;
  gap: 8px;
}
.popular-card * {
  padding-left: 0;
  margin-left: 0;
}
.popular-card:hover {
  border-color: var(--imd-accent);
  box-shadow: 0 4px 12px rgba(0,0,0,0.04);
  transform: translateY(-1px);
}
.popular-card h3 {
  font-size: 0.92rem !important;
  font-weight: 600 !important;
  margin: 0 0 4px !important;
  letter-spacing: -0.008em !important;
  color: var(--imd-text) !important;
  line-height: 1.3 !important;
}
.popular-class {
  display: inline-block;
  font-size: 0.74rem !important;
  font-weight: 500 !important;
  color: var(--imd-accent) !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* Symptom grid */
.symptom-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
@media (max-width: 900px) { .symptom-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .symptom-grid { grid-template-columns: 1fr; } }
.symptom-card {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 10px !important;
  background: var(--imd-bg) !important;
  border: 1px solid var(--imd-line) !important;
  border-radius: 10px !important;
  padding: 14px 16px !important;
  text-align: left !important;
  cursor: pointer;
  font-family: inherit !important;
  color: var(--imd-text) !important;
  width: 100% !important;
  min-height: 84px !important;
  transition: border-color 0.15s ease, background 0.15s ease;
  box-sizing: border-box !important;
}
.symptom-card .symptom-chevron { margin-top: 2px; }
.symptom-card:hover {
  border-color: var(--imd-accent);
  background: var(--imd-bg);
}
.symptom-card[aria-expanded="true"] {
  border-color: var(--imd-accent);
  background: var(--imd-bg-soft);
}
.symptom-icon,
.symptom-card > span[aria-hidden="true"]:first-child,
.symptom-card > .symptom-icon,
button.symptom-card > span:first-child {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  font-size: 0 !important;
  visibility: hidden !important;
  position: absolute !important;
  left: -9999px !important;
}
.symptom-info { flex: 1; }
.symptom-info h3 {
  font-size: 0.92rem !important;
  font-weight: 600 !important;
  margin: 0 0 2px !important;
  letter-spacing: -0.008em !important;
  color: var(--imd-text) !important;
  line-height: 1.3 !important;
}
.symptom-info p {
  font-size: 0.78rem !important;
  color: var(--imd-text-muted) !important;
  margin: 0 !important;
  line-height: 1.4 !important;
}
.symptom-chevron {
  color: var(--imd-text-muted);
  font-size: 1rem;
  flex-shrink: 0;
  transition: transform 0.15s ease;
}
.symptom-card[aria-expanded="true"] .symptom-chevron { transform: rotate(90deg); }

/* Symptom-results — JS injects an empty <div> after each card. Hide it from
   the grid until expanded; when active, span all columns. */
.symptom-results {
  display: none !important;
}
.symptom-results.active {
  display: block !important;
  grid-column: 1 / -1 !important;
  margin: 4px 0 12px;
  padding: 16px 20px;
  background: var(--imd-bg-soft);
  border: 1px solid var(--imd-line);
  border-radius: 10px;
}
.symptom-results-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 6px;
}
@media (max-width: 700px) { .symptom-results-list { grid-template-columns: 1fr; } }
.symptom-results-list li {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.symptom-result-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  background: var(--imd-bg);
  border: 1px solid var(--imd-line-soft);
  border-radius: 8px;
  text-decoration: none !important;
  color: var(--imd-text) !important;
  transition: border-color 0.15s ease, transform 0.15s ease;
}
.symptom-result-link:hover {
  border-color: var(--imd-accent);
  transform: translateX(2px);
}
.result-pill {
  font-size: 0.65rem !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--imd-accent) !important;
  background: var(--imd-accent-soft, rgba(0,113,227,0.08));
  padding: 3px 8px;
  border-radius: 4px;
  flex-shrink: 0;
  white-space: nowrap;
}
.result-pill-name {
  flex: 1;
  font-size: 0.85rem !important;
  font-weight: 500 !important;
  color: var(--imd-text) !important;
  line-height: 1.3;
  min-width: 0;
}
.result-arrow {
  color: var(--imd-text-muted);
  font-size: 1rem;
  flex-shrink: 0;
}
.symptom-no-results {
  font-size: 0.88rem;
  color: var(--imd-text-muted);
  text-align: center;
  padding: 12px;
}

/* Recently added — article items with date pill */
.main-content .article-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: block !important;
  grid-template-columns: none !important;
}
.main-content .article-list li {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 6px !important;
  border-bottom: none !important;
}
.article-item {
  display: flex !important;
  align-items: flex-start;
  gap: 14px;
  padding: 12px 14px;
  background: var(--imd-bg);
  border: 1px solid var(--imd-line);
  border-radius: 10px;
  text-decoration: none !important;
  color: var(--imd-text) !important;
  transition: border-color 0.15s ease, transform 0.15s ease;
}
.article-item:hover {
  border-color: var(--imd-accent);
  transform: translateX(2px);
}
.article-date-icon {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  background: var(--imd-bg-soft);
  border: 1px solid var(--imd-line-soft);
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 4px;
}
.date-day {
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  color: var(--imd-text) !important;
  line-height: 1 !important;
  letter-spacing: -0.02em;
}
.date-month {
  font-size: 0.62rem !important;
  font-weight: 500 !important;
  color: var(--imd-text-muted) !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  line-height: 1.2;
  margin-top: 2px;
}
.article-item .article-content {
  flex: 1;
  padding: 0 !important;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  min-width: 0;
}
.article-item .article-content h3 {
  font-size: 0.92rem !important;
  font-weight: 600 !important;
  margin: 0 0 2px !important;
  letter-spacing: -0.008em !important;
  color: var(--imd-text) !important;
  line-height: 1.3 !important;
}
.article-item .article-content p {
  font-size: 0.82rem !important;
  color: var(--imd-text-muted) !important;
  margin: 0 !important;
  line-height: 1.45 !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.article-arrow {
  align-self: center;
  font-size: 1.2rem;
  color: var(--imd-text-muted);
  flex-shrink: 0;
  transition: color 0.15s ease, transform 0.15s ease;
}
.article-item:hover .article-arrow {
  color: var(--imd-accent);
  transform: translateX(2px);
}

/* Sidebar */
aside.sidebar {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.sidebar-block {
  background: var(--imd-bg);
  border: 1px solid var(--imd-line-soft);
  border-radius: 10px;
  padding: 18px 20px;
}
.sidebar-block h3 {
  font-size: 0.72rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  font-weight: 600 !important;
  color: var(--imd-text-muted) !important;
  margin: 0 0 12px !important;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--imd-line-soft);
}
.news-list,
.sidebar-links {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.news-list li,
.sidebar-links li {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border-bottom: 1px solid var(--imd-line-soft);
}
.news-list li:last-child,
.sidebar-links li:last-child { border-bottom: 0; }
.news-list li::before,
.sidebar-links li::before { content: none !important; }
.news-link {
  display: block;
  padding: 8px 0;
  text-decoration: none !important;
  color: var(--imd-text) !important;
  transition: color 0.15s ease;
}
.news-link:hover { color: var(--imd-accent) !important; }
.news-title {
  display: block;
  font-size: 0.85rem !important;
  font-weight: 500 !important;
  color: inherit !important;
  line-height: 1.35 !important;
  margin-bottom: 2px;
}
.news-date {
  display: block;
  font-size: 0.7rem !important;
  color: var(--imd-text-muted) !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 500;
}
.sidebar-links a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 0;
  text-decoration: none !important;
  color: var(--imd-text) !important;
  font-size: 0.88rem !important;
  font-weight: 500 !important;
  transition: color 0.15s ease;
}
.sidebar-links a:hover { color: var(--imd-accent) !important; }
.link-icon,
.sidebar-links a > span[aria-hidden="true"]:first-child,
.sidebar-links a > .link-icon {
  display: none !important;
  width: 0 !important;
  font-size: 0 !important;
  visibility: hidden !important;
  position: absolute !important;
  left: -9999px !important;
}
.sidebar-block > a[href*="news"] {
  display: block;
  margin-top: 12px !important;
  padding-top: 12px !important;
  border-top: 1px solid var(--imd-line-soft);
  color: var(--imd-accent) !important;
  text-decoration: none !important;
  font-size: 0.85rem !important;
  font-weight: 500 !important;
}

/* Mobile tightening */
@media (max-width: 768px) {
  .az-section { padding: 0 20px; }
  .az-results { padding: 0 20px; }
  .az-btn { width: 30px; height: 30px; font-size: 0.82rem !important; }
  .article-item { padding: 10px 12px; gap: 10px; }
  .article-date-icon { width: 40px; height: 40px; }
}
/* End medicines landing page */

/* Body prose readable column */
main p, main ul, main ol, main blockquote, main > section > p, main > section > ul {
  max-width: var(--imd-prose-w);
}

main > section, main > article, main > aside, main .tool-card { max-width: none; }

/* ====== Prose paragraph spacing — inline critical CSS zeros all margins ====== */
main p {
  margin: 0 0 1.2em !important;
  line-height: 1.55;
}
main p:last-child { margin-bottom: 0 !important; }

main ul, main ol {
  margin: 0 0 1.4em !important;
  padding-left: 1.5em !important;
}
main li {
  margin: 0 0 0.5em !important;
  line-height: 1.55;
}

/* Strip default bullets from any list that has a class — those are layout
   lists (nav, cards, grids, sidebars), not prose. Prose <ul> without class
   keeps its bullets. NOTE: do NOT use universal `*` here — it would kill
   the inner padding of cards inside these containers. */
main ul[class], main ol[class],
.popular-grid,
.news-list, .news-list li,
.sidebar-links, .sidebar-links li,
.article-list, .article-list li,
.trending-list, .trending-list li,
.toc-list, .toc-list li,
.feature-grid, .feature-grid li,
.specialty-grid, .specialty-grid li,
.related-links ul, .related-links ul li,
aside.related-medications ul, aside.related-medications ul li,
aside.related-conditions ul, aside.related-conditions ul li {
  list-style: none !important;
  padding-left: 0 !important;
}
main ul[class] > li,
.news-list > li,
.sidebar-links > li {
  list-style: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}
main ul[class] > li::before,
.news-list > li::before,
.sidebar-links > li::before { content: none !important; }
main li:last-child { margin-bottom: 0 !important; }

main blockquote {
  margin: 1.6em 0 !important;
  padding: 0.2em 0 0.2em 1.2em;
  border-left: 3px solid var(--imd-line);
  color: var(--imd-text-soft);
}

/* Quick-answer lead paragraph — normalize the full-body <strong> wrap */
main p.quick-answer,
main .quick-answer {
  font-size: 1.08rem !important;
  color: var(--imd-text-soft) !important;
  margin: 0 0 1.4em !important;
  line-height: 1.55 !important;
  font-weight: 400 !important;
  max-width: var(--imd-prose-w) !important;
  background: none !important;
  border: none !important;
  padding: 0 !important;
}
main p.quick-answer strong,
main .quick-answer strong {
  font-weight: 500 !important;
  color: var(--imd-text) !important;
}

/* Summary block — visual lead */
main .summary {
  font-size: 1.12rem !important;
  line-height: 1.6 !important;
  color: var(--imd-text-soft) !important;
  margin: 0 0 1.6em !important;
  max-width: var(--imd-prose-w) !important;
  font-weight: 400 !important;
}
main .summary strong {
  font-weight: 500 !important;
  color: var(--imd-text) !important;
}

/* ====== Cards — minimal Apple aesthetic ====== */
.tool-card,
.info-card,
.fact-item,
.related-card,
.news-item,
.diversifier-block,
.quality-meta-widget,
.medicine-sources,
.related-medications,
.related-conditions,
.smart-champion-enhancements aside,
.citation-block,
.brand-variant-notice,
.available-variants,
.action-card {
  background: var(--imd-bg) !important;
  border: 1px solid var(--imd-line-soft) !important;
  border-radius: var(--imd-r-md) !important;
  box-shadow: var(--imd-shadow-sm) !important;
  padding: 28px 32px !important;
  transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.related-card,
.news-item,
.interaction-card {
  cursor: pointer;
}

.tool-card:hover,
.related-card:hover,
.news-item:hover,
.interaction-card:hover {
  box-shadow: var(--imd-shadow-md) !important;
  transform: translateY(-2px);
}

@media (max-width: 768px) {
  .tool-card, .info-card, .fact-item { padding: 20px !important; }
}

/* ====== Buttons — Apple "Buy" rounded-rect style ====== */
button.calc, button.btn, .btn-primary, button[type="submit"],
.tools-callout a, button[data-action="run"] {
  background: var(--imd-text) !important;
  color: white !important;
  border: 0 !important;
  border-radius: 980px !important;       /* Apple buy button = pill */
  padding: 14px 28px !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
  letter-spacing: -0.012em !important;
  cursor: pointer;
  transition: all 0.18s ease;
  min-height: 44px;
  font-family: inherit !important;
}
button.calc:hover, .btn-primary:hover,
.tools-callout a:hover {
  background: var(--imd-text-soft) !important;
  transform: scale(1.02);
}
button.calc:active { transform: scale(0.98); }

/* Secondary buttons (text-only) */
.btn-link, .btn-secondary {
  background: transparent !important;
  color: var(--imd-accent) !important;
  border: 0 !important;
  padding: 10px 0 !important;
}

/* Stop button (destructive) */
.btn-stop {
  background: white !important;
  color: var(--imd-danger) !important;
  border: 1px solid var(--imd-danger) !important;
  border-radius: 980px !important;
}

/* Run button on dashboard */
.btn-run {
  background: var(--imd-accent) !important;
  color: white !important;
  border-radius: 980px !important;
}

/* ====== Forms — Apple input style ====== */
input[type="text"], input[type="number"], input[type="email"],
input[type="date"], input[type="search"], select, textarea {
  font-family: inherit !important;
  font-size: 1rem !important;
  padding: 14px 16px !important;
  border-radius: var(--imd-r-sm) !important;
  border: 1px solid var(--imd-line) !important;
  background: var(--imd-bg) !important;
  color: var(--imd-text) !important;
  transition: all 0.15s ease;
  min-height: 48px;
  box-sizing: border-box;
  letter-spacing: -0.005em;
}
input:focus, select:focus, textarea:focus {
  outline: 0 !important;
  border-color: var(--imd-accent) !important;
  box-shadow: 0 0 0 4px rgba(0,113,227,0.1) !important;
}

label {
  font-weight: 500 !important;
  font-size: 0.88rem !important;
  color: var(--imd-text-soft) !important;
  margin-bottom: 8px;
  letter-spacing: -0.005em;
}

.form-group { margin-bottom: 4px; }
.form-row { gap: 16px !important; }

/* ====== Result block — dramatic Apple presentation ====== */
.result {
  background: var(--imd-bg-soft) !important;
  border: 1px solid var(--imd-line-soft) !important;
  border-left: none !important;
  border-radius: var(--imd-r-lg) !important;
  padding: 40px 48px !important;
  margin-top: 32px !important;
}
.result-value {
  font-size: 4rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.04em !important;
  color: var(--imd-text) !important;
  line-height: 1 !important;
}
.result-label {
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  font-size: 0.75rem !important;
  color: var(--imd-text-muted) !important;
  font-weight: 600 !important;
  margin-top: 12px;
}
.result-interpretation {
  margin-top: 24px !important;
  padding: 20px 24px !important;
  background: white !important;
  border-radius: var(--imd-r-md) !important;
  font-size: 1rem !important;
  line-height: 1.5;
}

@media (max-width: 768px) {
  .result { padding: 28px 24px !important; }
  .result-value { font-size: 2.75rem !important; }
}

/* ====== Tables — Apple-clean, edge-to-edge in wrapper ====== */
.table-wrapper {
  background: var(--imd-bg) !important;
  border: 1px solid var(--imd-line-soft) !important;
  border-radius: var(--imd-r-md) !important;
  overflow: hidden !important;
  margin: 28px 0 !important;
  box-shadow: var(--imd-shadow-sm);
}

table {
  width: 100%;
  border-collapse: collapse !important;
  border-spacing: 0;
  border: 0 !important;
  font-size: 0.95rem;
  margin: 0;
  background: transparent !important;
}

caption {
  text-align: left !important;
  font-size: 1.05rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.012em !important;
  color: var(--imd-text) !important;
  padding: 18px 22px !important;
  background: var(--imd-bg) !important;
  border-bottom: 1px solid var(--imd-line-soft) !important;
  caption-side: top;
}

thead, thead tr, thead th {
  background: var(--imd-bg-soft) !important;
}
thead th, th {
  color: var(--imd-text-muted) !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  font-size: 0.72rem !important;
  border-bottom: 1px solid var(--imd-line) !important;
  padding: 14px 18px !important;
  text-align: left !important;
}

tbody td, td {
  padding: 16px 18px !important;
  border-bottom: 1px solid var(--imd-line-soft) !important;
  color: var(--imd-text-soft);
  vertical-align: top;
  background: var(--imd-bg) !important;
}
tbody tr:last-child td { border-bottom: none !important; }
tbody tr:hover td, tr:hover td { background: rgba(0,0,0,0.018) !important; }

/* First-column emphasis */
tbody td:first-child { font-weight: 600 !important; color: var(--imd-text) !important; }

/* Override leftover dark-navy headers from old templates */
[style*="background: #1e3a5f"], [style*="background:#1e3a5f"],
[style*="background: #2c3e50"], [style*="background:#2c3e50"],
[style*="background: #1a2a3a"], [style*="background:#1a2a3a"],
[style*="background-color: #1e3a5f"], [style*="background-color:#1e3a5f"] {
  background: var(--imd-bg-soft) !important;
  background-color: var(--imd-bg-soft) !important;
  color: var(--imd-text) !important;
}

/* ====== Quick facts — refined info-box (not a hero element) ====== */
.quick-facts {
  background: var(--imd-bg-soft) !important;
  border: 1px solid var(--imd-line-soft) !important;
  border-radius: 14px !important;
  padding: 24px 28px !important;
  margin: 32px 0 !important;
  box-shadow: none !important;
  max-width: var(--imd-prose-w) !important;
}
.quick-facts h2,
.key-takeaways h3,
.key-takeaways h2 {
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--imd-text-muted) !important;
  margin: 0 0 18px !important;
  line-height: 1.3 !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
}
.facts-grid, .info-grid, .quick-facts-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
  gap: 1px !important;
  margin: 0 !important;
  background: var(--imd-line-soft);
  border: 1px solid var(--imd-line-soft);
  border-radius: 10px;
  overflow: hidden;
}
.fact-item {
  background: var(--imd-bg) !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 18px 20px !important;
  transition: none !important;
}
.fact-item:hover {
  box-shadow: none !important;
  transform: none !important;
  background: var(--imd-bg-soft) !important;
}
.fact-label {
  font-size: 0.7rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  color: var(--imd-text-muted) !important;
  margin: 0 0 6px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
}
.fact-value {
  font-size: 1.05rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.012em !important;
  color: var(--imd-text) !important;
  margin: 0 0 4px !important;
  line-height: 1.3 !important;
}
.fact-item .fact-label + .fact-value + .fact-label {
  margin-top: 2px !important;
  font-weight: 400 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-size: 0.82rem !important;
  color: var(--imd-text-muted) !important;
}

/* ====== Key takeaways — clean professional list ====== */
.key-takeaways {
  background: var(--imd-bg-soft) !important;
  border: 1px solid var(--imd-line-soft) !important;
  border-radius: 14px !important;
  padding: 24px 28px !important;
  margin: 24px 0 32px !important;
  box-shadow: none !important;
  max-width: var(--imd-prose-w) !important;
}
.key-takeaways ul { max-width: none !important; }
.key-takeaways ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.key-takeaways ul li {
  padding: 14px 0 !important;
  border-bottom: 1px solid var(--imd-line-soft);
  position: relative;
  font-size: 0.95rem !important;
  line-height: 1.55 !important;
  color: var(--imd-text-soft) !important;
}
.key-takeaways ul li:last-child { border-bottom: 0; }
.key-takeaways ul li::before {
  content: none !important;
  display: none !important;
}
.key-takeaways ul li strong {
  color: var(--imd-text) !important;
  font-weight: 600 !important;
}

/* ====== Hide emoji icons in headings and meta — unprofessional ====== */
h1 span[role="img"],
h2 span[role="img"],
h3 span[role="img"],
h4 span[role="img"],
h5 span[role="img"],
h6 span[role="img"],
h1 span[aria-hidden="true"],
h2 span[aria-hidden="true"],
h3 span[aria-hidden="true"],
h4 span[aria-hidden="true"],
h5 span[aria-hidden="true"],
h6 span[aria-hidden="true"],
.meta-info span[role="img"],
.meta-info span[aria-hidden="true"]:first-child,
.meta-item > span[role="img"]:first-child,
.meta-item > span[aria-hidden="true"]:first-child {
  display: none !important;
}

/* ====== Medical review badge — neutralize purple gradient ====== */
div[style*="667eea"] {
  background: var(--imd-bg-soft) !important;
  background-image: none !important;
  color: var(--imd-text-soft) !important;
  border: 1px solid var(--imd-line) !important;
  border-radius: 6px !important;
  padding: 6px 12px !important;
  font-size: 0.8rem !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
}
div[style*="667eea"] span {
  color: var(--imd-text-muted) !important;
  font-weight: 500 !important;
}
div[style*="667eea"] span[role="img"],
div[style*="667eea"] span[aria-hidden="true"] {
  display: none !important;
}
div[style*="667eea"] time { color: var(--imd-text-muted) !important; }

/* ====== Meta-info row — refine icons-and-text ====== */
.meta-info {
  display: flex !important;
  flex-wrap: wrap;
  gap: 8px 20px !important;
  font-size: 0.85rem !important;
  color: var(--imd-text-muted) !important;
  margin: 16px 0 24px !important;
  padding: 12px 0 !important;
  border-top: 1px solid var(--imd-line-soft) !important;
  border-bottom: 1px solid var(--imd-line-soft) !important;
}
.meta-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* ====== Inline aside emergency callout — refine ====== */
aside[role="note"],
aside.emergency,
.emergency-callout {
  background: var(--imd-bg-soft) !important;
  border: 1px solid var(--imd-line) !important;
  border-left: 3px solid var(--imd-text) !important;
  border-radius: 8px !important;
  padding: 20px 24px !important;
  margin: 24px 0 !important;
  font-size: 0.95rem !important;
}
aside[role="note"] strong,
aside.emergency strong { color: var(--imd-text) !important; }

@media (max-width: 768px) {
  .quick-facts, .key-takeaways { padding: 20px !important; }
  .facts-grid, .info-grid, .quick-facts-grid { grid-template-columns: 1fr !important; }
  .fact-item { padding: 16px 18px !important; }
}

/* ====== Tools strip — slim horizontal pill nav ====== */
.tools-strip {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  justify-content: center;
  max-width: var(--imd-content-w);
  margin: 24px auto !important;
  padding: 12px 32px !important;
  border-bottom: 1px solid var(--imd-line-soft);
}

.tools-strip a {
  display: inline-block;
  padding: 9px 18px !important;
  font-size: 0.92rem !important;
  font-weight: 500 !important;
  color: var(--imd-text-soft) !important;
  background: var(--imd-bg-soft) !important;
  border: 1px solid transparent !important;
  border-radius: 980px !important;
  text-decoration: none !important;
  letter-spacing: -0.01em;
  transition: all 0.15s ease;
}
.tools-strip a:hover {
  background: var(--imd-text) !important;
  color: white !important;
  text-decoration: none !important;
  transform: translateY(-1px);
}
.tools-strip a.tools-strip-all {
  background: transparent !important;
  color: var(--imd-accent) !important;
  border: 1px solid var(--imd-accent) !important;
}
.tools-strip a.tools-strip-all:hover {
  background: var(--imd-accent) !important;
  color: white !important;
}

@media (max-width: 768px) {
  .tools-strip {
    overflow-x: auto;
    flex-wrap: nowrap;
    justify-content: flex-start;
    padding: 12px 20px !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .tools-strip::-webkit-scrollbar { display: none; }
  .tools-strip a { flex-shrink: 0; }
}

/* Old big callout — hide if it sneaks back in */
.tools-callout {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.tools-callout:has(> div[style*="linear-gradient"]) {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.tools-callout > div[style*="linear-gradient"] {
  display: none;
}

/* ====== Quick answer / tool summary — Apple highlight ====== */
#tool-summary, .quick-answer {
  background: var(--imd-bg-soft) !important;
  border-left: none !important;
  border: 1px solid var(--imd-line-soft) !important;
  border-radius: var(--imd-r-lg) !important;
  padding: 24px 32px !important;
  font-size: 1.15rem !important;
  letter-spacing: -0.01em;
  line-height: 1.5 !important;
}

/* ====== Disclaimer — Tesla style understatement ====== */
.disclaimer {
  background: var(--imd-bg-soft) !important;
  border: none !important;
  border-top: 1px solid var(--imd-line) !important;
  border-radius: 0 !important;
  padding: 28px 0 !important;
  font-size: 0.92rem !important;
  color: var(--imd-text-muted) !important;
  margin: 64px 0 32px !important;
}
.disclaimer strong {
  color: var(--imd-text) !important;
}

/* ====== FAQ ====== */
.faq {
  margin-top: 56px !important;
  border-top: 1px solid var(--imd-line);
  padding-top: 32px;
}
.faq h2 {
  font-size: clamp(1.5rem, 3vw, 2rem) !important;
}
.faq-item {
  border-bottom: 1px solid var(--imd-line-soft) !important;
  padding: 24px 0 !important;
}
.faq-item h3 {
  font-size: 1.15rem !important;
  margin-bottom: 12px;
  letter-spacing: -0.012em;
}
.faq-item p { color: var(--imd-text-muted); }

.faq-question {
  background: transparent !important;
  border: 0 !important;
  width: 100% !important;
  text-align: left !important;
  font-size: 1.15rem !important;
  font-weight: 600 !important;
  color: var(--imd-text) !important;
  padding: 18px 0 !important;
  cursor: pointer;
  letter-spacing: -0.012em;
}

/* ====== News section — Apple landing page hero ====== */
.news-section {
  max-width: var(--imd-content-w) !important;
  margin: 56px auto 80px !important;
  padding: 0 32px !important;
}
.news-section .news-container { max-width: none !important; }
.news-section .news-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 32px;
  border-bottom: 1px solid var(--imd-line);
  padding-bottom: 20px;
}
.news-section h2 {
  font-size: clamp(1.25rem, 1.8vw, 1.5rem) !important;
  letter-spacing: -0.02em !important;
  margin: 0 !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
}
.news-section .news-header a, .news-section .view-all-link {
  font-size: 1rem !important;
  font-weight: 500 !important;
  color: var(--imd-accent) !important;
}

/* News grid layout */
.news-section .news-grid {
  display: grid !important;
  grid-template-columns: 2fr 1fr !important;
  gap: 32px !important;
  align-items: start;
}
@media (max-width: 768px) {
  .news-section .news-grid { grid-template-columns: 1fr !important; }
}

/* Featured card — large hero */
.news-main {
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-width: 0;
}

.news-section .news-grid > *,
.news-featured,
.news-list,
.news-item {
  min-width: 0;
  max-width: 100%;
}

.news-featured {
  background: var(--imd-bg-soft) !important;
  border: 1px solid var(--imd-line-soft) !important;
  border-radius: var(--imd-r-lg) !important;
  padding: 44px 48px !important;
  display: block !important;
  text-decoration: none !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
  min-height: 360px;
}
.news-featured:hover {
  transform: translateY(-3px);
  box-shadow: var(--imd-shadow-md) !important;
}
.news-featured-label {
  background: var(--imd-accent) !important;
  color: white !important;
  border-radius: 4px !important;
  padding: 4px 9px !important;
  font-size: 0.65rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase;
  display: inline-block;
  margin-bottom: 12px;
}

/* Live indicator — accent red with pulsing dot */
.live-indicator {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase;
  color: #ff3b30 !important;
  margin-left: 10px;
  vertical-align: middle;
}
.live-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  background: #ff3b30;
  border-radius: 50%;
  box-shadow: 0 0 0 0 rgba(255,59,48,0.5);
  animation: live-pulse 2s ease-in-out infinite;
}
@keyframes live-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255,59,48,0.5); }
  50% { box-shadow: 0 0 0 5px rgba(255,59,48,0); }
}
@media (prefers-reduced-motion: reduce) {
  .live-dot { animation: none; }
}
.news-featured h3 {
  font-size: clamp(1.2rem, 1.9vw, 1.5rem) !important;
  letter-spacing: -0.02em !important;
  line-height: 1.2 !important;
  color: var(--imd-text) !important;
  margin: 0 0 10px !important;
  font-weight: 600 !important;
  overflow-wrap: anywhere;
}
.news-featured p {
  font-size: 0.95rem !important;
  line-height: 1.5;
  color: var(--imd-text-soft) !important;
}
.news-featured .news-meta {
  margin-top: 24px;
  font-size: 0.78rem !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--imd-text-muted) !important;
  font-weight: 600;
}

/* Side news list */
.news-section .news-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
}
.news-item {
  border: none !important;
  border-bottom: 1px solid var(--imd-line-soft) !important;
  border-radius: 0 !important;
  padding: 18px 0 !important;
  background: transparent !important;
  display: block;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: padding 0.15s ease;
}
.news-item:first-child { padding-top: 0 !important; }
.news-item:last-child { border-bottom: none !important; }
.news-item:hover {
  background: transparent !important;
  transform: none !important;
  box-shadow: none !important;
  padding-left: 6px !important;
}
.news-item:hover h4 { color: var(--imd-accent) !important; }
.news-item-time, .news-item-meta {
  color: var(--imd-text-muted) !important;
  font-size: 0.7rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  font-weight: 600 !important;
  margin-bottom: 6px;
}
.news-item h3, .news-item h4 {
  font-size: 1.02rem !important;
  letter-spacing: -0.012em !important;
  line-height: 1.3 !important;
  font-weight: 500 !important;
  color: var(--imd-text) !important;
  margin: 0 !important;
  transition: color 0.15s ease;
  overflow-wrap: anywhere;
}

/* Trending sidebar (if exists) */
.trending-now {
  background: transparent !important;
  border: 1px solid var(--imd-line-soft) !important;
  border-radius: var(--imd-r-md) !important;
  padding: 24px 28px !important;
  margin-top: 16px;
}
.trending-now h3 {
  font-size: 0.78rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: var(--imd-text-muted) !important;
  font-weight: 600 !important;
  margin: 0 0 16px !important;
}

/* ====== Trending list — sidebar with soft-bg panel ====== */
.news-sidebar {
  background: var(--imd-bg-soft) !important;
  border: 1px solid var(--imd-line-soft) !important;
  border-radius: 12px !important;
  padding: 20px 22px !important;
}
.news-sidebar h3 {
  font-size: 0.72rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: var(--imd-text-muted) !important;
  font-weight: 600 !important;
  margin: 0 0 12px !important;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--imd-line-soft);
}
.news-sidebar .sidebar-section-title {
  margin-top: 22px !important;
}
.trending-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.trending-list li {
  display: flex;
  align-items: baseline;
  gap: 16px;
  padding: 14px 0 !important;
  border-bottom: 1px solid var(--imd-line-soft);
  margin: 0 !important;
}
.trending-list li:last-child { border-bottom: none; }
.trending-list li::marker { content: "" !important; display: none !important; }
.trending-number {
  font-size: 0.92rem !important;
  font-weight: 600 !important;
  color: var(--imd-text-muted) !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  min-width: 18px;
  flex-shrink: 0;
  font-feature-settings: "tnum";
}
.trending-list li:nth-child(1) .trending-number { color: var(--imd-text); }
.trending-list a {
  font-size: 0.98rem !important;
  font-weight: 500 !important;
  color: var(--imd-text) !important;
  letter-spacing: -0.012em !important;
  line-height: 1.3 !important;
  text-decoration: none !important;
  flex: 1;
  transition: color 0.15s ease;
}
.trending-list a:hover { color: var(--imd-accent) !important; }

/* ====== Reset all stray ul/ol bullets in main content ====== */
main ul:not([class]), main ol:not([class]) {
  padding-left: 24px;
}
main ul.no-bullets, main ol.no-bullets { list-style: none; padding-left: 0; }

/* ====== Categories section — Apple App Store style with icons ====== */
.categories, .categories-section {
  max-width: var(--imd-content-w) !important;
  margin: 0 auto !important;
  padding: 80px 32px !important;
}
.categories .section-title,
.articles-section .section-title,
.specialty-section .section-title,
.article-list-section .section-title,
.topics-section .section-title {
  text-align: left;
  max-width: var(--imd-content-w);
  margin: 0 0 24px;
}
.categories .section-title h2,
.section-title h2 {
  font-size: clamp(1.25rem, 1.8vw, 1.5rem) !important;
  letter-spacing: -0.02em !important;
  margin: 0 0 8px !important;
  font-weight: 600 !important;
  text-align: left !important;
}
.categories .section-title p,
.articles-section .section-title p {
  font-size: clamp(1.05rem, 1.4vw, 1.2rem) !important;
  color: var(--imd-text-muted) !important;
  max-width: 640px;
  margin: 0 !important;
  letter-spacing: -0.005em;
  text-align: left !important;
}
.category-grid, .categories-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 14px !important;
}
@media (max-width: 900px) {
  .category-grid, .categories-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 560px) {
  .category-grid, .categories-grid { grid-template-columns: 1fr !important; }
}
.category-card {
  background: var(--imd-bg) !important;
  border: 1px solid var(--imd-line) !important;
  border-radius: 12px !important;
  padding: 20px 22px 22px !important;
  text-decoration: none !important;
  color: var(--imd-text) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  display: block;
  position: relative;
  min-height: auto;
  overflow: hidden;
}
/* Color accent stripe on top — each category gets its own hue */
.category-card::after {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 3px;
  background: var(--cat-accent, var(--imd-accent));
  opacity: 0.9;
}
.category-card[href*="/diseases/allergies"]   { --cat-accent: #ff9500; }
.category-card[href*="/diseases/"]:not([href*="allergies"]) { --cat-accent: #ff2d55; }
.category-card[href*="/treatment"]            { --cat-accent: #0071e3; }
.category-card[href*="/health/"]              { --cat-accent: #34c759; }
.category-card[href*="/medicines"]            { --cat-accent: #5856d6; }
.category-card[href*="/children"]             { --cat-accent: #af52de; }
.category-card[href*="/emergency"]            { --cat-accent: #ff3b30; }
.category-card[href*="/tools"]                { --cat-accent: #0071e3; }
.category-card[href*="/calculators"]          { --cat-accent: #0071e3; }
.category-card[href*="/interactions"]         { --cat-accent: #5856d6; }
.category-card[href*="/compare"]              { --cat-accent: #34c759; }

.category-card::before {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  margin-bottom: 12px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  transition: filter 0.2s ease;
}
.category-card:hover {
  transform: translateY(-2px);
  border-color: var(--cat-accent, var(--imd-text-muted)) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
}
.category-card h3 {
  font-size: 1rem !important;
  margin: 0 0 4px !important;
  letter-spacing: -0.012em !important;
  font-weight: 600 !important;
  color: var(--imd-text) !important;
  line-height: 1.25 !important;
}
.category-card p {
  font-size: 0.85rem !important;
  color: var(--imd-text-muted) !important;
  margin: 0 !important;
  line-height: 1.45 !important;
  max-width: none;
}

/* Category-specific icons (line-weight, monochrome) */
.category-card[href*="/diseases/allergies"]::before {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d1d1f' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M12 2v4M12 18v4M2 12h4M18 12h4M5 5l3 3M16 16l3 3M5 19l3-3M16 8l3-3'/><circle cx='12' cy='12' r='3'/></svg>");
}
.category-card[href*="/treatment/"]::before {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d1d1f' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><rect x='5' y='4' width='14' height='4' rx='2'/><path d='M9 8v10c0 1 1 2 2 2h2c1 0 2-1 2-2V8'/><line x1='10' y1='12' x2='14' y2='12'/></svg>");
}
.category-card[href*="/health/"]::before {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d1d1f' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M12 21s-7-4.5-7-11a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 6.5-7 11-7 11z'/></svg>");
}
.category-card[href*="/children/"]::before {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d1d1f' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='7' r='3'/><path d='M5 21v-3c0-3.3 3.1-6 7-6s7 2.7 7 6v3'/></svg>");
}
.category-card[href*="/emergency"]::before {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d1d1f' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M12 9v4M12 17h.01'/><path d='M10.3 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z'/></svg>");
}
.category-card[href="/en/diseases/"]::before {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d1d1f' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='9'/><path d='M12 8v8M8 12h8'/></svg>");
}

/* ====== Topics section (pill tags) — Apple chip style ====== */
.topics-section {
  background: var(--imd-bg-soft) !important;
  padding: 80px 32px !important;
  margin: 0 !important;
  border-top: 1px solid var(--imd-line-soft);
  border-bottom: 1px solid var(--imd-line-soft);
}
.topics-container {
  max-width: var(--imd-content-w) !important;
  margin: 0 auto !important;
  padding: 0 !important;
}
.topics-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 20px !important;
  border-bottom: none !important;
  padding-bottom: 0 !important;
}
.topics-header h2 {
  font-size: clamp(1.25rem, 1.8vw, 1.5rem) !important;
  letter-spacing: -0.02em !important;
  margin: 0 !important;
  font-weight: 600 !important;
}
.topics-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  grid-template-columns: none !important;
}
.topic-tag {
  display: inline-block !important;
  background: var(--imd-bg) !important;
  border: 1px solid var(--imd-line) !important;
  border-radius: 980px !important;
  padding: 10px 20px !important;
  font-size: 0.95rem !important;
  font-weight: 500 !important;
  color: var(--imd-text) !important;
  letter-spacing: -0.01em !important;
  text-decoration: none !important;
  transition: all 0.2s ease;
}
.topic-tag:hover {
  background: var(--imd-text) !important;
  color: white !important;
  border-color: var(--imd-text) !important;
  transform: translateY(-1px);
  text-decoration: none !important;
}

/* ====== Articles grid — premium editorial cards (fixed 3-col for balance) ====== */
.articles-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 16px !important;
}
@media (max-width: 900px) {
  .articles-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 560px) {
  .articles-grid { grid-template-columns: 1fr !important; }
}
.article-card {
  background: var(--imd-bg) !important;
  border: 1px solid var(--imd-line-soft) !important;
  border-radius: 18px !important;
  padding: 0 !important;
  text-decoration: none !important;
  color: var(--imd-text) !important;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
              box-shadow 0.3s ease,
              border-color 0.3s ease;
  display: block;
  overflow: hidden;
}
.article-card:hover {
  transform: translateY(-3px);
  border-color: var(--imd-line) !important;
  box-shadow: 0 20px 50px rgba(0,0,0,0.06), 0 4px 12px rgba(0,0,0,0.04);
}
.article-content { padding: 28px 28px 24px; }
.article-category {
  display: inline-block;
  font-size: 0.7rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  font-weight: 600 !important;
  color: var(--imd-accent) !important;
  margin-bottom: 12px;
}
.article-card h3 {
  font-size: 1.2rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.018em !important;
  line-height: 1.25 !important;
  color: var(--imd-text) !important;
  margin: 0 0 10px !important;
}
.article-card p {
  font-size: 0.95rem !important;
  color: var(--imd-text-muted) !important;
  line-height: 1.5 !important;
  margin: 0 !important;
}

/* ====== Article-list section ====== */
.article-list-section .articles-header {
  max-width: var(--imd-content-w);
  margin: 0 auto 24px;
}
/* Outer grid: one column per category */
.article-list-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 28px !important;
  max-width: var(--imd-content-w);
  margin: 0 auto;
}
@media (max-width: 900px) {
  .article-list-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 560px) {
  .article-list-grid { grid-template-columns: 1fr !important; }
}
.article-list-column h3 {
  font-size: 0.72rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: var(--imd-text-muted) !important;
  font-weight: 600 !important;
  margin: 0 0 12px !important;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--imd-line);
}
/* Inner list: vertical column of items */
.article-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: block !important;
  grid-template-columns: none !important;
}
.article-list li {
  border-bottom: 1px solid var(--imd-line-soft);
  padding: 10px 0 !important;
  margin: 0 !important;
  list-style: none !important;
}
.article-list li:last-child { border-bottom: 0; }
.article-list li::marker { content: ""; }
.article-list li::before { content: none !important; }
.article-list a {
  font-size: 0.92rem !important;
  font-weight: 500 !important;
  color: var(--imd-text) !important;
  text-decoration: none !important;
  letter-spacing: -0.005em;
  display: block;
  line-height: 1.3 !important;
  transition: color 0.15s ease;
}
.article-list-meta {
  display: block;
  font-size: 0.78rem !important;
  font-weight: 400 !important;
  color: var(--imd-text-muted) !important;
  margin-top: 2px;
  letter-spacing: 0 !important;
}
.article-list a:hover { color: var(--imd-accent) !important; }
.article-list a:hover .article-list-meta { color: var(--imd-accent) !important; opacity: 0.8; }

@media (max-width: 768px) {
  .categories, .topics-section, .articles-section, .article-list-section { padding: 56px 20px !important; }
  .category-card { padding: 28px 24px !important; min-height: auto; }
  .article-content { padding: 24px 24px 20px; }
}

/* ====== Topics / browse-by-X section ====== */
.topics-section, .articles-section, .article-list-section {
  max-width: var(--imd-content-w) !important;
  margin: 80px auto !important;
  padding: 0 32px !important;
}
.topics-header, .articles-header, .browse-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 32px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--imd-line);
}
.topics-header h2, .articles-header h2 {
  font-size: clamp(1.25rem, 1.8vw, 1.5rem) !important;
  letter-spacing: -0.02em !important;
  margin: 0 !important;
  font-weight: 600 !important;
}
.view-all-link {
  font-size: 1rem !important;
  color: var(--imd-accent) !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}

.alt-bg { background: var(--imd-bg-soft) !important; padding: 64px 32px !important; border-radius: 0 !important; }

/* ====== Hero section — left-aligned, compact ====== */
.hero {
  max-width: var(--imd-content-w) !important;
  margin: 0 auto !important;
  padding: 40px 32px 28px !important;
  text-align: left !important;
  background: transparent !important;
}
.hero-content { max-width: 880px; margin: 0; }
.hero p, .hero .subtitle {
  font-size: clamp(1.1rem, 1.5vw, 1.25rem) !important;
  color: var(--imd-text-muted) !important;
  max-width: 720px;
  margin: 0 0 32px !important;
  font-weight: 400 !important;
  letter-spacing: -0.005em !important;
  line-height: 1.5 !important;
  text-align: left !important;
}

/* Hide tacky hero-badges with checkmarks */
.hero-badges { display: none !important; }

/* Hide article-count pill — generic */
.hero-article-count { display: none !important; }

/* Search box in hero — make it Apple-prominent */
.hero-search { margin-top: 24px !important; }
.hero-search-form {
  max-width: 580px;
  margin: 0;
  position: relative;
  display: block;
}
.hero-search-form input {
  width: 100% !important;
  padding: 16px 48px 16px 22px !important;
  font-size: 1.05rem !important;
  border-radius: 980px !important;
  border: 1px solid var(--imd-line) !important;
  background-color: var(--imd-bg) !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236e6e73' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='11' cy='11' r='8'/><line x1='21' y1='21' x2='16.65' y2='16.65'/></svg>") !important;
  background-repeat: no-repeat !important;
  background-position: right 20px center !important;
  background-size: 18px 18px !important;
  box-shadow: var(--imd-shadow-sm) !important;
  text-align: left !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}
.hero-search-form input::-webkit-search-cancel-button,
.hero-search-form input::-webkit-search-decoration { -webkit-appearance: none; appearance: none; }
.hero-search-form input:focus {
  border-color: var(--imd-accent) !important;
  outline: none !important;
  box-shadow: 0 0 0 4px rgba(0,113,227,0.1), var(--imd-shadow-md) !important;
}

/* ====== Quick Access bar — refine ====== */
.quick-access {
  max-width: none !important;
  margin: 0 !important;
  padding: 10px 32px !important;
  border-top: 1px solid var(--imd-line-soft);
  border-bottom: 1px solid var(--imd-line-soft);
  background: var(--imd-bg-soft) !important;
}
.quick-access > .quick-access-container {
  max-width: var(--imd-content-w);
  margin: 0 auto;
}
.quick-access-container {
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 0;
  justify-content: center;
}
/* Hide "Quick Access:" label — links speak for themselves */
.quick-access-label { display: none !important; }
.quick-access-links {
  display: flex !important;
  gap: 4px !important;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
.quick-access-links a {
  color: var(--imd-text-muted) !important;
  font-size: 0.88rem !important;
  font-weight: 400 !important;
  padding: 6px 14px !important;
  letter-spacing: -0.005em;
  text-decoration: none !important;
  border-radius: 6px;
  transition: color 0.15s ease;
}
.quick-access-links a:hover {
  color: var(--imd-text) !important;
  background: var(--imd-bg-soft) !important;
}
.quick-access-links a:not(:last-child)::after {
  content: "·";
  margin-left: 14px;
  color: var(--imd-line);
}

@media (max-width: 768px) {
  .hero { padding: 64px 20px 56px !important; }
  .hero-search-form input { padding: 14px 20px !important; font-size: 1rem !important; }
  .quick-access {
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .quick-access::-webkit-scrollbar { display: none; }
  .quick-access-links { flex-wrap: nowrap; }
  .quick-access-links a { flex-shrink: 0; }
}

/* Tools-strip — hide if any pages still use it */
.tools-strip { display: none !important; }

/* ====== Feature Grid Section — premium card layout ====== */
.feature-grid-section {
  background: var(--imd-bg-soft);
  padding: 36px 0;
  margin: 0;
}
.feature-grid-container {
  max-width: var(--imd-content-w);
  margin: 0 auto;
  padding: 0 32px;
}
.feature-grid-header {
  text-align: left;
  max-width: var(--imd-content-w);
  margin: 0 0 24px;
}
.feature-grid-header h2 {
  font-size: clamp(1.25rem, 1.8vw, 1.5rem) !important;
  letter-spacing: -0.02em !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  color: var(--imd-text) !important;
  margin: 0 0 8px !important;
  text-align: left !important;
}
.feature-grid-header p {
  font-size: clamp(1.05rem, 1.4vw, 1.2rem) !important;
  text-align: left !important;
  color: var(--imd-text-muted) !important;
  margin: 0 !important;
  letter-spacing: -0.01em;
  line-height: 1.45;
}

.feature-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}

.feature-card {
  display: block;
  background: var(--imd-bg);
  border: 1px solid var(--imd-line-soft);
  border-radius: 12px;
  padding: 18px 20px 16px;
  text-decoration: none !important;
  color: var(--imd-text) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  position: relative;
  overflow: hidden;
  min-height: auto;
}
.feature-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(0,113,227,0.04) 0%, rgba(0,113,227,0) 60%);
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
}
.feature-card:hover {
  transform: translateY(-4px);
  background: var(--imd-bg);
  border-color: var(--imd-line-soft);
  box-shadow: 0 20px 50px rgba(0,0,0,0.08), 0 4px 12px rgba(0,0,0,0.04);
}
.feature-card:hover::before { opacity: 1; }

.feature-icon {
  width: 22px;
  height: 22px;
  color: var(--imd-text-muted);
  margin-bottom: 10px;
  display: block;
  transition: color 0.2s ease;
}
.feature-card:hover .feature-icon {
  color: var(--imd-accent);
}

.feature-card h3 {
  font-size: 0.98rem !important;
  letter-spacing: -0.01em !important;
  font-weight: 600 !important;
  color: var(--imd-text) !important;
  margin: 0 0 4px !important;
  line-height: 1.3 !important;
}

.feature-card p {
  font-size: 0.82rem !important;
  color: var(--imd-text-muted) !important;
  line-height: 1.45 !important;
  margin: 0 0 8px !important;
  max-width: none;
}

.feature-link {
  display: inline-flex;
  align-items: center;
  font-size: 0.82rem;
  font-weight: 500;
  color: var(--imd-accent);
  letter-spacing: -0.005em;
  transition: gap 0.2s ease;
}
.feature-card:hover .feature-link {
  gap: 6px;
}

@media (max-width: 768px) {
  .feature-grid-section { padding: 56px 0; }
  .feature-grid-header { margin-bottom: 40px; }
  .feature-grid { gap: 12px; }
  .feature-card { padding: 28px 24px; min-height: auto; }
}

/* ====== Section dividers — alternating bgs for clear contrast ======
   Pattern: news (white) → tools (gray) → categories (white) → topics (gray)
   → featured (white) → latest medicine (gray, alt-bg) → browse (white) */
.news-section {
  background: var(--imd-bg) !important;
  padding: 28px 0 32px !important;
  margin: 0 !important;
  max-width: none !important;
  border-bottom: 1px solid var(--imd-line-soft);
}
.news-section .news-container, .news-section > div {
  max-width: var(--imd-content-w);
  margin: 0 auto;
  padding: 0 32px;
}

.feature-grid-section {
  background: var(--imd-bg-soft) !important;
  padding: 32px 0 !important;
  margin: 0 !important;
  max-width: none !important;
  border-bottom: 1px solid var(--imd-line-soft);
}

.categories {
  background: var(--imd-bg) !important;
  padding: 32px 32px !important;
  max-width: none !important;
  margin: 0 !important;
  border-bottom: 1px solid var(--imd-line-soft);
}
.categories > * {
  max-width: var(--imd-content-w);
  margin-left: auto !important;
  margin-right: auto !important;
}

.topics-section {
  background: var(--imd-bg-soft) !important;
  padding: 32px 32px !important;
  max-width: none !important;
  margin: 0 !important;
  border-bottom: 1px solid var(--imd-line-soft);
}
.topics-section > * {
  max-width: var(--imd-content-w);
  margin-left: auto !important;
  margin-right: auto !important;
}

.articles-section {
  background: var(--imd-bg) !important;
  padding: 32px 32px !important;
  max-width: none !important;
  margin: 0 !important;
  border-bottom: 1px solid var(--imd-line-soft);
}
.articles-section > * {
  max-width: var(--imd-content-w);
  margin-left: auto !important;
  margin-right: auto !important;
}
.articles-section.alt-bg {
  background: var(--imd-bg-soft) !important;
}

.article-list-section {
  background: var(--imd-bg) !important;
  padding: 32px 32px !important;
  max-width: none !important;
  margin: 0 !important;
  border-bottom: 1px solid var(--imd-line-soft);
}
.article-list-section > * {
  max-width: var(--imd-content-w);
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ====== Specialty section ====== */
.specialty-section {
  background: var(--imd-bg-soft) !important;
  padding: 32px 32px !important;
  margin: 0 !important;
  border-bottom: 1px solid var(--imd-line-soft);
}
.specialty-container { max-width: var(--imd-content-w); margin: 0 auto; }
.specialty-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
@media (max-width: 900px) { .specialty-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 600px) { .specialty-grid { grid-template-columns: repeat(2, 1fr); } }
.specialty-card {
  display: flex;
  flex-direction: column;
  background: var(--imd-bg);
  border: 1px solid var(--imd-line);
  border-radius: 10px;
  padding: 14px 16px;
  text-decoration: none !important;
  color: var(--imd-text) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  position: relative;
  overflow: hidden;
}
.specialty-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 2px;
  background: var(--sp-accent, var(--imd-accent));
}
.specialty-card[data-specialty="cardio"]      { --sp-accent: #ff2d55; }
.specialty-card[data-specialty="neuro"]       { --sp-accent: #5856d6; }
.specialty-card[data-specialty="oncology"]    { --sp-accent: #af52de; }
.specialty-card[data-specialty="psychiatry"]  { --sp-accent: #32ade6; }
.specialty-card[data-specialty="pulmonology"] { --sp-accent: #0071e3; }
.specialty-card[data-specialty="gastro"]      { --sp-accent: #34c759; }
.specialty-card[data-specialty="dermatology"] { --sp-accent: #ff9500; }
.specialty-card[data-specialty="endocrinology"]{ --sp-accent: #00c7be; }
.specialty-card[data-specialty="orthopedics"] { --sp-accent: #ac8e68; }
.specialty-card[data-specialty="infectious"]  { --sp-accent: #30b0c7; }
.specialty-card[data-specialty="pediatrics"]  { --sp-accent: #ff3b30; }
.specialty-card[data-specialty="reproductive"]{ --sp-accent: #ff2d55; }

.specialty-card:hover {
  transform: translateY(-2px);
  border-color: var(--sp-accent, var(--imd-text-muted));
  box-shadow: 0 6px 18px rgba(0,0,0,0.06);
}
.specialty-name {
  font-size: 0.92rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--imd-text);
  line-height: 1.2;
  margin-top: 4px;
}
.specialty-count {
  font-size: 0.78rem;
  color: var(--imd-text-muted);
  margin-top: 4px;
  letter-spacing: 0;
  font-weight: 400;
}

@media (max-width: 768px) {
  .news-section, .categories, .topics-section, .articles-section, .article-list-section { padding: 56px 20px !important; }
  .news-section .news-container, .feature-grid-container { padding: 0 20px !important; }
}

/* ====== Section headers — compact, consistent ====== */
.news-section .news-header h2,
.topics-section .topics-header h2,
.articles-section .articles-header h2,
.section-title h2,
.feature-grid-header h2 {
  font-size: clamp(1.25rem, 1.8vw, 1.5rem) !important;
  letter-spacing: -0.02em !important;
  font-weight: 600 !important;
  margin: 0 !important;
}

/* ====== Hide hero-search-form's wrapper border quirks if any ====== */
.search-box.hero-search-form { display: block; }

/* Hide the old why-trust if it remains anywhere */
.trust-section { display: none !important; }

/* Quick access strip below hero */
.quick-access {
  max-width: var(--imd-content-w) !important;
  margin: 0 auto !important;
  padding: 16px 32px !important;
  font-size: 0.92rem;
  color: var(--imd-text-muted);
}
.quick-access a {
  color: var(--imd-text-soft) !important;
  font-weight: 500 !important;
  margin-right: 12px;
}
.quick-access a:hover { color: var(--imd-accent) !important; }

/* ====== Footer — clean, professional ====== */
footer {
  background: var(--imd-bg) !important;
  color: var(--imd-text-muted) !important;
  padding: 72px 32px 40px !important;
  margin-top: 80px !important;
  border-top: 1px solid var(--imd-line-soft) !important;
  font-size: 0.88rem !important;
  line-height: 1.5 !important;
}
footer .footer-container {
  max-width: var(--imd-content-w) !important;
  margin: 0 auto !important;
}
footer .footer-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 32px !important;
  padding-bottom: 48px !important;
  border-bottom: 1px solid var(--imd-line-soft) !important;
}
footer .footer-section { text-align: left; }
footer h3 {
  color: var(--imd-text) !important;
  font-size: 0.82rem !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  font-weight: 600 !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
}
footer ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
footer ul li {
  padding: 0 !important;
  margin: 0 0 10px !important;
  line-height: 1.4 !important;
  list-style: none !important;
}
footer ul li::before { content: none !important; }
footer a {
  color: var(--imd-text-muted) !important;
  font-size: 0.88rem !important;
  font-weight: 400 !important;
  text-decoration: none !important;
  transition: color 0.15s ease;
}
footer a:hover { color: var(--imd-text) !important; }

footer .footer-bottom {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: space-between !important;
  align-items: baseline !important;
  gap: 16px 32px !important;
  margin: 32px 0 0 !important;
  padding: 0 !important;
  border: none !important;
}
footer .footer-bottom p {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 0.8rem !important;
  color: var(--imd-text-tertiary, #86868b) !important;
  line-height: 1.5 !important;
}
footer .footer-copy { flex: 0 0 auto; }
footer .footer-note {
  flex: 1 1 auto;
  text-align: right;
  max-width: 720px;
}
footer .footer-note a {
  color: var(--imd-text-muted) !important;
  font-size: 0.8rem !important;
  text-decoration: underline !important;
  text-decoration-color: var(--imd-line) !important;
  text-underline-offset: 2px;
}
footer .footer-note a:hover { color: var(--imd-text) !important; }

/* Hide any leftover badges/disclaimer blocks if they appear elsewhere */
footer .footer-badges,
footer .footer-badge,
footer .footer-disclaimer { display: none !important; }

@media (max-width: 900px) {
  footer .footer-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 32px 24px !important; }
}
@media (max-width: 560px) {
  footer { padding: 56px 20px 32px !important; }
  footer .footer-grid { grid-template-columns: 1fr !important; gap: 28px !important; padding-bottom: 32px !important; }
  footer .footer-bottom { flex-direction: column !important; align-items: flex-start !important; }
  footer .footer-note { text-align: left !important; }
}

/* ====== Severity / status badges — desaturated, premium ====== */
.severity-tag, .status-badge, .footer-badge {
  border-radius: 4px !important;
  padding: 4px 10px !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  border: 1px solid !important;
}
.severity-major, .severity-banner.severity-major {
  background: white !important;
  color: var(--imd-danger) !important;
  border-color: var(--imd-danger) !important;
}
.severity-banner.severity-major {
  background: rgba(179,38,30,0.04) !important;
  padding: 16px 20px !important;
  font-size: 0.95rem !important;
  border-radius: var(--imd-r-md) !important;
}
.severity-moderate, .severity-banner.severity-moderate {
  background: white !important;
  color: var(--imd-warning) !important;
  border-color: var(--imd-warning) !important;
}
.severity-banner.severity-moderate {
  background: rgba(178,92,0,0.04) !important;
  padding: 16px 20px !important;
  font-size: 0.95rem !important;
  border-radius: var(--imd-r-md) !important;
}
.severity-minor, .severity-banner.severity-minor {
  background: white !important;
  color: var(--imd-accent) !important;
  border-color: var(--imd-accent) !important;
}
.severity-banner.severity-minor {
  background: rgba(0,113,227,0.04) !important;
  padding: 16px 20px !important;
  font-size: 0.95rem !important;
  border-radius: var(--imd-r-md) !important;
}

/* ====== Skip link — minimal ====== */
.skip-link {
  background: var(--imd-text) !important;
  color: white !important;
  padding: 12px 20px !important;
  border-radius: 6px !important;
  font-weight: 500 !important;
  font-size: 0.9rem !important;
}

/* ====== Quality-meta widget — refined ====== */
.quality-meta-widget {
  background: var(--imd-bg-soft) !important;
  border: 1px solid var(--imd-line-soft) !important;
  border-left: none !important;
  border-radius: var(--imd-r-md) !important;
  padding: 20px 24px !important;
}
.quality-badge {
  background: white !important;
  border: 1px solid var(--imd-line) !important;
  border-radius: var(--imd-r-sm) !important;
  padding: 6px 12px !important;
  font-size: 0.82rem !important;
  font-weight: 500 !important;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--imd-text-soft);
}

/* ====== Breadcrumb — minimal ====== */
nav[aria-label="Breadcrumb"] {
  font-size: 0.85rem !important;
  color: var(--imd-text-muted) !important;
  margin: 24px 0 !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 500;
}
nav[aria-label="Breadcrumb"] a {
  color: var(--imd-text-muted) !important;
}
nav[aria-label="Breadcrumb"] a:hover { color: var(--imd-text) !important; }

/* ====== Last reviewed widget ====== */
.last-reviewed-widget {
  background: transparent !important;
  border-top: 1px solid var(--imd-line-soft) !important;
  border-radius: 0 !important;
  padding: 16px 0 !important;
  font-size: 0.82rem !important;
  color: var(--imd-text-muted) !important;
  margin: 32px 0 0 !important;
}

/* ====== Article content blocks — neutralize inline-styled cruft ======
   Many pages have inline-styled colored boxes (red emergency, yellow medications,
   purple gradient badges, dark navy author bios). Override comprehensively here. */

/* Emergency / diversifier callout — neutral panel with thin left accent */
aside.diversifier-block,
aside.symptom-checklist,
aside[class*="diversifier"] {
  background: var(--imd-bg-soft) !important;
  background-color: var(--imd-bg-soft) !important;
  border: 1px solid var(--imd-line-soft) !important;
  border-left: 3px solid var(--imd-text) !important;
  border-radius: 8px !important;
  padding: 20px 24px !important;
  margin: 20px 0 !important;
  box-shadow: none !important;
}
aside.diversifier-block h1,
aside.diversifier-block h2,
aside.diversifier-block h3,
aside.diversifier-block h4 {
  color: var(--imd-text) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  margin: 0 0 10px !important;
  letter-spacing: -0.01em !important;
}
aside.diversifier-block p,
aside.diversifier-block li {
  color: var(--imd-text-soft) !important;
  font-size: 0.95rem !important;
}
aside.diversifier-block a { color: var(--imd-accent) !important; }

/* Citation block — clean inline references */
aside.citation-block,
aside[class*="citation"] {
  background: var(--imd-bg-soft) !important;
  background-color: var(--imd-bg-soft) !important;
  border: 1px solid var(--imd-line-soft) !important;
  border-radius: 10px !important;
  padding: 24px 28px !important;
  margin: 32px 0 !important;
  box-shadow: none !important;
}
aside.citation-block h1,
aside.citation-block h2,
aside.citation-block h3 {
  color: var(--imd-text) !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  margin: 0 0 8px !important;
  text-transform: none !important;
}
aside.citation-block p { font-size: 0.9rem !important; color: var(--imd-text-muted) !important; }
.citation-list { display: flex; flex-direction: column; gap: 12px; }
.citation-item {
  background: var(--imd-bg) !important;
  border: 1px solid var(--imd-line-soft) !important;
  border-left: 2px solid var(--imd-text-muted) !important;
  border-radius: 6px !important;
  padding: 14px 18px !important;
  margin: 0 !important;
}
.citation-item > div:first-child {
  font-size: 0.7rem !important;
  color: var(--imd-text-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  font-weight: 600 !important;
  margin-bottom: 6px !important;
}
.citation-item p { font-size: 0.92rem !important; color: var(--imd-text-soft) !important; margin: 0 0 6px !important; }
.citation-item cite { font-size: 0.82rem !important; color: var(--imd-text-muted) !important; font-style: normal !important; }
.citation-item a { font-size: 0.82rem !important; color: var(--imd-accent) !important; }

/* References section — neutral */
section.references-section,
section[class*="references"] {
  background: var(--imd-bg) !important;
  border: 1px solid var(--imd-line-soft) !important;
  border-left: 1px solid var(--imd-line-soft) !important;
  border-radius: 10px !important;
  padding: 24px 28px !important;
  margin: 32px 0 !important;
  box-shadow: none !important;
}
section.references-section h2 {
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  margin: 0 0 12px !important;
  color: var(--imd-text) !important;
}
section.references-section p,
section.references-section li,
section.references-section a,
section.references-section span,
section.references-section strong { color: var(--imd-text-soft) !important; }
section.references-section ol {
  padding-left: 1.5em !important;
  margin: 0 !important;
}
section.references-section ol li {
  margin: 0 0 12px !important;
  font-size: 0.92rem !important;
  line-height: 1.6 !important;
}
section.references-section a {
  color: var(--imd-accent) !important;
  text-decoration: underline !important;
  text-underline-offset: 2px;
}

/* Author / editorial-standards sections — strip the navy gradient panel */
section.author-section,
section.editorial-standards,
section[class*="author"] {
  background: var(--imd-bg) !important;
  border: 1px solid var(--imd-line-soft) !important;
  border-radius: 12px !important;
  padding: 0 !important;
  margin: 32px 0 !important;
  overflow: hidden;
}
section.author-section > div,
section.editorial-standards > div {
  background: var(--imd-bg) !important;
  background-image: none !important;
  background-color: var(--imd-bg) !important;
  color: var(--imd-text) !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 24px 28px !important;
  margin: 0 !important;
}
section.author-section h2,
section.author-section h3,
section.author-section h4,
section.author-section h5,
section.editorial-standards h2,
section.editorial-standards h3,
section.editorial-standards h4,
section.editorial-standards h5 {
  color: var(--imd-text) !important;
  font-weight: 600 !important;
}
section.author-section h3 { font-size: 1.1rem !important; margin: 0 0 4px !important; }
section.author-section h4 { font-size: 0.95rem !important; margin: 0 0 6px !important; }
section.author-section h5 { font-size: 0.92rem !important; margin: 0 0 6px !important; }
section.author-section p,
section.author-section li,
section.author-section span,
section.author-section strong,
section.editorial-standards p,
section.editorial-standards li,
section.editorial-standards strong { color: var(--imd-text-soft) !important; }
section.author-section p { font-size: 0.92rem !important; line-height: 1.6 !important; }
section.editorial-standards p { font-size: 0.9rem !important; }

/* Editorial-team / qualifications grid inside author-section */
section.author-section .editorial-team-grid,
section.author-section > div > div[style*="grid"] {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 12px !important;
  background: none !important;
  padding: 0 !important;
  margin: 12px 0 !important;
}
section.author-section .editorial-team-grid > div,
section.author-section > div > div[style*="grid"] > div {
  background: var(--imd-bg-soft) !important;
  border: 1px solid var(--imd-line-soft) !important;
  border-radius: 8px !important;
  padding: 14px 16px !important;
}

/* Editorial-standards 4-grid (Peer Review / Fact-Checking / etc) */
section.editorial-standards > div[style*="grid"] {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
  gap: 16px !important;
  margin: 16px 0 !important;
}

/* Hide the big avatar circle on author-section */
section.author-section > div > div > div:first-child[style*="border-radius: 50%"],
section.author-section > div > div > div:first-child[style*="width: 100px"] {
  display: none !important;
}

/* ====== Related medications / conditions — neutral panel ====== */
aside.related-medications,
aside.related-conditions,
aside[class*="related"] {
  background: var(--imd-bg-soft) !important;
  background-color: var(--imd-bg-soft) !important;
  border: 1px solid var(--imd-line-soft) !important;
  border-left: 1px solid var(--imd-line-soft) !important;
  border-radius: 10px !important;
  padding: 20px 24px !important;
  margin: 24px 0 !important;
  box-shadow: none !important;
}
aside.related-medications h2,
aside.related-conditions h2 {
  font-size: 1rem !important;
  font-weight: 600 !important;
  margin: 0 0 10px !important;
  letter-spacing: -0.01em !important;
  color: var(--imd-text) !important;
}
aside.related-medications p,
aside.related-conditions p { font-size: 0.9rem !important; color: var(--imd-text-muted) !important; }
aside.related-medications ul,
aside.related-conditions ul { padding-left: 0 !important; list-style: none !important; }
aside.related-medications ul li,
aside.related-conditions ul li {
  padding: 6px 0 !important;
  border-bottom: 1px solid var(--imd-line-soft);
  list-style: none !important;
  font-size: 0.92rem !important;
}
aside.related-medications ul li:last-child,
aside.related-conditions ul li:last-child { border-bottom: 0; }
aside.related-medications ul li::before,
aside.related-conditions ul li::before { content: none !important; }
aside.related-medications a,
aside.related-conditions a {
  color: var(--imd-accent) !important;
  font-weight: 500;
  text-decoration: none !important;
}
aside.related-medications a:hover,
aside.related-conditions a:hover { text-decoration: underline !important; }

/* Override common ugly inline backgrounds */
[style*="background:#fff5f5"], [style*="background: #fff5f5"],
[style*="background:#fff8e1"], [style*="background: #fff8e1"],
[style*="background:#f8f9fa"], [style*="background: #f8f9fa"],
[style*="background:#fff8dc"], [style*="background: #fff8dc"] {
  background-color: var(--imd-bg-soft) !important;
}
[style*="border-left:4px solid #e74c3c"],
[style*="border-left: 4px solid #e74c3c"],
[style*="border-left:4px solid #f59e0b"],
[style*="border-left: 4px solid #f59e0b"],
[style*="border-left:4px solid var(--secondary-color)"],
[style*="border-left: 4px solid var(--secondary-color)"] {
  border-left-color: var(--imd-text) !important;
  border-left-width: 3px !important;
}

/* Constrain related-medications (sibling of <article>, child of <main>) to prose-width */
.content-wrapper > main > aside {
  max-width: 100% !important;
}

/* Constrain related-medications-inside-article (some pages have it nested) */
.content-wrapper > main > article > aside,
.content-wrapper > main > article > section { max-width: 100% !important; }

/* Hide emoji icons in content-block headings (defense-in-depth) */
aside h1 span[aria-hidden="true"], aside h2 span[aria-hidden="true"],
aside h3 span[aria-hidden="true"], aside h4 span[aria-hidden="true"],
aside h2 span[role="img"], aside h3 span[role="img"], aside h4 span[role="img"],
section.author-section span[role="img"],
section.author-section span[aria-hidden="true"],
section.editorial-standards h4 span[role="img"],
section.editorial-standards h4 span[aria-hidden="true"],
section.references-section span[role="img"],
section.references-section span[aria-hidden="true"] { display: none !important; }

/* Editorial-standards h4 + p — keep readable */
section.editorial-standards h4 { font-size: 0.95rem !important; margin: 0 0 6px !important; }
section.editorial-standards h4 + p { font-size: 0.9rem !important; }

/* ====== Reduced motion ====== */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
  *:hover { transform: none !important; }
}

/* ====== Mobile-tap targets ====== */
@media (max-width: 768px) {
  a, button, input, select { min-height: 44px; }
}

/* ====== Final touches — image rendering ====== */
img { max-width: 100%; height: auto; }
img[style*="border-radius"] { border-radius: var(--imd-r-md); }

/* ====== Selection color ====== */
::selection { background: var(--imd-text); color: white; }
::-moz-selection { background: var(--imd-text); color: white; }

/* ====== Code ====== */
code, kbd, pre {
  background: var(--imd-bg-soft);
  padding: 2px 6px;
  border-radius: 4px;
  font-family: "SF Mono", Menlo, Consolas, monospace;
  font-size: 0.88em;
  letter-spacing: 0;
}

/* ====== Home mobile polish ======
   Fixes the homepage mobile layout where the quick-access strip was centered
   inside an overflowing row and news cards inherited double side padding. */
@media (max-width: 1024px) {
  .quick-access {
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 10px 0 12px !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
  }

  .quick-access::-webkit-scrollbar {
    display: none;
  }

  .quick-access > .quick-access-container,
  .quick-access-container {
    max-width: none !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 16px !important;
    display: flex !important;
    justify-content: flex-start !important;
  }

  .quick-access-links {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
  }

  .quick-access-links a {
    flex: 0 1 auto !important;
    margin: 0 !important;
    padding: 7px 11px !important;
    border: 1px solid var(--imd-line-soft) !important;
    border-radius: 999px !important;
    background: var(--imd-bg) !important;
    color: var(--imd-text-soft) !important;
    font-size: 0.84rem !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
  }

  .quick-access-links a::after {
    display: none !important;
    content: none !important;
  }
}

@media (max-width: 768px) {
  body {
    overflow-x: hidden;
  }

  .hero {
    padding: 48px 20px 34px !important;
  }

  .hero h1 {
    max-width: 100% !important;
  }

  .hero-search {
    margin-top: 18px !important;
  }

  .hero-search-form {
    max-width: none !important;
    width: 100% !important;
  }

  .hero-search-form input {
    padding: 14px 48px 14px 20px !important;
    background-position: right 18px center !important;
  }

  .quick-access {
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 10px 0 12px !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    border-top: 1px solid var(--imd-line-soft) !important;
    border-bottom: 1px solid var(--imd-line-soft) !important;
  }

  .quick-access::-webkit-scrollbar {
    display: none;
  }

  .quick-access > .quick-access-container,
  .quick-access-container {
    max-width: none !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 16px !important;
    display: flex !important;
    justify-content: flex-start !important;
  }

  .quick-access-links {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
  }

  .quick-access-links a {
    flex: 0 1 auto !important;
    margin: 0 !important;
    padding: 7px 11px !important;
    border: 1px solid var(--imd-line-soft) !important;
    border-radius: 999px !important;
    background: var(--imd-bg) !important;
    color: var(--imd-text-soft) !important;
    font-size: 0.84rem !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
  }

  .quick-access-links a::after {
    display: none !important;
    content: none !important;
  }

  .news-section {
    padding: 24px 0 28px !important;
    margin: 0 !important;
  }

  .news-section .news-container,
  .news-section > div {
    padding: 0 16px !important;
    max-width: none !important;
  }

  .news-section .news-header {
    margin-bottom: 24px !important;
    padding-bottom: 16px !important;
    align-items: center !important;
    gap: 16px !important;
  }

  .news-section h2 {
    font-size: 1.3rem !important;
  }

  .news-section .news-header a,
  .news-section .view-all-link {
    white-space: nowrap !important;
    font-size: 0.95rem !important;
  }

  .news-section .news-grid {
    gap: 22px !important;
  }

  .news-main {
    gap: 14px !important;
  }

  .news-featured {
    min-height: auto !important;
    padding: 28px 24px !important;
    border-radius: 14px !important;
  }

  .news-featured h3 {
    font-size: 1.2rem !important;
    line-height: 1.22 !important;
  }

  .news-featured p {
    font-size: 0.95rem !important;
    line-height: 1.5 !important;
  }

  .news-item {
    padding: 16px 0 !important;
  }

  .news-item h3,
  .news-item h4 {
    font-size: 1rem !important;
    line-height: 1.35 !important;
  }

  .tools-callout {
    margin: 24px 0 !important;
    padding: 0 16px !important;
    max-width: none !important;
  }

  .tools-callout > div {
    padding: 24px 20px !important;
    border-radius: 14px !important;
  }

  .tools-callout h2 {
    font-size: 1.25rem !important;
  }

  .tools-callout p {
    font-size: 0.95rem !important;
  }
}

/* ====== Final Breadcrumb Override ======
   Must stay at the end of this file so it overrides legacy inline-template
   breadcrumb CSS loaded earlier in the cascade. */
nav.breadcrumb,
nav[aria-label="Breadcrumb"],
nav[aria-label="Breadcrumbs"],
nav[aria-label="Breadcrumb navigation"],
nav[aria-label="Breadcrumb Navigation"] {
  display: block !important;
  width: 100% !important;
  max-width: 760px !important;
  margin: 0 0 16px 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--imd-text-muted, #6b7280) !important;
  font-size: 0.8125rem !important;
  line-height: 1.45 !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-align: left !important;
}

nav.breadcrumb ol,
nav.breadcrumb ul,
nav[aria-label="Breadcrumb"] ol,
nav[aria-label="Breadcrumb"] ul,
nav[aria-label="Breadcrumbs"] ol,
nav[aria-label="Breadcrumbs"] ul,
nav[aria-label="Breadcrumb navigation"] ol,
nav[aria-label="Breadcrumb navigation"] ul,
nav[aria-label="Breadcrumb Navigation"] ol,
nav[aria-label="Breadcrumb Navigation"] ul {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

nav.breadcrumb li,
nav[aria-label="Breadcrumb"] li,
nav[aria-label="Breadcrumbs"] li,
nav[aria-label="Breadcrumb navigation"] li,
nav[aria-label="Breadcrumb Navigation"] li {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
}

nav.breadcrumb li::before,
nav.breadcrumb li::marker,
nav[aria-label="Breadcrumb"] li::before,
nav[aria-label="Breadcrumb"] li::marker,
nav[aria-label="Breadcrumbs"] li::before,
nav[aria-label="Breadcrumbs"] li::marker,
nav[aria-label="Breadcrumb navigation"] li::before,
nav[aria-label="Breadcrumb navigation"] li::marker,
nav[aria-label="Breadcrumb Navigation"] li::before,
nav[aria-label="Breadcrumb Navigation"] li::marker {
  content: none !important;
}

nav.breadcrumb a,
nav[aria-label="Breadcrumb"] a,
nav[aria-label="Breadcrumbs"] a,
nav[aria-label="Breadcrumb navigation"] a,
nav[aria-label="Breadcrumb Navigation"] a {
  display: inline !important;
  color: var(--imd-text-muted, #6b7280) !important;
  font-size: inherit !important;
  line-height: inherit !important;
  font-weight: inherit !important;
  letter-spacing: inherit !important;
  text-decoration: none !important;
  padding: 0 !important;
  min-height: 0 !important;
}

nav.breadcrumb a:hover,
nav[aria-label="Breadcrumb"] a:hover,
nav[aria-label="Breadcrumbs"] a:hover,
nav[aria-label="Breadcrumb navigation"] a:hover,
nav[aria-label="Breadcrumb Navigation"] a:hover {
  color: var(--imd-text, #111827) !important;
  text-decoration: underline !important;
  background: transparent !important;
}

nav.breadcrumb [aria-current="page"],
nav[aria-label="Breadcrumb"] [aria-current="page"],
nav[aria-label="Breadcrumbs"] [aria-current="page"],
nav[aria-label="Breadcrumb navigation"] [aria-current="page"],
nav[aria-label="Breadcrumb Navigation"] [aria-current="page"] {
  color: var(--imd-text-soft, #4b5563) !important;
  font-size: inherit !important;
  font-weight: 500 !important;
  line-height: inherit !important;
  min-width: 0 !important;
}

@media (max-width: 900px) {
  nav.breadcrumb,
  nav[aria-label="Breadcrumb"],
  nav[aria-label="Breadcrumbs"],
  nav[aria-label="Breadcrumb navigation"],
  nav[aria-label="Breadcrumb Navigation"] {
    max-width: none !important;
    margin-bottom: 14px !important;
    font-size: 0.78rem !important;
  }
}

/* ====== Breadcrumb Wrap Override ======
   Keep long breadcrumb trails small, normal-case, and able to wrap cleanly. */
nav.breadcrumb,
nav[aria-label="Breadcrumb"],
nav[aria-label="Breadcrumbs"],
nav[aria-label="Breadcrumb navigation"],
nav[aria-label="Breadcrumb Navigation"] {
  display: block !important;
  width: 100% !important;
  max-width: 760px !important;
  margin: 0 0 14px 0 !important;
  padding: 0 !important;
  color: var(--imd-text-muted, #6b7280) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

nav.breadcrumb ol,
nav.breadcrumb ul,
nav[aria-label="Breadcrumb"] ol,
nav[aria-label="Breadcrumb"] ul,
nav[aria-label="Breadcrumbs"] ol,
nav[aria-label="Breadcrumbs"] ul,
nav[aria-label="Breadcrumb navigation"] ol,
nav[aria-label="Breadcrumb navigation"] ul,
nav[aria-label="Breadcrumb Navigation"] ol,
nav[aria-label="Breadcrumb Navigation"] ul {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  gap: 4px 6px !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  white-space: normal !important;
}

nav.breadcrumb li,
nav[aria-label="Breadcrumb"] li,
nav[aria-label="Breadcrumbs"] li,
nav[aria-label="Breadcrumb navigation"] li,
nav[aria-label="Breadcrumb Navigation"] li {
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 5px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
  font-weight: inherit !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}

nav.breadcrumb a,
nav[aria-label="Breadcrumb"] a,
nav[aria-label="Breadcrumbs"] a,
nav[aria-label="Breadcrumb navigation"] a,
nav[aria-label="Breadcrumb Navigation"] a,
nav.breadcrumb span,
nav[aria-label="Breadcrumb"] span,
nav[aria-label="Breadcrumbs"] span,
nav[aria-label="Breadcrumb navigation"] span,
nav[aria-label="Breadcrumb Navigation"] span {
  font-size: inherit !important;
  line-height: inherit !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

nav.breadcrumb li[aria-current="page"],
nav[aria-label="Breadcrumb"] li[aria-current="page"],
nav[aria-label="Breadcrumbs"] li[aria-current="page"],
nav[aria-label="Breadcrumb navigation"] li[aria-current="page"],
nav[aria-label="Breadcrumb Navigation"] li[aria-current="page"] {
  display: inline !important;
  flex: 1 1 14rem !important;
  color: var(--imd-text-soft, #4b5563) !important;
  min-width: 8rem !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

@media (max-width: 900px) {
  nav.breadcrumb,
  nav[aria-label="Breadcrumb"],
  nav[aria-label="Breadcrumbs"],
  nav[aria-label="Breadcrumb navigation"],
  nav[aria-label="Breadcrumb Navigation"] {
    max-width: none !important;
    margin-bottom: 12px !important;
    font-size: 11px !important;
  }

  nav.breadcrumb li[aria-current="page"],
  nav[aria-label="Breadcrumb"] li[aria-current="page"],
  nav[aria-label="Breadcrumbs"] li[aria-current="page"],
  nav[aria-label="Breadcrumb navigation"] li[aria-current="page"],
  nav[aria-label="Breadcrumb Navigation"] li[aria-current="page"] {
    flex-basis: 10rem !important;
    min-width: 6rem !important;
  }
}

/* ====== TOC Active State Override ======
   The canonical scrollspy toggles .active on the current article section. */
.toc-sidebar .toc-list a.active,
.toc-sidebar a.toc-link.active,
nav[aria-label="Table of contents"] a.active,
nav[aria-label="Article sections"] a.active {
  color: var(--imd-accent, #0071e3) !important;
  border-left-color: var(--imd-accent, #0071e3) !important;
  background: color-mix(in srgb, var(--imd-accent, #0071e3) 8%, transparent) !important;
  font-weight: 600 !important;
}

/* ====== FAQ Card Override ======
   Normalize accordion cards that come from older article templates. */
.faq-section,
section[aria-labelledby="faq-heading"],
.faq {
  margin: 48px 0 32px !important;
  max-width: 760px !important;
}

.faq-section > h2,
section[aria-labelledby="faq-heading"] > h2,
.faq > h2,
#faq-heading {
  font-size: clamp(1.45rem, 2.2vw, 1.85rem) !important;
  line-height: 1.15 !important;
  letter-spacing: -0.018em !important;
  margin: 0 0 20px !important;
  color: var(--imd-text, #111827) !important;
}

.faq-section .faq-item,
section[aria-labelledby="faq-heading"] .faq-item,
.faq .faq-item {
  background: #fff !important;
  border: 1px solid var(--imd-line, #d2d2d7) !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03) !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.faq-section .faq-item > h3:first-child,
section[aria-labelledby="faq-heading"] .faq-item > h3:first-child,
.faq .faq-item > h3:first-child {
  margin: 0 0 10px !important;
  padding: 22px 24px 0 !important;
  color: var(--imd-text, #111827) !important;
}

.faq-section .faq-item > h3:first-child ~ p,
section[aria-labelledby="faq-heading"] .faq-item > h3:first-child ~ p,
.faq .faq-item > h3:first-child ~ p {
  margin: 0 0 14px !important;
  padding: 0 24px !important;
  max-width: 68ch !important;
  color: var(--imd-text-soft, #374151) !important;
}

.faq-section .faq-item > h3:first-child ~ p:last-child,
section[aria-labelledby="faq-heading"] .faq-item > h3:first-child ~ p:last-child,
.faq .faq-item > h3:first-child ~ p:last-child {
  margin-bottom: 0 !important;
  padding-bottom: 22px !important;
}

.faq-section .faq-question,
section[aria-labelledby="faq-heading"] .faq-question,
.faq .faq-question {
  display: block !important;
  width: 100% !important;
  min-height: 68px !important;
  padding: 20px 64px 20px 24px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 12px !important;
  color: var(--imd-text, #111827) !important;
  cursor: pointer !important;
  font-size: clamp(1rem, 1.35vw, 1.12rem) !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  letter-spacing: -0.01em !important;
  text-align: left !important;
  position: relative !important;
  transition: background-color 0.16s ease, color 0.16s ease !important;
}

.faq-section .faq-question:hover,
section[aria-labelledby="faq-heading"] .faq-question:hover,
.faq .faq-question:hover {
  background: var(--imd-bg-soft, #f5f5f7) !important;
}

.faq-section .faq-question:focus-visible,
section[aria-labelledby="faq-heading"] .faq-question:focus-visible,
.faq .faq-question:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--imd-accent, #0071e3) 55%, transparent) !important;
  outline-offset: -3px !important;
}

.faq-section .faq-question::after,
section[aria-labelledby="faq-heading"] .faq-question::after,
.faq .faq-question::after {
  content: "+" !important;
  position: absolute !important;
  right: 22px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 999px !important;
  display: grid !important;
  place-items: center !important;
  background: color-mix(in srgb, var(--imd-accent, #0071e3) 10%, #fff) !important;
  color: var(--imd-accent, #0071e3) !important;
  font-size: 1.2rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

.faq-section .faq-question[aria-expanded="true"]::after,
section[aria-labelledby="faq-heading"] .faq-question[aria-expanded="true"]::after,
.faq .faq-question[aria-expanded="true"]::after {
  content: "-" !important;
}

.faq-section .faq-answer,
section[aria-labelledby="faq-heading"] .faq-answer,
.faq .faq-answer {
  border-top: 1px solid transparent !important;
}

.faq-section .faq-question[aria-expanded="true"] + .faq-answer,
section[aria-labelledby="faq-heading"] .faq-question[aria-expanded="true"] + .faq-answer,
.faq .faq-question[aria-expanded="true"] + .faq-answer {
  border-top-color: var(--imd-line-soft, #e5e7eb) !important;
}

.faq-section .faq-answer-content,
section[aria-labelledby="faq-heading"] .faq-answer-content,
.faq .faq-answer-content {
  padding: 18px 24px 22px !important;
  color: var(--imd-text-soft, #374151) !important;
  font-size: 1rem !important;
  line-height: 1.65 !important;
}

.faq-section .faq-answer-content p,
section[aria-labelledby="faq-heading"] .faq-answer-content p,
.faq .faq-answer-content p {
  margin: 0 !important;
  max-width: 68ch !important;
  color: inherit !important;
}

@media (max-width: 700px) {
  .faq-section,
  section[aria-labelledby="faq-heading"],
  .faq {
    margin: 36px 0 24px !important;
  }

  .faq-section .faq-question,
  section[aria-labelledby="faq-heading"] .faq-question,
  .faq .faq-question {
    min-height: 60px !important;
    padding: 16px 54px 16px 18px !important;
    font-size: 1rem !important;
  }

  .faq-section .faq-question::after,
  section[aria-labelledby="faq-heading"] .faq-question::after,
  .faq .faq-question::after {
    right: 16px !important;
    width: 26px !important;
    height: 26px !important;
  }

  .faq-section .faq-item > h3:first-child,
  section[aria-labelledby="faq-heading"] .faq-item > h3:first-child,
  .faq .faq-item > h3:first-child {
    padding: 18px 18px 0 !important;
  }

  .faq-section .faq-item > h3:first-child ~ p,
  section[aria-labelledby="faq-heading"] .faq-item > h3:first-child ~ p,
  .faq .faq-item > h3:first-child ~ p {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .faq-section .faq-item > h3:first-child ~ p:last-child,
  section[aria-labelledby="faq-heading"] .faq-item > h3:first-child ~ p:last-child,
  .faq .faq-item > h3:first-child ~ p:last-child {
    padding-bottom: 20px !important;
  }

  .faq-section .faq-answer-content,
  section[aria-labelledby="faq-heading"] .faq-answer-content,
  .faq .faq-answer-content {
    padding: 16px 18px 20px !important;
  }
}