/* Полоса преимуществ, секции аналитики/диверсификации/целей/выплат, типы активов, подвал */
.value-strip {
  position:relative;
  z-index:3;
  border-block:1px solid rgba(0,214,241,.2);
  background:linear-gradient(180deg,rgba(6,37,50,.73),rgba(3,16,25,.97));
}
.value-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;
}
.benefit {
  padding:21px 17px;
  display:flex;
  align-items:flex-start;
  gap:14px;
  border-right:1px solid rgba(10,131,154,.28);
}
.benefit:first-child {
  padding-left:0;
}
.benefit:last-child {
  border-right:0;
  padding-right:0;
}
.benefit-symbol {
  width:45px;
  height:45px;
  flex:0 0 45px;
  border:1px solid rgba(10,221,236,.56);
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#00e7ef;
  background:rgba(3,53,69,.36);
  box-shadow:inset 0 0 12px rgba(0,209,234,.07);
}
.benefit-symbol .icon {
  width:21px;
  height:21px;
}
.benefit h2 {
  font-size:13px;
  font-weight:740;
  margin:2px 0 4px;
  letter-spacing:-.01em;
}
.benefit p {
  font-size:11.5px;
  color:#9bb4c0;
  line-height:1.37;
  margin:0;
}

.section {
  position:relative;
  padding:83px 0;
  isolation:isolate;
}
.section::before {
  content:"";
  z-index:-1;
  position:absolute;
  inset:0;
  background:radial-gradient(ellipse at 75% 50%,rgba(0,140,175,.07),transparent 54%);
  pointer-events:none;
}
.section.section-div {
  border-top:1px solid rgba(0,181,204,.1);
  background:linear-gradient(180deg,#030b11,#020c13 50%,#020a10);
}
.section.section-goals {
  border-block:1px solid rgba(0,181,204,.14);
  background:radial-gradient(ellipse at 40% 90%,rgba(0,179,205,.085),transparent 62%),#030b11;
  padding:76px 0;
}
.section-grid {
  display:grid;
  grid-template-columns:minmax(300px,.74fr) minmax(0,1.26fr);
  gap:63px;
  align-items:center;
}
.section-grid.reverse {
  grid-template-columns:minmax(0,1.22fr) minmax(300px,.78fr);
}
.overline {
  color:var(--cyan);
  font-size:11px;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
  margin-bottom:17px;
  display:block;
}
.section h2 {
  font-size:clamp(31px,3.3vw,48px);
  line-height:1.1;
  margin-bottom:18px;
  font-weight:780;
}
.section-text {
  font-size:15px;
  max-width:460px;
  color:#acc1cf;
  margin-bottom:24px;
}
.check-list {
  padding:0;
  margin:0;
  list-style:none;
  display:grid;
  gap:13px;
}
.check-list li {
  display:flex;
  align-items:center;
  gap:10px;
  color:#ccdfe8;
  font-size:13px;
}
.check-list .icon {
  width:18px;
  height:18px;
  padding:3px;
  border:1px solid #02deeb;
  border-radius:50%;
  color:#02e7ec;
}
.feature-panel {
  position:relative;
  border:1px solid rgba(10,204,237,.52);
  background:linear-gradient(130deg,#061a26,#020b13);
  box-shadow:0 32px 65px rgba(0,0,0,.25),0 0 65px rgba(0,202,235,.09),inset 0 0 25px rgba(0,190,231,.023);
  border-radius:13px;
  padding:14px;
  overflow:hidden;
}
.feature-panel:before {
  content:"";
  position:absolute;
  width:300px;
  height:250px;
  border-radius:50%;
  right:-110px;
  top:-110px;
  background:rgba(2,228,255,.075);
  filter:blur(55px);
  pointer-events:none;
}
.feature-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:12px;
  padding:4px 5px 14px;
}
.feature-top .mini-brand {
  display:flex;
  align-items:center;
  gap:7px;
  font-weight:760;
}
.feature-top .whale {
  width:20px;
  height:16px;
}
.tag-demo {
  border:1px solid rgba(7,214,235,.38);
  border-radius:6px;
  padding:4px 8px;
  font-size:10px;
  color:#8ee5f2;
}
.feature-main-grid {
  display:grid;
  grid-template-columns:1.75fr .68fr;
  gap:10px;
}
.kpi-window {
  border:1px solid rgba(7,155,185,.45);
  border-radius:8px;
  padding:18px;
  background:rgba(0,8,16,.58);
  min-width:0;
}
.caption {
  color:#829daa;
  font-size:10px;
  letter-spacing:.06em;
  font-weight:650;
}
.large-figure {
  display:block;
  font-size:27px;
  font-weight:760;
  margin:3px 0;
}
.profit-figure {
  color:#15e9ac;
  font-size:14px;
}
.main-window-graph {
  height:182px!important;
  margin-top:13px;
}
.kpi-rate {
  display:flex;
  flex-direction:column;
  gap:13px;
}
.kpi-rate .metric {
  border:1px solid rgba(7,155,185,.45);
  border-radius:8px;
  padding:20px 15px;
  min-height:81px;
  background:rgba(0,8,16,.55);
}
.kpi-rate .metric span {
  display:block;
  color:#99b0bc;
  font-size:12px;
  margin-bottom:7px;
}
.kpi-rate strong {
  font-size:21px;
  color:#17e4b1;
}
.feature-bottom-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:10px;
}
.feature-card {
  border:1px solid rgba(7,155,185,.45);
  border-radius:8px;
  padding:14px 17px;
  background:rgba(0,8,16,.5);
  min-height:146px;
}
.feature-card h3 {
  font-size:11.5px;
  letter-spacing:normal;
  margin:0 0 11px;
  font-weight:700;
}
.wide-bars {
  height:78px;
  display:flex;
  gap:12px;
  align-items:flex-end;
  border-bottom:1px solid #134a58;
  padding:0 7px;
}
.wide-bars span {
  width:100%;
  height:var(--bar);
  background:linear-gradient(#00eff0,#007eaa);
  border-radius:3px 3px 0 0;
}
.wide-donut {
  display:flex;
  gap:20px;
  align-items:center;
}
.wide-donut .donut-large {
  height:93px;
  width:93px;
  flex-basis:93px;
}
.wide-donut .donut-large:after {
  inset:21px;
}
.wide-donut .legend {
  font-size:10px;
  gap:8px;
}
.analytics-glow {
  position:absolute;
  z-index:-1;
  top:-20px;
  right:15%;
  width:700px;
  height:300px;
  background:radial-gradient(ellipse,rgba(7,170,208,.13),transparent 61%);
  filter:blur(15px);
}

.div-app {
  position:relative;
  border-radius:12px;
  border:1px solid rgba(13,207,232,.45);
  background:linear-gradient(135deg,#061b25,#020b12 67%);
  padding:18px;
  min-height:360px;
  box-shadow:0 25px 62px rgba(0,0,0,.29),0 0 50px rgba(0,202,235,.07);
}
.div-top {
  display:flex;
  justify-content:space-between;
  gap:8px;
  align-items:center;
}
.div-top h3 {
  margin:0 0 4px;
  font-size:21px;
}
.div-sub {
  font-size:11px;
  color:#94adbb;
}
.div-chips {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:20px 0 18px;
}
.div-chips span {
  padding:8px 11px;
  border:1px solid #1b586b;
  border-radius:6px;
  font-size:10.5px;
  color:#a0bbc7;
}
.div-chips span:first-child {
  color:var(--cyan);
  border-color:#01d7e8;
  background:rgba(0,219,226,.12);
}
.div-bottom {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.div-pane {
  border:1px solid rgba(11,139,170,.4);
  background:rgba(2,12,19,.45);
  border-radius:8px;
  padding:16px;
}
.div-pane h4 {
  margin:0 0 22px;
  font-size:12px;
}
.div-top-line {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:5px;
}
.div-top-line strong {
  font-size:30px;
  color:var(--cyan);
}
.div-top-line small {
  font-size:10px;
  color:#93aab8;
}
.progress-row {
  display:flex;
  gap:9px;
  align-items:center;
  margin-top:13px;
  font-size:10px;
  color:#a4bfcb;
}
.progress-row label {
  min-width:87px;
}
.progress-row .rail {
  flex:1;
  height:8px;
  border-radius:4px;
  background:#092939;
  overflow:hidden;
}
.progress-row i {
  display:block;
  background:linear-gradient(90deg,#2799ed,#08e2eb);
  width:var(--bar);
  height:100%;
  border-radius:4px;
}
.right-feature .section-text {
  max-width:430px;
}
.subtle-tag {
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:#d4a0ff;
  background:rgba(120,47,195,.14);
  border:1px solid rgba(185,112,246,.3);
  border-radius:6px;
  font-size:11px;
  padding:6px 9px;
  margin-top:22px;
}
.subtle-tag .icon {
  width:14px;
  height:14px;
}

.bottom-grid {
  display:grid;
  grid-template-columns:minmax(0,.79fr) minmax(0,1.06fr) minmax(0,.85fr);
  gap:23px;
  align-items:stretch;
}
.bottom-copy {
  padding-top:13px;
}
.bottom-copy h2 {
  font-size:35px;
}
.bottom-copy p {
  font-size:13px;
}
.bottom-copy .check-list {
  margin-top:18px;
}
.bottom-copy .check-list li {
  font-size:11.5px;
}
.goals-visual,.payouts-visual {
  border:1px solid rgba(13,191,221,.5);
  border-radius:11px;
  background:linear-gradient(145deg,#071a22,#030c13);
  box-shadow:0 0 65px rgba(5,155,191,.06);
  padding:17px;
  min-width:0;
}
.card-title {
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:12px;
  font-weight:700;
  gap:5px;
  margin-bottom:19px;
}
.chart-target {
  height:210px;
  width:100%;
}
.chart-target .gridline {
  stroke:rgba(27,129,151,.28);
  stroke-width:1;
}
.goals-legend {
  display:flex;
  gap:14px;
  color:#8aabb8;
  font-size:10px;
  flex-wrap:wrap;
}
.goals-legend span:before {
  content:"";
  display:inline-block;
  width:14px;
  height:2px;
  background:var(--cyan);
  vertical-align:middle;
  margin-right:6px;
}
.goals-legend span:nth-child(2):before {
  background:#ffac44;
}
.payouts-visual .bar-graph {
  height:207px;
  gap:9px;
  margin-top:10px;
}
.payouts-visual .bar-graph span {
  background:linear-gradient(#04e8df,#096787);
}
.pay-axis {
  display:flex;
  justify-content:space-between;
  color:#819ca8;
  font-size:9px;
  margin-top:8px;
}
.section-assets {
  padding:31px 0 48px;
  background:linear-gradient(180deg,#03121b,#020a10);
  border-top:1px solid rgba(0,160,183,.27);
}
.assets-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px;
}
.assets-inner .overline {
  margin:0;
  white-space:nowrap;
  font-size:10px;
}
.assets-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  flex:1;
}
.asset {
  border:1px solid rgba(8,143,172,.29);
  border-radius:10px;
  min-height:75px;
  background:rgba(6,26,38,.65);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:9px 10px;
  font-size:11px;
  white-space:nowrap;
}
.asset-icon {
  width:32px;
  height:32px;
  border-radius:8px;
  background:rgba(4,104,145,.16);
  display:grid;
  place-items:center;
  color:var(--cyan);
}
.asset-icon .icon {
  width:18px;
  height:18px;
}
.asset-icon.blue {
  color:#4a9ff9;
}
.asset-icon.violet {
  color:#bb6dff;
}
.asset-icon.orange {
  color:#ffb13c;
}
.asset-icon.pink {
  color:#ff637c;
}
.asset-icon.green {
  color:#2ce5b6;
}
.asset-icon.indigo {
  color:#8c8cff;
}
.asset-icon.gold {
  color:#f2c94c;
}
.footer {
  padding:24px 0 36px;
  background:#01070c;
  border-top:1px solid rgba(11,125,152,.26);
}
.footer-inner {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:25px;
}
.footer .brand {
  font-size:17px;
}
.footer .brand .whale {
  width:26px;
  height:22px;
}
.footer small {
  font-size:10.5px;
  color:#788f9f;
  max-width:480px;
  text-align:right;
}

.js .fade-up {
  transition:opacity .65s ease,transform .65s ease;
  opacity:0;
  transform:translateY(17px);
}
.js .fade-up.in-view {
  opacity:1;
  transform:none;
}

.feature-panel,.div-app,.goals-visual,.payouts-visual {
  transition:box-shadow .35s ease,border-color .35s ease;
}

@media (hover:hover) {
  .feature-panel:hover,.div-app:hover,.goals-visual:hover,.payouts-visual:hover {
    border-color:rgba(32,222,239,.67);
    box-shadow:0 30px 72px rgba(0,0,0,.34),0 0 48px rgba(0,190,228,.11);
  }
}