/* wp.css — WordPress-specific layer for the Pennington 2026 blog theme.
   Loads AFTER pp.css (the verbatim design system). Everything here is either
   (a) a WP construct the mockup didn't have (widgets, comments, pagination,
   legacy post content) or (b) one of Ryan's blog-page corrections
   (compact chips with icons, slim signup bar, footer face, no-orphan rules). */

/* ---------- page head (articles lead; no form up here) ---------- */
.pp-home-head{background:var(--bone); padding:clamp(28px,4vw,44px) 0}
.pp-home-head h1{font-size:clamp(1.9rem,3.6vw,2.8rem); margin:0; text-wrap:balance}
.pp-archive-head .pp-archive-desc{max-width:56em; margin-top:10px}
.pp-featured-wrap{padding-top:clamp(20px,3vw,32px)}
.pp-featured-wrap.section.tight{padding-bottom:0}
.pp-featured-dek{color:#F3E4E6}
.pp-latest-head{margin-bottom:8px}
.pp-latest-head h2{font-size:1.7rem}

/* ---------- category chips (design .cat-chip) — WP extras only ---------- */
.pp-chips-wrap.section.tight{padding:clamp(16px,2.5vw,26px) 0}
.pp-chips-under{margin-top:22px}
.cat-chip.active{background:var(--ink); border-color:var(--ink); color:#fff}
.cat-chip.active .n,.cat-chip.active .icon{color:#fff}

/* ---------- article cards ---------- */
.post-card h3{text-wrap:balance}

/* ---------- sidebar ---------- */
.pp-side .card{padding:20px}
.pp-side .signup-card{background:var(--ink); color:#fff; border:0}
.pp-side .signup-card h3{color:#fff}
.pp-side .signup-card p{color:#D9D2C6}
.pp-side .signup-card input{border-color:transparent}
.pp-signup{display:flex; gap:8px}
.pp-signup input[type=email],.pp-signup input[type=search]{flex:1; min-width:0}
.pp-cat-list{list-style:none; margin:0; padding:0}
.pp-cat-list a{display:flex; align-items:center; gap:10px; padding:9px 2px; border-top:1px solid var(--line); color:var(--ink); font-weight:600; font-size:.95rem; text-decoration:none}
.pp-cat-list li:first-child a{border-top:0}
.pp-cat-list a .icon{color:var(--c,var(--maroon)); width:1.1em; height:1.1em}
.pp-cat-list a span{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.pp-cat-list a b{margin-left:auto; color:var(--muted); font-weight:600; font-variant-numeric:tabular-nums}
.pp-cat-list a:hover span{color:var(--maroon)}
.pp-author-card p{margin:12px 0 0}

/* existing widgets (north/south areas) restyled as cards */
.pp-side .widget{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:20px; box-shadow:0 1px 2px rgba(26,26,26,.04); font-size:.95rem; overflow-wrap:anywhere}
.pp-side .widget .widget-title,.pp-side .widget h3{margin:0 0 10px; font-size:1.05rem; font-family:var(--font-display)}
.pp-side .widget ul{list-style:none; margin:0; padding:0}
.pp-side .widget li{padding:6px 0; border-top:1px solid var(--line)}
.pp-side .widget li:first-child{border-top:0}
.pp-side .widget li li{border:0; padding:3px 0 3px 14px}
.pp-side .widget img{max-width:100%; height:auto}
.pp-side .widget_tag_cloud a{display:inline-block; margin:0 6px 6px 0; padding:.25em .7em; border:1px solid var(--line-2); border-radius:999px; font-size:.85rem !important; color:var(--ink-2)}
.pp-side .widget_tag_cloud a:hover{border-color:var(--ink); text-decoration:none}

/* ---------- slim one-line signup bar after the grid (design .signup-bar) ---------- */
.signup-bar{margin:0 0 clamp(36px,5vw,64px)}
.signup-bar b{margin-bottom:2px}

/* ---------- single post ---------- */
.pp-single-layout{padding-bottom:56px}
.post-head h1{text-wrap:balance; max-width:26ch}
.pp-byline-link{color:var(--ink)}
.crumbs{padding-top:18px}
.pp-article{min-width:0}
.pp-article img{max-width:100%; height:auto}
.pp-article iframe{max-width:100%}
.pp-article table{max-width:100%; display:block; overflow-x:auto; border-collapse:collapse}
.pp-article td,.pp-article th{border:1px solid var(--line); padding:8px 10px}
.pp-article .wp-caption{max-width:100%}
.pp-article .wp-caption-text{font-size:.86rem; color:var(--muted); margin-top:6px}
.pp-article .alignleft{float:left; margin:6px 22px 12px 0; max-width:50%}
.pp-article .alignright{float:right; margin:6px 0 12px 22px; max-width:50%}
.pp-article .aligncenter{display:block; margin:16px auto}
.pp-article h1{font-size:1.9rem} /* legacy posts sometimes use h1 in content */
.pp-article a{overflow-wrap:anywhere}
.pp-faq-head,.pp-related-head{font-size:1.5rem; margin-top:2em}
.pp-cta-download h3{text-wrap:balance}
.cta-product img{width:150px; height:auto}
.pp-pagelinks{margin:20px 0; font-weight:600}
.pp-postnavi{display:flex; justify-content:space-between; gap:18px; margin:40px 0 8px; padding-top:20px; border-top:1px solid var(--line); font-weight:600}
.pp-postnavi a{color:var(--ink-2); display:inline-flex; align-items:center; gap:8px}
.pp-postnavi a:hover{color:var(--maroon); text-decoration:none}
.pp-postnavi .next{text-align:right; margin-left:auto}

/* appended blocks must clear the floated images legacy posts end with */
.pp-article .cta-download,.pp-article .cta-product,.pp-article .faq,.pp-faq-head,
.pp-article .author-box,.pp-related-head,.pp-article .related,.pp-comments,.pp-postnavi{clear:both}

/* legacy inline junk: MailChimp leftovers etc. keep readable */
.pp-article .mc4wp-form,.pp-article .mc4wp-form-fields{margin:20px 0}
.pp-article input[type=submit]{background:var(--maroon); color:#fff; border:0; border-radius:999px; padding:.7em 1.3em; font-weight:700; cursor:pointer}

/* ---------- comments ---------- */
.pp-comments{margin:44px 0 0; border-top:1px solid var(--line); padding-top:28px}
.pp-comments-head{font-size:1.4rem}
.pp-comment-list{list-style:none; margin:0; padding:0}
.pp-comment-list .comment-body{border:1px solid var(--line); border-radius:var(--radius); background:#fff; padding:16px 18px; margin:0 0 14px}
.pp-comment-list .children{list-style:none; margin:0; padding-left:clamp(14px,4vw,34px)}
.pp-comment-list .comment-meta{display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-size:.88rem; color:var(--muted); margin-bottom:8px}
.pp-comment-list .avatar{width:44px; height:44px; border-width:2px}
.pp-comment-list .comment-content{font-size:1rem}
.pp-comment-list .reply a{font-size:.88rem; font-weight:600}
.comment-respond{margin-top:24px}
.comment-respond label{display:block; font-weight:600; margin:12px 0 4px}
.comment-respond input[type=text],.comment-respond input[type=email],.comment-respond input[type=url],.comment-respond textarea{width:100%}
.comment-respond .form-submit{margin-top:14px}

/* ---------- pagination ---------- */
.pp-pagination{margin:26px 0 6px}
.pp-pagination ul{list-style:none; display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0}
.pp-pagination a,.pp-pagination span.page-numbers{display:inline-flex; align-items:center; gap:6px; min-width:40px; justify-content:center; padding:.5em .8em; border:1.5px solid var(--line-2); border-radius:999px; font-weight:600; color:var(--ink); text-decoration:none; white-space:nowrap}
.pp-pagination span.current{background:var(--ink); color:#fff; border-color:var(--ink)}
.pp-pagination a:hover{border-color:var(--ink)}
.pp-pagination .dots{border:0}

/* ---------- header: search bar + free-assessments button ---------- */
.pp-searchbar{border-top:1px solid var(--line); background:#fff}
.pp-searchbar form{display:flex; align-items:center; gap:10px; padding:12px 0}
.pp-searchbar input[type=search]{flex:1; min-width:0}
.pp-searchbar .icon{color:var(--muted)}
.pp-free-btn{white-space:nowrap}
@media (max-width:1060px){
	.header-actions .pp-free-btn{display:none} /* pp.css hides .header-actions .btn too; explicit here */
}

/* ---------- search-again / 404 ---------- */
.pp-search-again{display:flex; gap:10px; max-width:560px; margin-top:16px}
.pp-search-again input{flex:1; min-width:0}
.pp-404{text-align:left; padding:12px 0 4px}
.pp-404-chips{margin:22px 0 26px}

/* ---------- typography guards: buttons/list items never wrap; no stretch --- */
.btn{white-space:nowrap}
img{max-width:100%; height:auto}
.logo img{height:var(--h); width:auto} /* logo sized by height only, never stretched */

/* ---------- mock-note never exists here; keep fancybox modal above header --- */
.fancybox-overlay{z-index:9990}
.fancybox-opened{z-index:9991}
