/* product-on-device-age-estimation.css — page overrides layered on
   product.css (loaded after it via the page's pageCss array; scope is
   .p-product--on-device-age-estimation so these rules win over the base
   .p-product rules, no !important needed).

   § Privacy Lens visual in the dark spotlight (Sofia, 2026-08-13): the
   live site's demo card — a light product screen with the capture circle
   running the real selfie loop under the Privacy Lens blur, a "Verified
   by Incode" chip, and the feature caption — seated between the copy and
   the stat rail. The face is genuinely unreadable: the blur is a CSS
   filter on the footage, exactly what the feature does on-device. */

@media (min-width: 1024px) {
  .p-product--on-device-age-estimation .pr-spot__grid {
    grid-template-columns: minmax(0, 1fr) minmax(220px, 264px) minmax(0, 0.95fr);
    gap: 56px;
  }
}

.p-product--on-device-age-estimation .odx-lens {
  max-width: 272px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.05);
  padding: 12px;
}
@media (max-width: 1023px) {
  .p-product--on-device-age-estimation .odx-lens { margin-top: 32px; }
}

/* the product screen — light, like the real capture UI */
.p-product--on-device-age-estimation .odx-lens__screen {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  background: var(--color-white);
  border-radius: 12px;
  padding: 16px 16px 18px;
}
.p-product--on-device-age-estimation .odx-lens__logo {
  align-self: flex-start;
  height: 16px;
  width: auto;
}

/* capture circle: the selfie loop, blurred past recognition */
.p-product--on-device-age-estimation .odx-lens__orb {
  width: 128px;
  height: 128px;
  border-radius: 50%;
  overflow: hidden;
  border: 4px solid var(--color-white);
  outline: 1px solid var(--color-grey-200);
}
.p-product--on-device-age-estimation .odx-lens__vid {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: blur(11px);
  transform: scale(1.3);
}

/* "Verified by Incode" — product-UI chip, part of the screen */
.p-product--on-device-age-estimation .odx-lens__chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 14px;
  border: 1px solid var(--color-grey-200);
  border-radius: 10px;
  font-size: var(--fs-xs);
  font-weight: 500;
  color: var(--color-grey-600);
}
.p-product--on-device-age-estimation .odx-lens__chip .ds-icon {
  width: 13px;
  height: 13px;
  color: var(--color-blue);
}

/* feature caption on the card's ink apron */
.p-product--on-device-age-estimation .odx-lens__cap {
  padding: 16px 10px 8px;
}
.p-product--on-device-age-estimation .odx-lens__name {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--fs-lg);
  color: var(--color-white);
}
.p-product--on-device-age-estimation .odx-lens__line {
  margin-top: 6px;
  font-size: var(--fs-sm);
  line-height: var(--leading-snug);
  color: rgba(255, 255, 255, 0.65);
}
