/* =====================================================
   FILE: typography.css

   PURPOSE:
   Global typography and text styling.

   THIS FILE COVERS:
   - Heading styles
   - Paragraph styles
   - Rich text content
   - Eyebrows
   - Captions
   - Blockquotes
   - Lists
   - Editorial content spacing
   - Type-specific responsive adjustments

   NOTES:
   Use this file for text behaviour across the site.
   Button-style links belong in components.css.
===================================================== */

@font-face {
  font-family: "Martina Plantijn";
  src: url("/wp-content/themes/bricks-child/assets/fonts/martina-plantijn-light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Martina Plantijn";
  src: url("/wp-content/themes/bricks-child/assets/fonts/martina-plantijn-light-italic.woff2") format("woff2");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Px Grotesk";
  src: url("/wp-content/themes/bricks-child/assets/fonts/Px-Grotesk-Light.woff2") format("woff2"),
       url("/wp-content/themes/bricks-child/assets/fonts/Px-Grotesk-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Px Grotesk";
  src: url("/wp-content/themes/bricks-child/assets/fonts/Px-Grotesk-Regular.woff2") format("woff2"),
       url("/wp-content/themes/bricks-child/assets/fonts/Px-Grotesk-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Px Grotesk";
  src: url("/wp-content/themes/bricks-child/assets/fonts/Px-Grotesk-Bold.woff2") format("woff2"),
       url("/wp-content/themes/bricks-child/assets/fonts/Px-Grotesk-Bold.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

body {
  font-family: var(--font-body);
  font-size: var(--text-body);
  line-height: var(--lh-body);
  font-weight: var(--weight-body);
  letter-spacing: var(--ls-body);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  letter-spacing: var(--ls-heading);
  margin-top: 0;
  margin-bottom: var(--space-heading);
}

h1 {
  font-size: var(--text-display-large);
	line-height: var(--lh-heading-tight);
	text-transform:uppercase;
}

h2 {
  font-size: var(--text-display);
  line-height: var(--lh-heading-tight);
	text-transform:uppercase;
}

h3,
h4 {
  line-height: var(--lh-heading-tight);
}

h5,
h6{
  line-height: var(--lh-heading-tight);
	font-weight: var(--weight-heading);
	letter-spacing:var(--ls-heading-loose);
}

.display-large h1,
.display-large h2,
.display-large h3{
  font-size: var(--text-display-large);
  line-height: var(--lh-heading-tight);
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  letter-spacing: var(--ls-heading);
}

h3 { font-size: var(--text-h3); }
h4 { font-size: var(--text-h4); }
h5 { font-size: var(--text-h5); }
h6 { font-size: var(--text-h6); }


/* ==================================================
   H1: Mid-size Desktop / Large Tablet
================================================== */

@media (min-width: 981px) and (max-width: 1260px) {
  h1 {
    font-size: var(--text-display);
  }
}

p {
  font-size: var(--text-body);
  line-height: var(--lh-body);
  margin-top: 0;
  margin-bottom: var(--space-p);
}

.text-body {
  font-size: var(--text-body);
  line-height: var(--lh-body);
  letter-spacing: var(--ls-body);
}

.text-med,
p.med {
  font-size: var(--text-med);
  line-height: var(--lh-intro);
  letter-spacing: var(--ls-body);
  margin-top: 0;
  margin-bottom: var(--space-med);
}

.text-large,
p.large {
  font-size: var(--text-large);
  line-height: var(--lh-intro);
  letter-spacing: var(--ls-body);
  margin-top: 0;
  margin-bottom: var(--space-large);
}

.text-small,
p.small {
  font-size: var(--text-small);
  line-height: var(--lh-small);
}

.caption,
figcaption,
.text-caption {
  font-size: var(--text-caption);
  line-height: var(--lh-small);
}

/* Eyebrow */

.eyebrow {
  margin: 0;

  color: var(--color-text-light-bg);

  font-size: var(--text-small, 0.875rem);
  font-weight: var(--weight-medium);
  line-height: 1.2;

  letter-spacing: 0.08em;
  text-transform: uppercase;
}

p:last-child,
.text-body:last-child,
.text-med:last-child,
.text-large:last-child {
  margin-bottom: 0;
}

.font-px {
  font-family: var(--font-body);
}

.font-martina {
  font-family: var(--font-heading);
}

strong{
	font-weight:var(--weight-medium);
}

/* ==================================================
   Global content lists
================================================== */

.brxe-text ul,
.brxe-post-content ul,
.team-card__bio-text ul,
.brxe-text-basic ul{
  display: block;

  margin: 0.65em 0;
  padding: 0;

  list-style: none;
}

.brxe-text ul:first-child,
.brxe-post-content ul:first-child,
.team-card__bio-text ul:first-child,
.brxe-text-basic  ul:first-child{
  margin-top: 0;
}

.brxe-text ul:last-child,
.brxe-post-content ul:last-child,
.team-card__bio-text ul:last-child,
.brxe-text-basic  ul:last-child{
  margin-bottom: 0;
}

.brxe-text ul > li,
.brxe-post-content ul > li,
.team-card__bio-text ul > li,
.brxe-text-basic  ul > li{
  position: relative;
  display: block;

  margin: 0;
  padding-left: 1.4em;

  text-align: left;
}

.brxe-text ul > li + li,
.brxe-post-content ul > li + li,
.team-card__bio-text ul > li + li,
.brxe-text-basic ul > li + li{
  margin-top: 0.45em;
}

.brxe-text ul > li::before,
.brxe-post-content ul > li::before,
.team-card__bio-text ul > li::before,
.brxe-text-basic ul > li::before{
  content: "";

  position: absolute;
  left: 0;
  top: 0.18em;

  width: 0.95em;
  height: 0.95em;

  background-color: currentColor;

  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z'/%3E%3C/svg%3E");

  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;

  -webkit-mask-position: center;
  mask-position: center;

  -webkit-mask-size: contain;
  mask-size: contain;
}