/*
 * blocks/about-statement/style.css
 * Scoped to .wp-block-neirotti-about-statement
 */


/* ─── Section ────────────────────────────────────────────────────────────── */

.about-statement {
  background-color: var(--color-accent);
  padding:          clamp(4rem, 6vw, 5rem) 0;
}


/* ─── Inner — narrow centered column ─────────────────────────────────────── */

.about-statement__inner {
  max-width:  46rem;
  margin:     0 auto;
  text-align: center;
}

.about-statement__eyebrow {
  margin: 0 0 0.85rem;
  font-family: var(--font-sans);
  font-size: 0.68rem;
  font-weight: 400;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(245, 240, 232, 0.68);
}


/* ─── Title ──────────────────────────────────────────────────────────────── */

/*
 * Two-class specificity beats .h2 from typography.css.
 * Title is italic beige over the dark wine-red background.
 */
.about-statement .about-statement__title {
  color:         var(--color-beige);
  margin-bottom: 1rem;
  line-height:   1.05;
  letter-spacing: -0.04em;
}


/* ─── Body text ──────────────────────────────────────────────────────────── */

.about-statement__body p {
  font-family:   var(--font-sans);
  font-size:     var(--text-lg);
  font-weight:   300;
  line-height:   var(--leading-loose);
  color:         rgba(245, 240, 232, 0.85);
  margin-bottom: var(--space-md);
}

.about-statement__body p:last-child {
  margin-bottom: 0;
}


/* ─── Responsive ─────────────────────────────────────────────────────────── */

@media (max-width: 768px) {
  .about-statement {
    padding: var(--space-lg) 0;
  }
}