/* Section-level texture measured from Oxlyn's public theme in REA v6.
   Each field fades to transparency; the X's separate v5 backdrop stays intact. */
.exo-home :is(.exo-products,.exo-process,.exo-premium-community,.exo-faq,.exo-pack-panel,.exo-final-panel),
.exo-redesign .product-experience :is(.resource-showcase,.resource-features,.resource-specs,.resource-install,.resource-faq,.customer-section,.related-resources,.product-description,.product-final-buy){
  position:relative;
  isolation:isolate;
  --section-grid-line:rgb(255 255 255 / .06);
  --section-grid-size:56px;
  --section-grid-mask:radial-gradient(ellipse 58% 62% at 50% 50%,#000 0%,rgb(0 0 0 / .55) 42%,transparent 74%);
}
.exo-home :is(.exo-products,.exo-process,.exo-premium-community,.exo-faq,.exo-pack-panel,.exo-final-panel)::before,
.exo-redesign .product-experience :is(.resource-showcase,.resource-features,.resource-specs,.resource-install,.resource-faq,.customer-section,.related-resources,.product-description,.product-final-buy)::before,
.exo-redesign .product-experience>.product-layout::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  border-radius:inherit;
  background-image:linear-gradient(90deg,var(--section-grid-line) 1px,transparent 1px),linear-gradient(var(--section-grid-line) 1px,transparent 1px);
  background-size:var(--section-grid-size) var(--section-grid-size);
  background-position:center;
  -webkit-mask-image:var(--section-grid-mask);
  mask-image:var(--section-grid-mask);
}
.exo-home :is(.exo-process,.exo-premium-community),
.exo-redesign .product-experience :is(.resource-features,.related-resources){
  --section-grid-line:rgb(168 88 255 / .15);
}
.exo-redesign .product-experience :is(.resource-showcase,.resource-features,.resource-specs,.resource-install,.resource-faq,.customer-section,.related-resources,.product-description){
  --section-grid-mask:radial-gradient(ellipse 55% 60% at 50% 40%,#000 0%,rgb(0 0 0 / .5) 42%,transparent 74%);
}
.exo-redesign .product-experience :is(.resource-showcase,.resource-features,.resource-specs,.resource-install,.resource-faq,.customer-section,.related-resources,.product-description)::before{
  background-position:center top;
}
.exo-home .exo-pack-panel{
  --section-grid-size:48px;
  --section-grid-line:rgb(168 88 255 / .15);
  --section-grid-mask:radial-gradient(ellipse 45% 80% at 78% 50%,#000 0%,rgb(0 0 0 / .5) 45%,transparent 78%);
}
.exo-home .exo-final-panel,
.exo-redesign .product-experience .product-final-buy{
  --section-grid-line:rgb(168 88 255 / .15);
  --section-grid-mask:radial-gradient(ellipse 60% 80% at 50% 100%,#000 0%,rgb(0 0 0 / .5) 45%,transparent 80%);
}
/* No new stacking context on the media layout: fullscreen keeps its layer. */
.exo-redesign .product-experience>.product-layout{
  --section-grid-size:56px;
  --section-grid-line:rgb(168 88 255 / .15);
  --section-grid-mask:radial-gradient(ellipse 40% 70% at 72% 50%,#000 0%,rgb(0 0 0 / .5) 45%,transparent 78%);
}
.exo-redesign .product-experience .product-final-buy>.product-final-image{z-index:-2}
@media(max-width:900px){
  .exo-home .exo-pack-panel{
    --section-grid-mask:radial-gradient(ellipse 90% 55% at 80% 15%,#000 0%,rgb(0 0 0 / .5) 45%,transparent 78%);
  }
}
@media(max-width:980px){
  .exo-redesign .product-experience>.product-layout{
    --section-grid-mask:radial-gradient(ellipse 75% 40% at 50% 22%,#000 0%,rgb(0 0 0 / .5) 45%,transparent 78%);
  }
}