/* ===== Frontend-only overrides (loaded after site.css) ===== */

/* Slightly smaller floating action buttons */
.fab { width: 46px; height: 46px; box-shadow: 0 5px 16px rgba(0, 0, 0, 0.2); }
.fab svg { width: 21px; height: 21px; }
.fab-stack { gap: 10px; }
@media (max-width: 620px) {
  .fab { width: 42px; height: 42px; }
}

/* Back-to-top fab — collapsed until scrolled; when shown it pushes the
   other fabs up (stack is anchored to the bottom of the viewport). */
.fab-top {
  background: var(--night, #12100f);
  border: none;
  cursor: pointer;
  max-height: 0;
  opacity: 0;
  pointer-events: none;
  margin-top: -10px; /* cancels the stack gap while hidden */
  transform: translateY(8px) scale(0.8);
  transition: max-height 0.35s var(--ease), opacity 0.35s var(--ease),
    margin-top 0.35s var(--ease), transform 0.35s var(--ease),
    background-color var(--dur) var(--ease);
}
.fab-top.show {
  max-height: 46px;
  opacity: 1;
  pointer-events: auto;
  margin-top: 0;
  transform: none;
}
.fab-top:hover { background: var(--brand-red); }

/* ===== reCAPTCHA — always inline inside the form, never floating ===== */
.recaptcha-inline { display: flex; }
.recaptcha-inline > div { min-height: 78px; }
.recaptcha-note {
  font-size: 12.5px;
  color: var(--ink-3);
  line-height: 1.5;
}
.contact-band-img .recaptcha-note { color: rgba(255, 255, 255, 0.55); }
.recaptcha-note a { text-decoration: underline; }
/* v3 loads a fixed bottom-right badge by default — hide it; the inline
   attribution text above satisfies Google's branding requirement. */
.grecaptcha-badge { visibility: hidden !important; }

/* ===== Blog ===== */
.post-meta { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; font-size: 12.5px; }
.post-cat {
  color: var(--brand-red);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 11.5px;
  background: var(--brand-red-soft, #f7ecec);
  padding: 3px 9px;
  border-radius: 99px;
}
.post-date { color: var(--ink-3); }
.post-card .prodcat-desc p { margin: 0; }

.post-article { max-width: 780px; margin: 0 auto; }
.post-content { font-size: 17.5px; line-height: 1.75; color: var(--ink-2); }
.post-content h2 { margin: 36px 0 14px; font-size: clamp(22px, 2.4vw, 30px); }
.post-content h3 { margin: 28px 0 12px; font-size: clamp(19px, 2vw, 24px); }
.post-content p { margin-bottom: 18px; }
.post-content ul, .post-content ol { margin: 0 0 18px 22px; }
.post-content li { margin-bottom: 8px; }
.post-content img { border-radius: 14px; margin: 24px 0; }
.post-content blockquote {
  border-left: 3px solid var(--brand-red);
  padding: 6px 0 6px 20px;
  margin: 24px 0;
  color: var(--ink-3);
  font-style: italic;
}
.post-content a { text-decoration: underline; }