.camera-views-page { overflow: hidden; }
.camera-views-page .section { position: relative; }
.camera-views-page .button span, .camera-views-page .cv-inline-link span, .camera-views-page .cv-path a span { display: inline-block; transition: transform var(--transition-fast); }
.camera-views-page .button:hover span, .camera-views-page .cv-inline-link:hover span, .camera-views-page .cv-path a:hover span { transform: translateX(3px); }
.cv-hero__grid { display: grid; grid-template-columns: minmax(26.25rem, 31.25rem) minmax(32.5rem, 1fr); gap: var(--space-7); align-items: center; }
.cv-hero__grid > * { min-width: 0; width: 100%; }
.cv-hero__copy { max-width: 38.125rem; }
.cv-hero__actions { margin-top: var(--space-5); }
.cv-hero__media { position: relative; margin: 0; max-width: none; }
.cv-hero__media img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: 70% center; }
.cv-hero__target { position: absolute; right: 12%; bottom: 16%; width: 2.5rem; height: 2.5rem; border: 3px solid var(--color-red); background: rgb(200 50 50 / 18%); }
.cv-hero__media figcaption { padding: 0 var(--space-3); }
.cv-rail-layout { display: grid; grid-template-columns: 9.375rem minmax(0, 45rem) minmax(0, 1fr); gap: var(--space-4); align-items: start; }
.cv-rail-layout > * { min-width: 0; }
.cv-zone { color: var(--color-border); font-family: var(--font-heading); font-size: clamp(3rem, 7vw, 6rem); font-weight: 700; letter-spacing: -0.06em; line-height: .85; }
.cv-perspective__copy { max-width: 45rem; }
.cv-perspective__copy h3 { margin-top: var(--space-6); font-size: var(--text-h4); }
.cv-correction { display: flex; flex-direction: column; gap: var(--space-3); max-width: 33.75rem; margin: var(--space-6) 0; padding: var(--space-5); border-left: 2px solid var(--color-red); background: var(--color-paper); }
.cv-correction > * { min-width: 0; margin: 0; }
.cv-correction__label { color: var(--color-red); font-family: var(--font-heading); font-size: var(--text-micro); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.cv-perspective__close { max-width: 42.5rem; margin-bottom: 0; }
.cv-rail-line { align-self: stretch; min-height: 12rem; margin-top: 7rem; border-top: 1px solid rgb(184 194 201 / 65%); background: linear-gradient(90deg, transparent, rgb(23 107 155 / 14%)); }
.cv-loop__heading { max-width: 38.75rem; }
.cv-loop__grid { display: grid; grid-template-columns: minmax(38.75rem, 7fr) minmax(20rem, 5fr); gap: var(--space-6); align-items: start; margin-top: var(--space-6); }
.cv-loop__grid > * { min-width: 0; width: 100%; }
.cv-diagram-wrap { min-width: 0; }
.cv-diagram { width: 100%; aspect-ratio: 16 / 10; border: var(--border-technical); }
.cv-legend { display: flex; flex-wrap: wrap; gap: var(--space-4); margin-top: var(--space-3); color: var(--color-asphalt); font-size: var(--text-meta); }
.cv-legend > span { display: inline-flex; align-items: center; gap: var(--space-2); min-width: 0; }
.cv-legend i { display: inline-block; flex: 0 0 auto; }
.cv-legend__line { width: 1.5rem; height: 3px; background: var(--color-blue); }
.cv-legend__box { width: 1rem; height: 1rem; background: var(--color-red); }
.cv-legend__disc { width: 1rem; height: 1rem; border: 2px solid var(--color-red); border-radius: 50%; background: var(--color-white); }
.cv-loop__steps { display: flex; flex-direction: column; gap: var(--space-5); }
.cv-loop__steps > * { min-width: 0; width: 100%; }
.cv-loop-step { display: grid; grid-template-columns: 2.75rem minmax(0, 1fr); gap: var(--space-3); align-items: start; padding-bottom: var(--space-5); border-bottom: var(--border-subtle); transition: background-color var(--transition-fast); }
.cv-loop-step:last-child { padding-bottom: 0; border-bottom: 0; }
.cv-loop-step h3, .cv-loop-step p { margin: 0; }
.cv-loop-step h3 { margin-bottom: var(--space-2); font-size: var(--text-h4); }
.cv-step-number { display: grid; width: 2.5rem; height: 2.5rem; place-items: center; border: 2px solid var(--color-red); border-radius: 50%; background: var(--color-white); color: var(--color-ink); font-family: var(--font-heading); font-weight: 700; }
.cv-step-number--success { border-color: var(--color-success); }
.cv-loop-step:hover, .cv-loop-step:focus-visible { background: rgb(231 242 247 / 70%); outline: 3px solid var(--color-blue); outline-offset: 3px; }
.cv-viewpoints__content { grid-column: 2 / 4; }
.cv-viewpoints__content > h2 { max-width: 46rem; }
.cv-viewpoints__content > .lead { max-width: 40.625rem; }
.cv-viewpoints__media { position: relative; margin-top: var(--space-6); margin-bottom: var(--space-5); }
.cv-viewpoints__media img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: center; }
.cv-viewpoints__observations { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); max-width: 43rem; }
.cv-viewpoints__observations > * { min-width: 0; width: 100%; }
.cv-observation { max-width: 18.75rem; }
.cv-observation h3 { font-size: var(--text-h4); }
.cv-observation--panel { max-width: none; padding: var(--space-5); border: var(--border-subtle); background: var(--color-white); }
.cv-observation__tag { color: var(--color-blue); font-family: var(--font-heading); font-size: var(--text-micro); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.cv-viewpoints__close { max-width: 42.5rem; margin-top: var(--space-6); margin-bottom: 0; padding-top: var(--space-4); border-top: 2px solid var(--color-blue); }
.cv-controls__container { display: flex; flex-direction: column; gap: var(--space-8); }
.cv-controls__container > * { min-width: 0; width: 100%; }
.cv-controls__intro { max-width: 40rem; }
.cv-principle { display: grid; grid-template-columns: minmax(35rem, 40rem) minmax(0, 1fr); gap: var(--space-6); align-items: center; }
.cv-principle > * { min-width: 0; }
.cv-principle__copy { max-width: 40rem; }
.cv-principle__copy h3 { font-size: var(--text-h3); }
.cv-principle--second { grid-template-columns: minmax(0, 40rem) minmax(8rem, 1fr); width: min(100%, 45rem); margin-left: auto; }
.cv-principle--third { grid-template-columns: 2rem minmax(35rem, 40rem); }
.cv-pace { display: flex; flex-direction: column; gap: var(--space-2); color: var(--color-asphalt); font-size: var(--text-meta); }
.cv-pace span { display: block; width: 100%; height: 2px; background: linear-gradient(90deg, var(--color-blue) 0 45%, var(--color-asphalt-line) 45%); }
.cv-pace b { font-family: var(--font-heading); }
.cv-process { margin-bottom: 0; color: var(--color-blue); font-family: var(--font-heading); font-weight: 700; }
.cv-bend-arrow { color: var(--color-blue); font-family: var(--font-heading); font-size: 7rem; line-height: 1; text-align: center; }
.cv-reset-mark { width: 1rem; height: 1rem; background: var(--color-red); }
.cv-inline-link { font-weight: 600; }
.cv-sequence { background: var(--color-white); }
.cv-sequence__band { padding: var(--space-7); background: var(--color-asphalt); color: var(--color-white); }
.cv-sequence__band .eyebrow, .cv-sequence__band h2 { color: var(--color-white); }
.cv-sequence__heading { max-width: 32.5rem; }
.cv-sequence__heading > :last-child { margin-bottom: 0; color: #e7edf0; }
.cv-sequence__steps { position: relative; display: grid; grid-template-columns: repeat(4, minmax(13.75rem, 1fr)); gap: var(--space-5); margin-top: var(--space-7); }
.cv-sequence__steps::before { position: absolute; z-index: 0; top: 1.15rem; right: 10%; left: 10%; height: 3px; background: var(--color-blue); content: ""; }
.cv-sequence__steps > * { position: relative; z-index: 1; min-width: 0; width: 100%; }
.cv-sequence-step span { display: inline-grid; width: 3rem; height: 3rem; place-items: center; border: 2px solid var(--color-white); border-radius: 50%; background: var(--color-asphalt); color: var(--color-white); font-family: var(--font-heading); font-weight: 700; }
.cv-sequence-step:nth-child(2) span { border-color: var(--color-red); }
.cv-sequence-step:last-child span { border-color: var(--color-success); }
.cv-sequence-step h3 { margin-top: var(--space-4); color: var(--color-white); font-size: var(--text-h4); }
.cv-sequence-step p { margin-bottom: 0; color: #e7edf0; }
.cv-sequence-step a, .cv-sequence-step a:visited { color: var(--color-white); }
.cv-sequence-step:focus-visible { outline: 3px solid var(--color-blue); outline-offset: 5px; }
.cv-recovery__grid { display: grid; grid-template-columns: minmax(0, 45rem) minmax(0, 1fr); gap: var(--space-6); }
.cv-recovery__grid > * { min-width: 0; }
.cv-recovery__copy { max-width: 45rem; }
.cv-warning-list { display: flex; flex-direction: column; gap: var(--space-3); max-width: 35rem; padding-left: 0; list-style: none; }
.cv-warning-list li { display: grid; grid-template-columns: .75rem minmax(0, 1fr); gap: var(--space-3); }
.cv-warning-list li::before { width: .625rem; height: .625rem; margin-top: .5rem; background: var(--color-red); content: ""; }
.cv-recovery__callout { display: flex; flex-direction: column; gap: var(--space-3); max-width: 38.75rem; margin: var(--space-6) 0; padding: var(--space-5); border-top: 2px solid var(--color-blue); background: var(--color-blue-pale); }
.cv-recovery__callout > * { margin: 0; }
.cv-recovery__field { margin-top: 8rem; border-top: 1px solid rgb(184 194 201 / 65%); background: linear-gradient(100deg, transparent 0 40%, rgb(23 107 155 / 10%) 40% 42%, transparent 42%); }
.cv-assessment > .container > h2 { max-width: 44rem; }
.cv-verdict { margin-top: var(--space-6); border: var(--border-subtle); background: var(--color-white); }
.cv-verdict__strip { padding: var(--space-3) var(--space-5); background: var(--color-asphalt); color: var(--color-white); font-family: var(--font-heading); font-size: var(--text-micro); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.cv-verdict__body { padding: var(--space-5); }
.cv-verdict__body p { max-width: 38.75rem; margin: 0; }
.cv-evidence { display: grid; grid-template-columns: minmax(20rem, 52fr) minmax(20rem, 48fr); gap: var(--space-6); margin-top: var(--space-6); }
.cv-evidence > * { min-width: 0; width: 100%; }
.cv-evidence__value, .cv-evidence__context { padding: var(--space-5); border: var(--border-subtle); }
.cv-evidence__value { background: var(--color-white); }
.cv-evidence__context { background: var(--color-blue-pale); }
.cv-evidence ul { display: flex; flex-direction: column; gap: var(--space-3); margin-bottom: 0; }
.cv-evidence p { margin-bottom: 0; }
.cv-continue__layout { display: grid; grid-template-columns: 9.375rem minmax(0, 1fr); gap: var(--space-4); }
.cv-continue__layout > * { min-width: 0; }
.cv-continue__content { max-width: 64.625rem; }
.cv-continue__intro { max-width: 37.5rem; }
.cv-paths { display: flex; flex-direction: column; margin-top: var(--space-6); border-top: var(--border-subtle); }
.cv-path { display: grid; grid-template-columns: 6rem minmax(0, 32.5rem) minmax(11.25rem, 1fr); gap: var(--space-5); align-items: center; padding: var(--space-5) 0; border-bottom: var(--border-subtle); }
.cv-path > * { min-width: 0; }
.cv-path__number { color: var(--color-asphalt-line); font-family: var(--font-heading); font-size: var(--text-h3); font-weight: 700; }
.cv-path__copy h3 { margin-bottom: var(--space-2); font-size: var(--text-h4); }
.cv-path__copy p { max-width: 32.5rem; margin-bottom: 0; }
.cv-path__action { justify-self: end; font-family: var(--font-heading); font-weight: 600; }
.cv-path__primary { justify-self: end; }
.cv-source { padding-bottom: var(--space-9); }
.cv-source__note { display: flex; flex-direction: column; gap: var(--space-3); max-width: 40rem; margin-left: 10.875rem; padding: var(--space-5); border-top: 2px solid var(--color-blue); background: var(--color-paper); }
.cv-source__note > * { margin: 0; }
.cv-source__note h2 { font-size: var(--text-h4); }
.cv-source__note p { font-size: var(--text-meta); line-height: var(--line-meta); }
@media (max-width: 68.75rem) { .cv-hero__grid { grid-template-columns: minmax(20rem, 48%) minmax(20rem, 52%); gap: var(--space-5); } .cv-rail-layout { grid-template-columns: 6rem minmax(0, 45rem) minmax(0, 1fr); } .cv-loop__grid { grid-template-columns: repeat(2, minmax(20rem, 1fr)); } .cv-principle { grid-template-columns: minmax(0, 40rem) minmax(8rem, 1fr); } }
@media (max-width: 61.25rem) { .cv-loop__grid { grid-template-columns: repeat(2, minmax(20rem, 1fr)); } .cv-sequence__steps { grid-template-columns: repeat(2, minmax(13.75rem, 1fr)); row-gap: var(--space-7); } .cv-sequence__steps::before { display: none; } .cv-path { grid-template-columns: 5rem minmax(0, 1fr); } .cv-path__action, .cv-path__primary { grid-column: 2; justify-self: start; } }
@media (max-width: 51.25rem) { .cv-hero__grid, .cv-loop__grid, .cv-recovery__grid, .cv-evidence { grid-template-columns: 1fr; } .cv-hero__grid { gap: var(--space-6); } .cv-hero__copy { max-width: none; } .cv-hero__media img { aspect-ratio: 4 / 3; } .cv-rail-layout { grid-template-columns: 1fr; gap: var(--space-4); } .cv-zone { font-size: 3rem; } .cv-rail-line, .cv-recovery__field { display: none; } .cv-viewpoints__content { grid-column: 1; } .cv-viewpoints__media img { aspect-ratio: 4 / 3; } .cv-viewpoints__observations { grid-template-columns: 1fr; max-width: none; } .cv-observation { max-width: none; } .cv-loop__heading { max-width: none; } .cv-loop__grid { margin-top: var(--space-5); } .cv-loop__steps { gap: var(--space-5); } .cv-controls__container { gap: var(--space-7); } .cv-principle, .cv-principle--second, .cv-principle--third { grid-template-columns: 1fr; width: 100%; margin-left: 0; } .cv-principle--third { gap: var(--space-3); } .cv-bend-arrow { display: none; } .cv-pace { order: -1; } .cv-reset-mark { width: 2rem; height: .25rem; } .cv-sequence__band { padding: var(--space-5); } .cv-sequence__steps { grid-template-columns: 1fr; gap: var(--space-6); margin-top: var(--space-6); padding-left: 3rem; } .cv-sequence__steps::before { display: block; top: 1.5rem; bottom: 1.5rem; left: 1.45rem; width: 3px; height: auto; } .cv-sequence-step span { position: absolute; top: 0; left: -3rem; width: 2.5rem; height: 2.5rem; } .cv-sequence-step h3 { margin-top: 0; } .cv-continue__layout { grid-template-columns: 1fr; } .cv-path { grid-template-columns: 1fr; gap: var(--space-3); padding: var(--space-5) 0; } .cv-path__action, .cv-path__primary { grid-column: 1; justify-self: stretch; width: 100%; } .cv-path__action { min-height: 3rem; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--color-blue); } .cv-source__note { margin-left: 0; max-width: none; } }
@media (max-width: 43.75rem) { .cv-hero { padding-top: var(--space-7); } .cv-hero__actions { gap: var(--space-3); } .cv-correction, .cv-recovery__callout { padding: var(--space-5); } .cv-viewpoints__close { max-width: none; } .cv-evidence__value, .cv-evidence__context { padding: var(--space-5); } .cv-principle__copy h3 { font-size: var(--text-h4); } }
@media (prefers-reduced-motion: reduce) { .camera-views-page .button span, .camera-views-page .cv-inline-link span, .camera-views-page .cv-path a span { transition: none; } }