/* Human Design Engine staging light theme bridge
   Applies the cream/sage source-of-truth palette to legacy static library pages
   copied from docs/ into the Astro/Cloudflare build. */
:root {
  --navy-deep: #FAF7F0 !important;
  --navy: #FDFBF7 !important;
  --navy-mid: #F6F1E7 !important;
  --navy-light: #FFFFFF !important;
  --navy-lighter: #E7E1D6 !important;
  --gold: #5F7261 !important;
  --gold-light: #738675 !important;
  --gold-bright: #2F3631 !important;
  --gold-soft: rgba(95, 114, 97, 0.10) !important;
  --gold-glow: rgba(95, 114, 97, 0.08) !important;
  --text-primary: #2F3631 !important;
  --text-secondary: #5C625E !important;
  --text-muted: #4B514E !important;
  --white: #FFFFFF !important;
  --card-bg: rgba(255, 255, 255, 0.76) !important;
  --card-border: rgba(95, 114, 97, 0.15) !important;
  --shadow: 0 8px 30px rgba(47, 54, 49, 0.05) !important;
}

html,
body {
  background: #FAF7F0 !important;
  color: #2F3631 !important;
  font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif !important;
}

body::before {
  background:
    radial-gradient(ellipse at 15% 5%, rgba(95, 114, 97, 0.10) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 90%, rgba(199, 191, 181, 0.20) 0%, transparent 55%),
    linear-gradient(180deg, #FAF7F0 0%, #FDFBF7 100%) !important;
}

nav,
.site-nav,
.navbar {
  background: rgba(253, 251, 247, 0.88) !important;
  border-bottom: 1px solid rgba(95, 114, 97, 0.14) !important;
  box-shadow: 0 8px 30px rgba(47, 54, 49, 0.04) !important;
}

.nav-logo,
.nav-links a,
.breadcrumb,
.breadcrumb a,
a {
  color: #2F3631 !important;
}

footer a,
.footer a,
.site-footer a {
  color: #2F3631 !important;
  text-decoration: underline !important;
  text-underline-offset: 0.18em !important;
}

.breadcrumb a,
main p a,
main li a,
.card p a,
.content-card a {
  color: #2F3631 !important;
  text-decoration: underline !important;
  text-decoration-thickness: 0.08em !important;
  text-underline-offset: 0.18em !important;
}

.nav-logo .icon,
.btn-primary,
.btn,
button[type="submit"],
.cta-button,
.step-num {
  background: #2F3631 !important;
  color: #FAF7F0 !important;
  border-color: #2F3631 !important;
  box-shadow: 0 10px 26px rgba(47, 54, 49, 0.12) !important;
}

.btn-secondary,
.cta-link,
.breadcrumb a,
.nav-links a:hover {
  color: #5F7261 !important;
  border-color: rgba(95, 114, 97, 0.35) !important;
}

.card,
.gate-card,
.channel-card,
.type-card,
.authority-card,
.center-card,
.profile-card,
.info-card,
.content-card,
.report-card,
.stat,
.email-gate,
.cta-box,
.aeo-quick-answer,
.quick-answer,
.free-preview,
[class*="card"] {
  background: rgba(255, 255, 255, 0.76) !important;
  border-color: rgba(95, 114, 97, 0.15) !important;
  color: #2F3631 !important;
  box-shadow: 0 8px 30px rgba(47, 54, 49, 0.05) !important;
}

h1,
h2,
h3,
h4,
.stat-number,
.gate-number,
.gate-title,
.card h2,
.card h3 {
  color: #2F3631 !important;
  background: none !important;
  -webkit-text-fill-color: #2F3631 !important;
  font-family: 'Playfair Display', Georgia, serif;
}

p,
li,
.subtitle,
.lede,
.card p,
.stat-label,
.stat-value,
.meta,
.description {
  color: #5C625E !important;
}

input,
select,
textarea {
  background: #FDFBF7 !important;
  border-color: rgba(95, 114, 97, 0.22) !important;
  color: #2F3631 !important;
}

input:focus,
select:focus,
textarea:focus {
  border-color: #5F7261 !important;
  box-shadow: 0 0 0 3px rgba(95, 114, 97, 0.14) !important;
}

.type-badge,
.tag,
.badge,
.pill,
.circuit-nav a,
.center-badge {
  background: rgba(95, 114, 97, 0.10) !important;
  border-color: rgba(95, 114, 97, 0.18) !important;
  color: #2F3631 !important;
}

hr,
.divider,
.section-divider {
  border-color: rgba(95, 114, 97, 0.14) !important;
}

footer {
  background: #F6F1E7 !important;
  color: #5C625E !important;
  border-top: 1px solid rgba(95, 114, 97, 0.14) !important;
}

.btn-secondary,
a.btn-secondary,
.hero-ctas .btn-secondary {
  background: rgba(255, 255, 255, 0.72) !important;
  color: #2F3631 !important;
  border: 1px solid rgba(95, 114, 97, 0.35) !important;
}

.eyebrow,
.stat-label,
.meta,
.footer,
footer,
footer p,
footer li {
  color: #4B514E !important;
}

.hde-w-1-form-group span,
[class*="hde-w-"] span[style*="font-size:0.7rem"],
small,
.privacy,
.fine-print {
  color: #4B514E !important;
}

.footer-logo,
footer .footer-logo,
footer strong,
footer h2,
footer h3,
footer h4 {
  color: #2F3631 !important;
  -webkit-text-fill-color: #2F3631 !important;
}

.footer-copy,
footer .footer-copy,
footer [class*="copy"],
footer [class*="muted"] {
  color: #4B514E !important;
}

/* PWP/emdash standard shell for Astro pages and normalized legacy HTML. */
.emdash-site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 100 !important;
  background: rgba(250, 247, 240, 0.92) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border-bottom: 1px solid rgba(95, 114, 97, 0.15) !important;
  padding: 0 24px !important;
}
.emdash-site-header .nav-inner {
  max-width: 1200px !important;
  margin: 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  height: 72px !important;
}
.emdash-site-header .nav-logo,
.emdash-site-header .nav-logo-text {
  display: flex !important;
  align-items: center !important;
  text-decoration: none !important;
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: 1.45rem !important;
  font-weight: 700 !important;
  color: #2F3631 !important;
  letter-spacing: -0.01em !important;
}
.emdash-site-header .nav-logo-text span {
  font-style: italic !important;
  font-weight: 400 !important;
  color: #5F7261 !important;
  margin-left: 5px !important;
}
.emdash-site-header nav {
  position: static !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  backdrop-filter: none !important;
}
.emdash-site-header .nav-links {
  display: flex !important;
  gap: 36px !important;
  list-style: none !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
}
.emdash-site-header .nav-links a {
  color: #5C625E !important;
  text-decoration: none !important;
  font-weight: 500 !important;
  font-size: 0.95rem !important;
  border-bottom: 2px solid transparent !important;
}
.emdash-site-header .nav-links a:hover {
  color: #2F3631 !important;
  border-bottom-color: #8E9E90 !important;
}
.emdash-site-header .nav-cta {
  background: #2F3631 !important;
  color: #FAF7F0 !important;
  padding: 10px 22px !important;
  border-radius: 30px !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  text-decoration: none !important;
  border: 1px solid transparent !important;
}
.emdash-site-header .menu-toggle {
  display: none !important;
  background: none !important;
  border: 0 !important;
  cursor: pointer !important;
  padding: 8px !important;
}
.emdash-site-header .menu-toggle svg {
  width: 24px !important;
  height: 24px !important;
  stroke: #2F3631 !important;
}
.emdash-site-footer {
  background: #F6F1E7 !important;
  color: #4B514E !important;
  padding: 60px 24px !important;
  border-top: 1px solid rgba(95, 114, 97, 0.14) !important;
}
.emdash-site-footer .footer-inner {
  max-width: 1200px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 0.8fr 2fr !important;
  align-items: start !important;
  gap: 36px !important;
}
.emdash-site-footer .footer-logo {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: 1.3rem !important;
  font-weight: 700 !important;
  color: #2F3631 !important;
}
.emdash-site-footer .footer-groups {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 28px !important;
}
.emdash-site-footer .footer-group h2 {
  color: #2F3631 !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  margin: 0 0 14px !important;
}
.emdash-site-footer .footer-group ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  gap: 10px !important;
}
.emdash-site-footer .footer-group a {
  color: #2F3631 !important;
  text-decoration: underline !important;
  text-underline-offset: 0.18em !important;
  font-size: 0.9rem !important;
}
.emdash-site-footer .footer-copy {
  grid-column: 1 / -1 !important;
  font-size: 0.85rem !important;
  color: #4B514E !important;
}
@media (max-width: 868px) {
  .emdash-site-header .menu-toggle { display: block !important; }
  .emdash-site-header nav {
    position: fixed !important;
    top: 72px !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    min-height: calc(100dvh - 72px) !important;
    background: #FAF7F0 !important;
    background-color: #FAF7F0 !important;
    background-image: linear-gradient(180deg, #FAF7F0 0%, #F6F1E7 100%) !important;
    border-top: 1px solid rgba(95, 114, 97, 0.14) !important;
    box-shadow: 0 24px 80px rgba(47, 54, 49, 0.18) !important;
    padding: 40px 24px !important;
    opacity: 0 !important;
    visibility: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    z-index: 105 !important;
  }
  body.drawer-open::before {
    content: '' !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 99 !important;
    background: linear-gradient(180deg, #FAF7F0 0%, #F6F1E7 100%) !important;
    opacity: 1 !important;
    pointer-events: none !important;
  }
  body.drawer-open .emdash-site-header nav {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
  .emdash-site-header .nav-links {
    flex-direction: column !important;
    gap: 24px !important;
    width: 100% !important;
    text-align: center !important;
  }
  .emdash-site-header .nav-links a {
    font-size: 1.25rem !important;
    color: #2F3631 !important;
    -webkit-text-fill-color: #2F3631 !important;
  }
  .emdash-site-header .nav-cta { display: none !important; }
  .emdash-site-footer .footer-inner,
  .emdash-site-footer .footer-groups { grid-template-columns: 1fr !important; }
}

/* Follow-up visual fixes for HDE library and tools pages. */
.emdash-site-footer,
.emdash-site-footer *,
footer.emdash-site-footer,
footer.emdash-site-footer * {
  text-align: left !important;
}
.emdash-site-footer .footer-inner {
  justify-items: start !important;
}
.breadcrumb,
.breadcrumbs,
.page-subnav,
.subnav,
.type-subnav,
.type-nav,
.container > nav.nav {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 1200px !important;
  margin: 24px auto 28px !important;
  padding: 12px 0 !important;
  text-align: left !important;
  color: #4B514E !important;
}
.page-subnav,
.subnav,
.type-subnav,
.type-nav,
.container > nav.nav {
  padding: 14px 16px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  border: 1px solid rgba(95, 114, 97, 0.14) !important;
  border-radius: 18px !important;
  box-shadow: 0 8px 30px rgba(47, 54, 49, 0.04) !important;
}
.breadcrumb a,
.breadcrumbs a,
.page-subnav a,
.subnav a,
.type-subnav a,
.type-nav a,
.container > nav.nav a {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 34px !important;
  padding: 7px 12px !important;
  border-radius: 999px !important;
  background: rgba(95, 114, 97, 0.10) !important;
  border: 1px solid rgba(95, 114, 97, 0.16) !important;
  color: #2F3631 !important;
  text-decoration: none !important;
  font-weight: 600 !important;
}
.question-card,
.quiz-card,
.result-card,
.email-capture {
  background: rgba(255, 255, 255, 0.86) !important;
  color: #2F3631 !important;
}
.question-text,
.question-card .question-text,
.quiz-container .question-text,
.quiz-header h1,
.quiz-header h1 span,
.quiz-badge {
  color: #2F3631 !important;
  -webkit-text-fill-color: #2F3631 !important;
}
.quiz-header p,
.quiz-container p,
.quiz-container .progress-text {
  color: #4B514E !important;
}
.option-btn,
.quiz-container .option-btn {
  background: #FFFFFF !important;
  border-color: rgba(95, 114, 97, 0.24) !important;
  color: #2F3631 !important;
}
.option-btn:hover,
.quiz-container .option-btn:hover {
  background: #F6F1E7 !important;
  border-color: rgba(95, 114, 97, 0.42) !important;
}
.option-btn .opt-icon {
  background: rgba(95, 114, 97, 0.14) !important;
  color: #2F3631 !important;
}
.quiz-footer a,
.quiz-footer p a,
.quiz-container .quiz-footer a {
  color: #2F3631 !important;
  text-decoration: underline !important;
  text-decoration-thickness: 0.09em !important;
  text-underline-offset: 0.18em !important;
}

strong,
.metric strong,
.hero-card strong,
.statistical-density-section strong {
  color: #2F3631 !important;
  -webkit-text-fill-color: #2F3631 !important;
}

.method-get,
.method-post,
.endpoint-method,
.hero-badge,
.verified-tag {
  color: #2F3631 !important;
  background: rgba(95, 114, 97, 0.14) !important;
  border-color: rgba(95, 114, 97, 0.24) !important;
}
.code-block {
  outline-offset: 4px;
}

.statistical-density-section,
section.statistical-density-section,
[style*="rgba(15, 29, 54"] {
  background: rgba(255, 255, 255, 0.76) !important;
  background-color: rgba(255, 255, 255, 0.76) !important;
  border-color: rgba(95, 114, 97, 0.15) !important;
}

.statistical-density-section p,
.statistical-density-section li,
.statistical-density-section td,
.statistical-density-section th,
.statistical-density-section span,
[style*="color: #8899aa"] {
  color: #4B514E !important;
}

[style*="#738675"],
[style*="color: #738675"],
[style*="color:#738675"] {
  color: #4B514E !important;
}

.highlight,
.gate-content .highlight,
.channel-content .highlight,
.type-content .highlight,
.authority-content .highlight {
  color: #4B514E !important;
}

.channel-hero,
.type-hero,
.authority-hero,
.profile-hero,
.center-hero,
.gate-hero {
  background: rgba(255, 255, 255, 0.76) !important;
  border-color: rgba(95, 114, 97, 0.15) !important;
}

.channel-hero *,
.type-hero *,
.authority-hero *,
.profile-hero *,
.center-hero *,
.gate-hero * {
  color: #2F3631 !important;
  -webkit-text-fill-color: #2F3631 !important;
}

thead tr,
tr[style*="#0f1d36"],
tr[style*="background-color: #0f1d36"] {
  background: #F6F1E7 !important;
  background-color: #F6F1E7 !important;
  color: #2F3631 !important;
}

thead th,
th[style],
td[style] {
  color: #2F3631 !important;
  border-color: rgba(95, 114, 97, 0.18) !important;
}

table,
table[style],
[style*="rgba(10, 22, 40"] {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  color: #2F3631 !important;
  border-color: rgba(95, 114, 97, 0.18) !important;
}

.authority-tag,
.authority-content .authority-tag {
  color: #2F3631 !important;
  background: rgba(255, 255, 255, 0.76) !important;
  border-color: rgba(95, 114, 97, 0.18) !important;
}

/* aeo contrast marker */
.aeo-label,
.quick-answer-label,
[class*="quick"] .label {
  color: #2F3631 !important;
  -webkit-text-fill-color: #2F3631 !important;
}

/* profile tag contrast */
.profile-tag,
.profile-content .profile-tag,
[class*="profile"] [class*="tag"] {
  color: #2F3631 !important;
  -webkit-text-fill-color: #2F3631 !important;
  background: rgba(255,255,255,0.76) !important;
  border-color: rgba(95,114,97,0.20) !important;
}