.image-statement { position: relative; height: 100svh; min-height: 0; display: grid; place-items: center; color: var(--color-white); }
.image-statement__frame { position: relative; isolation: isolate; display: flex; align-items: flex-end; justify-content: center; width: 80vw; height: 76%; padding-block: var(--section-space); border-radius: var(--radius-hero); overflow: hidden; transform: translateZ(0); }
@media (min-width: 783px) { .admin-bar .image-statement { height: calc(100svh - var(--wp-admin--admin-bar--height, 32px)); } }
@media (min-width: 601px) and (max-width: 782px) { .admin-bar .image-statement { height: calc(100svh - var(--wp-admin--admin-bar--height, 46px)); } }
.image-statement__frame::after { content: ''; position: absolute; inset: 0; background: rgb(0 0 0 / 70%); z-index: 1; pointer-events: none; }
.image-statement__image, .image-statement__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.image-statement__video { pointer-events: none; }
@media (prefers-reduced-motion: reduce) { .image-statement__video { display: none; } }
.image-statement__picture { position: absolute; inset: 0; z-index: 0; }
.image-statement__picture .image-statement__image { z-index: auto; }
.image-statement__copy { position: relative; z-index: 2; display: grid; flex: 0 0 auto; width: min(var(--content-width), calc(100vw - 2 * var(--page-gutter))); margin-inline: 0; gap: var(--space-13); min-height: 0; max-height: 100%; overflow-y: auto; transform: scale(0.8); transform-origin: center bottom; }
.image-statement h2 { max-width: 462px; margin: 0; font-size: var(--text-h3); line-height: var(--leading-h3); font-weight: var(--font-weight-regular); }
.image-statement__copy > div { max-width: 819px; font-size: var(--text-h3); line-height: var(--leading-h3); }
.image-statement p { margin: 0; }
@media(max-width:767px) { .image-statement__frame { width: 100%; height: 100%; padding-block: var(--space-9); border-radius: 0; } .image-statement__copy { gap: var(--space-8); transform: none; } .image-statement h2, .image-statement__copy > div { font-size: var(--text-h4); line-height: var(--leading-h4); font-weight: var(--font-weight-medium); } }
@media(max-width:767px) { .image-statement__picture .image-statement__image { object-position: center; } }
