/* Homepage-only wide-screen edition.
   Reversible: remove its stylesheet link from index.html.
   Keep --pad and all cover internals in style.css unchanged. */
@media (min-width: 768px) {
  body {
    --desktop-gutter: clamp(32px, 5vw, 100px);
    max-width: none;
    border-inline: 0;
  }

  .glass-nav {
    max-width: none;
    padding-inline: var(--desktop-gutter);
  }

  .vogue-cover {
    min-height: 100svh;
  }

  .vogue-cover__content {
    /* Fit the available browser height, including when its toolbars are visible.
       Normal flow lets exceptionally short windows scroll without clipping text. */
    position: relative;
    inset: auto;
    flex: 1;
    padding: clamp(72px, 10svh, 100px) var(--desktop-gutter)
      clamp(48px, 10svh, 100px);
  }

  .vogue-cover__golden-box {
    height: auto;
    flex: 1;
    min-height: 0;
    max-height: none;
    gap: clamp(24px, 5svh, 48px);
  }

  .vogue-cover__masthead {
    width: min(48%, 650px, 90svh);
  }

  .vogue-cover__bottom-group {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 380px);
    column-gap: 64px;
    row-gap: 28px;
    align-items: end;
  }

  .vogue-cover__title {
    grid-row: span 2;
    font-size: min(clamp(52px, 5.6vw, 96px), 10svh);
    line-height: 0.9;
    margin: 0;
    align-self: end;
  }

  .vogue-cover__subtitle {
    max-width: none;
  }

  .vogue-cover__subtitle p {
    font-size: 20px;
    line-height: 1.3;
  }

  .vogue-hero-plates {
    margin-top: 0;
  }

  :is(.section-essential, .section-curated, .section-fleet, .section-noticeboard, .section-events) {
    padding-block: 88px 64px;
    scroll-margin-top: 80px;
  }

  main > section > .section-header {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(260px, 1fr);
    column-gap: 64px;
    row-gap: 18px;
    padding-inline: var(--desktop-gutter);
    margin-bottom: 44px;
    align-items: end;
  }

  main > section > .section-header .section-number {
    grid-column: 1 / -1;
    margin: 0;
    font-size: 11px;
    letter-spacing: 0.24em;
  }

  main > section > .section-header .section-title {
    margin: 0;
    font-size: clamp(42px, 4.6vw, 76px);
    font-weight: 400;
    line-height: 1.02;
    letter-spacing: -0.035em;
    text-wrap: balance;
  }

  main > section > .section-header .section-subhead {
    max-width: 460px;
    margin: 0;
    font-size: 14px;
    line-height: 1.7;
  }

  main > section > .section-header .section-divider {
    grid-column: 1 / -1;
    width: 100%;
    margin-top: 10px;
    opacity: 0.25;
  }

  /* Fixed magazine covers, matching the original 440px page canvas.
     Only the rails expand; images, headlines, prices and buttons are untouched. */
  .swipe-track, .event-invitations-track {
    gap: 28px;
    padding-inline: var(--desktop-gutter);
    scroll-padding-inline: var(--desktop-gutter);
    padding-bottom: 28px;
    scrollbar-width: thin;
    scrollbar-color: var(--gold) transparent;
  }

  .swipe-track::-webkit-scrollbar,
  .event-invitations-track::-webkit-scrollbar {
    display: block;
    height: 8px;
  }

  .swipe-track::-webkit-scrollbar-thumb,
  .event-invitations-track::-webkit-scrollbar-thumb {
    background: var(--gold);
    border-radius: 4px;
  }

  .swipe-track::-webkit-scrollbar-track,
  .event-invitations-track::-webkit-scrollbar-track {
    margin-inline: var(--desktop-gutter);
  }

  .essential-card { flex-basis: 320px; }
  .premium-card, .announcement-card { flex-basis: 332px; }
  .fleet-card { flex-basis: 328px; }
  .event-invitation-item { flex-basis: 336px; }

  .notice-empty { width: 100%; }

  .btn-post-notice {
    width: 332px;
    margin-left: var(--desktop-gutter);
    margin-right: var(--desktop-gutter);
  }

  .notice-footnote {
    text-align: left;
    padding-inline: var(--desktop-gutter);
  }

  .section-faq {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr);
    gap: 80px;
    padding: 96px var(--desktop-gutter);
  }

  main > .section-faq > .section-header {
    display: block;
    padding: 0;
    margin: 0;
    align-self: start;
  }

  .section-faq .section-number { display: block; }
  main > .section-faq > .section-header .section-title { margin-block: 24px; }
  .section-faq .section-divider { display: none; }
  .faq-list { margin-top: 0; }
  .faq-question__text { font-size: 24px; font-weight: 400; }
}

@media (min-width: 768px) and (max-width: 1100px) {
  .vogue-cover__bottom-group { column-gap: 32px; }
  .vogue-cover__title { font-size: 48px; }
  main > section > .section-header { column-gap: 32px; }
  .section-faq { gap: 40px; grid-template-columns: 1fr 1.3fr; }
}
