/* Loaded after built/screen.css — keeps layout working if gulp hasn't been run */

/* ── Hero ── */
.help-hero {
    background-color: #1A1A1A;
}

.help-hero-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.875rem;
}

.help-hero-app-logo {
    display: inline-flex;
    line-height: 0;
}

.help-hero-app-logo img {
    width: min(40vmin, 180px);
    height: auto;
    opacity: 0.88;
    transition: opacity 0.2s ease;
}

.help-hero-app-logo:hover img {
    opacity: 1;
}

.help-hero-title {
    margin-bottom: 0;
}

/* ── Body & Background ── */
body,
.site-content {
    background-color: #000000;
}

/* ── Header ── */
#gh-head {
    border-bottom: none !important;
}

.gh-head-brand {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 16px;
}

/* Desktop header layout */
@media (min-width: 768px) {
    #gh-head .gh-head-inner {
        display: flex;
        align-items: center;
        gap: 24px;
        width: 100%;
    }

    .gh-head-brand {
        flex: 0 0 auto;
        width: auto;
    }

    .gh-head-menu {
        flex: 0 0 auto;
        margin-left: auto;
    }
}

/* ── Nav links ── */
.gh-head-menu .gh-head-nav-kizzy a {
    color: #8562fe;
    transition: color 0.2s ease;
}

#gh-head .gh-head-nav-kizzy a:hover {
    color: #6a4ecb !important;
    opacity: 1 !important;
}

.gh-head-menu .gh-head-nav-kizzy .nav-current a {
    color: #6a4ecb;
}

.gh-head-menu .gh-head-nav-kizzy .nav-current a::after {
    background: #8562fe;
}

/* ── Mobile menu ── */
@media (max-width: 767px) {
    .gh-head-open #gh-head {
        background-color: #000000 !important;
    }

    .gh-head-open #gh-head .gh-head-menu,
    .gh-head-open.has-cover #gh-head,
    html.dark-mode .gh-head-open #gh-head,
    html.dark-mode .gh-head-open #gh-head .gh-head-menu,
    html.auto-color .gh-head-open #gh-head,
    html.auto-color .gh-head-open #gh-head .gh-head-menu {
        background-color: #000000 !important;
    }

    .gh-head-open #gh-head .gh-burger::before,
    .gh-head-open #gh-head .gh-burger::after {
        background-color: #8562fe !important;
    }

    .gh-head-open #gh-head .gh-burger {
        position: fixed;
        top: 17px;
        right: 20px;
        left: auto;
        z-index: 4000000;
    }

    .gh-head-open #gh-head .gh-head-logo {
        display: none;
    }

    .gh-head-open #gh-head .gh-head-inner {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: 100%;
    }

    .gh-head-open #gh-head .gh-head-menu {
        width: 100%;
        display: flex;
        justify-content: center;
    }

    .gh-head-open #gh-head .nav {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        text-align: center;
    }
}

/* ── Footer ── */
.site-footer {
    background-color: #1A1A1A;
}

.site-footer .inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-6);
    text-align: center;
}

.site-footer-brand {
    justify-content: center;
}

.site-footer-app-logo img {
    max-height: 32px;
    width: auto;
    opacity: 0.78;
    transition: opacity 0.2s ease;
}

.site-footer-app-logo:hover img {
    opacity: 0.95;
}

.site-footer-links {
    justify-content: center;
}

.site-footer-link,
.site-footer-link span {
    font-size: 1.25rem !important;
}

@media (max-width: 767px) {
    .site-footer-brand {
        flex-direction: column;
        gap: var(--space-2);
    }
}

/* ── Post cards ── */
.post-card {
    background: #1A1A1A;
}

.post-card-excerpt {
    font-size: 1.125rem;
}

.post-card-meta,
.post-card-meta * {
    font-size: 1rem !important;
    color: #ffffff !important;
}

.post-card .footer-cta-button,
.post-card form {
    display: none;
}

/* Read more strip */
.read-more-wrap .read-more {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: clamp(16px, 4vmin, 40px);
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

.read-more-wrap .read-more .post-card {
    flex: 1 1 min(100%, 340px);
    max-width: 380px;
}

.post-template .read-more .post-card-content,
.post-template .read-more .post-card-header {
    text-align: center;
}

.post-template .read-more .post-card-meta {
    justify-content: center;
}

/* ── Article body ── */
.post-template .gh-content > blockquote:not([class]),
.post-template .gh-content > ol,
.post-template .gh-content > ul,
.post-template .gh-content > dl,
.post-template .gh-content > p,
.page-template .gh-content > blockquote:not([class]),
.page-template .gh-content > ol,
.page-template .gh-content > ul,
.page-template .gh-content > dl,
.page-template .gh-content > p {
    font-size: 1.375rem;
    line-height: 1.72;
}

.post-template .gh-content h2,
.page-template .gh-content h2 {
    font-size: 2.125rem;
}

.post-template .gh-content h3,
.page-template .gh-content h3 {
    font-size: 1.75rem;
}

.post-template .gh-content .kg-callout-card .kg-callout-text,
.post-template .gh-content .kg-toggle-card .kg-toggle-content > ol,
.post-template .gh-content .kg-toggle-card .kg-toggle-content > ul,
.post-template .gh-content .kg-toggle-card .kg-toggle-content > p,
.page-template .gh-content .kg-callout-card .kg-callout-text,
.page-template .gh-content .kg-toggle-card .kg-toggle-content > ol,
.page-template .gh-content .kg-toggle-card .kg-toggle-content > ul,
.page-template .gh-content .kg-toggle-card .kg-toggle-content > p {
    font-size: 1.375rem;
    line-height: 1.72;
}

.post-template .gh-content .kg-product-card .kg-product-card-description > p,
.post-template .gh-content .kg-product-card .kg-product-card-description > ol,
.post-template .gh-content .kg-product-card .kg-product-card-description > ul,
.page-template .gh-content .kg-product-card .kg-product-card-description > p,
.page-template .gh-content .kg-product-card .kg-product-card-description > ol,
.page-template .gh-content .kg-product-card .kg-product-card-description > ul {
    font-size: 1.3125rem;
    line-height: 1.72;
}

.gh-content > blockquote:not([class]),
.gh-content > ol,
.gh-content > ul,
.gh-content > dl,
.gh-content > p {
    color: #ffffff;
}

.post-content,
.gh-content,
.article-content,
.post-full-content {
    color: #ffffff;
}

.gh-content > ul,
.gh-content > ol,
.gh-content > ul li,
.gh-content > ol li {
    font-size: 1.375rem;
    line-height: 1.72;
}

.gh-content > blockquote:not([class])::before {
    display: none;
}

.gh-canvas .article-image {
    grid-column: main-start / main-end;
}

.gh-canvas .article-image img {
    max-width: 100%;
    height: auto;
}

/* ── Byline ── */
.post-template .article-byline-meta,
.page-template .article-byline-meta {
    font-size: var(--text-base);
}

.post-template .article-byline-meta .author-name,
.page-template .article-byline-meta .author-name {
    font-size: var(--text-lg);
}

.article-byline-meta,
.byline-meta-content {
    color: #ffffff;
    font-size: 1.125rem;
}

/* ── Signup ── */
.article-signup {
    margin-top: 3rem;
    padding-top: 2rem;
}

.article-signup-text {
    font-size: 1.5rem !important;
    color: #ffffff !important;
    margin-bottom: 0.75rem;
}

.article-signup-btn {
    font-size: 1.5rem !important;
    color: #8562fe !important;
}

.footer-cta-title {
    font-size: 1.75rem;
}

.footer-cta-button {
    font-size: 1.125rem;
}

.footer-cta-button span {
    font-size: 1.125rem;
}

/* ── Ghost portal ── */
#ghost-portal-root,
.gh-portal-triggerbtn-wrapper {
    display: none !important;
}


@media (max-width: 767px) {
    #gh-head .gh-head-brand {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        width: 100% !important;
    }

    #gh-head .gh-head-brand .gh-burger {
        margin-left: auto !important;
        margin-right: 0 !important;
    }
}

@media (max-width: 767px) {
    #gh-head .gh-head-brand .gh-burger {
        position: fixed !important;
        top: 17px;
        right: 20px;
        left: auto;
        margin: 0 !important;
        z-index: 4000000;
    }
}

.help-hero {
    padding: 3vmin 0;
}

.post-card-excerpt {
    -webkit-line-clamp: 3;
    line-clamp: 3;
    overflow: hidden;
    background: none !important;
    -webkit-mask-image: none !important;
    mask-image: none !important;
}