/*
 * No one-word last lines on body copy, site-wide. "pretty" rather than
 * "balance": balance evens out every line and narrows paragraphs, pretty
 * only reworks the last few lines. Browsers without it wrap as before.
 */
p {
	text-wrap: pretty;
}

p:is([style*="text-decoration:underline"],[style*="text-decoration: underline"]) {
  /* text-decoration-color: var(--wp--preset--color--accent) !important;
  text-decoration-thickness: max(4%, 2px) !important; 
  text-underline-offset: auto !important;
  text-underline-position: from-font !important; */
  text-decoration: none !important;

  /* text-shadow:
  0px 1px 0 var(--current-background-color), 
  0px 2px 0 var(--current-background-color), 
  0px 3px 0 var(--current-background-color),
  1px 1px 0 var(--current-background-color), 
  1px 2px 0 var(--current-background-color), 
  1px 3px 0 var(--current-background-color),
  -1px 1px 0 var(--current-background-color), 
  -1px 2px 0 var(--current-background-color), 
  -1px 3px 0 var(--current-background-color),
  2px 1px 0 var(--current-background-color), 
  2px 2px 0 var(--current-background-color), 
  2px 3px 0 var(--current-background-color),
  -2px -1px 0 var(--current-background-color), 
  -2px -2px 0 var(--current-background-color), 
  -2px -3px 0 var(--current-background-color),
  3px 1px 0 var(--current-background-color), 
  3px 2px 0 var(--current-background-color), 
  3px 3px 0 var(--current-background-color),
  -3px -1px 0 var(--current-background-color), 
  -3px -2px 0 var(--current-background-color), 
  -3px -3px 0 var(--current-background-color),

  0px -1px 0 var(--current-background-color), 
  0px -2px 0 var(--current-background-color), 
  0px -3px 0 var(--current-background-color),
  1px -1px 0 var(--current-background-color), 
  1px -2px 0 var(--current-background-color), 
  1px -3px 0 var(--current-background-color),
  -1px -1px 0 var(--current-background-color), 
  -1px -2px 0 var(--current-background-color), 
  -1px -3px 0 var(--current-background-color),
  2px -1px 0 var(--current-background-color), 
  2px -2px 0 var(--current-background-color), 
  2px -3px 0 var(--current-background-color),
  -2px -1px 0 var(--current-background-color), 
  -2px -2px 0 var(--current-background-color), 
  -2px -3px 0 var(--current-background-color),
  3px -1px 0 var(--current-background-color), 
  3px -2px 0 var(--current-background-color), 
  3px -3px 0 var(--current-background-color),
  -3px -1px 0 var(--current-background-color), 
  -3px -2px 0 var(--current-background-color), 
  -3px -3px 0 var(--current-background-color)
  ; */

  a {
    text-decoration: none !important;
    color: inherit !important;
  }
}

p:not([style*="text-decoration:underline"],[style*="text-decoration: underline"]) {
  a {
    text-decoration: none !important;
    color: inherit !important;

    &:hover {
    }
  }
}

:is(.wp-block-paragraph, p).is-style-green-dot,
:is(.wp-block-paragraph, p).is-style-shriking-eyebrow {
  position: relative;
  display: flex;
  align-items: baseline;

  &::before {
    content: "";
    transform: translateY(-100%);
    left: 0;
    width: calc(1em * .5);
    aspect-ratio: 1 / 1;
    margin-right: calc(1em * .25);
    background-image: url(../../../images/green-dot.svg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: inline-block;
    flex-shrink: 0;
  }
}

:is(.wp-block-paragraph, p).is-style-green-dot {
  &.is-style-green-dot-above {
    &::before {
      display: block;
    }
  }
}

.is-style-shriking-eyebrow {
  transition: all 0.7s ease-in-out;
  text-decoration: none !important;

  &,
  & a,
  & .kbd-underline {
    text-decoration: none !important;
    background: none !important;
  }

  &.is-shrunk {
    font-size: var(--wp--preset--font-size--small) !important;
  }
}
/*
 * Case study and post body copy: paragraphs and lists with no size picked in
 * the editor match the article Figmas (22px on 29px, no tracking, at 1440).
 */
:where(
  .single-case-study .wp-block-post-content,
  .post-type-case-study.editor-styles-wrapper,
  .single-post .wp-block-post-content,
  .post-type-post.editor-styles-wrapper .wp-block-post-content
) :is(p, ul, ol):not([class*="-font-size"]) {
  font-size: var(--wp--custom--font-size--article-body);
  letter-spacing: 0;
  line-height: calc(29 / 22);
}

/* Post intro (Lede style): 30px on 34px at 1440 */
:where(.single-post, .post-type-post.editor-styles-wrapper) .wp-block-post-content p.is-style-lede {
  font-size: var(--wp--custom--font-size--article-intro);
  font-weight: var(--wp--custom--font-weight--regular);
  letter-spacing: 0;
  line-height: calc(34 / 30);
}

/*
 * Case study intro (Lede style in Copy Intro): same size, weight 450. A class
 * rather than an inline var(--…) size, because Avenue's resource sync strips
 * the - escapes that inline custom-property sizes need in block attributes.
 */
:where(.single-case-study .wp-block-post-content, .post-type-case-study.editor-styles-wrapper) p.is-style-lede {
  font-size: var(--wp--custom--font-size--article-intro);
  font-weight: 450;
  letter-spacing: 0;
  line-height: calc(34 / 30);
}

/*
 * Body copy (kbd-body-copy class): Figma kbd/Paragraph/MD 20/28 (x0.9 site
 * scale), light, header nav tracking. Matches the service card body; used on
 * the Services page hero and Process sections.
 */
p.kbd-body-copy {
  font-size: var(--wp--custom--font-size--body);
  font-weight: var(--wp--custom--font-weight--light, 300);
  line-height: calc(28 / 20);
  letter-spacing: var(--wp--custom--letter-spacing--open, 0.02em);
}