/* Customer pages on large desktop screens. Keep the existing cascade intact below
   1440px (including the 1366px laptop layout), and leave print and staff untouched.
   --padx also aligns the public header/footer with the page's content. */
@media screen and (min-width:1440px) {
  body:not(.is-staff):has(#main > :is(.pg-page,.in-page,.qp-page)) {
    --padx:max(4vw,calc((100vw - 1680px) / 2));
  }

  /* The hero's photo column can now use its full allocation. Keep the carousel's
     own geometry, animations and reduced-motion rules in pages.css unchanged. */
  .hp-hero--rebuild .hp-photo-panel:has(.hp-photo-orbit) {
    width:100%;
    max-width:none;
  }

  /* Match gallery row heights to the wider columns; the original 1320px ceiling
     would otherwise flatten the same photo arrangement on a large desktop. */
  .gv-page .gv-grid {
    grid-auto-rows:calc((100vw - 2 * var(--padx) - 12px) / 8);
  }

  /* Quote steps retain their two-column fields and three-column food choices.
     Spend the additional space on the form, with a bounded guidance column. */
  .qp-page .quote-layout {
    grid-template-columns:minmax(0,1fr) 340px;
    gap:48px;
  }
  .qp-page .form-section > p,
  .qp-page .review-group p {
    max-width:70ch;
  }

  /* Sign-in stays compact; registration uses the extra space for paired fields. */
  .in-page .auth-grid {
    max-width:none;
    grid-template-columns:minmax(0,2fr) minmax(0,3fr);
    gap:40px;
  }
  .in-page .guest-band {
    max-width:none;
  }
  .in-page #account-register .auth-fields,
  .in-page .account-columns .auth-fields {
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-items:start;
    gap:20px 24px;
  }
  .in-page .login-card > p {
    max-width:70ch;
  }

  /* Vacancies are self-contained articles; keep each article's reading measure. */
  .in-page .vacancy-list {
    max-width:none;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:32px;
    align-items:start;
  }
  .in-page .vacancy-list > :not(.vacancy-card) {
    grid-column:1 / -1;
  }

  /* Legal sections flow in DOM order across rows, with whole sections in each
     column. Their existing 70ch paragraph limit remains in inner.css. */
  .in-page .privacy-content {
    max-width:none;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:64px;
    align-items:start;
  }
  .in-page .privacy-content > .legal-updated {
    grid-column:1 / -1;
  }
  .in-page:has(.privacy-content) .in-head {
    max-width:none;
  }

  /* This section had a 760px cap plus viewport gutters inside that cap. Put the
     gutters outside the reading space, as on the rest of the customer pages. */
  .in-page > .support-faq {
    max-width:none;
    margin-inline:0;
  }
  .in-page .support-faq > h2,
  .in-page .support-faq > h3,
  .in-page .support-faq > p,
  .in-page .support-faq .faq-item {
    max-width:75ch;
  }
  .in-page .support-layout {
    grid-template-columns:380px minmax(0,1fr);
    gap:40px;
  }
  .in-page .support-signed-out {
    grid-template-columns:minmax(0,1fr) 380px;
    gap:40px;
  }
  .in-page .support-chat .bubble {
    max-width:min(80%,70ch);
  }

  /* The standalone viewing page previously nested viewport gutters inside a
     1040px wrapper. Use the shared page gutters just once, then a three-column
     form: contact details, a two-column calendar, and the visit details beside it. */
  .pg-page.viewing-page {
    max-width:none;
    padding-inline:0;
  }
  .viewing-page .vf-page-form {
    width:calc(100% - 2 * var(--padx));
    max-width:none;
  }
  .viewing-page .vf-grid {
    grid-template-columns:repeat(3,minmax(0,1fr));
    align-items:start;
    gap:24px;
  }
  .viewing-page .vf-calendar-field {
    grid-column:1 / 3;
    grid-row:2 / span 3;
  }
  .viewing-page .vf-field:has(#vf-note) {
    grid-column:1 / -1;
    max-width:80ch;
  }
  .viewing-page .vf-consent {
    max-width:80ch;
  }

  /* Two feedback questions per row instead of one 760px form. The rating and
     instructions remain full rows, with comfortable measures for text. */
  .in-page .feedback-page > .feedback-form {
    max-width:none;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:24px 48px;
    align-items:start;
  }
  .in-page .feedback-page > .feedback-form > :not(.field) {
    grid-column:1 / -1;
  }
  .in-page .feedback-page .feedback-form > p {
    max-width:70ch;
  }
  .in-page .feedback-page .feedback-rating-options {
    max-width:760px;
  }
  .in-page .feedback-page .feedback-form > .pg-btn {
    justify-self:start;
  }
}
