/* Footer 10: Dark Overlay Grid — Full dark, brand top, 3 cols with thumbs */

.jpdll0 { background: var(--color-footer-bg); color: var(--color-footer-text); }

/* ── Head: brand + accent line ── */
.jpdll0__head { padding: 40px 0 0; }
.jpdll0__head .container { display: flex; flex-direction: column; gap: 24px; }
.jpdll0__brand { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; }
.jpdll0__name {
    font-size: clamp(1.6rem, 3vw, 2.4rem); font-weight: 900;
    color: var(--color-footer-heading); text-decoration: none;
    letter-spacing: -.03em; transition: opacity .2s;
}
.jpdll0__name:hover { opacity: .8; }
.jpdll0__tagline {
    font-size: .72rem; color: var(--color-footer-text);
    letter-spacing: .06em; text-transform: uppercase;
}
.jpdll0__brand .custom-logo { max-height: 44px; width: auto; }
.jpdll0__primary-line { height: 2px; background: var(--color-primary); }

/* ── Main 3-col grid ── */
.jpdll0__main { padding: 36px 0 32px; }
.jpdll0__grid { display: grid; grid-template-columns: 1fr 1.2fr 1.2fr; gap: 40px; }

.jpdll0__title {
    font-size: .62rem; font-weight: 800; text-transform: uppercase;
    letter-spacing: .14em; color: var(--color-footer-heading);
    margin-bottom: 16px; padding-bottom: 8px;
    border-bottom: 1px solid var(--color-footer-border);
}

/* Category links */
.jpdll0__links { list-style: none; }
.jpdll0__links li { padding: 5px 0; border-bottom: 1px solid var(--color-footer-border); }
.jpdll0__links a {
    color: var(--color-footer-link); font-size: .82rem;
    text-decoration: none; transition: color .2s, padding-left .2s;
    display: flex; align-items: center; gap: 6px;
}
.jpdll0__links a:hover { color: var(--color-footer-link-hover); padding-left: 6px; }

/* Posts with thumbs */
.jpdll0__posts { display: flex; flex-direction: column; gap: 0; }
.jpdll0__post {
    display: flex; gap: 10px; align-items: flex-start;
    padding: 10px 0; border-bottom: 1px solid var(--color-footer-border);
    text-decoration: none; transition: opacity .2s;
}
.jpdll0__post:last-child { border-bottom: none; }
.jpdll0__post:hover { opacity: .85; }
.jpdll0__post-img {
    flex: 0 0 56px; width: 56px; height: 42px; border-radius: 3px;
    background: var(--color-footer-border) center/cover no-repeat; flex-shrink: 0;
}
.jpdll0__post-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.jpdll0__post-title {
    font-size: .8rem; color: var(--color-footer-link); line-height: 1.4;
    transition: color .2s;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.jpdll0__post:hover .jpdll0__post-title { color: var(--color-footer-link-hover); }
.jpdll0__post time { font-size: .6rem; color: var(--color-footer-text); }

/* ── Bottom bar ── */
.jpdll0__bottom {
    border-top: 1px solid var(--color-footer-border); padding: 16px 0;
}
.jpdll0__bottom .container {
    display: flex; align-items: center; justify-content: space-between;
    flex-wrap: wrap; gap: 10px;
}
.jpdll0__bottom p { font-size: .75rem; color: var(--color-footer-text); margin: 0; }
.jpdll0__bottom a { color: var(--color-footer-link); text-decoration: none; }
.jpdll0__bottom a:hover { color: var(--color-footer-link-hover); }
.jpdll0__nav { display: flex; list-style: none; gap: 16px; margin: 0; padding: 0; }
.jpdll0__nav a { color: var(--color-footer-link); font-size: .75rem; text-decoration: none; transition: color .2s; }
.jpdll0__nav a:hover { color: var(--color-footer-link-hover); }

@media (max-width: 768px) { .jpdll0__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) {
    .jpdll0__grid { grid-template-columns: 1fr; }
    .jpdll0__bottom .container { flex-direction: column; text-align: center; }
    .jpdll0__brand { flex-direction: column; gap: 6px; }
}