/* ============================================================================
   T5-SERVICE — оболочка СЕРВИСНЫХ страниц М1 (о компании · контакты ·
   доставка-оплата · политика). Одна оболочка = один файл (план TEMPLATES-PLAN
   §Т5: «сервисные = КОНФИГУРАЦИИ ОДНОЙ ОБОЛОЧКИ»). Автор: designer, 12.07.2026.

   ПОДКЛЮЧЕНИЕ на странице (в pages/, на уровень глубже templates-v5/):
     <link rel="stylesheet" href="../tokens-v5.css">
     <link rel="stylesheet" href="../partials-v5.css">
     <link rel="stylesheet" href="../t5-service.css">
   ПРАВИЛО: ни одного цветового литерала — только var(--*) из tokens-v5.css.
   Сервисная страница ПРОЩЕ услуги: hero-компакт (крошки+H1+лид, БЕЗ чертёжной
   карточки и БЕЗ формы в hero); контентные секции; чередование Т/С строго (№57).
   Часть классов (rel-grid/rel-card, tlink, breadcrumbs) — перенос 1-в-1 из
   t2-usluga (общий язык серии); собраны здесь, чтобы сервисный шаблон не тянул
   стиль-блок услуги.
   ============================================================================ */

/* ---------- крошки (на тёмном hero-компакте) ---------- */
.breadcrumbs{ margin-bottom:1.6rem; font-size:var(--fs-13); }
.breadcrumbs ol{ display:flex; flex-wrap:wrap; align-items:center; gap:.15rem .35rem; }
.breadcrumbs li{ display:flex; align-items:center; gap:.35rem; color:var(--on-dark-faint); }
.breadcrumbs li + li::before{ content:'/'; color:var(--dark-line); }
.breadcrumbs a{ color:var(--on-dark-dim); padding-block:.5rem; display:inline-block; }
.breadcrumbs a:hover{ color:var(--on-dark-strong); }
.breadcrumbs [aria-current]{ color:var(--on-dark); }

/* ---------- HERO-КОМПАКТ (Т): крошки + eyebrow + H1 + лид, без карточки ---------- */
.hero-compact{ padding-block:clamp(2.25rem,4.5vw,3.75rem) clamp(2.5rem,5vw,4rem); }
.hero-compact .lede{ margin-top:1.35rem; font-size:var(--fs-17); color:var(--on-dark);
  max-width:60ch; }
.hero-compact .hero-links{ display:flex; flex-wrap:wrap; gap:.2rem 1.5rem; margin-top:1.6rem; }
.hero-compact .hero-links a{ font-size:var(--fs-14); font-weight:600; color:var(--on-dark);
  border-bottom:1px solid var(--ghost-border); padding-block:.45rem; }
.hero-compact .hero-links a:hover{ color:var(--on-dark-strong); border-color:var(--accent); }
/* пометка-предупреждение в hero (напр. «черновик — до юриста») */
.hero-flag{ display:inline-flex; align-items:center; gap:.55rem; margin-top:1.35rem;
  padding:.5rem .9rem; border:1px dashed var(--ghost-border); border-radius:var(--radius);
  font-size:var(--fs-13); color:var(--on-dark-dim); }
.hero-flag::before{ content:''; width:8px; height:8px; flex-shrink:0; background:var(--accent); border-radius:50%; }

/* ---------- инлайн-ссылки контента (обе темы), перенос из t2 ---------- */
.tlink{ color:var(--ink); font-weight:600; border-bottom:2px solid var(--accent);
  padding-bottom:1px; transition:background-color var(--dur-1) var(--ease); }
.tlink:hover{ background:var(--accent); color:var(--ink); }
.blue-block .tlink{ color:var(--on-dark-strong); }
.blue-block .tlink:hover{ background:var(--accent); color:var(--ink); }

/* заглушки фактов [ЖДЁТ №N] / [уточняется] в тексте */
.pending{ color:var(--faint); }
.blue-block .pending{ color:var(--on-dark-faint); }

/* ---------- ПРОЗА КОНТЕНТА (о компании / доставка): абзацы + списки ---------- */
.prose{ max-width:70ch; }
.prose p{ font-size:var(--fs-16); color:var(--ink-700); line-height:var(--lh-body); }
.prose p + p{ margin-top:1.05rem; }
.prose h3{ font-size:var(--fs-18); margin:2rem 0 .8rem; }
.prose a{ color:var(--ink); font-weight:600; border-bottom:2px solid var(--accent); padding-bottom:1px; }
.prose a:hover{ background:var(--accent); }
.prose ul{ margin-top:1.05rem; display:flex; flex-direction:column; gap:.7rem; }
.prose ul li{ position:relative; padding-left:1.5rem; font-size:var(--fs-16); color:var(--ink-700); }
.prose ul li b{ color:var(--ink); font-weight:700; }
.prose ul li::before{ content:''; position:absolute; left:0; top:.55em; width:8px; height:8px;
  border-radius:50%; background:var(--bullet-grad); box-shadow:var(--bullet-glow); }
.blue-block .prose p, .blue-block .prose ul li{ color:var(--on-dark); }
.blue-block .prose ul li b, .blue-block .prose h3{ color:var(--on-dark-strong); }
.blue-block .prose a{ color:var(--on-dark-strong); }

/* ---------- СТАТ-ПЛИТКИ (цифры-герои, №49/«цифры крупнее слов») ---------- */
.stat-tiles{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.1rem; margin-top:.5rem; }
.stat-tile{ padding:1.35rem 1.4rem 1.25rem; display:flex; flex-direction:column; gap:.35rem; }
.stat-tile b{ font-family:var(--ff-display); font-weight:800; font-size:var(--fs-num-lg);
  color:var(--ink); letter-spacing:.01em; line-height:1.05;
  box-shadow:inset 0 -.32em 0 var(--accent); align-self:flex-start; }
.stat-tile span{ font-size:var(--fs-14); color:var(--muted); }

/* ---------- ИНФО-ПАНЕЛИ (доставка/оплата/материал/документы) ---------- */
.panel-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1.2rem; }
.panel-grid.cols-3{ grid-template-columns:repeat(3,1fr); }
.info-panel{ padding:1.75rem 1.6rem 1.6rem; display:flex; flex-direction:column; gap:.85rem; }
.info-panel .icon-wrap{ width:44px; height:44px; display:grid; place-items:center; flex-shrink:0;
  border:1px solid var(--line-strong); border-radius:var(--radius); color:var(--ink); background:var(--paper); }
.info-panel h3{ font-size:var(--fs-18); }
.info-panel p{ font-size:var(--fs-15); color:var(--muted); }
.info-panel p + p{ margin-top:.6rem; }
.info-panel p b{ color:var(--ink); font-weight:700; }
.info-panel .tlink{ font-size:var(--fs-15); }

/* ---------- СЕТКА УСЛУГ (перелинковка — железное правило), перенос из t2 ---------- */
.rel-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
.rel-card{ padding:1.6rem 1.5rem 1.45rem; display:flex; flex-direction:column; gap:.75rem; }
.rel-card .icon-wrap{ width:44px; height:44px; display:grid; place-items:center; flex-shrink:0;
  border:1px solid var(--line-strong); border-radius:var(--radius); color:var(--ink); background:var(--paper); }
.rel-card h3{ font-size:var(--fs-16); }
.rel-card p{ font-size:var(--fs-15); color:var(--muted); }
.rel-card .more{ margin-top:auto; padding-top:.4rem; font-size:var(--fs-14); font-weight:600; color:var(--ink);
  display:inline-flex; align-items:center; gap:.4rem; }
.rel-card .more::after{ content:'→'; transition:transform var(--dur-1) var(--ease); }
.rel-card:hover .more::after{ transform:translateX(4px); }
.prod-more{ margin-top:1.75rem; }
.prod-more a{ font-size:var(--fs-15); font-weight:700; color:var(--ink);
  border-bottom:2px solid var(--accent); padding-bottom:.15rem; position:relative; display:inline-block; }
.blue-block .prod-more a{ color:var(--on-dark-strong); }
.prod-more a::before{ content:''; position:absolute; left:-6px; right:-6px; top:-12px; bottom:-12px; } /* хит-зона ≥44 */

/* ---------- КОНТАКТ-БЛОК (двухколонник «данные | карта») ---------- */
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.5rem,4vw,3rem); align-items:start; }
.contact-list{ display:flex; flex-direction:column; gap:1.15rem; }
.contact-row{ display:flex; gap:1rem; align-items:flex-start; }
.contact-row .icon-wrap{ width:46px; height:46px; display:grid; place-items:center; flex-shrink:0;
  border:1px solid var(--line-strong); border-radius:var(--radius); color:var(--ink); background:var(--paper); }
.contact-row .c-body{ display:flex; flex-direction:column; gap:.2rem; min-width:0; }
.contact-row .c-label{ font-size:var(--fs-11); font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; color:var(--muted); }
.contact-row .c-value{ font-size:var(--fs-17); color:var(--ink); font-weight:600; }
.contact-row .c-value a{ color:var(--ink); border-bottom:2px solid var(--accent); padding-bottom:1px; }
.contact-row .c-value a:hover{ background:var(--accent); }
.contact-row .c-sub{ font-size:var(--fs-14); color:var(--muted); }

/* карта-болванка: заглушка до координат/embed (facts.yaml maps_links pending) */
.map-stub{ position:relative; min-height:340px; border:1px dashed var(--line-strong);
  border-radius:var(--radius); background-color:var(--panel); background-image:var(--bg-diag);
  display:grid; place-items:center; text-align:center; padding:2rem; }
.map-stub .m-inner{ display:flex; flex-direction:column; align-items:center; gap:.75rem; max-width:34ch; }
.map-stub svg{ color:var(--faint); }
.map-stub b{ font-family:var(--ff-display); font-weight:800; text-transform:uppercase;
  font-size:var(--fs-15); color:var(--ink); letter-spacing:.02em; }
.map-stub span{ font-size:var(--fs-13); color:var(--muted); }

/* ---------- ФОТО-РАМКА НА ТЁМНОМ (собственное производство) ---------- */
.prod-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,5vw,3.5rem); align-items:center; }
.prod-figure{ margin:0; }

/* ---------- заметка-сноска под таблицей/панелями ---------- */
.svc-note{ margin-top:1.4rem; font-size:var(--fs-13); color:var(--faint); max-width:72ch; }
.blue-block .svc-note{ color:var(--on-dark-faint); }

/* «Смотрите также» — строка перелинковки внизу контента (не отдельная тёмная секция) */
.see-also{ margin-top:2.25rem; padding-top:1.4rem; border-top:1px solid var(--line);
  font-size:var(--fs-15); color:var(--muted); }
.see-also a{ color:var(--ink); font-weight:600; border-bottom:1px solid var(--accent); padding-bottom:1px; }
.see-also a:hover{ background:var(--accent); }
.blue-block .see-also{ border-color:var(--dark-line); color:var(--on-dark-dim); }
.blue-block .see-also a{ color:var(--on-dark-strong); }

/* ============================================================================
   АДАПТИВ T5
   ============================================================================ */
@media (max-width:960px){
  .stat-tiles{ grid-template-columns:repeat(2,1fr); }
  .panel-grid, .panel-grid.cols-3{ grid-template-columns:1fr; }
  .rel-grid{ grid-template-columns:repeat(2,1fr); }
  .contact-grid{ grid-template-columns:1fr; }
  .prod-grid{ grid-template-columns:1fr; }
  .map-stub{ min-height:260px; }
}
@media (max-width:600px){
  .stat-tiles{ grid-template-columns:repeat(2,1fr); gap:.7rem; }
  .stat-tile{ padding:1.05rem 1.05rem 1rem; }
  .rel-grid{ grid-template-columns:1fr; }
  /* наборный текст карточек/прозы на мобильном ≥16px (№59-аудит) */
  .rel-card p, .info-panel p, .contact-row .c-sub{ font-size:var(--fs-16); }
  .prose p, .prose ul li{ font-size:var(--fs-16); }
}