/* Blog + generic-page styles, built on the Steam-Pro tokens. */
.page-hero{position:relative;background:var(--grad-hero);color:var(--fg-inverse);
  padding:var(--space-20) var(--space-6) var(--space-16);text-align:center;overflow:hidden}
.page-hero .wrap{position:relative;z-index:2}
.page-hero h1{color:var(--fg-inverse);font-size:var(--fs-display-lg);margin:0 0 var(--space-4)}
.page-hero .lede{color:rgba(255,255,255,.85);max-width:680px;margin:0 auto}
.page-hero .eyebrow{color:var(--sp-blue-glow)}

.blog-shell{max-width:1140px;margin:0 auto;padding:var(--space-20) var(--space-6)}
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-8)}
@media(max-width:900px){.post-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.post-grid{grid-template-columns:1fr}}
.post-card{display:flex;flex-direction:column;background:var(--bg-elevated);border:1px solid var(--border-default);
  border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);transition:box-shadow var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out)}
.post-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-3px)}
.post-card-thumb{display:block;height:180px;background-size:cover;background-position:center;background-color:var(--sp-royal)}
.post-card-body{padding:var(--space-6);display:flex;flex-direction:column;gap:var(--space-3);flex:1}
.post-cat{align-self:flex-start;font-size:var(--fs-overline);font-weight:var(--fw-bold);text-transform:uppercase;
  letter-spacing:var(--ls-eyebrow);color:var(--sp-blue-deep);background:var(--sp-blue-soft);padding:4px 10px;border-radius:var(--radius-pill)}
.post-card-body h3{margin:0;font-size:var(--fs-h3);line-height:1.2}
.post-card-body h3 a{color:var(--fg-1)}
.post-card-body h3 a:hover{color:var(--fg-link-hover)}
.post-excerpt{color:var(--fg-2);font-size:var(--fs-body-sm);margin:0}
.post-meta{margin-top:auto;font-size:var(--fs-caption);color:var(--fg-3)}
.post-readmore{font-weight:var(--fw-bold);color:var(--sp-blue-deep)}

.post-single{max-width:760px;margin:0 auto;padding:var(--space-16) var(--space-6) var(--space-20)}
.post-single .post-cat{margin-bottom:var(--space-4)}
.post-single h1{font-size:var(--fs-display-md);line-height:1.12;margin:0 0 var(--space-4)}
.post-single-meta{color:var(--fg-3);font-size:var(--fs-caption);margin-bottom:var(--space-8);
  padding-bottom:var(--space-6);border-bottom:1px solid var(--border-default)}
.post-single-feat{width:100%;border-radius:var(--radius-lg);margin:0 0 var(--space-8)}
.post-single-body{font-size:var(--fs-lede);line-height:var(--lh-relaxed);color:var(--fg-1)}
.post-single-body h2{font-size:var(--fs-display-sm);margin:var(--space-10) 0 var(--space-4)}
.post-single-body h3{font-size:var(--fs-h3);margin:var(--space-8) 0 var(--space-3)}
.post-single-body p{margin:0 0 var(--space-5)}
.post-single-body ul,.post-single-body ol{margin:0 0 var(--space-5) var(--space-6)}
.post-single-body li{margin-bottom:var(--space-2)}
.post-single-body a{color:var(--fg-link);text-decoration:underline}
.post-single-body img{max-width:100%;height:auto;border-radius:var(--radius-md)}

.pagination{display:flex;gap:var(--space-3);justify-content:center;margin-top:var(--space-12);flex-wrap:wrap}
.pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;
  padding:0 var(--space-3);border:1px solid var(--border-default);border-radius:var(--radius-md);
  color:var(--fg-1);font-weight:var(--fw-semibold)}
.pagination .page-numbers.current{background:var(--sp-royal);color:#fff;border-color:var(--sp-royal)}
.pagination a.page-numbers:hover{border-color:var(--sp-blue-bright);color:var(--sp-blue-deep)}

.prose{max-width:760px;margin:0 auto;padding:var(--space-16) var(--space-6) var(--space-20);
  font-size:var(--fs-body);line-height:var(--lh-relaxed)}
.prose h1{font-size:var(--fs-display-md);margin:0 0 var(--space-6)}
.prose h2{font-size:var(--fs-display-sm);margin:var(--space-10) 0 var(--space-4)}
.prose p{margin:0 0 var(--space-5)}
.prose ul,.prose ol{margin:0 0 var(--space-5) var(--space-6)}

/* Contact form (Contact Form 7) styled to match the design's form card. */
.cf7-wrap .wpcf7-form p{margin:0 0 var(--space-4)}
.cf7-wrap label{display:block;font-weight:var(--fw-semibold);font-size:var(--fs-body-sm);margin-bottom:var(--space-4)}
.cf7-wrap input[type=text],.cf7-wrap input[type=email],.cf7-wrap input[type=tel],
.cf7-wrap select,.cf7-wrap textarea{width:100%;margin-top:6px;padding:12px 14px;border:1px solid var(--border-default);
  border-radius:var(--radius-md);font:inherit;color:var(--fg-1);background:#fff}
.cf7-wrap input:focus,.cf7-wrap select:focus,.cf7-wrap textarea:focus{outline:none;border-color:var(--border-focus);
  box-shadow:0 0 0 3px rgba(30,144,255,.15)}
.cf7-wrap .wpcf7-submit{background:var(--grad-cta);color:#fff;border:none;padding:14px 22px;border-radius:var(--radius-lg);
  font-weight:var(--fw-bold);font-size:var(--fs-body);cursor:pointer;width:100%;box-shadow:var(--shadow-cta)}
.cf7-wrap .wpcf7-submit:hover{filter:brightness(1.05)}


/* ---- Mobile navigation menu + admin-bar offset ---- */
.hdr-toggle{display:none;background:none;border:0;padding:6px;margin-left:4px;color:var(--sp-ink);cursor:pointer;border-radius:8px}
.hdr-toggle:hover{background:var(--sp-line-soft)}
.hdr-toggle svg{display:block}
.admin-bar .hdr{top:32px}
@media (max-width:782px){.admin-bar .hdr{top:46px}}
@media (max-width:900px){
  .hdr-toggle{display:inline-flex;align-items:center}
  .hdr-inner{position:relative}
  .hdr-nav{
    display:flex;flex-direction:column;gap:0;
    position:absolute;left:0;right:0;top:100%;
    background:#fff;border-top:1px solid var(--sp-line);border-bottom:1px solid var(--sp-line);
    box-shadow:var(--shadow-lg);padding:6px 0;margin:0;
    opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-10px);
    transition:opacity .2s var(--ease-out),transform .2s var(--ease-out),visibility .2s
  }
  .hdr.nav-open .hdr-nav{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
  .hdr-nav a{padding:14px 28px;font-size:16px;color:var(--sp-ink);border-bottom:1px solid var(--sp-line-soft)}
  .hdr-nav a:last-child{border-bottom:0}
  .hdr-nav a::after{display:none}
}