/* About + Home typography refinement — Loom 0a2ea365, 2026-09-27.
   Scope: consistent hero and section-heading hierarchy, clearer story and values layouts. */

@media (min-width: 651px) {
  /* The Home hero now matches the requested cross-page hero hierarchy. Its
     wider reading measure preserves the intended three-line composition on
     wide desktop screens and naturally falls back to four lines below it. */
  .front-page-content .home-hero .copy-hero-grid {
    max-width: 1300px !important;
  }
  .front-page-content .home-hero h1 {
    max-width: 1300px;
    font-size: clamp(3.9rem, 5.35vw, 4.7rem);
    line-height: 1.1;
  }
  .front-page-content .home-section-title {
    font-size: clamp(2.6rem, 3.8vw, 3.45rem);
    line-height: 1.12;
  }
  .front-page-content .home-section-subhead {
    font-size: clamp(1.55rem, 2.1vw, 1.9rem);
    line-height: 1.34;
  }
  /* These paired Home sections have a later, page-specific size rule in
     copy-pages.css, so repeat the selector here to retain the shared scale. */
  .front-page-content .home-paired-copy .home-section-title,
  .front-page-content .home-operating-copy .home-section-title {
    font-size: clamp(2.6rem, 3.8vw, 3.45rem);
    line-height: 1.12;
  }

  /* WordPress adds a flow-layout margin to every sibling after the first.
     Reset it inside these explicit desktop grids so all three value icons and
     both cards in each beliefs row share the same top edge. */
  .copy-page-content .about-values-grid > .about-value {
    margin-top: 0 !important;
  }
  .copy-page-content .about-beliefs-grid {
    column-gap: 1px;
    row-gap: 24px;
  }
  .copy-page-content .about-beliefs-grid::before {
    margin-bottom: 0;
  }
  .copy-page-content .about-beliefs-grid > .about-belief {
    margin-top: 0 !important;
  }
  .copy-page-content .about-belief h3 {
    font-size: clamp(1.45rem, 2.1vw, 1.9rem);
    line-height: 1.18;
  }

  /* Current About layout review, 2026-09-28: use the same two-line offset for
     the Mission and audience labels. */
  .copy-page-content .about-exact-split:not(.about-audience-grid) > .wp-block-column:first-child {
    align-self: start;
    padding-top: 4.7rem;
  }
  .copy-page-content .about-exact-split.about-audience-grid > .wp-block-column:first-child {
    align-self: start;
    padding-top: 4.7rem;
  }
  .copy-page-content .about-audience-continuation {
    margin-top: 1.2rem;
    padding-top: 0;
    border-top: 0;
  }
  .copy-page-content .about-audience-continuation > p {
    max-width: 690px;
    margin-right: 0;
    margin-left: 0;
    text-align: left;
  }

  /* Staggered editorial rows: supplied existing imagery is intentionally
     contained in reusable media blocks for an easy later asset swap. */
  .copy-page-content .about-bio-section > .container,
  .copy-page-content .about-community-section > .container {
    max-width: 1180px !important;
  }
  .copy-page-content .about-bio-grid,
  .copy-page-content .about-community-grid {
    grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
    max-width: 1180px !important;
    align-items: start;
    gap: clamp(3.2rem, 7vw, 7rem);
  }
  .copy-page-content .about-bio-grid > .wp-block-column,
  .copy-page-content .about-community-grid > .wp-block-column {
    width: auto !important;
    margin: 0 !important;
  }
  .copy-page-content .about-bio-copy,
  .copy-page-content .about-community-copy {
    max-width: 650px;
    margin: 0;
  }
  .copy-page-content .about-bio-copy .about-exact-title,
  .copy-page-content .about-community-copy .about-exact-title,
  .copy-page-content .about-bio-copy > p,
  .copy-page-content .about-community-copy > p {
    margin-right: 0;
    margin-left: 0;
    text-align: left;
  }
  .copy-page-content .about-bio-copy .about-exact-title,
  .copy-page-content .about-community-copy .about-exact-title {
    max-width: 650px;
    font-size: clamp(2.45rem, 3.8vw, 3.45rem);
    line-height: 1.12;
  }
  .copy-page-content .about-bio-copy > p,
  .copy-page-content .about-community-copy > p {
    max-width: 650px;
    font-size: 1rem;
    line-height: 1.82;
  }
  .copy-page-content .about-bio-media,
  .copy-page-content .about-bio-media .wp-block-image,
  .copy-page-content .about-bio-media img {
    width: 100%;
    margin: 0;
  }
  .copy-page-content .about-bio-media img {
    aspect-ratio: 1.1 / 1;
    object-fit: cover;
    object-position: center 42%;
  }
  .copy-page-content .about-bio-media {
    margin-top: clamp(2.5rem, 5vw, 4rem) !important;
  }
  .copy-page-content .about-bio-secondary,
  .copy-page-content .about-story-secondary {
    position: static;
    width: 100%;
    margin-top: clamp(3.5rem, 6vw, 5.5rem);
  }
  .copy-page-content .about-bio-secondary .about-media-frame,
  .copy-page-content .about-story-secondary .about-media-frame {
    position: static;
    width: 100%;
    margin: 0;
    border: 0;
  }
  .copy-page-content .about-bio-secondary .about-media-frame--1 {
    width: 100%;
    margin-left: 0;
  }
  .copy-page-content .about-bio-secondary img {
    aspect-ratio: 1.5 / 1;
    object-position: center;
  }
  .copy-page-content .about-story-secondary .about-media-frame + .about-media-frame {
    margin-top: clamp(3.5rem, 6vw, 5.5rem) !important;
    margin-block-start: clamp(3.5rem, 6vw, 5.5rem) !important;
  }
  .copy-page-content .about-story-secondary img {
    aspect-ratio: 1.78 / 1;
    object-position: center;
  }
  .copy-page-content .about-story-grid.about-story-grid--text-first > .wp-block-column:last-child {
    align-self: start !important;
    margin-top: clamp(9rem, 14vw, 12rem) !important;
  }
  .copy-page-content .about-story-grid.about-story-grid--text-first .feature-photo {
    margin: 0 !important;
    transform: none;
  }
  .copy-page-content .about-media-stack {
    position: relative;
    width: 100%;
  }
  .copy-page-content .about-media-stack > .wp-block-group {
    margin-block-start: 0 !important;
  }
  .copy-page-content .about-media-frame,
  .copy-page-content .about-media-frame .wp-block-image {
    margin: 0;
  }
  .copy-page-content .about-media-frame img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .copy-page-content .about-audience-media {
    margin-top: clamp(2.25rem, 4vw, 3.75rem);
  }
  .copy-page-content .about-audience-media .about-media-frame--1,
  .copy-page-content .about-audience-media .about-media-frame--2 {
    position: static;
    width: 100%;
    border: 0;
  }
  .copy-page-content .about-audience-media .about-media-frame--1 {
    width: 108%;
    max-width: none;
  }
  .copy-page-content .about-audience-media .about-media-frame--2 {
    width: 91%;
    margin-top: 1.4rem;
  }
  .copy-page-content .about-audience-media .about-media-frame img {
    aspect-ratio: 1.5 / 1;
    object-position: center;
  }
  .copy-page-content .about-community-media {
    min-height: 0;
    margin-top: clamp(2.5rem, 5vw, 4rem);
  }
  .copy-page-content .about-community-media .about-media-frame--1 {
    width: 100%;
  }
  .copy-page-content .about-community-media .about-media-frame--1 img {
    aspect-ratio: 2 / 3;
    object-position: center 42%;
  }

  /* Final CTA returns to a contained, left-aligned text column with imagery on
     the right; button and reading copy share the exact same left edge. */
  .copy-page-content .about-final-reading {
    max-width: 1180px !important;
  }
  .copy-page-content .about-final-layout {
    display: grid !important;
    grid-template-columns: minmax(0, .98fr) minmax(360px, .82fr);
    align-items: start;
    gap: clamp(3rem, 7vw, 7rem);
  }
  .copy-page-content .about-final-layout > .wp-block-column {
    width: auto !important;
    margin: 0 !important;
  }
  .copy-page-content .about-final-copy-column {
    max-width: 680px;
  }
  .copy-page-content .about-final-copy-column .wp-block-buttons {
    justify-content: flex-start;
    margin-right: 0;
    margin-left: 0;
  }
  .copy-page-content .about-final-copy-column .wp-block-button {
    margin-left: 0 !important;
  }
  .copy-page-content .about-final-media {
    padding-top: clamp(2.5rem, 5vw, 4rem);
  }
  .copy-page-content .about-final-media .about-media-frame--1 {
    width: 110%;
    max-width: none;
    margin-left: auto;
  }
  .copy-page-content .about-final-media .about-media-frame--1 img {
    aspect-ratio: 1.5 / 1;
  }
}

/* About hero — a true 25% reduction from the original oversized treatment,
   while retaining its editorial presence and approved dark presentation. */
.copy-page-content .about-exact-hero .about-exact-hero-title {
  max-width: 820px;
  font-size: clamp(2.8rem, 4.1vw, 4.2rem);
  line-height: 1.1;
}

/* All About section heading families use one clear, compact scale. */
.copy-page-content .about-exact-split h2,
.copy-page-content .about-exact-reading .about-exact-title,
.copy-page-content .about-final-title {
  max-width: 780px;
  font-size: clamp(2.45rem, 3.8vw, 3.45rem);
  line-height: 1.12;
}
.copy-page-content .about-exact-split .eyebrow {
  margin-bottom: 1.1rem;
  font-size: clamp(1rem, 1.55vw, 1.25rem);
  font-weight: 800;
  letter-spacing: .15em;
}

/* Audience list: retain the orange bullets, shift the entire list slightly
   right, and remove the divider treatment between individual items. */
.copy-page-content .about-audience-grid .about-exact-list {
  padding-left: 1.15rem;
  margin-bottom: 0;
  border-top: 0;
}
.copy-page-content .about-audience-grid .about-exact-list li {
  padding-top: .5rem;
  padding-bottom: .5rem;
  border-bottom: 0;
}

/* Founder story: reading column first, image on the right. */
.copy-page-content .about-story-grid.about-story-grid--text-first {
  display: grid !important;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr);
  max-width: 1180px !important;
  align-items: start;
  gap: clamp(3rem, 7vw, 7rem);
  text-align: left;
}
.copy-page-content .about-story-grid.about-story-grid--text-first > .wp-block-column {
  width: auto !important;
  margin: 0 !important;
}
.copy-page-content .about-story-grid.about-story-grid--text-first .feature-copy {
  max-width: 650px;
  margin: 0;
}
.copy-page-content .about-story-grid.about-story-grid--text-first .feature-copy .about-exact-title,
.copy-page-content .about-story-grid.about-story-grid--text-first .feature-copy > p {
  margin-right: 0;
  margin-left: 0;
  text-align: left;
}
.copy-page-content .about-story-grid.about-story-grid--text-first .feature-copy .about-exact-title {
  max-width: 780px;
  font-size: clamp(2.45rem, 3.8vw, 3.45rem);
  line-height: 1.12;
}
.copy-page-content .about-story-grid.about-story-grid--text-first .feature-photo {
  width: 100%;
  margin: 0;
}
.copy-page-content .about-story-grid.about-story-grid--text-first .feature-photo img {
  width: 100%;
  min-height: 620px;
  aspect-ratio: .79 / 1;
  object-fit: cover;
  object-position: center top;
}

/* Values: a native warm-white section consistent with the page, retaining the
   icon-led three-column hierarchy without any imported-looking treatment. */
.copy-page-content .about-values-section {
  padding-top: clamp(5.75rem, 9vw, 8.8rem);
  padding-bottom: clamp(5.75rem, 9vw, 8.8rem);
  background: var(--warm-white) !important;
}
.copy-page-content .about-values-section .about-exact-title,
.copy-page-content .about-beliefs-section .about-exact-title {
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}
.copy-page-content .about-values-section .about-exact-title::after {
  display: block;
  width: 112px;
  height: 3px;
  margin: 1.35rem auto 0;
  background: var(--orange);
  content: '';
}
.copy-page-content .about-values-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(2.25rem, 5.5vw, 6.5rem);
  max-width: 1120px;
  margin: clamp(2.75rem, 5vw, 4.25rem) auto 0;
  background: transparent;
}
.copy-page-content .about-value {
  min-height: 0;
  padding: 0;
  background: transparent;
  border: 0;
  text-align: center;
}
.copy-page-content .about-value-icon {
  display: grid;
  width: clamp(6.5rem, 9.2vw, 8.25rem);
  height: clamp(6.5rem, 9.2vw, 8.25rem);
  margin: 0 auto 1.85rem;
  place-items: center;
  background: var(--charcoal);
  border-radius: 50%;
}
.copy-page-content .about-value-icon svg {
  width: 47%;
  height: 47%;
  fill: none;
  stroke: var(--warm-white);
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.copy-page-content .about-value-icon--speed svg { fill: var(--warm-white); stroke: var(--warm-white); }
.copy-page-content .about-value h3 {
  max-width: none;
  margin-bottom: 1rem;
  font-size: clamp(.9rem, 1.15vw, 1.08rem);
  font-weight: 800;
  letter-spacing: .13em;
  line-height: 1.2;
  text-transform: uppercase;
}
.copy-page-content .about-value p {
  max-width: 315px;
  margin-right: auto;
  margin-left: auto;
  font-size: clamp(1rem, 1.4vw, 1.2rem);
  line-height: 1.72;
}

/* What We Believe keeps its existing static two-column layout and gains the
   requested clearly visible gray bar above the card system. */
.copy-page-content .about-beliefs-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin-top: clamp(2rem, 3.8vw, 3.25rem);
  background: var(--line);
  border-bottom: 1px solid var(--line);
}
.copy-page-content .about-beliefs-grid::before {
  grid-column: 1 / -1;
  height: 12px;
  margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
  background: #d8d6d2;
  content: '';
}
.copy-page-content .about-belief {
  min-height: 0;
  padding: clamp(1.6rem, 3vw, 2.75rem);
}
.copy-page-content .about-belief-number { margin-bottom: 2rem; }

/* Final About CTA follows the shared Home reading-column alignment: left
   aligned, standardized width, and button directly beneath the copy. */
.copy-page-content .copy-final.about-final {
  text-align: left;
}
.copy-page-content .about-final-reading {
  max-width: 780px !important;
}
.copy-page-content .about-final-title,
.copy-page-content .about-final-copy {
  margin-right: 0 !important;
  margin-left: 0 !important;
  text-align: left !important;
}
.copy-page-content .about-final-copy {
  max-width: 680px;
  font-size: 1rem;
  line-height: 1.78;
}
.copy-page-content .about-final-copy + .about-final-copy { margin-top: 1rem; }
.copy-page-content .about-final .wp-block-buttons {
  justify-content: flex-start;
  margin-top: clamp(2.25rem, 4vw, 3.25rem);
}
.copy-page-content .about-final .wp-block-button { margin: 0; }

/* These hard line breaks are only composition controls for desktop. The
   original mobile headline flow remains unchanged and may wrap naturally. */
.desktop-only-break { display: initial; }

@media (max-width: 900px) {
  .copy-page-content .about-story-grid.about-story-grid--text-first {
    grid-template-columns: 1fr;
    gap: 2.35rem;
  }
  .copy-page-content .about-story-grid.about-story-grid--text-first .feature-copy { max-width: none; }
  .copy-page-content .about-story-grid.about-story-grid--text-first .feature-photo img {
    min-height: 0;
    aspect-ratio: 1.12 / 1;
  }
  .copy-page-content .about-values-grid { grid-template-columns: 1fr; }
  /* The requested image treatments are desktop compositions; preserve the
     established focused reading experience until dedicated mobile imagery is
     selected. */
  .copy-page-content .about-bio-media,
  .copy-page-content .about-bio-secondary,
  .copy-page-content .about-audience-media,
  .copy-page-content .about-community-media,
  .copy-page-content .about-final-media { display: none; }
  .copy-page-content .about-story-secondary { display: none; }
  .copy-page-content .about-bio-grid,
  .copy-page-content .about-community-grid { grid-template-columns: minmax(0, 1fr); }
  .copy-page-content .about-bio-grid > .wp-block-column:first-child,
  .copy-page-content .about-community-grid > .wp-block-column:first-child,
  .copy-page-content .about-final-layout > .wp-block-column:last-child { display: none !important; }
  .copy-page-content .about-final-layout { display: block !important; }
}

@media (max-width: 650px) {
  .desktop-only-break { display: none; }
  .copy-page-content .about-exact-hero .about-exact-hero-title { font-size: 2.25rem; }
  .copy-page-content .about-exact-split h2,
  .copy-page-content .about-exact-reading .about-exact-title,
  .copy-page-content .about-final-title { font-size: 2.15rem; }
  .copy-page-content .about-story-grid.about-story-grid--text-first .feature-copy .about-exact-title { font-size: 2.15rem; }
  .copy-page-content .about-exact-split .eyebrow { font-size: 1rem; }
  .copy-page-content .about-values-grid { gap: 3.25rem; }
  .copy-page-content .about-value-icon { width: 5.9rem; height: 5.9rem; }
  .copy-page-content .about-beliefs-grid { grid-template-columns: 1fr; }
  .copy-page-content .about-beliefs-grid::before { grid-column: 1; }
}