:root{
    --bg:#242424;
    --white:#ffffff;
    --muted:rgba(255,255,255,.55);
    --line:rgba(255,255,255,.13);
    --accent:#c9a16b;
    --display:"Montserrat",-apple-system,Arial,sans-serif;
    --body:"Archivo","Helvetica Neue",Arial,sans-serif;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{background:var(--bg);color:var(--white);font-family:var(--body);font-stretch:125%;-webkit-font-smoothing:antialiased;line-height:1.5;overflow-x:hidden}
  a{color:inherit;text-decoration:none}
  .wrap{max-width:1600px;margin:0 auto;padding:0 48px}

  /* Баннер */
  .hero-faq{position:relative;max-width:960px;margin:10px auto 34px;border-radius:8px;overflow:hidden;cursor:pointer}
  .banner-faq{position:relative;display:block;line-height:0}
  .banner-faq:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.8) 20%,transparent);z-index:1;pointer-events:none}
  .faq-img{display:block;width:100%;height:auto;transition:transform .4s ease}
  .hero-faq:hover .faq-img{transform:scale(1.04)}
  .hero-inner{position:absolute;top:50%;left:0;transform:translateY(-50%);z-index:2;padding:0 0 0 48px;max-width:500px}
  .hero-inner h2{font-family:var(--display);font-weight:600;font-size:26px;letter-spacing:.01em;margin-bottom:12px;color:#fff}
  .hero-inner p{font-size:14px;line-height:1.5;color:rgba(255,255,255,.85);max-width:320px;margin-bottom:18px}

  /* Теги */
  .filters{display:flex;justify-content:center;flex-wrap:wrap;gap:40px;margin-bottom:30px}
  .filter{background:none;border:none;cursor:pointer;color:#a89f9b;font-family:var(--body);font-stretch:125%;font-size:14px;letter-spacing:.04em;transition:color .2s;padding:6px 0}
  .filter:hover{color:var(--white)}
  .filter.active{color:var(--white)}

  /* Список вопросов */
  .vacancies{border-bottom:1px solid rgba(255,255,255,.1)}
  .vacancy{display:grid;grid-template-columns:1fr 240px 40px;align-items:center;gap:24px;padding:38px 0;border:none;border-top:1px solid rgba(255,255,255,.1);cursor:pointer;transition:background .25s;text-align:left;background:none;width:100%;font-family:inherit}
  .vacancy:hover{background:none}
  .vacancy .pos{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-stretch:normal;font-size:16px;font-weight:400;letter-spacing:.4px;line-height:1.25;color:#fff}
  .vacancy .loc{display:flex;align-items:center;gap:8px;color:#9d9390;font-size:16px;font-weight:400;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-stretch:normal}
  .vacancy .arrow{justify-self:end;color:#ffffff}
  .vacancy .arrow svg{width:19px;height:12px;stroke:#ffffff;fill:none;stroke-width:2.4}
  .empty{padding:60px 0;text-align:center;color:var(--muted)}

  /* Карточка ответа */
  #detail{display:none;animation:fade .35s ease;margin-bottom:24px}
  @keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
  .vac-panel{background:#fff;color:#3a3330;border-radius:12px;padding:45px 55px 52px;margin-top:8px}
  .detail-title{font-family:var(--body);font-stretch:125%;font-weight:400;font-size:24px;line-height:1.25;letter-spacing:.02em;color:#3a3330;margin:0 0 14px}
  .detail-answer{border-top:1px solid #ece9e6;padding-top:34px;margin-top:6px;color:#3a3330}
  .detail-answer p{font-size:16px;line-height:1.7;color:#3a3330;margin-bottom:14px}
  .detail-answer p:last-child{margin-bottom:0}
  .detail-answer ul,.detail-answer ol{margin:0 0 14px;padding-left:22px}
  .detail-answer li{font-size:16px;line-height:1.7;color:#3a3330;margin-bottom:9px}
  .detail-answer li::marker{color:#ef6f2e}
  .detail-answer b{font-weight:600;color:#3a3330}
  #detail{display:none;animation:fade .35s ease;margin-bottom:24px;scroll-margin-top:150px}

  /* Сайдбар «Смотрите также» */
  #detail .detail-layout{display:grid;grid-template-columns:300px 1fr;gap:40px;align-items:start}
  .sidebar{position:sticky;top:20px}
  .sidebar-title{font-family:var(--display);font-weight:600;font-size:18px;color:#fff;padding-bottom:18px;border-bottom:1px solid var(--line)}
  #sidebar-groups{display:flex;flex-direction:column;gap:18px;padding-top:22px}
  .sb-item{text-align:left;background:none;border:none;padding:0;cursor:pointer;color:rgba(255,255,255,.6);font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;line-height:1.5;transition:color .2s}
  .sb-item:hover{color:#fff;text-decoration:underline}
  .sb-item.active{color:var(--accent)}
  @media(max-width:900px){#detail .detail-layout{grid-template-columns:1fr}.sidebar{display:none}}

  @media(max-width:768px){
  .wrap{padding:0 16px}
  h1.page-title{font-size:24px;line-height:30px;margin:2px 0 22px}

  /* Баннер */
  .hero-faq{margin:4px auto 22px;border-radius:8px}
  .banner-faq{min-height:190px}
  .faq-img{position:absolute;inset:0;width:100%;height:100% !important;object-fit:cover}
  .banner-faq:before{background:linear-gradient(90deg,rgba(0,0,0,.85),rgba(0,0,0,.4))}
  .hero-inner{padding:0 20px;max-width:100%;width:100%}
  .hero-inner h2{font-size:18px;line-height:1.2;margin-bottom:8px}
  .hero-inner p{font-size:12px;line-height:1.4;max-width:100%;margin-bottom:14px}
  .hero-inner .back-pill{margin:0;padding:10px 22px;font-size:11px}

  /* Теги и*/
  .filters{flex-wrap:nowrap;justify-content:flex-start;gap:18px;overflow-x:auto;margin:0 -16px 22px;padding:0 16px 6px;scrollbar-width:none}
  .filters::-webkit-scrollbar{display:none}
  .filter{flex:0 0 auto;white-space:nowrap;font-size:13px}

  /* Вопросы */
  .vacancy{grid-template-columns:1fr 26px;gap:14px;padding:22px 0}
  .vacancy .loc{display:none}
  .vacancy .pos{font-size:15px;letter-spacing:.2px}

  /* Карточка ответа */
  .vac-panel{padding:26px 20px 30px;border-radius:10px}
  .detail-title{font-size:20px;line-height:1.25}
  .detail-answer{padding-top:24px}
  .detail-answer p,.detail-answer li{font-size:15px}
  .back-pill{padding:12px 26px}
}

  /* Кнопки */
  .back-pill{display:inline-flex;align-items:center;justify-content:center;min-height:14px;margin:0 0 20px;padding:14px 32px;color:#fff;font-size:13px;font-weight:400;line-height:15px;letter-spacing:1.4px;text-transform:uppercase;white-space:nowrap;background:transparent;border:1px solid #DCB673B2;border-radius:15.5px;opacity:1;cursor:pointer;transition:background-color .3s ease,opacity .3s ease;font-family:var(--body);font-stretch:125%}
  .back-pill:hover{background:#DCB673B2}

  h1.page-title{text-align:center;font-weight:500;font-size:28px;line-height:35px;letter-spacing:.04em;margin:2px 0 28px;color:#f9f9f9;font-family:var(--display)}