/* Lex Bellator — balanced preparation sections, v119.
   Scoped to the ten practice-page preparation sections. Existing overview,
   planner, examples, process steps, contact and animation styles stay intact.
   All guidance remains visible and in its original reading order, with or
   without JavaScript. No sticky columns, fixed heights or truncated records. */

#prepare.prep-balanced .prep-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(28px, 3vw, 44px);
  align-items: start;
}

/* A short, balanced introduction precedes the full-width record panel. */
#prepare.prep-balanced .prep-intro {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  gap: clamp(28px, 4vw, 64px);
  align-items: start;
}
#prepare.prep-balanced :is(.prep-heading, .prep-lead, .prep-body,
    .prep-record-panel, .prep-record-header, .prep-record-grid,
    .prep-record-item, .prep-record-item > *) {
  min-inline-size: 0;
}
#prepare.prep-balanced .prep-heading h2 {
  max-inline-size: 23ch;
}
#prepare.prep-balanced .prep-lead {
  padding-block-start: 2.5rem;
}
#prepare.prep-balanced .prep-lead > p {
  margin: 0;
  max-inline-size: none;
}
#prepare.prep-balanced .prep-lead > .text-link {
  max-inline-size: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}

/* Four groups share two equal columns, not one long right-hand column. */
#prepare.prep-balanced .prep-record-panel {
  inline-size: 100%;
  padding: clamp(22px, 2.6vw, 36px);
  border-radius: 12px;
}
#prepare.prep-balanced .prep-record-header > h3 {
  margin: 0 0 12px;
  line-height: 1.3;
}
#prepare.prep-balanced .prep-record-header > p {
  margin: 0;
  color: var(--muted);
  font-size: 1.125rem;
  line-height: 1.8;
}
#prepare.prep-balanced .prep-record-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(28px, 3.2vw, 52px);
  row-gap: 26px;
  margin: 26px 0 0;
  padding: 0;
}
#prepare.prep-balanced .prep-record-grid > .prep-record-item {
  margin: 0;
  padding: 22px 0 0;
  border-top: 1px solid var(--line);
  overflow-wrap: anywhere;
}
#prepare.prep-balanced .prep-record-item :is(h4, dt) {
  margin-block-start: 0;
}
/* Keep the native ordered-list numbering and definition-list semantics. */
#prepare.prep-balanced ol.prep-record-grid > li.prep-record-item {
  margin-inline-start: 1.4em;
  padding-inline-start: 0.25em;
}
#prepare.prep-balanced .prep-sharing-note {
  max-inline-size: none;
  padding-inline: 2px;
}

/* Tablet introductions stack before either column becomes too narrow. */
@media (max-width: 1024px) {
  #prepare.prep-balanced .prep-intro {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
  }
  #prepare.prep-balanced .prep-heading h2 {
    max-inline-size: none;
  }
  #prepare.prep-balanced .prep-lead {
    padding-block-start: 0;
  }
}

/* Phones use one readable column, with the same content and numeric order. */
@media (max-width: 800px) {
  #prepare.prep-balanced .prep-record-grid {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 22px;
  }
  #prepare.prep-balanced .prep-record-panel {
    padding: 24px 22px;
  }
}
@media (max-width: 420px) {
  #prepare.prep-balanced .prep-record-panel {
    padding: 22px 18px;
  }
  #prepare.prep-balanced .prep-record-grid {
    column-gap: 0;
  }
}

@media print {
  #prepare.prep-balanced .prep-intro,
  #prepare.prep-balanced .prep-layout,
  #prepare.prep-balanced .prep-record-grid {
    display: block;
  }
  #prepare.prep-balanced .prep-lead {
    padding-block-start: 18px;
  }
  #prepare.prep-balanced .prep-record-panel {
    margin-block-start: 24px;
  }
  #prepare.prep-balanced .prep-record-grid > .prep-record-item {
    break-inside: avoid;
    margin-block-start: 18px;
  }
}