/*
 * Doxa information architecture layer.
 *
 * The visual rule is simple: one product, three jobs.
 * 1. Knowledge: browse sourced, structured content.
 * 2. Learning: follow a deliberate path and make something.
 * 3. Research: inspect, reproduce, and eventually publish.
 *
 * This layer intentionally reduces density and makes the hierarchy visible
 * without changing the existing content model or URLs.
 */
:root {
  --doxa-ia-shell: 1180px;
  --doxa-ia-ink-soft: #454958;
  --doxa-ia-surface: rgba(255, 255, 255, .72);
}

.home-v3 .site-nav {
  min-height: 68px;
  padding-inline: max(24px, calc((100vw - var(--doxa-ia-shell)) / 2));
}

.home-v3 .nav-actions { gap: 7px 22px; }
.home-v3 .nav-link { font-size: .82rem; }
.home-v3 .nav-link.is-active { color: var(--doxa-indigo); }

.home-v3 .home-shell {
  width: min(calc(100% - 48px), var(--doxa-ia-shell));
}

.home-v3 .home-hero-grid {
  min-height: 0;
  padding-block: 82px 86px;
}

.home-v3 .home-hero-copy h1 {
  max-width: 640px;
  font-size: clamp(3rem, 5.4vw, 5rem);
}

.home-v3 .home-hero-lead {
  max-width: 600px;
  color: var(--doxa-ia-ink-soft);
}

/* Make the product model explicit before the user enters a sub-area. */
.home-v3 .doxa-ia-section {
  padding: 72px 0 78px;
  background: #fff;
  border-top: 1px solid var(--home-line);
  border-bottom: 1px solid var(--home-line);
}

.home-v3 .doxa-ia-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
  gap: 64px;
  align-items: end;
  margin-bottom: 30px;
}

.home-v3 .doxa-ia-heading h2 {
  margin: 0;
  color: var(--home-indigo);
  font-size: clamp(1.9rem, 3.6vw, 3rem);
  line-height: 1.25;
}

.home-v3 .doxa-ia-heading p {
  margin: 0;
  color: var(--doxa-gray);
  font-size: .92rem;
  line-height: 1.8;
}

.home-v3 .doxa-ia-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--home-line);
  border-left: 1px solid var(--home-line);
}

.home-v3 .doxa-ia-card {
  display: flex;
  min-height: 238px;
  flex-direction: column;
  padding: 26px 28px 24px;
  color: inherit;
  background: var(--doxa-ia-surface);
  border-right: 1px solid var(--home-line);
  border-bottom: 1px solid var(--home-line);
  text-decoration: none;
  transition: background .2s var(--ease), transform .2s var(--ease);
}

.home-v3 .doxa-ia-card:hover {
  z-index: 1;
  color: inherit;
  background: var(--doxa-paper);
  box-shadow: 0 12px 28px rgba(22, 36, 103, .07);
  transform: translateY(-2px);
}

.home-v3 .doxa-ia-card.is-planned { background: var(--doxa-paper-2); }
.home-v3 .doxa-ia-card.is-planned:hover { transform: none; box-shadow: none; }

.home-v3 .doxa-ia-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 28px;
}

.home-v3 .doxa-ia-index {
  color: var(--doxa-faint);
  font-family: var(--font-mono);
  font-size: .68rem;
}

.home-v3 .doxa-ia-card h3 {
  margin: 0;
  color: var(--home-indigo);
  font-size: 1.4rem;
}

.home-v3 .doxa-ia-card p {
  max-width: 350px;
  margin: 10px 0 0;
  color: var(--doxa-gray);
  font-size: .84rem;
  line-height: 1.75;
}

.home-v3 .doxa-ia-card footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: auto;
  padding-top: 18px;
  color: var(--doxa-faint);
  border-top: 1px solid var(--home-line);
  font-size: .68rem;
}

.home-v3 .doxa-ia-card footer b { color: var(--home-indigo); font-size: 1rem; }

/* The three cards are the only large structural modules on the home page. */
.home-v3 .academy-showcase { padding-top: 82px; }
.home-v3 .latest-section { padding-top: 78px; }
.home-v3 .latest-lead-card h3 { margin-top: 42px; }

@media (max-width: 780px) {
  .home-v3 .site-nav { padding-inline: 16px; }
  .home-v3 .nav-actions {
    min-width: 0;
    max-width: calc(100% - 64px);
    flex: 1 1 auto;
    overflow-x: auto;
    flex-wrap: nowrap;
  }
  .home-v3 .home-shell { width: min(calc(100% - 32px), var(--doxa-ia-shell)); }
  .home-v3 .home-hero-grid { padding-block: 56px 64px; }
  .home-v3 .doxa-ia-section { padding-block: 58px 64px; }
  .home-v3 .doxa-ia-heading { grid-template-columns: 1fr; gap: 16px; }
  .home-v3 .doxa-ia-grid { grid-template-columns: 1fr; }
  .home-v3 .doxa-ia-card { min-height: 0; }
}

@media (max-width: 520px) {
  .home-v3 .home-hero-copy h1 { font-size: clamp(2.7rem, 13vw, 3.4rem); }
  .home-v3 .doxa-ia-card { padding: 22px 20px; }
}

/* Shared nested-page contract: one header rhythm, one secondary-nav tone,
   and no oversized blank hero zones. */
.site-nav { min-height: 64px; }

/* Primary navigation contract: five product-level destinations, in one order.
   The JS normalizer applies this to legacy pages without rewriting their HTML. */
.site-nav[data-doxa-primary-nav="true"] .nav-actions {
  gap: 6px 18px;
  flex-wrap: nowrap;
}

.site-nav[data-doxa-primary-nav="true"] .nav-link {
  flex: 0 0 auto;
  white-space: nowrap;
  padding-inline: 0;
}

.site-nav[data-doxa-primary-nav="true"] .nav-link.is-active {
  color: var(--doxa-indigo);
  font-weight: 650;
}

.site-nav[data-doxa-primary-nav="true"] .nav-link.is-active::after {
  background: var(--doxa-verified);
}

.academy-nav,
.math-subnav,
.ai-boards,
.ac-subnav {
  background: var(--doxa-paper-2) !important;
  color: var(--doxa-indigo) !important;
  border-bottom: 1px solid var(--doxa-line) !important;
  box-shadow: none !important;
}

.academy-nav a,
.ai-boards a,
.ac-subnav a { color: var(--doxa-gray); }

.academy-nav a.is-active,
.ai-boards a.is-active,
.ac-subnav a.is-active {
  color: var(--doxa-paper) !important;
  background: var(--doxa-indigo) !important;
}

.faculty-hero,
.ac-hub-hero,
.course-intro,
.math-hero,
.math-hub-hero {
  padding-top: 48px !important;
  padding-bottom: 42px !important;
}

.faculty-main,
body:has(.ac-hub) .container,
body:has(.math-hub) .container,
body:has(.math-hero) .container {
  padding-top: 42px;
  padding-bottom: 64px;
}

.faculty-hero-inner,
.course-intro-inner { max-width: 860px; }

/* Page rhythm pass: the faculty hero owns spacing through its inner shell.
   Removing the outer padding avoids the duplicated blank band seen on the
   academy overview and faculty landing pages. */
.faculty-page .faculty-hero { padding: 0 !important; }
.faculty-page .faculty-hero-inner { padding: 46px 0 38px !important; }
.faculty-page .faculty-main { padding-top: 34px !important; }

/* Keep the learning entry focused: title, progress, then the start-here
   bridge without a tall decorative void. */
.course-intro-grid { padding-top: 34px !important; padding-bottom: 30px !important; gap: 48px; }
.std-hero { padding-top: 48px !important; padding-bottom: 36px !important; }
.std-main { padding-top: 28px !important; }

@media (max-width: 640px) {
  .site-nav { padding-inline: 16px; }
  .site-nav[data-doxa-primary-nav="true"] .nav-actions {
    max-width: calc(100% - 58px);
    overflow-x: auto;
    justify-content: flex-start;
    scrollbar-width: none;
  }
  .site-nav[data-doxa-primary-nav="true"] .nav-actions::-webkit-scrollbar { display: none; }
  .faculty-hero,
  .ac-hub-hero,
  .course-intro,
  .math-hero,
  .math-hub-hero {
    padding-top: 36px !important;
    padding-bottom: 32px !important;
  }
  .faculty-page .faculty-hero-inner { padding: 36px 0 30px !important; }
  .course-intro-grid { padding-top: 28px !important; padding-bottom: 24px !important; gap: 26px; }
  .std-hero { padding-top: 40px !important; padding-bottom: 30px !important; }
  .std-main { padding-top: 22px !important; }
  .faculty-main,
  body:has(.ac-hub) .container,
  body:has(.math-hub) .container,
  body:has(.math-hero) .container {
    padding-top: 28px;
    padding-bottom: 44px;
  }
}