/* Phone layouts for the supporting public pages. Load after the page styles.
   Keep offer details and form content intact; reduce repeated visual weight. */
@media (max-width: 600px) {
  .editorial .page-hero {
    padding-block: 34px 38px;
  }

  .editorial :is(.page-hero, .page-hero.narrow) h1,
  .editorial .library-hero h1,
  .editorial .gd-hero h1 {
    font-size: clamp(38px, 10.5vw, 48px);
    line-height: 1.06;
    letter-spacing: -.045em;
    text-wrap: balance;
  }

  .editorial :is(.eyebrow, .mini-label, .gd-kicker) {
    margin-bottom: 18px;
  }

  .editorial .lede {
    font-size: 18px;
    line-height: 1.55;
    margin-top: 22px;
  }

  .editorial .section {
    padding-block: 48px;
  }

  .editorial .section-head {
    gap: 18px;
    margin-bottom: 28px;
  }

  .editorial .section-head h2,
  .editorial .service-detail h2 {
    font-size: clamp(32px, 9vw, 39px);
    line-height: 1.12;
  }

  .editorial .split {
    gap: 28px;
  }

  .editorial .story p,
  .editorial .service-detail p {
    font-size: 17px;
  }

  .editorial .service-detail {
    padding-block: 34px;
    gap: 22px;
  }

  .editorial .steps,
  .editorial .feature-list {
    gap: 26px;
    margin-top: 32px;
  }

  .editorial .steps li:before {
    margin-bottom: 18px;
  }

  .editorial .faq details {
    padding-block: 22px;
  }

  .editorial .faq summary {
    min-height: 44px;
    align-content: center;
    font-size: 21px;
  }

  /* Offers retain all inclusions, prices, billing bases and next steps. */
  .editorial .service-option-heading,
  .editorial .service-option-body,
  .editorial .pricing-offer {
    padding: 24px;
  }

  .editorial .service-options .service-option h2 {
    font-size: clamp(31px, 8.8vw, 37px);
  }

  .editorial .pricing-offer h3 {
    font-size: 30px;
  }

  .editorial .pricing-offer .offer-scope {
    gap: 15px;
    margin-top: 22px;
    padding-top: 20px;
  }

  .editorial .pricing-catalogue {
    gap: 40px;
  }

  .editorial .pricing-offer-link {
    align-self: stretch;
    justify-content: space-between;
    margin-top: 24px;
  }

  /* Keep the systems examples readable without a desktop-sized art stage. */
  .editorial .journey-chapter {
    padding-block: 46px;
  }

  .editorial .journey-layout {
    gap: 28px;
  }

  .editorial .journey-copy .journey-label {
    margin-bottom: 22px;
  }

  .editorial .journey-copy h2 {
    font-size: clamp(39px, 10.5vw, 52px);
    margin-bottom: 24px;
    line-height: 1.05;
  }

  .editorial .journey-copy > p {
    font-size: 17px;
  }

  .editorial .journey-art {
    min-height: 370px;
  }

  .editorial .knowledge-sheet {
    height: 295px;
    padding: 24px;
  }

  .editorial .knowledge-sheet > span {
    font-size: 25px;
  }

  .editorial .sheet-front img {
    width: 34px;
    height: 34px;
    margin-bottom: 18px;
  }

  .editorial .sheet-front p {
    font-size: 14px !important;
    line-height: 1.55 !important;
    margin-top: 16px;
  }

  .editorial .workflow-art,
  .editorial .dashboard-art {
    min-height: 0;
    padding-bottom: 52px;
  }

  .editorial .workflow-arrival {
    width: 90%;
    padding: 20px;
    font-size: 14px;
  }

  .editorial .workflow-draft {
    width: 100%;
    padding: 24px;
  }

  .editorial .workflow-draft h3 {
    font-size: 30px;
    margin-block: 20px;
  }

  .editorial .dashboard-preview {
    padding: 22px;
  }

  .editorial .dashboard-preview h3 {
    font-size: 32px;
    margin-block: 26px;
  }

  .editorial .dashboard-preview-row {
    padding-block: 16px;
  }

  /* Decorative library imagery needn't precede the actual resources. */
  .editorial .library-page .library-hero {
    padding-block: 34px 30px;
    gap: 0 !important;
  }

  .editorial .library-hero-art,
  .editorial .library-factfinder-art {
    display: none;
  }

  .editorial .library-factfinder {
    padding: 0;
    gap: 0;
  }

  .editorial .library-factfinder-copy {
    padding: 26px 24px;
  }

  .editorial .library-factfinder h2 {
    font-size: 33px;
  }

  .editorial .library-page .library-free {
    padding-top: 30px;
  }

  .editorial .library-page .resource-grid {
    gap: 34px;
  }

  .editorial .resource-art.editorial-cover {
    aspect-ratio: 1.65;
    min-height: 195px;
    padding: 24px;
  }

  .editorial .cover-title {
    font-size: clamp(29px, 8vw, 36px);
  }

  .editorial .resource-content {
    padding-top: 20px;
  }

  .editorial .resource-content h3 {
    font-size: 29px;
  }

  .editorial .library-actions {
    padding-top: 18px;
  }

  .editorial .library-actions .text-link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }

  .editorial .library-paid-art {
    min-height: 270px;
    padding: 28px;
  }

  .editorial .library-paid-copy {
    padding: 26px 24px;
  }

  /* Guide controls remain accessible and their horizontal rail scrolls. */
  .editorial .gd-hero {
    padding-top: 28px;
  }

  .editorial .gd-back {
    margin-bottom: 12px;
  }

  .editorial .gd-hero-grid {
    gap: 28px;
  }

  .editorial .gd-outcome-art {
    display: none;
  }

  .editorial .gd-outcome-body {
    padding: 24px;
  }

  .editorial .gd-chips {
    gap: 8px;
    margin-top: 22px;
  }

  .editorial .gd-chips li {
    font-size: 12px;
    padding: 7px 10px;
  }

  .editorial .gd-rail a,
  .editorial .gd-rail-head button,
  .editorial .gd-copy,
  .editorial .gd-mark {
    min-height: 44px;
    align-items: center;
  }

  .editorial .gd-step {
    padding-block: 32px;
  }

  .editorial .gd-num {
    top: 28px;
  }

  .editorial .ff-main {
    padding-block: 30px 48px;
  }

  .editorial .contact-layout {
    gap: 28px;
  }

  .editorial .contact-option {
    padding: 26px 24px;
  }

  .editorial .booking-intro {
    padding-top: 34px;
    padding-bottom: 32px;
  }

  .editorial .booking-intro h1 {
    font-size: clamp(38px, 10.5vw, 48px);
    line-height: 1.06;
    text-wrap: balance;
  }

  .editorial .booking-section {
    padding-bottom: 48px;
  }

  .editorial .booking-month button {
    width: 44px;
    height: 44px;
  }

  .editorial :is(input:not([type=checkbox]):not([type=radio]), select, textarea) {
    font-size: 16px;
    min-width: 0;
  }

  .editorial :is(input:not([type=checkbox]):not([type=radio]), select) {
    min-height: 48px;
  }

  .editorial .cta {
    padding-block: 42px;
  }

  .editorial .cta h2 {
    font-size: clamp(34px, 9.5vw, 43px);
    line-height: 1.1;
  }
}