/* Interior-page layouts for the desktop VTEST. Phone layouts stay in style.css. */
@media (min-width: 1024px) {
  .page-heading {
    padding: 25px clamp(40px, 5vw, 96px) 27px;
  }
  .page-heading h1 {
    font-size: 40px;
    line-height: 1.08;
  }
  .page-heading > p {
    font-size: 21px;
    margin-top: 6px;
  }
  .page-intro {
    padding: 56px clamp(40px, 5vw, 80px);
    max-width: 1440px;
  }
  .reading {
    max-width: 62ch;
  }
  .reading p {
    font-size: 16px;
    line-height: 1.45;
  }
  .reading h2 {
    font-size: clamp(34px, 3vw, 44px);
    line-height: 1.08;
    margin-bottom: 22px;
  }

  /* Three equally weighted cantines, with their existing colour fields. */
  .page-restaurants .restaurant-directory {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .page-restaurants .directory-venue {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    padding: 48px clamp(24px, 2.6vw, 50px) 56px;
  }
  .page-restaurants .directory-venue > a:not(.button) {
    display: flex;
    justify-content: center;
  }
  .page-restaurants .directory-venue .venue-card-image {
    flex: none;
    width: 115%;
    max-width: 598px;
    margin: 0;
    aspect-ratio: 1.15;
  }
  .page-restaurants .venue-lockup {
    padding: 16px;
  }
  .page-restaurants .venue-lockup img {
    width: 88%;
    max-width: 355px;
  }
  .page-restaurants .venue-lockup .lockup-name {
    font-size: clamp(27px, 2.7vw, 46px);
  }
  .page-restaurants .venue-lockup .lockup-thanks {
    font-size: clamp(17px, 1.3vw, 22px);
  }
  .page-restaurants .directory-venue .directory-location {
    font-size: 31px;
    margin: 30px 0 10px;
  }
  .page-restaurants .directory-venue p {
    font-size: 15px;
    line-height: 1.45;
    min-height: 44px;
    margin-bottom: 28px;
  }
  .page-restaurants .directory-venue > .button {
    align-self: center;
    margin-top: auto;
    min-width: 210px;
  }

  /* Restaurant information remains centred over its own existing photograph. */
  .page-venue .venue-hero {
    display: grid;
    align-items: center;
    min-height: min(850px, calc(100svh - var(--header)));
    padding: 56px 48px;
  }
  .page-venue .venue-hero-inner {
    width: 100%;
    max-width: 960px;
  }
  .page-venue .venue-hero h1 {
    font-size: clamp(56px, 5.5vw, 82px);
    margin-bottom: 12px;
  }
  .page-venue .venue-hero .venue-thai {
    font-size: 26px;
    margin-bottom: 24px;
  }
  .page-venue .venue-hero .address {
    font-size: 18px;
    margin-bottom: 22px;
  }
  .page-venue .venue-hero h2 {
    font-size: 29px;
    margin: 20px 0 12px;
  }
  .page-venue .venue-hero .hours {
    margin-bottom: 12px;
  }
  .page-venue .venue-actions {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    max-width: 900px;
    margin: 34px auto 0;
  }
  .page-venue .venue-actions .button {
    min-height: 58px;
    padding: 16px;
    font-size: 23px;
  }
  .page-venue .venue-story {
    padding: 64px 48px 56px;
  }
  .page-venue .venue-story h2 {
    max-width: 32ch;
    font-size: clamp(40px, 3.5vw, 56px);
    margin-bottom: 26px;
  }
  .page-venue .venue-story p {
    max-width: 68ch;
    line-height: 1.45;
  }
  .page-venue .venue-story p[lang="th"] {
    font-size: 24px;
    margin: 26px auto 0;
  }
  .page-venue .venue-gallery {
    max-width: 1440px;
    margin: 0 auto;
  }
  .page-venue .venue-gallery img {
    height: clamp(340px, 34vw, 520px);
    aspect-ratio: auto;
    object-fit: cover;
  }

  /* An open three-column menu; prices and dish content retain their order. */
  .page-menu .page-intro {
    padding-top: 36px;
    padding-bottom: 36px;
    text-align: center;
  }
  .page-menu .page-intro .reading {
    max-width: 76ch;
  }
  .page-menu .page-intro p {
    margin: 0;
  }
  .page-menu .menu-categories {
    justify-content: center;
    gap: clamp(36px, 5vw, 80px);
    padding-inline: 40px;
    top: var(--header);
  }
  .page-menu .menu-categories a {
    font-size: 25px;
    padding: 19px 0;
  }
  .page-menu .food-section {
    max-width: 1440px;
    padding: 58px clamp(40px, 5vw, 80px) 66px;
    scroll-margin-top: calc(var(--header) + 90px);
  }
  .page-menu .food-section > h2 {
    font-size: clamp(40px, 3.5vw, 54px);
    margin-bottom: 32px;
  }
  .page-menu .food-section > h2 [lang="th"] {
    font-size: 24px;
    margin-top: 8px;
  }
  .page-menu .food-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 54px 32px;
  }
  .page-menu .food-card img {
    aspect-ratio: 1.5;
  }
  .page-menu .food-card h3 {
    font-size: 33px;
    margin-top: 21px;
  }
  .page-menu .food-card h3 [lang="th"] {
    font-size: 20px;
  }
  .page-menu .food-card .description {
    font-size: 14px;
    line-height: 1.5;
    margin: 14px 0 18px;
  }
  .page-menu .food-card li {
    padding: 11px 0;
    gap: 12px;
  }
  .page-menu #food-4 {
    border-top: 1px solid #0003;
  }
  .page-menu #food-4 .reading {
    margin: 0;
    max-width: 80ch;
  }

  /* Editorial introductions share the screen with an uncropped photograph. */
  .page-story main,
  .page-jobs main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
  }
  .page-story main > .page-heading,
  .page-jobs main > .page-heading,
  .page-story main > .color-panel,
  .page-jobs main > .color-panel {
    grid-column: 1 / -1;
    width: 100%;
  }
  .page-story main > .page-intro,
  .page-jobs main > .page-intro {
    width: 100%;
    padding: 64px clamp(40px, 5vw, 96px);
  }
  .page-story main > .page-intro .reading,
  .page-jobs main > .page-intro .reading {
    max-width: 52ch;
  }
  .page-story main > .editorial-photo {
    width: 100%;
    height: auto;
    max-height: 620px;
    object-fit: contain;
    padding: 40px clamp(40px, 5vw, 96px) 40px 0;
  }
  .page-jobs main > figure {
    width: 100%;
    max-width: 960px;
    margin: 40px auto;
    padding: 0 clamp(40px, 5vw, 96px) 0 0;
  }
  .page-jobs main > figure .editorial-photo {
    width: 100%;
    height: auto;
    max-height: 600px;
    object-fit: contain;
  }
  .page-jobs main > figure figcaption {
    padding: 10px 0 0;
    font-size: 11px;
  }
  .page-story main > .color-panel,
  .page-jobs main > .color-panel {
    padding: 64px 48px;
  }
  .page-gluten .page-intro {
    padding-top: 48px;
    padding-bottom: 48px;
  }
  .page-gluten .split {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: stretch;
  }
  .page-gluten .split > .color-panel {
    display: grid;
    align-items: center;
    padding: 64px clamp(40px, 5vw, 96px);
  }
  .page-gluten .split .reading {
    max-width: 52ch;
  }
  .page-gluten .split > .editorial-photo {
    width: 100%;
    height: 100%;
    min-height: 500px;
    max-height: none;
    object-fit: cover;
    object-position: center;
  }

  /* Press remains a list of publications, without boxed cards. */
  .page-press .page-intro {
    max-width: 1360px;
    padding-bottom: 42px;
  }
  .page-press .page-intro .reading {
    max-width: 70ch;
    margin-left: 0;
  }
  .page-press .press-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 clamp(32px, 4vw, 64px);
    max-width: 1360px;
    margin: 0 auto;
    padding: 0 clamp(40px, 5vw, 80px) 64px;
  }
  .page-press .press-item {
    grid-template-columns: minmax(100px, 140px) minmax(0, 1fr);
    gap: 24px;
    align-items: center;
    padding: 30px 0;
  }
  .page-press .press-item > img {
    width: 140px;
    height: 96px;
    object-fit: contain;
    object-position: left center;
  }
  .page-press .press-item p {
    font-size: 14px;
    line-height: 1.45;
    margin-bottom: 15px;
  }
  .page-press .press-item a {
    font-size: 13px;
    line-height: 1.5;
  }
  .page-press main > .color-panel {
    padding: 56px 48px;
  }

  .page-merch .page-intro {
    max-width: 1120px;
    padding-top: 56px;
    padding-bottom: 80px;
  }
  .page-merch .merch-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 32px;
  }
  .page-merch .merch-item h2 {
    font-size: 32px;
    margin: 24px 0 10px;
  }
  .page-merch .merch-item p {
    font-size: 14px;
  }
  .page-order .page-intro {
    max-width: 1440px;
    padding-top: 72px;
    padding-bottom: 80px;
  }
  .page-order .order-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 40px;
  }
  .page-order .order-card {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    text-align: center;
    padding-bottom: 32px;
  }
  .page-order .order-card h2 {
    font-size: clamp(32px, 2.5vw, 42px);
  }
  .page-order .order-card p {
    font-size: 15px;
    margin: 14px 0 28px;
  }
  .page-order .order-card .button {
    margin-top: auto;
    min-width: 200px;
  }
  .page-legal .page-intro {
    padding-top: 64px;
    padding-bottom: 80px;
  }
  .page-legal .reading {
    max-width: 70ch;
  }
  .page-legal .reading h2 {
    margin-top: 38px;
    font-size: 32px;
  }
}

@media(min-width:1024px){
 .page-story main{display:block}
 .spirit-copy{padding:48px clamp(36px,4vw,76px) 56px}
 .spirit-title{margin-bottom:30px}
 .spirit-title h1{font-size:clamp(40px,4vw,60px);max-width:11ch}
 .spirit-title p{font-size:24px;padding-top:6px}
 .spirit-copy p{font-size:16px;line-height:1.5}
 .spirit-copy .spirit-lead{font-size:20px;line-height:1.4}
 .spirit-copy h2{font-size:32px}
 .spirit-layout{min-height:calc(100svh - var(--header))}
 .page-order .page-intro{padding-top:40px}
 .page-order .order-card .order-photo h2{font-size:clamp(32px,3vw,44px)}
 .page-order .order-card .order-photo h2 span{font-size:.68em}
 .page-order .order-card>p{min-height:45px}
}
@media(min-width:1024px){.spirit-copy .spirit-title p{font-size:24px}}