.imaginie-page { color: var(--ink); font-family: var(--body); }
.imaginie-container { width: min(1240px, calc(100% - 112px)); margin: 0 auto; }
.imaginie-hero__copy,
.imaginie-context__split,
.imaginie-audience-grid,
.imaginie-section-intro,
.imaginie-research__grid,
.imaginie-visual-pair { width: min(1177.6px, 100%); }
.imaginie-section { position: relative; padding: 128px 0 129px; border-bottom: var(--border-width-thin) solid var(--color-stroke-subtle); }
.imaginie-hero { min-height: 656px; padding-top: 89.6px; padding-bottom: 0; border-bottom: 0; }
.imaginie-hero__copy { max-width: 1177.6px; }
.imaginie-eyebrow, .imaginie-section-label, .imaginie-summary dt, .imaginie-audience small, .imaginie-research-list small, .imaginie-product-meta, .imaginie-figure figcaption, .imaginie-product-figure figcaption { color: var(--muted); font-family: var(--mono); font-size: var(--type-size-caption); font-weight: 400; letter-spacing: var(--type-letterspacing-label); line-height: var(--type-lineheight-label); text-transform: uppercase; }
.imaginie-eyebrow { margin: 0; color: var(--violet-text); }
.imaginie-hero h1 { max-width: 1040px; margin: 32px 0 0; font-family: var(--display); font-size: clamp(3.5rem, 6vw, 5rem); font-weight: 800; line-height: 73px; letter-spacing: -2.4px; }
.imaginie-lede { max-width: 860px; margin: 32px 0 0; color: var(--muted); font-family: var(--display); font-size: var(--type-size-h2); font-weight: 600; line-height: var(--type-lineheight-h2); }
.imaginie-tags { display: flex; flex-wrap: wrap; gap: var(--spacing-8); margin: 40px 0 0; padding: 0; list-style: none; }
.imaginie-tags .tag { height: 30px; }
.imaginie-summary-section { background: var(--canvas); }
.imaginie-summary { width: min(1240px, calc(100% - 112px)); min-height: 236px; margin: 0 auto; padding: 48px; }
.imaginie-summary__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; height: 140px; margin: 0; }
.imaginie-summary__grid > div { display: flex; min-width: 0; flex-direction: column; gap: 10px; padding: 20px; border: var(--border-width-thin) solid var(--color-stroke-subtle); border-radius: var(--radius-md); }
.imaginie-summary dd { max-width: 250px; margin: 0; padding-top: 8px; color: var(--ink); font-family: var(--body); font-size: 14px; font-weight: 300; line-height: 24px; }
.imaginie-context, .imaginie-validation { background: var(--color-background-secondary); }
.imaginie-section-label { display: flex; align-items: center; gap: 16px; width: 100%; margin: 0; color: var(--violet-text); }
.imaginie-research .imaginie-section-label::after,
.imaginie-journey .imaginie-section-label::after { height: var(--border-width-thin); flex: 1; content: ""; background: var(--color-stroke-subtle); }
.imaginie-context__split, .imaginie-validation__intro { display: grid; grid-template-columns: 465.55px 596.86px; gap: 115.2px; align-items: start; margin-top: 12px; }
.imaginie-validation__intro { width: 100%; }
.imaginie-page h2 { max-width: 1040px; margin: 0; font-family: var(--display); font-size: clamp(2.5rem, 4vw, 3rem); font-weight: 800; line-height: 56px; letter-spacing: 0; }
.imaginie-context h2 { max-width: 465.55px; font-size: 52px; letter-spacing: -1.04px; }
.imaginie-prose { display: grid; gap: 63.6px; color: var(--muted); font-size: var(--type-size-body); font-weight: 300; line-height: var(--type-lineheight-body); }
.imaginie-prose p, .imaginie-section-intro > p:last-child, .imaginie-validation__note p, .imaginie-product-copy > p:not(.imaginie-section-label) { margin: 0; }
.imaginie-audience-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 64px; }
.imaginie-audience { min-height: 264px; padding: 28px 24px; border: var(--border-width-thin) solid var(--color-stroke-subtle); border-top: 4px solid var(--color-accent-teal); border-radius: var(--radius-lg); background: var(--canvas); }
.imaginie-audience--teacher { border-top-color: var(--pink-500); }
.imaginie-audience > span { color: var(--color-accent-teal-text); font-family: var(--mono); font-size: var(--type-size-caption); }
.imaginie-audience--teacher > span { color: var(--pink-700); }
.imaginie-audience h3 { margin: 28px 0 0; font-family: var(--display); font-size: var(--type-size-h2); font-weight: 600; line-height: var(--type-lineheight-h2); }
.imaginie-audience p { max-width: 410px; margin: 12px 0 0; color: var(--muted); font-size: var(--type-size-body); font-weight: 300; line-height: var(--type-lineheight-body); }
.imaginie-audience small { display: block; margin-top: 40px; font-size: var(--type-size-label); }
.imaginie-section-intro { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.imaginie-section-intro h2 { max-width: 1040px; }
.imaginie-section-intro > p:last-child { max-width: 880px; color: var(--muted); font-size: var(--type-size-body); font-weight: 300; line-height: var(--type-lineheight-body); }
.imaginie-research { min-height: 1083.36px; }
.imaginie-research__grid { display: grid; grid-template-columns: 660.48px 440.32px; gap: 76.8px; align-items: start; margin-top: 64px; }
.imaginie-figure { overflow: hidden; margin: 0; border: var(--border-width-thin) solid var(--color-stroke-subtle); border-radius: var(--radius-md); background: var(--color-button-primary-text); box-shadow: 0 16px 42px rgba(26,24,38,.08); }
.imaginie-figure img { display: block; width: 100%; height: auto; }
.imaginie-figure--photo img { height: 493.86px; object-fit: cover; }
.imaginie-figure figcaption { display: flex; gap: 8px; min-height: 40.5px; align-items: center; padding: 12px; color: var(--color-text-tertiary); font-size: var(--type-size-label); letter-spacing: var(--type-letterspacing-label); white-space: nowrap; }
.imaginie-figure figcaption span { color: var(--violet-text); }
.imaginie-research-list { display: flex; flex-direction: column; gap: 0; min-height: 333px; margin: 0; padding: 0; border-top: var(--border-width-thin) solid var(--color-stroke-subtle); list-style: none; }
.imaginie-research-list li { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 8px; min-height: 83px; padding: 16px 0; border-bottom: var(--border-width-thin) solid var(--color-stroke-subtle); }
.imaginie-research-list strong { color: var(--violet-text); font-family: var(--mono); font-size: var(--type-size-caption); font-weight: 400; }
.imaginie-research-list b { display: block; color: var(--ink); font-size: var(--type-size-body); font-weight: 500; line-height: var(--type-lineheight-body); }
.imaginie-research-list small { display: block; margin-top: 8px; color: var(--muted); font-size: var(--type-size-label); font-weight: 400; white-space: nowrap; }
.imaginie-journey { min-height: 1020.6px; }
.imaginie-visual-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 64px; }
.imaginie-visual-pair .imaginie-figure img { height: auto; aspect-ratio: 574.8 / 431.1; object-fit: contain; background: var(--color-button-primary-text); }
.imaginie-static-media { animation: none !important; transition: none !important; }
.imaginie-validation { min-height: 1098.2px; }
.imaginie-validation__intro { margin-top: 0; }
.imaginie-validation__intro .imaginie-section-intro { gap: 0; }
.imaginie-validation__intro .imaginie-section-label { margin-bottom: 0; }
.imaginie-validation__intro h2 { margin-top: 0; max-width: 465.55px; font-size: 52px; letter-spacing: -1.04px; }
.imaginie-validation__intro .imaginie-section-intro > p:last-child { max-width: 465.55px; margin-top: 0; }
.imaginie-validation__note { min-height: 168.9px; padding: 24px 28px; border-left: 4px solid var(--violet); background: var(--canvas); }
.imaginie-validation__note small { color: var(--violet-text); font-family: var(--mono); font-size: var(--type-size-label); letter-spacing: var(--type-letterspacing-label); text-transform: uppercase; }
.imaginie-validation__note strong { display: block; margin-top: 18px; font-family: var(--display); font-size: var(--type-size-h2); font-weight: 600; line-height: var(--type-lineheight-h2); }
.imaginie-validation__note p { margin-top: 12px; color: var(--muted); font-size: var(--type-size-body); font-weight: 300; line-height: var(--type-lineheight-body); }
.imaginie-visual-pair--validation { margin-top: 64px; }
.imaginie-visual-pair--validation .imaginie-figure img { aspect-ratio: 574.8 / 323.32; object-fit: cover; }
.imaginie-product { min-height: 1044.8px; padding: 102.4px 0; background: #101820; }
.imaginie-product-panel { display: grid; grid-template-columns: 405.1px 540.1px; gap: 102.4px; align-items: center; width: min(1240px, calc(100% - 112px)); min-height: 839px; margin: 0 auto; padding: 65px; border: 1px solid #40505a; border-radius: var(--radius-md); background: #18232b; }
.imaginie-product-copy .imaginie-section-label { color: var(--color-accent-teal); }
.imaginie-product-copy h2 { color: var(--color-button-primary-text); font-size: 52px; line-height: 56px; letter-spacing: -1.04px; }
.imaginie-product-copy > p:not(.imaginie-section-label) { margin-top: 24px; color: #aab8c3; font-size: var(--type-size-body); font-weight: 300; line-height: var(--type-lineheight-body); }
.imaginie-product-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 40px; color: #aab8c3; font-size: var(--type-size-label); text-transform: none; }
.imaginie-product-meta span { padding: 7px 10px; border: 1px solid #40505a; border-radius: var(--radius-sm); }
.imaginie-product-figure { overflow: hidden; margin: 0; border: 1px solid #40505a; border-radius: var(--radius-md); background: #05080a; }
.imaginie-screen-row { display: flex; justify-content: center; gap: 12px; height: 650px; padding: 164px 34px; }
.imaginie-screen-row img { display: block; width: 148px; height: 322px; border-radius: 22px; object-fit: cover; }
.imaginie-product-figure { height: 709px; }
@media (max-width: 1000px) {
  .imaginie-container { width: min(100% - 64px, 720px); }
  .imaginie-section { padding: 88px 0; }
  .imaginie-hero { min-height: 560px; padding-top: 72px; }
  .imaginie-summary { padding: 32px; }
  .imaginie-summary__grid { height: auto; grid-template-columns: 1fr; }
  .imaginie-summary__grid > div { min-height: 120px; }
  .imaginie-context__split, .imaginie-validation__intro, .imaginie-research__grid, .imaginie-product-panel { grid-template-columns: 1fr; gap: 40px; }
  .imaginie-prose { gap: 24px; }
  .imaginie-research__grid { margin-top: 40px; }
  .imaginie-figure--photo img { height: auto; aspect-ratio: 4 / 3; }
  .imaginie-product { min-height: 0; }
  .imaginie-product-panel { width: min(100% - 64px, 720px); min-height: 0; margin: 0 auto; padding: 40px; }
  .imaginie-screen-row { height: auto; min-height: 0; padding: 40px 12px; }
  .imaginie-product-figure { height: auto; }
  .imaginie-visual-pair { margin-top: 40px; }
}

@media (max-width: 600px) {
  .imaginie-container { width: calc(100% - 48px); }
  .imaginie-hero { min-height: 520px; }
  .imaginie-hero h1 { font-size: clamp(3.2rem, 14vw, 4.8rem); line-height: 1; }
  .imaginie-lede { font-size: 20px; line-height: 28px; }
  .imaginie-audience-grid, .imaginie-visual-pair { grid-template-columns: 1fr; }
  .imaginie-page h2 { font-size: 2.4rem; line-height: 48px; }
  .imaginie-figure figcaption { white-space: normal; }
  .imaginie-product-panel { width: calc(100% - 48px); padding: 24px; }
  .imaginie-screen-row { justify-content: flex-start; overflow-x: auto; }
}
