@font-face {
  font-family: 'Inter';
  src: url('/fonts/inter-latin.woff2') format('woff2');
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
}

@font-face {
  font-family: 'Fira Code';
  src: url('/fonts/fira-code-latin.woff2') format('woff2');
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
}

:root {
  --shell-bg: rgba(6, 6, 15, 0.9);
  --shell-text: #f0f4ff;
  --shell-muted: #9aa7bd;
  --shell-border: rgba(255, 255, 255, 0.1);
  --shell-teal: #5eead4;
  --shell-purple: #c4b5fd;
  --shell-gold: #fbbf24;
  color-scheme: dark;
}

html[data-theme="light"] {
  --bg: #f4fffc;
  --bg-soft: #e8faf6;
  --bg-card: #ffffff;
  --bg-card-hover: #f2fbf8;
  --text: #10202a;
  --text-muted: #526978;
  --muted: #526978;
  --card-bg: rgba(255, 255, 255, 0.86);
  --border: rgba(13, 147, 115, 0.16);
  --border-accent: rgba(13, 147, 115, 0.28);
  --shell-bg: rgba(244, 255, 252, 0.92);
  --shell-text: #10202a;
  --shell-muted: #526978;
  --shell-border: rgba(13, 147, 115, 0.16);
  color-scheme: light;
}

html[data-theme="light"] body {
  background-color: var(--bg) !important;
  color: var(--text) !important;
}

html[data-theme="light"] .press-card,
html[data-theme="light"] .media-kit,
html[data-theme="light"] .speaking-card,
html[data-theme="light"] .card,
html[data-theme="light"] .lecture-card,
html[data-theme="light"] .resource-card,
html[data-theme="light"] .checklist-section,
html[data-theme="light"] pre,
html[data-theme="light"] .code-block {
  background-color: rgba(255, 255, 255, 0.86) !important;
  border-color: var(--border) !important;
}

html[data-theme="light"] article,
html[data-theme="light"] article h1,
html[data-theme="light"] article h2,
html[data-theme="light"] article h3,
html[data-theme="light"] article strong,
html[data-theme="light"] .hero h1,
html[data-theme="light"] .section h2 {
  color: var(--text) !important;
}

html[data-theme="light"] article p,
html[data-theme="light"] article li,
html[data-theme="light"] article blockquote,
html[data-theme="light"] .subtitle,
html[data-theme="light"] .article-date {
  color: var(--muted) !important;
}

.legacy-secondary-nav {
  display: none !important;
}

.stat-number {
  direction: ltr;
  unicode-bidi: isolate;
}

.secondary-shell {
  position: sticky;
  inset-block-start: 0;
  z-index: 9990;
  min-height: 58px;
  border-bottom: 1px solid var(--shell-border);
  background: var(--shell-bg);
  color: var(--shell-text);
  backdrop-filter: blur(16px) saturate(1.25);
  -webkit-backdrop-filter: blur(16px) saturate(1.25);
}

.secondary-shell-inner {
  width: min(1180px, calc(100% - 32px));
  min-height: 58px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 24px;
}

.secondary-shell a {
  text-decoration: none;
}

.secondary-shell-brand {
  color: var(--shell-text);
  font: 800 0.92rem/1.1 Inter, system-ui, sans-serif;
  white-space: nowrap;
}

.secondary-shell-brand span {
  color: var(--shell-teal);
}

.secondary-shell-links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(14px, 2vw, 28px);
}

.secondary-shell-links a,
.secondary-shell-mobile-links a {
  color: var(--shell-muted);
  font: 650 0.78rem/1 Inter, system-ui, sans-serif;
  transition: color 160ms ease;
}

.secondary-shell-links a:hover,
.secondary-shell-links a:focus-visible,
.secondary-shell-mobile-links a:hover,
.secondary-shell-mobile-links a:focus-visible,
.secondary-shell-links a[aria-current="page"] {
  color: var(--shell-link);
}

.secondary-shell-nav-group {
  position: relative;
}

.secondary-shell-submenu-trigger > span {
  margin-inline-start: .12rem;
  font-size: .68em;
  opacity: .72;
}

.secondary-shell-submenu {
  display: none;
  position: absolute;
  inset-block-start: calc(100% - 2px);
  inset-inline-start: 50%;
  z-index: 20;
  width: 270px;
  max-height: min(70vh, 590px);
  padding: .58rem;
  overflow-y: auto;
  transform: translateX(-50%);
  border: 1px solid var(--shell-border);
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgba(94, 234, 212, .08), rgba(168, 85, 247, .08)),
    rgba(9, 9, 26, .97);
  box-shadow: 0 20px 60px rgba(0, 0, 0, .5);
  backdrop-filter: blur(20px);
  overscroll-behavior: contain;
}

.secondary-shell-nav-lectures .secondary-shell-submenu {
  width: 260px;
}

.secondary-shell-nav-group:hover .secondary-shell-submenu,
.secondary-shell-nav-group:focus-within .secondary-shell-submenu {
  display: grid;
}

.secondary-shell-submenu-label {
  padding: .65rem .65rem .32rem;
  color: var(--shell-muted);
  font: 700 .61rem/1.2 'Fira Code', monospace;
  text-transform: uppercase;
}

.secondary-shell-submenu-link {
  --submenu-link: var(--shell-teal);
  --submenu-color: var(--submenu-link);
  min-height: 42px !important;
  display: grid !important;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: center;
  gap: .65rem;
  padding: .42rem .58rem !important;
  border-radius: 9px;
  border-inline-start: 2px solid color-mix(in srgb, var(--submenu-link) 75%, transparent);
  color: var(--submenu-color) !important;
  font-size: .82rem !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  white-space: normal !important;
}

.secondary-shell-submenu-link:hover,
.secondary-shell-submenu-link:focus-visible {
  color: color-mix(in srgb, var(--submenu-link) 94%, #fff) !important;
  background: linear-gradient(135deg, color-mix(in srgb, var(--submenu-link) 18%, transparent), rgba(255, 255, 255, .04)) !important;
  transform: translateX(2px) !important;
}

.secondary-shell-submenu-link img,
.secondary-shell-submenu-icon {
  width: 21px;
  height: 21px;
  display: grid;
  place-items: center;
  object-fit: contain;
  border-radius: 6px;
}

.secondary-shell-submenu-link img {
  padding: 3px;
  background: rgba(255, 255, 255, .92);
}

.secondary-shell-submenu-link.logo-dark img {
  background: rgba(7, 10, 20, .94);
}

.secondary-shell-submenu-all {
  font-weight: 750 !important;
}

.secondary-shell-more { position: relative; }
.secondary-shell-more-menu {
  display: none;
  position: absolute;
  inset: 100% 50% auto auto;
  min-width: 150px;
  padding: .55rem;
  transform: translateX(50%);
  border: 1px solid var(--shell-border);
  border-radius: 8px;
  background: var(--shell-bg);
  box-shadow: 0 18px 48px rgba(0, 0, 0, .3);
}
.secondary-shell-more:hover .secondary-shell-more-menu,
.secondary-shell-more:focus-within .secondary-shell-more-menu { display: grid; }
.secondary-shell-more-menu a { min-height: 40px !important; padding: .7rem !important; }

@media (min-width: 1380px) {
  .secondary-shell-more { display: contents; }
  .secondary-shell-more-trigger { display: none !important; }
  .secondary-shell-more-menu { display: contents; }
  .secondary-shell-more-menu a {
    min-height: 44px !important;
    padding: .5rem .62rem !important;
  }
}

.secondary-shell-controls {
  display: flex;
  align-items: center;
  gap: 8px;
}

.secondary-shell-select,
.secondary-shell-theme,
.secondary-shell-menu > summary {
  min-height: 36px;
  border: 1px solid var(--shell-border);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.045);
  color: var(--shell-text);
  font: 650 0.78rem/1 Inter, system-ui, sans-serif;
}

html[data-theme="light"] .secondary-shell-select,
html[data-theme="light"] .secondary-shell-theme,
html[data-theme="light"] .secondary-shell-menu summary {
  background: rgba(255, 255, 255, 0.78);
}

.secondary-shell-select {
  max-width: 116px;
  padding-inline: 9px;
}

.secondary-shell-theme {
  width: 38px;
  cursor: pointer;
}

.secondary-shell-cta {
  min-height: 38px;
  padding-inline: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(94, 234, 212, .2);
  border-radius: 7px;
  color: #061512;
  background: linear-gradient(135deg, #5eead4, #7dd3fc);
  font: 800 .75rem/1 Inter, system-ui, sans-serif;
  white-space: nowrap;
  box-shadow: 0 8px 22px rgba(94, 234, 212, .12);
}

html[data-theme="light"] .secondary-shell-cta {
  color: #f5fffe;
  border-color: rgba(255, 255, 255, .24);
  background: linear-gradient(135deg, #0b6f67, #315f78);
  box-shadow: 0 8px 22px rgba(20, 82, 88, .16);
}

.secondary-shell-select:focus-visible,
.secondary-shell-theme:focus-visible,
.secondary-shell-menu > summary:focus-visible {
  outline: 2px solid var(--shell-teal);
  outline-offset: 2px;
}

.secondary-shell-menu {
  display: none;
  position: relative;
}

.secondary-shell-menu > summary {
  width: 38px;
  display: grid;
  place-items: center;
  cursor: pointer;
  list-style: none;
}

.secondary-shell-menu > summary::-webkit-details-marker { display: none; }

.secondary-shell-mobile-links {
  position: absolute;
  inset-inline-end: 0;
  inset-block-start: calc(100% + 8px);
  width: min(260px, calc(100vw - 32px));
  padding: 10px;
  display: grid;
  gap: 4px;
  max-height: calc(100vh - 76px);
  overflow-y: auto;
  border: 1px solid var(--shell-border);
  border-radius: 8px;
  background: var(--shell-bg);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.24);
}

.secondary-shell-mobile-links a {
  padding: 11px 10px;
  border-radius: 6px;
}

.secondary-shell-mobile-group summary {
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 10px;
  border-radius: 6px;
  color: var(--shell-muted);
  font: 650 .78rem/1 Inter, system-ui, sans-serif;
  cursor: pointer;
  list-style: none;
}

.secondary-shell-mobile-group summary::-webkit-details-marker { display: none; }
.secondary-shell-mobile-group summary::after { content: '+'; color: var(--shell-link); }
.secondary-shell-mobile-group[open] summary { color: var(--shell-link); }
.secondary-shell-mobile-group[open] summary::after { content: '−'; }

.secondary-shell-mobile-submenu {
  display: grid;
  padding: .25rem 0 .45rem .4rem;
}

[dir="rtl"] .secondary-shell-mobile-submenu {
  padding: .25rem .4rem .45rem 0;
}

.secondary-shell-mobile-submenu .secondary-shell-submenu-label {
  padding-inline-start: .6rem;
}

html[data-theme="light"] .secondary-shell-submenu-link {
  color: color-mix(in srgb, var(--submenu-color) 58%, #17383d) !important;
}

@media (max-width: 1100px) {
  .secondary-shell-inner {
    grid-template-columns: auto 1fr;
    gap: 12px;
  }
  .secondary-shell-links { display: none; }
  .secondary-shell-controls { justify-self: end; }
  .secondary-shell-menu { display: block; }
  .secondary-shell-select { max-width: 100px; }
  .secondary-shell-cta { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .secondary-shell *,
  .secondary-shell *::before,
  .secondary-shell *::after {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}