/* Macedonia service insignia — code-native, resolution-independent goldwork. */
.service-emblems {
  position: relative;
  isolation: isolate;
  margin-top: 64px;
  padding-block: 9px;
  border-block: 1px solid #bba47540;
  background: linear-gradient(90deg, #090e1238, #1720246b 50%, #090e1238);
  scroll-margin-top: 160px;
}
.service-emblems::before,
.service-emblems::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, #dac29230 25%, #dac29230 75%, transparent);
  pointer-events: none;
}
.service-emblems::before { top: 4px; }
.service-emblems::after { bottom: 4px; }
.service-emblems > a {
  position: relative;
  min-width: 0;
  min-height: 142px;
  gap: 15px;
  padding: 20px 14px;
  color: #ded4bf;
  transition: background-color .25s ease, color .25s ease;
  -webkit-tap-highlight-color: #d9be7b24;
}
.service-emblems > a + a { border-left-color: #c5af7e20; }
.service-emblems > a::after {
  content: "";
  position: absolute;
  left: 23%;
  right: 23%;
  bottom: 9px;
  height: 1px;
  background: linear-gradient(90deg, transparent, #d7b775, transparent);
  opacity: 0;
  transform: scaleX(.55);
  transition: opacity .25s ease, transform .3s ease;
}
.service-emblems > a:is(:hover, :focus-visible) {
  color: #f2e1bc;
  background: #d9bd7e09;
}
.service-emblems > a:focus-visible {
  outline: 2px solid #e8cc92;
  outline-offset: -3px;
  z-index: 1;
}
.service-emblems > a:is(:hover, :focus-visible)::after { opacity: 1; transform: scaleX(1); }
.service-emblem {
  position: relative;
  display: grid;
  place-items: center;
  flex: 0 0 86px;
  width: 86px;
  height: 86px;
  isolation: isolate;
}
.service-emblem::before {
  content: "";
  position: absolute;
  inset: 7px;
  z-index: -1;
  border: 1px solid #b39a5f2b;
  background: radial-gradient(ellipse at 50% 20%, #a68b4d16, #070c0e60 70%);
  box-shadow: inset 0 0 0 4px #0a0f1330, 0 8px 20px #00000024;
  transform: rotate(45deg);
  transition: border-color .3s ease, box-shadow .3s ease;
}
.service-emblem::after {
  content: "";
  position: absolute;
  inset: 1px;
  z-index: -1;
  border: 1px solid #ae935719;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, #d0af6710, transparent 67%);
  transition: border-color .3s ease;
}
.service-emblem img {
  display: block;
  width: 86px;
  height: 86px;
  max-width: none;
  filter: drop-shadow(0 3px 2px #0008);
  transition: transform .3s ease, filter .3s ease;
}
.service-emblems > a:is(:hover, :focus-visible) .service-emblem::before {
  border-color: #d0b16b65;
  box-shadow: inset 0 0 0 4px #0a0f1330, 0 0 26px #c29d4712;
}
.service-emblems > a:is(:hover, :focus-visible) .service-emblem::after { border-color: #cbb07335; }
.service-emblems > a:is(:hover, :focus-visible) .service-emblem img {
  transform: translateY(-3px);
  filter: drop-shadow(0 5px 3px #0009) brightness(1.12);
}
.service-caption { display: grid; gap: 9px; min-width: 0; }
.service-label { font-size: 16px; font-weight: 600; line-height: 1.5; word-break: keep-all; overflow-wrap: anywhere; }
.service-legend { color: #a79a7e; font: 9px/1.5 Georgia, 'Times New Roman', serif; letter-spacing: .13em; }
@media (max-width: 1150px) {
  .service-emblems > a { flex-direction: column; min-height: 177px; gap: 15px; padding: 22px 10px; text-align: center; }
  .service-caption { gap: 5px; }
  .service-emblem { flex-basis: 76px; width: 76px; height: 76px; }
  .service-emblem img { width: 80px; height: 80px; }
  .service-emblem::before { inset: 7px; }
  .service-label { font-size: 15px; }
}
@media (max-width: 700px) {
  .service-emblems { grid-template-columns: repeat(6, minmax(0, 1fr)); margin-top: 40px; padding-block: 5px; scroll-margin-top: 180px; }
  .service-emblems > a { grid-column: span 2; min-height: 163px; gap: 13px; padding: 20px 8px; border-bottom: 0; }
  .service-emblems > a:nth-child(n + 4) { grid-column: span 3; border-top: 1px solid #c5af7e20; }
  .service-emblems > a:nth-child(4) { border-left: 0; }
  .service-emblem { width: 67px; height: 67px; flex-basis: 67px; }
  .service-emblem img { width: 74px; height: 74px; }
  .service-emblem::before { inset: 6px; }
  .service-label { font-size: 14px; }
  .service-legend { font-size: 8px; letter-spacing: .09em; }
}
@media (max-width: 359px) {
  .service-emblems { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .service-emblems > a,
  .service-emblems > a:nth-child(n + 4) { grid-column: span 1; }
  .service-emblems > a:nth-child(n + 3) { border-top: 1px solid #c5af7e20; }
  .service-emblems > a:nth-child(odd) { border-left: 0; }
  .service-emblems > a:nth-child(4) { border-left: 1px solid #c5af7e20; }
  .service-emblems > a:last-child { grid-column: span 2; flex-direction: row; gap: 22px; min-height: 123px; }
}
@media (forced-colors: active) {
  .service-emblems, .service-emblems > a { border-color: CanvasText; }
  .service-label, .service-legend { color: LinkText; }
  .service-emblems > a:focus-visible { outline-color: Highlight; }
}
