/* Хромовые объекты: текст с хромовым градиентом и CSS-фигуры (сфера, тор, куб, телефон, молекула, конус) */

.chrome-t {
  background: linear-gradient(180deg,#FFFFFF 0%,#E6EAF0 30%,#A2A8B2 46%,#575C66 53%,#959BA5 66%,#E6CDBE 86%,#FFFFFF 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.chrome-c {
  background: linear-gradient(180deg,#FFFFFF 0%,#DDE2E9 36%,#858B96 49%,#33363D 54%,#80868F 70%,#E0E4EA 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.ch-sph {
  display: block;
  border-radius: 50%;
  background: radial-gradient(circle at 33% 26%,rgba(255,255,255,.95) 0 5%,rgba(255,255,255,0) 15%),
    radial-gradient(circle at 50% 50%,transparent 58%,rgba(0,0,0,.5) 100%),
    linear-gradient(180deg,#F4F6F9 0%,#C3C8D0 25%,#6E737D 44%,#0D0E11 50%,#1B1C21 60%,#5B606A 80%,#C8CCD3 100%);
  box-shadow: inset 7px 0 10px -4px rgba(255,77,0,.55),inset -5px -6px 12px rgba(0,0,0,.45);
}

.ch-torus {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: conic-gradient(from 90deg,rgba(255,255,255,0),rgba(255,255,255,.55) 12%,rgba(0,0,0,.35) 30%,rgba(255,77,0,.4) 44%,rgba(0,0,0,.4) 60%,rgba(255,255,255,.6) 82%,rgba(255,255,255,0)),
    radial-gradient(closest-side,transparent 50%,#0C0D10 53%,#E9ECF0 61%,#FFFFFF 65%,#7C818A 72%,#141519 79%,#8A8F98 88%,#DADDE2 94%,#3A3C42 99%,transparent 100%);
  -webkit-mask: radial-gradient(closest-side,transparent 51%,#000 54%,#000 98%,transparent 100%);
  mask: radial-gradient(closest-side,transparent 51%,#000 54%,#000 98%,transparent 100%);
}

.ch-torus-w {
  transform: rotate(-16deg) scaleY(.5);
}

.ch-cube {
  position: relative;
  width: 56px;
  height: 62px;
}

.ch-cube i {
  position: absolute;
  inset: 0;
}

.ch-cube i:nth-child(1) {
  clip-path: polygon(50% 0,100% 25%,50% 50%,0 25%);
  background: linear-gradient(160deg,#FFFFFF 10%,#C4C9D0 45%,#6F747E 100%);
}

.ch-cube i:nth-child(2) {
  clip-path: polygon(0 25%,50% 50%,50% 100%,0 75%);
  background: linear-gradient(180deg,#A5AAB2 0%,#EEF0F3 28%,#2A2C31 50%,#0E0F12 70%,#FF5A1A 100%);
}

.ch-cube i:nth-child(3) {
  clip-path: polygon(50% 50%,100% 25%,100% 75%,50% 100%);
  background: linear-gradient(90deg,#3E4148 0%,#15161A 30%,#2B2D33 70%,#AEB3BB 96%,#FFFFFF 100%);
}

.ch-phone {
  position: relative;
  width: 38px;
  height: 66px;
  border-radius: 11px;
  background: linear-gradient(90deg,#FF6A2A 0%,#8E939C 9%,#FFFFFF 21%,#6C717A 42%,#17181C 58%,#A5AAB2 84%,#F0F2F5 100%);
  transform: rotate(-14deg);
}

.ch-phone::after {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: 8px;
  background: linear-gradient(128deg,#23262D 0%,#050506 44%,#30333A 45%,#0A0B0D 62%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}

.ch-mol {
  position: relative;
  width: 74px;
  height: 62px;
}

.ch-mol svg {
  position: absolute;
  inset: 0;
}

.ch-mol .ch-sph {
  position: absolute;
}

.ch-cone {
  position: relative;
  width: 52px;
  height: 64px;
}

.ch-cone::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 8px;
  clip-path: polygon(50% 0,100% 100%,0 100%);
  background: linear-gradient(90deg,#FF5A1A 0%,#5B4038 9%,#E8EBEF 28%,#FFFFFF 37%,#7A7F88 52%,#141519 66%,#5E626A 86%,#C4C8CF 100%);
}

.ch-cone::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 2px;
  height: 13px;
  border-radius: 50%;
  background: linear-gradient(90deg,#8A4A30,#C8CCD3 30%,#FFFFFF 42%,#5A5E66 66%,#1A1B1F);
}