/* =========================================================================
   PrinterDojo — Enhancements & fixes (loaded AFTER theme.css).
   Fixes template<->CSS class mismatches (single__*, post-nav, trust-band__*,
   site-footer__*, author avatar) and polishes hero, cards, featured image,
   author box, prev/next. Uses the theme's existing design tokens.
   ========================================================================= */

/* ---- 1. HERO: background image must cover the whole section, never repeat ---- */
.hero { min-height: clamp(520px, 72vh, 760px); display: flex; align-items: center; }
.hero__image {
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}
.hero__inner { max-width: var(--container-wide); }   /* wide, left-aligned hero (matches reference) */
@media (max-width: 640px){ .hero { min-height: 78vh; } }

/* ---- 2. EXPLORE BY TOPIC: category card title + count ---- */
/* Anchor title+count to the bottom over a strong scrim so text is readable on ANY image
   (some printer photos are light). Template has no __body wrapper, so lay out the <a> itself. */
.category-card {
  aspect-ratio: 3 / 2; display: flex; flex-direction: column;
  justify-content: flex-end; padding: var(--space-lg); gap: .6rem;
}
.category-card__media::after {
  background: linear-gradient(180deg, rgba(11,15,21,.15) 0%, rgba(11,15,21,.30) 42%, rgba(11,15,21,.9) 100%);
}
.category-card__title {
  position: relative; z-index: 1; margin: 0;
  font-family: var(--font-heading); font-weight: 800;
  font-size: var(--step-2); line-height: 1.1; color: #fff;
  text-shadow: 0 2px 16px rgba(0,0,0,.6); letter-spacing: -0.01em;
}
.category-card__count {
  position: relative; z-index: 1; align-self: flex-start;
  display: inline-flex; align-items: center; gap: .35rem; margin: 0;
  padding: .28rem .75rem; border-radius: var(--radius-pill);
  background: rgba(255,255,255,.18); backdrop-filter: blur(6px);
  border: 1px solid rgba(255,255,255,.35);
  font-size: var(--step--1); font-weight: 700; color: #fff; letter-spacing: .01em;
}

/* ---- 3. WHY TRUST US (trust band) — proper 2-column layout ---- */
.section.trust-band { display: block; }          /* neutralize grid-on-section */
.trust-band__inner {
  display: grid; grid-template-columns: minmax(0,0.95fr) minmax(0,1.05fr);
  gap: var(--space-2xl); align-items: center;
}
.trust-band__lead .section__title { margin-top: .4rem; max-width: 16ch; }
.trust-band__author {
  display: flex; align-items: center; gap: 1rem; margin-top: var(--space-lg);
  padding: .85rem 1.1rem .85rem .85rem; background: var(--bg-elevated);
  border: 1px solid var(--border); border-radius: var(--radius-pill);
  box-shadow: var(--shadow-xs); width: max-content; max-width: 100%;
}
.trust-band__author .author-box__ring {
  width: 60px; height: 60px; flex: 0 0 auto; padding: 3px; border-radius: 50%;
  background: var(--grad-brand); display: block; position: relative;
}
.trust-band__author .author-box__ring::after { content: none; }
.trust-band__author .author-box__avatar,
.trust-band__author img {
  width: 100%; height: 100%; border-radius: 50%; object-fit: cover;
  border: 2px solid var(--bg-elevated); display: block;
}
.trust-band__author-name { display: block; font-family: var(--font-heading); font-weight: 800; color: var(--neutral-900); line-height: 1.2; }
.trust-band__author-role { display: block; margin-top: .1rem; font-size: var(--step--1); font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--primary-700); }
.trust-band__props { display: grid; gap: var(--space-md); list-style: none; margin: 0; padding: 0; }
.trust-band__props .value-prop {
  display: grid; grid-template-columns: auto 1fr; column-gap: 1rem; row-gap: .2rem; align-items: start;
  padding: var(--space-md) var(--space-lg);
}
.trust-band__props .value-prop__icon { grid-column: 1; grid-row: 1 / span 2; align-self: start; margin: 0; width: 44px; height: 44px; font-size: 1.25rem; }
.trust-band__props .value-prop h3 { grid-column: 2; grid-row: 1; font-family: var(--font-heading); font-size: var(--step-0); margin: 0; color: var(--neutral-900); }
.trust-band__props .value-prop p { grid-column: 2; grid-row: 2; margin: 0; color: var(--text-soft); font-size: var(--step--1); line-height: 1.5; }
@media (max-width: 860px){
  .trust-band__inner { grid-template-columns: 1fr; gap: var(--space-xl); }
  .trust-band__author { margin-inline: 0; }
}

/* ---- 4. FOOTER — real multi-column layout (template uses site-footer__cols) ---- */
.site-footer__cols {
  display: grid; grid-template-columns: 1.7fr 1fr 1.3fr 1.4fr;
  gap: var(--space-xl) var(--space-2xl); align-items: start;
}
.site-footer__brand .brand__logo { display: inline-flex; align-items: center; gap: .5rem; font-family: var(--font-heading); font-weight: 800; font-size: var(--step-2); color: #fff; text-decoration: none; }
.site-footer__brand .brand__mark { width: 26px; height: 26px; border-radius: 8px; background: var(--grad-brand); display: inline-block; }
.footer__col-title {
  color: #fff; font-family: var(--font-heading); font-weight: 700;
  font-size: var(--step-0); margin: 0 0 1rem; letter-spacing: .01em;
}
.site-footer__col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.site-footer__col li, .site-footer__col ul li { list-style: none; margin: 0 0 .6rem; }
.site-footer__col li::marker { content: none; }
.site-footer__col li:last-child { margin-bottom: 0; }
.site-footer__col a { color: rgba(255,255,255,.72); font-size: var(--step--1); transition: color var(--dur-1) var(--ease-out); }
.site-footer__col a:hover { color: #fff; }
.site-footer__col .menu--footer { grid-template-columns: 1fr 1fr; gap: .6rem 1.25rem; } /* 11 legal links in 2 columns */
/* Footer subscribe: a distinct signup card with a stacked field + full-width brand button */
.site-footer__newsletter {
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.12); border-radius: var(--radius-lg);
  padding: var(--space-lg); position: relative; overflow: hidden;
}
.site-footer__newsletter::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 3px; background: var(--grad-brand);
}
.site-footer__newsletter .footer__col-title { margin-bottom: .35rem; }
.site-footer__newsletter p { color: rgba(255,255,255,.68); font-size: var(--step--1); margin: 0 0 1rem; line-height: 1.5; }
.site-footer__newsletter .newsletter__form {
  display: grid; grid-template-columns: 1fr; gap: .6rem; margin: 0; padding: 0;
  background: transparent; border: 0; border-radius: 0; max-width: none; margin-inline: 0; justify-content: stretch;
}
.site-footer__newsletter .newsletter__form input {
  flex: none; width: 100%; min-width: 0; padding: .8rem 1rem; font-size: var(--step--1);
  color: #fff; background: rgba(0,0,0,.25); border: 1px solid rgba(255,255,255,.2);
  border-radius: var(--radius-md); transition: border-color var(--dur-1), box-shadow var(--dur-1), background var(--dur-1);
}
.site-footer__newsletter .newsletter__form input::placeholder { color: rgba(255,255,255,.5); }
.site-footer__newsletter .newsletter__form input:focus {
  outline: none; background: rgba(0,0,0,.35); border-color: var(--brand-accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-accent) 32%, transparent);
}
.site-footer__newsletter .newsletter__form .btn {
  width: 100%; justify-content: center; gap: .4rem; padding: .8rem 1rem;
  background: var(--grad-brand); color: #fff; border: 0; border-radius: var(--radius-md);
  font-family: var(--font-heading); font-weight: 700; letter-spacing: .01em;
  box-shadow: 0 6px 18px color-mix(in srgb, var(--brand-primary) 40%, transparent);
}
.site-footer__newsletter .newsletter__form .btn:hover { filter: brightness(1.08); transform: translateY(-1px); background: var(--grad-brand); color: #fff; }
.site-footer__newsletter .newsletter__note { display: block; margin-top: .7rem; font-size: var(--step--2); color: rgba(255,255,255,.45); }
.site-footer__bar { margin-top: var(--space-2xl); padding-top: var(--space-lg); border-top: 1px solid rgba(255,255,255,.14); }
.site-footer__bar-inner { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; }
.site-footer__copy { margin: 0; font-size: var(--step--1); color: rgba(255,255,255,.6); }
.site-footer__legal { display: flex; flex-wrap: wrap; gap: 1.25rem; }
.site-footer__legal a { font-size: var(--step--1); color: rgba(255,255,255,.6); }
.site-footer__legal a:hover { color: #fff; }
@media (max-width: 900px){ .site-footer__cols { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px){
  .site-footer__cols { grid-template-columns: 1fr; }
  .site-footer__col .menu--footer { grid-template-columns: 1fr 1fr; }
  .site-footer__bar-inner { flex-direction: column; align-items: flex-start; }
}

/* ---- 6 & 7. SINGLE POST: title section, meta, featured image ---- */
.single__head { padding-top: var(--space-2xl); }
/* Widen the title area (was the 760px reading measure) to the full content container. */
.single__head .wrap--narrow { max-width: var(--container); }
.single__head .breadcrumbs { margin-bottom: .9rem; }
.single__title {
  font-family: var(--font-heading); font-weight: 800; letter-spacing: -0.02em;
  font-size: var(--step-5); line-height: 1.08; margin: .5rem 0 0; color: var(--neutral-900);
}
.single__meta {
  display: flex; align-items: center; flex-wrap: wrap; gap: .5rem .7rem;
  margin-top: 1.4rem; color: var(--text-muted); font-size: var(--step--1);
}
.single__meta .author-box__ring--sm {
  width: 40px; height: 40px; flex: 0 0 auto; padding: 2px; border-radius: 50%;
  background: var(--grad-brand); display: inline-grid; place-items: center;
}
.single__meta .author-box__ring--sm img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; border: 2px solid var(--bg); display: block; }
.single__byline { font-weight: 500; }
.single__byline a { color: var(--primary-700); font-weight: 700; text-decoration: none; }
.single__byline a:hover { text-decoration: underline; }

.single__hero {
  max-width: var(--container); margin: var(--space-xl) auto 0;
  padding-inline: var(--gutter);
}
.single__hero .tt-cover, .single__hero img {
  width: 100%; aspect-ratio: 16 / 9; object-fit: cover;
  border-radius: var(--radius-xl); box-shadow: var(--shadow-md); display: block;
}

/* Two-column reading layout: sticky TOC + content */
.single__layout {
  display: grid; grid-template-columns: 250px minmax(0, 1fr);
  gap: var(--space-2xl); margin-top: var(--space-2xl); align-items: start;
}
.single__toc-col { position: sticky; top: 96px; }
.single__content-col { min-width: 0; }
.single__content-col .entry-content > * { max-width: 100%; margin-inline: 0; } /* fill the content column */
.single__content-col .entry-content { max-width: 74ch; }
.single__tags { margin-top: var(--space-xl); display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.single__tags .tag-label { font-weight: 700; color: var(--neutral-800); margin-right: .25rem; }
@media (max-width: 1024px){
  .single__layout { grid-template-columns: 1fr; }
  .single__toc-col { display: none; }
}

/* ---- 7. Remove figcaptions from all posts (featured + in-content) ---- */
.entry-content figcaption,
.single__hero figcaption,
.inline-figure figcaption,
figure.wp-block-image figcaption { display: none !important; }

/* ---- 8. AUTHOR BOX — fix avatar (wrapper + ring + image), polish ---- */
.author-box { grid-template-columns: auto 1fr; gap: var(--space-xl); }
.author-box__avatar {
  position: relative; width: 116px; height: 116px; flex: 0 0 auto;
  border-radius: 50%; background: transparent; padding: 0; border: 0;
}
.author-box__avatar .author-box__ring {
  position: absolute; inset: 0; border-radius: 50%;
  background: var(--grad-brand); padding: 3px; z-index: 0;
}
.author-box__img {
  position: relative; z-index: 1; width: 116px; height: 116px;
  border-radius: 50%; object-fit: cover; border: 3px solid var(--bg-elevated);
  display: block; background: var(--neutral-100);
}
.author-box__link { display: inline-flex; align-items: center; gap: .3rem; font-weight: 700; color: var(--primary-700); text-decoration: none; }
.author-box__link:hover { color: var(--primary-800); text-decoration: underline; }
@media (max-width: 560px){
  .author-box { grid-template-columns: 1fr; text-align: center; }
  .author-box__avatar { margin-inline: auto; }
  .author-box__meta { justify-content: center; }
  .author-box__bio { text-align: left; }
}

/* ---- 9. PREVIOUS / NEXT posts ---- */
.post-nav {
  display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-md);
  margin-block: var(--space-2xl);
}
.post-nav__link {
  display: flex; flex-direction: column; gap: .35rem; padding: var(--space-md) var(--space-lg);
  background: var(--bg-elevated); border: 1px solid var(--border);
  border-radius: var(--radius-lg); text-decoration: none;
  transition: transform var(--dur-2) var(--ease-out), box-shadow var(--dur-2) var(--ease-out), border-color var(--dur-2) var(--ease-out);
}
.post-nav__link:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: var(--primary-300); }
.post-nav__prev { align-items: flex-start; text-align: left; }
.post-nav__next { align-items: flex-end; text-align: right; grid-column: 2; }
.post-nav__dir { font-size: var(--step--1); font-weight: 700; color: var(--primary-700); text-transform: uppercase; letter-spacing: .04em; }
.post-nav__t { font-family: var(--font-heading); font-weight: 700; color: var(--neutral-900); line-height: 1.25; }
.post-nav__link:hover .post-nav__t { color: var(--primary-700); }
@media (max-width: 640px){
  .post-nav { grid-template-columns: 1fr; }
  .post-nav__next { grid-column: 1; align-items: flex-start; text-align: left; }
}

/* =========================================================================
   CONTACT PAGE + premium contact form
   ========================================================================= */
.pd-contact-page .page-article__head .wrap--narrow,
.pd-contact-page .wrap--narrow { max-width: var(--container); }
.pd-contact-page .entry-content { max-width: none; }
.pd-contact-page .entry-content > * { max-width: 100%; margin-inline: 0; }

.pd-contact-intro { font-size: var(--step-1); line-height: 1.6; color: var(--text-soft); max-width: 60ch; }

.pd-contact-grid {
  display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.15fr);
  gap: var(--space-2xl); align-items: start; margin-top: var(--space-xl);
}
.pd-contact-info > h2, .pd-contact-form-card > h2 {
  font-size: var(--step-2); margin: 0 0 1rem;
}

/* Email cards */
.pd-contact-cards { display: grid; gap: .75rem; }
.pd-contact-card {
  display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto;
  column-gap: 1rem; align-items: center; text-decoration: none;
  padding: 1rem 1.15rem; border: 1px solid var(--border); border-radius: var(--radius-lg);
  background: var(--bg-elevated); box-shadow: var(--shadow-xs);
  transition: transform var(--dur-2) var(--ease-out), box-shadow var(--dur-2) var(--ease-out), border-color var(--dur-2) var(--ease-out);
}
.pd-contact-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: var(--primary-300); }
.pd-contact-card__icon {
  grid-row: 1 / span 2; width: 46px; height: 46px; border-radius: var(--radius-md);
  display: grid; place-items: center; font-size: 1.25rem;
  background: color-mix(in srgb, var(--brand-primary) 12%, #fff); color: var(--primary-700);
}
.pd-contact-card__label { font-family: var(--font-heading); font-weight: 700; color: var(--neutral-900); font-size: var(--step-0); }
.pd-contact-card__val { color: var(--primary-700); font-size: var(--step--1); font-weight: 600; }

/* Response note */
.pd-contact-response {
  display: flex; gap: .7rem; align-items: flex-start; margin-top: var(--space-lg);
  padding: 1rem 1.15rem; border-radius: var(--radius-lg);
  background: var(--bg-alt); border: 1px solid var(--border); color: var(--text-soft); font-size: var(--step--1);
}
.pd-contact-response__dot { flex: 0 0 auto; width: 10px; height: 10px; margin-top: .35rem; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 4px color-mix(in srgb, #22c55e 25%, transparent); }

/* Tips */
.pd-contact-tips { margin-top: var(--space-lg); padding: var(--space-lg); border-radius: var(--radius-lg); background: var(--primary-50); border: 1px solid color-mix(in srgb, var(--brand-primary) 18%, #fff); }
.pd-contact-tips h3 { font-size: var(--step-1); margin: 0 0 .5rem; color: var(--primary-800); }
.pd-contact-tips p { margin: 0 0 .6rem; color: var(--text-soft); font-size: var(--step--1); }
.pd-contact-tips ul { margin: 0; padding-left: 1.15rem; display: grid; gap: .4rem; color: var(--text-soft); font-size: var(--step--1); }
.pd-contact-tips li::marker { color: var(--primary-500); }

.pd-contact-foot { margin-top: var(--space-2xl); font-size: var(--step--1); color: var(--text-muted); }

/* --- Form card --- */
.pd-contact-form-card {
  position: relative; overflow: hidden; padding: var(--space-xl);
  border: 1px solid var(--border); border-radius: var(--radius-xl);
  background: var(--bg-elevated); box-shadow: var(--shadow-md);
}
.pd-contact-form-card::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: var(--grad-brand); }
.pd-contact-form-card__sub { margin: 0 0 1.25rem; color: var(--text-soft); font-size: var(--step--1); }

/* --- The form --- */
.pd-form__hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.pd-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.pd-form__field { display: grid; gap: .4rem; margin-bottom: 1rem; }
.pd-form__label { font-family: var(--font-heading); font-weight: 600; font-size: var(--step--1); color: var(--neutral-800); }
.pd-form__req { color: #ef4444; }
.pd-form__control {
  width: 100%; padding: .8rem 1rem; font-size: var(--step-0); font-family: var(--font-body);
  color: var(--text); background: var(--bg); border: 1.5px solid var(--border-strong);
  border-radius: var(--radius-md); transition: border-color var(--dur-1), box-shadow var(--dur-1), background var(--dur-1);
}
.pd-form__control::placeholder { color: var(--text-muted); }
.pd-form__control:focus {
  outline: none; border-color: var(--brand-primary); background: #fff;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand-primary) 18%, transparent);
}
.pd-form__control--invalid { border-color: #ef4444; }
.pd-form__control--invalid:focus { box-shadow: 0 0 0 4px color-mix(in srgb, #ef4444 18%, transparent); }
.pd-form__textarea { resize: vertical; min-height: 150px; line-height: 1.55; }
.pd-form__select {
  appearance: none; -webkit-appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 1rem center; padding-right: 2.75rem;
}
.pd-form__err { color: #dc2626; font-size: var(--step--1); font-weight: 600; }
.pd-form__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-top: 1.25rem; }
.pd-form__submit { display: inline-flex; align-items: center; gap: .5rem; padding: .85rem 1.6rem; font-size: var(--step-0); }
.pd-form__submit svg { transition: transform var(--dur-2) var(--ease-out); }
.pd-form__submit:hover svg { transform: translateX(3px); }
.pd-form__privacy { font-size: var(--step--2); color: var(--text-muted); max-width: 34ch; }
.pd-form__privacy a { color: var(--primary-700); }

/* Flash messages */
.pd-form__flash { display: flex; gap: .8rem; align-items: flex-start; padding: 1rem 1.15rem; border-radius: var(--radius-lg); margin-bottom: 1.25rem; font-size: var(--step--1); }
.pd-form__flash--ok { background: color-mix(in srgb, #22c55e 12%, #fff); border: 1px solid color-mix(in srgb, #22c55e 40%, #fff); color: #14532d; }
.pd-form__flash--ok strong { display: block; font-size: var(--step-0); }
.pd-form__flash--ok p { margin: .2rem 0 0; }
.pd-form__flash--err { background: color-mix(in srgb, #ef4444 10%, #fff); border: 1px solid color-mix(in srgb, #ef4444 40%, #fff); color: #7f1d1d; font-weight: 600; }
.pd-form__flash-icon { flex: 0 0 auto; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: #22c55e; color: #fff; font-weight: 700; }

@media (max-width: 900px){
  .pd-contact-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px){
  .pd-form__row { grid-template-columns: 1fr; }
  .pd-form__actions { flex-direction: column; align-items: stretch; }
  .pd-form__privacy { max-width: none; }
}

/* Contact cards are links inside .entry-content — kill the inherited underline */
.entry-content a.pd-contact-card, .entry-content a.pd-contact-card:hover { text-decoration: none; }
.pd-contact-card__label, .pd-contact-card__val { text-decoration: none; }
