/**
 * Responsive styles for HTML content entered via the WYSIWYG editor (CKEditor).
 * Applied via .rich-content wrapper and legacy .html-safe class.
 */
.rich-content,
.html-safe {
    max-width: 100%;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

.rich-content img,
.html-safe img,
.rich-content video,
.html-safe video,
.rich-content embed,
.html-safe embed,
.rich-content object,
.html-safe object {
    max-width: 100% !important;
    height: auto !important;
}

.rich-content iframe,
.html-safe iframe {
    max-width: 100% !important;
}

.rich-content iframe[src*="youtube"],
.rich-content iframe[src*="youtu.be"],
.rich-content iframe[src*="vimeo"],
.rich-content iframe[src*="dailymotion"],
.html-safe iframe[src*="youtube"],
.html-safe iframe[src*="youtu.be"],
.html-safe iframe[src*="vimeo"],
.html-safe iframe[src*="dailymotion"] {
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
}

.rich-content figure,
.html-safe figure {
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
}

.rich-content figure.image,
.rich-content figure.media,
.html-safe figure.image,
.html-safe figure.media {
    display: block;
    max-width: 100%;
}

.rich-content table,
.html-safe table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.rich-content pre,
.html-safe pre {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* FAQ section — space block from content above */
.faq-section,
.brand-faq-section {
    margin-top: 40px;
}

@media (max-width: 768px) {
    .faq-section,
    .brand-faq-section {
        margin-top: 50px;
        clear: both;
    }
}

/* FAQ accordion — full heading row is clickable */
.faq-accordion .panel-heading {
    padding: 0;
    cursor: pointer;
}

.faq-accordion .panel-title {
    margin: 0;
}

.faq-accordion .panel-title > a {
    display: block;
    padding: 10px 40px 10px 15px;
    text-decoration: none;
    position: relative;
}

.faq-accordion .panel-title > a::after {
    font-family: FontAwesome;
    content: "\f0d8";
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    line-height: 1;
}

.faq-accordion .panel-title > a.collapsed::after {
    content: "\f0d7";
}