/* Стили FAQ-указателя (.nfq-*). Вынесено из template-parts/components/faq.php 11.10.2026: печаталось инлайном на каждой странице с этим блоком.
   Подключается <link> на том же месте шаблона — порядок каскада прежний. */

.nfq-section{padding:0 !important;margin:96px 0 !important}
/* Ширину задаёт общесайтовый .nt-container (15.07: свой 1240px разъезжался
   с шириной остальной страницы — контент сайта 1280px) */
.nfq-container{margin:0 auto}
.nfq-panel{background:#fff;border:4px solid #000;border-radius:12px;box-shadow:8px 8px 0 0 #000;padding:40px 44px}
.nfq-chip{display:inline-block;background:#000;color:#fff;font-family:Montserrat,sans-serif;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.15em;padding:6px 16px;border-radius:4px;margin-bottom:14px}
/* Префикс .nfq-panel — иначе глобальный h2-цвет перебивает чёрный */
.nfq-panel .nfq-title{font-family:Montserrat,sans-serif;font-size:clamp(24px,3vw,36px);font-weight:900;text-transform:uppercase;letter-spacing:-.03em;line-height:1;color:#000;margin:0 0 28px}
.nfq-item{border-top:3px solid #000}
.nfq-item:first-of-type{border-top:none}
.nfq-q{display:flex;align-items:center;gap:18px;padding:20px 0;cursor:pointer;-webkit-tap-highlight-color:transparent}
.nfq-num{flex-shrink:0;width:38px;height:38px;display:flex;align-items:center;justify-content:center;background:#fff;border:3px solid #000;border-radius:8px;font-family:Montserrat,sans-serif;font-size:14px;font-weight:900;color:#000;transition:background .2s ease,color .2s ease}
.nfq-item.active .nfq-num{background:#2C3DF5;border-color:#000;color:#fff}
.nfq-qtext{flex:1;font-family:Montserrat,sans-serif;font-size:16px;font-weight:700;color:#000;line-height:1.4}
.nfq-q:hover .nfq-qtext{color:#2C3DF5}
.nfq-toggle{flex-shrink:0;width:38px;height:38px;position:relative;background:#FFB7CD;border:3px solid #000;border-radius:8px;box-shadow:3px 3px 0 0 #000;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.nfq-q:hover .nfq-toggle{transform:translate(-1px,-1px);box-shadow:4px 4px 0 0 #000}
.nfq-item.active .nfq-toggle{background:#2C3DF5;transform:translate(2px,2px);box-shadow:0 0 0 0 #000}
.nfq-toggle::before,.nfq-toggle::after{content:"";position:absolute;top:50%;left:50%;background:#000;transition:transform .2s ease,opacity .2s ease,background .2s ease}
.nfq-toggle::before{width:14px;height:3px;transform:translate(-50%,-50%)}
.nfq-toggle::after{width:3px;height:14px;transform:translate(-50%,-50%)}
.nfq-item.active .nfq-toggle::before{background:#fff}
.nfq-item.active .nfq-toggle::after{opacity:0;transform:translate(-50%,-50%) rotate(90deg);background:#fff}
.nfq-a{max-height:0;overflow:hidden;transition:max-height .3s ease,padding .3s ease;padding:0 56px 0 56px}
.nfq-item.active .nfq-a{padding-bottom:22px}
.nfq-a p{font-size:var(--nt-text-size);font-weight:var(--nt-text-weight);color:var(--nt-text-color);line-height:var(--nt-text-line);margin:0 0 12px}
.nfq-a p:last-child{margin-bottom:0}
@media (max-width:768px){
.nfq-section{margin:56px 0 !important}
.nfq-panel{padding:24px 18px;border-width:3px;box-shadow:5px 5px 0 0 #000}
.nfq-q{gap:12px;padding:16px 0}
.nfq-num{width:32px;height:32px;font-size:12px;border-width:2.5px}
.nfq-qtext{font-size:14px}
.nfq-toggle{width:32px;height:32px;border-width:2.5px}
.nfq-a{padding:0 0 0 44px}
.nfq-item.active .nfq-a{padding-bottom:16px}
.nfq-a p{font-size:var(--nt-text-size)}
}
/* ── SPLIT-раскладка (layout => 'split'): без коробки ──
   Слева заголовок/подводка/CTA занимают боковой воздух, справа
   компактная колонка вопросов ~680px — линии не тянутся на всю ширину */
.nfq--split .nfq-grid{display:grid;grid-template-columns:minmax(260px,360px) minmax(0,680px);gap:56px;justify-content:space-between}
.nfq--split .nfq-title{font-family:Montserrat,sans-serif;font-size:clamp(28px,3.6vw,44px);font-weight:900;text-transform:uppercase;letter-spacing:-.03em;line-height:.95;color:#000;margin:0 0 14px}
.nfq--split .nfq-lead{font-size:14px;font-weight:600;color:rgba(33,55,119,.72);line-height:1.6;max-width:34ch;margin:0 0 22px}
.nfq-ask{display:inline-flex;align-items:center;gap:10px;background:#FFB7CD;color:#000;border:2px solid #000;border-radius:0;box-shadow:4px 4px 0 0 #000;font-family:Montserrat,sans-serif;font-size:13px;font-weight:900;text-transform:uppercase;letter-spacing:.05em;padding:13px 22px;text-decoration:none;transition:transform .15s ease,box-shadow .15s ease}
.nfq-ask:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 0 #000;color:#000}
.nfq-ghost{margin-top:34px;font-family:Montserrat,sans-serif;font-size:clamp(60px,7vw,96px);font-weight:900;letter-spacing:-.04em;line-height:1;color:transparent;-webkit-text-stroke:2px rgba(0,0,0,.14);user-select:none}
.nfq--split .nfq-num{display:none}
.nfq--split .nfq-list{border-bottom:3px solid #000}
.nfq--split .nfq-item{border-top:2px solid #000}
.nfq--split .nfq-item:first-of-type{border-top:3px solid #000}
.nfq--split .nfq-q{padding:20px 2px}
.nfq--split .nfq-a{padding:0 2px}
.nfq--split .nfq-item.active .nfq-a{padding-bottom:20px}
@media (max-width:820px){
.nfq--split .nfq-grid{grid-template-columns:1fr;gap:26px}
.nfq-ghost{display:none}
}
@media (prefers-reduced-motion:reduce){
.nfq-num,.nfq-toggle,.nfq-toggle::before,.nfq-toggle::after,.nfq-a,.nfq-ask{transition:none}
}
/* ── INDEX-раскладка (layout => 'index'): плакатный указатель TE (утв. 16.07) ──
   Высокие строки-полосы с зеброй, вопросы Unbounded крупно, активная строка
   заливается синим целиком. ВСЁ с !important: компонент живёт на 15 страницах
   с агрессивными собственными CSS (about, warranty-семейство и т.д.) ── */
.nfq--index .nfq-title{display:block !important;font-family:Montserrat,sans-serif !important;font-size:clamp(24px,3vw,34px) !important;font-weight:900 !important;text-transform:uppercase !important;letter-spacing:-.02em !important;line-height:1.1 !important;color:#000 !important;text-align:center !important;margin:0 0 6px !important;padding:0 !important;background:none !important;border:none !important;text-decoration:none !important}
.nfq--index .nfq-title--solo{margin-bottom:34px !important}
.nfq--index .nfq-lead{display:block !important;font-family:var(--nt-font-text) !important;font-size:var(--nt-text2-size) !important;font-weight:var(--nt-text2-weight) !important;color:var(--nt-text2-color) !important;text-align:center !important;margin:0 0 34px !important}
.nfq--index .nfq-list{display:flex !important;flex-direction:column !important;gap:3px !important;border:none !important}
.nfq--index .nfq-item{cursor:pointer !important;border:none !important;background:transparent !important}
.nfq--index .nfq-item:first-of-type{border:none !important}
.nfq--index .nfq-q{display:flex !important;align-items:center !important;gap:34px !important;padding:22px 30px !important;background:#fff !important;transition:background .16s ease !important;border:none !important}
.nfq--index .nfq-item:nth-child(odd) .nfq-q{background:#F0F0F0 !important}
.nfq--index .nfq-toggle{display:none !important}
.nfq--index .nfq-num{display:flex !important;min-width:52px !important;width:auto !important;height:auto !important;border:none !important;border-radius:0 !important;background:transparent !important;box-shadow:none !important;font-family:'Unbounded',Montserrat,sans-serif !important;font-weight:400 !important;font-size:clamp(17px,2vw,24px) !important;font-variant-numeric:tabular-nums !important;color:#000 !important;transition:color .16s ease !important}
.nfq--index .nfq-qtext{font-family:'Unbounded',Montserrat,sans-serif !important;font-weight:400 !important;font-size:clamp(16px,2.1vw,24px) !important;text-transform:uppercase !important;letter-spacing:.01em !important;line-height:1.25 !important;color:#000 !important;transition:color .16s ease !important}
.nfq--index .nfq-q:hover .nfq-qtext,.nfq--index .nfq-q:hover .nfq-num{color:#2C3DF5 !important}
.nfq--index .nfq-item.active .nfq-num{background:transparent !important;border:none !important;color:#fff !important}
.nfq--index .nfq-item.active .nfq-q{background:#2C3DF5 !important}
.nfq--index .nfq-item.active .nfq-q .nfq-qtext{color:#fff !important}
.nfq--index .nfq-item.active .nfq-q:hover .nfq-qtext,.nfq--index .nfq-item.active .nfq-q:hover .nfq-num{color:#fff !important}
.nfq--index .nfq-a{padding:0 30px 0 116px !important}
.nfq--index .nfq-item.active .nfq-a{max-height:none !important;padding-bottom:26px !important;padding-top:20px !important}
.nfq--index .nfq-a p{font-family:var(--nt-font-text) !important;font-weight:var(--nt-text-weight) !important;font-size:var(--nt-text-size) !important;color:var(--nt-text-color) !important;line-height:var(--nt-text-line) !important;max-width:70ch !important;margin:0 0 10px !important}
.nfq--index .nfq-idx-foot{display:flex !important;align-items:center !important;gap:34px !important;padding:22px 30px !important;border:2px solid #000 !important;border-radius:0 !important;text-decoration:none !important;color:#000 !important;background:#fff !important;box-shadow:none !important;transition:background .16s ease,color .16s ease !important}
.nfq--index .nfq-idx-foot .nfq-foot-num{flex-shrink:0 !important;min-width:52px !important;font-family:'Unbounded',Montserrat,sans-serif !important;font-weight:400 !important;font-size:clamp(17px,2vw,24px) !important;font-variant-numeric:tabular-nums !important;color:inherit !important}
.nfq--index .nfq-idx-foot .nfq-foot-t{flex:1 !important;font-family:'Unbounded',Montserrat,sans-serif !important;font-weight:400 !important;font-size:clamp(16px,2.1vw,24px) !important;text-transform:uppercase !important;letter-spacing:.01em !important;color:inherit !important}
.nfq--index .nfq-idx-foot:hover{background:#000 !important;color:#fff !important}
@media (max-width:640px){
.nfq--index .nfq-q{gap:16px !important;padding:16px 16px !important}
.nfq--index .nfq-num{min-width:34px !important}
.nfq--index .nfq-a{padding:0 16px 0 66px !important}
.nfq--index .nfq-item.active .nfq-a{padding-bottom:20px !important;padding-top:14px !important}
.nfq--index .nfq-idx-foot{gap:16px !important;padding:16px 16px !important}
.nfq--index .nfq-idx-foot .nfq-foot-num{min-width:34px !important}
}
