/* =========================================================
      FAQ (centered accordion via <details>)
      Poprawki: container, padding, focus-within
    ========================================================= */
    .faq{
      padding: 38px 0; /* było 96px 24px — teraz padding daje .container */
      background: #ffffff;
    }

    .faq__header{
      max-width: 720px;
      margin: 0 auto 48px;
      text-align: center;
    }

    .faq__label{
      display: inline-block;
      margin-bottom: 12px;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: var(--muted);
    }

    .faq__header h2{
      margin: 0 0 16px;
      font-size: 32px;
      line-height: 1.2;
      letter-spacing: -0.01em;
      color: #243041;
    }

    .faq__card{
      padding: 24px;
      background: #f8fafc;
      border-radius: 16px;
      border: 1px solid #eef2f7;
    }

    .faq__row{
      background: #ffffff;
      border: 1px solid var(--line);
      border-radius: 12px;
      overflow: hidden;
      margin-bottom: 12px;
    }

    .faq__row:last-child{ margin-bottom: 0; }

    .faq__row > summary{
      list-style: none;
    }

    .faq__row > summary::-webkit-details-marker{
      display: none;
    }

    .faq__item{
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;

      width: 100%;
      padding: 18px 20px;

      cursor: pointer;
      user-select: none;

      background: #ffffff;
      border: 0;
      margin: 0;

      font-size: 15px;
      font-weight: 500;
      color: var(--text);
    }

    /* Focus fix: ring na całym wierszu (nie ucina się w overflow) */
    .faq__row:focus-within{
      outline: 3px solid rgba(75,91,115,.28);
      outline-offset: 3px;
    }
    .faq__item:focus-visible{ outline: none; }

    .faq__answer{
      padding: 0 20px 18px;
      border-top: 1px solid #eef2f7;
      color: var(--muted);
      font-size: 14px;
      line-height: 1.75;
    }

    .faq__icon{
      flex: 0 0 auto;
      width: 28px;
      height: 28px;
      display: grid;
      place-items: center;

      border-radius: 999px;
      border: 1px solid #e5e7eb;
      color: #64748b;
      font-size: 18px;

      transition: transform .15s ease, background-color .15s ease, border-color .15s ease;
    }

    .faq__row[open] .faq__icon{
      transform: rotate(45deg);
    }

    @media (hover:hover){
      .faq__item:hover .faq__icon{
        background: #f3f4f6;
        border-color: #e5e7eb;
      }
    }

    @media (max-width: 560px){
      .faq{ padding: 64px 0; } /* było 64px 18px */
      .faq__header h2{ font-size: 26px; }
      .faq__card{ padding: 16px; }
      .faq__item{ padding: 16px; }
    }

     /* Minimalnie: styl tylko dla tej sekcji (bazuje na Twoich tokenach i .btn/.container jeśli już istnieją) */
    .centerBottomCta{
      margin-top:40px;
      display:flex;
      justify-content:center;
    }

    @media (max-width: 560px){
      .centerBottomCta .btn{width:100%; max-width:420px;}
    }

    .brand .custom-logo-link{
  display: inline-flex;
  align-items: center;
}