/* Image3D coordinated-light content pages.
   Source of truth: Figma page 07 · Light Content Pages (2026-08-04). */

:root {
  --i3d-content-canvas: #f5f5f2;
  --i3d-content-surface: #ffffff;
  --i3d-content-ink: #111318;
  --i3d-content-muted: #5f6672;
  --i3d-content-line: #d9dce2;
  --i3d-content-accent: #315ef7;
  --i3d-content-positive: #187a55;
  --i3d-content-viewer: #15171b;
  --i3d-content-max: 1296px;
}

html:has(body.i3d-light-content) {
  color-scheme: light;
  background: var(--i3d-content-canvas);
}

body.i3d-light-content {
  margin: 0;
  overflow-x: hidden;
  color: var(--i3d-content-ink);
  background: var(--i3d-content-canvas);
  font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}

body.i3d-light-content *,
body.i3d-light-content *::before,
body.i3d-light-content *::after { box-sizing: border-box; }

body.i3d-light-content h1,
body.i3d-light-content h2,
body.i3d-light-content h3,
body.i3d-light-content h4 {
  color: var(--i3d-content-ink);
  font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
  letter-spacing: -0.035em;
}

body.i3d-light-content p,
body.i3d-light-content li { color: var(--i3d-content-muted); }
body.i3d-light-content a { text-underline-offset: 3px; }

body.i3d-light-content .text-white,
body.i3d-light-content .text-slate-100,
body.i3d-light-content .text-slate-200 { color: var(--i3d-content-ink) !important; }
body.i3d-light-content .text-slate-300,
body.i3d-light-content .text-slate-400,
body.i3d-light-content .text-slate-500 { color: var(--i3d-content-muted) !important; }
body.i3d-light-content .text-cyan-300,
body.i3d-light-content .text-sky-300,
body.i3d-light-content .text-emerald-300,
body.i3d-light-content .text-teal-200 { color: var(--i3d-content-accent) !important; }

/* Shared header */
.i3d-site-nav {
  position: sticky !important;
  inset: 0 0 auto !important;
  z-index: 50;
  width: 100%;
  border-bottom: 1px solid var(--i3d-content-line) !important;
  background: rgba(255,255,255,.96) !important;
  backdrop-filter: blur(18px);
  box-shadow: none;
}

.i3d-site-nav__inner {
  width: min(var(--i3d-content-max), calc(100% - 40px));
  min-height: 96px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 34px;
}

.i3d-wordmark {
  flex: 0 0 auto;
  color: var(--i3d-content-ink) !important;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -1.1px;
  text-decoration: none;
}
.i3d-wordmark span { color: var(--i3d-content-accent); }

.i3d-site-nav__links {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
}

.i3d-site-nav__links a,
.i3d-site-nav__signin {
  color: var(--i3d-content-muted) !important;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
}
.i3d-site-nav__links a[aria-current="page"],
.i3d-site-nav__links a:hover,
.i3d-site-nav__signin:hover { color: var(--i3d-content-ink) !important; }

.i3d-site-nav__cta,
body.i3d-light-content #navCtaBtn {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 47px;
  padding: 0 20px !important;
  border: 1px solid var(--i3d-content-ink) !important;
  border-radius: 6px !important;
  color: #fff !important;
  background: var(--i3d-content-ink) !important;
  box-shadow: none !important;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
}
.i3d-site-nav__cta:hover { background: #292c33 !important; }

body.i3d-light-content main { padding: 0 !important; }

/* Shared Figma hero */
.i3d-guide-hero {
  width: 100%;
  padding: 84px max(20px, calc((100vw - var(--i3d-content-max)) / 2)) 72px;
  border-bottom: 1px solid var(--i3d-content-line);
  background: var(--i3d-content-surface);
}
.i3d-guide-hero__grid {
  width: 100%;
  max-width: var(--i3d-content-max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 552px) minmax(0, 680px);
  gap: 64px;
  align-items: center;
}
.i3d-guide-hero__copy { min-width: 0; }
.i3d-guide-eyebrow {
  margin: 0 0 22px;
  color: var(--i3d-content-accent) !important;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.i3d-guide-hero h1 {
  max-width: 552px;
  margin: 0;
  font-size: clamp(48px, 4.35vw, 62px);
  line-height: 1.08;
  letter-spacing: -.052em;
}
.i3d-guide-lede {
  max-width: 520px;
  margin: 26px 0 0;
  color: var(--i3d-content-muted) !important;
  font-size: 19px;
  line-height: 1.52;
}
.i3d-guide-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}
.i3d-guide-button {
  display: inline-flex;
  min-height: 47px;
  align-items: center;
  justify-content: center;
  padding: 0 20px;
  border: 1px solid var(--i3d-content-line);
  border-radius: 6px;
  color: var(--i3d-content-ink) !important;
  background: var(--i3d-content-surface);
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
}
.i3d-guide-button--primary {
  border-color: var(--i3d-content-ink);
  color: #fff !important;
  background: var(--i3d-content-ink);
}
.i3d-guide-truths {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
}
.i3d-guide-truths li {
  color: var(--i3d-content-muted);
  font-size: 13px;
  font-weight: 650;
}

.i3d-evidence-viewer {
  min-width: 0;
  margin: 0;
  padding: 18px;
  border-radius: 10px;
  color: #fff;
  background: var(--i3d-content-viewer);
  overflow: hidden;
}
.i3d-evidence-viewer__head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 14px;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .02em;
}
.i3d-evidence-viewer__head span:last-child { color: #6d88ff; }
.i3d-evidence-viewer__pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.i3d-evidence-viewer__media {
  width: 100%;
  height: 430px;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
}
.i3d-evidence-viewer__media img,
.i3d-evidence-viewer__media model-viewer {
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: contain;
  display: block;
  background: #fff;
  --poster-color: #071426;
}
.i3d-evidence-viewer__media--dark,
.i3d-evidence-viewer__media--dark img,
.i3d-evidence-viewer__media--dark model-viewer { background: #071426; }
.i3d-evidence-viewer figcaption {
  margin-top: 14px;
  color: #eef0f4 !important;
  font-size: 13px;
  line-height: 1.45;
}

.i3d-direct-answer {
  width: 100%;
  padding: 42px max(20px, calc((100vw - var(--i3d-content-max)) / 2));
  border-bottom: 1px solid var(--i3d-content-line);
  background: var(--i3d-content-surface);
}
.i3d-direct-answer__inner {
  max-width: var(--i3d-content-max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 180px minmax(0, 980px);
  gap: 72px;
  align-items: center;
}
.i3d-direct-answer__label {
  color: var(--i3d-content-accent) !important;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .06em;
}
.i3d-direct-answer__text {
  margin: 0;
  color: var(--i3d-content-ink) !important;
  font-size: 23px;
  font-weight: 700;
  line-height: 1.42;
}

/* Blender route: reuse the existing semantic article and real model-viewer. */
.i3d-blender-page .hero-shell {
  padding: 84px max(20px, calc((100vw - var(--i3d-content-max)) / 2)) 72px !important;
  border-bottom: 1px solid var(--i3d-content-line) !important;
  background: var(--i3d-content-surface) !important;
}
.i3d-blender-page .hero-shell > div {
  max-width: var(--i3d-content-max) !important;
  display: grid;
  grid-template-columns: minmax(0, 552px) minmax(0, 680px);
  gap: 64px;
  align-items: center;
}
.i3d-blender-page .hero-shell h1 {
  margin: 0;
  color: var(--i3d-content-ink) !important;
  font-size: clamp(48px, 4.35vw, 62px);
  line-height: 1.08;
  letter-spacing: -.052em;
}
.i3d-blender-page .hero-shell .hero-copy {
  max-width: 520px;
  color: var(--i3d-content-muted) !important;
  font-size: 19px;
  line-height: 1.52;
}
.i3d-blender-page .hero-shell figure { margin: 0 !important; }
.i3d-blender-page .case-grid { gap: 12px; padding: 0; background: transparent; }
.i3d-blender-page .article-card,
.i3d-blender-page .answer-card,
.i3d-blender-page .toc-card,
.i3d-blender-page .mini-card {
  border: 1px solid var(--i3d-content-line) !important;
  border-radius: 8px !important;
  color: var(--i3d-content-ink);
  background: var(--i3d-content-surface) !important;
  box-shadow: none !important;
}
.i3d-blender-page .hero-shell .article-card {
  padding: 18px;
  border: 0 !important;
  border-radius: 10px !important;
  background: var(--i3d-content-viewer) !important;
}
.i3d-blender-page .case-panel { min-height: 0; background: transparent; }
.i3d-blender-page .case-panel-head {
  padding: 0 0 12px;
  border: 0;
  color: #fff;
}
.i3d-blender-page .case-panel-head span:last-child { color: #6d88ff; }
.i3d-blender-page .case-image-wrap,
.i3d-blender-page model-viewer { min-height: 430px; border-radius: 8px; }
.i3d-blender-page .case-image-wrap { padding: 0; background: #fff; }
.i3d-blender-page model-viewer { background: #071426; --poster-color: #071426; }
.i3d-blender-page .hero-shell figcaption { color: #eef0f4 !important; }
.i3d-blender-page > main > article {
  max-width: var(--i3d-content-max) !important;
  padding: 64px 20px 88px !important;
  color: var(--i3d-content-ink);
}
.i3d-blender-page .answer-card {
  padding: 32px !important;
  border-left: 4px solid var(--i3d-content-accent) !important;
}
.i3d-blender-page .answer-card p,
.i3d-blender-page .answer-card strong,
.i3d-blender-page .toc-card p,
.i3d-blender-page .mini-card h3 { color: var(--i3d-content-ink) !important; }
.i3d-blender-page .prose-lite h2,
.i3d-blender-page .prose-lite h3 { color: var(--i3d-content-ink) !important; }
.i3d-blender-page .prose-lite p,
.i3d-blender-page .prose-lite li,
.i3d-blender-page .mini-card p { color: var(--i3d-content-muted) !important; }
.i3d-blender-page .prose-lite a,
.i3d-blender-page .toc-card a,
.i3d-blender-page .related-link { color: var(--i3d-content-accent) !important; }
.i3d-blender-page .toc-card,
.i3d-blender-page .prose-lite > section { padding: 28px; margin: 0 0 24px; }
.i3d-blender-page .prose-lite > section:nth-child(odd) { background: rgba(245,245,242,.8); }
.i3d-blender-page .decision-strip div {
  border-color: var(--i3d-content-line);
  border-radius: 8px;
  background: var(--i3d-content-surface);
}
.i3d-blender-page .decision-strip strong { color: var(--i3d-content-ink); }
.i3d-blender-page .decision-strip span { color: var(--i3d-content-muted); }
.i3d-blender-page table,
.i3d-blender-page th,
.i3d-blender-page td { border-color: var(--i3d-content-line) !important; }
.i3d-blender-page th { color: var(--i3d-content-ink) !important; }
.i3d-blender-page td { color: var(--i3d-content-muted) !important; }

/* Bambu route: keep all SEO depth but express it in the approved light system. */
.i3d-bambu-page main > section:not(.i3d-guide-hero):not(.i3d-direct-answer) {
  width: 100%;
  max-width: none !important;
  margin: 0 !important;
  padding: 72px max(20px, calc((100vw - var(--i3d-content-max)) / 2)) !important;
  border-color: var(--i3d-content-line) !important;
}
.i3d-bambu-page main > section:not(.i3d-guide-hero):not(.i3d-direct-answer):nth-of-type(even) { background: var(--i3d-content-canvas) !important; }
.i3d-bambu-page main > section:not(.i3d-guide-hero):not(.i3d-direct-answer):nth-of-type(odd) { background: var(--i3d-content-surface) !important; }
.i3d-bambu-page main > section > div { max-width: var(--i3d-content-max) !important; margin-left: auto !important; margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; }
.i3d-bambu-page .hero::before { display: none; }
.i3d-bambu-page .band { border-color: var(--i3d-content-line) !important; }
.i3d-bambu-page .panel,
.i3d-bambu-page .card,
.i3d-bambu-page .example,
.i3d-bambu-page .faq,
.i3d-bambu-page .table-wrap {
  border: 1px solid var(--i3d-content-line) !important;
  border-radius: 8px !important;
  color: var(--i3d-content-ink);
  background: var(--i3d-content-surface) !important;
  box-shadow: none !important;
}
.i3d-bambu-page .card h2,
.i3d-bambu-page .card h3,
.i3d-bambu-page .example h3,
.i3d-bambu-page .faq h3 { color: var(--i3d-content-ink) !important; }
.i3d-bambu-page .card p,
.i3d-bambu-page .card li,
.i3d-bambu-page .example p,
.i3d-bambu-page .faq p { color: var(--i3d-content-muted) !important; }
.i3d-bambu-page .pill {
  border-color: var(--i3d-content-line) !important;
  border-radius: 6px !important;
  color: var(--i3d-content-ink) !important;
  background: var(--i3d-content-surface) !important;
}
.i3d-bambu-page .example img { object-fit: contain; background: #eef0ed; }
.i3d-bambu-page table { color: var(--i3d-content-ink); }
.i3d-bambu-page th {
  color: var(--i3d-content-ink) !important;
  border-color: var(--i3d-content-line) !important;
  background: #f0f2ed !important;
}
.i3d-bambu-page td { color: var(--i3d-content-muted) !important; border-color: var(--i3d-content-line) !important; }
.i3d-bambu-page footer {
  margin: 0 !important;
  border-color: #2f333b !important;
  color: #eef0f4;
  background: var(--i3d-content-viewer);
}
.i3d-bambu-page footer p,
.i3d-bambu-page footer a { color: #eef0f4 !important; }

@media (max-width: 900px) {
  .i3d-site-nav__inner { min-height: 72px; }
  .i3d-site-nav__links,
  .i3d-site-nav__signin { display: none; }
  .i3d-site-nav__cta { margin-left: auto; min-height: 40px; padding: 0 14px !important; font-size: 14px; }
  .i3d-guide-hero { padding-top: 52px; padding-bottom: 44px; }
  .i3d-guide-hero__grid,
  .i3d-blender-page .hero-shell > div { grid-template-columns: minmax(0, 1fr); gap: 30px; }
  .i3d-guide-hero h1,
  .i3d-blender-page .hero-shell h1 { font-size: clamp(40px, 11vw, 48px); }
  .i3d-guide-lede,
  .i3d-blender-page .hero-shell .hero-copy { font-size: 17px; }
  .i3d-direct-answer { padding-top: 32px; padding-bottom: 32px; }
  .i3d-direct-answer__inner { grid-template-columns: 1fr; gap: 12px; }
  .i3d-direct-answer__text { font-size: 19px; }
  .i3d-blender-page .hero-shell { padding-top: 52px !important; padding-bottom: 44px !important; }
  .i3d-blender-page .hero-shell > div { display: grid; }
  .i3d-blender-page .case-image-wrap,
  .i3d-blender-page model-viewer,
  .i3d-evidence-viewer__media { min-height: 0; height: 260px; }
  .i3d-blender-page > main > article { display: block !important; padding-top: 40px !important; }
  .i3d-blender-page aside { margin-top: 32px; }
}

@media (max-width: 560px) {
  .i3d-site-nav__inner { width: calc(100% - 40px); }
  .i3d-wordmark { font-size: 21px; }
  .i3d-guide-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .i3d-guide-button { padding: 0 12px; font-size: 13px; }
  .i3d-guide-truths { display: grid; }
  .i3d-evidence-viewer { padding: 12px; }
  .i3d-evidence-viewer__head { font-size: 12px; }
  .i3d-evidence-viewer__pair { gap: 8px; }
  .i3d-evidence-viewer__media { height: 210px; }
  .i3d-blender-page .case-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .i3d-blender-page .case-panel-head { font-size: 10px; }
  .i3d-blender-page .case-image-wrap,
  .i3d-blender-page model-viewer { height: 210px; min-height: 210px; }
  .i3d-blender-page .toc-card,
  .i3d-blender-page .prose-lite > section { padding: 20px; }
  .i3d-bambu-page main > section:not(.i3d-guide-hero):not(.i3d-direct-answer) { padding-top: 44px !important; padding-bottom: 44px !important; }
}