.page {
    padding: calc(var(--nav-h) + var(--section-gap)) var(--page-pad) var(--section-gap);
    min-height: 100vh;
}

.page__inner {
    max-width: var(--max-width);
    margin: 0 auto;
}

.page__header {
    display: flex;
    align-items: center;
    gap: var(--gap);
    margin-bottom: var(--gap);
}

/* form ailesi → o/web components.css TEK OTORİTE (2026-10-25 söküldü:
   .form/.form__label/.form__input gölgeleme — bg-dark vs bg-deep,
   accent-border vs text-dim farklıydı). Yalnız ürün-özel: honeypot. */
.form__hp {
    display: none;
}
.form__input:-webkit-autofill,
.form__textarea:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 var(--sp-7) var(--bg-dark) inset;
    -webkit-text-fill-color: var(--text-bright);
}

.form__textarea {
    resize: vertical;
}

.form__error {
    font-size: var(--fs-label);
    color: var(--sev-high);
}

.form__submit {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--bg-deep);
    background: var(--accent);
    border: none;
    padding: var(--sp-3) var(--sp-5);
    cursor: pointer;
    transition: background var(--an-speed);
    align-self: flex-start;
}

.form__submit:hover {
    background: var(--accent-bright);
}

.kc-filters {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap);
    margin-bottom: var(--sp-6);
}

.kc-filter {
    position: relative;
}

.kc-filter__label {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    padding: var(--sp-2) var(--sp-4);
    border: var(--border) solid var(--accent-border);
    background: transparent;
    color: var(--text-light);
    cursor: pointer;
    transition: border-color var(--an-speed);
}

.kc-filter__label:hover {
    border-color: var(--accent);
}

.kc-filter__dropdown {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 10;
    background: var(--bg-dark);
    border: var(--border) solid var(--accent-border);
    white-space: nowrap;
}

.kc-filter--open .kc-filter__dropdown {
    display: flex;
    flex-direction: column;
}

.kc-filter__opt {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    padding: var(--sp-2) var(--sp-4);
    border: none;
    background: transparent;
    color: var(--text-light);
    cursor: pointer;
    text-align: left;
    transition: background var(--an-speed);
}

.kc-filter__opt:hover {
    background: var(--accent-border);
}

.kc-filter__opt.active {
    color: var(--accent-bright);
}

.kc-filter__reset {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    padding: var(--sp-2) var(--sp-4);
    border: var(--border) solid var(--accent);
    background: transparent;
    color: var(--accent);
    cursor: pointer;
    transition: background var(--an-speed), color var(--an-speed);
}

.kc-filter__reset:hover {
    background: var(--accent);
    color: var(--bg-dark);
}

.kc-card__overview-metrics {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: var(--gap);
    margin-top: var(--sp-3);
    padding-top: var(--sp-3);
    border-top: var(--border) solid var(--c-charcoal);
    max-width: max-content;
}

.kc-metric {
    display: contents;
}

.kc-metric__label {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    opacity: var(--op-mid);
    white-space: nowrap;
}

.kc-metric__value {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    font-weight: var(--fw-bold);
    display: flex;
    align-items: center;
    gap: var(--gap);
}

.kc-metric__bar {
    display: inline-block;
    width: var(--sp-8);
    height: var(--sp-2);
    background: var(--c-charcoal);
    border-radius: var(--br-zero);
    overflow: hidden;
}

.kc-metric__fill {
    display: block;
    height: 100%;
    border-radius: var(--br-zero);
}

.kc-metric__fill--LOW { width: 25%; background: var(--c-olive-green); }
.kc-metric__fill--MEDIUM { width: 50%; background: var(--c-xanadu); }
.kc-metric__fill--HIGH { width: 75%; background: var(--sev-high); }
.kc-metric__fill--EXPERT { width: 100%; background: var(--sev-critical); }

.kc-metric__dot {
    display: inline-block;
    width: var(--sp-2);
    height: var(--sp-2);
    border-radius: 50%;
}

.kc-metric__dot--CONFIRMED { background: var(--c-olive-green); }
.kc-metric__dot--LAB { background: var(--c-xanadu); }
.kc-metric__dot--THEORETICAL { background: var(--c-charcoal); border: var(--border) solid var(--accent-border); }

.kc-metric--cost-LOW .kc-metric__value { color: var(--c-olive-green); }
.kc-metric--cost-MEDIUM .kc-metric__value { color: var(--c-xanadu); }
.kc-metric--cost-HIGH .kc-metric__value { color: var(--sev-high); }

.kc-metric--access-REMOTE .kc-metric__value { color: var(--sev-critical); }
.kc-metric--access-PROXIMITY .kc-metric__value { color: var(--c-xanadu); }
.kc-metric--access-INSIDER .kc-metric__value { color: var(--sev-high); }

.kc-card.is-hidden {
    display: none;
}

.kc-group.is-empty {
    display: none;
}

.kc-group {
    margin-bottom: var(--sp-8);
    padding-left: var(--sp-5);
    border-left: var(--sp-1) solid var(--c-charcoal);
}

[data-group="NSA"] {
    border-left-color: var(--c-xanadu);
}

[data-group="SA"] {
    border-left-color: var(--c-olive-green);
}

.kc-group__header {
    display: flex;
    align-items: center;
    gap: var(--gap);
    margin-bottom: var(--sp-5);
}

.kc-group__dot {
    width: var(--sp-3);
    height: var(--sp-3);
    border-radius: 50%;
}

[data-group="NSA"] .kc-group__dot { background: var(--c-xanadu); }
[data-group="SA"] .kc-group__dot  { background: var(--c-olive-green); }

.kc-group__title {
    font-size: var(--fs-body);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-mid);
}

.kc-group__sub {
    font-size: var(--fs-label);
    opacity: var(--op-mid);
    letter-spacing: var(--ls-tight);
}

.kc-card {
    border-bottom: var(--border) solid var(--accent-border);
    margin-bottom: var(--sp-1);
}

.kc-card__header {
    display: flex;
    align-items: center;
    gap: var(--gap);
    padding: var(--sp-4) var(--sp-2);
    cursor: pointer;
    list-style: none;
    transition: background var(--an-speed);
}

.kc-card__header::-webkit-details-marker { display: none; }
.kc-card__header::marker { display: none; content: ""; }

.kc-card__header:hover {
    background: var(--bg-dark);
}

.kc-card__chevron {
    display: inline-block;
    width: var(--sp-3);
    height: var(--sp-3);
    border-right: var(--border) solid var(--text-dim);
    border-bottom: var(--border) solid var(--text-dim);
    transform: rotate(-45deg);
    transition: transform var(--an-speed);
    flex-shrink: 0;
}

details[open] > .kc-card__header .kc-card__chevron {
    transform: rotate(45deg);
}

.kc-card__name {
    font-weight: var(--fw-bold);
    font-size: var(--fs-body);
}

.kc-card__overview {
    padding: var(--sp-3) var(--sp-4);
    margin-bottom: var(--sp-5);
    background: var(--bg-dark);
    border-left: var(--sp-1) solid var(--accent-border);
}

.kc-card__overview-label {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    opacity: var(--op-mid);
    display: block;
    margin-bottom: var(--sp-1);
}

.kc-card__overview p {
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    white-space: pre-line;
}

.kc-card__body {
    padding: 0 var(--sp-2) var(--sp-5) var(--sp-5);
}

.kc-timeline {
    border-left: var(--border) dotted var(--accent-border);
    padding-left: var(--sp-5);
    margin-left: var(--sp-2);
}

.kc-stage {
    position: relative;
    padding-bottom: var(--sp-5);
}

.kc-stage:last-child {
    padding-bottom: 0;
}

.kc-stage__dot {
    position: absolute;
    left: calc(-1 * var(--sp-5) - var(--sp-1));
    top: var(--sp-1);
    width: var(--sp-3);
    height: var(--sp-3);
    border-radius: 50%;
    background: var(--c-charcoal);
    border: var(--border) solid var(--accent-border);
}

.kc-stage--impact .kc-stage__dot {
    background: var(--c-xanadu);
    border-color: var(--c-xanadu);
}

[data-group="SA"] .kc-stage--impact .kc-stage__dot {
    background: var(--c-olive-green);
    border-color: var(--c-olive-green);
}

.kc-stage__content {
    padding-left: var(--sp-2);
}

.kc-stage__head {
    display: flex;
    align-items: center;
    gap: var(--gap);
    margin-bottom: var(--sp-2);
}

.kc-stage__num {
    font-size: var(--fs-label);
    letter-spacing: var(--ls-label);
    opacity: var(--op-mid);
}

.kc-stage__tech {
    display: inline-block;
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    background: var(--accent-border);
    padding: var(--sp-1) var(--sp-1);
    border-radius: var(--br-zero);
}

.kc-stage__content h3 {
    font-size: var(--fs-body);
    font-weight: var(--fw-bold);
    margin-bottom: var(--sp-2);
}

.kc-stage__content p {
    margin-bottom: var(--sp-3);
    line-height: var(--lh-body);
}

.kc-stage__threats {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap);
}

@media (max-width: var(--brk-m)) {
    .kc-card__header {
        flex-wrap: wrap;
    }

    .kc-card__goal {
        width: var(--max-width);
        white-space: normal;
    }

    .kc-card__body {
        padding-left: var(--sp-2);
    }

    .kc-timeline {
        margin-left: 0;
    }
}

.sensitivity__timeline {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--gap);
    margin-bottom: var(--sp-6);
}

.sensitivity__step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--gap);
    cursor: pointer;
    opacity: var(--op-dim);
    transition: opacity var(--an-speed);
    background: none;
    border: none;
    padding: 0;
    min-width: var(--sp-8);
}

.sensitivity__step--active {
    opacity: var(--op-full);
}

.sensitivity__dot-circle {
    width: var(--sp-4);
    height: var(--sp-4);
    border-radius: 50%;
    background: var(--c-charcoal);
    border: var(--border) solid var(--accent-border);
    transition: background var(--an-speed), border-color var(--an-speed);
}

.sensitivity__step--active .sensitivity__dot-circle {
    background: var(--accent, var(--c-teal));
    border-color: var(--accent, var(--c-teal));
}

.sensitivity__step span {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    color: var(--text-light);
}

.sensitivity__line {
    flex: 1;
    height: 0;
    border-top: var(--sp-1) dotted var(--c-charcoal);
    opacity: var(--op-dim);
    min-width: var(--sp-5);
}

.skills__roles {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap);
    row-gap: var(--gap);
    margin-bottom: var(--sp-5);
}

.skills__role-break {
    flex-basis: 100%;
    height: 0;
}

.skills__role-btn {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    text-transform: uppercase;
    padding: var(--sp-1) var(--sp-3);
    border: var(--border) solid var(--accent-border);
    background: transparent;
    color: var(--text-dim);
    cursor: pointer;
    transition: background var(--an-speed), color var(--an-speed), border-color var(--an-speed);
}

.skills__role-btn:hover {
    border-color: var(--accent);
    color: var(--text-light);
}

.skills__role-btn--active {
    background: var(--accent);
    color: var(--bg-deep);
    border-color: var(--accent);
}

.skills__tier-btn--e {
    border-color: var(--sev-bg-critical);
}

.skills__tier-btn--t {
    border-color: var(--sev-bg-high);
}

.skills__tier-btn--p {
    border-color: var(--sev-bg-medium);
}

.skills__tier-btn--a {
    border-color: var(--sev-bg-info);
}

.skills__tier-btn--e.skills__role-btn--active {
    border-color: transparent;
}

.skills__tier-btn--t.skills__role-btn--active {
    border-color: transparent;
}

.skills__tier-btn--p.skills__role-btn--active {
    border-color: transparent;
}

.skills__tier-btn--a.skills__role-btn--active {
    border-color: transparent;
}

.skills__section {
    margin-bottom: var(--sp-8);
}

.skills__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--gap);
    margin-top: var(--sp-3);
}

.skills__card {
    padding: var(--sp-3);
    border-left: var(--sp-1) solid var(--accent-border);
    transition: opacity var(--an-speed);
}

.skills__card--dimmed {
    display: none;
}

.skills__section--empty {
    display: none;
}

.skills__view--matrix .skills__section[id] {
    display: none;
}

.skills__view--matrix .skills__cta {
    display: none;
}

.skills__view--matrix .skills__matrix-section[id] {
    display: block;
}

.skills__card-tiers {
    display: flex;
    gap: var(--gap);
    margin-bottom: var(--sp-2);
}

.skills__tier {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    padding: 0 var(--sp-1);
    border: var(--border) solid var(--accent-border);
    color: var(--text-dim);
}

.skills__tier--a { border-color: var(--sev-info); }
.skills__tier--p { border-color: var(--sev-medium); }
.skills__tier--t { border-color: var(--sev-high); }
.skills__tier--e { border-color: var(--sev-critical); }

.skills__tier-btn--e { border-color: var(--sev-critical); }
.skills__tier-btn--t { border-color: var(--sev-high); }
.skills__tier-btn--p { border-color: var(--sev-medium); }
.skills__tier-btn--a { border-color: var(--sev-info); }

.skills__card h4 {
    font-size: var(--fs-body);
    margin-bottom: var(--sp-1);
    color: var(--text-bright);
}

.skills__card p {
    font-size: var(--fs-label);
    margin: 0;
    line-height: var(--lh-body);
    color: var(--text-dim);
}

.skills__card-link {
    display: inline-block;
    margin-top: var(--sp-2);
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--accent);
    text-decoration: none;
    letter-spacing: var(--ls-mid);
}

.skills__card-link:hover {
    text-decoration: underline;
}

.skills__matrix-toggle {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: var(--sp-3);
    border: var(--border) solid var(--accent-border);
    background: transparent;
    color: var(--text-light);
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    text-transform: uppercase;
    cursor: pointer;
    transition: background var(--an-speed);
}

.skills__matrix-toggle:hover {
    background: var(--bg-mid);
}

.skills__matrix-toggle-icon {
    font-size: var(--fs-body);
    font-weight: var(--fw-bold);
}

.skills__matrix-wrapper {
    margin-top: var(--sp-2);
}

.skills__matrix-scroll {
    overflow-x: auto;
}

.skills__matrix {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--fs-label);
}

.skills__matrix th,
.skills__matrix td {
    padding: var(--sp-1) var(--sp-2);
    border: var(--border) solid var(--accent-border);
    text-align: center;
    white-space: nowrap;
}

.skills__matrix th {
    color: var(--text-dim);
    font-weight: var(--fw-regular);
}

.skills__matrix td:first-child {
    text-align: left;
    font-weight: var(--fw-semibold);
    color: var(--text-bright);
}

.skills__matrix-cell--primary::before {
    content: "\25CF";
    color: var(--accent);
}

.skills__matrix-cell--secondary::before {
    content: "\25CB";
    color: var(--text-dim);
}

.skills__matrix-legend {
    margin-top: var(--sp-2);
    font-size: var(--fs-label);
    color: var(--text-dim);
    display: flex;
    align-items: center;
    gap: var(--gap);
}

.skills__legend-dot {
    display: inline-block;
    width: var(--sp-2);
    text-align: center;
}

.skills__legend-dot--primary::before { content: "\25CF"; color: var(--accent); }
.skills__legend-dot--secondary::before { content: "\25CB"; color: var(--text-dim); }

.skills__cta {
    text-align: center;
    padding: var(--sp-5) 0;
    margin-top: var(--sp-5);
    border-top: var(--border) solid var(--accent-border);
}

.skills__cta h3 {
    margin-bottom: var(--sp-2);
}

.skills__cta p {
    color: var(--text-dim);
    margin-bottom: var(--sp-4);
}

.skills__cta-btns {
    display: flex;
    gap: var(--gap);
    justify-content: center;
}

.skills__cta-btn {
    display: inline-block;
    background: var(--accent);
    color: var(--bg-deep);
    padding: var(--sp-2) var(--sp-5);
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-mid);
    text-decoration: none;
    text-transform: uppercase;
    border: calc(var(--border) * 2) solid var(--accent);
    transition: opacity var(--an-speed);
}

.skills__cta-btn:hover { opacity: var(--op-mid); }

.skills__cta-btn--ghost {
    background: transparent;
    color: var(--text-light);
    border-color: var(--accent-border);
}

.skills__cta-btn--ghost:hover {
    background: var(--accent);
    color: var(--bg-deep);
    border-color: var(--accent);
}

@media (max-width: var(--brk-m)) {
    .skills__grid { grid-template-columns: 1fr; }
    .skills__roles { gap: var(--gap); }
}

.about {
    max-width: var(--lw-xl);
}

.about__hero {
    margin-bottom: var(--sp-8);
}

.about__tagline {
    font-family: var(--fn-mono);
    font-size: var(--fs-h2);
    font-weight: var(--fw-bold);
    color: var(--text-bright);
    line-height: var(--lh-tight);
    margin-bottom: var(--sp-4);
}

.about__desc {
    font-size: var(--fs-body);
    color: var(--text-light);
    line-height: var(--lh-relaxed);
}

.about__stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--gap);
    margin-bottom: var(--sp-8);
}

.about__stat {
    text-align: center;
    padding: var(--sp-5);
    border: var(--border) solid var(--accent-border);
}

.about__stat-value {
    display: block;
    font-family: var(--fn-mono);
    font-size: var(--fs-h2);
    font-weight: var(--fw-bold);
    color: var(--accent);
}

.about__stat-label {
    display: block;
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-label);
    color: var(--text-dim);
    text-transform: uppercase;
    margin-top: var(--sp-1);
}

.about__section {
    margin-bottom: var(--sp-7);
}

.about__heading {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-title);
    color: var(--text-bright);
    margin-bottom: var(--sp-2);
}

.about__text {
    font-size: var(--fs-body);
    color: var(--text-light);
    line-height: var(--lh-relaxed);
}

.about__list {
    list-style: none;
    padding: 0;
}

.about__list li {
    font-size: var(--fs-body);
    color: var(--text-light);
    line-height: var(--lh-body);
    padding: var(--sp-1) 0;
    padding-left: var(--sp-3);
    position: relative;
}

.about__list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: var(--sp-1);
    height: var(--sp-1);
    background: var(--accent);
    border-radius: 50%;
    transform: translateY(-50%);
}

.about__cta {
    display: flex;
    gap: var(--gap);
    margin-top: var(--sp-8);
}

/* about__btn ailesi SÖKÜLDÜ (2026-10-25): .btn--primary/.btn--ghost
   kopyasıydı — HTML şablonları kanonik .btn ailesine geçirildi. */

@media (max-width: var(--brk-m)) {
    .about__stats {
        grid-template-columns: repeat(2, 1fr);
    }

    .about__cta {
        flex-direction: column;
    }
}

@media (max-width: var(--brk-s)) {
    .about__stats {
        grid-template-columns: 1fr;
    }
}

.meth-section {
    margin-bottom: var(--sp-8);
}

.meth-section__title {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-title);
    color: var(--text-bright);
    margin-bottom: var(--sp-4);
}

.meth-section__text {
    font-size: var(--fs-body);
    color: var(--text-light);
    line-height: var(--lh-relaxed);
    max-width: var(--lw-xl);
}

.meth-section__ol {
    padding-left: var(--sp-5);
    max-width: var(--lw-xl);
}

.meth-section__ol li {
    font-size: var(--fs-body);
    color: var(--text-light);
    line-height: var(--lh-body);
    padding: var(--sp-1) 0;
}

.meth-compare {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: var(--gap);
    align-items: center;
    margin-bottom: var(--sp-2);
}

.meth-compare__item {
    padding: var(--sp-3);
    border: var(--border) solid var(--accent-border);
}

.meth-compare__item--new {
    border-color: var(--accent);
}

.meth-compare__label {
    display: block;
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-label);
    color: var(--accent);
    text-transform: uppercase;
    margin-bottom: var(--sp-1);
}

.meth-compare__text {
    font-size: var(--fs-label);
    color: var(--text-light);
    line-height: var(--lh-body);
}

.meth-compare__arrow {
    font-size: var(--fs-body);
    color: var(--accent);
    text-align: center;
}

.meth-factors {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gap);
    margin: var(--sp-5) 0;
}

.meth-factor-group {
    padding: var(--sp-3);
    border: var(--border) solid var(--accent-border);
}

.meth-factor-group__title {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-label);
    color: var(--accent);
    text-transform: uppercase;
    margin-bottom: var(--sp-2);
}

.meth-factor-group__list {
    list-style: none;
    padding: 0;
}

.meth-factor-group__list li {
    font-size: var(--fs-label);
    color: var(--text-dim);
    padding: var(--sp-1) 0;
    padding-left: var(--sp-2);
    position: relative;
}

.meth-factor-group__list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: var(--sp-1);
    height: var(--sp-1);
    background: var(--accent);
    border-radius: 50%;
    transform: translateY(-50%);
}

@media (max-width: var(--brk-m)) {
    .meth-factors {
        grid-template-columns: 1fr;
    }

    .meth-compare {
        grid-template-columns: 1fr;
        gap: var(--gap);
    }

    .meth-compare__arrow {
        transform: rotate(90deg);
    }
}

.faq {
    max-width: var(--lw-xl);
}

.faq__item {
    border-bottom: var(--border) solid var(--accent-border);
}

.faq__q {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--sp-3) 0;
    background: none;
    border: none;
    cursor: pointer;
    font-family: var(--fn-mono);
    font-size: var(--fs-body);
    font-weight: var(--fw-semibold);
    color: var(--text-bright);
    text-align: left;
}

.faq__icon {
    font-family: var(--fn-mono);
    font-size: var(--fs-body);
    color: var(--accent);
    flex-shrink: 0;
    width: var(--sp-5);
    text-align: center;
}

.faq__a {
    max-height: 0;
    overflow: hidden;
    transition: max-height var(--an-speed) ease, padding var(--an-speed) ease;
}

.faq__item--open .faq__a {
    max-height: var(--sp-8);
    padding-bottom: var(--sp-3);
}

.faq__a p {
    font-size: var(--fs-body);
    color: var(--text-light);
    line-height: var(--lh-relaxed);
}

.faq__a a {
    color: var(--accent);
}

.api-docs {
    max-width: var(--lw-xl);
}

.api-code {
    background: var(--bg-dark);
    padding: var(--sp-3);
    margin: var(--sp-2) 0;
    overflow-x: auto;
}

.api-code code {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--accent);
}

.api-table-wrap {
    overflow-x: auto;
    margin: var(--sp-2) 0;
}

.api-table {
    width: 100%;
    border-collapse: collapse;
}

.api-table th,
.api-table td {
    padding: var(--sp-2) var(--sp-3);
    text-align: left;
    font-size: var(--fs-label);
    border-bottom: var(--border) solid var(--accent-border);
}

.api-table th {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-label);
    color: var(--text-dim);
    text-transform: uppercase;
}

.api-table td {
    color: var(--text-light);
}

.api-endpoint {
    margin-bottom: var(--sp-5);
    padding-bottom: var(--sp-4);
    border-bottom: var(--border) solid var(--accent-border);
}

.api-endpoint__header {
    display: flex;
    align-items: center;
    gap: var(--gap);
    margin-bottom: var(--sp-2);
}

.api-endpoint__method {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-label);
    padding: var(--sp-1) var(--sp-2);
    font-weight: var(--fw-bold);
}

.api-endpoint__method--get {
    color: var(--c-olive-green);
    background: var(--sev-bg-info);
}

.api-endpoint__path {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--text-bright);
}

.api-endpoint__desc {
    font-size: var(--fs-label);
    color: var(--text-dim);
    line-height: var(--lh-body);
}

.pricing__subtitle {
    font-size: var(--fs-body);
    color: var(--text-dim);
    margin-bottom: var(--sp-8);
}

.pricing__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--gap);
    margin-bottom: var(--sp-7);
}

.pricing__card {
    padding: var(--sp-5);
    border: var(--border) solid var(--accent-border);
    display: flex;
    flex-direction: column;
}

.pricing__card--popular {
    border-color: var(--accent);
    position: relative;
}

.pricing__card--enterprise {
    border-color: var(--gold);
}

.pricing__badge {
    position: absolute;
    top: calc(var(--sp-5) * -1 - var(--sp-1));
    left: 0;
    right: 0;
    text-align: center;
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-label);
    color: var(--bg-deep);
    background: var(--accent);
    padding: var(--sp-1) var(--sp-2);
}

.pricing__tier {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-title);
    color: var(--text-bright);
    margin-bottom: var(--sp-2);
}

.pricing__price {
    font-family: var(--fn-mono);
    font-size: var(--fs-h2);
    font-weight: var(--fw-bold);
    color: var(--accent);
    margin-bottom: var(--sp-1);
}

.pricing__card--enterprise .pricing__price {
    color: var(--gold);
}

.pricing__period {
    font-size: var(--fs-label);
    font-weight: var(--fw-regular);
    color: var(--text-dim);
}

.pricing__target {
    font-size: var(--fs-label);
    color: var(--text-dim);
    margin-bottom: var(--sp-4);
    line-height: var(--lh-body);
}

.pricing__features {
    list-style: none;
    padding: 0;
    flex: 1;
    margin-bottom: var(--sp-5);
}

.pricing__features li {
    font-size: var(--fs-label);
    color: var(--text-light);
    padding: var(--sp-1) 0;
    padding-left: var(--sp-3);
    position: relative;
    line-height: var(--lh-body);
}

.pricing__features li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: var(--sp-1);
    height: var(--sp-1);
    background: var(--accent);
    border-radius: 50%;
    transform: translateY(-50%);
}

.pricing__btn {
    display: block;
    text-align: center;
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--bg-deep);
    background: var(--accent);
    padding: var(--sp-3);
    text-decoration: none;
    transition: background var(--an-speed);
}

.pricing__btn--free {
    background: var(--bg-dark);
    color: var(--text-bright);
    border: var(--border) solid var(--accent-border);
}

.pricing__btn--outline {
    background: transparent;
    color: var(--gold);
    border: var(--border) solid var(--gold);
}

.pricing__note {
    text-align: center;
    font-size: var(--fs-label);
    color: var(--text-dim);
}

@media (max-width: var(--brk-m)) {
    .pricing__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: var(--brk-s)) {
    .pricing__grid {
        grid-template-columns: 1fr;
    }
}

.contact-msg {
    text-align: center;
    padding: var(--sp-8) 0;
}

.contact-msg__text {
    font-size: var(--fs-body);
    color: var(--text-light);
    margin-bottom: var(--sp-5);
}

.contact-msg__link {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--accent);
    border: var(--border) solid var(--accent-border);
    padding: var(--sp-3) var(--sp-5);
}

/* ─── Mitigations page ─── */

.mit-filters {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap);
    margin-bottom: var(--sp-6);
}

.mit-group {
    margin-bottom: var(--sp-8);
    padding-left: var(--sp-5);
    border-left: var(--sp-1) solid var(--c-charcoal);
}

[data-group="NSA"].mit-group {
    border-left-color: var(--c-xanadu);
}

[data-group="SA"].mit-group {
    border-left-color: var(--c-olive-green);
}

.mit-group.is-empty {
    display: none;
}

.mit-card {
    border-bottom: var(--border) solid var(--accent-border);
    margin-bottom: var(--sp-1);
}

.mit-card.is-hidden {
    display: none;
}

.mit-card__header {
    display: flex;
    align-items: center;
    gap: var(--gap);
    padding: var(--sp-4) var(--sp-5);
    cursor: pointer;
    list-style: none;
    transition: background var(--an-speed);
}

.mit-card__header::-webkit-details-marker {
    display: none;
}

.mit-card__header:hover {
    background: var(--accent-border);
}

.mit-card__chevron {
    display: inline-block;
    width: var(--sp-2);
    height: var(--sp-2);
    border-right: calc(var(--border) * 2) solid var(--text-dim);
    border-bottom: calc(var(--border) * 2) solid var(--text-dim);
    transform: rotate(-45deg);
    transition: transform var(--an-speed);
    flex-shrink: 0;
}

details[open] > .mit-card__header .mit-card__chevron {
    transform: rotate(45deg);
}

.mit-card__id {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    font-weight: var(--fw-bold);
    color: var(--text-bright);
}

.mit-badge {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    padding: var(--sp-1) var(--sp-2);
    border: var(--border) solid;
    font-weight: var(--fw-semibold);
}

.mit-badge--priority-P1 {
    color: var(--sev-critical);
    border-color: var(--sev-critical);
    background: var(--sev-bg-critical);
}

.mit-badge--priority-P2 {
    color: var(--sev-medium);
    border-color: var(--sev-medium);
    background: var(--sev-bg-medium);
}

.mit-badge--cost-LOW {
    color: var(--c-olive-green);
    border-color: var(--c-olive-green);
    background: color-mix(in srgb, var(--c-olive-green) 15%, transparent);
}

.mit-badge--cost-MEDIUM {
    color: var(--c-xanadu);
    border-color: var(--c-xanadu);
    background: color-mix(in srgb, var(--c-xanadu) 15%, transparent);
}

.mit-badge--cost-HIGH {
    color: var(--sev-high);
    border-color: var(--sev-high);
    background: var(--sev-bg-high);
}

.mit-card__body {
    padding: var(--sp-4) var(--sp-5) var(--sp-6);
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.mit-card__section h3,
.mit-card__section h4 {
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--text-dim);
    text-transform: uppercase;
    margin-bottom: var(--sp-2);
}

.mit-card__section p {
    color: var(--text-light);
    line-height: var(--lh-relaxed);
}

.mit-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap);
    font-size: var(--fs-label);
    color: var(--text-dim);
    align-items: center;
}

.mit-card__score {
    font-family: var(--fn-mono);
}

.mit-card__score strong {
    color: var(--text-bright);
}

.mit-card__effort {
    font-size: var(--fs-label);
    max-width: var(--lw-xl);
}

.mit-card__vendors h4 {
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--text-dim);
    text-transform: uppercase;
    margin-bottom: var(--sp-4);
}

.mit-vendor-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
    gap: var(--gap);
}

.mit-vendor {
    background: var(--bg-dark);
    border: var(--border) solid var(--accent-border);
    padding: var(--sp-4);
}

.mit-vendor__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--sp-3);
}

.mit-vendor__name {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    color: var(--accent-bright);
    letter-spacing: var(--ls-tight);
}

.mit-vendor__file {
    font-size: var(--fs-label);
    color: var(--text-dim);
}

.mit-vendor__snippet {
    background: var(--bg-deep);
    border: var(--border) solid var(--accent-border);
    padding: var(--sp-3);
    margin-bottom: var(--sp-3);
    overflow-x: auto;
    font-size: var(--fs-label);
    line-height: var(--lh-body);
}

.mit-vendor__snippet code {
    background: none;
    padding: 0;
    color: var(--text-light);
}

.mit-vendor__desc {
    font-size: var(--fs-label);
    color: var(--text-dim);
    line-height: var(--lh-relaxed);
}

.mit-card__steps {
    padding-left: var(--sp-5);
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.mit-card__steps li {
    color: var(--text-light);
    font-size: var(--fs-label);
    line-height: var(--lh-relaxed);
}

.mit-card__partial {
    background: color-mix(in srgb, var(--c-amber) 8%, transparent);
    border-left: var(--sp-1) solid var(--sev-medium);
    padding: var(--sp-3) var(--sp-4);
    font-size: var(--fs-label);
    color: var(--text-light);
    line-height: var(--lh-relaxed);
}

.mit-card__partial strong {
    color: var(--sev-medium);
}

.mit-card__link {
    display: inline-block;
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    color: var(--accent);
    text-decoration: none;
    transition: color var(--an-speed);
}

.mit-card__link:hover {
    color: var(--accent-bright);
}

@media (max-width: var(--brk-m)) {
    .mit-vendor-grid {
        grid-template-columns: 1fr;
    }
}

/* ─── Profiles page ─── */

.prof-filters {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap);
    margin-bottom: var(--sp-6);
}

.prof-grid {
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.prof-card {
    border-bottom: var(--border) solid var(--accent-border);
}

.prof-card.is-hidden {
    display: none;
}

.prof-card__header {
    display: flex;
    align-items: center;
    gap: var(--gap);
    padding: var(--sp-4) var(--sp-5);
    cursor: pointer;
    list-style: none;
    transition: background var(--an-speed);
}

.prof-card__header::-webkit-details-marker {
    display: none;
}

.prof-card__header:hover {
    background: var(--accent-border);
}

.prof-card__chevron {
    display: inline-block;
    width: var(--sp-2);
    height: var(--sp-2);
    border-right: calc(var(--border) * 2) solid var(--text-dim);
    border-bottom: calc(var(--border) * 2) solid var(--text-dim);
    transform: rotate(-45deg);
    transition: transform var(--an-speed);
    flex-shrink: 0;
}

details[open] > .prof-card__header .prof-card__chevron {
    transform: rotate(45deg);
}

.prof-card__name {
    font-family: var(--fn-mono);
    font-size: var(--fs-body);
    font-weight: var(--fw-bold);
    color: var(--text-bright);
    letter-spacing: var(--ls-tight);
}

.prof-badge {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    padding: var(--sp-1) var(--sp-2);
    border: var(--border) solid;
    font-weight: var(--fw-semibold);
}

.prof-badge--soph-STATE_SPONSOR {
    color: var(--sev-critical);
    border-color: var(--sev-critical);
    background: var(--sev-bg-critical);
}

.prof-badge--soph-ADVANCED {
    color: var(--sev-high);
    border-color: var(--sev-high);
    background: var(--sev-bg-high);
}

.prof-badge--soph-INTERMEDIATE {
    color: var(--sev-medium);
    border-color: var(--sev-medium);
    background: var(--sev-bg-medium);
}

.prof-card__body {
    padding: var(--sp-4) var(--sp-5) var(--sp-6);
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.prof-card__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--gap);
}

.prof-card__field {
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.prof-card__label {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--text-dim);
    text-transform: uppercase;
}

.prof-card__field p {
    color: var(--text-light);
    line-height: var(--lh-relaxed);
}

.prof-card__metrics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--gap);
    padding: var(--sp-4);
    background: var(--bg-dark);
    border: var(--border) solid var(--accent-border);
}

.prof-metric {
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.prof-metric__label {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    color: var(--text-dim);
}

.prof-metric__value {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    color: var(--text-bright);
}

.prof-soph-bar {
    display: inline-block;
    width: 100%;
    height: var(--sp-2);
    background: var(--c-charcoal);
    border-radius: var(--br-zero);
    overflow: hidden;
    margin-top: var(--sp-2);
}

.prof-soph-fill {
    display: block;
    height: 100%;
    border-radius: var(--br-zero);
}

.prof-soph-fill--STATE_SPONSOR { width: 100%; background: var(--sev-critical); }
.prof-soph-fill--ADVANCED { width: 66%; background: var(--sev-high); }
.prof-soph-fill--INTERMEDIATE { width: 33%; background: var(--sev-medium); }

.prof-card__chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap);
}

.prof-chip {
    font-size: var(--fs-label);
    padding: var(--sp-1) var(--sp-2);
    background: var(--bg-dark);
}

.prof-target-chip {
    display: inline-block;
    font-size: var(--fs-label);
    padding: var(--sp-1) var(--sp-2);
    background: var(--bg-mid);
    color: var(--text-light);
}

.prof-kc-chip {
    display: inline-block;
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    padding: var(--sp-1) var(--sp-2);
    background: var(--accent-border);
    border: var(--border) solid var(--accent-border);
    color: var(--accent);
    text-decoration: none;
    transition: background var(--an-speed), color var(--an-speed);
}

.prof-kc-chip:hover {
    background: var(--accent);
    color: var(--bg-deep);
}

.prof-rwe {
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.prof-rwe-item {
    display: flex;
    gap: var(--gap);
    padding-left: var(--sp-4);
    border-left: var(--sp-1) solid var(--accent-border);
}

.prof-rwe__year {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    color: var(--accent);
    flex-shrink: 0;
}

.prof-rwe__content p {
    color: var(--text-light);
    font-size: var(--fs-label);
    line-height: var(--lh-relaxed);
    margin-bottom: var(--sp-1);
}

.prof-rwe__source {
    font-size: var(--fs-label);
    color: var(--text-dim);
    font-style: italic;
}

@media (max-width: var(--brk-m)) {
    .prof-card__grid {
        grid-template-columns: 1fr;
    }
    .prof-card__metrics {
        grid-template-columns: 1fr;
    }
}

/* ─── Compliance page ─── */

.comp-controls {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: var(--gap);
    margin-bottom: var(--sp-6);
}

.comp-tabs {
    display: flex;
    gap: var(--gap);
    flex-wrap: wrap;
}

.comp-tab {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    padding: var(--sp-2) var(--sp-4);
    border: var(--border) solid var(--accent-border);
    background: transparent;
    color: var(--text-dim);
    cursor: pointer;
    transition: background var(--an-speed), color var(--an-speed), border-color var(--an-speed);
}

.comp-tab:hover {
    color: var(--text-light);
    border-color: var(--accent);
}

.comp-tab.active {
    background: var(--accent);
    color: var(--bg-deep);
    border-color: var(--accent);
}

.comp-mode-toggle {
    display: flex;
    gap: var(--gap);
}

.comp-mode-btn {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    padding: var(--sp-2) var(--sp-3);
    border: var(--border) solid var(--accent-border);
    background: transparent;
    color: var(--text-dim);
    cursor: pointer;
    transition: background var(--an-speed), color var(--an-speed);
}

.comp-mode-btn:hover {
    color: var(--text-light);
}

.comp-mode-btn.active {
    color: var(--accent-bright);
    border-color: var(--accent);
}

.comp-matrix {
    display: flex;
    flex-direction: column;
}

.comp-matrix__header {
    display: none;
}

.comp-row {
    border-bottom: var(--border) solid var(--accent-border);
    padding: var(--sp-4) var(--sp-5);
    transition: background var(--an-speed);
}

.comp-row:hover {
    background: var(--accent-border);
}

.comp-row.is-hidden {
    display: none;
}

.comp-row__id {
    margin-bottom: var(--sp-3);
}

.comp-row__link {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    color: var(--accent);
    text-decoration: none;
    letter-spacing: var(--ls-tight);
    transition: color var(--an-speed);
}

.comp-row__link:hover {
    color: var(--accent-bright);
}

.comp-row__frameworks {
    position: relative;
}

.comp-fm {
    display: none;
}

.comp-fm.is-hidden {
    display: none;
}

.comp-fm:not(.is-hidden) {
    display: block;
}

.comp-fm__ref {
    margin-bottom: var(--sp-3);
}

.comp-fm__ref code {
    font-size: var(--fs-label);
    color: var(--accent-bright);
    background: var(--accent-border);
    padding: var(--sp-1) var(--sp-3);
}

.comp-fm__body {
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.comp-fm__relevance {
    color: var(--text-light);
    line-height: var(--lh-relaxed);
    font-size: var(--fs-label);
}

.comp-fm__action,
.comp-fm__evidence {
    padding-left: var(--sp-4);
    border-left: var(--sp-1) solid var(--accent-border);
}

.comp-fm__label {
    display: block;
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--text-dim);
    text-transform: uppercase;
    margin-bottom: var(--sp-1);
}

.comp-fm__action p,
.comp-fm__evidence p {
    color: var(--text-light);
    font-size: var(--fs-label);
    line-height: var(--lh-relaxed);
}

@media (max-width: var(--brk-m)) {
    .comp-controls {
        flex-direction: column;
    }
    .comp-tabs {
        overflow-x: auto;
        flex-wrap: nowrap;
    }
}

/* ─── Detection Rules page ─── */

.dr-controls {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: var(--gap);
    margin-bottom: var(--sp-6);
}

.dr-tabs {
    display: flex;
    gap: var(--gap);
}

.dr-tab {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    padding: var(--sp-2) var(--sp-4);
    border: var(--border) solid var(--accent-border);
    background: transparent;
    color: var(--text-dim);
    cursor: pointer;
    transition: background var(--an-speed), color var(--an-speed), border-color var(--an-speed);
}

.dr-tab:hover {
    color: var(--text-light);
    border-color: var(--accent);
}

.dr-tab.active {
    background: var(--accent);
    color: var(--bg-deep);
    border-color: var(--accent);
}

.dr-mode-toggle {
    display: flex;
    gap: var(--gap);
}

.dr-mode-btn {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    padding: var(--sp-2) var(--sp-3);
    border: var(--border) solid var(--accent-border);
    background: transparent;
    color: var(--text-dim);
    cursor: pointer;
    transition: background var(--an-speed), color var(--an-speed);
}

.dr-mode-btn:hover {
    color: var(--text-light);
}

.dr-mode-btn.active {
    color: var(--accent-bright);
    border-color: var(--accent);
}

.dr-list {
    display: flex;
    flex-direction: column;
}

.dr-card {
    border-bottom: var(--border) solid var(--accent-border);
    margin-bottom: var(--sp-1);
}

.dr-card.is-hidden {
    display: none;
}

.dr-card__header {
    display: flex;
    align-items: center;
    gap: var(--gap);
    padding: var(--sp-4) var(--sp-5);
    background: var(--bg-dark);
}

.dr-card__id {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    color: var(--text-bright);
    letter-spacing: var(--ls-tight);
}

.dr-card__title {
    font-size: var(--fs-label);
    color: var(--text-light);
    flex: 1;
}

.dr-badge {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    padding: var(--sp-1) var(--sp-2);
    border: var(--border) solid;
    font-weight: var(--fw-semibold);
    text-transform: uppercase;
}

.dr-badge--level-critical {
    color: var(--sev-critical);
    border-color: var(--sev-critical);
    background: var(--sev-bg-critical);
}

.dr-badge--level-high {
    color: var(--sev-high);
    border-color: var(--sev-high);
    background: var(--sev-bg-high);
}

.dr-badge--level-medium {
    color: var(--sev-medium);
    border-color: var(--sev-medium);
    background: var(--sev-bg-medium);
}

.dr-badge--level-low {
    color: var(--sev-low);
    border-color: var(--sev-low);
    background: var(--sev-bg-low);
}

.dr-card__body {
    padding: var(--sp-4) var(--sp-5) var(--sp-6);
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.dr-card__meta {
    display: flex;
    align-items: center;
    gap: var(--gap);
    flex-wrap: wrap;
}

.dr-card__sigma-id code {
    color: var(--text-dim);
    font-size: var(--fs-label);
}

.dr-card__status {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--c-olive-green);
    text-transform: uppercase;
    letter-spacing: var(--ls-tight);
}

.dr-card__tags {
    display: flex;
    gap: var(--gap);
    flex-wrap: wrap;
}

.dr-tag {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    padding: var(--sp-1) var(--sp-2);
    background: var(--bg-mid);
    color: var(--text-dim);
}

.dr-format.is-hidden {
    display: none;
}

.dr-format__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--sp-2);
}

.dr-format__label {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--text-dim);
    text-transform: uppercase;
}

.dr-copy {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    padding: var(--sp-1) var(--sp-2);
    border: var(--border) solid var(--accent-border);
    background: transparent;
    color: var(--text-dim);
    cursor: pointer;
    transition: background var(--an-speed), color var(--an-speed), border-color var(--an-speed);
}

.dr-copy:hover {
    color: var(--accent);
    border-color: var(--accent);
}

.dr-copy--done {
    color: var(--c-olive-green);
    border-color: var(--c-olive-green);
}

.dr-code {
    background: var(--bg-deep);
    border: var(--border) solid var(--accent-border);
    padding: var(--sp-4);
    overflow-x: auto;
    font-size: var(--fs-label);
    line-height: var(--lh-body);
    margin: 0;
}

.dr-code code {
    background: none;
    padding: 0;
    color: var(--text-light);
}

.dr-card__fp {
    padding-left: var(--sp-4);
    border-left: var(--sp-1) solid var(--accent-border);
}

.dr-card__fp-label {
    display: block;
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--text-dim);
    text-transform: uppercase;
    margin-bottom: var(--sp-2);
}

.dr-card__fp ul {
    padding-left: var(--sp-5);
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.dr-card__fp li {
    font-size: var(--fs-label);
    color: var(--text-dim);
    line-height: var(--lh-relaxed);
}

.dr-card__link {
    display: inline-block;
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    color: var(--accent);
    text-decoration: none;
    transition: color var(--an-speed);
}

.dr-card__link:hover {
    color: var(--accent-bright);
}

@media (max-width: var(--brk-m)) {
    .dr-controls {
        flex-direction: column;
    }
}

/* ─── IR Playbooks page ─── */

.ir-subtitle {
    color: var(--text-dim);
    font-size: var(--fs-label);
    margin-bottom: var(--sp-6);
    margin-top: calc(var(--sp-5) * -1);
}

.ir-filters {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap);
    margin-bottom: var(--sp-6);
}

.ir-list {
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.ir-card {
    border-bottom: var(--border) solid var(--accent-border);
}

.ir-card.is-hidden {
    display: none;
}

.ir-card__header {
    display: flex;
    align-items: center;
    gap: var(--gap);
    padding: var(--sp-4) var(--sp-5);
    cursor: pointer;
    list-style: none;
    transition: background var(--an-speed);
}

.ir-card__header::-webkit-details-marker {
    display: none;
}

.ir-card__header:hover {
    background: var(--accent-border);
}

.ir-card__chevron {
    display: inline-block;
    width: var(--sp-2);
    height: var(--sp-2);
    border-right: calc(var(--border) * 2) solid var(--text-dim);
    border-bottom: calc(var(--border) * 2) solid var(--text-dim);
    transform: rotate(-45deg);
    transition: transform var(--an-speed);
    flex-shrink: 0;
}

details[open] > .ir-card__header .ir-card__chevron {
    transform: rotate(45deg);
}

.ir-card__kc {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    color: var(--accent);
    letter-spacing: var(--ls-tight);
}

.ir-card__name {
    font-size: var(--fs-label);
    color: var(--text-light);
    flex: 1;
}

.ir-card__count {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--text-dim);
    letter-spacing: var(--ls-tight);
}

.ir-card__body {
    padding: var(--sp-4) var(--sp-5) var(--sp-6);
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.ir-flow {
    padding-left: var(--sp-5);
    border-left: var(--sp-1) solid var(--accent-border);
    display: flex;
    flex-direction: column;
    gap: 0;
}

.ir-stage {
    display: flex;
    gap: var(--gap);
    padding: var(--sp-4) 0;
    position: relative;
    cursor: pointer;
}

.ir-stage__dot {
    width: var(--sp-3);
    height: var(--sp-3);
    border-radius: 50%;
    background: var(--c-charcoal);
    border: calc(var(--border) * 2) solid var(--accent-border);
    flex-shrink: 0;
    margin-top: var(--sp-1);
    position: relative;
    left: calc(var(--sp-5) * -1 - var(--sp-3) / 2 - 1px);
    transition: background var(--an-speed), border-color var(--an-speed);
}

.ir-stage--active .ir-stage__dot {
    background: var(--accent);
    border-color: var(--accent);
}

.ir-stage--reached .ir-stage__dot {
    background: var(--accent);
    border-color: var(--accent);
    opacity: var(--op-mid);
}

.ir-stage--recover .ir-stage__dot {
    background: var(--c-olive-green);
    border-color: var(--c-olive-green);
}

.ir-stage__content {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.ir-stage__head {
    display: flex;
    align-items: center;
    gap: var(--gap);
}

.ir-stage__num {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--text-dim);
}

.ir-stage__name {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-tight);
}

.ir-stage__name--Detect { color: var(--sev-critical); }
.ir-stage__name--Scope { color: var(--sev-high); }
.ir-stage__name--Isolate { color: var(--sev-medium); }
.ir-stage__name--Eradicate { color: var(--accent-bright); }
.ir-stage__name--Recover { color: var(--c-olive-green); }

.ir-stage__block {
    display: flex;
    flex-direction: column;
    gap: var(--gap);
    padding-left: var(--sp-4);
}

.ir-stage__label {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--text-dim);
    text-transform: uppercase;
}

.ir-stage__list {
    padding-left: var(--sp-5);
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.ir-stage__list li {
    font-size: var(--fs-label);
    color: var(--text-light);
    line-height: var(--lh-relaxed);
}

.ir-stage__chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap);
}

.ir-source-chip {
    display: inline-block;
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    padding: var(--sp-1) var(--sp-2);
    background: var(--accent-border);
    border: var(--border) solid var(--accent-border);
    color: var(--text-light);
}

.ir-stage__actions {
    padding-left: var(--sp-5);
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.ir-stage__actions li {
    font-size: var(--fs-label);
    color: var(--text-light);
    line-height: var(--lh-relaxed);
}

.ir-card__link {
    display: inline-block;
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    color: var(--accent);
    text-decoration: none;
    transition: color var(--an-speed);
}

.ir-card__link:hover {
    color: var(--accent-bright);
}

@media (max-width: var(--brk-m)) {
    .ir-flow {
        padding-left: var(--sp-3);
    }
    .ir-stage__dot {
        left: calc(var(--sp-3) * -1 - var(--sp-3) / 2 - 1px);
    }
}

.exec-tier-badge {
    display: inline-block;
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    padding: var(--sp-1) var(--sp-3);
    border: var(--border) solid var(--sev-critical);
    color: var(--sev-critical);
    margin-bottom: var(--sp-6);
}

.exec-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--gap);
    margin-bottom: var(--sp-8);
}

.exec-section {
    margin-bottom: var(--sp-8);
}

.exec-section--full {
    grid-column: 1 / -1;
}

.exec-section__title {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--text-dim);
    text-transform: uppercase;
    margin-bottom: var(--sp-5);
    padding-bottom: var(--sp-2);
    border-bottom: var(--border) solid var(--accent-border);
}

.exec-bar-group {
    display: grid;
    grid-template-columns: 3rem 1fr 3rem;
    align-items: center;
    gap: var(--gap);
    margin-bottom: var(--sp-3);
}

.exec-bar-label {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    color: var(--text-dim);
}

.exec-bar-track {
    height: var(--sp-4);
    background: var(--c-charcoal);
    position: relative;
    overflow: hidden;
}

.exec-bar-fill {
    position: absolute;
    top: 0;
    height: 100%;
    transition: width var(--an-speed);
}

.exec-bar-fill--critical { background: var(--sev-critical); }
.exec-bar-fill--high     { background: var(--sev-high); }
.exec-bar-fill--medium   { background: var(--sev-medium); }

.exec-bar-count {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    color: var(--text-bright);
    text-align: right;
}

.exec-bar-legend {
    display: flex;
    gap: var(--gap);
    margin-top: var(--sp-3);
}

.exec-legend-dot {
    display: inline-block;
    width: var(--sp-2);
    height: var(--sp-2);
    border-radius: 50%;
    margin-right: var(--sp-1);
    vertical-align: middle;
}

.exec-legend-dot--critical { background: var(--sev-critical); }
.exec-legend-dot--high     { background: var(--sev-high); }
.exec-legend-dot--medium   { background: var(--sev-medium); }
.exec-legend-dot--low      { background: var(--sev-low); }

.exec-legend-label {
    font-size: var(--fs-label);
    color: var(--text-dim);
}

.exec-component-breakdown {
    margin-top: var(--sp-5);
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.exec-comp-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--sp-1) var(--sp-3);
    border-bottom: var(--border) solid var(--accent-border);
}

.exec-comp-name {
    font-size: var(--fs-label);
    color: var(--text-light);
    text-transform: capitalize;
}

.exec-comp-count {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    color: var(--accent);
}

.exec-compliance {
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.exec-fw-row {
    display: grid;
    grid-template-columns: 6rem 1fr 3.5rem;
    align-items: center;
    gap: var(--gap);
}

.exec-fw-name {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    color: var(--text-dim);
}

.exec-fw-track {
    height: var(--sp-3);
    background: var(--c-charcoal);
    overflow: hidden;
}

.exec-fw-fill {
    height: 100%;
    background: var(--accent);
    transition: width var(--an-speed), opacity var(--an-speed);
    opacity: var(--op-mid);
}

.exec-fw-pct {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    color: var(--text-bright);
    text-align: right;
}

.exec-remediation {
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.exec-phase-track {
    display: flex;
    align-items: center;
    gap: 0;
    margin-bottom: var(--sp-5);
}

.exec-phase {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--gap);
    padding: var(--sp-3);
}

.exec-phase__dot {
    width: var(--sp-3);
    height: var(--sp-3);
    border-radius: 50%;
    background: var(--c-charcoal);
    border: calc(var(--border) * 2) solid var(--accent-border);
}

.exec-phase__dot--active {
    background: var(--accent);
    border-color: var(--accent);
}

.exec-phase__label {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    color: var(--text-dim);
    white-space: nowrap;
}

.exec-phase__count {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    color: var(--text-bright);
}

.exec-phase__line {
    flex: 1;
    height: calc(var(--border) * 2);
    background: var(--accent);
    min-width: var(--sp-8);
}

.exec-phase__line--pending {
    background: var(--c-charcoal);
    border-top: calc(var(--border) * 2) dashed var(--accent-border);
    height: 0;
}

.exec-phase--future .exec-phase__dot {
    background: var(--c-charcoal);
    border-color: var(--c-charcoal);
}

.exec-remediation-table {
    width: 100%;
    border-collapse: collapse;
}

.exec-remediation-table th {
    text-align: left;
    padding: var(--sp-2) var(--sp-3);
    background: var(--bg-dark);
    color: var(--text-dim);
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    text-transform: uppercase;
}

.exec-remediation-table td {
    padding: var(--sp-2) var(--sp-3);
    border-bottom: var(--border) solid var(--accent-border);
    font-size: var(--fs-label);
    color: var(--text-light);
    vertical-align: top;
}

.exec-rem-row {
    transition: background var(--an-speed);
}

.exec-rem-row:hover {
    background: var(--bg-dark);
}

.exec-priority {
    display: inline-block;
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    padding: var(--sp-1) var(--sp-2);
    font-weight: var(--fw-bold);
}

.exec-priority--P1 {
    background: var(--sev-bg-critical);
    color: var(--sev-critical);
}

.exec-priority--P2 {
    background: var(--sev-bg-high);
    color: var(--sev-high);
}

.exec-rem-link {
    color: var(--accent);
    text-decoration: none;
    transition: color var(--an-speed);
}

.exec-rem-link:hover {
    color: var(--accent-bright);
}

.exec-roi {
    font-family: var(--fn-mono);
    font-weight: var(--fw-bold);
    color: var(--c-olive-green);
}

.exec-roi-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--gap);
}

.exec-roi-card {
    padding: var(--sp-5);
    border: var(--border) solid var(--accent-border);
    text-align: center;
}

.exec-roi-card__value {
    display: block;
    font-family: var(--fn-mono);
    font-size: var(--fs-body);
    font-weight: var(--fw-black);
    color: var(--text-bright);
    margin-bottom: var(--sp-2);
}

.exec-roi-card__label {
    display: block;
    font-size: var(--fs-label);
    color: var(--text-dim);
    letter-spacing: var(--ls-tight);
}

.exec-ciso-hook {
    padding: var(--sp-6);
    margin-bottom: var(--sp-6);
    border: var(--border) solid var(--sev-critical);
    background: var(--sev-bg-critical);
}

.exec-ciso-hook__question {
    font-family: var(--fn-mono);
    font-size: var(--fs-h2);
    font-weight: var(--fw-bold);
    color: var(--sev-critical);
    margin-bottom: var(--sp-2);
}

.exec-ciso-hook__desc {
    font-size: var(--fs-body);
    color: var(--text-light);
    line-height: var(--lh-relaxed);
}

.exec-top3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--gap);
}

.exec-top3-card {
    padding: var(--sp-4);
    border: var(--border) solid var(--accent-border);
    border-top: var(--sp-1) solid var(--c-charcoal);
}

.exec-top3-card--CRITICAL { border-top-color: var(--sev-critical); }
.exec-top3-card--HIGH     { border-top-color: var(--sev-high); }
.exec-top3-card--MEDIUM   { border-top-color: var(--sev-medium); }

.exec-top3-badge {
    display: inline-block;
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    padding: var(--sp-1) var(--sp-2);
    margin-bottom: var(--sp-2);
}

.exec-top3-id {
    display: flex;
    align-items: center;
    gap: var(--gap);
    margin-bottom: var(--sp-1);
}

.exec-top3-mode {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--text-dim);
    padding: 0 var(--sp-1);
    border: var(--border) solid var(--accent-border);
}

.exec-top3-name {
    font-size: var(--fs-label);
    color: var(--text-light);
    margin-bottom: var(--sp-2);
    line-height: var(--lh-body);
}

.exec-top3-scores {
    display: flex;
    gap: var(--gap);
}

.exec-top3-score {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--text-dim);
}

.exec-gantt {
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.exec-gantt-row {
    display: grid;
    grid-template-columns: calc(var(--sp-6) * 5) 1fr 6rem;
    align-items: center;
    gap: var(--gap);
}

.exec-gantt__label {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--text-dim);
    letter-spacing: var(--ls-tight);
}

.exec-gantt__track {
    height: var(--sp-4);
    background: var(--c-charcoal);
    position: relative;
    overflow: hidden;
}

.exec-gantt__bar {
    position: absolute;
    top: 0;
    height: 100%;
    transition: width var(--an-speed), left var(--an-speed);
}

.exec-gantt__bar--p1   { background: var(--sev-critical); }
.exec-gantt__bar--p2   { background: var(--sev-high); }
.exec-gantt__bar--done { background: var(--c-olive-green); }

.exec-gantt__meta {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--text-dim);
    text-align: right;
}

.exec-cta {
    display: flex;
    gap: var(--gap);
    margin-bottom: var(--sp-8);
}

.exec-cta__btn {
    display: inline-block;
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    padding: var(--sp-3) var(--sp-6);
    text-decoration: none;
    text-transform: uppercase;
    transition: background var(--an-speed), color var(--an-speed);
}

.exec-cta__btn--pdf {
    color: var(--bg-deep);
    background: var(--accent);
    border: calc(var(--border) * 2) solid var(--accent);
}

.exec-cta__btn--pdf:hover {
    background: var(--accent-bright);
}

.exec-cta__btn--expert {
    color: var(--text-light);
    background: transparent;
    border: calc(var(--border) * 2) solid var(--accent-border);
}

.exec-cta__btn--expert:hover {
    border-color: var(--accent);
    color: var(--accent);
}

@media (max-width: var(--brk-m)) {
    .exec-grid {
        grid-template-columns: 1fr;
    }

    .exec-roi-grid {
        grid-template-columns: 1fr 1fr;
    }

    .exec-phase-track {
        flex-direction: column;
        align-items: flex-start;
    }

    .exec-phase__line {
        display: none;
    }

    .exec-fw-row {
        grid-template-columns: 4rem 1fr 3rem;
    }

    .exec-remediation-table {
        font-size: var(--fs-label);
    }

    .exec-top3 {
        grid-template-columns: 1fr;
    }

    .exec-gantt-row {
        grid-template-columns: 6rem 1fr 4rem;
    }

    .exec-cta {
        flex-direction: column;
    }
}

.risk__mode-avg {
    display: flex;
    gap: var(--gap);
    margin-top: var(--sp-3);
    padding-top: var(--sp-3);
    border-top: var(--border) solid var(--c-charcoal);
}

.risk__avg-label {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--text-dim);
    letter-spacing: var(--ls-tight);
}

.risk__avg-label strong {
    color: var(--text-bright);
}

.risk__avg-count {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--accent);
    margin-left: auto;
    letter-spacing: var(--ls-tight);
}

.risk-detail-section {
    margin: var(--sp-8) 0;
}

.risk-detail-section__title {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--text-dim);
    text-transform: uppercase;
    margin-bottom: var(--sp-5);
    padding-bottom: var(--sp-2);
    border-bottom: var(--border) solid var(--accent-border);
}

.risk-detail-controls {
    margin-bottom: var(--sp-4);
}

.risk-detail-tabs {
    display: flex;
    gap: var(--gap);
}

.risk-detail-tab {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    padding: var(--sp-1) var(--sp-3);
    border: var(--border) solid var(--accent-border);
    background: transparent;
    color: var(--text-dim);
    cursor: pointer;
    transition: background var(--an-speed), color var(--an-speed), border-color var(--an-speed);
}

.risk-detail-tab:hover {
    border-color: var(--accent);
    color: var(--text-light);
}

.risk-detail-tab.active {
    background: var(--accent);
    color: var(--bg-deep);
    border-color: var(--accent);
}

.risk-detail-table-wrap {
    overflow-x: auto;
}

.risk-detail-table {
    width: 100%;
    border-collapse: collapse;
    min-width: var(--max-width);
}

.risk-detail-table th {
    text-align: left;
    padding: var(--sp-2) var(--sp-3);
    background: var(--bg-dark);
    color: var(--text-dim);
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    text-transform: uppercase;
    white-space: nowrap;
}

.risk-detail-table td {
    padding: var(--sp-2) var(--sp-3);
    border-bottom: var(--border) solid var(--accent-border);
    font-size: var(--fs-label);
    color: var(--text-light);
    white-space: nowrap;
}

.risk-detail-row--CRITICAL td { color: var(--sev-critical); }
.risk-detail-row--HIGH td     { color: var(--sev-high); }
.risk-detail-row--MEDIUM td   { color: var(--sev-medium); }
.risk-detail-row--LOW td      { color: var(--sev-low); }

.risk-detail-row.is-hidden {
    display: none;
}

.risk-detail-link {
    color: var(--accent);
    text-decoration: none;
    transition: color var(--an-speed);
}

.risk-detail-link:hover {
    color: var(--accent-bright);
}

.risk-gap-section {
    margin: var(--sp-8) 0;
}

.risk-gap-desc {
    font-size: var(--fs-label);
    color: var(--text-dim);
    margin-bottom: var(--sp-5);
    line-height: var(--lh-body);
}

.risk-gap-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
    gap: var(--gap);
}

.risk-gap-card {
    padding: var(--sp-4);
    border: var(--border) solid var(--accent-border);
    transition: border-color var(--an-speed), background var(--an-speed);
}

.risk-gap-card:hover {
    border-color: var(--sev-critical);
    background: var(--sev-bg-critical);
}

.risk-gap-card__header {
    display: flex;
    align-items: baseline;
    gap: var(--gap);
    margin-bottom: var(--sp-3);
}

.risk-gap-card__name {
    font-size: var(--fs-label);
    color: var(--text-light);
}

.risk-gap-card__bars {
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.risk-gap-bar {
    display: grid;
    grid-template-columns: var(--sp-5) 1fr 2.5rem 2.5rem;
    align-items: center;
    gap: var(--gap);
}

.risk-gap-bar__label {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--text-dim);
    font-weight: var(--fw-bold);
}

.risk-gap-bar__track {
    height: var(--sp-2);
    background: var(--c-charcoal);
    position: relative;
    overflow: hidden;
}

.risk-gap-bar__fill {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background: var(--sev-high);
    transition: width var(--an-speed);
}

.risk-gap-bar__value {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--text-bright);
    font-weight: var(--fw-bold);
    text-align: right;
}

.risk-gap-bar__gap {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--sev-critical);
    text-align: right;
}

.risk-gap-card__distance {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: var(--sp-3);
    padding-top: var(--sp-2);
    border-top: var(--border) solid var(--accent-border);
}

.risk-gap-distance-label {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--text-dim);
    letter-spacing: var(--ls-tight);
}

.risk-gap-distance-value {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    color: var(--sev-critical);
}

.risk__delta--up {
    color: var(--sev-critical) !important;
}

.risk__delta--down {
    color: var(--c-olive-green) !important;
}

@media (max-width: var(--brk-m)) {
    .risk-gap-grid {
        grid-template-columns: 1fr;
    }

    .risk__mode-avg {
        flex-direction: column;
        gap: var(--gap);
    }

    .risk__avg-count {
        margin-left: 0;
    }
}

.detail__cves {
    display: flex;
    gap: var(--gap);
    margin-top: var(--sp-2);
    flex-wrap: wrap;
}

.detail__cve-link {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    padding: var(--sp-1) var(--sp-2);
    border: var(--border) solid var(--accent-border);
    color: var(--accent);
    transition: border-color var(--an-speed);
}

.detail__cve-link:hover {
    border-color: var(--accent);
}

.detail__meta-row {
    display: flex;
    gap: var(--gap);
    margin-top: var(--sp-3);
}

.detail__meta-item {
    font-size: var(--fs-label);
    color: var(--text-dim);
}

.detail__meta-item strong {
    color: var(--text-light);
}

.detail__ref {
    font-size: var(--fs-label);
}

.td-section {
    margin: var(--sp-6) 0;
}

.td-section__title {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--text-dim);
    text-transform: uppercase;
    margin-bottom: var(--sp-4);
    padding-bottom: var(--sp-2);
    border-bottom: var(--border) solid var(--accent-border);
}

.td-timeline {
    border-left: var(--sp-1) solid var(--accent-border);
    padding-left: var(--sp-5);
    margin-left: var(--sp-2);
}

.td-timeline__item {
    position: relative;
    padding-bottom: var(--sp-5);
    display: flex;
    align-items: flex-start;
    gap: var(--gap);
}

.td-timeline__item:last-child {
    padding-bottom: 0;
}

.td-timeline__dot {
    position: absolute;
    left: calc(-1 * var(--sp-5) - var(--sp-1));
    top: var(--sp-1);
    width: var(--sp-3);
    height: var(--sp-3);
    border-radius: 50%;
    background: var(--c-charcoal);
    border: var(--border) solid var(--accent-border);
}

.td-timeline__dot--first { background: var(--sev-critical); border-color: var(--sev-critical); }
.td-timeline__dot--validated { background: var(--sev-info); border-color: var(--sev-info); }
.td-timeline__dot--last { background: var(--accent); border-color: var(--accent); }

.td-timeline__content {
    display: flex;
    flex-direction: column;
    gap: var(--gap);
    padding-left: var(--sp-2);
}

.td-timeline__label {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-tight);
    color: var(--text-dim);
    text-transform: uppercase;
}

.td-timeline__date {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    color: var(--text-bright);
}

.td-validation {
    background: var(--bg-dark);
    padding: var(--sp-5);
    border: var(--border) solid var(--accent-border);
}

.td-validation__result {
    display: inline-block;
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-mid);
    padding: var(--sp-2) var(--sp-4);
    margin-bottom: var(--sp-4);
}

.td-validation__result--CONFIRMED {
    background: var(--sev-bg-info);
    color: var(--sev-info);
}

.td-validation__result--LAB {
    background: var(--sev-bg-medium);
    color: var(--sev-medium);
}

.td-validation__result--THEORETICAL {
    background: var(--sev-bg-low);
    color: var(--c-charcoal);
}

.td-validation__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    gap: var(--gap);
}

.td-validation__field {
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.td-validation__label {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--text-dim);
    letter-spacing: var(--ls-tight);
    text-transform: uppercase;
}

.td-validation__value {
    font-size: var(--fs-label);
    color: var(--text-light);
    line-height: var(--lh-body);
}

.td-vendors {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
    gap: var(--gap);
}

.td-vendor {
    padding: var(--sp-4);
    border: var(--border) solid var(--accent-border);
    background: var(--bg-dark);
}

.td-vendor__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--sp-2);
}

.td-vendor__name {
    font-weight: var(--fw-bold);
    color: var(--text-bright);
}

.td-vendor__status {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    padding: var(--sp-1) var(--sp-2);
    letter-spacing: var(--ls-tight);
}

.td-vendor__status--affected {
    background: var(--sev-bg-critical);
    color: var(--sev-critical);
}

.td-vendor__status--patched {
    background: var(--sev-bg-info);
    color: var(--sev-info);
}

.td-vendor__status--partial {
    background: var(--sev-bg-medium);
    color: var(--sev-medium);
}

.td-vendor__versions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap);
}

.td-vendor__version {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    padding: var(--sp-1) var(--sp-2);
    background: var(--c-charcoal);
    color: var(--text-light);
}

.td-incidents {
    display: flex;
    flex-direction: column;
    gap: 0;
    border-left: var(--sp-1) solid var(--accent-border);
    padding-left: var(--sp-5);
    margin-left: var(--sp-2);
}

.td-incident {
    display: grid;
    grid-template-columns: 4rem 1fr;
    gap: var(--gap);
    padding: var(--sp-4) 0;
    position: relative;
}

.td-incident__year {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    color: var(--accent);
    position: relative;
}

.td-incident__year::before {
    content: "";
    position: absolute;
    left: calc(-1 * var(--sp-5) - var(--sp-1) - var(--sp-1));
    top: var(--sp-1);
    width: var(--sp-2);
    height: var(--sp-2);
    border-radius: 50%;
    background: var(--accent);
}

.td-incident__desc {
    font-size: var(--fs-label);
    color: var(--text-light);
    line-height: var(--lh-body);
    margin-bottom: var(--sp-1);
}

.td-incident__source {
    font-size: var(--fs-label);
    color: var(--text-dim);
    font-style: italic;
}

.td-related {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
    gap: var(--gap);
}

.td-related__card {
    display: block;
    padding: var(--sp-4);
    border: var(--border) solid var(--accent-border);
    background: var(--bg-dark);
    text-decoration: none;
    transition: border-color var(--an-speed);
}

.td-related__id {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    color: var(--accent);
    margin-bottom: var(--sp-1);
}

.td-related__name {
    font-size: var(--fs-label);
    color: var(--text-light);
    margin-bottom: var(--sp-2);
}

.td-related__badges {
    display: flex;
    gap: var(--gap);
}

.td-compliance {
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.td-fw-item {
    background: var(--bg-dark);
    padding: var(--sp-4);
    border: var(--border) solid var(--accent-border);
}

.td-fw-item__header {
    display: flex;
    align-items: center;
    gap: var(--gap);
    margin-bottom: var(--sp-2);
}

.td-fw-item__name {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    color: var(--accent);
}

.td-fw-item__ref {
    font-size: var(--fs-label);
}

.td-fw-item__relevance {
    font-size: var(--fs-label);
    color: var(--text-dim);
    line-height: var(--lh-body);
    margin-bottom: var(--sp-2);
}

.td-fw-item__action,
.td-fw-item__evidence {
    font-size: var(--fs-label);
    color: var(--text-light);
    line-height: var(--lh-body);
    margin-bottom: var(--sp-1);
}

.td-fw-item__action strong,
.td-fw-item__evidence strong {
    color: var(--text-dim);
}

.td-detection {
    background: var(--bg-dark);
    padding: var(--sp-5);
    border: var(--border) solid var(--accent-border);
}

.td-det-rule__header {
    display: flex;
    align-items: center;
    gap: var(--gap);
    margin-bottom: var(--sp-3);
}

.td-det-rule__title {
    font-weight: var(--fw-bold);
    color: var(--text-bright);
}

.td-det-rule__id {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--text-dim);
}

.td-det-false {
    font-size: var(--fs-label);
    color: var(--text-dim);
    margin-bottom: var(--sp-4);
}

.td-det-false strong {
    color: var(--text-light);
}

.td-det-false ul {
    padding-left: var(--sp-5);
    margin-top: var(--sp-1);
}

.td-det-false li {
    font-size: var(--fs-label);
    color: var(--text-dim);
    list-style: disc;
}

.td-det-query {
    margin-top: var(--sp-3);
}

.td-det-query__summary {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--accent);
    cursor: pointer;
    padding: var(--sp-2) 0;
    transition: color var(--an-speed);
}

.td-det-query__summary:hover {
    color: var(--accent-bright);
}

.td-det-query__code {
    background: var(--c-charcoal);
    padding: var(--sp-4);
    overflow-x: auto;
    margin-top: var(--sp-2);
}

.td-det-query__code code {
    font-size: var(--fs-label);
    color: var(--text-light);
    line-height: var(--lh-relaxed);
    white-space: pre-wrap;
    word-break: break-all;
    background: transparent;
}

.mitigation__guidance,
.mitigation__steps,
.mitigation__partial {
    margin-top: var(--sp-4);
    padding-top: var(--sp-3);
    border-top: var(--border) solid var(--accent-border);
}

.mitigation__guidance strong,
.mitigation__steps strong,
.mitigation__partial strong {
    display: block;
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--text-dim);
    text-transform: uppercase;
    margin-bottom: var(--sp-2);
}

.mitigation__guidance p,
.mitigation__partial p {
    font-size: var(--fs-label);
    color: var(--text-light);
    line-height: var(--lh-body);
}

.mitigation__steps ol {
    padding-left: var(--sp-5);
}

.mitigation__steps li {
    font-size: var(--fs-label);
    color: var(--text-light);
    line-height: var(--lh-relaxed);
}

.mitigation__priority {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    font-weight: var(--fw-bold);
    padding: var(--sp-1) var(--sp-2);
}

.mitigation__priority--P1 {
    background: var(--sev-bg-critical);
    color: var(--sev-critical);
}

.mitigation__priority--P2 {
    background: var(--sev-bg-high);
    color: var(--sev-high);
}

.mitigation__vendor-configs {
    margin-top: var(--sp-4);
    padding-top: var(--sp-3);
    border-top: var(--border) solid var(--accent-border);
}

.mitigation__vendor-configs strong {
    display: block;
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--text-dim);
    text-transform: uppercase;
    margin-bottom: var(--sp-3);
}

.td-vendor-configs {
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.td-vc {
    border: var(--border) solid var(--accent-border);
}

.td-vc__summary {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--accent);
    padding: var(--sp-2) var(--sp-3);
    cursor: pointer;
    list-style: none;
    transition: background var(--an-speed);
}

.td-vc__summary:hover {
    background: var(--accent-border);
}

.td-vc__desc {
    font-size: var(--fs-label);
    color: var(--text-dim);
    padding: var(--sp-2) var(--sp-3);
}

.td-vc__code {
    background: var(--c-charcoal);
    padding: var(--sp-3);
    margin: 0;
    overflow-x: auto;
}

.td-vc__code code {
    font-size: var(--fs-label);
    color: var(--text-light);
    line-height: var(--lh-relaxed);
    white-space: pre-wrap;
    word-break: break-all;
    background: transparent;
}

.td-remediation {
    background: var(--bg-dark);
    padding: var(--sp-5);
    border: var(--border) solid var(--accent-border);
}

.td-rem__row {
    display: grid;
    grid-template-columns: calc(var(--sp-6) * 5) 1fr;
    gap: var(--gap);
    padding: var(--sp-2) 0;
    border-bottom: var(--border) solid var(--accent-border);
}

.td-rem__label {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    color: var(--text-dim);
    letter-spacing: var(--ls-tight);
    text-transform: uppercase;
}

.td-rem__value {
    font-size: var(--fs-label);
    color: var(--text-light);
}

.td-rem__roi {
    font-family: var(--fn-mono);
    font-weight: var(--fw-bold);
    color: var(--c-olive-green);
}

.td-rem__rationale {
    margin-top: var(--sp-3);
    padding-top: var(--sp-3);
    border-top: var(--border) solid var(--accent-border);
}

.td-rem__rationale strong {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--text-dim);
    text-transform: uppercase;
    display: block;
    margin-bottom: var(--sp-2);
}

.td-rem__rationale p {
    font-size: var(--fs-label);
    color: var(--text-light);
    line-height: var(--lh-body);
}

@media (max-width: var(--brk-m)) {
    .detail__meta-row {
        flex-direction: column;
        gap: var(--gap);
    }

    .td-vendors {
        grid-template-columns: 1fr;
    }

    .td-related {
        grid-template-columns: 1fr;
    }

    .td-incident {
        grid-template-columns: 3rem 1fr;
    }

    .td-rem__row {
        grid-template-columns: 1fr;
    }

    .td-rem__label {
        margin-bottom: 0;
    }
}

/* ═══ §11.8 — upgrade lisans bloğu (inline söküldü; gap boşluğu verir) ═══ */
.upgrade-note { margin-top: var(--sp-4); display: flex; flex-direction: column; align-items: flex-start; gap: var(--gap); }