/* Podstranica: Backend Development (nadograđuje frontend.css) */

.be-hero .fe-hero-title span + span {
  background: linear-gradient(95deg, #0071e3 0%, #5e5ce6 45%, #8e5cf7 75%, #af52de 100%);
  -webkit-background-clip: text;
  background-clip: text;
}

.be-api {
  gap: 12px;
  font-family: ui-monospace, "SF Mono", "Cascadia Code", Menlo, Consolas, monospace;
  letter-spacing: 0;
}
.be-req {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding: 11px 14px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.06);
  font-size: 13px;
}
.be-method {
  padding: 3px 8px;
  border-radius: 6px;
  background: #1f9d4c;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
}
.be-path { color: var(--ink); }
.be-status {
  margin-left: auto;
  color: #1f8a45;
  font-size: 12px;
  font-weight: 600;
}
.be-json {
  margin: 0;
  padding: 16px 18px;
  overflow-x: auto;
  border-radius: 14px;
  background: #111117;
  color: #c7c7cc;
  font-size: 13px;
  line-height: 1.7;
}
.j-k { color: #67b7ff; }
.j-s { color: #ffa36b; }
.j-n { color: #c9a0ff; }
.j-b { color: #ff7ab2; }
.be-table {
  padding: 12px 14px 6px;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 8px 20px rgba(0, 0, 0, 0.05);
  font-size: 13px;
}
.be-table-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 8px;
}
.be-table-head span { color: var(--faint); }
.be-row {
  display: grid;
  grid-template-columns: 0.8fr 1.3fr 1fr;
  gap: 8px;
  padding: 7px 0;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  color: var(--ink);
}
.be-row span:last-child { text-align: right; }
.be-row-head { color: var(--faint); font-size: 12px; }
.be-row i {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 7px;
  border-radius: 50%;
  background: #ff9f0a;
  vertical-align: 1px;
}
.be-row i.ok { background: #30d158; }

.be-scores .fe-ring strong { font-size: 15px; letter-spacing: -0.03em; }
.be-glyph-net { font-size: 17px; letter-spacing: -0.02em; }

/* Tri kartice tehnologija u dva stupca: treća ide preko cijelog retka */
@media (min-width: 681px) and (max-width: 1100px) {
  .fe-tech-grid .fe-tech-card:nth-child(3) { grid-column: 1 / -1; }
}

@media (max-width: 680px) {
  .be-json { font-size: 12px; padding: 14px; }
  .be-req { font-size: 12px; }
  .be-scores .fe-ring strong { font-size: 13px; }
}
