/* ============================================================
   BLOG STYLES — home.php + single.php
   ============================================================ */

.sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0; }

/* HERO */
.qp-blog-hero { position:relative;overflow:hidden;background-color:var(--color-surface-container-lowest);padding:8rem 0 5rem;border-bottom:1px solid rgba(65,71,84,0.25); }
.qp-blog-hero__grid { position:absolute;inset:0;background-image:linear-gradient(rgba(173,199,255,0.03) 1px,transparent 1px),linear-gradient(90deg,rgba(173,199,255,0.03) 1px,transparent 1px);background-size:48px 48px; }
.qp-blog-hero__scanline { position:absolute;inset:0;background:linear-gradient(to bottom,transparent 50%,rgba(76,227,70,0.018) 50%);background-size:100% 4px;pointer-events:none; }
.qp-blog-hero__border { position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,var(--color-primary) 40%,var(--color-secondary) 60%,transparent 100%);opacity:0.35; }
.qp-blog-hero__inner { position:relative;z-index:10; }
.qp-blog-hero__eyebrow { display:flex;align-items:center;gap:10px;margin-bottom:1.25rem;font-family:'Space Grotesk',sans-serif;font-size:11px;font-weight:700;letter-spacing:0.18em;color:var(--color-secondary);text-transform:uppercase; }
.qp-blog-hero__dot { display:inline-block;width:6px;height:6px;border-radius:50%;background-color:var(--color-secondary);flex-shrink:0; }
.qp-blog-hero__title { font-family:'Space Grotesk',sans-serif;font-size:clamp(3rem,7vw,5.5rem);font-weight:700;line-height:0.95;letter-spacing:-0.03em;color:var(--color-on-background);margin-bottom:1.5rem;text-transform:uppercase; }
.qp-blog-hero__title-accent { color:var(--color-primary); }
.qp-blog-hero__desc { font-size:1rem;color:var(--color-on-surface-variant);max-width:480px;line-height:1.75; }

/* BLOG SECTION */
.qp-blog-section { background-color:var(--color-background);padding:4rem 0 6rem; }

/* CATEGORY TABS */
.qp-blog-cats { display:flex;flex-wrap:wrap;gap:8px;margin-bottom:3rem;padding-bottom:2rem;border-bottom:1px solid rgba(65,71,84,0.2); }
.qp-blog-cat { font-family:'Space Grotesk',sans-serif;font-size:11px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:var(--color-on-surface-variant);padding:6px 16px;border:1px solid rgba(65,71,84,0.4);transition:all 0.2s ease; }
.qp-blog-cat:hover,.qp-blog-cat--active { color:var(--color-on-primary);background-color:var(--color-primary);border-color:var(--color-primary); }

/* -----------------------------------------------
   FIX 1 — Shorter featured image + full content
   FIX 2 — Gap between all cards
----------------------------------------------- */
.qp-blog-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:1.5rem;
}

.qp-post-card--featured {
    grid-column:1 / -1;
    display:grid;
    grid-template-columns:460px 1fr;
    background-color:var(--color-surface-container);
    border:1px solid rgba(65,71,84,0.15);
}

.qp-post-card--featured .qp-post-card__img-wrap {
    height:100%;
    min-height:280px;
    max-height:340px;
}

.qp-post-card--featured .qp-post-card__title { font-size:clamp(1.25rem,2vw,1.75rem); }
.qp-post-card--featured .qp-post-card__excerpt { -webkit-line-clamp:4; }

/* POST CARD */
.qp-post-card { position:relative;overflow:hidden;background-color:var(--color-surface-container);border:1px solid rgba(65,71,84,0.15);display:flex;flex-direction:column;transition:background-color 0.25s ease; }
.qp-post-card:hover { background-color:var(--color-surface-container-high); }

/* Image */
.qp-post-card__img-wrap { display:block;position:relative;overflow:hidden;height:200px;flex-shrink:0; }
.qp-post-card__img { position:absolute;inset:0;background-size:cover;background-position:center;transition:transform 0.5s ease; }
.qp-post-card:hover .qp-post-card__img { transform:scale(1.04); }
.qp-post-card__img--placeholder { background-color:var(--color-surface-container-high);display:flex;align-items:center;justify-content:center; }
.qp-post-card__img--placeholder .material-symbols-outlined { font-size:3rem;color:var(--color-outline-variant); }
.qp-post-card__img-overlay { position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,0.55) 0%,transparent 60%); }

/* Body */
.qp-post-card__body { display:flex;flex-direction:column;flex:1;padding:1.5rem 1.75rem;gap:0.75rem; }

/* Meta */
.qp-post-card__meta { display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:11px;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;color:var(--color-on-surface-variant); }
.qp-post-card__cat { background-color:rgba(173,199,255,0.1);color:var(--color-primary);padding:3px 10px;font-size:10px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;transition:background-color 0.2s ease; }
.qp-post-card__cat:hover { background-color:rgba(173,199,255,0.2); }
.qp-post-card__date,.qp-post-card__read-time { color:var(--color-on-surface-variant);font-size:11px; }

/* Title */
.qp-post-card__title { font-family:'Space Grotesk',sans-serif;font-size:1.0625rem;font-weight:700;letter-spacing:-0.01em;line-height:1.3;text-transform:uppercase;color:#93c5fd;margin:0; }
.qp-post-card__title a { color:inherit;transition:color 0.2s ease; }
.qp-post-card:hover .qp-post-card__title a { color:#fff; }

/* Excerpt */
.qp-post-card__excerpt { font-size:0.8125rem;color:rgba(255,255,255,0.65);line-height:1.75;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;flex:1; }

/* Footer */
.qp-post-card__footer { display:flex;align-items:center;justify-content:space-between;padding-top:1rem;border-top:1px solid rgba(65,71,84,0.2);margin-top:auto; }
.qp-post-card__author { display:flex;align-items:center;gap:8px;font-size:12px;color:var(--color-on-surface-variant); }
.qp-post-card__avatar { width:28px!important;height:28px!important;border-radius:50%;object-fit:cover; }
.qp-post-card__link { display:inline-flex;align-items:center;gap:4px;font-family:'Space Grotesk',sans-serif;font-size:10px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:var(--color-primary);border-bottom:1px solid var(--color-primary);padding-bottom:2px;transition:color 0.2s ease,border-color 0.2s ease; }
.qp-post-card__link .material-symbols-outlined { font-size:13px!important;transition:transform 0.2s ease; }
.qp-post-card:hover .qp-post-card__link { color:#fff;border-color:#fff; }
.qp-post-card:hover .qp-post-card__link .material-symbols-outlined { transform:translateX(3px); }
.qp-post-card__accent { position:absolute;bottom:0;left:0;width:3px;height:0;background-color:var(--color-primary);transition:height 0.3s ease; }
.qp-post-card:hover .qp-post-card__accent { height:100%; }

/* PAGINATION */
.qp-blog-pagination { margin-top:3.5rem;display:flex;justify-content:center; }
.qp-blog-pagination .nav-links { display:flex;align-items:center;gap:6px; }
.qp-blog-pagination .page-numbers { display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;font-family:'Space Grotesk',sans-serif;font-size:13px;font-weight:700;color:var(--color-on-surface-variant);border:1px solid rgba(65,71,84,0.35);transition:all 0.2s ease; }
.qp-blog-pagination .page-numbers:hover,.qp-blog-pagination .page-numbers.current { background-color:var(--color-primary);color:var(--color-on-primary);border-color:var(--color-primary); }
.qp-blog-pagination .page-numbers.prev,.qp-blog-pagination .page-numbers.next { width:auto;padding:0 14px; }

/* EMPTY */
.qp-blog-empty { text-align:center;padding:6rem 2rem;display:flex;flex-direction:column;align-items:center;gap:1rem; }
.qp-blog-empty__icon { font-size:4rem!important;color:var(--color-outline-variant); }
.qp-blog-empty h2 { font-size:1.5rem;color:var(--color-on-background); }
.qp-blog-empty p { color:var(--color-on-surface-variant);max-width:340px; }
.qp-blog-empty__btn { display:inline-flex;align-items:center;gap:6px;margin-top:1rem;font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:var(--color-primary);border-bottom:1px solid var(--color-primary);padding-bottom:3px;transition:all 0.2s ease; }
.qp-blog-empty__btn:hover { color:#fff;border-color:#fff; }

/* ============================================================
   SINGLE.PHP
   ============================================================ */
.qp-single-hero { position:relative;overflow:hidden;background-color:var(--color-surface-container-lowest);padding:6rem 0 4rem;min-height:480px;display:flex;align-items:flex-end; }
.qp-single-hero__bg { position:absolute;inset:0;background-size:cover;background-position:center; }
.qp-single-hero__overlay { position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,0.3) 0%,rgba(0,0,0,0.75) 100%); }
.qp-single-hero__grid { position:absolute;inset:0;background-image:linear-gradient(rgba(173,199,255,0.03) 1px,transparent 1px),linear-gradient(90deg,rgba(173,199,255,0.03) 1px,transparent 1px);background-size:48px 48px; }
.qp-single-hero__inner { position:relative;z-index:10;width:100%;padding-top:2rem; }
.qp-single-breadcrumb { display:flex;align-items:center;flex-wrap:wrap;gap:4px;font-size:11px;color:rgba(255,255,255,0.55);margin-bottom:1.5rem;font-weight:500;letter-spacing:0.06em; }
.qp-single-breadcrumb a { color:rgba(255,255,255,0.55);transition:color 0.2s ease; }
.qp-single-breadcrumb a:hover { color:var(--color-primary); }
.qp-single-breadcrumb .material-symbols-outlined { font-size:14px!important;opacity:0.4; }
.qp-single-cat-badge { display:inline-block;background-color:rgba(173,199,255,0.12);color:var(--color-primary);font-family:'Space Grotesk',sans-serif;font-size:10px;font-weight:700;letter-spacing:0.15em;text-transform:uppercase;padding:4px 12px;margin-bottom:1.25rem;transition:background-color 0.2s ease; }
.qp-single-cat-badge:hover { background-color:rgba(173,199,255,0.22); }
.qp-single-title { font-family:'Space Grotesk',sans-serif;font-size:clamp(1.75rem,4vw,3.25rem);font-weight:700;line-height:1.05;letter-spacing:-0.02em;color:#fff;text-transform:uppercase;max-width:820px;margin-bottom:2rem; }
.qp-single-meta { display:flex;align-items:center;gap:12px; }
.qp-single-meta__avatar { width:36px!important;height:36px!important;border-radius:50%;object-fit:cover;border:2px solid rgba(173,199,255,0.3); }
.qp-single-meta__text { display:flex;flex-direction:column;gap:2px; }
.qp-single-meta__author { font-size:13px;font-weight:600;color:#fff; }
.qp-single-meta__details { font-size:11px;color:rgba(255,255,255,0.55);letter-spacing:0.04em; }

/* LAYOUT */
.qp-single-layout { display:grid;grid-template-columns:1fr 340px;gap:4rem;padding-top:4rem;padding-bottom:5rem;align-items:start; }

/* BODY */
.qp-single-body { color:var(--color-on-surface);font-size:1rem;line-height:1.85;max-width:720px; }
.qp-single-body h2,.qp-single-body h3,.qp-single-body h4 { font-family:'Space Grotesk',sans-serif;text-transform:uppercase;color:#93c5fd;margin:2.5rem 0 1rem;letter-spacing:0.02em; }
.qp-single-body h2 { font-size:1.5rem; }
.qp-single-body h3 { font-size:1.25rem; }
.qp-single-body h4 { font-size:1.0625rem; }
.qp-single-body p { margin-bottom:1.5rem;color:rgba(229,226,225,0.85); }
.qp-single-body a { color:var(--color-primary);border-bottom:1px solid rgba(173,199,255,0.3);transition:border-color 0.2s ease; }
.qp-single-body a:hover { border-color:var(--color-primary); }
.qp-single-body ul,.qp-single-body ol { margin:0 0 1.5rem 1.5rem;color:rgba(229,226,225,0.85); }
.qp-single-body li { margin-bottom:0.5rem; }
.qp-single-body blockquote { border-left:3px solid var(--color-primary);padding:1rem 1.5rem;margin:2rem 0;background-color:var(--color-surface-container);color:var(--color-on-surface-variant);font-style:italic; }
.qp-single-body img { width:100%;height:auto;margin:2rem 0;display:block; }
.qp-single-body figure { margin:2rem 0; }
.qp-single-body figcaption { font-size:12px;color:var(--color-on-surface-variant);text-align:center;margin-top:0.5rem; }
.qp-single-body pre,.qp-single-body code { font-family:'Courier New',monospace;background-color:var(--color-surface-container-high);color:var(--color-secondary);font-size:0.875rem; }
.qp-single-body pre { padding:1.25rem;overflow-x:auto;margin:2rem 0; }
.qp-single-body code { padding:2px 6px; }

/* TAGS */
.qp-single-tags { display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:3rem;padding-top:2rem;border-top:1px solid rgba(65,71,84,0.2); }
.qp-single-tags__label { display:flex;align-items:center;gap:5px;font-size:11px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--color-on-surface-variant); }
.qp-single-tag { font-size:10px;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:var(--color-on-surface-variant);padding:4px 12px;border:1px solid rgba(65,71,84,0.4);transition:all 0.2s ease; }
.qp-single-tag:hover { color:var(--color-primary);border-color:var(--color-primary); }

/* POST NAV */
.qp-single-nav { display:grid;grid-template-columns:1fr 1fr;gap:1px;margin-top:3rem;background-color:rgba(65,71,84,0.2); }
.qp-single-nav__item { background-color:var(--color-surface-container);padding:1.5rem;display:flex;flex-direction:column;gap:6px;transition:background-color 0.2s ease; }
.qp-single-nav__item:hover { background-color:var(--color-surface-container-high); }
.qp-single-nav__item--next { text-align:right;align-items:flex-end; }
.qp-single-nav__dir { display:flex;align-items:center;gap:4px;font-size:10px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:var(--color-primary); }
.qp-single-nav__post-title { font-family:'Space Grotesk',sans-serif;font-size:0.875rem;font-weight:600;color:var(--color-on-background);line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden; }

/* SIDEBAR */
.qp-single-sidebar { display:flex;flex-direction:column;gap:1.5rem;position:sticky;top:100px; }
.qp-sidebar-card { background-color:var(--color-surface-container);padding:1.5rem;border:1px solid rgba(65,71,84,0.15); }
.qp-sidebar-card__heading { font-family:'Space Grotesk',sans-serif;font-size:11px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:var(--color-primary);margin-bottom:1.25rem;padding-bottom:0.75rem;border-bottom:1px solid rgba(65,71,84,0.2); }
.qp-sidebar-author { display:flex;gap:12px;align-items:flex-start; }
.qp-sidebar-author__avatar { width:56px!important;height:56px!important;border-radius:50%;object-fit:cover;flex-shrink:0;border:2px solid rgba(173,199,255,0.2); }
.qp-sidebar-author__name { font-family:'Space Grotesk',sans-serif;font-size:14px;font-weight:700;color:var(--color-on-background);margin-bottom:4px; }
.qp-sidebar-author__bio { font-size:12px;color:var(--color-on-surface-variant);line-height:1.6; }
.qp-sidebar-recent { list-style:none;display:flex;flex-direction:column;gap:1rem; }
.qp-sidebar-recent__item { display:flex;gap:10px;align-items:flex-start; }
.qp-sidebar-recent__thumb { width:56px;height:52px;flex-shrink:0;overflow:hidden;display:block; }
.qp-sidebar-recent__thumb img { width:100%;height:100%;object-fit:cover;transition:transform 0.3s ease; }
.qp-sidebar-recent__thumb:hover img { transform:scale(1.05); }
.qp-sidebar-recent__text { display:flex;flex-direction:column;gap:4px; }
.qp-sidebar-recent__title { font-size:12px;font-weight:600;color:var(--color-on-background);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;transition:color 0.2s ease; }
.qp-sidebar-recent__title:hover { color:var(--color-primary); }
.qp-sidebar-recent__date { font-size:10px;color:var(--color-on-surface-variant);letter-spacing:0.06em; }
.qp-sidebar-cats { list-style:none;display:flex;flex-direction:column;gap:4px; }
.qp-sidebar-cats__link { display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:var(--color-on-surface-variant);padding:7px 10px;transition:all 0.2s ease;border-left:2px solid transparent; }
.qp-sidebar-cats__link .material-symbols-outlined { font-size:15px!important;opacity:0.5; }
.qp-sidebar-cats__link:hover,.qp-sidebar-cats__link--active { color:var(--color-primary);background-color:rgba(173,199,255,0.06);border-left-color:var(--color-primary); }
.qp-sidebar-cats__count { margin-left:auto;font-size:10px;background-color:var(--color-surface-container-high);padding:2px 7px;color:var(--color-on-surface-variant); }
.qp-sidebar-cta { background-color:var(--color-surface-container-lowest);border:1px solid rgba(173,199,255,0.1);padding:1.75rem;text-align:center;display:flex;flex-direction:column;align-items:center;gap:0.75rem; }
.qp-sidebar-cta__icon { font-size:2.5rem!important;color:var(--color-primary); }
.qp-sidebar-cta__title { font-family:'Space Grotesk',sans-serif;font-size:0.9375rem;font-weight:700;color:var(--color-on-background);text-transform:uppercase;letter-spacing:0.02em; }
.qp-sidebar-cta__desc { font-size:12px;color:var(--color-on-surface-variant);line-height:1.65; }
.qp-sidebar-cta__btn { display:inline-flex;align-items:center;gap:6px;margin-top:0.5rem;background-color:var(--color-primary);color:var(--color-on-primary);font-family:'Space Grotesk',sans-serif;font-size:11px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;padding:0.75rem 1.5rem;transition:background-color 0.2s ease; }
.qp-sidebar-cta__btn:hover { background-color:var(--color-primary-container);color:#fff; }

/* RELATED */
.qp-related { background-color:var(--color-surface-container-lowest);border-top:1px solid rgba(65,71,84,0.25);padding:4rem 0; }
.qp-related__header { display:flex;align-items:center;justify-content:space-between;margin-bottom:2.5rem; }
.qp-related__title { font-family:'Space Grotesk',sans-serif;font-size:1.25rem;font-weight:700;text-transform:uppercase;letter-spacing:0.04em;color:var(--color-on-background); }
.qp-related__all-link { display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:var(--color-primary);border-bottom:1px solid var(--color-primary);padding-bottom:2px;transition:all 0.2s ease; }
.qp-related__all-link:hover { color:#fff;border-color:#fff; }
.qp-related__grid { display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem; }
.qp-related-card { position:relative;overflow:hidden;background-color:var(--color-surface-container);border:1px solid rgba(65,71,84,0.15);transition:background-color 0.25s ease; }
.qp-related-card:hover { background-color:var(--color-surface-container-high); }
.qp-related-card__img-wrap { display:block;position:relative;height:180px;overflow:hidden; }
.qp-related-card__img { position:absolute;inset:0;background-size:cover;background-position:center;transition:transform 0.5s ease; }
.qp-related-card:hover .qp-related-card__img { transform:scale(1.05); }
.qp-related-card__img--placeholder { background-color:var(--color-surface-container-high);display:flex;align-items:center;justify-content:center; }
.qp-related-card__img--placeholder .material-symbols-outlined { font-size:2.5rem;color:var(--color-outline-variant); }
.qp-related-card__overlay { position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,0.5) 0%,transparent 60%); }
.qp-related-card__body { padding:1.25rem 1.5rem 1.5rem;display:flex;flex-direction:column;gap:6px; }
.qp-related-card__cat { font-size:10px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:var(--color-primary); }
.qp-related-card__title { font-family:'Space Grotesk',sans-serif;font-size:0.9375rem;font-weight:700;text-transform:uppercase;letter-spacing:0.01em;line-height:1.3; }
.qp-related-card__title a { color:#93c5fd;transition:color 0.2s ease; }
.qp-related-card:hover .qp-related-card__title a { color:#fff; }
.qp-related-card__date { font-size:11px;color:var(--color-on-surface-variant);letter-spacing:0.04em; }
.qp-related-card__accent { position:absolute;bottom:0;left:0;width:3px;height:0;background-color:var(--color-primary);transition:height 0.3s ease; }
.qp-related-card:hover .qp-related-card__accent { height:100%; }

/* RESPONSIVE */
@media (max-width:1024px) {
    .qp-single-layout { grid-template-columns:1fr; }
    .qp-single-sidebar { position:static; }
    .qp-blog-grid { grid-template-columns:repeat(2,1fr); }
    .qp-post-card--featured { grid-template-columns:1fr; }
    .qp-post-card--featured .qp-post-card__img-wrap { height:260px;max-height:260px; }
    .qp-related__grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:640px) {
    .qp-blog-grid { grid-template-columns:1fr;gap:1rem; }
    .qp-post-card--featured { grid-template-columns:1fr; }
    .qp-related__grid { grid-template-columns:1fr; }
    .qp-single-nav { grid-template-columns:1fr; }
    .qp-blog-cats { overflow-x:auto;flex-wrap:nowrap;padding-bottom:1rem;scrollbar-width:none; }
}