/* ================================================================
   /szoib/ — РОО «Северо-Западное общество по изучению боли».
   Подключается поверх painmed-v8.css и painmed-about-v8.css
   (оттуда берутся .pullquote, .mission-grid, .eco-tile, .cta-final).
   ================================================================ */


/* Фон шапки: круглый стол экспертов сверху, hero-szoib-table.webp
   (1672×941, 79 КБ). Иллюстрация пришла уже в фирменном сине-зелёном,
   пересчёт цвета не требовался.

   Приём тот же, что на остальных страницах: слой во всю ширину окна
   (left/right выводят его за пределы .wrap, на html и body стоит
   overflow-x:clip), opacity:1, градиентного ::after нет.
   Двойной класс .hero.hero-szoib поднимает специфичность выше
   `.page-hero .hero-bg` из painmed-about-v8.css, который на этой
   странице тоже загружен.
   Замер поверх слоя в габаритах заголовка (1440 CSS-px): медиана 15.3:1 при норме AA 4.5:1; ниже порога 0.20% пикселей —
   контуры стульев, на набор они не приходятся. */
.hero.hero-szoib > .hero-bg{
  left:calc(50% - 50vw); right:calc(50% - 50vw);
  transform:none;
  background:url('../img/hero-szoib-table.webp') center center / cover no-repeat;
  opacity:1;
}
@media (max-width:1080px){
  /* В одну колонку hero вытягивается втрое, cover показал бы узкую полосу
     кадра — на телефоне иллюстрация идёт целиком по ширине. */
  .hero.hero-szoib > .hero-bg{
    background-size:100% auto;
    background-position:center top;
  }
}

/* ---------- Паспорт организации в hero ---------- */
.org-passport .ticket-meta + .ticket-meta{ margin-top:0; }
.org-passport .tm .val-sm{ font-size:12.5px; font-weight:600; line-height:1.45; letter-spacing:0; }
.org-passport h3{ font-size:20px; }

.org-contacts-mini{ display:grid; gap:7px; margin-bottom:11px; }
.org-contacts-mini a{
  display:flex; align-items:baseline; justify-content:space-between; gap:12px;
  padding:8px 12px; border-radius:var(--r-sm);
  background:var(--card); border:1px solid var(--line);
  text-decoration:none; transition:border-color .2s;
}
.org-contacts-mini a:hover{ border-color:var(--accent); }
.org-contacts-mini .k{
  font-size:9.5px; font-weight:700; letter-spacing:0.16em;
  text-transform:uppercase; color:var(--faint);
}
.org-contacts-mini .v{ font-size:13.5px; font-weight:700; color:var(--accent-d); }

/* ---------- 02 Задачи ---------- */
.task-grid{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(4, 1fr); gap:14px;
}
.task-card{
  position:relative;
  background:var(--card); border:1px solid var(--line);
  border-radius:var(--r); padding:18px 18px 20px;
  transition:border-color .2s, transform .2s, box-shadow .2s;
}
.task-card:hover{ border-color:var(--accent); transform:translateY(-2px); box-shadow:var(--shadow); }
.task-n{
  display:inline-block; margin-bottom:10px;
  font-family:var(--mono); font-size:12px; font-weight:600; letter-spacing:0.08em;
  color:var(--accent-d); background:var(--accent-soft);
  padding:4px 9px; border-radius:var(--r-pill);
}
.task-card p{ font-size:13.5px; line-height:1.62; color:var(--ink-soft); margin:0; }

/* ---------- 03 Учредители ---------- */
.founders-grid{ display:grid; grid-template-columns:repeat(2, 1fr); gap:18px; }
.founder-card{
  display:flex; gap:18px; align-items:flex-start;
  background:var(--card); border:1px solid var(--line);
  border-radius:calc(var(--r) + 2px); padding:20px;
  transition:border-color .2s, box-shadow .2s;
}
.founder-card:hover{ border-color:var(--accent); box-shadow:var(--shadow); }
.founder-photo{
  flex:0 0 104px; width:104px; height:128px; overflow:hidden;
  border-radius:var(--r-sm); background:var(--mint);
  display:grid; place-items:center;
}
.founder-photo img{ width:100%; height:100%; object-fit:cover; object-position:center top; }
.founder-initials{
  font-family:var(--display); font-size:30px; font-weight:800;
  color:var(--accent-d); letter-spacing:0.02em;
}
.founder-info{ min-width:0; }
.founder-role{
  display:inline-block; margin-bottom:8px;
  font-size:9.5px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase;
  color:var(--accent-d); background:var(--accent-soft);
  padding:4px 10px; border-radius:var(--r-pill);
}
.founder-card h3{
  font-family:var(--display); font-size:19px; font-weight:700;
  line-height:1.25; letter-spacing:-0.01em; margin-bottom:5px;
}
.founder-rank{
  font-family:var(--mono); font-size:11px; font-weight:600; letter-spacing:0.06em;
  color:var(--wine); margin-bottom:9px;
}
.founder-card p{ font-size:13px; line-height:1.6; color:var(--muted); margin:0; }

/* ---------- 04 Документы ---------- */
.doc-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:16px; margin-bottom:30px; }
.doc-card{
  display:flex; flex-direction:column;
  background:var(--card); border:1px solid var(--line);
  border-radius:var(--r); padding:22px 22px 18px;
  text-decoration:none; color:inherit;
  transition:border-color .2s, transform .2s, box-shadow .2s;
}
.doc-card:hover{ border-color:var(--accent); transform:translateY(-2px); box-shadow:var(--shadow); }
.doc-card.main{ background:var(--mint); border-color:rgba(14,143,126,0.25); }
.doc-ico{
  width:42px; height:42px; margin-bottom:14px;
  display:grid; place-items:center; border-radius:var(--r-sm);
  background:var(--accent-soft); color:var(--accent-d);
}
.doc-ico svg{ width:21px; height:21px; }
.doc-card h3{
  font-family:var(--display); font-size:17.5px; font-weight:700;
  line-height:1.28; margin-bottom:8px;
}
.doc-card p{ font-size:13px; line-height:1.6; color:var(--muted); margin:0 0 16px; }
.doc-card .foot{
  margin-top:auto; display:flex; align-items:center; justify-content:space-between;
  padding-top:12px; border-top:1px dashed var(--line);
}
.doc-card .addr{
  font-family:var(--mono); font-size:11px; font-weight:600;
  letter-spacing:0.06em; color:var(--accent-d);
}
.doc-card .go{ color:var(--faint); transition:color .2s, transform .2s; }
.doc-card:hover .go{ color:var(--accent-d); transform:translate(2px,-2px); }

/* ---------- Реквизиты ---------- */
.requisites{
  background:var(--card); border:1px solid var(--line);
  border-radius:var(--r); padding:24px 26px 10px;
}
.req-head{
  font-size:10px; font-weight:700; letter-spacing:0.2em; text-transform:uppercase;
  color:var(--faint); margin-bottom:14px;
}
.req-list{ margin:0; display:grid; grid-template-columns:1fr 1fr; column-gap:34px; }
.req-list > div{
  display:flex; flex-direction:column; gap:3px;
  padding:10px 0; border-bottom:1px dashed var(--line);
}
.req-list dt{
  font-size:10px; font-weight:700; letter-spacing:0.14em;
  text-transform:uppercase; color:var(--faint);
}
.req-list dd{ margin:0; font-size:14px; font-weight:600; line-height:1.5; }

/* ---------- 05 Контакты ---------- */
.contact-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:16px; margin-bottom:26px; }
.contact-card{
  background:var(--card); border:1px solid var(--line);
  border-radius:var(--r); padding:22px 24px 20px;
}
.contact-cap{
  display:block; margin-bottom:14px;
  font-size:10px; font-weight:700; letter-spacing:0.2em;
  text-transform:uppercase; color:var(--accent-d);
}
.contact-list{ list-style:none; margin:0; padding:0; }
.contact-list li{
  display:flex; flex-direction:column; gap:3px;
  padding:11px 0; border-bottom:1px dashed var(--line);
}
.contact-list li:last-child{ border-bottom:none; padding-bottom:0; }
.cl-label{ font-size:11.5px; color:var(--muted); }
.contact-list a{
  font-size:16px; font-weight:700; letter-spacing:-0.01em;
  color:var(--ink); text-decoration:none; transition:color .2s;
}
.contact-list a:hover{ color:var(--accent-d); }
.contact-addr{ font-size:15px; font-weight:600; line-height:1.6; margin:0 0 12px; }
.contact-note{ font-size:12.5px; line-height:1.6; color:var(--muted); margin:0; }

.soc-grid{ grid-template-columns:repeat(4, 1fr); }

/* ---------- Адаптив ---------- */
@media (max-width:1080px){
  .task-grid{ grid-template-columns:repeat(3, 1fr); }
  .doc-grid{ grid-template-columns:1fr 1fr; }
  .contact-grid{ grid-template-columns:1fr 1fr; }
  .soc-grid{ grid-template-columns:1fr 1fr; }
}

@media (max-width:920px){
  .task-grid{ grid-template-columns:1fr 1fr; }
  .founders-grid{ grid-template-columns:1fr; }
  .req-list{ grid-template-columns:1fr; }
}

@media (max-width:720px){
  .task-grid{ grid-template-columns:1fr; }
  .doc-grid{ grid-template-columns:1fr; }
  .contact-grid{ grid-template-columns:1fr; }
  .soc-grid{ grid-template-columns:1fr; }
  .founder-card{ flex-direction:column; }
  .founder-photo{ flex-basis:auto; width:100%; height:220px; }
  .founder-photo img{ object-position:center 20%; }
}
