/* One shared desktop footer rhythm, independent of page-specific layouts. */
@media (min-width: 801px) and (not ((max-width: 1000px) and (max-height: 500px) and (pointer: coarse) and (hover: none))) {
  :root { --desktop-footer-height: 56px; }
  body[class] > footer {
    box-sizing: border-box;
    height: var(--desktop-footer-height);
    min-height: var(--desktop-footer-height);
    flex: 0 0 var(--desktop-footer-height);
    margin: 0;
    padding: 0 4vw;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    font: 400 10px/1.4 Inter, sans-serif;
    letter-spacing: .14em;
  }
  .weekend-story-page main {
    height: calc(100dvh - 72px - var(--desktop-footer-height));
    min-height: 0;
    grid-template-rows: 90px minmax(0, 1fr);
  }
}
/* Preserve readable content when a short window or zoom needs more space. */
@media (min-width: 801px) and (not ((max-width: 1000px) and (max-height: 500px) and (pointer: coarse) and (hover: none))) and (max-height: 680px), (min-width: 801px) and (not ((max-width: 1000px) and (max-height: 500px) and (pointer: coarse) and (hover: none))) and (max-width: 1050px) {
  .weekend-story-page main { height: auto; }
}

/* A shorter closing invitation beneath the desktop letter. */
@media (min-width: 801px) and (not ((max-width: 1000px) and (max-height: 500px) and (pointer: coarse) and (hover: none))) {
  .note-page .note-next { padding: 40px 8vw; }
  .note-page .note-next p { margin-bottom: 12px; font-size: 18px; }
  .note-page .note-next a { font-size: clamp(32px, 3.4vw, 52px); line-height: 1.1; }
}

/* Keep the desktop invitation chapter comfortably within one viewport. */
@media (min-width: 901px) and (not ((max-width: 1000px) and (max-height: 500px) and (pointer: coarse) and (hover: none))) {
  #invitation.v6-statement {
    box-sizing: border-box;
    min-height: calc(100dvh - 72px);
    padding: clamp(28px, 6vh, 64px) 8vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  #invitation .v6-kicker { margin-bottom: clamp(18px, 3vh, 30px); }
  #invitation > h2 { font-size: clamp(56px, min(8.6vw, 15vh), 126px); }
  #invitation .v6-lead {
    max-width: 900px;
    margin: clamp(22px, 4vh, 40px) auto 0;
    font-size: 20px;
    line-height: 1.5;
  }
}
