/**
 * MyPizzaTeacher responsive rules.
 * Media-query literals mirror the breakpoint tokens documented in tokens.css.
 */

/* Tablet navigation: 992px and below. */
@media (max-width: 62rem) {
  .mpt-header__inner {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .mpt-nav--desktop,
  .mpt-header__cta {
    display: none;
  }

  .mpt-menu-toggle {
    display: inline-flex;
  }

  .mpt-grid--thirds,
  .mpt-footer__grid {
    grid-template-columns: var(--grid-halves);
  }

  .mpt-cycle-loop {
    grid-template-columns: var(--grid-single);
  }

  .mpt-cycle-loop__step {
    min-height: auto;
  }

  .mpt-cycle-loop__step:not(:last-child)::after {
    inset-block-start: auto;
    inset-block-end: calc(var(--space-md) * -1);
    inset-inline-end: var(--loop-line-offset);
    transform: translate(var(--loop-line-offset), var(--loop-line-offset)) rotate(var(--rotate-open));
  }
}

/* Large mobile: 768px and below. */
@media (max-width: 48rem) {
  .mpt-container {
    padding-inline: var(--container-pad-tablet);
  }

  .mpt-section {
    padding-block: var(--section-space-mobile);
  }

  .mpt-grid--story,
  .mpt-grid--thirds,
  .mpt-grid--halves,
  .mpt-platform,
  .mpt-material-list,
  .mpt-footer__grid {
    grid-template-columns: var(--grid-single);
  }

  .mpt-hero__choices {
    grid-template-columns: var(--grid-single);
  }

  .mpt-hero__media {
    grid-row: 1;
  }

  .mpt-hero__content {
    grid-row: 2;
  }

  .mpt-pierre__media img,
  .mpt-hero__media img,
  .mpt-section--basil figure img,
  .mpt-photo-placeholder {
    min-height: var(--photo-min-height-mobile);
  }

  .mpt-product,
  .mpt-session-card,
  .mpt-not-card,
  .mpt-checklist,
  .mpt-refund-policy,
  .mpt-pricing,
  .mpt-platform__form,
  .mpt-config-notice {
    padding: var(--space-md);
  }

  .mpt-material-list li {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .mpt-footer__grid {
    gap: var(--space-md);
  }
}

/* Small mobile: 480px and below. */
@media (max-width: 30rem) {
  .mpt-container {
    padding-inline: var(--container-pad-mobile);
  }

  .mpt-button,
  .mpt-hero__choices .mpt-button,
  .mpt-final-cta .mpt-button {
    width: var(--size-full);
  }

  .mpt-header__inner {
    gap: var(--space-sm);
  }

  .mpt-product__facts,
  .mpt-pricing__facts {
    grid-template-columns: var(--grid-single);
  }

  .mpt-statement,
  .mpt-method-quote {
    padding: var(--space-sm);
  }

  .mpt-photo-placeholder,
  .mpt-hero__media img,
  .mpt-pierre__media img,
  .mpt-section--basil figure img {
    box-shadow: var(--shadow-sm);
  }
}