/* Binds the V2 product-page aliases to the site's approved tokens (assets/adentro-v2.css).
   Loaded last on the ten product pages. Scoped to the two page roots only. */
.ad-products{--brand-primary:var(--v2-blue);--text-primary:var(--v2-ink);--text-secondary-accessible:var(--v2-muted);
  --border-subtle:var(--v2-line);--surface-canvas:var(--v2-canvas);--font-sans:var(--v2-font)}
#adentro-retail-media{--rm-brand-primary:var(--v2-blue);--rm-brand-hover:var(--v2-blue-hover);--rm-text-primary:var(--v2-ink);
  --rm-text-secondary:var(--v2-muted);--rm-border:var(--v2-line);--rm-canvas:var(--v2-canvas);--rm-selected:var(--v2-selected);
  --rm-font-body:var(--v2-font);--rm-font-display:var(--v2-font)}

/* Isolation. On these pages the shell CSS sits in @layer site. This later layer returns every
   non-SVG element inside the two page roots to browser defaults, so only the (unlayered)
   V2 page CSS styles the body, exactly as in the supplied reference. SVG is excluded so its
   presentation attributes (fill, stroke, width) survive. Header, nav and footer are untouched. */
@layer site, products-shield;
@layer products-shield{
  :is(.ad-products,#adentro-retail-media) :not(svg,svg *),
  :is(.ad-products,#adentro-retail-media) :not(svg,svg *)::before,
  :is(.ad-products,#adentro-retail-media) :not(svg,svg *)::after{all:revert}
}

/* Retail Media reporting sidebar: the site's own logo symbol (#adentro-logo) at the reserved slot width. */
#adentro-retail-media .rm-logo-slot{display:flex;align-items:center}
#adentro-retail-media .rm-logo-slot .rm-logo{display:block;width:76px;height:auto;color:var(--v2-blue)}

/* Phone mockups: shorter screens (2026-10-21). Width, artwork and copy unchanged; only
   vertical spacing inside the portal screen is tightened to bring each phone to ~1.9:1. */
.ad-products .ap-portal{padding-top:14px;padding-bottom:12px}
.ad-products .ap-portal-head{margin-top:12px}
.ad-products .ap-portal-head>strong{margin:6px 0}
.ad-products .ap-portal>.ap-sun{height:60px;margin:2px 0 4px}
.ad-products .ap-portal-field{margin-top:10px}
.ad-products .ap-portal-legal{margin-top:10px}
.ad-products .ap-phone-home{margin:8px auto 2px}
.ad-products .ap-phone-venue .ap-portal{min-height:0}
.ad-products .ap-phone-venue .ap-portal-head{margin-top:14px}
.ad-products .ap-phone-venue .ap-portal-field{margin-top:14px}
.ad-products .ap-portal-sponsor{padding-top:12px}
#adentro-retail-media .portal{padding-top:12px}
#adentro-retail-media .portal-head,#adentro-retail-media .hero-phone .portal-head{margin-top:12px}
#adentro-retail-media .portal-input,#adentro-retail-media .hero-phone .portal-input{margin-top:12px}
#adentro-retail-media .portal-sponsor{padding:10px 0 6px}
#adentro-retail-media .feature-phone .portal{padding-top:14px}
#adentro-retail-media .feature-phone .portal-head{margin-top:14px}
#adentro-retail-media .feature-phone .portal-sponsor{padding-top:12px}
#adentro-retail-media .portal-consent{margin:6px 0 8px}
#adentro-retail-media .hero-phone .portal{padding-top:10px}
#adentro-retail-media .hero-phone .portal-head{margin-top:8px}
#adentro-retail-media .hero-phone .portal-input{margin-top:10px}