/* --- Landing page shell --- */
.doc-body--landing .doc-bg {
    background-image:
        linear-gradient(
            180deg,
            color-mix(in srgb, var(--bg) 78%, transparent) 0%,
            color-mix(in srgb, var(--bg) 68%, transparent) var(--toddyi-size-100pct)
        ),
        url('../../docs-bg.webp');
}

.doc-body--landing .doc-bg::after {
    opacity: 0.14;
    background-size: var(--toddyi-size-64px) var(--toddyi-size-64px);
}


.doc-body--landing .site-header--landing {
    background: color-mix(in srgb, var(--surface) 88%, transparent);
    backdrop-filter: blur(var(--toddyi-size-12px));
    box-shadow: 0 var(--toddyi-size-1px) 0 var(--border);
}

.doc-body--landing .site-header--landing::before,
.doc-body--landing .site-header--landing::after {
    display: none;
}

.doc-body--landing .site-header--landing .site-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--toddyi-size-16px);
    max-width: var(--toddyi-size-1080px);
    padding: var(--toddyi-size-14px) var(--toddyi-size-24px);
    text-align: left;
}

.doc-body--landing .site-header__brand {
    flex-direction: row;
    align-items: center;
    gap: var(--toddyi-size-10px);
}

.doc-body--landing .site-header__org {
    font-size: var(--toddyi-size-0-78rem);
    letter-spacing: 0.14em;
    color: var(--text-muted);
}

.doc-body--landing .site-header__cta {
    display: inline-flex;
    align-items: center;
    padding: var(--toddyi-size-8px) var(--toddyi-size-16px);
    border-radius: var(--toddyi-size-99px);
    font-size: var(--toddyi-size-0-82rem);
    font-weight: 700;
    text-decoration: none;
    color: var(--text-on-dark);
    background: var(--toddyi-gradient-primary);
    box-shadow: 0 var(--toddyi-size-4px) var(--toddyi-size-14px) color-mix(in srgb, var(--toddyi-primary) 18%, transparent);
    white-space: nowrap;
    transition: transform var(--transition), box-shadow var(--transition);
}

.doc-body--landing .site-header__cta:hover {
    transform: translateY(-1px);
    box-shadow: 0 var(--toddyi-size-6px) var(--toddyi-size-18px) color-mix(in srgb, var(--toddyi-primary) 24%, transparent);
}

.doc-body--landing .lang-nav {
    background: color-mix(in srgb, var(--surface) 94%, transparent);
    border-bottom: var(--toddyi-size-1px) solid var(--border);
    box-shadow: none;
}

.doc-body--landing .box {
    padding-top: var(--toddyi-size-24px);
    padding-bottom: var(--toddyi-size-64px);
}