/*
 * Service — Emergency Fix (Archetype F variant: urgent, diagnostic).
 * Loaded only on the dedicated fix service page template. Centered,
 * compact hero (no split visual) — the message itself is the visual: fast,
 * direct, no decoration standing between the visitor and the CTA.
 */

.mwp-fix-hero {
  padding-block: var(--sp-16) var(--sp-12);
  text-align: center;
}
.mwp-fix-hero > .mwp-container { max-width: var(--container-text); }
.mwp-fix-hero .mwp-breadcrumb { justify-content: center; display: flex; }
.mwp-fix-hero__badge {
  display: inline-flex; align-items: center; gap: 8px;
  color: #dc2626; background: #fef2f2; border: 1px solid #fecaca;
  padding: 7px 16px; border-radius: var(--radius-pill);
  font-weight: 700; font-size: var(--fs-sm);
  margin-block: var(--sp-4) var(--sp-5);
}
:root[data-theme="dark"] .mwp-fix-hero__badge { background: #2a1414; color: #f87171; border-color: #4a1f1f; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .mwp-fix-hero__badge { background: #2a1414; color: #f87171; border-color: #4a1f1f; }
}
.mwp-fix-hero__pulse {
  width: 8px; height: 8px; border-radius: 50%; background: #dc2626;
  box-shadow: 0 0 0 0 rgba(220, 38, 38, .5);
  animation: mwp-fix-pulse 1.8s infinite;
}
@media (prefers-reduced-motion: reduce) { .mwp-fix-hero__pulse { animation: none; } }
@keyframes mwp-fix-pulse {
  0% { box-shadow: 0 0 0 0 rgba(220, 38, 38, .45); }
  70% { box-shadow: 0 0 0 8px rgba(220, 38, 38, 0); }
  100% { box-shadow: 0 0 0 0 rgba(220, 38, 38, 0); }
}
.mwp-fix-hero h1 { margin-inline: auto; }
.mwp-fix-hero__sub {
  color: var(--text-secondary); font-size: 1.15rem; line-height: 1.85;
  max-width: 56ch; margin: var(--sp-4) auto 0;
}
.mwp-fix-hero__cta {
  margin-block-start: var(--sp-7); justify-content: center;
}
.mwp-fix-hero__trust { display: inline-flex; align-items: center; gap: 6px; color: var(--text-secondary); font-size: var(--fs-sm); }
.mwp-fix-hero__trust svg { color: var(--primary); }

/* Diagnostic terminal — reinforces "we diagnose the real cause" with a
 * genuinely different, technical visual register than any other service
 * page (dark panel vs everyone else's light cards). Static content only —
 * no animation beyond a subtle reduced-motion-safe cursor blink. */
.mwp-fix-terminal {
  margin: var(--sp-8) auto 0; max-width: 460px; text-align: start;
  background: var(--mwp-ink); border-radius: var(--radius-md); overflow: hidden;
  box-shadow: var(--shadow-lg);
}
.mwp-fix-terminal__bar { display: flex; gap: 6px; padding: 10px 14px; background: rgba(255,255,255,.06); }
.mwp-fix-terminal__bar span { width: 9px; height: 9px; border-radius: 50%; background: rgba(255,255,255,.25); }
.mwp-fix-terminal__body { padding: var(--sp-4) var(--sp-5) var(--sp-5); font-family: var(--font-mono); font-size: .85rem; }
.mwp-fix-terminal__body p { color: rgba(255,255,255,.55); margin-block-start: var(--sp-2); }
.mwp-fix-terminal__body p:first-child { margin-block-start: 0; }
.mwp-fix-terminal__prompt { color: #4ade80; margin-inline-end: 6px; }
.mwp-fix-terminal__ok { color: #4ade80; margin-inline-end: 6px; }
.mwp-fix-terminal__cursor { color: #fff; font-weight: 700; }
.mwp-fix-terminal__blink { animation: mwp-fix-blink 1.1s step-end infinite; }
@media (prefers-reduced-motion: reduce) { .mwp-fix-terminal__blink { animation: none; } }
@keyframes mwp-fix-blink { 50% { opacity: 0; } }

/* ---------- Signature section: symptom triage grid ---------- */
.mwp-fix-symptoms { display: grid; gap: var(--sp-5); grid-template-columns: repeat(2, 1fr); }
@media (max-width: 720px) { .mwp-fix-symptoms { grid-template-columns: 1fr; } }
.mwp-fix-symptom {
  padding: var(--sp-6); border: 1px solid var(--border); border-radius: var(--radius-md);
  background: var(--surface); transition: transform .2s var(--ease), box-shadow .2s var(--ease);
}
.mwp-fix-symptom:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.mwp-fix-symptom__icon {
  width: 44px; height: 44px; border-radius: var(--radius-sm);
  background: #fef2f2; color: #dc2626; display: grid; place-items: center;
  margin-block-end: var(--sp-4);
}
:root[data-theme="dark"] .mwp-fix-symptom__icon { background: #2a1414; color: #f87171; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .mwp-fix-symptom__icon { background: #2a1414; color: #f87171; }
}
.mwp-fix-symptom h3 { font-size: 1.05rem; margin-block-end: var(--sp-2); }
.mwp-fix-symptom p { color: var(--text-secondary); font-size: var(--fs-sm); }