/* pages/case-study-details.css — the case-study template: only what is unique here */

.detail-block {
    display: grid;
    gap: var(--space-lg);
}
.detail-block__title {
    position: relative;
    padding-block-start: var(--space-lg);
    border-block-start: var(--hairline) solid var(--color-border-subtle);
    font-size: var(--fs-xl);
    line-height: var(--lh-snug);
}
/* gold kicker on the rule, as on the home page's "Why ETQAN" items */
.detail-block__title::before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: calc(var(--hairline) * -1);
    inline-size: var(--kicker-width);
    block-size: var(--rule);
    background: var(--gradient-gold);
}
.detail-block__text {
    font-size: var(--fs-md);
    line-height: var(--lh-body);
    color: var(--color-text-muted);
}

.rail-cta .btn { inline-size: 100%; }

/* Fact strip — a slim band under the breadcrumb, on the same footing as the home page
   trust strip: a band with its own rhythm rather than a full .section. */
.case-study__facts {
    background-color: var(--color-bg);
    padding-block: var(--space-2xl);
}

/* R03 notes 8-9 — two fact-strip items now carry references rather than plain facts.
   The linked value takes the site's standard text-link hover (the .breadcrumb__link /
   .rail__link pattern: colour only, --transition-fast, gold highlight, hover-capable
   pointers only); the placeholder value takes the muted text colour so an unconfirmed
   brand never reads as a stated fact. Both reuse existing tokens. */
.fact-strip__link {
    color: inherit;
    transition: color var(--transition-fast);
}
.fact-strip__value--muted { color: var(--color-text-muted); }

@media (hover: hover) {
    .fact-strip__link:hover { color: var(--color-accent-highlight); }
}