/* An opening letter, composed like a sheet of printed paper. */
.entry-editorial { padding:26px 36px 30px; background:var(--sheet); color:var(--paper); grid-template-rows:auto 1fr; cursor:pointer; isolation:isolate; }
.entry-editorial::after { opacity:.065; mix-blend-mode:multiply; }
.entry-editorial .entry-top { width:min(100%,620px,calc(77svh - 60px)); padding-bottom:17px; border:0; }
.entry-editorial .entry-top .wordmark { font-size:14px; font-weight:650; letter-spacing:1px; }
.entry-editorial .entry-timecode { position:static; color:#8d8372; opacity:1; font-size:8px; letter-spacing:.5px; }
.entry-editorial .entry-visuals::after { background:linear-gradient(112deg,#cbbda615,transparent 42%,#ffffff30); }
.paper-light { position:absolute; inset:-15%; background:radial-gradient(ellipse at var(--light-x,50%) var(--light-y,50%),#ffffffb8,transparent 54%); opacity:.55; }
.entry-editorial .entry-sweep { background:linear-gradient(90deg,transparent,#ffffff1a,#ffffff60,transparent); opacity:.5; }
.entry-editorial .entry-motes i { background:#857860; opacity:.16; }
.entry-editorial .entry-content { width:min(100%,620px,calc(77svh - 60px)); margin-inline:auto; padding:28px 0 4px; text-align:left; transform:perspective(1500px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)); transform-origin:50% 50%; }
.cover-kicker { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:23px; color:#797364; font-size:10px; letter-spacing:1.3px; }
.cover-kicker .mono { font-size:8px; color:var(--cinema-accent); letter-spacing:.7px; padding:0; border:0; }
.entry-editorial .entry-content h2 { --display-size:clamp(88px,11.7vh,132px); margin:0; color:#272b25; font-size:var(--display-size); font-family:var(--font-ui); font-weight:400; line-height:1.03; letter-spacing:0; animation:none; }
.entry-editorial .entry-title-line { display:flex; justify-content:space-between; align-items:baseline; width:100%; padding:0; white-space:nowrap; animation:title-arrive 1s cubic-bezier(.16,1,.3,1) both; }
.entry-editorial .entry-title-line+.entry-title-line { margin-top:8px; padding-left:.1em; }
.cover-heavy { font-family:var(--font-ui); font-weight:850; font-size:1em; letter-spacing:-.085em; padding-right:.075em; }
.cover-fine { font-family:var(--font-editorial); font-weight:500; font-size:1.01em; letter-spacing:-.095em; padding-right:.075em; }
.entry-title-line:nth-child(2) .cover-fine { font-size:1.07em; }
.entry-title-line:nth-child(2) .cover-heavy { font-size:.93em; }
.cover-spread { display:grid; grid-template-columns:104px minmax(0,1fr); column-gap:34px; min-height:234px; margin-top:36px; }
.cover-margin { display:flex; align-items:center; flex-direction:column; justify-content:space-between; padding:2px 0 0; border:0; }
.cover-margin-label { color:var(--cinema-accent); font-size:8px; letter-spacing:2px; }
.cover-vertical { writing-mode:vertical-rl; text-orientation:upright; font-family:var(--font-editorial); font-size:32px; letter-spacing:.22em; line-height:1.1; color:#676253; padding-top:.2em; }
.cover-margin-foot { font-size:7px; line-height:1.7; letter-spacing:1.2px; color:#9b917f; text-align:center; }
.cover-invitation { display:flex; flex-direction:column; align-items:stretch; justify-content:space-between; gap:14px; margin:0; padding-top:0; border:0; }
.cover-note-label { font-size:9px; font-weight:600; color:#8c7c68; letter-spacing:1px; }
.entry-editorial .entry-description { margin:0; color:#656153; font-family:var(--font-ui); animation:title-arrive 1s .25s both; }
.cover-note-lead { display:block; font-family:var(--font-editorial); font-weight:500; font-size:24px; letter-spacing:-.4px; line-height:1.65; }
.cover-note-body { display:block; font-family:var(--font-ui); font-size:13px; font-weight:350; line-height:1.95; letter-spacing:.3px; margin-top:9px; }
.cover-enter { display:flex; align-items:center; justify-content:space-between; flex-shrink:0; gap:18px; margin-top:8px; padding-top:14px; border:0; color:#393d33; font-size:14px; font-weight:650; }
.cover-enter-arrow { display:block; font-family:var(--font-editorial); font-size:35px; font-weight:500; line-height:1; padding:0 2px 3px 10px; color:var(--cinema-accent); transition:transform .25s; }
.cover-bottom-line { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-top:23px; color:#9a907e; font-size:8px; letter-spacing:.3px; }
.cover-bottom-line .mono { font-size:7px; letter-spacing:.5px; }
.entry-hit-area { position:absolute; z-index:10; inset:0 0 auto; width:100%; min-height:100%; height:100%; display:block; border:0; padding:0; margin:0; background:transparent; cursor:pointer; touch-action:pan-y pinch-zoom; }
.entry-hit-area:focus-visible { outline:none; }
.entry-editorial:focus-within .cover-enter { color:var(--cinema-accent); }
@media(hover:hover) {
  .entry-editorial:has(.entry-hit-area:hover) .cover-enter-arrow { transform:translate(4px,-3px); }
}
.entry-editorial.is-launching .entry-content { animation:paper-launch .7s cubic-bezier(.6,0,.3,1) forwards; }
@keyframes paper-launch { to { transform:perspective(1500px) translateY(-22px) rotateX(5deg); opacity:0; filter:blur(3px); } }

.hero-description { font-size:14px; line-height:1.95; }
.letter-body { max-width:35em; line-height:2.12; }
.letter-body>p { margin-bottom:25px; }
.section-intro>p { line-height:2; }
@media(max-width:760px) {
  .entry-editorial { padding:22px 24px 26px; }
  .entry-editorial .entry-top { width:100%; padding-bottom:14px; }
  .entry-editorial .entry-top .wordmark { font-size:14px; }
  .entry-editorial .entry-timecode { font-size:7px; }
  .entry-editorial .entry-content { width:100%; padding:28px 0 4px; }
  .cover-kicker { margin-bottom:22px; font-size:9px; letter-spacing:.7px; gap:8px; }
  .cover-kicker .mono { font-size:6px; padding:0; letter-spacing:.4px; }
  .entry-editorial .entry-content h2 { --display-size:clamp(60px,21.3vw,92px); line-height:1.03; }
  .entry-editorial .entry-title-line+.entry-title-line { margin-top:6px; }
  .cover-spread { grid-template-columns:61px minmax(0,1fr); gap:20px; min-height:214px; margin-top:31px; }
  .cover-margin-label { font-size:7px; letter-spacing:.7px; }
  .cover-vertical { font-size:26px; letter-spacing:.21em; padding-top:.18em; }
  .cover-margin-foot { font-size:6px; line-height:1.7; letter-spacing:.6px; }
  .cover-invitation { padding-top:0; gap:10px; }
  .cover-note-label { font-size:8px; letter-spacing:.7px; }
  .cover-note-lead { font-size:19px; letter-spacing:-.3px; }
  .cover-note-body { font-size:12px; line-height:1.9; margin-top:8px; }
  .cover-enter { font-size:12px; gap:10px; padding-top:12px; }
  .cover-enter-arrow { font-size:30px; }
  .cover-bottom-line { margin-top:21px; font-size:7px; letter-spacing:.1px; gap:8px; }
  .cover-bottom-line .mono { font-size:6px; letter-spacing:.3px; }
  .hero-description { font-size:13px; }
  .letter-body { font-size:14px; line-height:2.04; }
  .letter-body>p { margin-bottom:23px; }
  .memory figcaption p { font-size:11px; }
}
@media(max-width:760px) and (max-height:700px) {
  .entry-editorial { padding-top:16px; padding-bottom:18px; }
  .entry-editorial .entry-content { padding-top:18px; }
  .cover-kicker { margin-bottom:16px; }
  .entry-editorial .entry-content h2 { --display-size:clamp(53px,19.3vw,79px); }
  .cover-spread { grid-template-columns:50px minmax(0,1fr); gap:16px; min-height:184px; margin-top:24px; }
  .cover-vertical { font-size:23px; }
  .cover-invitation { padding-top:0; }
  .cover-note-lead { font-size:17px; }
  .cover-note-body { font-size:11px; margin-top:6px; }
  .cover-bottom-line { margin-top:16px; }
}
@media(min-width:761px) and (max-height:820px) {
  .entry-editorial .entry-top,.entry-editorial .entry-content { width:min(100%,560px,calc(76svh - 60px)); }
  .entry-editorial .entry-content { padding-top:20px; }
  .entry-editorial .entry-content h2 { --display-size:clamp(76px,11vh,106px); }
  .cover-spread { grid-template-columns:85px minmax(0,1fr); gap:27px; min-height:212px; margin-top:25px; }
  .cover-vertical { font-size:28px; }
  .cover-note-lead { font-size:21px; }
  .cover-bottom-line { margin-top:18px; }
}
@media(min-width:761px) and (max-height:500px) {
  .entry-editorial .entry-top,.entry-editorial .entry-content { width:min(100%,480px); }
  .entry-editorial .entry-content h2 { --display-size:78px; }
}
@media(prefers-reduced-motion:reduce) {
  html:not(.motion-full) .entry-editorial .entry-content { transform:none; }
  html:not(.motion-full) .entry-editorial.is-launching .entry-content { animation:none !important; }
}
