.models {
  padding: 75px 0;
}

.model-heading {
  text-align: center;
  min-height: 154px;
  color: #ffffff;
  text-shadow: 0 1px 5px #000000;
}

.model-heading h2 {
  font-size: 41.4px;
  font-weight: 600;
}

.model-grid {
  width: 80%;
  max-width: 1200px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 30px;
  align-items: start;
}

.model-card {
  background: #ffffff;
  box-shadow: 0 1px 4px #00000055;
  text-align: center;
}

.model-color {
  height: 140px;
}

.color1 .model-color {
  background: #03a9f4;
}

.color2 .model-color {
  background: #4caf50;
}

.color3 .model-color {
  background: #fbc02d;
}

.color4 .model-color {
  background: #8c239f;
}

.color8 .model-color {
  background: #17f403;
}

.color9 .model-color {
  background: #cf0808;
}

.color10 .model-color {
  background: #03f3f4;
}

.color11 .model-color {
  background: #fcff00;
}

.model-info {
  padding: 0 20px;
}

.avatar-placeholder {
  width: 120px;
  height: 120px;
  border: 5px solid #ffffff;
  border-radius: 50%;
  margin: -60px auto 27px;
  background: #eeeeee;
  color: #666666;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  position: relative;
}

.model-info h3 {
  color: #333333;
  font-size: 21.6px;
  line-height: 1.3;
  margin-bottom: 32px;
}

.model-info p {
  margin-bottom: 20px;
  text-align: center;
}

.model-social {
  border-top: 1px solid #d6d6d6;
  margin-inline: 20px;
  padding: 18px 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
  color: #666666;
}

.model-social .icon {
  font-size: 24px;
  color: #ff0000;
}

.model-social > span:not(.icon) {
  font-size: 11px;
}

.line-section {
  background: rgb(22 221 252 / 72%);
  color: #ffffff;
  padding: 40px 0;
}

.line-inner {
  width: 80%;
  max-width: 1200px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 30px;
}

.line-copy h2 {
  font-size: 36px;
  font-weight: 300;
  line-height: 1.2;
  margin-bottom: 10px;
}

.line-assets {
  display: flex;
  gap: 20px;
  align-items: center;
  justify-content: flex-end;
}

.line-button-placeholder {
  padding: 10px 20px;
  border: 1px dashed #ffffff;
  font-size: 20px;
  text-align: center;
}

.line-button-placeholder span {
  display: block;
  font-size: 11px;
}

.qr-placeholder {
  width: 120px;
  height: 120px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px dashed #777777;
  background: #ffffff;
  color: #555555;
  text-align: center;
  font-size: 13px;
}

.site-footer {
  background: #ffffff;
  padding: 28px 5%;
  font-size: 14px;
  text-align: center;
  color: #666666;
}

.footer-social {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}

.footer-social .icon {
  font-size: 23px;
}

.footer-social > a {
  padding: 9px 6px;
}

.footer-line {
  border: 1px dashed #888888;
  padding: 6px 12px !important;
  line-height: 1.2;
}

.footer-line span {
  display: block;
  font-size: 10px;
  margin-top: 4px;
}

.contact-pending {
  font-size: 12px;
}

.error-page {
  min-height: 100vh;
  background: #ffffff;
  text-align: center;
  padding: 15vh 20px;
}

.error-page h1 {
  font-size: 42px;
  color: #333333;
  margin: 25px 0;
}

.error-page p {
  margin-bottom: 30px;
}