.about-hero { position: relative; margin-top: var(--header); height: calc(100svh - var(--header)); min-height: 420px; color: white; overflow: hidden; background: #262622; }
.about-hero-video, .about-hero-poster, .about-hero-shade, .about-hero-copy { position: absolute; inset: 0; width: 100%; height: 100%; }
.about-hero-video, .about-hero-poster { object-fit: cover; }
.about-hero-shade { background: linear-gradient(90deg, rgba(0,0,0,.3), transparent 80%); pointer-events: none; }
.about-hero-copy { pointer-events: none; }
.about-hero-copy > * { position: absolute; left: var(--text-x); top: var(--text-y); transform: translate(calc(0% - var(--text-x)), calc(0% - var(--text-y))); color: var(--text-color); font-size: var(--text-size); margin: 0; overflow-wrap: anywhere; }
.about-hero-copy > h1 { width: min(780px, 70%); font-family: Georgia, "Noto Serif SC Variable", serif; font-weight: 400; line-height: 1.12; }
.about-hero-copy > p:not(.section-label) { width: min(600px, 65%); line-height: 1.5; }
.about-hero-copy [data-font="noto-serif"] { font-family: "Noto Serif SC Variable", serif; }
.about-hero-copy [data-font="noto-sans"] { font-family: "Noto Sans SC Variable", sans-serif; }
.about-hero-copy [data-font="playfair"] { font-family: "Playfair Display Variable", "Noto Serif SC Variable", serif; }
.about-hero-copy [data-font="montserrat"] { font-family: "Montserrat Variable", "Noto Sans SC Variable", sans-serif; }
.about-hero-copy [data-direction="vertical"] { width: 1em; max-width: 1em; word-break: break-all; line-height: 1.25; text-align: center; }
.about-video-control { position: absolute; z-index: 2; right: 24px; bottom: 24px; width: 44px; height: 44px; border: 1px solid rgba(255,255,255,.6); color: white; background: rgba(0,0,0,.2); display: grid; place-items: center; cursor: pointer; }
.about-video-control:hover { background: rgba(0,0,0,.55); }
.about-content { width: min(1140px, calc(100% - 64px)); margin: 0 auto; padding-bottom: 100px; }
.about-hero[hidden] + .about-content { padding-top: var(--header); }
.about-intro { max-width: 880px; margin: 0 auto; padding: 70px 0; font-size: 15px; line-height: 1.85; color: var(--muted); text-align: center; overflow-wrap: anywhere; }
.about-block { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); align-items: center; }
.about-block-copy { padding: 45px 50px; }
.about-block h2 { margin: 0 0 25px; font: 600 clamp(28px, 2.5vw, 38px)/1.2 "Montserrat Variable", "Noto Sans SC Variable", sans-serif; text-align: center; overflow-wrap: anywhere; }
.about-block h2::after { content: ""; display: block; width: 92px; height: 2px; background: currentColor; margin: 22px auto 0; }
.about-block p { margin: 0; font-size: 15px; line-height: 1.8; color: var(--muted); overflow-wrap: anywhere; }
.about-block figure { min-width: 0; margin: 0; }
.about-block img { width: 100%; height: auto; display: block; }
.about-block.image-left figure { grid-column: 1; grid-row: 1; }
.about-block.image-left .about-block-copy { grid-column: 2; grid-row: 1; }
.about-block.image-only, .about-block.text-only, .about-block.no-image, .about-block.no-copy { grid-template-columns: 1fr; }
.about-block.image-only figure, .about-block.text-only figure, .about-block.no-copy figure { grid-column: 1; grid-row: auto; }
.about-block.text-only .about-block-copy, .about-block.no-image .about-block-copy { max-width: 880px; margin: auto; grid-column: 1; grid-row: auto; text-align: center; }
.about-editor-video { width: 100%; max-height: 200px; display: block; margin-bottom: 12px; background: #222; }
@media (max-width: 1100px) { .site-header { gap: 20px; } .about-block-copy { padding: 30px; } }
@media (max-width: 820px) {
  .about-hero { height: auto; min-height: 0; aspect-ratio: var(--about-media-ratio, 16 / 9); }
  .about-hero-video, .about-hero-poster { object-fit: contain; }
  .about-hero-copy > * { font-size: clamp(7px, calc(var(--text-size) * .42), var(--text-size)); }
  .about-hero-copy > h1 { width: 70%; }
  .about-hero-copy > p:not(.section-label) { width: 65%; }
  .about-content { width: calc(100% - 28px); padding-bottom: 50px; }
  .about-intro { padding: 32px 8px; font-size: 13px; }
  .about-block { grid-template-columns: 1fr; margin-bottom: 26px; }
  .about-block-copy, .about-block.image-left .about-block-copy { grid-column: 1; grid-row: 1; padding: 24px 12px; }
  .about-block figure, .about-block.image-left figure { grid-column: 1; grid-row: 2; }
  .about-block h2 { font-size: 26px; margin-bottom: 18px; }
  .about-block h2::after { margin-top: 16px; width: 64px; }
  .about-block p { font-size: 13px; }
  .about-video-control { width: 32px; height: 32px; right: 10px; bottom: 10px; }
}
@media (max-width: 640px) {
  .about-hero-copy > * { font-size: clamp(6px, calc(var(--text-size) * .28), var(--text-size)); }
  .about-hero-copy > .section-label { font-size: clamp(8px, calc(var(--text-size) * .35), 12px); }
  .about-hero-copy > p:not(.section-label) { font-size: clamp(9px, calc(var(--text-size) * .35), 14px); }
}