/* A visual layer over the existing comparison page; prices and copy stay in WordPress. */
body.drkvd-page { --drkvd-ink:#264e53; --drkvd-link:#16798d; --drkvd-line:#dbe7e6; --drkvd-soft:#eef6f5; }
body.drkvd-page .site-content>.ast-container { max-width:1200px; padding-inline:30px; }
body.drkvd-page #primary { margin:44px 0 60px; padding:0; }
body.drkvd-page article.page { padding:0; background:transparent; }
body.drkvd-page .entry-title { color:var(--drkvd-ink); font-size:clamp(28px,3.4vw,42px); line-height:1.25; font-weight:500; letter-spacing:normal; text-transform:none; text-wrap:balance; max-width:860px; margin:0 0 22px; }
body.drkvd-page .entry-header { margin-bottom:0; }
body.drkvd-page .drkvd-root { font-size:16px; line-height:1.75; color:#435b5d; }
body.drkvd-page .drkvd-root * { box-sizing:border-box; }
body.drkvd-page .drkvd-lead { max-width:880px; font-size:17px; margin:0 0 24px; }
body.drkvd-page .drkvd-note { position:relative; padding:20px 24px 20px 62px; margin:0 0 28px; background:#f6f3ec; border:1px solid #e9e5db; border-radius:12px; }
body.drkvd-page .drkvd-note strong { color:var(--drkvd-ink); }
body.drkvd-page .drkvd-root a { color:var(--drkvd-link); text-underline-offset:4px; }
body.drkvd-page .drkvd-root a:focus-visible { outline:3px solid var(--drkvd-link); outline-offset:5px; border-radius:4px; }

/* Keep a real table on wide screens; existing cell labels support the mobile cards. */
body.drkvd-page .drk-comparison { border:1px solid var(--drkvd-line); border-radius:16px; background:#fff; margin-bottom:22px; }
body.drkvd-page .drk-comparison table { width:100%; margin:0; border:0; border-collapse:separate; border-spacing:0; font-size:15px; line-height:1.55; }
body.drkvd-page .drk-comparison :is(th,td) { border:0; border-bottom:1px solid var(--drkvd-line); padding:14px 20px; vertical-align:middle; text-align:left; }
body.drkvd-page .drk-comparison th { color:var(--drkvd-ink); font-size:13px; font-weight:600; background:var(--drkvd-soft); padding-block:18px; }
body.drkvd-page .drk-comparison th:first-child { border-top-left-radius:15px; }
body.drkvd-page .drk-comparison th:last-child { border-top-right-radius:15px; }
body.drkvd-page .drk-comparison tr:last-child td { border-bottom:0; }
body.drkvd-page .drk-comparison td:nth-child(3) { color:var(--drkvd-ink); font-weight:600; font-size:18px; white-space:nowrap; }
body.drkvd-page .drk-comparison td:nth-child(4) { color:#52676b; white-space:normal; overflow-wrap:break-word; }
body.drkvd-page .drk-comparison td:nth-child(2) { min-width:155px; }
body.drkvd-page .drkvd-table-link { display:grid; grid-template-columns:72px minmax(0,1fr); align-items:center; gap:18px; color:var(--drkvd-ink); font-family:Montserrat,sans-serif; font-size:15px; font-weight:500; line-height:1.5; text-decoration:none; }
body.drkvd-page .drkvd-table-link:hover span { color:var(--drkvd-link); text-decoration:underline; }
body.drkvd-page .drkvd-thumb { display:block; width:72px; height:72px; aspect-ratio:1; object-fit:contain; border-radius:8px; border:1px solid #e4e9e7; background:#f6f3ec; }
body.drkvd-page .drk-comparison+p { max-width:880px; font-size:14px; color:#52676b; margin-bottom:38px; }

/* The same artwork identifies the programme in the table and the detailed section. */
body.drkvd-page .drkvd-program { display:grid; grid-template-columns:240px minmax(0,1fr); gap:14px 32px; align-items:start; padding:30px; margin:0 0 24px; background:#fff; border:1px solid var(--drkvd-line); border-radius:18px; }
body.drkvd-page .drkvd-art { grid-column:1; grid-row:1/3; display:block; overflow:hidden; border-radius:12px; background:#f6f3ec; border:1px solid #e4e9e7; }
body.drkvd-page .drkvd-cover { display:block; width:100%; height:auto; aspect-ratio:1; object-fit:contain; }
body.drkvd-page .drkvd-program>h2 { grid-column:2; font-size:26px; line-height:1.35; font-weight:500; text-transform:none; letter-spacing:normal; margin:0; text-wrap:balance; }
body.drkvd-page .drkvd-program>h2 a { color:var(--drkvd-ink); text-decoration:none; }
body.drkvd-page .drkvd-program>h2 a:hover { text-decoration:underline; }
body.drkvd-page .drkvd-copy { grid-column:2; min-width:0; }
body.drkvd-page .drkvd-copy>p { margin:0 0 18px; }
body.drkvd-page .drkvd-copy .drk-checklist { margin:0; padding:0; display:grid; gap:0; list-style:none; }
body.drkvd-page .drkvd-copy .drk-checklist li { position:relative; display:flex; justify-content:space-between; align-items:baseline; gap:16px; margin:0; padding:11px 0 11px 28px; border-top:1px solid #edf1ef; font-size:14px; line-height:1.65; }
body.drkvd-page .drkvd-track-name { min-width:0; }
body.drkvd-page .drkvd-duration { flex-shrink:0; font-size:12px; font-weight:600; font-variant-numeric:tabular-nums; white-space:nowrap; color:#365e63; padding:3px 8px; border-radius:6px; background:var(--drkvd-soft); }
@supports (mask-image:url("")) or (-webkit-mask-image:url("")) {
 body.drkvd-page .drkvd-note::before { content:""; position:absolute; top:23px; left:24px; width:22px; height:22px; background:var(--drkvd-link); mask:url("../drkukla-icons/assets-fa6/layers.svg") center/contain no-repeat; -webkit-mask:url("../drkukla-icons/assets-fa6/layers.svg") center/contain no-repeat; }
 body.drkvd-page .drkvd-copy .drk-checklist li::before { content:""; position:absolute; top:16px; left:0; width:16px; height:16px; background:var(--drkvd-link); mask:url("../drkukla-icons/assets-fa6/headphones.svg") center/contain no-repeat; -webkit-mask:url("../drkukla-icons/assets-fa6/headphones.svg") center/contain no-repeat; }
}
@media(max-width:900px) {
 body.drkvd-page .drkvd-program { grid-template-columns:180px minmax(0,1fr); padding:24px; gap:12px 24px; }
 body.drkvd-page .drkvd-program>h2 { font-size:23px; }
 body.drkvd-page .drk-comparison :is(th,td) { padding-inline:12px; }
 body.drkvd-page .drkvd-table-link { gap:12px; font-size:14px; }
 body.drkvd-page .drk-comparison td:nth-child(2) { min-width:110px; }
}
@media(max-width:600px) {
 body.drkvd-page .site-content>.ast-container { padding-inline:20px; }
 body.drkvd-page #primary { margin-top:28px; }
 body.drkvd-page .drkvd-lead { font-size:16px; }
 body.drkvd-page .drkvd-note { padding:18px 18px 18px 50px; font-size:14px; }
 body.drkvd-page .drkvd-note::before { top:21px; left:18px; width:20px; height:20px; }
 body.drkvd-page .drk-comparison { border:0; background:transparent; }
 body.drkvd-page .drk-comparison table { display:block; }
 body.drkvd-page .drk-comparison tbody { display:grid; gap:14px; }
 body.drkvd-page .drk-comparison tbody tr { padding:18px; border-radius:14px; gap:14px; }
 body.drkvd-page .drk-comparison tbody td { border:0; }
 body.drkvd-page .drk-comparison td:first-child { padding-bottom:14px!important; border-bottom:1px solid var(--drkvd-line); }
 body.drkvd-page .drk-comparison td:nth-child(2) { min-width:0; }
 body.drkvd-page .drk-comparison td:nth-child(3) { font-size:19px; }
 body.drkvd-page .drk-comparison td:nth-child(4) { grid-column:1/-1; padding-top:12px!important; border-top:1px solid var(--drkvd-line); }
 body.drkvd-page .drk-comparison td::before { font-weight:400; }
 body.drkvd-page .drkvd-table-link { grid-template-columns:72px minmax(0,1fr); gap:14px; font-size:15px; }
 body.drkvd-page .drkvd-program { grid-template-columns:96px minmax(0,1fr); padding:20px; gap:18px 16px; }
 body.drkvd-page .drkvd-art { grid-row:1; align-self:center; }
 body.drkvd-page .drkvd-program>h2 { align-self:center; font-size:19px; line-height:1.4; text-wrap:pretty; }
 body.drkvd-page .drkvd-copy { grid-column:1/-1; font-size:15px; }
 body.drkvd-page .drkvd-copy .drk-checklist li { gap:10px; font-size:13px; }
}
@media(max-width:360px) {
 body.drkvd-page .drkvd-program { padding:16px; grid-template-columns:76px minmax(0,1fr); gap:16px 12px; }
 body.drkvd-page .drkvd-program>h2 { font-size:17px; }
 body.drkvd-page .drkvd-table-link { grid-template-columns:60px minmax(0,1fr); font-size:14px; }
 body.drkvd-page .drkvd-thumb { width:60px; height:60px; }
}
@media(hover:hover) and (prefers-reduced-motion:no-preference) {
 body.drkvd-page .drkvd-program { transition:border-color .18s ease; }
 body.drkvd-page .drkvd-program:focus-within,body.drkvd-page .drkvd-program:hover { border-color:#9fbebd; }
}