/* Page-scoped styles: preserve SMARTSCHOOL navigation and the existing blue hero. */
.delok-result {
    --delok-navy: #0a2240;
    --delok-blue: #1565c0;
    --delok-yellow: #ffc107;
    --delok-line: #e2e8f0;
    color: #334155;
    line-height: 1.75;
    overflow-wrap: anywhere;
}
.delok-result *, .delok-result *::before, .delok-result *::after { box-sizing: border-box; }
.delok-result .delok-result-container, .delok-result .dr-container { width: min(1120px, calc(100% - 40px)); margin-inline: auto; }
.delok-result h1, .delok-result h2, .delok-result h3 { font-weight: 800; line-height: 1.2; }
.delok-result h1 { font-size: clamp(2rem, 4.5vw, 3.5rem); margin: 16px 0 24px; color: #fff; }
.delok-result h2 { color: var(--delok-navy); font-size: clamp(1.6rem, 3vw, 2.4rem); margin: 0 0 20px; }
.delok-result h3 { color: var(--delok-navy); font-size: 1.15rem; margin: 0 0 12px; }
.delok-result p { margin: 0 0 16px; }
.delok-result section { padding: 64px 0; scroll-margin-top: 100px; }
.delok-result .delok-result-eyebrow, .delok-result .dr-eyebrow { color: var(--delok-blue); font-size: .8rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.delok-result .delok-result-hero { padding: 80px 0; background: linear-gradient(125deg, #0a2240, #124980); color: #fff; }
.delok-result .delok-result-hero-grid { display: grid; grid-template-columns: 1.3fr 1fr; align-items: center; gap: 56px; }
.delok-result .delok-result-hero .delok-result-eyebrow, .delok-result .delok-result-date { color: var(--delok-yellow); }
.delok-result .delok-result-lead { font-size: 1.1rem; color: #e2e8f0; }
.delok-result .delok-result-brand { text-align: center; border: 1px solid #ffffff30; border-radius: 24px; padding: 32px; background: #ffffff08; }
.delok-result .delok-result-brand img { display: block; width: 100%; height: auto; max-height: 250px; object-fit: contain; margin: 0 auto 24px; }
.delok-result .delok-result-brand p { margin: 0; color: #e2e8f0; }
.delok-result .delok-result-brand .delok-result-device { margin-top: 16px; font-size: .85rem; color: var(--delok-yellow); }
.delok-result .delok-result-actions, .delok-result .dr-report-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 28px; }
.delok-result .delok-result-button, .delok-result .dr-btn {
    display: inline-flex; justify-content: center; align-items: center; gap: 12px; min-height: 48px;
    padding: 12px 22px; border: 2px solid transparent; border-radius: 10px; background: var(--delok-blue);
    color: #fff; font-weight: 700; line-height: 1.5; text-decoration: none; text-align: center;
}
.delok-result .delok-result-button:hover, .delok-result .dr-btn:hover { background: #0d4a91; }
.delok-result .delok-result-hero .delok-result-button { background: var(--delok-yellow); color: var(--delok-navy); }
.delok-result .delok-result-hero .delok-result-button-outline, .delok-result .dr-btn-ghost-light { background: transparent; color: #fff; border-color: #ffffff80; }
.delok-result .delok-result-button-outline:hover, .delok-result .dr-btn-ghost-light:hover { background: #ffffff18; }
.delok-result a:focus-visible { outline: 3px solid #db941d; outline-offset: 5px; }
.delok-result .dr-why, .delok-result .dr-subjects, .delok-result .dr-difficulties, .delok-result .dr-roadmap { background: #f5f7fa; }
.delok-result .dr-why .dr-container, .delok-result .dr-partner .dr-container { max-width: 820px; text-align: center; }
.delok-result .dr-why .dr-lettrine { text-align: start; font-size: 1.1rem; }
.delok-result .dr-kpis-head, .delok-result .dr-model-head { max-width: 720px; margin: 0 auto 36px; text-align: center; }
.delok-result .dr-kpi-grid, .delok-result .dr-diff-grid, .delok-result .dr-learn-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
.delok-result .dr-kpi-card, .delok-result .dr-worked-card, .delok-result .dr-diff-card, .delok-result .dr-learn-card, .delok-result .dr-rm-card {
    min-width: 0; padding: 28px 22px; border: 1px solid var(--delok-line); border-radius: 16px; background: #fff;
}
.delok-result .dr-kpi-card { text-align: center; }
.delok-result .dr-kpi-arc { width: 110px; height: 110px; position: relative; margin: 0 auto 18px; }
.delok-result .dr-kpi-arc svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.delok-result .dr-kpi-arc circle { fill: none; stroke-width: 6; }
.delok-result .dr-track { stroke: var(--delok-line); }
.delok-result .dr-val { stroke: var(--delok-yellow); }
.delok-result .dr-kpi-num { position: absolute; inset: 0; display: grid; place-items: center; font-size: 1.6rem; font-weight: 800; color: var(--delok-navy); }
.delok-result .dr-kpi-label { margin: 0; font-size: .95rem; }
.delok-result .dr-model-chain { display: flex; align-items: center; justify-content: center; gap: 8px; }
.delok-result .dr-model-node { flex: 1; min-width: 0; text-align: center; font-weight: 700; color: var(--delok-navy); font-size: .85rem; }
.delok-result .dr-ic { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; background: #f8ead8; color: #000; box-shadow: 0 2px 6px rgb(160 110 50 / 6%); margin: 0 auto 12px; font-size: 1.5rem; }
.delok-result .dr-model-arrow { color: #64748b; }
.delok-result .dr-subjects .dr-container { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 48px; }
.delok-result .dr-subjects-insight { margin-top: 24px; border-left: 4px solid var(--delok-yellow); border-radius: 0 12px 12px 0; padding: 20px; background: #fff; }
.delok-result .dr-bar-row { margin-bottom: 22px; }
.delok-result .dr-bar-label { display: flex; justify-content: space-between; gap: 16px; font-weight: 700; color: var(--delok-navy); margin-bottom: 8px; }
.delok-result .dr-pct { white-space: nowrap; }
.delok-result .dr-bar-track, .delok-result .dr-diff-track { height: 12px; background: #e2e8f0; border-radius: 999px; overflow: hidden; }
.delok-result .dr-bar-fill, .delok-result .dr-diff-fill { height: 100%; background: var(--delok-blue); border-radius: inherit; }
.delok-result .dr-bar-sub { font-size: .85rem; margin-top: 6px; color: #475569; }
.delok-result .dr-worked-grid, .delok-result .dr-rm-track { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.delok-result .dr-worked-card p, .delok-result .dr-learn-card p:last-child { margin-bottom: 0; }
.delok-result .dr-diff-ratio { font-size: 2rem; font-weight: 800; color: var(--delok-navy); }
.delok-result .dr-diff-ratio span { color: #64748b; }
.delok-result .dr-diff-label { font-weight: 600; }
.delok-result .dr-method-note { margin-top: 32px; padding: 28px; border: 1px solid var(--delok-line); border-radius: 16px; background: #fff; }
.delok-result .dr-method-note strong { display: block; color: var(--delok-navy); }
.delok-result .dr-insight, .delok-result .dr-report { background: linear-gradient(125deg, #0a2240, #124980); color: #e2e8f0; }
.delok-result .dr-insight .dr-eyebrow, .delok-result .dr-report .dr-eyebrow { color: var(--delok-yellow); }
.delok-result .dr-insight blockquote { margin: 24px 0; font-size: clamp(1.4rem, 3vw, 2rem); font-weight: 700; line-height: 1.5; color: #fff; max-width: 960px; }
.delok-result .dr-attribution { font-size: .9rem; }
.delok-result .dr-insight-list { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; list-style: none; padding: 0; margin: 28px 0 0; }
.delok-result .dr-insight-list li { padding: 14px 18px; background: #ffffff0d; border: 1px solid #ffffff30; border-radius: 10px; }
.delok-result .dr-learn-num { font-size: 2rem; font-weight: 800; color: var(--delok-blue); }
.delok-result .dr-rm-card.dr-active { border-top: 4px solid var(--delok-blue); }
.delok-result .dr-rm-status { display: inline-block; font-size: .8rem; font-weight: 700; padding: 4px 12px; border-radius: 999px; margin-bottom: 20px; background: #e2e8f0; color: var(--delok-navy); }
.delok-result .dr-done { background: #dcfce7; color: #166534; }
.delok-result .dr-next { background: #dbeafe; color: #1e40af; }
.delok-result .dr-rm-period { font-weight: 600; }
.delok-result .dr-rm-card ul { margin: 0; padding-left: 20px; list-style: disc; }
.delok-result .dr-rm-card li + li { margin-top: 10px; }
.delok-result .dr-rm-quote { margin-bottom: 0; }
.delok-result .dr-report .dr-container { display: grid; grid-template-columns: .7fr 1.3fr; align-items: center; gap: 48px; }
.delok-result .dr-report h2 { color: #fff; }
.delok-result .dr-report-cover { min-height: 300px; display: grid; place-items: center; border-radius: 16px; border: 1px solid #ffffff40; background: #ffffff08; padding: 28px; }
.delok-result .dr-report-cover img { display: block; max-width: 220px; width: 100%; height: auto; }
.delok-result .dr-pdf-unavailable { align-self: center; margin: 0; padding: 12px 18px; border-radius: 10px; background: #ffffff12; color: #e2e8f0; }
.delok-result .dr-partner .dr-btn { margin-top: 16px; }
@media (prefers-reduced-motion: no-preference) {
    .delok-result .dr-enter { animation: delok-result-enter 500ms ease-out both; }
}
@keyframes delok-result-enter {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}
@media (max-width: 1000px) {
    .delok-result .dr-kpi-grid, .delok-result .dr-diff-grid, .delok-result .dr-learn-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .delok-result .dr-model-chain { flex-direction: column; gap: 12px; }
    .delok-result .dr-model-node { width: 100%; }
    .delok-result .dr-model-arrow { transform: rotate(90deg); }
    .delok-result .dr-worked-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .delok-result .dr-rm-track { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
    .delok-result .delok-result-hero-grid, .delok-result .dr-subjects .dr-container, .delok-result .dr-report .dr-container { grid-template-columns: 1fr; gap: 32px; }
    .delok-result .delok-result-hero { padding: 48px 0; }
    .delok-result section { padding: 44px 0; }
    .delok-result .delok-result-brand { max-width: 420px; width: 100%; margin-inline: auto; }
    .delok-result .dr-insight-list { grid-template-columns: 1fr; }
    .delok-result .dr-report-cover { min-height: 200px; }
}
@media (max-width: 480px) {
    .delok-result .dr-kpi-grid, .delok-result .dr-diff-grid, .delok-result .dr-learn-grid, .delok-result .dr-worked-grid { grid-template-columns: 1fr; }
}
