/** Shopify CDN: Minification failed

Line 107:40 Expected "*/" to terminate multi-line comment

**/
/* section-pn-pillars.css — 3-tile pillars band.
 *
 * Each tile is a 4:5 portrait image, with eyebrow + heading + short text
 * displayed statically below the image (no overlay, no blur, no hover
 * reveal — the copy is always visible). All colour binds to the active
 * scheme via rgb(var(--color-*)); all sizing binds to design-system
 * tokens (--ds-*, --pn-*); no literals.
 */

/* ── 1. Header ──────────────────────────────────────────────────────────── */
.pn-pillars__header {
    max-width: 100%;
    margin: 0 auto 80px;
    text-align: left;
}
.pn-pillars__header--center {
  margin-bottom: 30px;
}
.pn-pillars__header--left {
  margin-inline-end: auto;
  text-align: left;
}

.pn-pillars__header--center {
  margin-inline: auto;
  text-align: center;
}

.pn-pillars__header--right {
  margin-inline-start: auto;
  text-align: right;
}

.pn-pillars__heading {
  margin: 0;
}

/* ── 2. Grid ────────────────────────────────────────────────────────────── */
.pn-pillars__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--pn-pillars-gap, var(--ds-space-16));
  margin: 0;
  padding: 0;
}

@media screen and (min-width: 750px) {
  .pn-pillars__grid--2 { grid-template-columns: repeat(2, 1fr); }
  .pn-pillars__grid--3 { grid-template-columns: repeat(3, 1fr); }
  .pn-pillars__grid--4,
  .pn-pillars__grid--5,
  .pn-pillars__grid--6 { grid-template-columns: repeat(2, 1fr); }
}

@media screen and (min-width: 990px) {
  .pn-pillars__grid--3 { grid-template-columns: repeat(3, 1fr); }
  .pn-pillars__grid--4 { grid-template-columns: repeat(4, 1fr); }
  .pn-pillars__grid--5,
  .pn-pillars__grid--6 { grid-template-columns: repeat(3, 1fr); }
}

/* ── 3. Tile ────────────────────────────────────────────────────────────── */
.pn-pillars__item {
  margin: 0;
}

.pn-pillars__link {
  position: relative;
  display: block;
  width: 100%;
  color: inherit;
  text-decoration: none;
  outline: none;
}

.pn-pillars__link:focus-visible {
  outline: 2px solid var(--ds-color-tan);
  outline-offset: -2px;
}

.pn-pillars__media {
  position: relative;
  overflow: hidden;
}

.pn-pillars__image {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  transition: transform var(--pn-dur-image, 1.1s) var(--pn-ease-image, ease);
}

.pn-pillars__link:hover .pn-pillars__image,
.pn-pillars__link:focus-within .pn-pillars__image {
  transform: scale(1.04);
}

/* ── 4. Content ─────────────────────────────────────────────────────────
   Static block below the image — no overlay, no blur, no opacity/hover
   mechanics. Copy is always visible, in