.elementor-130 .elementor-element.elementor-element-15ccfec{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-130 .elementor-element.elementor-element-15ccfec:not(.elementor-motion-effects-element-type-background), .elementor-130 .elementor-element.elementor-element-15ccfec > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://computerz.es/wp-content/uploads/2025/04/Back-копия.png");}/* Start custom CSS for html, class: .elementor-element-158189a */.sobre-team-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 36px;
  justify-items: center;
  margin-top: 18px;
}

@media (max-width: 1100px) {
  .sobre-team-list {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }
}
@media (max-width: 650px) {
  .sobre-team-list {
    grid-template-columns: 1fr;
    gap: 14px;
  }
}
.sobre-member {
  width: 100%;
  max-width: 230px;
  /* остальное по-старому */
}

.sobre-member {
  background: #fffefc;
  border-radius: 1.3em;
  box-shadow: 0 2px 14px #ffe96a18;
  padding: 18px 18px 16px 18px;
  max-width: 230px;
  flex: 1 1 210px;
  text-align: center;
  margin: 0 8px 14px 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
  position: relative;
  transition: box-shadow 0.2s, transform 0.2s;
}
@keyframes teamAppear {
  0% {
    opacity: 0;
    transform: translate(-70px, 70px) scale(0.96) rotateZ(-8deg);
  }
  70% {
    opacity: 1;
    transform: translate(10px, -9px) scale(1.03) rotateZ(2deg);
  }
  100% {
    opacity: 1;
    transform: translate(0,0) scale(1) rotateZ(0deg);
  }
}

.sobre-member {
  opacity: 0;
  transform: translate(-70px, 70px) scale(0.96);
}

/* Когда появилась */
.sobre-member.visible {
  animation: teamAppear 0.8s cubic-bezier(.36,1.3,.36,1.01) forwards;
}


.sobre-member:hover, .sobre-member:focus {
  box-shadow: 0 6px 24px #ffe96a55, 0 1px 12px #c7e7ff18;
  transform: translateY(-3px) scale(1.03);
}
.sobre-member img {
  width: 90px;
  height: 90px;
  object-fit: cover;
  border-radius: 50%;
  margin-bottom: 11px;
  box-shadow: 0 2px 12px #ffe96a22;
  transition: box-shadow 0.2s, filter 0.2s, transform 0.2s;
}
.sobre-member:hover img, .sobre-member:focus img {
  box-shadow: 0 6px 24px #ffe96a55;
  filter: brightness(1.08) saturate(1.13);
  transform: scale(1.07);
}
.sobre-member::after {
  content: "🔍";
  opacity: 0;
  pointer-events: none;
  position: absolute;
  right: 14px; top: 8px;
  font-size: 1.5em;
  transition: opacity 0.22s;
}
.sobre-member:hover::after, .sobre-member:focus::after {
  opacity: 0.7;
}

.team-name {
  font-family: 'Anoxic', Arial, sans-serif;
  font-size: 1.08rem;
  color: #191c24;
  margin: 0 0 3px 0;
  font-weight: 700;
}
.team-role {
  font-family: Calibri, Arial, sans-serif;
  font-size: 0.98rem;
  color: #848a98;
  margin: 0 0 5px 0;
  font-weight: 600;
  letter-spacing: 0.2px;
}
.team-bio {
  font-family: Calibri, Arial, sans-serif;
  font-size: 0.99rem;
  color: #232c37;
  margin: 0;
  line-height: 1.33;
}

/* Адаптивность */
@media (max-width: 900px) {
  .sobre-team-list { gap: 16px; }
  .sobre-member { max-width: 98vw; padding: 12px 2vw; }
  .sobre-member img { width: 66px; height: 66px; }
}
@media (max-width: 600px) {
  .sobre-team-list { flex-direction: column; gap: 12px; align-items: center; }
  .sobre-member { margin: 0 auto 12px auto; }
}
.team-modal {
  display: none; position: fixed; z-index: 2222; left: 0; top: 0;
  width: 100vw; height: 100vh; overflow: auto;
  background: rgba(22,24,32,0.82);
  align-items: center; justify-content: center;
}
.team-modal-content {
  background: #fff;
  margin: 48px auto; padding: 32px 28px 26px 28px;
  border-radius: 1.5em; max-width: 370px; width: 96vw;
  box-shadow: 0 6px 40px #ffe96a3d;
  position: relative; text-align: center;
  animation: modalIn .18s cubic-bezier(.39,1.47,.32,1.03);
}
@keyframes modalIn { from { transform: scale(0.93); opacity: 0; } to { transform: scale(1); opacity: 1; } }
.team-modal-close {
  position: absolute; top: 14px; right: 20px; font-size: 2.2rem; color: #cec08d; cursor: pointer; font-weight: 700;
  transition: color 0.16s;
}
.team-modal-close:hover { color: #191c24; }
#modal-photo {
  width: 220px;
  height: 220px;
  border-radius: 50%;
  object-fit: cover;
  margin-bottom: 18px;
  box-shadow: 0 4px 20px #ffe96a34;
  display: block;
  margin-left: auto;
  margin-right: auto;
  transition: width 0.18s, height 0.18s;
}
@media (max-width:600px){
  #modal-photo{width:125px;height:125px;}
}

#modal-name { font-family: 'Anoxic', Arial, sans-serif; font-size: 1.18rem; color: #191c24; margin-bottom: 2px;}
#modal-role { color: #8b929c; font-size: 0.97rem; margin-bottom: 12px;}
#modal-bio { font-size: 1.01rem; color: #232c37; }
@media (max-width:600px){
  .team-modal-content {padding:18px 7vw 13px 7vw;}
  #modal-photo{width:75px;height:75px;}
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-15ccfec */:root {
  --anoxic: 'Anoxic', Arial, sans-serif;
  --main-bg: #fff;           /* Белый для блоков */
  --main-radius: 2em;
  --hero-shadow: 0 2px 14px #f3eabc33, 0 1px 10px #c7e7ff18;
  --main-color: #191c24;
  --desc-color: #232c37;
}

.section-box {
  max-width: 950px;
  margin: 36px auto 44px auto;
  padding: 0 18px 0 18px;
  background: var(--main-bg);
  border-radius: var(--main-radius);
  box-shadow: var(--hero-shadow);
  text-align: center;
}

.section-title {
  font-family: var(--anoxic);
  font-size: 2rem;
  font-weight: 900;
  color: var(--main-color);
  letter-spacing: 1px;
  margin-bottom: 18px;
  display: inline-block;
  background: #fff;
  border-radius: 1.2em;
  padding: 0.26em 1.1em 0.19em 1.1em;
  box-shadow: 0 2px 10px #fff5c44c;
}
.sobre-hero-photo {
  min-width: 110px;
  min-height: 110px;
  max-width: 140px;
  max-height: 140px;
  border-radius: 50%;
  overflow: hidden;
  box-shadow: 0 4px 18px #ffe96a60;
  background: #fff5c4;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sobre-hero-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  display: block;
}


.section-desc,
.section-box p,
.section-box li {
  font-family: Calibri, Arial, sans-serif;
  font-size: 1.08rem;
  color: var(--desc-color);
  margin: 0 0 9px 0;
  line-height: 1.38;
}
@media (max-width: 700px) {
  .section-box {
    padding: 10px 2vw 18px 2vw;
    margin: 24px auto 1px auto;
    border-radius: 1em;
  }

  .section-title {
    font-size: 1.45rem;
    padding: 0.18em 0.6em 0.12em 0.6em;
  }

  .sobre-hero > div,
  .sobre-hero-content {
    flex-direction: column !important;
    gap: 14px !important;
    align-items: center !important;
    text-align: center !important;
  }

  .sobre-hero-photo {
    margin-bottom: 10px;
    min-width: 66px !important;
    min-height: 66px !important;
  }

  .sobre-team-list {
    flex-direction: column;
    gap: 15px;
  }

  .sobre-member-placeholder {
    padding: 1.2em 0.9em;
    font-size: 1rem;
  }

  ul, .section-box ul {
    padding-left: 1.1em !important;
    text-align: left !important;
  }
}
.section-box,
.section-title,
.section-desc {
  opacity: 0;
  transform: translateY(40px);
  animation: fadeInUp 1.1s ease-out forwards;
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(40px);
  }
  60% {
    opacity: 0.7;
    transform: translateY(12px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}/* End custom CSS */