/* decklang block deltas (web-fragments concept R1) — per-composition web
 * adjustments for compiled DeckLang fragments. Scoped to .block-decklang and
 * SDS composition classes only; SDS tokens flip with the dark trigger.
 * Never styles anything the SDS already styles correctly on the web. */
@layer web {
  .decklang__eyebrow {
    display: flex;
    width: fit-content;
    color: var(--sph-text-muted);
    margin: 0 0 clamp(1rem, 3vw, 1.5rem);
  }
  .decklang__eyebrow--center {
    justify-content: center;
    margin-inline: auto;
  }
  .decklang__eyebrow--center::after {
    content: "";
    width: 28px;
    height: 1px;
    background: currentColor;
    display: inline-block;
  }

  /* Optional block title — typography comes from .web-display-title
     (web-layout.css); here only the placement between the eyebrow and the
     compiled fragment. align follows the block's `align` param together
     with the eyebrow. */
  .decklang__title {
    margin: 0 0 clamp(1.25rem, 3vw, 2rem);
  }
  .decklang__title--center {
    text-align: center;
    margin-inline: auto;
  }
  /* With a title following, tighten the eyebrow→title gap to the d2v rhythm. */
  .decklang__eyebrow:has(+ .decklang__title) {
    margin-bottom: clamp(0.5rem, 1.5vw, 1rem);
  }

  /* quote — match the centred founder-quote design (V2: one small-caps
     attribution line under the display quote). The SDS styles the blockquote
     itself; its <cite> has no web styling in components.css yet. */
  .block-decklang .sph-pull-quote {
    margin-inline: auto;
    max-width: 22ch;
    text-align: center;
  }
  .block-decklang .sph-pull-quote p {
    margin: 0;
  }
  .block-decklang .sph-pull-quote cite {
    display: block;
    margin-top: clamp(1.25rem, 3vw, 2rem);
    font-family: var(--sph-font-display);
    font-style: normal;
    font-weight: var(--sph-weight-bold);
    font-size: var(--sph-fs-sm);
    letter-spacing: var(--sph-tracking-wide);
    text-transform: uppercase;
    color: var(--sph-text);
  }
}