@layer layouts {
  .im-container { inline-size: min(100% - 2 * var(--im-gutter), var(--im-public-max)); margin-inline: auto; }
  .im-section { padding-block: var(--im-space-48); }
  .im-public-header { position: relative; z-index: 20; background: var(--im-surface); border-block-end: 1px solid var(--im-border); }
  .im-public-header__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--im-space-24); min-block-size: var(--im-header); padding-block: var(--im-space-12); }
  .im-public-nav, .im-account-actions { display: flex; align-items: center; gap: var(--im-space-24); }
  .im-public-nav a { color: var(--im-text); text-decoration: none; font-size: .875rem; font-weight: 600; padding-block: .75rem; }
  .im-public-nav [aria-current="page"] { text-decoration: underline; text-decoration-color: var(--im-accent); text-decoration-thickness: 3px; text-underline-offset: .65rem; }
  .im-menu-trigger { display: inline-flex; }
  .im-public-nav { display: none; }
  .im-account-actions--desktop { display: none; }
  .im-hero { position: relative; isolation: isolate; overflow: clip; color: var(--im-on-hero); background: var(--im-hero); border-radius: 0 0 var(--im-radius-feature) var(--im-radius-feature); }
  .im-hero__media { position: absolute; z-index: -2; inset: 0; inline-size: 100%; block-size: 100%; object-fit: cover; object-position: 65% center; }
  .im-hero::before { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, var(--im-hero) 0%, var(--im-hero-overlay) 45%, transparent 100%); }
  .im-hero__inner { padding-block: clamp(3rem, 5vw, 6rem); }
  .im-hero__copy { max-inline-size: 42rem; }
  .im-hero h1 { font-size: var(--im-hero-type); line-height: 1.03; color: inherit; }
  .im-hero__highlight { color: var(--im-highlight); }
  .im-hero p { max-inline-size: 38rem; font-size: 1.125rem; }
  .im-role-entry { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: var(--im-space-12); padding: var(--im-space-16); background: var(--im-hero); color: var(--im-on-hero); border-radius: var(--im-radius-panel); margin-block-start: var(--im-space-24); }
  .im-role-entry__search { grid-column: 1 / -1; }
  .im-role-tile { min-block-size: 5.5rem; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: .5rem; padding: .75rem; text-align: center; color: var(--im-on-hero); text-decoration: none; border: 1px solid var(--im-control-border); border-radius: var(--im-radius-control); }
  .im-role-tile:hover { background: var(--im-hero-hover); }
  .im-home-features { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(0,1fr); gap: var(--im-space-24); align-items: stretch; }
  .im-home-features__stack { display: grid; gap: var(--im-space-16); }
  .im-cycle { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--im-space-24); }
  .im-catalogue { display: grid; grid-template-columns: 16rem minmax(0,1fr); gap: var(--im-space-32); }
  .im-results { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--im-space-24); align-items: stretch; }
  .im-reading-layout { display: grid; grid-template-columns: minmax(0,1fr) 19rem; gap: var(--im-space-32); align-items: start; }
  .im-prose { max-inline-size: var(--im-reading-max); font-size: 1.125rem; line-height: 1.65; }
  .im-prose :where(p,ul,ol) { margin-block-end: 1.25em; }
  .im-workspace { display: grid; grid-template-columns: var(--im-sidebar) minmax(0,1fr); grid-template-rows: auto 1fr; grid-template-areas: "sidebar header" "sidebar main"; max-inline-size: var(--im-workspace-max); margin-inline: auto; min-block-size: 100dvh; }
  .im-sidebar { grid-area: sidebar; background: var(--im-surface); border-inline-end: 1px solid var(--im-border); padding: var(--im-space-24) var(--im-space-12); display: flex; flex-direction: column; gap: var(--im-space-24); }
  .im-sidebar__bottom { margin-block-start: auto; padding-block-start: var(--im-space-32); }
  .im-workspace-header { grid-area: header; display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; gap: var(--im-space-12); padding: var(--im-space-12) var(--im-gutter); background: var(--im-surface); min-block-size: var(--im-header); border-block-end: 1px solid var(--im-border); }
  .im-context-controls { display: flex; flex-wrap: wrap; gap: .75rem; min-inline-size: 0; }
  .im-workspace-main { grid-area: main; padding: var(--im-space-24) var(--im-gutter) var(--im-space-48); }
  .im-role-band { display: flex; align-items: center; gap: var(--im-space-16); padding: var(--im-space-24); background: var(--im-soft); border-radius: var(--im-radius-panel); margin-block-end: var(--im-space-24); }
  .im-role-band h1 { margin-block-end: .25rem; font-size: clamp(1.5rem, 1.2rem + 1vw, 2.25rem); }
  .im-role-band p { margin: 0; color: var(--im-accent); }
  .im-action-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--im-space-16); align-items: stretch; }
  .im-workbench { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(16rem,1fr); gap: var(--im-space-24); align-items: start; }
  .im-support-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--im-space-24); }
  .im-form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--im-space-24); }
  .im-form-grid__full { grid-column: 1 / -1; }
  .im-account { max-inline-size: 30rem; margin-inline: auto; padding: var(--im-space-32) var(--im-space-24); }
  .im-footer { margin-block-start: var(--im-space-48); padding-block: var(--im-space-24); background: var(--im-hero); color: var(--im-on-hero); }
  .im-footer__inner { display: flex; align-items: center; flex-wrap: wrap; gap: var(--im-space-24); justify-content: space-between; }
  .im-footer a { color: var(--im-on-hero); }
  @media (min-width: 48rem) { :root { --im-gutter: 1.5rem; } }
  @media (min-width: 75rem) { :root { --im-gutter: 2rem; } .im-public-nav,.im-account-actions--desktop { display: flex; } .im-menu-trigger--public { display: none; } .im-role-entry { grid-template-columns: minmax(18rem,1.7fr) repeat(5,minmax(0,1fr)); } .im-role-entry__search { grid-column: auto; } }
  @media (max-width: 63.999rem) { .im-workspace { grid-template-columns: minmax(0,1fr); grid-template-areas: "header" "main"; } .im-sidebar { display: none; } .im-workbench,.im-reading-layout { grid-template-columns: minmax(0,1fr); } .im-catalogue { grid-template-columns: minmax(0,1fr); } }
  @media (min-width: 64rem) { .im-menu-trigger--workspace { display: none; } }
  @media (max-width: 47.999rem) { .im-home-features,.im-cycle,.im-action-grid { grid-template-columns: minmax(0,1fr); } .im-results,.im-support-grid,.im-form-grid { grid-template-columns: minmax(0,1fr); } .im-hero::before { background: linear-gradient(180deg,var(--im-hero) 0%,var(--im-hero-overlay) 65%,var(--im-hero-overlay) 100%); } .im-hero__media { object-position: 60% center; } .im-section { padding-block: var(--im-space-32); } .im-workspace-header { align-items: stretch; } .im-context-controls { inline-size: 100%; } .im-context-controls > * { flex: 1 1 10rem; } }
  @media (max-width: 39.999rem) { .im-role-entry { grid-template-columns: repeat(2,minmax(0,1fr)); } .im-role-entry__search,.im-role-entry > .im-role-tile:last-child { grid-column: 1 / -1; } .im-role-band { padding: var(--im-space-16); } }
}

/* v2: media is after hero copy in source order and becomes a separate mobile block. */
@layer layouts {
  .im-brand-lockup { display: inline-flex; gap: .6rem; align-items: center; background: var(--im-surface); padding: .4rem .6rem; border-radius: var(--im-radius-control); flex-shrink: 0; }
  .im-brand-lockup__symbol { inline-size: 2.75rem; }
  .im-brand-lockup__wordmark { inline-size: 7.5rem; }
  .im-navigation-disclosure > summary { min-block-size: 2.75rem; display: flex; align-items: center; padding: .5rem .75rem; cursor: pointer; }
  .im-navigation-disclosure nav { display: grid; gap: .25rem; padding: .5rem; }
  .im-navigation-disclosure nav a { padding: .6rem .75rem; }
  @media (max-width: 47.999rem) {
    .im-hero::before { display: none; }
    .im-hero__media { position: static; display: block; z-index: auto; inline-size: 100%; block-size: auto; aspect-ratio: 16 / 9; object-fit: cover; }
    .im-hero__inner { padding-block: var(--im-space-32); }
    .im-role-entry { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .im-role-entry__search { grid-column: 1 / -1; }
  }
  @media (max-width: 23.999rem) { .im-role-entry { grid-template-columns: minmax(0,1fr); } }
}
