/* ============================================================
   Академический Салон · утверждённый экран спецификации
   Точная production-версия full-концепта без элементов старой страницы.
   ============================================================ */

body.polish15-specification{
  --canvas:#E9DDCC;
  --canvas-deep:#DDCDB6;
  --paper:#F4EBDE;
  --paper-2:#e9e1d3;
  --sheet:#FFF9F0;
  --sheet-rgb:255,253,248;
  --ink:#1d1c18;
  --ink-2:#292721;
  --text:#38352f;
  --muted:#645F57;
  --quiet:#645F57;
  --faint:#aaa08f;
  --ink-soft:#68635a;
  --ink-faint:#8b8375;
  --line:#d8cebd;
  --line-soft:rgba(102,91,72,.12);
  --line-strong:#b8aa94;
  --hairline:#d8cebd;
  --hairline-strong:#b8aa94;
  --wax:#a63f29;
  --wax-deep:#792b1d;
  --wax-soft:#f2ddd5;
  --green:#3c644c;
  --green-soft:#dfe9e1;
  --spec-page:1320px;
  --spec-gutter:clamp(24px,4.25vw,72px);
  --spec-section:clamp(72px,7.5vw,112px);
  --spec-control-radius:7px;
  --spec-paper-shadow:0 30px 90px rgba(54,45,31,.12),0 6px 20px rgba(54,45,31,.05);
  --spec-ease:cubic-bezier(.22,1,.36,1);
  min-width:320px;
  overflow-x:clip;
  color:var(--text);
  background:
    linear-gradient(90deg,transparent calc(50% - .5px),rgba(70,61,46,.025) 50%,transparent calc(50% + .5px)),
    var(--canvas);
  font:400 16px/1.58 var(--sans);
}

body.polish15-specification::before{
  z-index:-1;
  background:
    radial-gradient(circle at 8% 8%,rgba(255,255,255,.42),transparent 24%),
    radial-gradient(circle at 92% 16%,rgba(180,148,88,.1),transparent 24%),
    repeating-linear-gradient(0deg,rgba(67,59,45,.013) 0 1px,transparent 1px 4px);
}

:root[data-theme="dark"] body.polish15-specification{
  --canvas:#171714;
  --canvas-deep:#11110f;
  --paper:#1e1d19;
  --paper-2:#11110f;
  --sheet:#24221d;
  --sheet-rgb:36,34,29;
  --ink:#f2ecdf;
  --ink-2:#e6decf;
  --text:#d0c8ba;
  --muted:#aaa293;
  --quiet:#8b8478;
  --faint:#6d675e;
  --ink-soft:#aaa293;
  --ink-faint:#8b8478;
  --line:#3c3932;
  --line-soft:rgba(242,236,223,.09);
  --line-strong:#565148;
  --hairline:#3c3932;
  --hairline-strong:#565148;
  --wax:#B44F37;
  /* Акцентный ТЕКСТ на тёмном — отдельным токеном. Тем же --wax закрашен
     ФОН под светлым текстом (кнопки, плашки, метки), поэтому осветлить сам
     --wax нельзя: cream на нём и так 4.07, стало бы 3.2. А как краска текста
     #C65B41 давал 4.00 на --paper при норме 4.5 — 1163 элемента на 88
     страницах. #E07C61 даёт 5.80 на --paper, 5.47 на --sheet и 4.77 на
     --wax-soft. Правила берут его через var(--wax-text,var(--wax)):
     где токен не объявлен, всё остаётся как было — светлая тема не тронута. */
  --wax-text:#E07C61;
  --wax-deep:#a4432d;
  --wax-soft:#42251f;
  --green:#7faa8b;
  --green-soft:#23362a;
}

:root[data-theme="dark"] body.polish15-specification{
  /* Лист образца в тёмной теме темнеет вместе со страницей, поэтому его
     «бумажная» тень из светлой темы не читается — берём тёплую глубокую. */
  --spec-paper-shadow:0 30px 90px rgba(0,0,0,.42),0 6px 20px rgba(0,0,0,.24);
}

:root[data-theme="dark"] body.polish15-specification::before{opacity:.38}

.polish15-specification .specification-view{
  min-height:72vh;
}

.polish15-specification .specification-view :is(h1,h2,h3,h4){
  color:var(--ink);
  font-family:var(--serif);
  font-weight:470;
  line-height:1.08;
  letter-spacing:-.035em;
  text-wrap:balance;
}

.polish15-specification .specification-view p{text-wrap:pretty}

.polish15-specification .spec-page-shell{
  width:min(100%,calc(var(--spec-page) + var(--spec-gutter) * 2));
  margin-inline:auto;
  padding-inline:var(--spec-gutter);
}

.polish15-specification .spec-page-head{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(250px,.65fr);
  gap:clamp(32px,5vw,72px);
  align-items:end;
  padding-block:clamp(50px,4.5vw,68px) clamp(40px,3.8vw,56px);
  border-bottom:1px solid var(--line);
}

.polish15-specification .spec-page-head__copy{
  display:grid;
  gap:15px;
}

.polish15-specification .spec-eyebrow{
  color:var(--muted);
  font:600 11px/1.35 var(--mono);
  letter-spacing:.12em;
  text-transform:uppercase;
}

.polish15-specification .spec-page-head h1{
  max-width:850px;
  font-size:clamp(46px,4.8vw,68px);
  line-height:1.01;
}

.polish15-specification .spec-page-head__lead{
  max-width:720px;
  color:var(--muted);
  font-size:clamp(17px,1.5vw,20px);
  line-height:1.55;
}

.polish15-specification .spec-page-head__action{
  width:max-content;
  margin-top:3px;
}

.polish15-specification .spec-page-head__side{padding-bottom:6px}

.polish15-specification .spec-button{
  display:inline-flex;
  min-height:48px;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:12px 19px;
  color:var(--ink);
  background:var(--sheet);
  border:1px solid var(--line);
  border-radius:var(--spec-control-radius);
  cursor:pointer;
  font-size:14px;
  font-weight:560;
  line-height:1.2;
  letter-spacing:.005em;
  text-align:center;
  text-decoration:none;
  transition:
    transform .2s var(--spec-ease),
    background-color .18s ease,
    border-color .18s ease,
    box-shadow .18s ease;
}

.polish15-specification .spec-button span{
  font-family:var(--serif);
  font-size:18px;
  transition:transform .18s var(--spec-ease);
}

.polish15-specification .spec-button:hover{
  border-color:var(--line-strong);
  box-shadow:0 8px 24px rgba(47,38,25,.07);
  transform:translateY(-2px);
}

.polish15-specification .spec-button:hover span{transform:translateX(3px)}
.polish15-specification .spec-button:active{transform:translateY(0)}

.polish15-specification .document-badge{
  display:grid;
  gap:7px;
  padding:20px;
  background:var(--paper);
  border:1px solid var(--line);
}

.polish15-specification .document-badge span,
.polish15-specification .document-badge small{
  color:var(--muted);
  font:550 8px/1.2 var(--mono);
  letter-spacing:.07em;
  text-transform:uppercase;
}

.polish15-specification .document-badge strong{
  color:var(--ink);
  font:500 18px/1.2 var(--serif);
}

.polish15-specification .spec-layout{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);
  gap:clamp(40px,7vw,90px);
  align-items:start;
  padding-block:var(--spec-section);
}

/* Лист образца. Прежде он был уменьшенным факсимиле: поля 9px, значения
   10px — «документ» узнавался по форме, но не читался. Теперь это главный
   рабочий текст страницы, поэтому набран нормальным кеглем, а под каждым
   значением идёт пояснение, что в этой строке проверять.
   Краски взяты токенами: в тёмной теме лист темнеет вместе со страницей —
   белая плита в пол-экрана была ровно тем, ради чего тёмную тему включают. */
.polish15-specification .spec-paper{
  --sp-paper:var(--sheet);
  --sp-rule:var(--line);
  --sp-rule-soft:var(--line-soft);
  --sp-label:var(--muted);
  --sp-value:var(--ink);
  /* Пояснение отделено курсивом и кеглем, а не бледностью: на --quiet
     оно давало 4.29 в обеих темах — это обычный текст ниже нормы. */
  --sp-hint:var(--muted);
  color:var(--text);
  background:var(--sp-paper);
  border:1px solid var(--sp-rule);
  box-shadow:var(--spec-paper-shadow);
}

.polish15-specification .spec-paper>header{
  display:grid;
  grid-template-columns:42px 1fr auto;
  gap:13px;
  align-items:center;
  padding:24px 30px;
  border-bottom:1px solid var(--sp-rule);
}

.polish15-specification .spec-paper>header img{
  width:42px;
  border-radius:50%;
}

.polish15-specification .spec-paper>header div{
  display:grid;
  gap:3px;
}

.polish15-specification .spec-paper>header span,
.polish15-specification .spec-paper>header b,
.polish15-specification .spec-paper>footer{
  color:var(--sp-label);
  font:550 9px/1.3 var(--mono);
  letter-spacing:.07em;
  text-transform:uppercase;
}

.polish15-specification .spec-paper>header strong{
  color:var(--sp-value);
  font:500 17px/1.2 var(--serif);
}

.polish15-specification .spec-paper>section{
  padding:30px;
}

.polish15-specification .spec-paper h2{
  color:var(--sp-value);
  font-size:23px;
}

.polish15-specification .spec-paper__hint{
  max-width:56ch;
  margin-top:9px;
  color:var(--sp-hint);
  font-size:13.5px;
  line-height:1.5;
}

.polish15-specification .spec-paper dl{
  margin-top:24px;
  border-top:1px solid var(--sp-rule);
}

.polish15-specification .spec-paper dl>div{
  display:grid;
  grid-template-columns:168px minmax(0,1fr);
  gap:8px 24px;
  padding:17px 0;
  border-bottom:1px solid var(--sp-rule-soft);
}

.polish15-specification .spec-paper dt{
  color:var(--sp-label);
  font:600 10px/1.5 var(--mono);
  letter-spacing:.09em;
  text-transform:uppercase;
}

.polish15-specification .spec-paper dd{
  display:grid;
  gap:7px;
  margin:0;
}

.polish15-specification .spec-paper dd b{
  color:var(--sp-value);
  font-size:16px;
  font-weight:560;
  line-height:1.45;
}

/* Пояснение — не часть документа: набрано тише и курсивом, и об этом
   прямо сказано в подводке над таблицей. */
.polish15-specification .spec-paper dd em{
  max-width:62ch;
  color:var(--sp-hint);
  font-size:16px;
  font-style:italic;
  line-height:1.5;
}

.polish15-specification .spec-paper>footer{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:14px 30px;
  border-top:1px solid var(--sp-rule);
}

.polish15-specification .spec-notes{
  position:sticky;
  top:96px;
}

.polish15-specification .spec-notes h2{font-size:27px}

.polish15-specification .spec-notes ul{
  display:grid;
  gap:0;
  margin-top:18px;
  padding:0;
  list-style:none;
  border-top:1px solid var(--line-strong);
}

.polish15-specification .spec-notes li{
  display:grid;
  grid-template-columns:34px 1fr;
  gap:12px;
  padding:13px 0;
  border-bottom:1px solid var(--line);
}

.polish15-specification .spec-notes li>span{
  color:var(--wax-text,var(--wax));
  font:600 9px/1.5 var(--mono);
}

.polish15-specification .spec-notes li div{
  display:grid;
  gap:3px;
}

.polish15-specification .spec-notes li strong{
  color:var(--ink);
  font-size:15px;
  line-height:1.35;
}

.polish15-specification .spec-notes li p{
  color:var(--muted);
  font-size:13.5px;
  line-height:1.5;
}

.polish15-specification .spec-notes .spec-button{
  width:100%;
  margin-top:20px;
}

/* ============================================================
   Разъясняющие секции. Страница обязана отвечать клиенту раньше,
   чем показывает документ: что это, откуда берётся, что означают
   пометки, чего в документе не бывает и как его изменить.
   ============================================================ */

.polish15-specification .spec-section-title{
  font-size:clamp(28px,3vw,38px);
}

.polish15-specification .spec-section-lead{
  max-width:74ch;
  margin-top:13px;
  color:var(--muted);
  font-size:16.5px;
  line-height:1.58;
}

.polish15-specification :is(.spec-answers,.spec-flow,.spec-modes,.spec-never,.spec-change){
  padding-block:var(--spec-section);
  border-bottom:1px solid var(--line);
}

.polish15-specification .spec-answers{padding-top:clamp(44px,4vw,64px)}
.polish15-specification .spec-modes{padding-top:0;border-top:1px solid var(--line)}

/* Четыре ответа: вопрос — ответ, без «узнайте подробнее». */
.polish15-specification .spec-answers__grid{
  display:grid;
  gap:1px;
  margin:26px 0 0;
  padding:0;
  list-style:none;
  background:var(--line);
  border:1px solid var(--line);
  grid-template-columns:repeat(4,minmax(0,1fr));
}

.polish15-specification .spec-answers__grid>li{
  display:grid;
  align-content:start;
  gap:10px;
  padding:24px 22px 26px;
  background:var(--paper);
}

.polish15-specification .spec-answers__q{
  color:var(--wax-text,var(--wax));
  font:600 10px/1.4 var(--mono);
  letter-spacing:.09em;
  text-transform:uppercase;
}

.polish15-specification .spec-answers__a{
  color:var(--text);
  font-size:16px;
  line-height:1.55;
}

.polish15-specification :is(.spec-answers__a,.spec-modes__note,.spec-notes__foot) a{
  color:var(--wax-text,var(--wax));
  text-decoration:underline;
  text-underline-offset:3px;
}

.polish15-specification .spec-flow__list{
  display:grid;
  gap:0;
  margin:26px 0 0;
  padding:0;
  list-style:none;
  border-top:1px solid var(--line-strong);
  grid-template-columns:repeat(4,minmax(0,1fr));
}

.polish15-specification .spec-flow__list>li{
  display:grid;
  align-content:start;
  gap:8px;
  padding:22px 24px 24px 0;
  border-bottom:1px solid var(--line);
}

.polish15-specification .spec-flow__num{
  color:var(--wax-text,var(--wax));
  font:600 10px/1.4 var(--mono);
  letter-spacing:.1em;
}

.polish15-specification .spec-flow__list strong{
  color:var(--ink);
  font-family:var(--serif);
  font-size:19px;
  font-weight:470;
  letter-spacing:-.02em;
  line-height:1.2;
}

.polish15-specification .spec-flow__list p{
  color:var(--muted);
  font-size:16px;
  line-height:1.55;
}

.polish15-specification .spec-flow__list a{
  color:inherit;
  text-decoration:underline;
  text-underline-offset:3px;
}

/* Четыре вида помощи. Главное в карточке — не название, а строка
   «кто автор»: именно её клиент ищет и именно её раньше нигде не было. */
.polish15-specification .spec-modes__grid{
  display:grid;
  gap:18px;
  margin-top:30px;
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.polish15-specification .spec-mode{
  display:grid;
  align-content:start;
  gap:11px;
  padding:26px 26px 22px;
  background:var(--paper);
  border:1px solid var(--line);
  border-top:2px solid var(--wax);
}

.polish15-specification .spec-mode h3{
  font-size:21px;
}

.polish15-specification .spec-mode p{
  color:var(--text);
  font-size:16px;
  line-height:1.56;
}

.polish15-specification .spec-mode__author{
  margin-top:2px;
  padding-top:12px;
  border-top:1px solid var(--line);
}

.polish15-specification .spec-mode__author span{
  color:var(--ink);
  font-weight:600;
}

/* Селектор с тегом: соседнее `.spec-mode p` специфичнее одного класса
   и иначе вернуло бы этой строке общий кегль. */
.polish15-specification .spec-mode p.spec-mode__code{
  color:var(--muted);
  font:550 10px/1.4 var(--mono);
  letter-spacing:.08em;
  text-transform:uppercase;
}

.polish15-specification .spec-modes__note{
  max-width:78ch;
  margin-top:22px;
  color:var(--muted);
  font-size:15px;
  line-height:1.58;
}

/* Запрещённые формулировки — единственный блок страницы, который
   говорит «нет». Набран как перечёркнутый список, чтобы читался за секунду. */
.polish15-specification .spec-never__list{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:26px 0 0;
  padding:0;
  list-style:none;
}

.polish15-specification .spec-never__list>li{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:11px 17px;
  color:var(--ink);
  background:var(--wax-soft);
  border:1px solid var(--wax);
  border-radius:999px;
  font-size:16px;
}

.polish15-specification .spec-never__list>li>span{
  color:var(--wax-text,var(--wax));
  font:600 15px/1 var(--mono);
}

.polish15-specification .spec-change__grid{
  display:grid;
  gap:0;
  margin-top:28px;
  border-top:1px solid var(--line-strong);
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.polish15-specification .spec-change__grid>article{
  display:grid;
  align-content:start;
  gap:11px;
  padding:24px 28px 26px 0;
  border-bottom:1px solid var(--line);
}

.polish15-specification .spec-change__when{
  color:var(--wax-text,var(--wax));
  font:600 10px/1.4 var(--mono);
  letter-spacing:.09em;
  text-transform:uppercase;
}

.polish15-specification .spec-change__grid p{
  color:var(--text);
  font-size:16px;
  line-height:1.56;
}

.polish15-specification .spec-change__grid strong{color:var(--ink)}

.polish15-specification .spec-notes__lead{
  margin-top:11px;
  color:var(--muted);
  font-size:15px;
  line-height:1.55;
}

.polish15-specification .spec-notes__foot{
  margin-top:16px;
  color:var(--muted);
  font-size:14px;
  line-height:1.55;
}

@media (max-width:1100px){
  .polish15-specification .spec-answers__grid,
  .polish15-specification .spec-flow__list{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .polish15-specification .spec-change__grid{
    grid-template-columns:1fr;
  }

  .polish15-specification .spec-change__grid>article{padding-right:0}
}

@media (max-width:920px){
  .polish15-specification .spec-page-head{
    grid-template-columns:1fr;
    gap:30px;
    padding-block:52px 42px;
  }

  .polish15-specification .spec-page-head h1{
    font-size:clamp(40px,10vw,56px);
  }

  .polish15-specification .spec-page-head__lead{font-size:16px}

  .polish15-specification .spec-layout{
    grid-template-columns:1fr;
    gap:34px;
  }

  .polish15-specification .spec-paper dl>div{
    grid-template-columns:1fr;
    gap:7px;
  }

  .polish15-specification .spec-modes__grid{
    grid-template-columns:1fr;
  }

  .polish15-specification .spec-notes{position:static}
}

@media (max-width:620px){
  .polish15-specification .spec-answers__grid,
  .polish15-specification .spec-flow__list{
    grid-template-columns:1fr;
  }

  .polish15-specification .spec-flow__list>li{padding-right:0}

  .polish15-specification .spec-never__list>li{width:100%}

  body.polish15-specification{--spec-section:54px}

  .polish15-specification .spec-page-shell{
    padding-inline:max(16px,env(safe-area-inset-left));
  }

  .polish15-specification .spec-page-head h1{font-size:40px}

  .polish15-specification .spec-page-head__action,
  .polish15-specification .spec-page-head__action .spec-button{
    width:100%;
  }

  .polish15-specification .spec-paper>header{
    grid-template-columns:38px 1fr;
    padding:20px;
  }

  .polish15-specification .spec-paper>header b{display:none}

  .polish15-specification .spec-paper>section,
  .polish15-specification .spec-paper>footer{
    padding-inline:20px;
  }
}

@media (max-width:360px){
  .polish15-specification .spec-page-head h1{
    font-size:38px;
    overflow-wrap:anywhere;
  }
}

@media (prefers-reduced-motion:reduce){
  .polish15-specification .spec-button,
  .polish15-specification .spec-button span{
    transition-duration:.01ms;
  }
}

@media print{
  body.polish15-specification{
    padding:0!important;
    color:#111;
    background:#fff!important;
    transition:none!important;
  }

  body.polish15-specification::before,
  .polish15-specification>.site-header,
  .polish15-specification>.mobile-appbar,
  .polish15-specification>.mobile-cta,
  .polish15-specification>.site-footer,
  .polish15-specification .spec-page-head,
  .polish15-specification .spec-notes,
  .polish15-specification .spec-answers,
  .polish15-specification .spec-flow,
  .polish15-specification .spec-modes,
  .polish15-specification .spec-never,
  .polish15-specification .spec-change{
    display:none!important;
  }

  /* На печати остаётся сам бланк: пояснения к строкам — экранная подсказка. */
  .polish15-specification .spec-paper dd em,
  .polish15-specification .spec-paper__hint{
    display:none!important;
  }

  .polish15-specification .spec-page-shell{
    width:100%;
    padding:0;
  }

  .polish15-specification .spec-layout{
    display:block;
    padding:0;
  }

  .polish15-specification .spec-paper{
    width:100%;
    border-color:#b8b1a5;
    box-shadow:none;
    break-inside:avoid;
  }
}

/* Блик бумаги в тёмной теме — тёплый, а не белый. Прежде здесь гасили только
   яркость (opacity:.38), но сам градиент оставался rgba(255,255,255,.42):
   белый свет поверх тёплого почти-чёрного даёт НЕЙТРАЛЬНЫЙ СЕРЫЙ, и верх
   страницы уходил в серую муть — заметнее всего на длинных листах вроде
   отзывов. Тёплый кремовый той же силы держит тон «Оттиска». */
:root[data-theme="dark"] body.polish15-specification::before{
  background:
    radial-gradient(circle at 8% 8%,rgba(255,238,208,.16),transparent 24%),
    radial-gradient(circle at 92% 16%,rgba(180,148,88,.10),transparent 24%),
    repeating-linear-gradient(0deg,rgba(242,236,223,.02) 0 1px,transparent 1px 4px);
}

/* MOBILE-FIRST · десктопный откат кеглей основного текста (OUT-008) */
/* База выше теперь мобильная: основной текст 16px. Здесь десктоп
   получает прежние кегли обратно. Блок стоит последним в файле,
   поэтому выигрывает по порядку при равной специфичности. */
@media (min-width:921px){
  /* Пояснение — не часть документа: набрано тише и курсивом, и об этом прямо сказано в подводке над таблицей. */ .polish15-specification .spec-paper dd em{font-size:13.5px}
  .polish15-specification .spec-answers__a{font-size:15.5px}
  .polish15-specification .spec-flow__list p{font-size:14.5px}
  .polish15-specification .spec-mode p{font-size:15px}
  .polish15-specification .spec-never__list>li{font-size:15px}
  .polish15-specification .spec-change__grid p{font-size:15px}
}
