/* ============================================
   TEAM SECTION - Pixel Perfect
   ============================================ */

.team {
  position: relative;
  width: 100%;
  max-width: 1920px;
  margin: 120px auto 0; /* отступ сверху 120px между блоками */
  padding: 0 268px; /* отступы для центрирования контейнера 1384px */
  box-sizing: border-box;
}

.team__container {
  position: relative;
  width: 100%;
  max-width: 1384px; /* точная ширина из Figma layout_KJRDSR */
  height: 699px; /* точная высота из Figma */
  margin: 0 auto;
  background: #0D0E0F; /* точный цвет из Figma fill_Q825MS */
  border-radius: 40px; /* точный border-radius из Figma */
  overflow: hidden;
}

/* iPhone изображение */
.team__phone-wrapper {
  position: absolute;
  left: 95.51px; /* позиция скорректирована */
  width: 1398.99px; /* точная ширина из Figma */
  height: 885.29px; /* точная высота из Figma */
  z-index: 3;
  pointer-events: none;
}

.team__phone {
  object-fit: contain;
  display: block;
  opacity: 0;
  transition: opacity 0.5s ease-in-out;
}

.team__phone.loaded {
  opacity: 1;
}

/* Мобильное изображение скрыто на десктопе */
.team__phone--mobile {
  display: none;
}

/* Десктопное изображение скрыто на мобильных */
@media (max-width: 1023px) {
  .team__phone--desktop {
    display: none;
  }
  
  .team__phone--mobile {
    display: block;
  }
}

/* Награда */
.team__award {
  position: absolute;
  left: 50px; /* точная позиция из Figma layout_EJKHWM */
  top: 50px; /* точная позиция из Figma */
  width: 150.26px; /* точная ширина из Figma */
  height: 64.26px; /* точная высота из Figma */
  z-index: 4;
  filter: drop-shadow(0px 3px 12px rgba(0, 0, 0, 0.25)); /* точный shadow из Figma effect_WA5A6P */
}

.team__award img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

/* Контент */
.team__content {
  position: absolute;
  left: 50px; /* точная позиция из Figma layout_3QIHJF */
  top: 169px; /* точная позиция из Figma */
  width: 608.61px; /* точная ширина из Figma */
  z-index: 5;
  display: flex;
  flex-direction: column;
  gap: 28px; /* точный gap из Figma layout_B3MJOW */
}


/* Линия теперь встроена в заголовок через SVG */

.team__text {
  display: flex;
  flex-direction: column;
  gap: 28px; /* точный gap из Figma layout_B3MJOW */
  width: 100%;
}

.team__title {
  font-family: var(--font-primary);
  font-weight: 600; /* точный weight из Figma style_T0NJJN */
  font-size: 84.35932922363281px; /* точный размер из Figma */
  line-height: 0.7099999855297199em; /* точный line-height из Figma */
  letter-spacing: -0.04em; /* -4% из Figma */
  text-align: left;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px; /* точный gap из Figma layout_4ZTRPA */
}

.team__title-line {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 16px; /* точный gap из Figma layout_VOLKOM и layout_HCYLOH */
}

.team__title-line-with-icon {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 16px; /* точный gap из Figma layout_HCYLOH */
}

.team__title-icon {
  width: 69px; /* точная ширина из Figma layout_YBMRQW */
  height: 11px; /* точная высота из Figma */
  flex-shrink: 0;
}

.team__title-word {
  display: inline-block;
}

/* Градиент 1: "Мы добиваемся " */
.team__title-word--gradient-1 {
  color: transparent;
  background: linear-gradient(48deg, rgba(234, 234, 234, 1) 53%, rgba(234, 234, 234, 0.96) 79%, rgba(234, 234, 234, 0) 96%); /* точный градиент из Figma fill_5PZ1OB */
  -webkit-background-clip: text;
  background-clip: text;
}

/* Градиент 2: "благодаря" */
.team__title-word--gradient-2 {
  color: transparent;
  background: linear-gradient(63deg, rgba(234, 234, 234, 1) 59%, rgba(234, 234, 234, 0.96) 82%, rgba(234, 234, 234, 0) 97%); /* точный градиент из Figma fill_58ARSD */
  -webkit-background-clip: text;
  background-clip: text;
}

/* Сплошной цвет: "успеха ", "командной", "работе" */
.team__title-word--solid {
  color: #EAEAEA; /* точный цвет из Figma fill_R6EVPM */
}

/* Шрифт NyghtSerif-MediumItalic для слова "успеха" */
.team__title-word--serif {
  font-family: 'Nyght Serif', serif;
  font-weight: 500; /* Medium */
  font-style: italic; /* Italic */
}

.team__description {
  width: 411px; /* точная ширина из Figma layout_U9206C */
  font-family: var(--font-slim);
  font-weight: 400; /* точный weight из Figma style_WSF1DO */
  font-size: 20px; /* точный размер из Figma */
  line-height: 1.2100000381469727em; /* точный line-height из Figma */
  text-align: left;
  color: #898989; /* точный цвет из Figma fill_MLVAH7 */
  margin: 0;
  padding: 0;
}

/* Кнопка телеграм */
.team__telegram-link {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 12px; /* точный gap из Figma layout_FAEKMQ */
  padding: 13px 18px 14px; /* точные padding из Figma */
  width: fit-content;
  height: 50px; /* точная высота из Figma */
  background: #205CDF; /* точный цвет из Figma fill_3PAWF3 */
  border: 1px solid rgba(255, 255, 255, 0.06); /* точный stroke из Figma stroke_HZU7EM */
  border-radius: 12px; /* точный border-radius из Figma */
  text-decoration: none;
  transition: all var(--transition-base);
  cursor: pointer;
  z-index: 6;
}

/* На десктопе кнопка внутри контента абсолютно позиционирована относительно контейнера */
@media (min-width: 1025px) {
  .team__content .team__telegram-link {
    position: absolute;
    left: -1px; /* 49px от контейнера - 50px от контента = -1px */
    top: 437px; /* 606px от контейнера - 169px от контента = 437px */
    display: flex;
  }
}

/* На мобильных кнопка внутри контента относительно позиционирована */
@media (max-width: 1024px) {
  .team__content .team__telegram-link {
    position: relative;
    left: auto;
    top: auto;
    margin: 0;
    display: flex;
  }
}

.team__telegram-link:hover {
  background: #1a4bc4;
  border-color: rgba(255, 255, 255, 0.1);
}

.team__telegram-icon {
  width: 14px; /* точный размер из Figma layout_32Z2YS */
  height: 12px;
  flex-shrink: 0;
  object-fit: contain;
  filter: brightness(0) invert(1); /* иконка белая из Figma fill_OGS4GP */
}

.team__telegram-text {
  font-family: var(--font-primary);
  font-weight: 600; /* точный weight из Figma style_9PAHXS */
  font-size: 19px; /* точный размер из Figma */
  line-height: 0.9473684210526315em; /* точный line-height из Figma */
  letter-spacing: -0.01em; /* -1% из Figma */
  color: #EFF5FF; /* точный цвет из Figma fill_GCQUGE */
  white-space: nowrap;
}

/* Responsive */
@media (max-width: 1920px) {
  .team {
    padding: 0 5%;
  }
  
  .team__container {
    width: 100%;
  }
}

@media (max-width: 1440px) {
  .team {
    padding: 0 3%;
  }
  
  .team__container {
    max-width: 100%;
    height: auto;
    min-height: 699px;
  }
  
  .team__phone-wrapper {
    left: 5%;
    top: -50px;
    width: 90%;
    height: auto;
    max-width: 600px;
  }
  
  .team__content {
    left: 2.6%; /* увеличен отступ слева в 1.3 раза (2% * 1.3) */
    top: 150px;
    width: 90%;
    max-width: 608.61px;
  }
  
  .team__award {
    left: 1.5%;
  }
  
  .team__title {
    font-size: clamp(3rem, 8vw, 84.36px);
  }
}

@media (min-width: 1400px) and (max-width: 1440px) {
  .team__content {
    left: 2.6%; /* увеличен отступ слева в 1.3 раза для 1440-1400px */
  }
  
  .team__award {
    left: 1.5%;
  }
}

@media (max-width: 1024px) {
  .team {
    padding: 0;
    margin-top: 80px;
  }
  
  .team__container {
    max-width: 100%;
    width: 100%;
    height: auto;
    min-height: 500px;
    display: flex;
    flex-direction: column;
    padding: 2rem;
    border-radius: 20px;
    position: relative;
    overflow: hidden;
  }
  
  .team__phone-wrapper {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    margin: 0;
    order: 0;
  }
  
  .team__phone--mobile {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .team__phone--desktop {
    display: none;
  }
  
  .team__content {
    position: relative;
    left: auto;
    top: auto;
    width: 100%;
    max-width: 100%;
    order: 1;
    padding: 0;
    margin-bottom: 2rem;
    z-index: 2;
  }
  
  /* Кнопка внутри контента уже настроена в общем медиа-запросе выше */
  
  .team__award {
    position: absolute;
    left: 2rem;
    top: 2rem;
    width: 120px;
    height: auto;
    z-index: 10;
    margin-bottom: 1rem;
  }
  
  .team__description {
    width: 100%;
    max-width: 100%;
    font-size: 18px;
  }
  
  .team__title {
    font-size: clamp(2.5rem, 7vw, 4.5rem);
    margin-bottom: 1rem;
  }
  
  /* Убираем градиенты, делаем весь текст белым */
  .team__title-word--gradient-1,
  .team__title-word--gradient-2 {
    color: #EAEAEA !important;
    background: none !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
  }
}

@media (max-width: 768px) {
  .team {
    padding: 0;
    margin-top: 60px;
  }
  
  .team__container {
    max-width: 100%;
    width: 100%;
    min-height: 500px;
    border-radius: 20px;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
  }
  
  .team__phone-wrapper {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    margin: 0;
  }
  
  .team__phone--mobile {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .team__phone--desktop {
    display: none;
  }
  
  .team__content {
    margin-bottom: 1.5rem;
    z-index: 2;
    position: relative;
    margin-top: 80px; /* отступ от награды */
  }
  
  /* Кнопка внутри контента - на всю ширину на мобильных */
  .team__content .team__telegram-link {
    width: 100%;
    max-width: 100%;
    align-self: stretch;
    justify-content: center;
  }
  
  .team__award {
    left: 1.5rem;
    top: 1.5rem;
    width: 100px;
    z-index: 10;
    margin-bottom: 1rem;
  }
  
  .team__title {
    font-size: clamp(2.5rem, 9vw, 4rem);
    margin-bottom: 1rem;
  }
  
  /* Убираем градиенты, делаем весь текст белым */
  .team__title-word--gradient-1,
  .team__title-word--gradient-2 {
    color: #EAEAEA !important;
    background: none !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
  }
  
  .team__description {
    font-size: 18px;
    line-height: 1.5;
    width: 100%;
  }
  
  .team__text {
    gap: 1.5rem;
  }
}

@media (max-width: 480px) {
  .team {
    padding: 0;
  }
  
  .team__container {
    max-width: 100%;
    width: 100%;
    min-height: 500px;
    border-radius: 16px;
    padding: 1rem;
    position: relative;
    overflow: hidden;
  }
  
  .team__phone-wrapper {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    margin: 0;
  }
  
  .team__phone--mobile {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .team__phone--desktop {
    display: none;
  }
  
  .team__content {
    margin-bottom: 1rem;
    z-index: 2;
    position: relative;
    margin-top: 70px; /* отступ от награды */
  }
  
  .team__award {
    left: 1rem;
    top: 1rem;
    width: 80px;
    z-index: 10;
    margin-bottom: 1rem;
  }
  
  .team__title {
    font-size: clamp(2rem, 8vw, 3rem);
    margin-bottom: 0.75rem;
  }
  
  /* Убираем градиенты, делаем весь текст белым */
  .team__title-word--gradient-1,
  .team__title-word--gradient-2 {
    color: #EAEAEA !important;
    background: none !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
  }
  
  .team__description {
    font-size: 16px;
    line-height: 1.5;
  }
  
  .team__text {
    gap: 1rem;
  }
  
  .team__telegram-link {
    padding: 14px 18px;
    height: 50px;
    width: 100%;
  }
  
  .team__telegram-text {
    font-size: 17px;
  }
}


