/* Cinemata ID catalog — the local Cinemata Viewfinder scale and composition.
   The hero and header live in focushero.css. Keep this file to service content,
   navigation, and demonstrations; do not override the shared VF atmosphere. */
.cinemata-id {
  --id-motion-fast: var(--vf-dur-fast);
  --id-motion-medium: var(--vf-dur-base);
  --id-ease: var(--vf-ease-out);
  --id-ease-lens: var(--vf-ease-lens);
  --id-rule: var(--vf-line-2);
  --id-page-pad-t: calc(var(--vf-hud-top) + var(--vf-top-h) + var(--vf-sp-5xl));
}
html { scroll-behavior: smooth; scroll-padding-top: 120px; }
body { min-width: 280px; }

/* Shared navigation. Mobile disclosure and header geometry belong to the header. */
.id-brand { flex: none; min-height: 44px; }
.id-brand img { display: block; width: 240px; max-width: 100%; height: auto; }
.id-main-nav { display: flex; align-items: center; gap: var(--vf-sp-4xl); margin-left: var(--vf-sp-5xl); }
.id-main-nav a { display: inline-flex; align-items: center; min-height: 44px; font-size: var(--vf-fs-md); line-height: var(--vf-lh-md); text-decoration: none; color: var(--vf-fg-2); }
.id-main-nav a:hover, .id-main-nav a[aria-current] { color: var(--vf-accent); }
.id-account-short, .id-account-symbol { display: none; }
.id-account-email { word-break: break-all; }
.id-eyebrow { font: 500 var(--vf-fs-xs)/var(--vf-lh-xs-snug) var(--vf-font-mono); letter-spacing: var(--vf-track-label); text-transform: uppercase; color: var(--vf-fg-2); }
.id-text-link { display: inline-flex; align-items: center; gap: var(--vf-sp-lg); min-height: 44px; font-size: var(--vf-fs-md); line-height: var(--vf-lh-md-text); text-decoration: underline; text-underline-offset: 5px; text-decoration-color: var(--vf-line-3); }
.id-text-link:hover { color: var(--vf-accent); }

/* Direct service entries under the full-frame hero. */
.id-intro-index { position: relative; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-block: 1px solid var(--id-rule); }
.id-intro-index a { position: relative; display: flex; align-items: center; gap: var(--vf-sp-3xl); min-height: 88px; padding: var(--vf-sp-3xl); text-decoration: none; }
.id-intro-index a:first-child { padding-left: 0; }
.id-intro-index a + a { border-left: 1px solid var(--id-rule); }
.id-intro-index a::before { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--vf-accent); transform: scaleX(0); transform-origin: left; transition: transform var(--id-motion-medium) var(--id-ease); }
.id-intro-index a:hover::before, .id-intro-index a:focus-visible::before { transform: scaleX(1); }
.id-intro-index strong { min-width: 0; font: 800 var(--vf-fs-xl)/var(--vf-lh-xl) var(--vf-font-display); letter-spacing: var(--vf-track-title); text-transform: uppercase; }
.id-intro-index svg { flex: none; margin-left: auto; width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.2; transition: transform var(--id-motion-fast); }
.id-intro-index a:hover svg { transform: translate(2px,-2px); }
.id-index-focus { position: absolute; pointer-events: none; inset: 0 auto 0 0; width: 50%; opacity: 0; transition: transform var(--vf-dur-slow) var(--id-ease-lens), opacity var(--id-motion-fast); }
.id-index-focus.is-visible { opacity: 1; }
.id-index-focus i { position: absolute; width: 9px; height: 9px; border-color: var(--vf-accent); border-style: solid; }
.id-index-focus i:nth-child(1) { top: 7px; left: 7px; border-width: 1px 0 0 1px; }
.id-index-focus i:nth-child(2) { top: 7px; right: 7px; border-width: 1px 1px 0 0; }
.id-index-focus i:nth-child(3) { bottom: 7px; right: 7px; border-width: 0 1px 1px 0; }
.id-index-focus i:nth-child(4) { bottom: 7px; left: 7px; border-width: 0 0 1px 1px; }

/* Service scenes use the same display hierarchy as Cinemata's home sections. */
.id-product { isolation: isolate; padding-top: var(--vf-sec-top); padding-bottom: var(--vf-sec-bottom); }
.id-product + .id-product { border-top: 1px solid var(--id-rule); }
.id-product-heading { position: relative; z-index: 1; display: flex; align-items: baseline; gap: var(--vf-sp-3xl); margin-bottom: var(--vf-sec-head-mb); }
.id-product-number { flex: none; align-self: flex-start; margin-top: var(--vf-sp-lg); color: var(--vf-accent); font: 600 var(--vf-fs-sm)/var(--vf-lh-sm-snug) var(--vf-font-mono); }
.id-product-heading h2 { min-width: 0; max-width: 18ch; font: 900 var(--vf-fs-h2)/var(--vf-lh-h2) var(--vf-font-display); letter-spacing: var(--vf-track-display); text-transform: uppercase; overflow: clip; padding-bottom: .08em; margin-bottom: -.08em; }
.id-product-heading h2 > span { display: block; }
.id-product-heading > .id-eyebrow { margin-left: auto; max-width: 22ch; text-align: right; }
.id-scene-ordinal { position: absolute; z-index: -1; right: var(--vf-pad); top: var(--vf-sec-top); font: 900 clamp(180px,24vw,340px)/.8 var(--vf-font-display); letter-spacing: var(--vf-track-mega); color: transparent; -webkit-text-stroke: 1px var(--vf-line-faint); pointer-events: none; }
.id-product-grid { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); align-items: start; gap: var(--vf-sec-head-gap); }
.id-product-grid { position: relative; perspective: 1500px; }
.id-product-copy { min-width: 0; }
.id-product-copy h3 { max-width: 22ch; font: 900 var(--vf-fs-h3)/var(--vf-lh-h3) var(--vf-font-display); letter-spacing: var(--vf-track-title); text-transform: uppercase; }
.id-product-copy > p:not(.id-access-note) { max-width: 44ch; margin-top: var(--vf-sp-3xl); color: var(--vf-fg-2); font-size: var(--vf-fs-body); line-height: var(--vf-lh-body-loose); }
.id-scene-actions { display: flex; align-items: center; flex-wrap: wrap; gap: var(--vf-sp-3xl); margin-top: var(--vf-sp-4xl); }
.id-access-note { max-width: 60ch; margin-top: var(--vf-sp-3xl); color: var(--vf-fg-2); font-size: var(--vf-fs-sm); line-height: var(--vf-lh-sm-body); }

/* Demonstrations: existing working interactions, readable at the VF 11px floor. */
.id-product-visual { position: relative; min-width: 0; overflow: hidden; border: 1px solid var(--id-rule); border-radius: var(--vf-r-panel); background: var(--vf-panel); transform-origin: 50% 0; }
.id-demo-top, .id-demo-foot { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: var(--vf-sp-sm) var(--vf-sp-xl); padding: var(--vf-sp-xl) var(--vf-sp-3xl); color: var(--vf-fg-2); font: 500 var(--vf-fs-xs)/var(--vf-lh-xs-body) var(--vf-font-mono); }
.id-demo-top { border-bottom: 1px solid var(--id-rule); }
.id-demo-top > :first-child { color: var(--vf-fg); letter-spacing: var(--vf-track-xs); }
.id-demo-foot { border-top: 1px solid var(--id-rule); }
.id-script-workspace { display: grid; grid-template-columns: minmax(100px,.65fr) minmax(0,2fr); min-height: 340px; }
.id-script-workspace aside { padding: var(--vf-sp-3xl) 0; border-right: 1px solid var(--id-rule); }
.id-script-workspace aside > span { display: block; margin: 0 var(--vf-sp-xl) var(--vf-sp-2xl); color: var(--vf-fg-2); font: 500 var(--vf-fs-xs)/var(--vf-lh-xs-body) var(--vf-font-mono); }
.id-script-workspace aside > div { display: flex; gap: var(--vf-sp-lg); padding: var(--vf-sp-lg) var(--vf-sp-xl); color: var(--vf-fg-3); font: 500 var(--vf-fs-xs)/var(--vf-lh-xs-body) var(--vf-font-mono); white-space: nowrap; border-left: 2px solid transparent; }
.id-script-workspace aside b { font-family: var(--vf-font-body); font-weight: 400; color: var(--vf-fg-2); }
.id-script-workspace aside .is-current { border-color: var(--vf-accent); background: var(--vf-surface-2); color: var(--vf-accent); }
.id-script-workspace aside .is-current b { color: var(--vf-fg); }
.id-script-page { position: relative; min-width: 0; min-height: 300px; margin: var(--vf-sp-3xl); padding: var(--vf-sp-4xl) var(--vf-sp-3xl); border: 1px solid var(--vf-line); border-radius: var(--vf-r-mark); background: var(--vf-sheet); color: var(--vf-fg-2); }
.id-page-number { position: absolute; top: var(--vf-sp-lg); right: var(--vf-sp-xl); color: var(--vf-fg-3); font: 500 var(--vf-fs-xs)/var(--vf-lh-xs) var(--vf-font-mono); }
.id-script-text { font: 400 var(--vf-fs-sm)/var(--vf-lh-sm-script) var(--vf-font-mono); overflow-wrap: anywhere; }
.id-script-text > span { display: block; width: fit-content; max-width: 100%; }
.id-script-text .is-heading { font-weight: 600; margin-bottom: var(--vf-sp-3xl); color: var(--vf-fg); }
.id-script-text .is-character { font-weight: 600; margin: var(--vf-sp-3xl) auto var(--vf-sp-2xs); color: var(--vf-fg); }
.id-script-text .is-dialogue { margin: 0 auto; }
.is-raw .id-script-text > span { margin: 0 0 var(--vf-sp-md); font-weight: 400; }
.id-demo-controls { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: var(--vf-sp-lg); padding: var(--vf-sp-lg) var(--vf-sp-2xl); min-height: 64px; border-top: 1px solid var(--id-rule); color: var(--vf-fg-2); font: 500 var(--vf-fs-xs)/var(--vf-lh-xs-body) var(--vf-font-mono); }
.id-demo-controls button { min-height: 44px; padding: var(--vf-sp-md) var(--vf-sp-lg); border: 1px solid var(--vf-line-3); border-radius: var(--vf-r-ctl); color: var(--vf-fg); font: 500 var(--vf-fs-sm)/var(--vf-lh-sm-snug) var(--vf-font-body); transition: border-color var(--id-motion-fast), background var(--id-motion-fast); }
.id-demo-controls button:hover { border-color: var(--vf-accent); background: var(--vf-hover-tint); }
.id-wiki-map-body { padding: var(--vf-sp-3xl) var(--vf-sp-4xl) var(--vf-sp-4xl); }
.id-wiki-phases { display: flex; flex-wrap: wrap; gap: var(--vf-sp-md) var(--vf-sp-xl); justify-content: space-between; padding-bottom: var(--vf-sp-3xl); color: var(--vf-fg-2); font: 500 var(--vf-fs-xs)/var(--vf-lh-xs-body) var(--vf-font-mono); }
.id-wiki-phases b { color: var(--vf-accent); font-weight: 600; }
.id-map-title { padding-top: var(--vf-sp-3xl); text-align: center; }
.id-map-title strong { display: block; margin: var(--vf-sp-xl) auto 0; font: 900 var(--vf-fs-h2-col)/var(--vf-lh-h2-col) var(--vf-font-display); letter-spacing: var(--vf-track-display); text-transform: uppercase; }
.id-map-connectors { display: block; width: 100%; height: 50px; stroke: var(--vf-line-3); stroke-width: 1; fill: none; margin-top: var(--vf-sp-3xl); }
.id-map-departments { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--vf-sp-xl); }
.id-map-departments > div { position: relative; border-top: 1px solid var(--vf-line-3); padding: var(--vf-sp-xl) 0 var(--vf-sp-2xs); }
.id-map-departments > div::before { content: ''; position: absolute; left: 0; right: 0; top: -1px; height: 1px; background: var(--vf-accent); transform: scaleX(0); transform-origin: left; transition: transform var(--id-motion-medium) var(--id-ease-lens); }
.id-map-departments > div:hover::before { transform: scaleX(1); }
.id-map-departments span { color: var(--vf-fg-2); font: 500 var(--vf-fs-xs)/var(--vf-lh-xs-body) var(--vf-font-mono); }
.id-map-departments b { display: block; margin: var(--vf-sp-sm) 0; font-size: var(--vf-fs-md); line-height: var(--vf-lh-md-text); font-weight: 600; }
.id-map-departments p { color: var(--vf-fg-2); font-size: var(--vf-fs-sm); line-height: var(--vf-lh-sm-body); }
.id-identity-body { padding: var(--vf-sp-5xl) var(--vf-sp-4xl) var(--vf-sp-4xl); }
.id-identity-source { margin: 0 auto; text-align: center; }
.id-identity-source svg { display: block; width: 36px; height: 36px; fill: none; stroke: var(--vf-accent); stroke-width: 1; margin: 0 auto var(--vf-sp-xl); }
.id-identity-source strong { display: block; font: 900 var(--vf-fs-h3)/var(--vf-lh-h3) var(--vf-font-display); letter-spacing: var(--vf-track-title); text-transform: uppercase; }
.id-identity-source > span { display: block; margin-top: var(--vf-sp-lg); color: var(--vf-fg-2); font-size: var(--vf-fs-sm); line-height: var(--vf-lh-sm-body); }
.id-identity-lines { display: block; width: 100%; height: 70px; stroke: var(--vf-accent); stroke-width: 1; fill: none; margin-top: var(--vf-sp-3xl); }
.id-identity-lines .id-line-pending { stroke: var(--vf-fg-3); stroke-dasharray: 4 5; }
.id-identity-destinations { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--vf-sp-3xl); }
.id-identity-destinations > div { min-width: 0; border: 1px solid var(--vf-accent-line); border-radius: var(--vf-r-ctl); padding: var(--vf-sp-3xl) var(--vf-sp-xl); text-align: center; }
.id-identity-destinations .id-identity-pending { border: 1px dashed var(--vf-line-3); }
.id-connection-state { display: inline-flex; align-items: center; gap: var(--vf-sp-xs); color: var(--vf-accent); font: 500 var(--vf-fs-xs)/var(--vf-lh-xs-body) var(--vf-font-mono); }
.id-connection-state i { flex: none; width: var(--vf-dot-xs); height: var(--vf-dot-xs); border-radius: var(--vf-r-round); background: var(--vf-accent); }
.id-identity-pending .id-connection-state { color: var(--vf-fg-2); }
.id-identity-destinations strong { display: block; margin: var(--vf-sp-xl) 0 var(--vf-sp-sm); font: 800 var(--vf-fs-xl)/var(--vf-lh-xl) var(--vf-font-display); letter-spacing: var(--vf-track-title); text-transform: uppercase; }
.id-identity-destinations > div > span:last-child { color: var(--vf-fg-2); font-size: var(--vf-fs-xs); line-height: var(--vf-lh-xs-body); }

/* Account questions follow the VF section/display and disclosure text scales. */
.id-account-story { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.3fr); gap: var(--vf-sec-head-gap); padding-top: var(--vf-sec-top); padding-bottom: var(--vf-sec-bottom); border-top: 1px solid var(--id-rule); }
.id-account-heading h2 { margin: var(--vf-sp-3xl) 0; font: 900 var(--vf-fs-h2)/var(--vf-lh-h2) var(--vf-font-display); letter-spacing: var(--vf-track-display); text-transform: uppercase; }
.id-account-heading > p:last-child { color: var(--vf-fg-2); font-size: var(--vf-fs-lead); line-height: var(--vf-lh-lead); }
.id-questions details { border-top: 1px solid var(--id-rule); }
.id-questions details:last-child { border-bottom: 1px solid var(--id-rule); }
.id-questions summary { display: flex; align-items: center; justify-content: space-between; gap: var(--vf-sp-3xl); padding: var(--vf-sp-3xl) 0; font: 600 var(--vf-fs-faq)/var(--vf-lh-faq) var(--vf-font-body); list-style: none; cursor: pointer; }
.id-questions summary::-webkit-details-marker { display: none; }
.id-questions summary:hover { color: var(--vf-accent); }
.id-questions summary > span { flex: none; font-size: var(--vf-fs-3xl); font-weight: 400; color: var(--vf-accent); transition: transform var(--id-motion-medium) var(--id-ease-lens); }
.id-questions details[open] summary > span { transform: rotate(45deg); }
.id-questions details p { padding: 0 var(--vf-sp-3xl) var(--vf-sp-3xl) 0; color: var(--vf-fg-2); font-size: var(--vf-fs-body); line-height: var(--vf-lh-body-loose); }

/* Shared return link and recovery screens. Detail layouts live in services.css. */
.id-back { display: inline-flex; align-items: center; gap: var(--vf-sp-lg); min-height: 44px; margin-bottom: var(--vf-sp-4xl); color: var(--vf-fg-2); text-decoration: none; font-size: var(--vf-fs-md); line-height: var(--vf-lh-md); }
.id-back:hover { color: var(--vf-accent); }
.id-error { min-height: 80svh; padding-top: var(--id-page-pad-t); padding-bottom: var(--vf-sec-bottom); }
.id-error h1 { max-width: 18ch; font: 900 var(--vf-fs-h2)/var(--vf-lh-h2) var(--vf-font-display); letter-spacing: var(--vf-track-display); text-transform: uppercase; }
.id-error p { margin-top: var(--vf-sp-3xl); color: var(--vf-fg-2); max-width: 56ch; }
.id-profile h2[data-long-name] { font: 900 var(--vf-fs-h3)/var(--vf-lh-h3) var(--vf-font-display); text-transform: uppercase; letter-spacing: var(--vf-track-title); overflow-wrap: anywhere; }
.id-error-panel { max-width: 680px; margin: 32px auto 0; }
.id-error .id-error-panel h1 { font-size: clamp(28px, 4vw, 44px); line-height: 1.06; max-width: 20ch; overflow-wrap: anywhere; }
.id-error .id-error-panel .vf-pn-top { margin: 0; }
.id-error .id-error-panel p { line-height: 1.6; }
.id-error .vf-btn { white-space: normal; height: auto; min-height: 48px; padding: 12px 20px; }
.id-mobile-menu a[aria-current] { color: var(--vf-accent); }

/* The footer remains a compact service navigator, inside the same VF grid. */
.id-footer { position: relative; z-index: var(--vf-z-content); display: flex; align-items: flex-start; justify-content: space-between; gap: var(--vf-sp-4xl); padding-top: var(--vf-sp-5xl); padding-bottom: var(--vf-foot-pad-b); border-top: 1px solid var(--id-rule); }
.id-footer-brand { display: inline-flex; align-items: center; min-height: 44px; max-width: 100%; text-decoration: none; }
.id-footer-brand img { display: block; width: 240px; max-width: 100%; height: auto; }
.id-footer p { font-size: var(--vf-fs-md); line-height: var(--vf-lh-md-body); color: var(--vf-fg-2); margin-top: var(--vf-sp-xl); }
.id-footer nav { display: flex; flex-wrap: wrap; gap: var(--vf-sp-md) var(--vf-sp-4xl); }
.id-footer nav a, .id-top-link { min-height: 44px; display: inline-flex; align-items: center; font-size: var(--vf-fs-md); line-height: var(--vf-lh-md-text); text-decoration-color: var(--vf-line-3); text-underline-offset: 5px; }
.id-footer nav a:hover, .id-top-link:hover { color: var(--vf-accent); }
.id-top-link { flex: none; gap: var(--vf-sp-lg); }
.id-reading-progress { position: fixed; z-index: var(--vf-z-pop); top: 0; left: 0; right: 0; height: 2px; pointer-events: none; }
.id-reading-progress i { display: block; width: 100%; height: 100%; background: var(--vf-accent); transform: scaleX(0); transform-origin: left; }
.id-top-link > span { transition: transform var(--id-motion-fast) var(--id-ease-lens); }
.id-top-link:hover > span { transform: translateY(-3px); }

@media (max-width: 390px) {
  .id-account-full { display: none; }
  .id-account-short { display: inline; }
}

@media (max-width: 1100px) {
  .id-main-nav { margin-left: var(--vf-sp-3xl); gap: var(--vf-sp-3xl); }
  .id-product-heading { flex-wrap: wrap; }
  .id-product-heading > .id-eyebrow { flex-basis: 100%; margin-left: 0; max-width: none; text-align: left; }
  .id-script-workspace { grid-template-columns: minmax(0,1fr); }
  .id-script-workspace aside { display: none; }
  .id-identity-body { padding-inline: var(--vf-sp-3xl); }
}
@media (max-width: 900px) {
  .id-product-grid { grid-template-columns: minmax(0,1fr); gap: var(--vf-sp-5xl); }
  .id-product-copy { max-width: 580px; }
  .id-product-copy h3 { max-width: 28ch; }
  .id-product-visual { width: 100%; max-width: 680px; justify-self: center; }
  .id-script-workspace { grid-template-columns: minmax(110px,.65fr) minmax(0,2fr); }
  .id-script-workspace aside { display: block; }
  .id-intro-index a { padding-inline: var(--vf-sp-xl); gap: var(--vf-sp-lg); }
  .id-intro-index strong { font-size: var(--vf-fs-lg); }
  .id-account-story { grid-template-columns: minmax(0,1fr); gap: var(--vf-sp-4xl); }
  .id-account-heading > p:last-child { max-width: 48ch; }
  .id-footer { flex-wrap: wrap; }
  .id-footer > div { width: 100%; }
}
@media (max-width: 760px) {
  .id-brand img { width: clamp(140px, 46vw, 210px); }
  html { scroll-padding-top: 96px; }
  .cinemata-id { --id-page-pad-t: calc(var(--vf-hud-top) + var(--vf-top-h) + var(--vf-sp-4xl)); }
  .id-intro-index { grid-template-columns: minmax(0,1fr); }
  .id-intro-index a { min-height: 72px; padding: var(--vf-sp-2xl) 0; }
  .id-intro-index a + a { border-left: 0; border-top: 1px solid var(--id-rule); }
  .id-intro-index a .id-eyebrow { min-width: 24px; }
  .id-intro-index strong { font-size: var(--vf-fs-xl); }
  .id-index-focus { width: 100%; height: 50%; bottom: auto; }
  .id-product-heading { gap: var(--vf-sp-xl); }
  .id-product-heading > .id-eyebrow { display: none; }
  .id-product-number { margin-top: var(--vf-sp-sm); }
  .id-product-grid { gap: var(--vf-sp-4xl); }
  .id-scene-ordinal { font-size: 180px; }
  .id-scene-actions { gap: var(--vf-sp-xl); }
  .id-scene-actions .vf-btn { max-width: 100%; min-height: var(--vf-ctl-md); height: auto; padding: var(--vf-sp-lg) var(--vf-sp-2xl); white-space: normal; }
  .id-script-workspace { grid-template-columns: minmax(0,1fr); min-height: 0; }
  .id-script-workspace aside { display: none; }
  .id-script-page { margin: var(--vf-sp-xl); padding: var(--vf-sp-4xl) var(--vf-sp-xl); }
  .id-demo-top, .id-demo-foot { padding: var(--vf-sp-xl); }
  .id-demo-controls { padding: var(--vf-sp-lg) var(--vf-sp-xl); }
  .id-wiki-map-body { padding: var(--vf-sp-3xl) var(--vf-sp-xl); }
  .id-map-departments { gap: var(--vf-sp-sm); }
  .id-map-departments b { font-size: var(--vf-fs-sm); line-height: var(--vf-lh-sm-body); }
  .id-identity-body { padding: var(--vf-sp-4xl) var(--vf-sp-xl); }
  .id-identity-destinations { gap: var(--vf-sp-lg); }
  .id-identity-destinations > div { padding: var(--vf-sp-xl) var(--vf-sp-sm); }
  .id-identity-destinations strong { font-size: var(--vf-fs-lg); line-height: var(--vf-lh-lg); }
  .id-questions details p { padding-right: 0; }
  .id-back { margin-bottom: var(--vf-sp-3xl); }
  .id-footer { gap: var(--vf-sp-3xl); padding-top: var(--vf-sp-4xl); }
  .id-footer nav { gap: var(--vf-sp-sm) var(--vf-sp-3xl); }
  .id-footer .id-top-link { margin-left: auto; }
}
@media (max-width: 390px) {
  .id-demo-top > :last-child { color: var(--vf-fg-3); }
  .id-demo-foot > :last-child:not(:first-child) { display: none; }
  .id-wiki-phases { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--vf-sp-sm) var(--vf-sp-lg); }
  .id-map-departments { grid-template-columns: minmax(0,1fr); }
  .id-map-departments > div { display: grid; grid-template-columns: 24px minmax(80px,.8fr) minmax(0,1fr); align-items: baseline; gap: var(--vf-sp-sm); padding-block: var(--vf-sp-lg); }
  .id-map-departments b { margin: 0; }
  .id-map-connectors { display: none; }
  .id-map-departments { margin-top: var(--vf-sp-3xl); }
  .id-identity-destinations { grid-template-columns: minmax(0,1fr); }
  .id-identity-destinations > div { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); align-items: center; gap: var(--vf-sp-sm); text-align: left; padding: var(--vf-sp-xl); }
  .id-identity-destinations strong { grid-area: 1 / 1; margin: 0; }
  .id-identity-destinations > div > span:last-child { grid-column: 1/-1; }
  .id-identity-destinations .id-connection-state { grid-area: 1 / 2; justify-self: end; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .id-scene-ordinal, .id-product-visual { transform: none !important; }
  [data-scene-title] { transform: none !important; clip-path: none !important; }
  .id-index-focus { transition: none; }
}