/* Раздел «Совместимость». Подключается после /site.css и /blog/style.css:
 * палитра, шапка, подвал, кнопки, крошки, FAQ и блок продажи — оттуда.
 * Здесь только то, чего нет у статей: форма на две даты, карточки точек
 * общей матрицы, таблица частот, сетка арканов. */

.pcalc{border:1px solid var(--line);background:var(--slate-2);padding:26px 24px;margin:30px 0 34px}
.pcalc h2{margin:0 0 8px;font-size:22px;font-weight:500;letter-spacing:-.02em}
.pcalc .pcalc-note{color:var(--ice-dim);font-size:14px;margin:0 0 18px;line-height:1.55}
.pcalc-form{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:end}
.pcalc-form label{display:flex;flex-direction:column;gap:6px;min-width:0}
.pcalc-form label span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ice-faint);font-weight:700}
.pcalc-form input{width:100%;background:rgba(5,7,14,.6);border:1px solid var(--line-soft);
  color:var(--ice);padding:14px 14px;font:16px/1.2 var(--sans);border-radius:0;min-width:0;color-scheme:dark}
.pcalc-form input:focus{border-color:var(--brass)}
.pcalc-form input[aria-invalid="true"]{border-color:var(--brass-lt)}
.pcalc-form .btn{white-space:nowrap;min-height:48px}
.pcalc .pcalc-hint{margin:12px 0 0;font-size:14px;color:var(--brass-lt)}
.pcalc-hint[hidden],.pout[hidden]{display:none}

.pout{margin-top:24px;padding-top:20px;border-top:1px solid var(--line-soft)}
.pout-head{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:baseline;margin-bottom:14px}
.pout-head b{font-size:19px;font-weight:500}
.pout-head span{font-size:13px;color:var(--ice-faint);font-variant-numeric:tabular-nums}
.pout-focus{font-size:15px;color:var(--brass-lt);margin:0 0 14px;line-height:1.55}

.pcards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.pcard{border:1px solid var(--line-soft);background:rgba(5,7,14,.45);padding:16px 15px 14px;display:flex;flex-direction:column;min-width:0}
.pcard.is-focus{border-color:var(--brass);box-shadow:inset 0 0 0 1px var(--brass)}
.pc-top{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.pc-name{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--brass);font-weight:700}
.pc-sum{font-size:12px;color:var(--ice-faint);font-variant-numeric:tabular-nums;white-space:nowrap}
.pc-arc{display:flex;align-items:center;gap:12px;margin:10px 0 8px}
.pc-arc .rn{font-family:var(--display);font-size:34px;line-height:.9;color:var(--brass-lt);min-width:52px}
.pc-arc .nm{font-size:18px;line-height:1.2}
.pc-arc .nm small{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ice-faint);margin-top:3px}
.pcard p{font-size:13.5px;line-height:1.5;color:var(--ice-dim);margin:0 0 8px}
.pcard .pc-about{color:var(--ice-faint)}
.pcard .pc-pm b{color:var(--ice);font-weight:600}
.pc-link{margin-top:auto;padding-top:6px;font-size:13.5px;color:var(--brass-lt);text-decoration:none;border-bottom:0}
.pc-link:hover{text-decoration:underline;text-underline-offset:3px}

.pmatch,.pbuy{margin-top:22px;padding-top:18px;border-top:1px solid var(--line-soft)}
.pmatch h3,.pbuy h3{font-size:18px;font-weight:500;margin:0 0 8px}
.pmatch p,.pbuy p{font-size:14px;color:var(--ice-dim);line-height:1.6;margin:0 0 12px;max-width:66ch}
.pmatch ul{list-style:none;margin:0;padding:0}
.pmatch li{font-size:14px;color:var(--ice-dim);padding:6px 0;border-bottom:1px solid var(--line-soft)}
.pmatch a{color:var(--brass-lt);text-underline-offset:3px}

/* Ключ аркана на его странице: число, имя, плюс и минус. */
.pkey{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:start;
  border:1px solid var(--line-soft);padding:20px 22px;margin:28px 0 0}
.pkey-arc{display:flex;align-items:center;gap:14px}
.pkey-arc .rn{font-family:var(--display);font-size:52px;line-height:.9;color:var(--brass-lt)}
.pkey-arc b{display:block;font-size:20px;font-weight:500}
.pkey-arc small{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ice-faint);margin-top:4px}
.pkey dl{margin:0}
.pkey dt{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass);font-weight:700;margin-top:6px}
.pkey dt:first-child{margin-top:0}
.pkey dd{margin:3px 0 0;color:var(--ice-dim);font-size:15px;line-height:1.55}

.pstats{margin-top:46px;border-top:1px solid var(--line-soft);padding-top:26px}
.pstats .k,.arc-grid .k{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--brass);font-weight:700;margin-bottom:12px}
.pstats p{font-size:14px;color:var(--ice-dim);line-height:1.6;max-width:66ch}
.pstats table{width:100%;border-collapse:collapse;font-size:14px}
.pstats td{padding:10px 12px;border-bottom:1px solid var(--line-soft);color:var(--ice-dim)}
.pstats th{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line-soft);color:var(--brass);font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700}
.pstats td.num{text-align:right;font-variant-numeric:tabular-nums;color:var(--ice);white-space:nowrap}
.pstats th:last-child{text-align:right}

.pmore{margin-top:26px;font-size:15px;color:var(--ice-dim)}
.pmore a{color:var(--brass-lt);text-underline-offset:3px}

.pnav{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:34px;
  padding:18px 0;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);font-size:14px}
.pnav a{color:var(--ice-dim);text-decoration:none}
.pnav a:hover{color:var(--brass-lt)}
.pnav .mid{color:var(--brass-lt)}

.psell-list{list-style:none;margin:0 0 18px;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:4px 18px}
.psell-list li{font-size:14px;color:var(--ice-dim);padding:5px 0 5px 18px;position:relative;line-height:1.45}
.psell-list li::before{content:"";position:absolute;left:2px;top:12px;width:6px;height:6px;border:1px solid var(--brass);transform:rotate(45deg)}

.arc-grid{margin-top:52px}
.arc-grid ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px}
.arc-grid a{display:flex;gap:10px;align-items:baseline;padding:10px 12px;border:1px solid var(--line-soft);
  color:var(--ice-dim);text-decoration:none;font-size:14px;transition:border-color .2s,color .2s}
.arc-grid a:hover{border-color:var(--brass);color:var(--brass-lt)}
.arc-grid a.is-cur{border-color:var(--brass);color:var(--brass-lt)}
.arc-grid .num{font-variant-numeric:tabular-nums;color:var(--brass);min-width:20px}

@media(max-width:720px){
  .pcalc-form{grid-template-columns:1fr}
  .pcalc-form .btn{width:100%}
}
@media(max-width:640px){
  .pcalc{padding:20px 16px}
  .pkey{grid-template-columns:1fr;gap:14px;padding:16px}
  .pcards{grid-template-columns:1fr}
  .pnav{flex-direction:column}
  .pbuy .btn{width:100%;text-align:center}
}