/* Impeccable scaffold: the measured layout of the approved comp as custom properties. Generated by build-phase.mjs scaffold; regenerate after comp-spec.mjs --regions changes. Bind these to your own markup; positions are % of the comp frame so they scale with it. */
:root {
  --r-paper-texture-x: 50.000%; --r-paper-texture-y: 0.000%; --r-paper-texture-w: 10.000%; --r-paper-texture-h: 10.000%;
  --r-top-nav-x: 0.000%; --r-top-nav-y: 0.000%; --r-top-nav-w: 100.000%; --r-top-nav-h: 10.000%;
  --r-hero-title-x: 10.000%; --r-hero-title-y: 10.000%; --r-hero-title-w: 40.000%; --r-hero-title-h: 30.000%;
  --r-hero-intro-x: 11.230%; --r-hero-intro-y: 36.940%; --r-hero-intro-w: 36.680%; --r-hero-intro-h: 5.740%;
  --r-hero-portrait-x: 60.000%; --r-hero-portrait-y: 10.000%; --r-hero-portrait-w: 30.000%; --r-hero-portrait-h: 40.000%;
  --r-hero-notes-x: 50.030%; --r-hero-notes-y: 10.050%; --r-hero-notes-w: 46.910%; --r-hero-notes-h: 40.000%;
  --r-lineage-rail-x: 0.000%; --r-lineage-rail-y: 30.000%; --r-lineage-rail-w: 100.000%; --r-lineage-rail-h: 30.000%;
  --r-metric-cost-x: 21.730%; --r-metric-cost-y: 50.050%; --r-metric-cost-w: 14.090%; --r-metric-cost-h: 22.780%;
  --r-metric-performance-x: 44.390%; --r-metric-performance-y: 50.050%; --r-metric-performance-w: 13.550%; --r-metric-performance-h: 22.780%;
  --r-metric-automation-x: 68.110%; --r-metric-automation-y: 50.050%; --r-metric-automation-w: 14.090%; --r-metric-automation-h: 22.780%;
  --r-experience-heading-x: 11.630%; --r-experience-heading-y: 80.000%; --r-experience-heading-w: 19.930%; --r-experience-heading-h: 8.040%;
  --r-experience-summary-x: 61.990%; --r-experience-summary-y: 81.150%; --r-experience-summary-w: 27.910%; --r-experience-summary-h: 5.170%;
  --r-experience-row-x: 49.100%; --r-experience-row-y: 91.200%; --r-experience-row-w: 25.510%; --r-experience-row-h: 6.320%;
}

.comp-frame { position: relative; width: 100%; aspect-ratio: 1505 / 1045; overflow: hidden; }
.r-paper-texture { position: absolute; left: var(--r-paper-texture-x); top: var(--r-paper-texture-y); width: var(--r-paper-texture-w); height: var(--r-paper-texture-h); }
.r-top-nav { position: absolute; left: var(--r-top-nav-x); top: var(--r-top-nav-y); width: var(--r-top-nav-w); height: var(--r-top-nav-h); }
.r-hero-title { position: absolute; left: var(--r-hero-title-x); top: var(--r-hero-title-y); width: var(--r-hero-title-w); height: var(--r-hero-title-h); }
.r-hero-intro { position: absolute; left: var(--r-hero-intro-x); top: var(--r-hero-intro-y); width: var(--r-hero-intro-w); height: var(--r-hero-intro-h); }
.r-hero-portrait { position: absolute; left: var(--r-hero-portrait-x); top: var(--r-hero-portrait-y); width: var(--r-hero-portrait-w); height: var(--r-hero-portrait-h); }
.r-hero-notes { position: absolute; left: var(--r-hero-notes-x); top: var(--r-hero-notes-y); width: var(--r-hero-notes-w); height: var(--r-hero-notes-h); }
.r-lineage-rail { position: absolute; left: var(--r-lineage-rail-x); top: var(--r-lineage-rail-y); width: var(--r-lineage-rail-w); height: var(--r-lineage-rail-h); }
.r-metric-cost { position: absolute; left: var(--r-metric-cost-x); top: var(--r-metric-cost-y); width: var(--r-metric-cost-w); height: var(--r-metric-cost-h); }
.r-metric-performance { position: absolute; left: var(--r-metric-performance-x); top: var(--r-metric-performance-y); width: var(--r-metric-performance-w); height: var(--r-metric-performance-h); }
.r-metric-automation { position: absolute; left: var(--r-metric-automation-x); top: var(--r-metric-automation-y); width: var(--r-metric-automation-w); height: var(--r-metric-automation-h); }
.r-experience-heading { position: absolute; left: var(--r-experience-heading-x); top: var(--r-experience-heading-y); width: var(--r-experience-heading-w); height: var(--r-experience-heading-h); }
.r-experience-summary { position: absolute; left: var(--r-experience-summary-x); top: var(--r-experience-summary-y); width: var(--r-experience-summary-w); height: var(--r-experience-summary-h); }
.r-experience-row { position: absolute; left: var(--r-experience-row-x); top: var(--r-experience-row-y); width: var(--r-experience-row-w); height: var(--r-experience-row-h); }