/* Talkit technical/component improvements — intentionally preserves the original visual design. */

/* Accessible keyboard focus without changing mouse/visual design */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
[role="button"]:focus-visible {
  outline: 3px solid rgba(238, 59, 36, 0.65);
  outline-offset: 3px;
}

/* Make portfolio cards keyboard-operable as components */
figure.effect-oscar[tabindex="0"] {
  cursor: pointer;
}

/* Browser-native lazy-loaded images should still reserve clean space */
img {
  max-width: 100%;
  height: auto;
}

/* Honeypot field stays inaccessible to users but remains available to bots */
.talkit-honeypot {
  position: absolute !important;
  left: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

/* Modern form state component; only appears after validation/submission events */
.form-status {
  margin-top: 16px;
  padding: 12px 14px;
  border-radius: 4px;
  font-size: 14px;
  line-height: 1.4;
}
.form-status.is-error {
  color: #8a1c10;
  background: rgba(238, 59, 36, 0.10);
  border: 1px solid rgba(238, 59, 36, 0.25);
}
.form-status.is-info {
  color: #1b4f78;
  background: rgba(50, 124, 188, 0.10);
  border: 1px solid rgba(50, 124, 188, 0.25);
}

/* Respect user motion preferences while preserving original animations for everyone else */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.001ms !important;
  }
}


/* Public portfolio / knowledge blocks populated from Talkit GitHub + Redmine project knowledge */
.talkit-section-intro { max-width: 850px; margin: 0 auto 32px; color: #555; font-size: 17px; line-height: 1.7; text-align: center; }
.talkit-portfolio-section { background: #fff; }
.talkit-card-grid, .talkit-knowledge-grid { display: flex; flex-wrap: wrap; }
.talkit-card-grid > [class*="col-"], .talkit-knowledge-grid > [class*="col-"] { display: flex; margin-bottom: 28px; }
.talkit-case-card { width: 100%; min-height: 330px; padding: 28px 26px; border: 1px solid rgba(0,0,0,.08); border-top: 4px solid #ee3b24; background: #fff; box-shadow: 0 12px 28px rgba(0,0,0,.07); }
.talkit-case-card h3 { margin-top: 8px; margin-bottom: 14px; color: #222; font-size: 21px; line-height: 1.25; }
.talkit-case-card p, .talkit-case-card li { color: #555; font-size: 14px; line-height: 1.65; }
.talkit-case-card ul { padding-left: 18px; margin: 14px 0 0; }
.talkit-case-tag { display: inline-block; color: #ee3b24; font-weight: 700; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.talkit-knowledge-section { padding: 70px 0; background: #f7f7f7; }
.talkit-knowledge-item { width: 100%; padding: 22px; background: #fff; border-left: 4px solid #ee3b24; box-shadow: 0 8px 18px rgba(0,0,0,.05); }
.talkit-knowledge-item strong, .talkit-knowledge-item span { display: block; }
.talkit-knowledge-item strong { margin-bottom: 8px; color: #222; font-size: 18px; }
.talkit-knowledge-item span { color: #555; line-height: 1.6; }
@media (max-width: 767px) { .talkit-case-card { min-height: 0; } .talkit-section-intro { font-size: 15px; } }