.portrait-name>span:last-child {
  width: 100%;
  margin-left: 14px;
  font-size: 14px;
  letter-spacing: .3px;
  font-weight: 400;
  color: #aec7d1;
}
.floating-code {
  position: absolute;
  right: -20px;
  bottom: 64px;
  width: 230px;
  background: #112c38f2;
  border: 1px solid #46708280;
  border-radius: 7px;
  transform: rotate(3deg);
  box-shadow: 0 15px 35px #05151e60;
  backdrop-filter: blur(10px);
}
.floating-code>div {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 10px 12px;
  border-bottom: 1px solid #35505e60;
}
.floating-code i {
  height: 4px;
  width: 4px;
  border-radius: 50%;
  background: #3c6675;
}
.floating-code i:first-child {
  background: #d07d73;
}
.floating-code i:nth-child(2) {
  background: #c9b978;
}
.floating-code i:nth-child(3) {
  background: #61ad9c;
}
.floating-code>div>span {
  font-family: monospace;
  font-size: 14px;
  color: #8ba9b6;
  margin-left: 13px;
}
.floating-code code {
  display: block;
  padding: 15px;
  font-size: 14px;
  line-height: 1.9;
  color: #d7e4eb;
}
.floating-code code>span {
  color: #a2a5e9;
}
.floating-code em {
  font-style: normal;
  color: #75d6c8;
}
.portrait-badge {
  position: absolute;
  left: -10px;
  top: 52px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 12px 14px;
  background: #edf8fa;
  border: 1px solid #fff;
  border-radius: 4px;
  transform: rotate(-5deg);
  box-shadow: 0 5px 20px #04151f30;
  color: #52717d;
  font-size: 14px;
  line-height: 1.9;
  letter-spacing: .7px;
}
.portrait-badge>svg {
  width: 22px;
  height: 26px;
  color: #039cb7;
}
.portrait-badge strong {
  font-size: 14px;
  color: var(--navy);
}
.visual-corner {
  position: absolute;
  right: -30px;
  top: 4px;
  font-size: 28px;
  font-weight: 300;
  color: #2d697c;
}
.hero-bottom {
  border-top: 1px solid #54748330;
  display: flex;
  justify-content: space-between;
  padding-block: 20px;
  font-size: 14px;
  letter-spacing: 1.7px;
  color: #638795;
}
.hero-bottom>a {
  display: flex;
  align-items: center;
  gap: 20px;