/* Start:/local/templates/Spoda/sport/partials/stars/detail.css?176373894911962*/
:root {
  --gap-8: 0.5rem;
  --gap-10: 0.625rem;
  --gap-12: 0.75rem;
  --gap-16: 1rem;
  --gap-24: 1.5rem;
  --gap-32: 2rem;
  --gap-64: 4rem;
  --gap-96: 6rem;

  --font: var(
    --font-family,
    "Onest",
    Inter,
    system-ui,
    -apple-system,
    "Segoe UI",
    Arial,
    sans-serif
  );
  --text: var(--chernyy-osnovnoy, #0b1020);
  --text-60: var(--chernyy-600, rgba(11, 16, 32, 0.6));
  --chip-bg: var(--servyy-osnovnoy, #eceff3);
  --stub: #f3f5f8;
}

/* страница */
.dtl {
  display: grid;
  row-gap: var(--gap-96);
  font-family: var(--font);
  color: var(--text);
  padding-bottom: 9rem;
  padding-top: 2.5rem;
}

.back_to_svg {
  width: 1.125rem;
  height: 1.125rem;
}

.dtl__empty {
  display: grid;
  place-items: center;
  min-height: 12.5rem;
}

/* верх: 4 колонки */
.dtl__head {
  display: grid;
  grid-template-columns: 22.5rem 1fr 1fr 1fr;
  column-gap: var(--gap-24);
  align-items: start;
}

.dtl__col-photo {
  display: grid;
}

.dtl__img {
  display: block;
  width: 100%;
  height: 26.25rem;
  object-fit: cover;
  border-radius: 2.75rem;
}

.dtl__col-main {
  display: grid;
  row-gap: 2.5rem;
  grid-column: 2 / 4;
}
.dtl__g-title,
.dtl__g-rest {
  display: grid;
  row-gap: 1rem;
}
.dtl__col-void {
  display: grid;
}

.dtl__title {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: 2.75rem;
  line-height: 120%;
  letter-spacing: -0.02em;
  color: var(--chernyy-osnovnoy);
}

.dtl__birth {
  font-family: var(--font-family);
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 150%;
  letter-spacing: -0.02em;
  color: var(--chernyy-600);
}

.dtl__sport {
  display: inline-grid;
  place-items: center;
  background: var(--servyy-osnovnoy);
  border-radius: 0.75rem;
  padding: 0.75rem 0.5rem;
  font-family: var(--font-family);
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 96%;
  letter-spacing: -0.02em;
  color: var(--chernyy-600);
  width: max-content;
}

.dtl__titles {
  display: grid;
  row-gap: var(--gap-8);
}

.dtl__titleline {
  font-family: var(--font-family);
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 150%;
  letter-spacing: -0.02em;
  color: var(--chernyy-osnovnoy);
}

/* группы достижений */
.dtl__groups {
  display: grid;
  row-gap: var(--gap-96);
}

.ach {
  display: grid;
  row-gap: 3rem;
}

.ach__title {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: 2.75rem;
  line-height: 120%;
  letter-spacing: -0.02em;
  color: var(--chernyy-osnovnoy);
}

/* разделитель */
/* Разделитель: одна тонкая линия по центру, симметрично 4rem вверх/вниз */
.sep {
  grid-column: 1 / -1; /* на всю ширину сетки */
  position: relative;
  padding-block: 1rem; /* толчок вверх/вниз */
}

.sep::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%; /* линия строго по центру */
  height: 0.0625rem;
  background: rgba(0, 0, 0, 0.1); /* тонкая, как просил */
  transform: translateY(-0.0313rem);
}

/* Паралимпиада: 1 | 2-3 | 4 */
.ach--one .ach__row {
  display: grid;
  grid-template-columns: 20.875rem 2fr 1fr;
  column-gap: var(--gap-24);
  row-gap: var(--gap-24);
  align-items: start;
}

.ach__iconwrap {
  display: grid;
  align-content: start;
}

.ach__icon {
  display: block;
  width: 20.875rem;
  height: 20.875rem;
  object-fit: scale-down;
  border-radius: 2.75rem;
  background: var(--servyy-osnovnoy);
}

.ach__stack {
  display: grid;
  row-gap: 2rem;
}
/* между ПУНКТАМИ: 40px */
.ach__meta {
  display: grid;
  row-gap: 2.5rem;
}

/* внутри одного пункта: заголовок ↔ список */
.ach__metagroup {
  display: grid;
  row-gap: 0.5rem;
}

/* между строками перечисления: 8px (как и было) */
.ach__list {
  display: grid;
  row-gap: 0.5rem;
}

.ach__name {
  font-weight: 500;
  font-size: 2rem;
  line-height: 120%;
  letter-spacing: -0.02em;
  color: var(--text);
}

/* медали */
.medal {
  display: grid;
  grid-template-columns: max-content 1fr;
  column-gap: var(--gap-16);
  align-items: center;
}

.medal__chip {
  display: inline-grid;
  grid-auto-flow: column;
  grid-auto-columns: max-content;
  align-items: center;
  gap: var(--gap-10);
  border-radius: 0.75rem;
  padding: 0.75rem 0.5rem;
  background: var(--chip-bg);
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 0.96;
  letter-spacing: -0.02em;
  color: var(--text);
  width: 6.5625rem;
}

.medal__chip svg {
  display: block;
  width: 1.25rem;
  height: 1.25rem;
}

.medal__text {
  font-weight: 500;
  font-size: 1.25rem;
  line-height: 150%;
  letter-spacing: -0.02em;
  color: var(--text-60);
}

/* мета */
.ach__meta {
  display: grid;
}

.ach__metatitle {
  font-family: var(--font-family);
  font-weight: 400;
  font-size: 1.25rem;
  line-height: 150%;
  letter-spacing: -0.02em;
  color: var(--chernyy-600);
}

.ach__list {
  display: grid;
  row-gap: var(--gap-8);
}

.ach__line {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: 1.125rem;
  line-height: 150%;
  letter-spacing: -0.02em;
  color: var(--chernyy-osnovnoy);
}

/* Мир/Европа: по два в ряд */
.ach--two .ach__grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  column-gap: 1.25rem;
  row-gap: 4rem;
}

.ach--two .achcard {
  display: grid;
  row-gap: 1.5rem;
  grid-column: span 2;
}

.achcard__title {
  font-weight: 500;
  font-size: 2rem;
  line-height: 120%;
  letter-spacing: -0.02em;
}
.dtl {
  display: grid;
  row-gap: 2rem;
  font-family: var(--font-family);
  color: var(--chernyy-osnovnoy);
}

.dtl__body {
  display: grid;
  row-gap: 6rem;
}

.dtl-back {
  display: inline-grid;
  grid-auto-flow: column;
  grid-auto-columns: max-content;
  align-items: center;
  gap: 0.5rem;
  border-radius: 1rem;
  padding: 1rem 0.75rem;
  font-family: var(--font-family);
  font-weight: 500;
  font-size: 1rem;
  line-height: 96%;
  letter-spacing: -0.02em;
  color: var(--chernyy-600);
  width: max-content;
  text-decoration: none;
}

.dtl-back__ico {
  display: grid;
  width: 1.125rem;
  height: 1.125rem;
}

@media (hover: hover) {
}

/* hover и motion */
@media (hover: hover) {
  .dtl__img {
    transition: transform 0.24s ease;
  }
}

@media (hover: none) {
  .medal__chip:active {
    transform: scale(0.98);
  }
}

@media (max-width: 64rem) {
  .ach--two .ach__grid {
    row-gap: 0;
  }

  .ach--two .achcard {
    padding-block: 3rem;
    border-top: 0.0625rem solid rgba(0, 4, 19, 0.08);
  }
  .ach--two .achcard:first-child {
    border-top: none;
    padding-top: 0;
  }
  .ach--two .achcard:last-child {
    border-bottom: 0.0625rem solid rgba(0, 4, 19, 0.08);
  }
}
@media (max-width: 33.75rem) {
  .ach--two .achcard {
    padding-block: 2rem;
  }
}

/* адаптивы */
@media (max-width: 64rem) {
  .dtl__head {
    grid-template-columns: 1fr 1fr;
    row-gap: var(--gap-24);
  }
  .dtl__titles {
    font-weight: 400;
    font-size: 1.25rem;
    line-height: 150%;
    letter-spacing: -0.02em;
  }
  .dtl__col-main {
    grid-column: auto;
  }
  .dtl__col-void {
    display: none;
  }

  .ach--one .ach__row {
    grid-template-columns: 12.5rem 1fr;
  }

  .ach__meta {
    grid-column: 1 / -1;
  }

  .ach--two .ach__grid {
    grid-template-columns: 1fr 1fr;
  }
  .dtl__col-main {
    row-gap: 2rem;
  }
  .dtl__body {
    row-gap: 4rem;
  }
  .ach__stack {
    row-gap: 1.5rem;
  }
  .sep {
    padding-block: 0;
  }
}

/* === TABLET ONLY: 1024↓ и выше мобилки === */
@media (max-width: 64rem) and (min-width: 33.8125rem) {
  .dtl .ach--one .ach__row {
    grid-template-columns: 10.3125rem 1fr 1fr 1fr;
    column-gap: 1.25rem;
    row-gap: 2.5rem;
    align-items: start;
  }
  .dtl-back {
    padding-left: 0;
    font-size: 1.25rem;
    line-height: 150%;
  }
  .dtl .ach--one .ach__iconwrap {
    grid-column: 1;
  }
  .dtl .ach--one .ach__icon {
    width: 6.25rem;
    height: 10.3125rem;
  }

  .dtl .ach--one .ach__stack {
    grid-column: 2 / 5;
  }
  .dtl .ach--one .ach__meta {
    grid-column: 2 / 5;
  }
}
.dtl {
  --icon-scale: 1;
}

.ach__iconwrap {
  display: grid;
  place-items: center;
  border-radius: 2.75rem;
  background: var(--servyy-osnovnoy);
}
.ach__icon {
  background: transparent;
  border-radius: 0;
}
@media (max-width: 64rem) and (min-width: 33.76rem) {
  .dtl {
    --icon-scale: 0.75;
    padding-bottom: 6rem;
  }
}
@media (max-width: 33.75rem) {
  .dtl {
    --icon-scale: 1;
  }
}

@media (max-width: 33.75rem) {
  .dtl__head {
    grid-template-columns: 1fr;
  }
  .dtl__img {
    height: 20rem;
  }
  .ach--one .ach__row {
    grid-template-columns: 1fr;
  }
  .ach__icon {
    width: 100%;
    height: 11.25rem;
  }
  .ach--two .ach__grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 33.75rem) {
  .dtl__head {
    grid-template-columns: 1fr;
    row-gap: var(--gap-24);
  }

  /* превращаем внутренний столбец в "прозрачный" контейнер */
  .dtl__col-main {
    display: contents;
  }

  /* Порядок элементов:
     1 — ФИО + дата
     2 — Фото
     3 — Должность и остальные титулы
  */
  .dtl__g-title {
    order: 1;
  }

  .dtl__col-photo {
    order: 2;
  }

  .dtl__g-rest {
    order: 3;
  }

  .dtl__sport {
    display: none;
  }

  .dtl__img {
    height: 20rem;
  }

  .dtl__head {
    grid-template-columns: 1fr;
    row-gap: var(--gap-24);
  }
  .dtl__body {
    row-gap: 4rem;
  }
  .ach__title {
    font-weight: 500;
    font-size: 2rem;
    line-height: 110%;
    letter-spacing: -0.02em;
  }
  .ach__iconwrap {
    display: none;
  }
  .ach {
    row-gap: 2.5rem;
  }
  .ach__stack {
    padding-top: 0.5rem;
  }
  .ach__name {
    font-weight: 500;
    font-size: 1.5rem;
    line-height: 110%;
    letter-spacing: -0.02em;
    padding-bottom: 1rem;
  }
  .ach__stack {
    row-gap: 1rem;
  }
  .medal {
    column-gap: 0.625rem;
  }
  .medal__chip {
    border-radius: 0.75rem;
    padding: 0.5rem;
    font-weight: 500;
    font-size: 0.875rem;
    line-height: 136%;
    letter-spacing: -0.02em;
  }
  .medal__text {
    font-weight: 500;
    font-size: 1rem;
    line-height: 150%;
    letter-spacing: -0.02em;
  }
  .ach__metatitle {
    font-weight: 400;
    font-size: 1rem;
    line-height: 150%;
    letter-spacing: -0.02em;
  }
  .ach--one .ach__row {
    row-gap: 2rem;
  }
  .ach__meta {
    row-gap: 1.5rem;
  }
  .dtl__groups {
    row-gap: 4rem;
  }
  .achcard__title {
    font-weight: 500;
    font-size: 1.5rem;
    line-height: 110%;
    letter-spacing: -0.02em;
    padding-bottom: 1rem;
  }
  .ach--two .achcard {
    row-gap: 1rem;
  }
  .ach--two .ach__grid {
    column-gap: 0;
  }
  .dtl {
    padding-bottom: 4rem;
    padding-top: 2rem;
    row-gap: 2.5rem;
  }
  .dtl__title {
    font-weight: 500;
    font-size: 2rem;
    line-height: 110%;
    letter-spacing: -0.02em;
  }
  .dtl__birth {
    font-weight: 500;
    font-size: 1rem;
    line-height: 150%;
    letter-spacing: -0.02em;
  }
  .dtl__titles {
    font-weight: 500;
    font-size: 1rem;
    line-height: 150%;
    letter-spacing: -0.02em;
  }
  .dtl-back {
    padding-left: 0;
  }
}

/* End */
/* /local/templates/Spoda/sport/partials/stars/detail.css?176373894911962 */