@font-face {
  font-family: "City Lens IBM Google";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("https://fonts.gstatic.com/s/ibmplexsansarabic/v15/Qw3CZRtWPQCuHme67tEYUIx3Kh0PHR9N6bs6.ttf")
    format("truetype");
}

@font-face {
  font-family: "City Lens IBM Google";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("https://fonts.gstatic.com/s/ibmplexsansarabic/v15/Qw3NZRtWPQCuHme67tEYUIx3Kh0PHR9N6YPO_9CT.ttf")
    format("truetype");
}

@font-face {
  font-family: "City Lens IBM Google";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("https://fonts.gstatic.com/s/ibmplexsansarabic/v15/Qw3NZRtWPQCuHme67tEYUIx3Kh0PHR9N6YPi-NCT.ttf")
    format("truetype");
}

@font-face {
  font-family: "City Lens IBM Google";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("https://fonts.gstatic.com/s/ibmplexsansarabic/v15/Qw3NZRtWPQCuHme67tEYUIx3Kh0PHR9N6YOG-dCT.ttf")
    format("truetype");
}

.city-lens-page,
.city-lens-page *:not(i):not(.fa):not([class^="fa-"]):not([class*=" fa-"]) {
  font-family: "City Lens IBM Google", sans-serif !important;
}

.city-lens-page,
.city-lens-page *,
.city-lens-page *::before,
.city-lens-page *::after {
  box-sizing: border-box;
}

.city-lens-page {
  direction: rtl;
}

.city-lens-page .outer-container {
  width: 100%;
  padding-right: 0.75rem;
  padding-left: 0.75rem;
  margin-right: auto;
  margin-left: auto;
}

@media (width < 48em) {
  .city-lens-page .outer-container {
    padding-right: 10px;
    padding-left: 10px;
  }
}

@media (min-width: 576px) {
  .city-lens-page .outer-container {
    max-width: 540px;
  }
}

@media (min-width: 768px) {
  .city-lens-page .outer-container {
    max-width: 720px;
  }
}

@media (min-width: 992px) {
  .city-lens-page .outer-container {
    max-width: 960px;
  }
}

@media (min-width: 1200px) {
  .city-lens-page .outer-container {
    max-width: 1140px;
  }
}

@media (min-width: 1400px) {
  .city-lens-page .outer-container {
    max-width: 1320px;
  }
}
@keyframes city-lens-pulse {
  0%,
  100% {
    box-shadow: 0 0 0 0.2rem rgba(52, 168, 109, 0.18);
  }
  50% {
    box-shadow: 0 0 0 0.35rem rgba(52, 168, 109, 0.08);
  }
}
.city-lens-page .city-lens-hero {
  --city-lens-frame-inset: clamp(1.25rem, 3vw, 2.5rem);
  --city-lens-corner-size: 2.85rem;
  --city-lens-corner-thickness: 1.2px;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 5rem;
  height: 729px;
  padding: 50px 1.25rem 80px;
  overflow: hidden;
  color: #fff;
  font-family: "IBM Plex Sans Arabic", sans-serif;
  isolation: isolate;
}
@media (width < 62em) {
  .city-lens-page .city-lens-hero {
    height: auto;
    min-height: 40rem;
    gap: 3rem;
    padding: 2.5rem 1.25rem 4rem;
  }
}
@media (width < 48em) {
  .city-lens-page .city-lens-hero {
    min-height: 0;
    gap: 2rem;
    padding: 1.5rem 1rem 2.5rem;
  }
}
.city-lens-page .city-lens-hero__media {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}
.city-lens-page .city-lens-hero__bg {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
}
.city-lens-page .city-lens-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(181deg, rgba(0, 0, 0, 0) 0, #000 100%);
}
.city-lens-page .city-lens-hero__frame {
  position: absolute;
  inset: var(--city-lens-frame-inset);
  z-index: 1;
  pointer-events: none;
}
.city-lens-page .city-lens-hero__corner {
  position: absolute;
  width: var(--city-lens-corner-size);
  height: var(--city-lens-corner-size);
  border-color: hsla(0, 0%, 100%, 0.8);
  border-style: solid;
  border-width: 0;
}
.city-lens-page .city-lens-hero__corner--tr {
  top: 0;
  inset-inline-start: 0;
  border-block-start-width: var(--city-lens-corner-thickness);
  border-inline-start-width: var(--city-lens-corner-thickness);
}
.city-lens-page .city-lens-hero__corner--tl {
  top: 0;
  inset-inline-end: 0;
  border-block-start-width: var(--city-lens-corner-thickness);
  border-inline-end-width: var(--city-lens-corner-thickness);
}
.city-lens-page .city-lens-hero__corner--br {
  bottom: 0;
  inset-inline-start: 0;
  border-block-end-width: var(--city-lens-corner-thickness);
  border-inline-start-width: var(--city-lens-corner-thickness);
}
.city-lens-page .city-lens-hero__corner--bl {
  bottom: 0;
  inset-inline-end: 0;
  border-block-end-width: var(--city-lens-corner-thickness);
  border-inline-end-width: var(--city-lens-corner-thickness);
}
.city-lens-page .city-lens-hero__top {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  width: 100%;
  max-width: 1440px;
  padding-inline: 3rem;
}
@media (width < 48em) {
  .city-lens-page .city-lens-hero__top {
    padding-inline: 0.5rem;
  }
}
.city-lens-page .city-lens-hero__breadcrumb {
  --bs-breadcrumb-divider: "";
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  margin: 0;
  padding: 0;
  background: rgba(0, 0, 0, 0);
  list-style: none;
}
.city-lens-page .city-lens-hero__breadcrumb .breadcrumb-item {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}
.city-lens-page
  .city-lens-hero__breadcrumb
  .breadcrumb-item
  + .breadcrumb-item {
  padding-inline-start: 0.25rem;
}
.city-lens-page
  .city-lens-hero__breadcrumb
  .breadcrumb-item
  + .breadcrumb-item::before {
  display: inline-block;
  width: 0.35rem;
  height: 0.55rem;
  margin: 0 0.25rem;
  padding: 0;
  float: none;
  background: #ecf7f1;
  clip-path: polygon(100% 0, 0 50%, 100% 100%);
  content: "";
  opacity: 0.9;
}
html[dir="ltr"]
  .city-lens-page
  .city-lens-hero__breadcrumb
  .breadcrumb-item
  + .breadcrumb-item::before {
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}
.city-lens-page .city-lens-hero__breadcrumb .breadcrumb-item a,
.city-lens-page .city-lens-hero__breadcrumb .breadcrumb-item span {
  color: #fff;
  text-decoration: none;
}
.city-lens-page .city-lens-hero__live {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #fcfcfc;
  font-size: 18px;
  font-weight: 600;
  line-height: 1;
}
.city-lens-page .city-lens-hero__live-dot {
  width: 10.5px;
  height: 10.5px;
  border-radius: 50%;
  background: #34a86d;
  animation: city-lens-pulse 2s ease-in-out infinite;
}
.city-lens-page .city-lens-hero__body {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4.125rem;
  width: min(100%, 1084px);
  padding-top: 3.75rem;
}
@media (width < 62em) {
  .city-lens-page .city-lens-hero__body {
    gap: 2.5rem;
    padding-top: 2rem;
  }
}
@media (width < 48em) {
  .city-lens-page .city-lens-hero__body {
    gap: 1.75rem;
    padding-top: 1rem;
  }
}
.city-lens-page .city-lens-hero__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  width: 100%;
  text-align: center;
}
.city-lens-page .city-lens-hero__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  padding: 4px 12px;
  border-radius: 69px;
  background: hsla(0, 0%, 100%, 0.99);
  backdrop-filter: blur(2.5px);
  color: #384250;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
}
.city-lens-page .city-lens-hero__badge img {
  flex: none;
  width: 24px;
  height: 24px;
}
.city-lens-page .city-lens-hero__copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.25rem;
  width: min(100%, 772px);
}
.city-lens-page .city-lens-hero__title {
  margin: 0;
  color: #fff;
  font-size: clamp(2rem, 5vw, 72px);
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
  text-wrap: balance;
}
@media (width >= 75em) {
  .city-lens-page .city-lens-hero__title {
    line-height: 90px;
  }
}
.city-lens-page .city-lens-hero__desc {
  margin: 0;
  color: #fff;
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  text-align: center;
  text-wrap: pretty;
}
@media (width < 48em) {
  .city-lens-page .city-lens-hero__desc {
    font-size: 16px;
    line-height: 26px;
  }
}
.city-lens-page .city-lens-hero__stats {
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 48px;
  margin: 0;
  padding: 24px 48px;
  list-style: none;
  border-radius: 16px;
  background: rgba(31, 40, 59, 0.21);
  backdrop-filter: blur(42px);
  -webkit-backdrop-filter: blur(42px);
}
@media (width >= 48em) and (width < 75em) {
  .city-lens-page .city-lens-hero__stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    max-width: 720px;
    gap: 24px;
    padding: 24px;
  }
}
@media (width < 48em) {
  .city-lens-page .city-lens-hero__stats {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    width: 100%;
    padding: 16px 20px;
  }
}
.city-lens-page .city-lens-hero__stat {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 16px;
  flex: none;
  overflow: hidden;
}
@media (width >= 48em) {
  .city-lens-page .city-lens-hero__stat:not(:last-child) {
    position: relative;
  }
  .city-lens-page .city-lens-hero__stat:not(:last-child)::after {
    content: "";
    position: absolute;
    inset-inline-end: -24px;
    top: 50%;
    width: 1px;
    height: 65px;
    background: hsla(0, 0%, 100%, 0.15);
    transform: translateY(-50%);
  }
}
@media (width < 48em) {
  .city-lens-page .city-lens-hero__stat {
    padding: 16px 0;
  }
  .city-lens-page .city-lens-hero__stat:not(:last-child) {
    border-block-end: 1px solid hsla(0, 0%, 100%, 0.15);
  }
  .city-lens-page .city-lens-hero__stat:not(:last-child)::after {
    display: none;
  }
}
.city-lens-page .city-lens-hero__stat-icon {
  display: block;
  flex: none;
  width: 43.9px;
  height: 42.15px;
  margin-block-start: 4px;
  -o-object-fit: contain;
  object-fit: contain;
}
.city-lens-page .city-lens-hero__stat-body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  flex: none;
  text-align: start;
}
.city-lens-page .city-lens-hero__stat-value {
  color: #fff;
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
}
.city-lens-page .city-lens-hero__stat-label {
  color: hsla(0, 0%, 100%, 0.8);
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  white-space: nowrap;
}
.city-lens-page .city-lens-hero__meta {
  position: absolute;
  z-index: 2;
  left: 89px;
  bottom: 56px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}
@media (width < 48em) {
  .city-lens-page .city-lens-hero__meta {
    position: static;
    left: auto;
    margin-top: auto;
  }
}
.city-lens-page .city-lens-hero__meta-accent {
  color: #34a86d;
}
.city-lens-page .city-lens-hero__meta-sep {
  display: block;
  width: 1px;
  height: 12px;
  background: #fff;
}
.city-lens-page .city-lens-intro {
  position: relative;
  padding-block: 80px;
  background: #fff;
  font-family: "IBM Plex Sans Arabic", sans-serif;
  overflow: hidden;
}
@media (width < 48em) {
  .city-lens-page .city-lens-intro {
    padding-block: 48px;
  }
}
.city-lens-page .city-lens-intro__inner {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.city-lens-page .city-lens-intro__quotes {
  position: absolute;
  z-index: 0;
  top: 0;
  inset-inline-start: 0;
  width: 191px;
  height: 131px;
  pointer-events: none;
}
@media (width < 62em) {
  .city-lens-page .city-lens-intro__quotes {
    width: 140px;
    height: auto;
    opacity: 0.7;
  }
}
.city-lens-page .city-lens-intro__row {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  width: min(100%, 1210px);
}
@media (width < 62em) {
  .city-lens-page .city-lens-intro__row {
    flex-direction: column;
    align-items: stretch;
    gap: 1.5rem;
  }
}
.city-lens-page .city-lens-intro__heading {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 16px;
  flex: none;
  max-width: 453px;
}
@media (width < 62em) {
  .city-lens-page .city-lens-intro__heading {
    align-items: flex-start;
    max-width: none;
  }
}
.city-lens-page .city-lens-intro__title {
  margin: 0;
  width: 100%;
  color: #1f2a37;
  font-size: clamp(1.75rem, 3.5vw, 48px);
  font-weight: 700;
  line-height: 1.4;
  text-align: end;
}
@media (width < 62em) {
  .city-lens-page .city-lens-intro__title {
    text-align: start;
  }
}
.city-lens-page .city-lens-intro__title-line {
  display: block;
}
.city-lens-page .city-lens-intro__accent {
  color: #1b8354;
}
.city-lens-page .city-lens-intro__lead {
  margin: 0;
  max-width: 430px;
  color: #161616;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  text-align: end;
}
@media (width < 62em) {
  .city-lens-page .city-lens-intro__lead {
    max-width: none;
    text-align: start;
  }
}
.city-lens-page .city-lens-intro__body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  flex: none;
  width: min(100%, 604px);
  padding: 20px;
  border-radius: 8px;
  background: #fff;
}
.city-lens-page .city-lens-intro__body p {
  margin: 0;
  color: #7c7c7c;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  text-align: start;
}
@media (width < 62em) {
  .city-lens-page .city-lens-intro__body p {
    text-align: start;
  }
}
@media (width < 62em) {
  .city-lens-page .city-lens-intro__body {
    width: 100%;
  }
}
.city-lens-page .city-lens-how {
  position: relative;
  padding: 120px 57px;
  overflow: hidden;
  background: linear-gradient(180deg, #f9fafb 0, #fff 100%);
  font-family: "IBM Plex Sans Arabic", sans-serif;
}
@media (width < 62em) {
  .city-lens-page .city-lens-how {
    padding: 80px 1.5rem;
  }
}
@media (width < 48em) {
  .city-lens-page .city-lens-how {
    padding: 64px 1rem;
  }
}
.city-lens-page .city-lens-how__bg {
  position: absolute;
  left: -178px;
  top: 60%;
  z-index: 0;
  width: min(1502px, 140%);
  height: auto;
  opacity: 0.16;
  pointer-events: none;
  transform: rotate(-6deg);
  transform-origin: top left;
}
.city-lens-page .city-lens-how__inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 64px;
}
.city-lens-page .city-lens-how__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  width: min(100%, 898px);
  text-align: center;
}
.city-lens-page .city-lens-how__title {
  max-width: 706px;
  margin: 0;
  color: #161616;
  font-size: clamp(1.75rem, 3.5vw, 48px);
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
}
@media (width >= 75em) {
  .city-lens-page .city-lens-how__title {
    line-height: 60px;
  }
}
.city-lens-page .city-lens-how__subtitle {
  margin: 0;
  color: #384250;
  font-size: 18px;
  font-weight: 500;
  line-height: 28px;
  text-align: center;
}
.city-lens-page .city-lens-how__grid {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
  width: 100%;
}
.city-lens-page .city-lens-how__row {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 30px;
  width: 100%;
  max-width: 1280px;
  direction: ltr;
}
.city-lens-page .city-lens-how__row > * {
  direction: rtl;
}
@media (width < 75em) {
  .city-lens-page .city-lens-how__row {
    flex-wrap: wrap;
  }
}
@media (width < 48em) {
  .city-lens-page .city-lens-how__row {
    flex-direction: column;
  }
}
.city-lens-page .city-lens-how__row--bottom {
  max-width: 1204px;
}
.city-lens-page .city-lens-how__card {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  min-width: 0;
  max-width: 286px;
  padding: 24px 20px;
  overflow: hidden;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(16, 24, 40, 0.04);
}
@media (width < 75em) {
  .city-lens-page .city-lens-how__card {
    flex: 1 1 calc(50% - 15px);
    max-width: none;
  }
}
@media (width < 48em) {
  .city-lens-page .city-lens-how__card {
    flex: 1 1 auto;
    width: 100%;
    max-width: none;
  }
}
.city-lens-page .city-lens-how__card--compact {
  border-radius: 8px;
  padding: 20px;
  gap: 8px;
}
.city-lens-page .city-lens-how__card--accent {
  justify-content: flex-end;
  flex: 0 0 286px;
  max-width: 286px;
  padding: 24px 20px 30px;
  background: #1b8354;
  box-shadow: 0 16px 36px rgba(27, 131, 84, 0.28);
}
@media (width < 75em) {
  .city-lens-page .city-lens-how__card--accent {
    flex: 1 1 100%;
    max-width: none;
  }
}
.city-lens-page .city-lens-how__icon {
  display: block;
  flex: none;
  width: 52px;
  height: 52px;
  -o-object-fit: contain;
  object-fit: contain;
}
.city-lens-page .city-lens-how__card-text {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 12px;
  width: 100%;
  min-height: 10rem;
}
.city-lens-page .city-lens-how__card-title {
  margin: 0;
  width: 100%;
  color: #161616;
  font-size: 20px;
  font-weight: 600;
  line-height: 30px;
  text-align: start;
}
.city-lens-page .city-lens-how__card-desc {
  margin: 0;
  width: 100%;
  color: #6c737f;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  text-align: start;
}
.city-lens-page .city-lens-how__quote {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
}
.city-lens-page .city-lens-how__quote-line {
  margin: 0;
  color: #fff;
  font-size: 24px;
  font-weight: 400;
  line-height: 32px;
  text-align: start;
}
.city-lens-page .city-lens-how__quote-line--bold {
  font-weight: 600;
}
.city-lens-page .city-lens-features {
  padding-block: 80px;
  background: #f7f9fd;
  font-family: "IBM Plex Sans Arabic", sans-serif;
}
.city-lens-page .city-lens-features__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 64px;
}
.city-lens-page .city-lens-features__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  width: min(100%, 898px);
  text-align: center;
}
.city-lens-page .city-lens-features__title {
  margin: 0;
  color: #161616;
  font-size: clamp(1.75rem, 3.5vw, 48px);
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
}
@media (width >= 75em) {
  .city-lens-page .city-lens-features__title {
    line-height: 60px;
  }
}
.city-lens-page .city-lens-features__subtitle {
  margin: 0;
  color: #6c737f;
  font-size: 18px;
  font-weight: 500;
  line-height: 28px;
  text-align: center;
}
.city-lens-page .city-lens-features__grid {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  width: 100%;
  max-width: 1208px;
}
.city-lens-page .city-lens-features__row {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 24px;
  width: 100%;
  direction: ltr;
}
.city-lens-page .city-lens-features__row > * {
  direction: rtl;
}
@media (width < 62em) {
  .city-lens-page .city-lens-features__row {
    flex-wrap: wrap;
  }
}
@media (width < 48em) {
  .city-lens-page .city-lens-features__row {
    flex-direction: column;
  }
}
.city-lens-page .city-lens-features__row--bottom {
  max-width: 1205px;
}
.city-lens-page .city-lens-feat {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #fff;
  border-radius: 16px;
}
.city-lens-page .city-lens-feat--ai,
.city-lens-page .city-lens-feat--analysis {
  flex: 1 1 0;
  width: 100%;
  max-width: 592px;
  min-height: 488px;
  padding: 30px 28px;
  border-radius: 20px;
  justify-content: space-between;
  gap: 20px;
}
@media (width < 62em) {
  .city-lens-page .city-lens-feat--ai,
  .city-lens-page .city-lens-feat--analysis {
    max-width: none;
    min-height: 0;
  }
}
.city-lens-page .city-lens-feat--ai {
  border-radius: 16px;
  padding: 30px;
  position: relative;
  justify-content: flex-start;
  align-items: stretch;
}
.city-lens-page .city-lens-feat--gov,
.city-lens-page .city-lens-feat--live,
.city-lens-page .city-lens-feat--predict {
  flex: 1 1 0;
  min-width: 0;
  padding: 30px;
  gap: 24px;
  align-items: stretch;
  justify-content: flex-start;
}
@media (width < 62em) {
  .city-lens-page .city-lens-feat--gov,
  .city-lens-page .city-lens-feat--live,
  .city-lens-page .city-lens-feat--predict {
    flex: 1 1 calc(50% - 12px);
  }
}
@media (width < 48em) {
  .city-lens-page .city-lens-feat--gov,
  .city-lens-page .city-lens-feat--live,
  .city-lens-page .city-lens-feat--predict {
    flex: 1 1 auto;
    width: 100%;
  }
}
.city-lens-page .city-lens-feat__head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  width: 100%;
}
.city-lens-page .city-lens-feat__title {
  margin: 0;
  width: 100%;
  color: #161616;
  font-size: 20px;
  font-weight: 600;
  line-height: 30px;
  text-align: start;
}
.city-lens-page .city-lens-feat__desc {
  margin: 0;
  width: 100%;
  color: #6c737f;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  text-align: start;
}
.city-lens-page .city-lens-feat__desc--sm {
  font-size: 14px;
  line-height: 20px;
}
.city-lens-page .city-lens-feat__media {
  display: flex;
  flex-direction: column;
  gap: 9px;
  width: 100%;
}
.city-lens-page .city-lens-feat__strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  padding: 12px 16px;
  border-radius: 10px;
  background: #f9fafb;
}
.city-lens-page .city-lens-feat__strip-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #4d5766;
  font-family: "IBM Plex Mono", monospace;
  font-size: 11px;
  font-weight: 600;
}
.city-lens-page .city-lens-feat__strip-sep {
  width: 1px;
  height: 12px;
  background: #e5e7eb;
}
.city-lens-page .city-lens-feat__strip-accent {
  color: #47805e;
}
.city-lens-page .city-lens-feat__strip-count {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #6b7280;
  font-size: 11px;
  font-weight: 500;
}
.city-lens-page .city-lens-feat__strip-count strong {
  color: #1a212e;
  font-size: 20px;
  font-weight: 700;
}
.city-lens-page .city-lens-aperture {
  position: relative;
  height: 253px;
  overflow: hidden;
  border-radius: 14px;
  background: linear-gradient(180deg, #fff 0, #f9fafb 100%);
}
.city-lens-page .city-lens-aperture__halo {
  position: absolute;
  left: 50%;
  top: 60px;
  width: 156px;
  height: 156px;
  border-radius: 50%;
  background: radial-gradient(
    ellipse at 0 0,
    rgba(138, 189, 164, 0.16) 0,
    rgba(138, 189, 164, 0) 100%
  );
  transform: translateX(-50%);
}
.city-lens-page .city-lens-aperture__ring {
  position: absolute;
  left: 50%;
  top: 47px;
  width: 182px;
  height: 182px;
  border: 1px solid #9aca9a;
  border-radius: 50%;
  transform: translateX(-50%);
}
.city-lens-page .city-lens-aperture__rim {
  position: absolute;
  left: 50%;
  top: 84px;
  width: 109px;
  height: 109px;
  border-radius: 50%;
  background: linear-gradient(180deg, #34a86d 0, #1b8354 100%);
  box-shadow: 0 7px 14px -2px rgba(71, 128, 94, 0.3);
  transform: translateX(-50%);
}
.city-lens-page .city-lens-aperture__glass {
  position: absolute;
  left: 50%;
  top: 97px;
  width: 82px;
  height: 82px;
  border-radius: 50%;
  background: linear-gradient(135deg, #34a86d 0, #1b8354 100%);
  transform: translateX(-50%);
}
.city-lens-page .city-lens-aperture__glass::before {
  content: "";
  position: absolute;
  inset: 19px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #2e5242, #08140d);
}
.city-lens-page .city-lens-aperture__glass::after {
  content: "";
  position: absolute;
  top: 28px;
  left: 34px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: radial-gradient(circle, #f2fff7, #6ba687);
  box-shadow: 0 0 5px rgba(138, 189, 164, 0.9);
}
.city-lens-page .city-lens-aperture__dot {
  position: absolute;
  width: 11px;
  height: 11px;
  border: 1.5px solid #fff;
  border-radius: 50%;
}
.city-lens-page .city-lens-aperture__dot--purple {
  left: calc(50% - 29px);
  top: 45px;
  background: #80519f;
  box-shadow: 0 2px 5px rgba(128, 81, 159, 0.55);
}
.city-lens-page .city-lens-aperture__dot--blue {
  left: calc(50% + 82px);
  top: 108px;
  background: #9ebcf1;
  box-shadow: 0 2px 5px rgba(158, 188, 241, 0.55);
}
.city-lens-page .city-lens-aperture__dot--green {
  left: calc(50% - 92px);
  top: 157px;
  background: #88d8ad;
  box-shadow: 0 2px 5px rgba(136, 216, 173, 0.55);
}
.city-lens-page .city-lens-aperture__dot--orange {
  left: calc(50% + 19px);
  top: 220px;
  background: #f4c479;
  box-shadow: 0 2px 5px rgba(244, 196, 121, 0.55);
}
.city-lens-page .city-lens-aperture__tag {
  position: absolute;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 14px 7px 8px;
  border-radius: 999px;
  background: #fff;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
}
.city-lens-page .city-lens-aperture__tag--roads {
  top: 67px;
  left: auto;
  right: 28px;
  color: #1f2a37;
  outline: 1px solid rgba(158, 188, 241, 0.45);
  box-shadow: 0 5px 12px -3px rgba(158, 188, 241, 0.18);
}
.city-lens-page .city-lens-aperture__tag--building {
  top: 71px;
  left: 28px;
  color: #80519f;
  outline: 1px solid rgba(128, 81, 159, 0.45);
  box-shadow: 0 5px 12px -3px rgba(128, 81, 159, 0.22);
}
.city-lens-page .city-lens-aperture__tag--spaces {
  top: 185px;
  left: 10px;
  color: #1f2a37;
  outline: 1px solid rgba(202, 187, 241, 0.45);
  box-shadow: 0 5px 12px -3px rgba(202, 187, 241, 0.18);
}
.city-lens-page .city-lens-aperture__tag--light {
  top: 170px;
  right: 28px;
  color: #1f2a37;
  outline: 1px solid rgba(244, 196, 121, 0.45);
  box-shadow: 0 5px 12px -3px rgba(244, 196, 121, 0.18);
}
.city-lens-page .city-lens-aperture__score {
  color: #6b7280;
  font-family: "IBM Plex Mono", monospace;
  font-size: 10px;
  font-weight: 600;
}
.city-lens-page .city-lens-aperture__label {
  font-size: 13px;
  font-weight: 600;
}
@media (width >= 48em) and (width < 75em) {
  .city-lens-page .city-lens-aperture__tag--building,
  .city-lens-page .city-lens-aperture__tag--spaces {
    left: 8px;
    width: calc(50% - 20px);
    max-width: calc(50% - 20px);
    gap: 4px;
    padding: 6px 8px;
    font-size: 10px;
    white-space: normal;
  }
}
.city-lens-page .city-lens-ai-visual {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  margin-top: auto;
}
.city-lens-page .city-lens-ai-visual__sky {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 14px 14px 0 0;
  overflow: hidden;
}
.city-lens-page .city-lens-ai-visual__stats {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  padding: 14px 24px;
  border-radius: 0 0 12px 12px;
  background: #1b8354;
  outline: 1px solid hsla(0, 0%, 100%, 0.1);
  color: #fff;
  margin-top: -53px;
  position: relative;
  z-index: 2;
}
.city-lens-page .city-lens-ai-visual__stats > div {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  text-align: center;
}
.city-lens-page .city-lens-ai-visual__stats strong {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
}
.city-lens-page .city-lens-ai-visual__stats span {
  font-size: 11px;
  font-weight: 500;
}
.city-lens-page .city-lens-feat--gov .city-lens-feat__head,
.city-lens-page .city-lens-feat--live .city-lens-feat__head,
.city-lens-page .city-lens-feat--predict .city-lens-feat__head {
  flex: none;
  gap: 6px;
  min-height: 76px;
}
.city-lens-page .city-lens-feat--gov .city-lens-dial,
.city-lens-page .city-lens-feat--gov .city-lens-network,
.city-lens-page .city-lens-feat--gov .city-lens-trend,
.city-lens-page .city-lens-feat--live .city-lens-dial,
.city-lens-page .city-lens-feat--live .city-lens-network,
.city-lens-page .city-lens-feat--live .city-lens-trend,
.city-lens-page .city-lens-feat--predict .city-lens-dial,
.city-lens-page .city-lens-feat--predict .city-lens-network,
.city-lens-page .city-lens-feat--predict .city-lens-trend {
  flex: 1 1 auto;
  align-self: stretch;
  width: 100%;
  min-height: 210px;
}
.city-lens-page .city-lens-network {
  position: relative;
  flex: 1 1 auto;
  align-self: stretch;
  width: 100%;
  min-height: 210px;
  overflow: hidden;
  border-radius: 12px;
  background: #f9fafb;
}
.city-lens-page .city-lens-network__hub {
  position: absolute;
  left: 50%;
  top: 77px;
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  border-radius: 12px;
  background: linear-gradient(90deg, #1b8354 0, #146944 100%);
  box-shadow: 0 8px 20px -4px rgba(27, 131, 84, 0.4);
  transform: translateX(-50%);
}
.city-lens-page .city-lens-network__hub::before {
  content: "";
  width: 26px;
  height: 26px;
  border: 1.2px solid #fff;
  border-radius: 50%;
  box-shadow:
    inset 0 0 0 0 transparent,
    0 0 0 4px hsla(0, 0%, 100%, 0.35),
    0 0 0 8px hsla(0, 0%, 100%, 0.2);
  background: radial-gradient(circle, #fff 0 2px, transparent 2.5px);
}
.city-lens-page .city-lens-network__line {
  position: absolute;
  height: 1.2px;
  background: #a5dfc0;
  transform-origin: left center;
}
.city-lens-page .city-lens-network__line--1 {
  top: 45px;
  left: calc(50% - 112.5px);
  width: 125.3px;
  transform: rotate(29deg);
}
.city-lens-page .city-lens-network__line--2 {
  top: 45px;
  left: calc(50% + 107.5px);
  width: 125.3px;
  transform: rotate(151deg);
}
.city-lens-page .city-lens-network__line--3 {
  top: 105px;
  left: calc(50% - 132.5px);
  width: 130px;
}
.city-lens-page .city-lens-network__line--4 {
  top: 105px;
  left: calc(50% + 127.5px);
  width: 130px;
  transform: rotate(180deg);
}
.city-lens-page .city-lens-network__line--5 {
  top: 165px;
  left: calc(50% - 112.5px);
  width: 125.3px;
  transform: rotate(-29deg);
}
.city-lens-page .city-lens-network__line--6 {
  top: 165px;
  left: calc(50% + 107.5px);
  width: 125.3px;
  transform: rotate(-151deg);
}
.city-lens-page .city-lens-network__pulse {
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #1b8354;
  box-shadow: 0 0 6px rgba(27, 131, 84, 0.5);
}
.city-lens-page .city-lens-network__pulse--1 {
  top: 71px;
  left: calc(50% - 60.5px);
}
.city-lens-page .city-lens-network__pulse--2 {
  top: 62px;
  left: calc(50% + 69px);
}
.city-lens-page .city-lens-network__pulse--3 {
  top: 101px;
  left: calc(50% - 67.5px);
}
.city-lens-page .city-lens-network__pulse--4 {
  top: 102px;
  left: calc(50% + 63.5px);
}
.city-lens-page .city-lens-network__pulse--5 {
  top: 131px;
  left: calc(50% - 60.5px);
}
.city-lens-page .city-lens-network__pulse--6 {
  top: 133px;
  left: calc(50% + 49.5px);
}
.city-lens-page .city-lens-network__node {
  position: absolute;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 8px;
  border-radius: 8px;
  background: #fff;
  outline: 1.5px solid #f3f4f6;
  color: #384250;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}
.city-lens-page .city-lens-network__node::after {
  content: "";
  flex: none;
  width: 14px;
  height: 14px;
  border-radius: 4px;
  background: #ecf7f1;
  box-shadow:
    inset 0 0 0 4.5px #ecf7f1,
    inset 0 0 0 7px #1b8354;
}
.city-lens-page .city-lens-network__node--1 {
  top: 34px;
  left: 16px;
}
.city-lens-page .city-lens-network__node--2 {
  top: 34px;
  right: 16px;
}
.city-lens-page .city-lens-network__node--3 {
  top: 88px;
  left: 18px;
}
.city-lens-page .city-lens-network__node--4 {
  top: 88px;
  right: 18px;
}
.city-lens-page .city-lens-network__node--5 {
  top: 139px;
  left: 18px;
}
.city-lens-page .city-lens-network__node--6 {
  top: 145px;
  right: 16px;
}
@media (min-width: 48em) and (max-width: 74.99em) {
  .city-lens-page .city-lens-network__node {
    box-sizing: border-box;
    max-width: calc(50% - 24px);
    padding: 5px 7px;
    font-size: 10px;
    line-height: 14px;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .city-lens-page .city-lens-network__node--1,
  .city-lens-page .city-lens-network__node--3,
  .city-lens-page .city-lens-network__node--5 {
    right: auto;
    left: 8px;
  }

  .city-lens-page .city-lens-network__node--2,
  .city-lens-page .city-lens-network__node--4,
  .city-lens-page .city-lens-network__node--6 {
    right: 8px;
    left: auto;
  }
}
.city-lens-page .city-lens-dial {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  flex: 1 1 auto;
  gap: 24px;
  width: 100%;
  min-height: 210px;
  padding: 12px;
  overflow: hidden;
  border-radius: 12px;
  background: #f9fafb;
}
html[dir="rtl"] .city-lens-page .city-lens-dial {
  flex-direction: row-reverse;
}
.city-lens-page .city-lens-dial__stats {
  display: flex;
  flex-direction: column;
  flex: none;
  gap: 17px;
  width: 78px;
}
.city-lens-page .city-lens-dial__stat {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  align-self: stretch;
  gap: 4px;
  padding: 8px 12px;
  border-radius: 8px;
  background: #fff;
  outline: 1px solid #f3f4f6;
}
.city-lens-page .city-lens-dial__stat strong {
  color: #161616;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
}
.city-lens-page .city-lens-dial__stat span {
  color: #6c737f;
  font-size: 10px;
  font-weight: 500;
  line-height: 1.2;
}
.city-lens-page .city-lens-dial__stat:first-child strong {
  color: #1b8354;
}
.city-lens-page .city-lens-dial__gauge {
  position: relative;
  flex: none;
  width: 136px;
  height: 136px;
}
.city-lens-page .city-lens-dial__svg {
  display: block;
  width: 100%;
  height: 100%;
}
.city-lens-page .city-lens-dial__label {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  pointer-events: none;
}
.city-lens-page .city-lens-dial__label strong {
  color: #111827;
  font-size: 24px;
  font-weight: 700;
  line-height: 1;
}
.city-lens-page .city-lens-dial__label span {
  color: #6b7280;
  font-size: 9px;
  font-weight: 500;
  line-height: 1.2;
}
.city-lens-page .city-lens-trend {
  position: relative;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  width: 100%;
  min-height: 210px;
  padding: 16px;
  overflow: hidden;
  border-radius: 12px;
  background: #f9fafb;
}
.city-lens-page .city-lens-trend__legend {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 10px;
  color: #6b7280;
  font-size: 10px;
  font-weight: 500;
}
.city-lens-page .city-lens-trend__legend span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.city-lens-page .city-lens-trend__swatch {
  display: inline-block;
  width: 10px;
  height: 2px;
}
.city-lens-page .city-lens-trend__swatch--green {
  background: #a5dfc0;
}
.city-lens-page .city-lens-trend__swatch--blue {
  background: #b2ddff;
}
.city-lens-page .city-lens-trend__swatch--yellow {
  background: #fdb022;
}
.city-lens-page .city-lens-trend__plot {
  position: relative;
  flex: 1 1 auto;
  width: 100%;
  min-height: 110px;
}
.city-lens-page .city-lens-trend__chart {
  display: block;
  width: 100%;
  height: 110px;
}
.city-lens-page .city-lens-trend__now {
  position: absolute;
  right: 4%;
  bottom: 20%;
  color: #161616;
  font-size: 9px;
  font-weight: 600;
  line-height: 1;
  pointer-events: none;
}
.city-lens-page .city-lens-trend__callout {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  padding: 3px 8px;
  border-radius: 6px;
  background: #fffbeb;
  outline: 1px solid #fcd444;
  color: #fdb022;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
}
html[dir="rtl"] .city-lens-page .city-lens-trend__callout {
  align-self: flex-end;
}
.city-lens-page .city-lens-impact {
  padding: 120px 80px;
  overflow: hidden;
  background: #1f2a37;
  font-family: "IBM Plex Sans Arabic", sans-serif;
}
@media (width < 62em) {
  .city-lens-page .city-lens-impact {
    padding: 80px 1.5rem;
  }
}
@media (width < 48em) {
  .city-lens-page .city-lens-impact {
    padding: 64px 1rem;
  }
}
.city-lens-page .city-lens-impact__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 64px;
  width: min(100%, 1204px);
  margin-inline: auto;
}
.city-lens-page .city-lens-impact__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  width: min(100%, 898px);
  text-align: center;
}
.city-lens-page .city-lens-impact__title {
  margin: 0;
  color: #fff;
  font-size: clamp(1.75rem, 3.5vw, 48px);
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
}
@media (width >= 75em) {
  .city-lens-page .city-lens-impact__title {
    line-height: 60px;
  }
}
.city-lens-page .city-lens-impact__subtitle {
  margin: 0;
  max-width: 842px;
  color: hsla(0, 0%, 100%, 0.8);
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  text-align: center;
}
.city-lens-page .city-lens-impact__grid {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
}
.city-lens-page .city-lens-impact__row {
  display: flex;
  align-items: stretch;
  gap: 20px;
  width: 100%;
}
@media (width < 62em) {
  .city-lens-page .city-lens-impact__row {
    flex-wrap: wrap;
  }
}
@media (width < 48em) {
  .city-lens-page .city-lens-impact__row {
    flex-direction: column;
  }
}
.city-lens-page .city-lens-impact-card {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
  min-width: 0;
  padding: 24px;
  overflow: hidden;
  border-radius: 20px;
  outline: 1px solid #384250;
}
@media (width < 62em) {
  .city-lens-page .city-lens-impact-card {
    flex: 1 1 calc(50% - 10px);
  }
}
@media (width < 48em) {
  .city-lens-page .city-lens-impact-card {
    flex: 1 1 auto;
    width: 100%;
  }
}
.city-lens-page .city-lens-impact-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
}
.city-lens-page .city-lens-impact-card__badge {
  display: inline-flex;
  align-items: center;
  padding: 5px 12px 5px 9px;
  border-radius: 999px;
  background: rgba(255, 224, 178, 0.18);
  outline: 1px solid rgba(255, 224, 178, 0.4);
  color: #ffe0b2;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}
.city-lens-page .city-lens-impact-card__label {
  margin: 0;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.4;
  text-align: start;
}
.city-lens-page .city-lens-impact-card__body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
}
.city-lens-page .city-lens-impact-card__value-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  width: 100%;
}
.city-lens-page .city-lens-impact-card__value {
  color: #fff;
  font-size: 36px;
  font-weight: 700;
  line-height: 44px;
}
.city-lens-page .city-lens-impact-card__prefix {
  color: #fff;
  font-size: 20px;
  font-weight: 400;
  line-height: 1.2;
}
.city-lens-page .city-lens-impact-card__desc {
  margin: 0;
  width: 100%;
  color: #d4efe0;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.4;
  text-align: start;
}
.city-lens-page .city-lens-impact-highlight {
  display: flex;
  flex: 1 1 1;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  gap: 16px;
  min-width: 0;
  min-height: 228px;
  padding: 24px;
  overflow: hidden;
  border-radius: 20px;
  background:
    radial-gradient(
      circle at 12% 18%,
      rgba(27, 131, 84, 0.22) 0 1.5px,
      transparent 2px
    ),
    radial-gradient(
      circle at 28% 42%,
      rgba(27, 131, 84, 0.18) 0 1.5px,
      transparent 2px
    ),
    radial-gradient(
      circle at 64% 22%,
      rgba(27, 131, 84, 0.2) 0 1.5px,
      transparent 2px
    ),
    radial-gradient(
      circle at 82% 58%,
      rgba(27, 131, 84, 0.16) 0 1.5px,
      transparent 2px
    ),
    #34a86d;
}
@media (width < 62em) {
  .city-lens-page .city-lens-impact-highlight {
    flex: 1 1 100%;
  }
}
.city-lens-page .city-lens-impact-highlight__title {
  margin: 0;
  width: 100%;
  color: #fff;
  font-size: 30px;
  font-weight: 700;
  line-height: 1.3;
  text-align: start;
}
.city-lens-page .city-lens-impact-highlight__desc {
  margin: 0;
  width: 100%;
  max-width: 340px;
  color: #fff;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  text-align: start;
}
.city-lens-page .city-lens-impact__stack {
  display: flex;
  flex: 0 1 385px;
  flex-direction: column;
  gap: 20px;
  width: 100%;
  max-width: 385px;
}
@media (width < 62em) {
  .city-lens-page .city-lens-impact__stack {
    flex: 1 1 100%;
    max-width: none;
  }
}
.city-lens-page .city-lens-impact-stat {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  width: 100%;
  padding: 18px 20px;
  overflow: hidden;
  border-radius: 20px;
  outline: 1px solid #384250;
}
.city-lens-page .city-lens-impact-stat__value {
  color: #fff;
  font-size: 36px;
  font-weight: 700;
  line-height: 44px;
}
.city-lens-page .city-lens-impact-stat__value--accent {
  color: #88d8ad;
}
.city-lens-page .city-lens-impact-stat__label {
  color: #d4efe0;
  font-size: 13px;
  font-weight: 400;
  line-height: 20px;
  text-align: start;
}
.city-lens-page .city-lens-awards {
  position: relative;
  padding: 120px 57px;
  overflow: hidden;
  background: #fff;
  font-family: "IBM Plex Sans Arabic", sans-serif;
}
@media (width < 62em) {
  .city-lens-page .city-lens-awards {
    padding: 80px 1.5rem;
  }
}
@media (width < 48em) {
  .city-lens-page .city-lens-awards {
    padding: 64px 1rem;
  }
}
.city-lens-page .city-lens-awards__glow {
  position: absolute;
  left: 50%;
  top: 40%;
  z-index: 0;
  width: min(871px, 90vw);
  height: 439px;
  border-radius: 9999px;
  background: rgba(120, 124, 213, 0.23);
  opacity: 0.4;
  filter: blur(200px);
  pointer-events: none;
  transform: translate(-50%, -20%);
}
.city-lens-page .city-lens-awards__inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 64px;
}
.city-lens-page .city-lens-awards__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  width: min(100%, 898px);
  text-align: center;
}
.city-lens-page .city-lens-awards__title {
  max-width: 706px;
  margin: 0;
  color: #161616;
  font-size: clamp(1.75rem, 3.5vw, 48px);
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
}
@media (width >= 75em) {
  .city-lens-page .city-lens-awards__title {
    line-height: 60px;
  }
}
.city-lens-page .city-lens-awards__subtitle {
  margin: 0;
  max-width: 616px;
  color: #384250;
  font-size: 18px;
  font-weight: 500;
  line-height: 28px;
  text-align: center;
}
.city-lens-page .city-lens-awards__grid {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 30px;
  width: 100%;
  max-width: 1204px;
  direction: ltr;
}
.city-lens-page .city-lens-awards__grid > * {
  direction: rtl;
}
@media (width < 48em) {
  .city-lens-page .city-lens-awards__grid {
    flex-direction: column;
  }
}
.city-lens-page .city-lens-award-card {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  min-width: 0;
  height: 327px;
  padding: 24px 20px;
  overflow: hidden;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 12px 40px rgba(16, 24, 40, 0.06);
}
@media (width < 48em) {
  .city-lens-page .city-lens-award-card {
    height: auto;
    min-height: 327px;
  }
}
.city-lens-page .city-lens-award-card__logo {
  display: block;
  flex: none;
  -o-object-fit: contain;
  object-fit: contain;
}
.city-lens-page .city-lens-award-card__logo--ieee {
  width: 39px;
  height: 39px;
}
.city-lens-page .city-lens-award-card__logo--wsis {
  width: 92px;
  height: 43px;
}
.city-lens-page .city-lens-award-card__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
}
.city-lens-page .city-lens-award-card__title {
  margin: 0;
  width: 100%;
  color: #161616;
  font-size: 20px;
  font-weight: 600;
  line-height: 30px;
  text-align: start;
}
.city-lens-page .city-lens-award-card__desc {
  margin: 0;
  width: 100%;
  color: #6c737f;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  text-align: start;
}
.city-lens-page .city-lens-award-card__stats {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  padding: 14px 24px;
  border-radius: 12px;
  background: linear-gradient(
    90deg,
    rgba(248, 247, 239, 0) 0,
    rgba(247, 241, 241, 0.47) 47%,
    #f0f6f4 100%
  );
  outline: 1px solid hsla(0, 0%, 100%, 0.1);
}
.city-lens-page .city-lens-award-card__stat {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  min-width: 0;
  overflow: hidden;
}
.city-lens-page .city-lens-award-card__stat-label {
  color: #6c737f;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.3;
  text-align: start;
}
.city-lens-page .city-lens-award-card__stat-value {
  color: #384250;
  font-size: 20px;
  font-weight: 600;
  line-height: 30px;
  text-align: start;
}
.city-lens-page .city-lens-award-card__stat-row {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 4px;
}
.city-lens-page .city-lens-award-card__stat-number {
  color: #384250;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
}
.city-lens-page .city-lens-award-card__stat-unit {
  color: #384250;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
}
.city-lens-page .city-lens-sectors {
  padding-block: 120px;
  background: #f7f9fd;
  font-family: "IBM Plex Sans Arabic", sans-serif;
}
@media (width < 48em) {
  .city-lens-page .city-lens-sectors {
    padding-block: 64px;
  }
}
.city-lens-page .city-lens-sectors__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40px;
}
.city-lens-page .city-lens-sectors__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  width: min(100%, 898px);
  text-align: center;
}
.city-lens-page .city-lens-sectors__title {
  margin: 0;
  color: #161616;
  font-size: clamp(1.75rem, 3.5vw, 48px);
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
}
@media (width >= 75em) {
  .city-lens-page .city-lens-sectors__title {
    line-height: 60px;
  }
}
.city-lens-page .city-lens-sectors__subtitle {
  margin: 0;
  max-width: 808px;
  color: #6c737f;
  font-size: 18px;
  font-weight: 500;
  line-height: 28px;
  text-align: center;
}
.city-lens-page .city-lens-sectors__grid {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 30px;
  width: 100%;
  max-width: 1218px;
  direction: ltr;
}
.city-lens-page .city-lens-sectors__grid > * {
  direction: rtl;
}
@media (width < 62em) {
  .city-lens-page .city-lens-sectors__grid {
    flex-wrap: wrap;
  }
}
@media (width < 48em) {
  .city-lens-page .city-lens-sectors__grid {
    flex-direction: column;
  }
}
.city-lens-page .city-lens-sector-card {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  min-width: 0;
  min-height: 248px;
  padding: 30px 24px;
  border-radius: 16px;
  background: #fff;
}
@media (width < 62em) {
  .city-lens-page .city-lens-sector-card {
    flex: 1 1 calc(50% - 15px);
  }
}
@media (width < 48em) {
  .city-lens-page .city-lens-sector-card {
    flex: 1 1 auto;
    width: 100%;
  }
}
.city-lens-page .city-lens-sector-card__icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 60px;
  height: 60px;
}
.city-lens-page .city-lens-sector-card__icon img {
  display: block;
  width: 40px;
  height: 40px;
}
.city-lens-page .city-lens-sector-card__text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
}
.city-lens-page .city-lens-sector-card__title {
  margin: 0;
  width: 100%;
  color: #1d0d47;
  font-size: 20px;
  font-weight: 700;
  line-height: 30px;
  text-align: start;
}
.city-lens-page .city-lens-sector-card__desc {
  margin: 0;
  width: 100%;
  color: #75808c;
  font-size: 13px;
  font-weight: 400;
  line-height: 20px;
  text-align: start;
}
.city-lens-page .city-lens-analysis {
  position: relative;
  overflow: hidden;
  background: #1f2a37;
  padding: 80px 1rem;
  font-family: "IBM Plex Sans Arabic", sans-serif;
}
@media (width >= 48em) {
  .city-lens-page .city-lens-analysis {
    padding: 96px 2rem;
  }
}
@media (width >= 64em) {
  .city-lens-page .city-lens-analysis {
    padding: 120px 80px;
  }
}
.city-lens-page .city-lens-analysis__decor {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}
.city-lens-page .city-lens-analysis__grid {
  position: absolute;
  left: 50%;
  top: -10%;
  width: 140%;
  max-width: none;
  opacity: 0.4;
  transform: translateX(-50%);
}
@media (width >= 48em) {
  .city-lens-page .city-lens-analysis__grid {
    width: 110%;
  }
}
@media (width >= 64em) {
  .city-lens-page .city-lens-analysis__grid {
    width: 1138px;
  }
}
.city-lens-page .city-lens-analysis__glow {
  position: absolute;
  top: 0;
  right: -25%;
  width: 180%;
  max-width: none;
  opacity: 0.6;
}
@media (width >= 48em) {
  .city-lens-page .city-lens-analysis__glow {
    right: 0;
    width: 120%;
  }
}
@media (width >= 64em) {
  .city-lens-page .city-lens-analysis__glow {
    width: 1296px;
  }
}
.city-lens-page .city-lens-analysis__inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
  width: min(100%, 1204px);
  margin-inline: auto;
}
@media (width >= 48em) {
  .city-lens-page .city-lens-analysis__inner {
    gap: 64px;
  }
}
.city-lens-page .city-lens-analysis__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  width: 100%;
  text-align: center;
}
.city-lens-page .city-lens-analysis__title {
  margin: 0;
  max-width: 898px;
  color: #fff;
  font-size: clamp(1.875rem, 4vw, 48px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
  text-align: center;
}
@media (width >= 64em) {
  .city-lens-page .city-lens-analysis__title {
    line-height: 60px;
  }
}
.city-lens-page .city-lens-analysis__subtitle {
  margin: 0;
  max-width: 42rem;
  color: hsla(0, 0%, 100%, 0.8);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.625;
  text-align: center;
}
@media (width >= 48em) {
  .city-lens-page .city-lens-analysis__subtitle {
    font-size: 18px;
    line-height: 28px;
  }
}
.city-lens-page .city-lens-analysis__accuracy,
.city-lens-page .city-lens-analysis__live {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 4px 12px;
  border-radius: 9999px;
  backdrop-filter: blur(2.5px);
  z-index: 3;
}
.city-lens-page .city-lens-analysis__accuracy {
  background: #1e2f3e;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  white-space: nowrap;
}
.city-lens-page .city-lens-analysis__live {
  background: #243546;
  color: #fcfcfc;
  font-family: Raleway, "IBM Plex Sans Arabic", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 1;
}
.city-lens-page .city-lens-analysis__stage {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  width: 100%;
  max-width: 1044px;
}
@media (width >= 64em) {
  .city-lens-page .city-lens-analysis__stage {
    display: block;
  }
}
.city-lens-page .city-lens-analysis__map {
  display: block;
  width: 100%;
  height: auto;
}
.city-lens-page .city-lens-analysis__live {
  position: absolute;
  top: 4.5%;
  left: 1.5%;
}
.city-lens-page .city-lens-analysis__accuracy {
  position: absolute;
  top: 29%;
  left: 58%;
}
@media (width < 48em) {
  .city-lens-page .city-lens-analysis__accuracy {
    top: 4.5%;
    left: auto;
    right: 1.5%;
  }
}
.city-lens-page .city-lens-analysis__connector {
  display: none;
}
@media (width >= 64em) {
  .city-lens-page .city-lens-analysis__connector {
    position: absolute;
    top: 28%;
    left: 49%;
    display: block;
    width: min(26%, 260px);
    height: auto;
    pointer-events: none;
    z-index: 2;
  }
}
.city-lens-page .city-lens-analysis-card {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 13px;
  width: 100%;
  max-width: 270px;
  padding: 16px;
  border-radius: 12px;
  background: linear-gradient(
    196deg,
    rgba(28, 50, 66, 0.5) 0,
    rgba(40, 55, 72, 0.5) 100%
  );
  backdrop-filter: blur(20px);
  z-index: 3;
}
@media (width >= 64em) {
  .city-lens-page .city-lens-analysis-card {
    position: absolute;
    top: 12%;
    right: 0;
  }
}
@media (width < 64em) {
  .city-lens-page .city-lens-analysis-card {
    margin-top: 0.5rem;
  }
}
.city-lens-page .city-lens-analysis-card__head {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  width: 100%;
}
.city-lens-page .city-lens-analysis-card__dot {
  flex: none;
  width: 10px;
  height: 10px;
  border-radius: 9999px;
  background: #d97706;
}
.city-lens-page .city-lens-analysis-card__title {
  margin: 0;
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  text-align: right;
}
.city-lens-page .city-lens-analysis-card__image {
  display: block;
  width: 100%;
  aspect-ratio: 14/9;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 12px;
}
.city-lens-page .city-lens-analysis-card__meta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
  margin: 0;
}
.city-lens-page .city-lens-analysis-card__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.city-lens-page .city-lens-analysis-card__row dt {
  color: #d4efe0;
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
  text-align: right;
}
.city-lens-page .city-lens-analysis-card__row dd {
  margin: 0;
  color: #fff;
  font-size: 12px;
  font-weight: 500;
  line-height: 18px;
  text-align: right;
}
.city-lens-page .city-lens-analysis-card__confidence {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #88d8ad;
}
.city-lens-page .city-lens-analysis-card__confidence span {
  color: inherit;
}
.city-lens-page .city-lens-analysis-card__confidence svg {
  flex: none;
}
.city-lens-page .city-lens-analysis__stats {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  width: 100%;
  max-width: 1126px;
}
@media (width >= 48em) {
  .city-lens-page .city-lens-analysis__stats {
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
  }
}
.city-lens-page .city-lens-analysis-stat {
  display: flex;
  flex: 1 1 0;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-width: 0;
  padding: 24px;
  border-radius: 16px;
  background: #1f2a37;
  border: 1px solid #384250;
}
.city-lens-page .city-lens-analysis-stat__value {
  display: flex;
  align-items: baseline;
  gap: 4px;
  flex: none;
}
.city-lens-page .city-lens-analysis-stat__value strong {
  color: #a5dfc0;
  font-size: clamp(2.25rem, 4vw, 56px);
  font-weight: 700;
  line-height: 1.1;
}
@media (width >= 64em) {
  .city-lens-page .city-lens-analysis-stat__value strong {
    line-height: 62px;
  }
}
.city-lens-page .city-lens-analysis-stat__value span {
  color: rgba(165, 223, 192, 0.7);
  font-size: clamp(1.25rem, 2vw, 26px);
  font-weight: 700;
}
.city-lens-page .city-lens-analysis-stat__text {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  min-width: 0;
  text-align: right;
}
.city-lens-page .city-lens-analysis-stat__text .h3,
.city-lens-page .city-lens-analysis-stat__text h3 {
  margin: 0;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.4;
}
.city-lens-page .city-lens-analysis-stat__text p {
  margin: 0;
  color: hsla(0, 0%, 100%, 0.55);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.3;
}
.city-lens-page .city-lens-cta {
  padding-block: 80px;
  background: #fff;
  font-family: "IBM Plex Sans Arabic", sans-serif;
}
@media (width < 48em) {
  .city-lens-page .city-lens-cta {
    padding-block: 48px;
  }
}
.city-lens-page .city-lens-cta__wrap {
  display: flex;
  justify-content: center;
}
.city-lens-page .city-lens-cta__card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: min(100%, 1180px);
  padding: 90px 48px;
  overflow: hidden;
  border-radius: 24px;
  background: #0f4f33;
}
@media (width < 48em) {
  .city-lens-page .city-lens-cta__card {
    padding: 56px 24px;
    border-radius: 16px;
  }
}
.city-lens-page .city-lens-cta__rings {
  position: absolute;
  left: 50%;
  top: -35%;
  z-index: 0;
  width: min(1350px, 180%);
  aspect-ratio: 1.16;
  pointer-events: none;
  transform: translateX(-50%);
}
.city-lens-page .city-lens-cta__rings span {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 1.5px solid rgba(27, 131, 84, 0.35);
}
.city-lens-page .city-lens-cta__rings span:nth-child(1) {
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(27, 131, 84, 0.55) 0,
    rgba(27, 131, 84, 0) 55%
  );
  border-color: rgba(27, 131, 84, 0.5);
  filter: blur(2px);
}
.city-lens-page .city-lens-cta__rings span:nth-child(2) {
  inset: 6%;
  border-color: rgba(27, 131, 84, 0.55);
  box-shadow: 0 0 40px rgba(27, 131, 84, 0.25);
}
.city-lens-page .city-lens-cta__rings span:nth-child(3) {
  inset: 14%;
  border-color: hsla(0, 0%, 100%, 0.08);
  background: radial-gradient(
    ellipse at 50% -20%,
    rgba(255, 255, 255, 0.12) 0,
    transparent 40%
  );
}
.city-lens-page .city-lens-cta__rings span:nth-child(4) {
  inset: 24%;
  border-color: rgba(27, 131, 84, 0.4);
}
.city-lens-page .city-lens-cta__content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 50px;
  width: 100%;
}
.city-lens-page .city-lens-cta__copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
  width: min(100%, 898px);
  text-align: center;
}
.city-lens-page .city-lens-cta__heading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: 100%;
}
.city-lens-page .city-lens-cta__title {
  margin: 0;
  color: #fff;
  font-size: clamp(1.5rem, 3vw, 36px);
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
}
@media (width >= 75em) {
  .city-lens-page .city-lens-cta__title {
    line-height: 44px;
  }
}
.city-lens-page .city-lens-cta__tagline {
  margin: 0;
  color: #88d8ad;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  text-align: center;
}
.city-lens-page .city-lens-cta__desc {
  margin: 0;
  max-width: 754px;
  color: #fff;
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  text-align: center;
}
.city-lens-page .city-lens-cta__desc strong {
  font-weight: 700;
}
.city-lens-page .city-lens-cta__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 8px 16px;
  border-radius: 4px;
  background: #0d121c;
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  text-decoration: none;
  transition:
    background-color 0.2s ease,
    opacity 0.2s ease;
}
.city-lens-page .city-lens-cta__btn:focus-visible,
.city-lens-page .city-lens-cta__btn:hover {
  background: #161b26;
  color: #fff;
  opacity: 0.95;
}
.city-lens-page .city-lens-intro__quotes {
  top: 0 !important;
}
.city-lens-page .city-lens-sectors:not(:has(.city-lens-sectors__header)) {
  padding-top: 0;
}

.city-lens-page .city-lens-sectors:not(:has(.city-lens-sectors__header)):not(:has(.city-lens-sector-card)) {
  display: none;
}
.city-lens-page .city-lens-aperture__halo,
.city-lens-page .city-lens-aperture__ring,
.city-lens-page .city-lens-aperture__rim,
.city-lens-page .city-lens-aperture__glass,
.city-lens-page .city-lens-aperture__dot {
  margin-left: 15px;
}
/* =========================
   Government Network - Mobile
   ========================= */
@media (max-width: 600px) {

  .city-lens-page .city-lens-network {
    min-height: 210px;
  }

  .city-lens-page .city-lens-network__node {
    box-sizing: border-box;
    max-width: calc(50% - 12px);
    gap: 3px;
    padding: 5px 6px;

    font-size: 9px;
    line-height: 12px;

    white-space: normal;
    overflow-wrap: normal;
    word-break: normal;
  }

  .city-lens-page .city-lens-network__node::after {
    width: 12px;
    height: 12px;
  }

  .city-lens-page .city-lens-network__node--1 {
    top: 30px;
    left: 6px;
    right: auto;
  }

  .city-lens-page .city-lens-network__node--2 {
    top: 30px;
    right: 6px;
    left: auto;
  }

  .city-lens-page .city-lens-network__node--3 {
    top: 88px;
    left: 6px;
    right: auto;
  }

  .city-lens-page .city-lens-network__node--4 {
    top: 88px;
    right: 6px;
    left: auto;
  }

  .city-lens-page .city-lens-network__node--5 {
    top: 146px;
    left: 6px;
    right: auto;
  }

  .city-lens-page .city-lens-network__node--6 {
    top: 146px;
    right: 6px;
    left: auto;
  }
}
@media (min-width: 48em) and (max-width: 74.99em) {

  /* =========================
     Government Network
     ========================= */

  .city-lens-page .city-lens-network__node {
    box-sizing: border-box;
    max-width: calc(50% - 14px);
    gap: 3px;
    padding: 5px 6px;
    font-size: 9px;
    line-height: 12px;
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: normal;
  }

  .city-lens-page .city-lens-network__node::after {
    width: 11px;
    height: 11px;
  }

  .city-lens-page .city-lens-network__node--1,
  .city-lens-page .city-lens-network__node--3,
  .city-lens-page .city-lens-network__node--5 {
    right: auto;
    left: 6px;
  }

  .city-lens-page .city-lens-network__node--2,
  .city-lens-page .city-lens-network__node--4,
  .city-lens-page .city-lens-network__node--6 {
    right: 6px;
    left: auto;
  }


  /* =========================
     Visual Analysis
     ========================= */

  .city-lens-page .city-lens-aperture__tag {
    gap: 4px;
    padding: 5px 7px;
    font-size: 10px;
    line-height: 14px;
  }

  .city-lens-page .city-lens-aperture__label {
    font-size: 10px;
    line-height: 14px;
  }

  .city-lens-page .city-lens-aperture__tag-icon {
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
  }

  .city-lens-page .city-lens-aperture__tag--building {
    top: 65px;
    left: 6px;
    width: auto;
    max-width: 105px;
    white-space: normal;
  }

  .city-lens-page .city-lens-aperture__tag--roads {
    top: 67px;
    right: 6px;
  }

  .city-lens-page .city-lens-aperture__tag--spaces {
    top: 174px;
    left: 6px;
    width: auto;
    max-width: 105px;
    white-space: normal;
  }

  .city-lens-page .city-lens-aperture__tag--light {
    top: 170px;
    right: 6px;
  }


  /* =========================
     Visual Analysis Bottom Stats
     ========================= */

  .city-lens-page .city-lens-feat__strip {
    padding: 12px 10px;
  }

  .city-lens-page .city-lens-feat__strip-count {
    width: 100%;
    justify-content: space-between;
    gap: 8px;
    white-space: nowrap;
  }

  .city-lens-page .city-lens-feat__strip-count strong {
    flex: none;
    font-size: 16px;
    line-height: 22px;
    white-space: nowrap;
  }

  .city-lens-page .city-lens-feat__strip-count span {
    flex: none;
    font-size: 8px;
    line-height: 12px;
    white-space: nowrap;
  }


  /* =========================
     AI Visual
     ========================= */

  .city-lens-page .city-lens-feat--ai {
    padding-left: 16px;
    padding-right: 16px;
  }

  .city-lens-page .city-lens-ai-visual {
    width: 100%;
  }

  .city-lens-page .city-lens-ai-visual__sky {
    display: block;
    width: 100%;
    height: auto;
  }

  .city-lens-page .city-lens-ai-visual__stats {
    width: 100%;
    gap: 4px;
    padding: 14px 8px;
  }

  .city-lens-page .city-lens-ai-visual__stats > div {
    flex: 1 1 0;
    min-width: 0;
    gap: 4px;
  }

  .city-lens-page .city-lens-ai-visual__stats strong {
    font-size: 20px;
    line-height: 24px;
    white-space: nowrap;
  }

  .city-lens-page .city-lens-ai-visual__stats span {
    font-size: 8px;
    line-height: 12px;
    white-space: nowrap;
  }
}