/* HuddleDir dynamic additions */

/* Blog post FAQ: +/- accordion in the design's dark-card style */
.hd-post-faq{margin:44px 0 10px}
.hd-post-faq h2{margin-bottom:18px}
.hd-faq-item{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-sm);margin-bottom:12px;overflow:hidden;transition:border-color .3s}
.hd-faq-item[open]{border-color:var(--cyan)}
.hd-faq-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 22px;font-family:var(--font-ui);font-size:18px;color:var(--white)}
.hd-faq-item summary::-webkit-details-marker{display:none}
.hd-faq-item summary i{position:relative;flex:none;width:30px;height:30px;border-radius:50%;background:rgba(26,190,220,.14)}
.hd-faq-item summary i::before,.hd-faq-item summary i::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;background:var(--cyan);transform:translate(-50%,-50%);transition:transform .35s var(--ease)}
.hd-faq-item summary i::after{transform:translate(-50%,-50%) rotate(90deg)}
.hd-faq-item[open] summary i::after{transform:translate(-50%,-50%) rotate(0)}
.hd-faq-a{padding:0 22px 18px;color:var(--text)}
.hd-faq-a p{margin:0 0 10px}

/* Footer: latest articles in place of the newsletter */
.hd-foot-posts{list-style:none;margin:0 0 6px;padding:0;display:grid;gap:10px}
.hd-foot-posts a{color:var(--text)}
.hd-foot-posts a:hover{color:var(--cyan)}

/* Website screenshots show the top of the page */
.shot-img{object-position:top center}

/* Article search on blog pages */
.hd-blog-search{display:flex;gap:10px;max-width:520px;margin:0 0 40px}
.hd-blog-search input[type=search]{flex:1;min-width:0;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:12px 20px;color:var(--white);font:inherit}