/* Договор купли-продажи автомобиля (/dogovor-kupli-prodazhi-avto/). Макет _makety/2026-10-20-dkp/,
   «да» владельца 21.10.2026. Поверх karty.css (общие kb-), свои классы dk-, только токены DESIGN.md. */

/* Первый экран: три числа крупнее подписи */
.dk-tri{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:56px;border-top:2px solid var(--tma)}
.dk-tri>div{padding:24px 32px 0 0;display:flex;flex-direction:column;gap:8px}
.dk-tri>div+div{padding-left:32px;border-left:1px solid var(--liniya)}
.dk-tri strong{font-size:96px;font-weight:300;line-height:.9;letter-spacing:-.04em}
.dk-tri>div:first-child strong{color:var(--krasn);font-weight:700}
.dk-tri span{font-size:17px;color:var(--tusk);max-width:16em}

/* Анкета по шагам: номер шага - правда о порядке заполнения */
.dk-anketa{border-top:0}
.dk-shag{border:0;margin:0;padding:0 0 8px;border-top:2px solid var(--tma)}
.dk-shag+.dk-shag{margin-top:32px}
.dk-shag legend{display:flex;align-items:center;gap:12px;padding:16px 0 4px;font-size:24px;font-weight:500;letter-spacing:-.01em;float:left;width:100%}
.dk-shag legend+*{clear:both}
.dk-shag legend i{font-style:normal;display:inline-grid;place-items:center;width:32px;height:32px;background:var(--tma);color:var(--svet);font-size:17px;font-weight:700}
.dk-shag.gotov legend i{background:var(--zel)}
.dk-dva{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px}
.dk-mt8{margin-top:8px}
.dk-ta{resize:vertical;min-height:96px;font-family:inherit;line-height:1.4}

/* Бумага договора */
.dk-list h3{margin-bottom:12px}
.dk-gd{display:flex;justify-content:space-between;gap:16px;margin-bottom:20px!important}
.dk-ts{display:grid;grid-template-columns:9em minmax(0,1fr);gap:4px 16px;margin:0 0 16px 1.2em;font-size:15px}
.dk-ts dt{color:var(--tusk);font-family:var(--sans);font-size:13px;padding-top:3px}
.dk-ts dd{margin:0}
.dk-podp{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;margin-top:32px;font-family:var(--sans)}
.dk-podp b{display:block;font-size:17px}
.dk-podp span{display:block;font-size:13px;color:var(--tusk)}
.dk-podp i{display:block;height:40px;border-bottom:1px solid var(--tma)}
.dk-skach{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px;padding-top:16px;border-top:2px solid var(--tma)}
.kb-est{display:inline;border-bottom:0;color:inherit;font-family:inherit;font-size:inherit;letter-spacing:0;min-width:0}

/* После подписи: линейка дней во всю ширину */
.dk-lineyka{position:relative;margin-top:48px;height:236px;--k:calc(100% / 14)}
.dk-os{position:absolute;left:0;right:0;top:150px;height:2px;background:var(--tma)}
.dk-os i{position:absolute;left:calc(var(--x) * var(--k));top:-6px;width:1px;height:14px;background:var(--tma)}
.dk-os i span{position:absolute;top:18px;left:-1em;width:2em;text-align:center;font-size:13px;color:var(--tusk);font-style:normal}
.dk-otr{position:absolute;left:calc(var(--a) * var(--k));width:calc((var(--b) - var(--a)) * var(--k));height:56px;display:flex;align-items:center;padding:0 16px;box-sizing:border-box}
.dk-otr b{font-size:17px;font-weight:500;line-height:1.2}
.dk-pok{top:88px;background:var(--krasn);color:var(--svet)}
.dk-prod{top:88px;background:repeating-linear-gradient(135deg,var(--tma) 0 2px,transparent 2px 9px);color:var(--tma);box-shadow:inset 0 0 0 2px var(--tma)}
.dk-prod b{background:var(--svet);padding:4px 8px;margin-left:-8px}
.dk-tochka{position:absolute;left:0;top:0;display:flex;flex-direction:column;gap:4px;border-left:2px solid var(--tma);padding-left:12px;height:80px}
.dk-tochka b{font-size:36px;font-weight:700;letter-spacing:-.02em;line-height:1}
.dk-tochka span{font-size:13px;color:var(--tusk)}
.dk-p{font-size:17px;line-height:1.5;margin:0;max-width:40em}
.dk-posle .kb-shkala{margin-top:16px}

/* Налог продавца: итог крупнее вопроса */
.dk-nal-setka{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:56px;margin-top:40px;align-items:start}
.dk-nal-setka .kb-anketa{border-top:2px solid var(--tma)}
.dk-verdikt{border-top:2px solid var(--krasn);padding-top:20px}
.dk-v-metka{font-size:13px;letter-spacing:.06em;color:var(--tusk)}
.dk-verdikt>strong{display:block;font-size:48px;font-weight:700;line-height:1.05;letter-spacing:-.03em;margin:12px 0 16px;max-width:14em}
.dk-verdikt>p{font-size:17px;margin:0 0 20px;max-width:36em}
.dk-raschet{display:flex;flex-direction:column;gap:4px;font-size:24px;font-weight:300;padding:16px 0;border-top:1px solid var(--liniya);border-bottom:1px solid var(--liniya)}
.dk-raschet b{font-weight:700}

@media (max-width:900px){
 .dk-tri{grid-template-columns:minmax(0,1fr);margin-top:40px}
 .dk-tri>div,.dk-tri>div+div{padding:16px 0;border-left:0;border-bottom:1px solid var(--liniya);flex-direction:row;align-items:baseline;gap:16px}
 .dk-tri strong{font-size:56px;min-width:1.4em}
 .dk-tri span{font-size:15px}
 .dk-shag legend{font-size:17px}
 .dk-dva{grid-template-columns:minmax(0,1fr)}
 .dk-ts{grid-template-columns:7em minmax(0,1fr);margin-left:0;gap:4px 12px}
 .dk-podp{grid-template-columns:minmax(0,1fr);gap:16px}
 .dk-skach .kb-knopka{flex:1 1 100%;justify-content:center}
 /* Телефон: линейка встаёт вертикально, дни идут вниз */
 .dk-lineyka{height:auto;margin-top:32px;display:grid;grid-template-columns:40px minmax(0,1fr);grid-template-rows:auto 280px 112px;column-gap:16px}
 .dk-os{position:relative;grid-column:1;grid-row:2/4;top:0;width:2px;height:auto;justify-self:center}
 .dk-os i{left:-6px;top:calc(var(--x) * (100% / 14));width:14px;height:1px}
 .dk-os i span{top:-8px;left:-30px;width:24px;text-align:right}
 .dk-os i span{visibility:hidden}
 .dk-os i:nth-child(1) span,.dk-os i:nth-child(11) span,.dk-os i:nth-child(15) span{visibility:visible}
 .dk-tochka{position:static;grid-column:1/3;grid-row:1;height:auto;margin-bottom:16px}
 .dk-tochka b{font-size:28px}
 .dk-otr{position:static;grid-column:2;width:auto;height:auto;padding:16px;align-items:flex-start}
 .dk-pok{grid-row:2}
 .dk-prod{grid-row:3}
 .dk-otr b{font-size:15px}
 .dk-nal-setka{grid-template-columns:minmax(0,1fr);row-gap:32px}
 .dk-verdikt>strong{font-size:32px}
 .dk-raschet{font-size:17px}
}

.dk-verdikt .kb-q[hidden]{display:none}
@media print{
 .dk-pechat-ek{page-break-after:always;break-after:page}
 .dk-pechat-ek:last-child{page-break-after:auto;break-after:auto}
 .kb-pechat .gd{display:flex;justify-content:space-between;margin:0 0 12pt}
 .kb-pechat .podp{display:flex;justify-content:space-between;gap:24pt;margin-top:24pt}
}
