/* iOVA wordmark — Pirulen Regular for OVA (no crossbar A), inherited font for the lowercase "i" */
@font-face {
    font-family: 'Pirulen';
    src: url('/fonts/pirulen-rg.woff2') format('woff2'),
         url('/fonts/pirulen-rg.woff')  format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* The wrap must render as a single inline unit that can NEVER be broken
 * across lines, regardless of any parent flex/grid/column layout. */
.iova-wordmark-wrap,
span.iova-wordmark-wrap {
    display: inline !important;
    white-space: nowrap !important;
    line-height: inherit !important;
    letter-spacing: 0.02em;
    vertical-align: baseline;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
}
.iova-wordmark-wrap .iova-i,
.iova-wordmark-wrap .iova-o,
.iova-wordmark-wrap .iova-va,
span.iova-wordmark-wrap span {
    display: inline !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
}
.iova-wordmark-wrap .iova-i {
    font-family: inherit;
    font-weight: 700;
    color: currentColor;
    margin-right: 0.04em;
}
.iova-wordmark-wrap .iova-o {
    font-family: 'Pirulen', sans-serif;
    background: linear-gradient(135deg, #ffd07a, #ff7a1a 55%, #d24300);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    filter: drop-shadow(0 0 6px rgba(255, 130, 40, 0.45));
}
.iova-wordmark-wrap .iova-va {
    font-family: 'Pirulen', sans-serif;
    color: currentColor;
}

/* /iova/ page FAQ — fixes the "scattered words" effect caused by
 * `justify-content: space-between` on the flex .io-faq-q button.
 * Left-align everything, then push the SVG chevron alone to the right. */
.io-faq-q,
.io-faq-a,
.io-faq-a-inner,
.io-faq-item {
    text-align: left !important;
}
/* Switch FAQ button from flex to block + absolute SVG, otherwise flex
 * strips the whitespace around the wordmark ("What isiOVA, in one line?"). */
.io-faq-q {
    display: block !important;
    position: relative !important;
    padding-right: 56px !important;
}
.io-faq-q > svg,
.io-faq-q > .io-faq-icon {
    position: absolute !important;
    right: 24px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
}
.io-faq-item.open .io-faq-q > svg,
.io-faq-item.open .io-faq-q > .io-faq-icon {
    transform: translateY(-50%) rotate(180deg) !important;
}
