/* ═══ Вопросы и ответы (/voprosy-i-otvety/, шаблон faq) ════════════════
   Поверх v2.css и v2-pages.css. Все значения — токены DESIGN.md, своих
   токенов у страницы нет. Написано от 375 px вверх.
   Раскладка — общая .pgrid--toc: на телефоне ряд пилюль-якорей над
   вопросами, от 900 px липкая левая колонка с оглавлением и карточкой
   «Не нашли ответ?». Вопросы — блок faq главной (details.qa на льне). */

/* Секция вопросов: шапка страницы уже дала верхний отступ. */
.v2 .faqp{padding-block:0 var(--sec)}
/* Блок faq стоит внутри колонки: свои поля и ширина контейнера не нужны. */
.v2 .faqp .faq{padding-block:0}
.v2 .faqp .faq>.wrap{max-width:none;padding-inline:0}
/* Заголовки групп — ступень ниже H1 (--t-phrase, как H2 в .prose):
   на --t-h2 «Цена и заказ» почти равен H1 и читается вторым заголовком страницы. */
.v2 .faqp .faq__group>.h2{font:500 var(--t-phrase)/1.2 var(--f-d);letter-spacing:-.01em}

/* ── Врезка «Не нашли ответ?» (прототип 09, блок 01) ─────────────────── */
/* Телефон (база): под лидом шапки только ссылки — телефон (Jost 600 --t-ui)
   и мессенджеры строкой, как в блоке заявки; без заголовка, часов и глифа.
   Льняная карточка в 260 px уводила первый ответ за край первого окна,
   а всё то же есть в блоке «Не нашли ответ?» внизу. */
/* Шапка на телефоне без нижнего поля --s-5: строка «телефон · мессенджеры» —
   продолжение шапки, а не новый блок (иначе над сгибом ~60 px пустоты). */
.v2 .faqp-head{padding-bottom:var(--s-2)}
.v2 .faqp-top{padding-bottom:var(--s-4)}
/* Между телефоном и мессенджерами --s-1: обе строки — цели 44 px, вплотную они касались. */
.v2 .faqp-help{display:grid;justify-items:start;row-gap:var(--s-1)}
.v2 .faqp__help{display:none}
.v2 .faqp-help__ico,.v2 .faqp-help__t,.v2 .faqp-help__hours,.v2 .faqp-help__go{display:none}
.v2 .faqp-help__tel a{display:inline-flex;align-items:center;min-height:var(--tap);font:600 var(--t-ui)/1.2 var(--f-d);color:var(--ink);
  text-decoration:underline;text-underline-offset:var(--ul-off);text-decoration-color:var(--rule)}
.v2 .faqp-help__tel a:hover{color:var(--acc-ink);text-decoration-color:currentColor}
.v2 .faqp-help__soc{display:flex;flex-wrap:wrap;column-gap:var(--s-3);margin:0;padding:0;list-style:none}
.v2 .faqp-help__soc .pill{justify-content:center;min-width:var(--tap);min-height:var(--tap);padding:0;border-radius:0;background:none;color:var(--acc);font:600 var(--t-ui)/1.2 var(--f-b);
  text-decoration:underline;text-underline-offset:var(--ul-off)}
.v2 .faqp-help__soc .pill:hover{background:none;color:var(--acc-ink)}

/* От 600 px — карточка на льне, плоская, без тени: заголовок, телефон
   --t-num, часы, мессенджеры пилюлями на белом (DESIGN §4), «Задать вопрос». */
@media (min-width:600px){
  .v2 .faqp-head{padding-bottom:var(--s-5)}
  .v2 .faqp-top{padding-bottom:var(--s-5)}
  .v2 .faqp-top .faqp-help{max-width:var(--canvas-md)}
  .v2 .faqp-help{gap:var(--s-2);padding:var(--s-4);border-radius:var(--r-img);background:var(--linen)}
  .v2 .faqp-help__t{display:block;font:600 var(--t-h3)/1.25 var(--f-d)}
  .v2 .faqp-help__hours{display:block;margin-top:calc(var(--s-2) * -1);font-size:var(--t-s);color:var(--ink-2)}
  .v2 .faqp-help__go{display:inline-flex}
  .v2 .faqp-help__tel a{font:600 var(--t-num)/1.1 var(--f-d)}
  .v2 .faqp-help__soc{gap:var(--s-1)}
  .v2 .faqp-help__soc .pill{padding:0 var(--s-3);border-radius:var(--r-chip);background:var(--card);color:var(--ink);font:600 var(--t-ui)/1.2 var(--f-d);text-decoration:none}
  .v2 .faqp-help__soc .pill:hover{background:color-mix(in srgb,var(--ink) 8%,var(--card));color:var(--ink)}
}
/* От 900 px — в липкой колонке под оглавлением, с глифом в белом кружке.
   Пилюли растягиваются по строке: в узкой колонке они встают 2 + 1,
   и обе строки кончаются ровно по краю карточки. */
@media (min-width:900px){
  .v2 .faqp-head{padding-bottom:var(--s-6)}
  .v2 .faqp-top{display:none}
  .v2 .faqp__help{display:grid}
  .v2 .faqp-help__ico{display:grid;place-items:center;width:calc(var(--tap) + var(--s-2));height:calc(var(--tap) + var(--s-2));border-radius:var(--r-chip);background:var(--card);color:var(--acc-ink)}
  .v2 .faqp-help__ico svg{width:60%;height:60%}
  .v2 .faqp__help .faqp-help__soc{justify-self:stretch}
  .v2 .faqp__help .faqp-help__soc li{display:flex;flex:1 1 auto}
  .v2 .faqp__help .faqp-help__soc .pill{flex:1 1 auto;justify-content:center}
}

/* ── «Как выбрать фото»: кадры «подойдёт / не подойдёт» в ответе ─────── */
/* Разметка — monro_faqpage_with_shots() (inc/v2-pages/faq.php). Кадр 4:5
   (без метки «Пример» — решение 01.10), под ним метка как в «Какое фото подойдёт»
   (DESIGN §9б: глиф + текст; глиф — маской, SVG в ответе срезает kses).
   Телефон и планшет: 2 × 2 не шире --drop-max; от 1000 px — 4 в ряд
   на всю ширину ответа, абзацы — по-прежнему не шире --measure-l. */
/* .qa__a .faqp-shots: сильнее общего .qa__a--rich ul (отступ и маркер списка). */
.v2 .qa__a .faqp-shots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-3) var(--s-2);max-width:var(--drop-max);margin:0;padding:0;list-style:none}
.v2 .faqp-shot{display:grid;gap:var(--s-1);align-content:start}
.v2 .faqp-shot__img{position:relative;aspect-ratio:4/5;border-radius:var(--r-img);overflow:hidden;background:var(--card)}
.v2 .faqp-shot__img img{width:100%;height:100%;object-fit:cover}
.v2 .faqp-shot__mark{display:inline-flex;align-items:center;gap:var(--s-0);justify-self:start;min-height:var(--chip-h);padding:0 var(--s-1);border-radius:var(--r-chip);
  background:var(--card);color:var(--ink);font:600 var(--t-s)/1 var(--f-b);white-space:nowrap}
.v2 .faqp-shot__mark::before{content:"";flex:0 0 auto;width:var(--ico);height:var(--ico);background:currentColor;
  -webkit-mask:url(../../img/glyphs/g-frames.svg) center/contain no-repeat;mask:url(../../img/glyphs/g-frames.svg) center/contain no-repeat}
.v2 .faqp-shot--ok .faqp-shot__mark{background:var(--acc-soft);color:var(--acc-ink)}
.v2 .faqp-shot--ok .faqp-shot__mark::before{-webkit-mask-image:url(../../img/glyphs/g-ok.svg);mask-image:url(../../img/glyphs/g-ok.svg)}
.v2 .faqp-shot--no .faqp-shot__mark{background:var(--ink);color:var(--card)}
.v2 .faqp-shot--no .faqp-shot__mark::before{-webkit-mask-image:url(../../img/glyphs/g-no.svg);mask-image:url(../../img/glyphs/g-no.svg)}
@media (min-width:1000px){
  .v2 .faqp .qa__a:has(.faqp-shots){max-width:none}
  .v2 .faqp .qa__a:has(.faqp-shots)>p{max-width:var(--measure-l)}
  .v2 .qa__a .faqp-shots{grid-template-columns:repeat(4,minmax(0,1fr));max-width:none}
}

/* Заявка «Не нашли ответ?»: от 900 px колонки по центру высоты друг друга — общее правило .lead-sec__in (v2.css). */