/* One article only: accessible comparisons and server-rendered idea cards. */
.on-demand-ideas-guide { --od-line: rgba(125, 211, 252, .28); --od-muted: #c6dce7; }
.on-demand-ideas-guide [id] { scroll-margin-top: 120px; }
.on-demand-ideas-guide h2 { margin-top: 2rem; }
.on-demand-ideas-guide a { text-decoration: underline; text-underline-offset: 3px; }
.on-demand-ideas-guide a:focus-visible { outline: 2px solid #7dd3fc; outline-offset: 4px; }
.od-idea-card, .od-ideas-sources { margin: 28px 0; padding: clamp(20px, 3vw, 30px); border: 1px solid var(--od-line); border-radius: 20px; background: #102f40; }
.on-demand-ideas-guide .od-idea-card h2, .on-demand-ideas-guide .od-ideas-sources h2 { margin-top: 0; line-height: 1.4; }
.od-idea-details { margin: 20px 0; }
.od-idea-details > div { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 18px; border-top: 1px solid var(--od-line); padding: 16px 0; }
.od-idea-details dt { color: #9bd9ff; font-weight: 600; }
.od-idea-details dd { margin: 0; color: #f1f7fb; }
.od-idea-details dt, .od-idea-details dd, .od-idea-test { font-size: 1rem; line-height: 1.7; }
.od-idea-test { background: #0b2534; border-left: 3px solid #38bdf8; border-radius: 0 10px 10px 0; padding: 16px 18px; color: #e3f1f8; }
.od-idea-test strong { color: #9bd9ff; }
.od-ideas-anchor { display: block; }
.od-ideas-checklist li { margin-bottom: 12px; }
.od-ideas-table-wrap { margin: 26px 0; }
.od-ideas-table { width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 0; border: 1px solid var(--od-line); border-radius: 16px; overflow: hidden; color: #f1f7fb; }
.od-ideas-table caption { caption-side: top; color: var(--od-muted); text-align: left; padding-bottom: 12px; }
.od-ideas-table th, .od-ideas-table td { text-align: left; vertical-align: top; padding: 16px; line-height: 1.7; overflow-wrap: break-word; border-bottom: 1px solid var(--od-line); }
.od-ideas-table thead th { background: #154b64; color: #fff; }
.od-ideas-table thead th:first-child { width: 25%; }
.od-ideas-table tbody th { background: #102f40; color: #c8eeff; }
.od-ideas-table td { background: #0d2532; }
.od-ideas-table tr:last-child > * { border-bottom: 0; }
.od-ideas-sources li { margin-bottom: 10px; }
@media (max-width: 767px) {
    .od-idea-details > div { grid-template-columns: 1fr; gap: 7px; }
    .od-ideas-table, .od-ideas-table caption, .od-ideas-table tbody { display: block; }
    .od-ideas-table { border: 0; overflow: visible; }
    .od-ideas-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
    .od-ideas-table tbody tr { display: block; border: 1px solid var(--od-line); border-radius: 14px; overflow: hidden; margin-bottom: 16px; }
    .od-ideas-table tbody th, .od-ideas-table tbody td { display: block; width: 100%; border: 0; }
    .od-ideas-table td::before { content: attr(data-label); display: block; color: #9bd9ff; font-weight: 700; font-size: .9rem; margin-bottom: 6px; }
    .od-ideas-table tbody td + td { border-top: 1px solid var(--od-line); }
}
