/* FAQ and Policies share the responsive frame used by Booking and YKI. */
html body.policy-page main#main-content.responsive-reading {
  --reading-frame: min(1600px, calc(100% - clamp(48px, 12vw, 320px)));
  --reading-title: clamp(40px, 4.34vw, 84px);
  --reading-gap: clamp(28px, 3.3vw, 64px);
  width: var(--reading-frame); max-width: none; height: auto;
  min-height: calc(100svh - var(--header-height));
  display: grid; grid-template-rows: max-content max-content;
  row-gap: 40px; margin-inline: auto;
  padding: calc(var(--header-height) + 32px) 0 64px;
  overflow: visible;

  & .workspace-heading { margin: 0; }
  & .workspace-heading h1 {
    font-size: var(--reading-title); line-height: 1.02;
    font-weight: 400; letter-spacing: -.045em; text-wrap: balance;
  }
  & .workspace-heading p { font: 300 16px/1.55 var(--sans); margin-top: 18px; }
  & :is(#faq-view, #policies-view) { min-width: 0; padding-top: 12px; }
  & .policy-section {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: var(--reading-gap); row-gap: 24px; padding-block: 32px;
  }
  & .policy-section > :is(h2, h3) {
    min-width: 0; max-width: none;
    font: 400 clamp(29px, 3.2vw, 48px)/1.12 var(--serif);
    letter-spacing: -.04em; text-wrap: balance;
    scroll-margin-top: calc(var(--header-height) + 22px);
  }
  & :is(.faq-list, .policy-copy) { min-width: 0; max-width: none; }
  & .policy-copy p { font: 300 16px/1.55 var(--sans); }
  & .policy-copy p + p { margin-top: 20px; }
  & .policy-updated { font: 400 14px/1.5 var(--sans); margin-bottom: 20px; }
  & .faq-item summary { font: 400 16px/1.5 var(--sans); gap: 20px; padding-block: 20px; }
  & .faq-item:first-child summary { padding-top: 0; }
  & .faq-answer > p:last-child { padding-bottom: 24px; }
}

@media (max-width: 1000px) {
  html body.policy-page main#main-content.responsive-reading {
    --reading-frame: calc(100% - 64px);
    --reading-title: clamp(40px, 5.5vw, 55px);
    --reading-gap: 32px;
    & .policy-section { grid-template-columns: minmax(0, 1fr); }
  }
}

@media (max-width: 767px), (max-width: 1000px) and (max-height: 600px) and (pointer: coarse) {
  html body.policy-page main#main-content.responsive-reading {
    --reading-frame: calc(100% - 2 * var(--phone-gutter, 24px));
    --reading-title: clamp(32px, 9vw, 38px);
    min-height: calc(100svh - 90px); row-gap: 28px;
    padding-top: calc(var(--header-height) + 28px); padding-bottom: 48px;
    & .policy-section { row-gap: 20px; padding-block: 28px; }
    & .policy-section > :is(h2, h3) { font-size: 29px; }
    & .faq-item summary { gap: 18px; padding-block: 18px; }
    & .faq-item:first-child summary { padding-top: 0; }
  }
  html:not(.tablet-portrait) body.policy-page main#main-content.responsive-reading :is(.faq-item summary, .policy-copy p, .policy-updated) {
    font-size: 12.5px;
  }
}