/* fr-compat.css — слой совместимости для французских страниц.
   Задача: вернуть вёрстку старым классам после перехода на /css/site.css.
   Ничего не перерисовывает: использует переменные общей темы. */

/* 1. Оверлей меню не должен расширять документ */
.nav-overlay{overflow:hidden}
.nav-overlay a{max-width:100%;min-width:0;overflow-wrap:anywhere}

/* 2. Проекты: список карточек (.item / .num / .meta) */
.item{
  display:grid;
  grid-template-columns:56px 1fr;
  gap:8px 18px;
  padding:26px 0;
  border-top:1px solid var(--line);
  align-items:start;
}
.item:last-child{border-bottom:1px solid var(--line)}
.item .num{
  font-family:var(--mono);
  font-size:var(--fs-mono);
  letter-spacing:.12em;
  color:var(--ink-muted);
  grid-row:1 / span 2;
  padding-top:4px;
}
.item h2,.item h3{
  grid-column:2;
  margin:0 0 6px;
  font-size:clamp(1.25rem,2.2vw,1.6rem);
  line-height:1.2;
}
.item p{grid-column:2;margin:0 0 10px;max-width:68ch}
.item .meta{
  grid-column:2;
  display:flex;
  flex-wrap:wrap;
  gap:6px 14px;
  font-family:var(--mono);
  font-size:var(--fs-mono);
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--ink-muted);
}

/* 3. Экспертиза: карточки и заголовки секций (.card / .sec-head / .eyebrow / .idx / .tagline) */
.card{
  border:1px solid var(--line);
  border-radius:2px;
  padding:22px 22px 20px;
  background:var(--paper);
  margin:0 0 14px;
}
.card h2,.card h3{margin:8px 0 10px;font-size:1.15rem;line-height:1.25}
.card p{margin:0 0 8px;max-width:66ch}
.sec-head{
  display:flex;
  align-items:baseline;
  gap:14px;
  margin:44px 0 18px;
  padding-bottom:10px;
  border-bottom:1px solid var(--line);
}
.sec-head h2{margin:0;font-size:clamp(1.2rem,2vw,1.5rem)}
.idx,.eyebrow{
  font-family:var(--mono);
  font-size:var(--fs-mono);
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--ink-muted);
}
.tagline{
  display:block;
  font-size:.95rem;
  color:var(--ink-muted);
  margin:0 0 6px;
}

/* 4. Блог: список постов (.post / .tags) */
.post{
  display:block;
  padding:24px 0;
  border-top:1px solid var(--line);
  text-decoration:none;
  color:inherit;
}
.post:last-child{border-bottom:1px solid var(--line)}
.post h2,.post h3{margin:0 0 8px;font-size:clamp(1.15rem,2vw,1.45rem);line-height:1.25}
.post p{margin:0 0 10px;max-width:66ch;color:var(--ink-muted)}
.tags{display:flex;flex-wrap:wrap;gap:8px}
.tags span,.tags a{
  font-family:var(--mono);
  font-size:var(--fs-mono);
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--ink-muted);
  border:1px solid var(--line);
  padding:3px 8px;
  text-decoration:none;
}

/* 5. Технический контент: таблицы и код не вылезают за экран */
.prose table{width:100%;border-collapse:collapse;font-size:.95rem}
.prose th,.prose td{border-bottom:1px solid var(--line);padding:8px 10px;text-align:left}
.prose pre,.prose code{max-width:100%;overflow-x:auto}
.prose pre{padding:14px 16px;border:1px solid var(--line);background:rgba(0,0,0,.03)}
.prose img,.prose table{max-width:100%;height:auto}
.prose{max-width:100%;overflow-wrap:anywhere}

/* 6. Мобильные отступы для карточек проектов */
@media (max-width:640px){
  .item{grid-template-columns:1fr;gap:6px}
  .item .num{grid-row:auto;padding-top:0}
  .item h2,.item h3,.item p,.item .meta{grid-column:1}
  .card{padding:18px 16px}
}
