/* SEEEx Mobile Website v1.6 — hierarchy correction and restrained dark visual system */

.about-directory-grid .directory-card {
  min-height: 205px;
}

.about-directory-grid .directory-card p {
  min-height: 4.65em;
}

.technology-evidence {
  position: relative;
  gap: 10px;
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.technology-evidence figure,
.technology-evidence figure:first-child {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgba(130, 235, 225, 0.14);
  border-radius: 20px;
  background:
    linear-gradient(180deg, rgba(3, 7, 9, 0.26), rgba(3, 7, 9, 0.94)),
    url("./assets/official/v16/backgrounds/technology-field.webp") center / cover;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035), 0 24px 64px rgba(0, 0, 0, 0.22);
}

.technology-evidence figure::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(circle at 76% 20%, rgba(67, 220, 208, 0.08), transparent 42%);
}

.technology-evidence figure:nth-child(2) {
  background-position: 38% 44%;
}

.technology-evidence figure:nth-child(3) {
  background-position: 62% 56%;
}

.technology-evidence figure:nth-child(4) {
  background-position: 80% 72%;
}

.technology-evidence-media {
  min-height: 230px;
  padding: clamp(14px, 3vw, 28px);
  background: transparent;
}

.technology-evidence img {
  width: 100%;
  height: 100%;
  max-height: 27rem;
  opacity: 0.96;
  object-fit: contain;
  filter: drop-shadow(0 18px 28px rgba(0, 0, 0, 0.34));
}

.technology-evidence figcaption {
  position: relative;
  gap: 8px;
  padding: clamp(18px, 3vw, 30px);
  color: #f1f7f6;
  background: linear-gradient(180deg, rgba(5, 10, 12, 0.16), rgba(5, 10, 12, 0.88));
}

.technology-evidence figcaption span {
  color: var(--cyan);
}

.technology-evidence figcaption h3 {
  color: #f3f8f7;
  font-weight: 520;
}

.technology-evidence figcaption p {
  color: rgba(220, 232, 230, 0.68);
}

.relations-route .route-hero {
  background:
    linear-gradient(180deg, rgba(3, 6, 7, 0.3), rgba(3, 6, 7, 0.96)),
    url("./assets/official/v16/backgrounds/relations-field.webp") center 72% / cover;
}

.relations-route-content {
  position: relative;
  isolation: isolate;
  max-width: 1100px;
}

.relations-route-content::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  z-index: -1;
  height: min(82svh, 760px);
  border-radius: 34px;
  opacity: 0.42;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(3, 7, 8, 0.08), var(--bg) 92%),
    url("./assets/official/v16/backgrounds/relations-field.webp") center / cover;
  mask-image: linear-gradient(#000, transparent);
}

.relations-columns {
  display: grid;
  gap: 14px;
}

.relation-section {
  position: relative;
  overflow: hidden;
  padding: 18px;
  border: 1px solid rgba(130, 235, 225, 0.13);
  border-radius: 22px;
  background:
    linear-gradient(155deg, rgba(23, 44, 45, 0.62), rgba(4, 9, 10, 0.94) 48%),
    url("./assets/official/v16/backgrounds/relations-field.webp") center / cover;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035), 0 26px 70px rgba(0, 0, 0, 0.2);
}

.relation-section > header {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: end;
  margin-bottom: 18px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(130, 235, 225, 0.12);
}

.relation-section > header > span {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid rgba(130, 235, 225, 0.2);
  border-radius: 50%;
  color: var(--green);
  font: 600 9px/1 var(--font-mono, monospace);
}

.relation-section header p,
.relation-section header h2,
.relation-section header em {
  margin: 0;
}

.relation-section header p {
  color: var(--cyan);
  font-size: 8px;
  letter-spacing: 0.12em;
}

.relation-section header h2 {
  margin-top: 5px;
  color: #f3f8f7;
  font-size: clamp(25px, 7vw, 40px);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -0.045em;
}

.relation-section header em {
  align-self: center;
  color: rgba(219, 231, 229, 0.48);
  font-size: 9px;
  font-style: normal;
}

.relation-logo-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.relation-logo-grid figure {
  display: grid;
  min-width: 0;
  min-height: 92px;
  margin: 0;
  padding: 14px 10px;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 14px;
  background:
    radial-gradient(circle at 50% 0%, rgba(66, 205, 194, 0.09), transparent 58%),
    rgba(3, 8, 10, 0.74);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.026);
}

.relation-logo-grid img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 58px;
  object-fit: contain;
  filter: drop-shadow(0 7px 12px rgba(0, 0, 0, 0.25));
}

.partner-logo-grid-v16 {
  max-height: min(62svh, 660px);
  padding-right: 4px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  scrollbar-color: rgba(65, 217, 206, 0.34) transparent;
  scrollbar-width: thin;
}

.partner-logo-grid-v16::-webkit-scrollbar {
  width: 3px;
}

.partner-logo-grid-v16::-webkit-scrollbar-thumb {
  border-radius: 99px;
  background: rgba(65, 217, 206, 0.34);
}

.relations-source {
  margin-top: 22px;
}

@media (max-width: 700px) {
  .technology-evidence figure,
  .technology-evidence figure:first-child {
    grid-template-columns: 1fr;
    grid-template-rows: minmax(12rem, auto) auto;
    border-radius: 18px;
  }

  .technology-evidence figure:first-child .technology-evidence-media,
  .technology-evidence-media {
    min-height: 210px;
  }

  .technology-evidence img {
    max-height: 20rem;
  }

  .about-directory-grid .directory-card {
    min-height: 214px;
  }

  .relation-section {
    padding: 15px;
    border-radius: 19px;
  }
}

@media (min-width: 900px) {
  .relations-columns {
    grid-template-columns: minmax(300px, 0.74fr) minmax(460px, 1.26fr);
    align-items: start;
  }

  .investor-logo-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .partner-logo-grid-v16 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}