/* MVC compatibility: design source tokens; original retained in /css. */
.knowledge-crumb { display: flex; flex-wrap: wrap; gap: 12px; margin: 30px 0; font-size: var(--ayy-type-label); }
.knowledge-hero { padding: clamp(24px, 5vw, 64px); border: 1px solid var(--ayy-navy-100); border-radius: var(--ayy-radius-xl); background: linear-gradient(125deg, var(--ayy-white) 40%, var(--ayy-red-50)); margin-bottom: 32px; }
.knowledge-hero h1 { color: var(--ayy-gray-800); font-size: clamp(30px, 4vw, 52px); margin: 12px 0; }
.knowledge-hero label { display: block; margin: 28px 0 10px; font-weight: 600; }
.knowledge-hero input { width: min(100%, 620px); padding: 17px 20px; border: 1px solid var(--ayy-gray-300); border-radius: var(--ayy-radius-button); background: white; color: var(--ayy-gray-800); }
.knowledge-faq { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
.knowledge-question { border: 1px solid var(--ayy-navy-100); border-radius: var(--ayy-radius-xl); background: var(--ayy-white); overflow: hidden; }
.knowledge-question[hidden] { display: none; }
.knowledge-question[open] { border-color: var(--ayy-red-600); box-shadow: 0 10px 32px color-mix(in srgb, var(--ayy-gray-800) 3.14%, transparent); }
.knowledge-question summary { display: flex; gap: 16px; align-items: center; padding: 24px; list-style: none; font-weight: 600; cursor: pointer; color: var(--ayy-gray-800); }
.knowledge-question summary::-webkit-details-marker { display: none; }
.question-number { color: var(--ayy-red-600); font-size: var(--ayy-type-section); background: var(--ayy-red-50); border-radius: 50%; padding: 10px; }
.question-toggle { margin-left: auto; font-size: var(--ayy-type-headline); color: var(--ayy-red-600); }
.knowledge-question[open] .question-toggle { transform: rotate(45deg); }
.question-answer { padding: 0 24px 24px; line-height: 1.85; }
.question-answer a { color: var(--ayy-red-600); font-weight: 600; }
.knowledge-related { margin: 64px 0; }
.knowledge-section-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 24px; }
.knowledge-section-heading h2 { margin: 8px 0; }
.guide-steps { list-style: none; padding: 0; counter-reset: guide; }
.guide-steps li { counter-increment: guide; position: relative; padding: 26px 28px 26px 76px; margin: 16px 0; border: 1px solid var(--ayy-navy-100); border-radius: var(--ayy-radius-xl); background: var(--ayy-white); line-height: 1.85; overflow-wrap: anywhere; }
.guide-steps li::before { content: counter(guide, decimal-leading-zero); position: absolute; left: 24px; top: 28px; font-weight: 700; color: var(--ayy-red-600); }
.knowledge-links { display: flex; flex-wrap: wrap; gap: 18px; margin: 24px 0; }
@media (max-width: 700px) {
    .knowledge-faq { grid-template-columns: 1fr; }
    .knowledge-question summary { padding: 18px; }
    .knowledge-section-heading { align-items: start; flex-direction: column; }
    .guide-steps li { padding: 22px 20px 22px 60px; }
    .guide-steps li::before { left: 18px; top: 24px; }
}

.faq-page {
    padding-bottom: 32px;
}

.faq-search-card {
    min-width: 0;
}

.faq-search-card label {
    display: block;
    margin: 20px 0 8px;
    color: var(--ayy-navy-900);
    font-size: var(--ayy-type-label);
    font-weight: 600;
}

.faq-search-card input {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    padding: 14px 16px;
    border: 1px solid var(--ayy-gray-300);
    border-radius: var(--ayy-radius-md);
    background: var(--ayy-white);
    color: var(--ayy-navy-900);
}

.faq-search-card input:focus-visible {
    outline: 2px solid var(--ayy-red-600);
    outline-offset: 3px;
}

.faq-search-card .activation-ready-foot {
    margin-top: 22px;
}

#faq-questions {
    scroll-margin-top: 120px;
}

.blog-rich-content {
    line-height: 1.85;
    overflow-wrap: anywhere;
    overflow-x: auto;
}
.blog-rich-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 24px 0;
}
.blog-rich-content td,
.blog-rich-content th {
    padding: 12px;
    border: 1px solid var(--ayy-gray-300);
}
.blog-rich-content blockquote {
    margin: 24px 0;
    padding: 16px 24px;
    border-left: 3px solid var(--ayy-red-600);
    background: var(--ayy-white);
}
.blog-rich-content pre {
    white-space: pre-wrap;
}

.blog-image-card {
    display: block;
    width: 100%;
    margin: 24px 0;
    border: 1px solid var(--ayy-gray-300);
    border-radius: var(--ayy-radius-xl);
    overflow: hidden;
    background: var(--ayy-white);
}
.blog-image-heading,
.blog-image-hint {
    display: block;
    padding: 16px 20px;
    font-size: var(--ayy-type-section);
    color: var(--ayy-gray-600);
}
.blog-image-heading {
    background: var(--ayy-navy-50);
    border-bottom: 1px solid var(--ayy-gray-300);
}
.blog-image-hint {
    border-top: 1px solid var(--ayy-gray-300);
}
.blog-image-open {
    display: block;
    width: 100%;
    padding: 16px;
    border: 0;
    background: var(--ayy-white);
    cursor: zoom-in;
}
.blog-image-open img {
    display: block;
    width: 100%;
    max-height: 520px;
    object-fit: contain;
    border-radius: var(--ayy-radius-md);
}
html.blog-image-visible { overflow: hidden; }
.blog-image-dialog {
    width: min(1100px, calc(100% - 32px));
    max-height: calc(100dvh - 32px);
    padding: 52px 16px 16px;
    margin: auto;
    border: 0;
    border-radius: var(--ayy-radius-xl);
    background: var(--ayy-white);
}
.blog-image-dialog::backdrop { background: color-mix(in srgb, var(--ayy-navy-900) 73.33%, transparent); }
.blog-image-dialog img {
    display: block;
    width: 100%;
    max-height: calc(100dvh - 110px);
    object-fit: contain;
}
.blog-image-close {
    position: absolute;
    top: 10px;
    right: 14px;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 50%;
    background: var(--ayy-red-600);
    color: white;
    font-size: var(--ayy-type-headline);
    cursor: pointer;
}

.article .blog-cover-photo {
    width: 100%;
    height: auto;
    max-height: 520px;
    object-fit: contain;
    border-radius: var(--ayy-radius-lg);
}
.embedded-video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; border-radius: var(--ayy-radius-lg); background: var(--ayy-navy-950); margin: 24px 0; }

.blog-pagination{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;margin-top:40px}
.blog-pagination a,.blog-pagination>span{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:8px 14px;border:1px solid var(--ayy-border-divider);border-radius:var(--ayy-radius-md);background:var(--ayy-white);color:var(--ayy-navy-900);font-size:14px;text-decoration:none}
.blog-pagination a:hover{color:var(--ayy-red-600);border-color:var(--ayy-red-600);background:var(--ayy-red-50)}
.blog-pagination a:focus-visible{outline:2px solid var(--ayy-navy-800);outline-offset:3px}
.blog-pagination [aria-current=page]{background:var(--ayy-red-600);border-color:var(--ayy-red-600);color:var(--ayy-white);font-weight:700}
.blog-pagination [aria-disabled=true]{color:var(--ayy-text-muted);background:var(--ayy-gray-100)}
.blog-pagination .pagination-gap{padding-inline:0;min-width:16px;border:0;background:transparent}

/* FAQ search occupies the entire content width above the original accordions. */
.faq-page .faq-search-wide { width:100%; padding:clamp(24px,3vw,40px); }
.faq-search-heading { display:flex; align-items:center; gap:20px; }
.faq-search-heading .activation-symbol { flex:none; margin:0; }
.faq-page .faq-search-heading h1 { margin:0; font-size:var(--ayy-type-display); line-height:1.25; letter-spacing:-.025em; }
.faq-search-heading p { margin:8px 0 0; font-size:var(--ayy-type-body); }
@media(max-width:600px) {
 .faq-search-heading { align-items:flex-start; gap:14px; }
 .faq-page .faq-search-heading h1 { font-size:26px; }
 .faq-search-heading .activation-symbol { width:44px; height:44px; }
 .faq-search-heading .activation-symbol svg { width:28px; height:28px; }
}