/* ============================================================
   81+ · LUX81 · livello visivo luxury riutilizzabile
   - filigrana 81+/SICURISSIMO a 45° (tema dark/light)
   - diamanti scintillanti su tutto lo schermo
   - card "super luxury": bordo arancione pulsante, rilievo 3D,
     riflesso metallico che scorre. Additivo: non tocca la logica.
   ============================================================ */

/* ===== filigrana di sfondo a 45° ===== */
.wm81{position:fixed;inset:0;pointer-events:none;z-index:9990;background-repeat:repeat;background-size:300px 200px;overflow:hidden}
.wm81.dark{opacity:.2;background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='300'%20height='200'%3E%3Cg%20fill='%234a4a4a'%20font-family='Arial%20Black,Arial,sans-serif'%20font-weight='900'%20font-size='44'%3E%3Ctext%20x='34'%20y='74'%3E81%2B%3C/text%3E%3Ctext%20x='184'%20y='174'%3E81%2B%3C/text%3E%3C/g%3E%3Cg%20stroke='%234a4a4a'%20stroke-width='4'%20stroke-linecap='round'%3E%3Cline%20x1='214'%20y1='60'%20x2='238'%20y2='36'/%3E%3Cline%20x1='226'%20y1='60'%20x2='250'%20y2='36'/%3E%3Cline%20x1='238'%20y1='60'%20x2='262'%20y2='36'/%3E%3Cline%20x1='20'%20y1='160'%20x2='44'%20y2='136'/%3E%3Cline%20x1='32'%20y1='160'%20x2='56'%20y2='136'/%3E%3Cline%20x1='44'%20y1='160'%20x2='68'%20y2='136'/%3E%3C/g%3E%3C/svg%3E")}
.wm81.light{opacity:.16;background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='300'%20height='200'%3E%3Cg%20fill='%23b8b8b8'%20font-family='Arial%20Black,Arial,sans-serif'%20font-weight='900'%20font-size='44'%3E%3Ctext%20x='34'%20y='74'%3E81%2B%3C/text%3E%3Ctext%20x='184'%20y='174'%3E81%2B%3C/text%3E%3C/g%3E%3Cg%20stroke='%23b8b8b8'%20stroke-width='4'%20stroke-linecap='round'%3E%3Cline%20x1='214'%20y1='60'%20x2='238'%20y2='36'/%3E%3Cline%20x1='226'%20y1='60'%20x2='250'%20y2='36'/%3E%3Cline%20x1='238'%20y1='60'%20x2='262'%20y2='36'/%3E%3Cline%20x1='20'%20y1='160'%20x2='44'%20y2='136'/%3E%3Cline%20x1='32'%20y1='160'%20x2='56'%20y2='136'/%3E%3Cline%20x1='44'%20y1='160'%20x2='68'%20y2='136'/%3E%3C/g%3E%3C/svg%3E")}
.wm81::after{content:"";position:absolute;top:0;left:-30%;width:30%;height:100%;
  background:linear-gradient(115deg,transparent,rgba(255,255,255,0) 44%,rgba(255,255,255,.55) 50%,rgba(255,255,255,0) 56%,transparent);
  animation:lxPageShine 8s ease-in-out infinite}
@keyframes lxPageShine{0%,64%{left:-30%}92%,100%{left:130%}}

/* ===== PATTERN 81+ sulle CARD · standard fisso · tinta adattiva leggerissima =====
   Un solo pattern bianco in soft-light: su card arancio → arancio appena più chiaro,
   su card bianca → grigino, su card scura → grigio scuro. Mai invadente. */
/* REGOLA FISSA card: bordo 3D in rilievo + riflessi metallici in movimento + pulsazione + movimento */
.card,.card81,.pat81,.kpi81,.lcard,.sector,.feat,.gcard,.stat,.pvcard,.promo-card,.nft-card,.herocard{position:relative;isolation:isolate;
  box-shadow:0 10px 26px rgba(0,0,0,.20),inset 0 2px 0 rgba(255,255,255,.45),inset 0 -3px 10px rgba(0,0,0,.14);
  transition:transform .25s cubic-bezier(.2,.7,.2,1);animation:card81pulse 3.6s ease-in-out infinite;will-change:box-shadow,transform}
.card:hover,.card81:hover,.pat81:hover,.kpi81:hover,.lcard:hover,.sector:hover,.feat:hover,.gcard:hover,.stat:hover,.pvcard:hover,.promo-card:hover,.nft-card:hover,.herocard:hover{transform:translateY(-5px) scale(1.012)}
.card::after,.card81::after,.pat81::after,.kpi81::after,.lcard::after,.sector::after,.feat::after,.gcard::after,.stat::after,.pvcard::after,.promo-card::after,.nft-card::after,.herocard::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;z-index:0;
  background-image:linear-gradient(115deg,transparent 38%,rgba(255,255,255,.45) 47%,rgba(255,255,255,.78) 50%,rgba(255,255,255,.45) 53%,transparent 62%),url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='300'%20height='200'%3E%3Cg%20fill='%23ffffff'%20font-family='Arial%20Black,Arial,sans-serif'%20font-weight='900'%20font-size='44'%3E%3Ctext%20x='34'%20y='74'%3E81%2B%3C/text%3E%3Ctext%20x='184'%20y='174'%3E81%2B%3C/text%3E%3C/g%3E%3Cg%20stroke='%23ffffff'%20stroke-width='4'%20stroke-linecap='round'%3E%3Cline%20x1='214'%20y1='60'%20x2='238'%20y2='36'/%3E%3Cline%20x1='226'%20y1='60'%20x2='250'%20y2='36'/%3E%3Cline%20x1='238'%20y1='60'%20x2='262'%20y2='36'/%3E%3Cline%20x1='20'%20y1='160'%20x2='44'%20y2='136'/%3E%3Cline%20x1='32'%20y1='160'%20x2='56'%20y2='136'/%3E%3Cline%20x1='44'%20y1='160'%20x2='68'%20y2='136'/%3E%3C/g%3E%3C/svg%3E");
  background-size:230% 100%,300px 200px;background-repeat:no-repeat,repeat;background-position:-140% 0,0 0;
  mix-blend-mode:soft-light;opacity:.6;animation:card81shine 5.5s ease-in-out infinite}
.card>*,.card81>*,.pat81>*,.kpi81>*,.lcard>*,.sector>*,.feat>*,.gcard>*,.stat>*,.pvcard>*,.promo-card>*,.nft-card>*,.herocard>*{position:relative;z-index:1}
@keyframes card81pulse{0%,100%{box-shadow:0 10px 26px rgba(0,0,0,.20),inset 0 2px 0 rgba(255,255,255,.45),inset 0 -3px 10px rgba(0,0,0,.14),0 0 0 0 rgba(251,107,0,0)}50%{box-shadow:0 15px 34px rgba(0,0,0,.26),inset 0 2px 0 rgba(255,255,255,.5),inset 0 -3px 10px rgba(0,0,0,.16),0 0 24px 2px rgba(251,107,0,.24)}}
@keyframes card81shine{0%,56%{background-position:-140% 0,0 0}100%{background-position:240% 0,0 0}}
@media(prefers-reduced-motion:reduce){.card,.card81,.pat81,.kpi81,.lcard,.sector,.feat,.gcard,.stat,.pvcard,.promo-card,.nft-card,.herocard,.card::after,.card81::after,.pat81::after,.kpi81::after,.lcard::after,.sector::after,.feat::after,.gcard::after,.stat::after,.pvcard::after,.promo-card::after,.nft-card::after,.herocard::after{animation:none!important}}

/* ===== diamanti scintillanti ===== */
.lux81{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.lux81::before,.lux81::after{content:"";position:absolute;inset:0}
.lux81::before{animation:lxTwk 3.1s ease-in-out infinite}
.lux81::after{animation:lxTwk 2.3s ease-in-out infinite .7s}
@keyframes lxTwk{0%,100%{opacity:.2}50%{opacity:1}}
.lux81.dark::before{background-image:
  radial-gradient(2.2px 2.2px at 9% 16%,#fff,transparent 60%),
  radial-gradient(2px 2px at 22% 64%,#FFE9CF,transparent 60%),
  radial-gradient(1.6px 1.6px at 35% 28%,#fff,transparent 60%),
  radial-gradient(2.4px 2.4px at 51% 78%,#fff,transparent 60%),
  radial-gradient(1.8px 1.8px at 66% 12%,#FFD9B0,transparent 60%),
  radial-gradient(2px 2px at 78% 54%,#fff,transparent 60%),
  radial-gradient(1.6px 1.6px at 90% 30%,#fff,transparent 60%),
  radial-gradient(2.2px 2.2px at 14% 88%,#fff,transparent 60%),
  radial-gradient(1.7px 1.7px at 60% 40%,#FFE3C4,transparent 60%),
  radial-gradient(2px 2px at 86% 84%,#fff,transparent 60%)}
.lux81.dark::after{background-image:
  radial-gradient(1.6px 1.6px at 17% 40%,#fff,transparent 60%),
  radial-gradient(2.4px 2.4px at 30% 88%,#fff,transparent 60%),
  radial-gradient(1.8px 1.8px at 44% 20%,#FFCFA0,transparent 60%),
  radial-gradient(2px 2px at 58% 60%,#fff,transparent 60%),
  radial-gradient(1.6px 1.6px at 72% 30%,#fff,transparent 60%),
  radial-gradient(2.2px 2.2px at 83% 66%,#FFE9CF,transparent 60%),
  radial-gradient(1.7px 1.7px at 95% 50%,#fff,transparent 60%),
  radial-gradient(2px 2px at 7% 56%,#fff,transparent 60%),
  radial-gradient(1.6px 1.6px at 40% 50%,#fff,transparent 60%),
  radial-gradient(2.3px 2.3px at 64% 90%,#fff,transparent 60%)}
.lux81.light::before{background-image:
  radial-gradient(2.2px 2.2px at 9% 16%,#E1550B,transparent 60%),
  radial-gradient(2px 2px at 22% 64%,#C9A24A,transparent 60%),
  radial-gradient(1.6px 1.6px at 35% 28%,#FB6B00,transparent 60%),
  radial-gradient(2.4px 2.4px at 51% 78%,#E1550B,transparent 60%),
  radial-gradient(1.8px 1.8px at 66% 12%,#C9A24A,transparent 60%),
  radial-gradient(2px 2px at 78% 54%,#FB6B00,transparent 60%),
  radial-gradient(1.6px 1.6px at 90% 30%,#E1550B,transparent 60%),
  radial-gradient(2.2px 2.2px at 14% 88%,#C9A24A,transparent 60%),
  radial-gradient(1.7px 1.7px at 60% 40%,#FB6B00,transparent 60%),
  radial-gradient(2px 2px at 86% 84%,#E1550B,transparent 60%)}
.lux81.light::after{background-image:
  radial-gradient(1.6px 1.6px at 17% 40%,#FB6B00,transparent 60%),
  radial-gradient(2.4px 2.4px at 30% 88%,#E1550B,transparent 60%),
  radial-gradient(1.8px 1.8px at 44% 20%,#C9A24A,transparent 60%),
  radial-gradient(2px 2px at 58% 60%,#FB6B00,transparent 60%),
  radial-gradient(1.6px 1.6px at 72% 30%,#E1550B,transparent 60%),
  radial-gradient(2.2px 2.2px at 83% 66%,#C9A24A,transparent 60%),
  radial-gradient(1.7px 1.7px at 95% 50%,#FB6B00,transparent 60%),
  radial-gradient(2px 2px at 7% 56%,#E1550B,transparent 60%),
  radial-gradient(1.6px 1.6px at 40% 50%,#FB6B00,transparent 60%),
  radial-gradient(2.3px 2.3px at 64% 90%,#C9A24A,transparent 60%)}

/* ===== CARD super luxury ===== */
.lx{position:relative!important;overflow:hidden!important;
  border:1.5px solid rgba(251,107,0,.45)!important;
  box-shadow:0 24px 64px rgba(0,0,0,.40),0 5px 16px rgba(0,0,0,.26),
    inset 0 2px 0 rgba(255,255,255,.20),inset 0 -4px 12px rgba(0,0,0,.32),
    inset 2px 0 0 rgba(255,255,255,.05),inset -2px 0 0 rgba(0,0,0,.30)!important;
  animation:lxPulse 2.8s ease-in-out infinite;
  transition:transform .3s ease, box-shadow .3s ease}
@keyframes lxPulse{0%,100%{border-color:rgba(251,107,0,.42)}50%{border-color:rgba(251,107,0,.95)}}
.lx:hover{transform:translateY(-6px) scale(1.008);
  box-shadow:0 36px 90px rgba(251,107,0,.30),inset 0 2px 0 rgba(255,255,255,.28)!important}
/* riflesso metallico che scorre sopra la card */
.lx-gl{position:absolute;top:-60%;left:-85%;width:55%;height:220%;pointer-events:none;z-index:6;
  background:linear-gradient(115deg,transparent,rgba(255,255,255,.14) 46%,rgba(255,255,255,.52) 50%,rgba(255,255,255,.14) 54%,transparent);
  transform:rotate(9deg);animation:lxSweep 5.6s ease-in-out infinite}
@keyframes lxSweep{0%,58%{left:-85%}90%,100%{left:150%}}

/* ===== MOBILE: scorrimento fluido + niente animazioni pesanti (performance) ===== */
@media(max-width:760px){
  .card,.card81,.pat81,.kpi81,.lcard,.sector,.feat,.gcard,.stat,.pvcard,.promo-card,.nft-card,.herocard,
  .card::after,.card81::after,.pat81::after,.kpi81::after,.lcard::after,.sector::after,.feat::after,.gcard::after,.stat::after,.pvcard::after,.promo-card::after,.nft-card::after,.herocard::after,
  .lx,.lx-gl,.wm81::after,.lux81::before,.lux81::after{animation:none!important;will-change:auto!important}
}
html,body{-webkit-overflow-scrolling:touch}
