/* FAQ content and interactions; shared chrome belongs to common.css. */
#main{--page:#b71f2d;--raised:#c72b39;--panel:#141414;--muted:#c7c7c7;--arrow:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22512%22%20height%3D%22512%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cg%20fill%3D%22%23FFFFFF%22%20transform%3D%22translate(256%20256)%20scale(0.46875000)%20translate(-517.4500122070312%20-511.1000061035156)%22%3E%3Cpath%20d%3D%22M782.8%20511.1%20351.9%20942c-22.8%2022.8-59.8%2022.8-82.6%200-22.8-22.8-22.8-59.8%200-82.6L617.5%20511.1%20269.2%20162.8c-22.8-22.8-22.8-59.8%200-82.6%2022.8-22.8%2059.8-22.8%2082.6%200L782.8%20511.1%20782.8%20511.1zM782.8%20511.1%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");color:#fff;background:var(--page);}
#main [hidden], #main .pagination button[hidden]{display:none;}
#main .hero{position:relative;height:260px;overflow:hidden;background:#141414;}
#main .cover{position:absolute;inset:0;background:url("../../images/faq/background.webp") center / cover no-repeat;}
#main .hero::after{position:absolute;inset:0;content:"";pointer-events:none;background:linear-gradient(180deg, rgba(20, 20, 20, 0.08), rgba(20, 20, 20, 0.2));}
#main .inner{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:16px var(--site-gutter) 20px;}
#main .breadcrumb{display:flex;align-items:center;gap:9px;color:#e4e4e4;font-size:12px;line-height:19px;}
#main .breadcrumb a, #main .breadcrumb b{color:inherit;font-weight:400;}
#main .breadcrumb a:hover, #main .breadcrumb a:focus-visible{color:#ff8993;text-decoration:underline;text-underline-offset:4px;}
#main .eyebrow{margin-top:6px;color:#e4e4e4;font-size:10px;line-height:17px;font-weight:800;letter-spacing:1.2px;}
#main .hero h1{margin:0;font-size:40px;line-height:50px;font-weight:900;letter-spacing:6px;}
#main .inner > p{margin:0;color:#e4e4e4;font-size:14px;line-height:22px;}
#main img{display:block;object-fit:contain;}
#main button{border:0;font:inherit;cursor:pointer;transition:color 0.2s ease, background-color 0.2s ease;}
#main button:focus-visible, #main a:focus-visible{outline:2px solid #fff;outline-offset:3px;}
#main .search{display:grid;grid-template-columns:24px minmax(0, 1fr) 100px;align-items:center;width:min(610px, 100%);min-height:56px;margin-top:18px;padding-left:16px;border-radius:12px;background:var(--panel);}
#main .search:focus-within{outline:2px solid #fff;outline-offset:3px;}
#main .search img{width:24px;height:24px;}
#main .search input{min-width:0;width:100%;height:50px;padding:0 12px;border:0;outline:0;color:#fff;background:transparent;font:inherit;font-size:14px;color-scheme:dark;}
#main .search input::placeholder{color:#b8b8b8;opacity:1;}
#main .search button{display:flex;align-items:center;justify-content:center;align-self:stretch;margin:5px;padding:0 12px;border-radius:9px;color:#fff;background:#d82434;font-size:14px;font-weight:800;white-space:nowrap;}
#main .search button:hover, #main .search button:focus-visible{color:#141414;background:#fff;}
#main .layout{display:grid;grid-template-columns:minmax(0, 1fr) 300px;align-items:start;gap:32px;width:calc(100% - var(--site-gutter) * 2);margin:0 auto;padding:32px 0 40px;scroll-margin-top:130px;}
#main .categories, #main .results, #main .sidebar section{min-width:0;border-radius:16px;}
#main .categories{grid-column:1 / -1;display:grid;grid-template-columns:repeat(7, minmax(0, 1fr));gap:12px;padding:28px;background:var(--raised);}
#main .categories .heading{grid-column:1 / -1;margin-bottom:8px;}
#main .heading > span{color:#f6d9dd;font-size:11px;line-height:18px;font-weight:800;letter-spacing:1px;}
#main .heading h2{margin:0;font-size:24px;line-height:32px;font-weight:900;}
#main .categories button{display:grid;grid-template-columns:26px minmax(0, 1fr) auto;align-items:center;gap:8px;width:100%;min-height:68px;padding:12px 10px;border-radius:12px;color:#fff;background:var(--panel);font-size:13px;line-height:21px;font-weight:700;text-align:left;}
#main .categories img{width:26px;height:26px;}
#main .categories em{min-width:24px;padding:2px 5px;border-radius:20px;color:#fff;background:#d82434;font-size:10px;line-height:16px;font-style:normal;text-align:center;}
#main .categories button:hover, #main .categories button:focus-visible, #main .categories button.current{color:#141414;background:#fff;}
#main .categories button:hover img, #main .categories button:focus-visible img, #main .categories button.current img{filter:brightness(0);}
#main .content{min-width:0;}
#main .results{padding:0 24px;background:var(--panel);scroll-margin-top:130px;}
#main .results .heading{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;min-height:92px;padding:20px 0;}
#main .results .heading h2{font-size:22px;line-height:30px;}
#main .results .heading > span{color:var(--muted);font-size:12px;font-weight:400;letter-spacing:0;text-align:right;}
#main .results .heading button{display:flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:10px 14px;border-radius:10px;color:#fff;background:#d82434;font-size:12px;}
#main .results .heading button:hover, #main .results .heading button:focus-visible{color:#141414;background:#fff;}
#main .results .heading button i, #main .question button b, #main .pagination .next i{display:block;width:16px;height:16px;background:currentColor;mask:var(--arrow) center / contain no-repeat;transform:rotate(90deg);}
#main .question{border-top:1px solid #383838;}
#main .question > button{display:grid;grid-template-columns:24px minmax(0, 1fr) auto 18px;align-items:center;gap:14px;width:100%;min-height:68px;padding:16px 12px;border-radius:10px;color:#fff;background:transparent;font-size:14px;line-height:24px;font-weight:600;text-align:left;}
#main .question > button:hover, #main .question > button:focus-visible, #main .question.open > button{color:#141414;background:#fff;}
#main .question > button img{width:24px;height:24px;}
#main .question > button:hover img, #main .question > button:focus-visible img, #main .question.open > button img{filter:brightness(0);}
#main .question > button em{min-width:84px;padding:3px 9px;border-radius:20px;color:#fff;background:#d82434;font-size:11px;line-height:18px;font-style:normal;text-align:center;}
#main .question > button b{justify-self:end;}
#main .question.open > button b{transform:rotate(-90deg);}
#main .answer{padding:20px 12px 24px 50px;}
#main .answer p{margin:0;color:#d0d0d0;font-size:14px;line-height:27px;overflow-wrap:anywhere;}
#main .answer a{color:#fff;text-decoration:underline;text-underline-offset:4px;}
#main .answer a:hover, #main .answer a:focus-visible{color:#ff8993;}
#main .empty{display:none;margin:0;padding:48px 20px;color:var(--muted);font-size:14px;line-height:24px;text-align:center;}
#main .empty.visible{display:block;}
#main .pagination{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;margin-top:24px;}
#main .pagination button{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:10px 14px;border-radius:10px;color:#fff;background:var(--panel);font-size:13px;line-height:24px;}
#main .pagination button.current, #main .pagination button:hover:not(:disabled), #main .pagination button:focus-visible{color:#141414;background:#fff;}
#main .pagination .next{gap:8px;}
#main .pagination .next i{transform:none;}
#main .pagination .next:disabled{opacity:0.5;cursor:default;}
#main .sidebar{display:grid;align-content:start;gap:24px;}
#main .sidebar section{padding:24px;background:var(--panel);}
#main .sidebar h2{margin:0 0 20px;font-size:20px;line-height:28px;font-weight:900;}
#main .sidebar section > div{display:flex;align-items:center;gap:14px;}
#main .sidebar img{flex:0 0 44px;width:44px;height:44px;}
#main .sidebar span{display:grid;gap:6px;}
#main .sidebar strong{font-size:16px;line-height:24px;}
#main .sidebar em{color:var(--muted);font-size:12px;line-height:20px;font-style:normal;}
#main .support > a{display:flex;align-items:center;justify-content:center;min-height:50px;margin-top:24px;padding:12px 18px;border-radius:12px;color:#fff;background:#d82434;font-size:14px;line-height:24px;font-weight:800;transition:color 0.2s ease, background-color 0.2s ease;}
#main .support > a:hover, #main .support > a:focus-visible{color:#141414;background:#fff;}
@media (max-width: 1200px){
#main .categories{grid-template-columns:repeat(4, minmax(0, 1fr));}
}
@media (max-width: 1050px){
#main .layout{grid-template-columns:minmax(0, 1fr) 270px;gap:24px;}
#main .results{padding:0 20px;}
}
@media (max-width: 820px){
#main .layout{grid-template-columns:minmax(0, 1fr);}
#main .sidebar{grid-template-columns:repeat(2, minmax(0, 1fr));}
}
@media (max-width: 720px){
#main .hero{height:260px;}
#main .inner{padding:16px var(--site-gutter) 20px;}
#main .breadcrumb{gap:6px;font-size:10px;}
#main .eyebrow{margin-top:5px;font-size:9px;}
#main .hero h1{font-size:31px;line-height:41px;letter-spacing:4px;}
#main .inner > p{font-size:12px;text-align:center;}
#main .search{grid-template-columns:22px minmax(0, 1fr) 90px;width:100%;padding-left:12px;}
#main .search img{width:22px;height:22px;}
#main .search input{padding:0 8px;font-size:16px;}
#main .layout{padding:24px 0 28px;scroll-margin-top:110px;}
#main .categories{grid-template-columns:repeat(2, minmax(0, 1fr));gap:12px;padding:20px 16px;}
#main .heading h2{font-size:21px;line-height:29px;}
#main .categories button{grid-template-columns:24px minmax(0, 1fr) auto;gap:6px;min-height:64px;padding:12px 10px;font-size:12px;}
#main .categories img{width:24px;height:24px;}
#main .results{padding:0 16px;scroll-margin-top:110px;}
#main .results .heading{grid-template-columns:auto 1fr;gap:14px;}
#main .results .heading h2{font-size:20px;line-height:28px;}
#main .results .heading button{grid-column:1 / -1;}
#main .question > button{grid-template-columns:22px minmax(0, 1fr) 14px;gap:10px;min-height:64px;padding:14px 8px;font-size:13px;line-height:23px;}
#main .question > button img{width:22px;height:22px;}
#main .question > button em{display:none;}
#main .question > button b{width:14px;height:14px;}
#main .answer{padding:18px 8px 22px;}
#main .answer p{font-size:13px;line-height:25px;}
#main .pagination{gap:6px;}
#main .pagination button{min-width:36px;padding:10px;font-size:12px;}
#main .pagination .next{gap:4px;}
#main .sidebar{grid-template-columns:minmax(0, 1fr);}
#main .sidebar section{padding:24px 16px;}
}
