/* FAQ Accordion (behaviour: [data-bel-accordion] in main.js) */
.bel-acc { display: grid; gap: 18px; }
.bel-acc__item { background: var(--bel-grey); transition: background-color .3s; }
.bel-acc__title { margin: 0; font-size: inherit; }
.bel-acc__head { display: flex; align-items: center; justify-content: space-between; gap: 20px; width: 100%; padding: 24px 30px; border: 0; background: none; color: var(--bel-heading); text-align: left; cursor: pointer; }
.bel-acc__q { font: 500 clamp(1.1rem, 1.6vw, 1.35rem)/1.4 var(--bel-font-h); }
.bel-acc__toggle { position: relative; flex: none; width: 38px; height: 38px; background: var(--bel-dark); transition: background-color .3s; }
.bel-acc__toggle::before, .bel-acc__toggle::after { content: ""; position: absolute; left: 50%; top: 50%; width: 14px; height: 2px; margin: -1px 0 0 -7px; background: #fff; transition: transform .3s var(--bel-ease); }
.bel-acc__toggle::after { transform: rotate(90deg); }
.bel-acc__item.is-open .bel-acc__toggle { background: var(--bel-accent); }
.bel-acc__item.is-open .bel-acc__toggle::before, .bel-acc__item.is-open .bel-acc__toggle::after { background: var(--bel-on-accent); }
.bel-acc__item.is-open .bel-acc__toggle::after { transform: rotate(0); }
.bel-acc__head:hover .bel-acc__q { color: var(--bel-accent); }
.bel-acc__panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .4s var(--bel-ease); }
.bel-acc__item.is-open .bel-acc__panel { grid-template-rows: 1fr; }
.bel-acc__inner { overflow: hidden; }
.bel-acc__panel p { margin: 0; padding: 0 30px 26px; max-width: 760px; }
.bel-faq-accordion .bel-heading { margin-bottom: 36px; }
.bel-faq-accordion + .bel-faq-accordion { margin-top: 60px; }
.bel-tex-light .bel-acc__item { background: #fff; }
@media (max-width: 600px) { .bel-acc__head { padding: 18px 20px; } .bel-acc__panel p { padding: 0 20px 20px; } }
