/* The hero's quiet surfaces, fine rules and color accents continue below. */
.l-section { padding-block: var(--space-section); }
.c-jp-heading { font-family: var(--sans); font-size: var(--type-section); font-weight: 500; line-height: 1.6; letter-spacing: .025em; text-wrap: balance; }
.c-section-label { align-items: baseline; gap: .75rem; }
.c-section-label > span:last-child { font: 400 var(--type-section-label)/1.15 var(--latin); letter-spacing: -.025em; }
.c-section-label small { display: block; margin-top: .6rem; font: 400 .875rem/1.8 var(--sans); letter-spacing: .04em; }
.l-section-head { grid-template-columns: minmax(13.5rem, 24%) minmax(0, 1fr) auto; margin-bottom: 44px; }
.p-about { border-top: 0; }
.p-about__prose { margin-top: 2rem; }
.p-movie__layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; }
.p-movie video { display: block; max-height: none; object-fit: contain; }
.p-movie__invitation { display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.p-movie__invitation p { font: 400 var(--type-invitation)/1.9 var(--sans); letter-spacing: .035em; }
.p-movie__invitation .c-link { margin: 0; gap: 2rem; }
.p-journal { background: var(--paper); }
.p-journal .l-section { border-top: 1px solid var(--line); }
.p-journal__grid { display: block; }
.p-article { padding-block: 24px; border-color: var(--line); }
.p-article:last-child { border-bottom: 1px solid var(--line); }
.p-article:nth-child(5), .p-article:nth-child(6) { margin: 0; }
.p-article__link { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 32px; min-height: 74px; }
.p-article__image { width: 112px; }
.p-article__image img { aspect-ratio: 4 / 3; filter: none; }
.p-article__text { grid-column: 2; display: grid; grid-template-columns: minmax(120px, 22%) minmax(0, 1fr); align-items: start; gap: 0 24px; padding-right: 40px; }
.p-article__meta { display: flex; flex-direction: column; align-items: start; gap: 8px; margin-bottom: 0; padding-top: 4px; }
.p-article__meta > span { padding: 0; border: 0; }
.p-article h3 { max-inline-size: 42em; font: 500 var(--type-article)/1.75 var(--sans); letter-spacing: .015em; }
.p-article__text > p { grid-column: 2; color: var(--muted); margin-top: 12px; font-size: 1rem; line-height: 1.9; }
.p-article__text > .c-text-link { grid-column: 2; justify-self: start; margin-top: 12px; font-size: .875rem; }
.p-article__text > .c-arrow { top: 6px; bottom: auto; }
.p-contact { background: var(--paper); border-block: 1px solid var(--line); }
.p-contact .c-jp-heading { font-size: clamp(1.625rem, calc(1.125rem + 1.8vw), 2.5rem); }
.p-contact__inner { grid-template-columns: minmax(13.5rem, 24%) minmax(0, 1fr); padding-block: 72px; }
.c-contact-link { grid-column: 2; flex-direction: row-reverse; justify-content: space-between; justify-self: stretch; gap: 2rem; padding: 20px 0; margin-top: 8px; border-block: 1px solid var(--line); }
.c-contact-link > .c-arrow { display: block; width: auto; height: auto; border: 0; border-radius: 0; font-size: 1.8rem; transition: transform .3s; }
.c-contact-link:hover > .c-arrow { color: var(--ink); background: transparent; transform: translate(3px, -3px); }
.c-contact-link > span:last-child { font-size: var(--type-invitation); }
@media (min-width: 801px) and (max-width: 1100px) {
  .l-section-head { grid-template-columns: minmax(13.5rem, 24%) minmax(0, 1fr); }
  .l-section-head > :last-child { grid-column: 2; justify-self: start; margin-top: 0; }
}
@media (max-width: 800px) {
  .c-section-label > span:last-child { font-size: 1.75rem; }
  .l-section-head { grid-template-columns: minmax(0, 1fr) auto; gap: 20px; margin-bottom: 32px; }
  .p-about__body { padding-right: 0; }
  .p-movie__invitation { align-items: start; flex-direction: column; gap: 20px; }
  .p-article__link { grid-template-columns: 88px minmax(0, 1fr); gap: 20px; }
  .p-article__image { width: 88px; }
  .p-article__text { display: block; padding-right: 24px; }
  .p-article__meta { flex-direction: row; flex-wrap: wrap; gap: 12px; margin-bottom: 8px; padding: 0; }
  .p-article__text > .c-arrow { top: auto; bottom: 2px; }
  .p-contact__inner { grid-template-columns: 1fr; }
  .c-contact-link { grid-column: 1; }
}
@media (max-width: 480px) {
  .p-article__link { grid-template-columns: 64px minmax(0, 1fr); gap: 16px; }
  .p-article__image { width: 64px; align-self: start; margin-top: 3px; }
  .p-article h3 { font-size: var(--type-article); }
  .p-article:not(:has(.p-article__image)) .p-article__text { grid-column: 1 / -1; }
}