/* t3918/t3919: 3D art blends into the page; hero swaps; pricing card cleanup. Never crop. */
html:root body#ag-unified-site #main .ag-new-hero img,
html:root body#ag-unified-site #main .ag-new-hero-stage img,
html:root body#ag-unified-site #main .ag-gap-stage img,
html:root body#ag-unified-site #main .ag-gap-pic img,
html:root body#ag-unified-site #main .approved-t3422 img,
html:root body#ag-unified-site #main img.legal-wide-3d,
html:root body#ag-unified-site #main .b1art img,
html:root body#ag-unified-site #main .lg2art img,
html:root body#ag-unified-site #main .prod-hero-art img,
html:root body#ag-unified-site #main .hm-art2 img{
  background:transparent !important;
  object-fit:contain !important;
  object-position:center !important;
  mix-blend-mode:normal; /* knockout already removed the studio; multiply ate light-blue neon */
}
/* Multiply is safe on light sections; skip on dark bands */
html:root body#ag-unified-site #main .d img,
html:root body#ag-unified-site #main .pc.d img,
html:root body#ag-unified-site.dash img{
  mix-blend-mode:normal;
}

/* Home/Products hero swap layout */
html:root body#ag-unified-site #main .ag-new-hero-slot.ag-hero-swapped,
html:root body#ag-unified-site #main .hm-art2.ag-hero-swapped,
html:root body#ag-unified-site #main .prod-hero-art.ag-hero-swapped{
  --ag-new-hero-max-w: 666px; /* ~20% larger than 555 */
  --ag-new-hero-max-h: none;
}
html:root body#ag-unified-site #main .ag-hero-swapped .ag-gap-stage,
html:root body#ag-unified-site #main .ag-hero-swapped .ag-new-hero,
html:root body#ag-unified-site #main .ag-hero-swapped img{
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  max-height:none !important;
  object-fit:contain !important;
}
html:root body#ag-unified-site #main .ag-gap-bleed.ag-gap-small,
html:root body#ag-unified-site #main .ag-former-hero{
  display:flex;
  justify-content:center;
  padding:12px 16px 24px;
}
html:root body#ag-unified-site #main .ag-former-hero .ag-new-hero-stage,
html:root body#ag-unified-site #main .ag-gap-bleed.ag-gap-small .ag-new-hero-stage{
  width:min(420px, 92vw);
  max-width:420px;
  margin:0 auto;
}
html:root body#ag-unified-site #main .ag-former-hero img,
html:root body#ag-unified-site #main .ag-gap-bleed.ag-gap-small img{
  width:100% !important;
  height:auto !important;
  object-fit:contain !important;
}
@media (max-width:900px){
  html:root body#ag-unified-site #main .ag-new-hero-slot.ag-hero-swapped,
  html:root body#ag-unified-site #main .hm-art2.ag-hero-swapped,
  html:root body#ag-unified-site #main .prod-hero-art.ag-hero-swapped{
    --ag-new-hero-max-w: 100%;
    width:min(100vw - 24px, 100%);
  }
  html:root body#ag-unified-site #main .ag-former-hero .ag-new-hero-stage,
  html:root body#ag-unified-site #main .ag-gap-bleed.ag-gap-small .ag-new-hero-stage{
    width:min(100vw - 24px, 100%);
    max-width:100%;
  }
}


html:root body#ag-unified-site #main .ag-hero-swapped,
html:root body#ag-unified-site #main .prod-hero-art,
html:root body#ag-unified-site #main .hm-art2,
html:root body#ag-unified-site #main .ag-new-hero-stage,
html:root body#ag-unified-site #main .ag-gap-stage{
  overflow:visible !important;
}
@media (max-width:900px){
  html:root body#ag-unified-site #main .ag-hero-swapped,
  html:root body#ag-unified-site #main .hm-art2.ag-hero-swapped,
  html:root body#ag-unified-site #main .prod-hero-art.ag-hero-swapped{
    display:block;
    width:100%;
    margin:12px 0 0;
  }
  html:root body#ag-unified-site #main .ag-hero-swapped img{
    width:100% !important;
    max-width:100% !important;
  }
}

/* Pricing: compact LRL offer, no stretched 908px card; DFY contrast */
html:root body#ag-unified-site #main .pcs{align-items:start !important}
html:root body#ag-unified-site #main .ag-offer-compact .ag-days,
html:root body#ag-unified-site #main .ag-offer-compact [data-days],
html:root body#ag-unified-site #main .ag-offer-compact .day,
html:root body#ag-unified-site #main .ag-offer-compact .ag-time,
html:root body#ag-unified-site #main .ag-offer-compact .ag-offer-days{display:none !important}
html:root body#ag-unified-site #main .pc.d .b1ref,
html:root body#ag-unified-site #main .d .b1ref,
html:root body#ag-unified-site #main span.b1ref{
  color:#C7CDF0 !important;
  background:transparent !important;
  opacity:1 !important;
}

/* Legal hero: allow 740px on desktop (BUGLIST #11) */
@media (min-width:1100px){
  html:root body#ag-unified-site #main .lg2art img.legal-wide-3d{
    max-width:740px !important;
    width:740px !important;
    height:auto !important;
    object-fit:contain !important;
  }
}

/* t3923: compact Compare plans / See what's included — EN+BN, one desktop screen, no inner scrollbar */
html:root body#ag-unified-site #main .b1comp h2{
  font-size:22px !important;
  line-height:1.25 !important;
  margin:0 0 10px !important;
}
html:root body#ag-unified-site #main .b1comp .kick{font-size:11px !important;letter-spacing:.06em;margin:0 0 6px}
html:root body#ag-unified-site #main .b1comp .premium-compare,
html:root body#ag-unified-site #main .b1comp .tw.premium-compare{
  margin:12px 0 0 !important;
  max-height:none !important;
  overflow:visible !important;
  overflow-x:visible !important;
  overflow-y:visible !important;
  border-radius:14px !important;
  box-shadow:0 8px 22px #183d6814 !important;
}
html:root body#ag-unified-site #main .b1comp table.cmp-table{
  min-width:0 !important;
  width:100% !important;
}
html:root body#ag-unified-site #main .b1comp .cmp-table :is(th,td,span,b,small,a){
  font-size:13px !important;
  line-height:1.3 !important;
}
html:root body#ag-unified-site #main .b1comp .cmp-table th,
html:root body#ag-unified-site #main .b1comp .cmp-table td{
  padding:6px 10px !important;
  height:38px !important;
  min-height:36px;
  max-height:40px;
  box-sizing:border-box;
}
html:root body#ag-unified-site #main .b1comp .cmp-table thead th,
html:root body#ag-unified-site #main .b1comp .cmp-table thead th:first-child{
  padding:8px !important;
  height:auto !important;
  max-height:none !important;
  vertical-align:bottom !important;
}
html:root body#ag-unified-site #main .b1comp .cmp-table tbody th{
  font-size:13px !important;
  font-weight:600 !important;
  padding:6px 10px !important;
  height:38px !important;
}
html:root body#ag-unified-site #main .b1comp .cmp-table tbody td{
  height:38px !important;
  padding:4px 8px !important;
}
html:root body#ag-unified-site #main .b1comp .cmp-plan{
  min-height:0 !important;
  height:auto !important;
  gap:4px !important;
  padding:8px 8px 8px !important;
  border-radius:10px !important;
  box-shadow:none !important;
  justify-content:flex-start !important;
}
html:root body#ag-unified-site #main .b1comp .cmp-plan>img{
  width:20px !important;
  height:20px !important;
}
html:root body#ag-unified-site #main .b1comp .cmp-plan .cmp-name,
html:root body#ag-unified-site #main .b1comp .cmp-table .cmp-name{
  font-size:14px !important;
  line-height:1.25 !important;
  min-height:0 !important;
  font-weight:700 !important;
}
html:root body#ag-unified-site #main .b1comp .cmp-plan .cmp-price,
html:root body#ag-unified-site #main .b1comp .cmp-table .cmp-price{
  font-size:13px !important;
  line-height:1.2 !important;
  font-weight:650 !important;
}
html:root body#ag-unified-site #main .b1comp .cmp-plan .cmp-cta,
html:root body#ag-unified-site #main .b1comp .cmp-table .cmp-cta{
  min-height:31px !important;
  height:31px !important;
  padding:0 10px !important;
  font-size:12.5px !important;
  border-radius:8px !important;
  margin-top:2px !important;
  box-shadow:none !important;
}
html:root body#ag-unified-site #main .b1comp .cmp-plan .cmp-popular{
  top:4px;
  padding:1px 7px !important;
  font-size:10px !important;
  line-height:1.2 !important;
}
html:root body#ag-unified-site #main .b1comp .cmp-table svg.ck{
  width:18px !important;
  height:18px !important;
  filter:none !important;
}
html:root body#ag-unified-site #main .b1comp .cmp-table .soon{
  font-size:11px !important;
  line-height:1 !important;
  padding:2px 7px !important;
  border-radius:999px !important;
  display:inline-flex !important;
  align-items:center;
  height:18px !important;
  min-height:0 !important;
}
html:root body#ag-unified-site #main .b1comp .cmp-table .dash{
  font-size:14px !important;
}
@media (max-width:900px){
  html:root body#ag-unified-site #main .b1comp .premium-compare,
  html:root body#ag-unified-site #main .b1comp .tw.premium-compare{
    overflow-x:auto !important;
    overflow-y:visible !important;
    max-height:none !important;
    -webkit-overflow-scrolling:touch;
  }
  html:root body#ag-unified-site #main .b1comp table.cmp-table{
    width:max-content !important;
    min-width:720px !important;
  }
  html:root body#ag-unified-site #main .b1comp .cmp-table th:first-child,
  html:root body#ag-unified-site #main .b1comp .cmp-table td:first-child,
  html:root body#ag-unified-site #main .b1comp .cmp-table tbody th{
    position:sticky !important;
    left:0 !important;
    z-index:3 !important;
    background:var(--cmp-row,#fff) !important;
  }
  html:root body#ag-unified-site #main .b1comp .cmp-table thead th:first-child{
    z-index:5 !important;
    background:#f3f7fd !important;
  }
  html:root body#ag-unified-site #main .b1comp .cmp-table col:first-child{width:128px}
  html:root body#ag-unified-site #main .b1comp .cmp-table col:not(:first-child){width:148px}
}

/* t3923: beat premium-compare-t3416 :is() specificity for type sizes */
html:root body#ag-unified-site #main .b1comp .cmp-table :is(th,td,span,b,small,a,html:root body#ag-unified-site #main th,html:root body#ag-unified-site #main td,html:root body#ag-unified-site #main span,html:root body#ag-unified-site #main b,html:root body#ag-unified-site #main small,html:root body#ag-unified-site #main a){
  font-size:13px !important;
  line-height:1.3 !important;
}
html:root body#ag-unified-site #main .b1comp .cmp-table :is(.cmp-name, html:root body#ag-unified-site #main .cmp-name, html:root body#ag-unified-site #main b.cmp-name){
  font-size:14px !important;
}
html:root body#ag-unified-site #main .b1comp .cmp-table :is(.cmp-price, html:root body#ag-unified-site #main .cmp-price, html:root body#ag-unified-site #main small.cmp-price){
  font-size:13px !important;
}
html:root body#ag-unified-site #main .b1comp .cmp-table :is(.soon, html:root body#ag-unified-site #main .soon, html:root body#ag-unified-site #main span.soon){
  font-size:11px !important;
  line-height:1 !important;
}
html:root body#ag-unified-site #main .b1comp .cmp-table tbody th{
  white-space:nowrap !important;
}
@media (max-width:900px){
  html:root body#ag-unified-site #main .b1comp .cmp-table tbody th{
    white-space:normal !important;
    max-width:148px;
  }
  html:root body#ag-unified-site #main .b1comp .cmp-table col:first-child{width:148px}
}
html:root body#ag-unified-site #main .b1comp .cmp-plan:has(.cmp-popular){
  padding-top:16px !important;
}
@media (max-width:900px){
  html:root body#ag-unified-site #main .b1comp .cmp-plan .cmp-popular{top:6px}
}

/* t3926–t3928: original 3D pixels only. Blend via page-tint + soft outer feather.
   Never clip the subject. Hero stays large; relocated former-hero is small. */
html:root body#ag-unified-site #main .ag-hero-swapped,
html:root body#ag-unified-site #main .hm-art2,
html:root body#ag-unified-site #main .prod-hero-art,
html:root body#ag-unified-site #main .prod-hero-grid,
html:root body#ag-unified-site #main .ag-new-hero-stage,
html:root body#ag-unified-site #main .ag-gap-stage,
html:root body#ag-unified-site #main .ag-gap-bleed,
html:root body#ag-unified-site #main .hx3d{
  overflow:visible !important;
  max-height:none !important;
  clip-path:none !important;
  -webkit-clip-path:none !important;
}
html:root body#ag-unified-site #main .ag-hero-swapped img,
html:root body#ag-unified-site #main .ag-new-hero-stage img,
html:root body#ag-unified-site #main .ag-gap-stage img,
html:root body#ag-unified-site #main .hm-art2 img,
html:root body#ag-unified-site #main .prod-hero-art img{
  object-fit:contain !important;
  object-position:center !important;
  height:auto !important;
  max-height:none !important;
  mix-blend-mode:normal !important;
}
html:root body#ag-unified-site #main picture.ag-new-hero,
html:root body#ag-unified-site #main picture.ag-gap-stage,
html:root body#ag-unified-site #main picture.ag-gap-hq,
html:root body#ag-unified-site #main picture.ag-gap-pic,
html:root body#ag-unified-site #main picture.ag-float-tile,
html:root body#ag-unified-site #main .approved-t3422,
html:root body#ag-unified-site #main .lg2art,
html:root body#ag-unified-site #main .b1art,
html:root body#ag-unified-site #main .hm-art2 .ag-new-hero-stage,
html:root body#ag-unified-site #main .prod-hero-art .ag-new-hero-stage,
html:root body#ag-unified-site #main .hero-art{
  background-color:#f5f8ff;
}
html:root body#ag-unified-site #main picture.ag-new-hero img,
html:root body#ag-unified-site #main picture.ag-gap-stage img,
html:root body#ag-unified-site #main picture.ag-gap-hq img,
html:root body#ag-unified-site #main picture.ag-gap-pic img,
html:root body#ag-unified-site #main picture.ag-float-tile img,
html:root body#ag-unified-site #main .approved-t3422 img,
html:root body#ag-unified-site #main .lg2art img,
html:root body#ag-unified-site #main .lg2art img.legal-wide-3d,
html:root body#ag-unified-site #main .b1art img,
html:root body#ag-unified-site #main .hero-art img,
html:root body#ag-unified-site #main .hm-art2 img,
html:root body#ag-unified-site #main .prod-hero-art img,
html:root body#ag-unified-site #main img[src*="/assets/3d/"],
html:root body#ag-unified-site #main img[src*="/assets/t2962/"],
html:root body#ag-unified-site #main img[src*="/assets/t3384/"],
html:root body#ag-unified-site #main img[src*="/assets/t3385/"],
html:root body#ag-unified-site #main img[src*="legal-wide-t3408"],
html:root body#ag-unified-site #main img[src*="approved-t3422"],
html:root body#ag-unified-site #main img[src*="/assets/b23/"]{
  background-color:#f5f8ff;
  mix-blend-mode:normal !important;
  /* outer ~10% feather only — subject stays fully opaque */
  -webkit-mask-image:radial-gradient(ellipse 92% 90% at 50% 50%, #000 78%, transparent 100%);
  mask-image:radial-gradient(ellipse 92% 90% at 50% 50%, #000 78%, transparent 100%);
  -webkit-mask-size:100% 100%;
  mask-size:100% 100%;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
}
html:root body#ag-unified-site #main .d img,
html:root body#ag-unified-site #main .pc.d img,
html:root body#ag-unified-site.dash img,
html:root body#ag-unified-site.auth img,
html:root body#ag-unified-site.common-auth img{
  -webkit-mask-image:none;
  mask-image:none;
  background-color:transparent;
  mix-blend-mode:normal !important;
}

/* Former hero (phones / 4 tiles) sits small beside section text — not a full-width band */
html:root body#ag-unified-site #main .hm-prod-head,
html:root body#ag-unified-site #main .prod-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(160px,240px);
  gap:16px 24px;
  align-items:center;
  margin:0 0 16px;
}
html:root body#ag-unified-site #main .ag-inline-art,
html:root body#ag-unified-site #main .ag-former-hero.ag-inline-art{
  width:min(240px,36vw);
  max-width:240px;
  margin:0;
  padding:0;
  display:block;
  position:relative;
  overflow:visible !important;
}
html:root body#ag-unified-site #main .ag-inline-art .ag-new-hero-stage{
  width:100% !important;
  max-width:100% !important;
  margin:0;
  overflow:visible !important;
}
html:root body#ag-unified-site #main .ag-inline-art img{
  width:100% !important;
  height:auto !important;
  max-height:none !important;
  object-fit:contain !important;
}
@media (max-width:900px){
  html:root body#ag-unified-site #main .hm-prod-head,
  html:root body#ag-unified-site #main .prod-head{
    grid-template-columns:1fr;
    justify-items:center;
    text-align:center;
  }
  html:root body#ag-unified-site #main .ag-inline-art,
  html:root body#ag-unified-site #main .ag-former-hero.ag-inline-art{
    width:min(220px,72vw);
    max-width:220px;
    margin:8px auto 0;
  }
}

/* t3929: Works with your channels — one uniform chip size, one desktop line, mobile scroll */
html:root body#ag-unified-site #main .ag-channels-sec{
  width:min(1120px, calc(100% - 32px));
  max-width:100%;
  box-sizing:border-box;
  overflow:hidden;
}
html:root body#ag-unified-site #main .ag-channels{
  display:flex !important;
  flex-wrap:nowrap !important;
  align-items:center;
  gap:6px !important;
  margin:0;
  padding:0;
  list-style:none;
  max-width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
}
html:root body#ag-unified-site #main .ag-channels li{
  flex:none;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  height:28px !important;
  min-height:28px !important;
  padding:0 10px !important;
  border:1px solid #94a3c4;
  border-radius:999px !important;
  font-size:12.5px !important;
  line-height:1 !important;
  font-weight:600;
  white-space:nowrap !important;
  max-width:none !important;
  box-sizing:border-box;
}
@media (min-width:1280px){
  html:root body#ag-unified-site #main .ag-channels{overflow:visible;}
}

/* t3929b: float-tile overlays must stay transparent. An opaque tint on
   picture.ag-float-tile hid the base 3D (logo/pedestal/stairs) and left
   only the last tile visible. No mask on tiles — their subject sits at the edges. */
html:root body#ag-unified-site #main picture.ag-float-tile,
html:root body#ag-unified-site #main picture.ag-float-tile img,
html:root body#ag-unified-site #main .ag-float-tile,
html:root body#ag-unified-site #main .ag-float-tile img{
  background-color:transparent !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
  mix-blend-mode:normal !important;
}

/* Soft-blend the studio fill of BASE 3D art into the page (no pixel erase). */
html:root body#ag-unified-site #main picture.ag-new-hero img,
html:root body#ag-unified-site #main picture.ag-gap-stage img,
html:root body#ag-unified-site #main picture.ag-gap-hq img,
html:root body#ag-unified-site #main picture.ag-gap-pic img,
html:root body#ag-unified-site #main .lg2art img,
html:root body#ag-unified-site #main .b1art img,
html:root body#ag-unified-site #main .hm-art2 img,
html:root body#ag-unified-site #main .prod-hero-art > .ag-new-hero-stage > .ag-gap-stage > picture.ag-gap-pic img{
  mix-blend-mode:multiply !important;
}
html:root body#ag-unified-site #main .d img,
html:root body#ag-unified-site #main .pc.d img,
html:root body#ag-unified-site.dash img,
html:root body#ag-unified-site.auth img{
  mix-blend-mode:normal !important;
}

/* t3929: beat later #main li { font-size:max(15px) } on product pages */
html:root body#ag-unified-site#ag-unified-site #main#main ul.ag-channels > li,
html:root body#ag-unified-site #main ul.ag-channels > li.live,
html:root body#ag-unified-site #main ul.ag-channels > li.soon,
html:root body#ag-unified-site .ag-channels-sec ul.ag-channels > li{
  font-size:12.5px !important;
  line-height:1 !important;
  height:28px !important;
  min-height:28px !important;
  padding:0 10px !important;
  white-space:nowrap !important;
  flex:none;
  display:inline-flex !important;
  align-items:center;
  border-radius:999px !important;
}

/* Beat lot3-t3430's 7-id font floor on LRL / polished product pages */
html:root body#ag-unified-site.lot3-t3430 #main#main#main#main#main#main ul.ag-channels > li,
html:root body#ag-unified-site.lot3-t3430 #main#main#main#main#main#main ul.ag-channels > li.live,
html:root body#ag-unified-site.lot3-t3430 #main#main#main#main#main#main ul.ag-channels > li.soon,
html:root body#ag-unified-site[data-polish] #main#main#main#main#main#main ul.ag-channels > li{
  font-size:12.5px !important;
  line-height:1 !important;
  height:28px !important;
  min-height:28px !important;
  padding:0 10px !important;
  white-space:nowrap !important;
}

/* Hero stage hugs the wide 3D asset (no tall letterbox card). Tint off so
   multiply can blend the studio fill into the page gradient. */
html:root body#ag-unified-site #main .ag-hero-swapped,
html:root body#ag-unified-site #main .ag-hero-swapped .ag-new-hero-stage,
html:root body#ag-unified-site #main .ag-hero-swapped .ag-gap-stage,
html:root body#ag-unified-site #main .ag-hero-swapped .ag-gap-bleed,
html:root body#ag-unified-site #main .ag-hero-swapped picture,
html:root body#ag-unified-site #main .hm-art2,
html:root body#ag-unified-site #main .prod-hero-art,
html:root body#ag-unified-site #main .ag-inline-art,
html:root body#ag-unified-site #main .ag-inline-art picture.ag-new-hero{
  height:auto !important;
  min-height:0 !important;
  aspect-ratio:auto !important;
  background-color:transparent !important;
  background-image:none !important;
}
