.ball-pulse-sync>div,.ball-pulse>div,.ball-scale-random>div,.ball-scale>div{background-color:#fff;border-radius:100%;margin:2px;display:inline-block}@-webkit-keyframes scale{0%,80%{-webkit-transform:scale(1);transform:scale(1);opacity:1}45%{-webkit-transform:scale(.1);transform:scale(.1);opacity:.7}}@keyframes scale{0%,80%{-webkit-transform:scale(1);transform:scale(1);opacity:1}45%{-webkit-transform:scale(.1);transform:scale(.1);opacity:.7}}.ball-pulse>div:nth-child(1){-webkit-animation:scale .75s -.24s infinite cubic-bezier(.2,.68,.18,1.08);animation:scale .75s -.24s infinite cubic-bezier(.2,.68,.18,1.08)}.ball-pulse>div:nth-child(2){-webkit-animation:scale .75s -.12s infinite cubic-bezier(.2,.68,.18,1.08);animation:scale .75s -.12s infinite cubic-bezier(.2,.68,.18,1.08)}.ball-pulse>div:nth-child(3){-webkit-animation:scale .75s 0s infinite cubic-bezier(.2,.68,.18,1.08);animation:scale .75s 0s infinite cubic-bezier(.2,.68,.18,1.08)}.ball-pulse>div{width:15px;height:15px;-webkit-animation-fill-mode:both;animation-fill-mode:both}@-webkit-keyframes ball-pulse-sync{33%{-webkit-transform:translateY(10px);transform:translateY(10px)}66%{-webkit-transform:translateY(-10px);transform:translateY(-10px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes ball-pulse-sync{33%{-webkit-transform:translateY(10px);transform:translateY(10px)}66%{-webkit-transform:translateY(-10px);transform:translateY(-10px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}.ball-pulse-sync>div:nth-child(1){-webkit-animation:ball-pulse-sync .6s -.14s infinite ease-in-out;animation:ball-pulse-sync .6s -.14s infinite ease-in-out}.ball-pulse-sync>div:nth-child(2){-webkit-animation:ball-pulse-sync .6s -70ms infinite ease-in-out;animation:ball-pulse-sync .6s -70ms infinite ease-in-out}.ball-pulse-sync>div:nth-child(3){-webkit-animation:ball-pulse-sync .6s 0s infinite ease-in-out;animation:ball-pulse-sync .6s 0s infinite ease-in-out}.ball-pulse-sync>div{width:15px;height:15px;-webkit-animation-fill-mode:both;animation-fill-mode:both}@-webkit-keyframes ball-scale{0%{-webkit-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);transform:scale(1);opacity:0}}@keyframes ball-scale{0%{-webkit-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);transform:scale(1);opacity:0}}.ball-scale>div{height:60px;width:60px;-webkit-animation:ball-scale 1s 0s ease-in-out infinite;animation:ball-scale 1s 0s ease-in-out infinite}.ball-scale-random{width:37px;height:40px}.ball-scale-random>div{position:absolute;height:30px;width:30px;-webkit-animation:ball-scale 1s 0s ease-in-out infinite;animation:ball-scale 1s 0s ease-in-out infinite}.ball-rotate,.ball-rotate>div{position:relative}.ball-rotate>div,.ball-rotate>div:after,.ball-rotate>div:before{background-color:#fff;width:15px;height:15px;border-radius:100%}.ball-scale-random>div:nth-child(1){margin-left:-7px;-webkit-animation:ball-scale 1s .2s ease-in-out infinite;animation:ball-scale 1s .2s ease-in-out infinite}.ball-scale-random>div:nth-child(3){margin-left:-2px;margin-top:9px;-webkit-animation:ball-scale 1s .5s ease-in-out infinite;animation:ball-scale 1s .5s ease-in-out infinite}@-webkit-keyframes rotate{0%{-webkit-transform:rotate(0);transform:rotate(0)}50%{-webkit-transform:rotate(180deg);transform:rotate(180deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.ball-rotate>div{margin:2px;-webkit-animation-fill-mode:both;animation-fill-mode:both}.ball-rotate>div:first-child{-webkit-animation:rotate 1s 0s cubic-bezier(.7,-.13,.22,.86) infinite;animation:rotate 1s 0s cubic-bezier(.7,-.13,.22,.86) infinite}.ball-rotate>div:after,.ball-rotate>div:before{margin:2px;content:"";position:absolute;opacity:.8}.ball-rotate>div:before{top:0;left:-28px}.ball-rotate>div:after{top:0;left:25px}.ball-clip-rotate>div{border-radius:100%;margin:2px;border:2px solid #fff;border-bottom-color:transparent;height:26px;width:26px;background:0 0!important;display:inline-block;-webkit-animation:rotate .75s 0s linear infinite;animation:rotate .75s 0s linear infinite}@keyframes rotate{0%{-webkit-transform:rotate(0);transform:rotate(0)}50%{-webkit-transform:rotate(180deg);transform:rotate(180deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes scale{30%{-webkit-transform:scale(.3);transform:scale(.3)}100%{-webkit-transform:scale(1);transform:scale(1)}}.ball-clip-rotate-pulse{position:relative;-webkit-transform:translateY(-15px);transform:translateY(-15px)}.ball-clip-rotate-pulse>div{-webkit-animation-fill-mode:both;animation-fill-mode:both;position:absolute;top:0;left:0;border-radius:100%}.ball-clip-rotate-pulse>div:first-child{background:#fff;height:16px;width:16px;top:7px;left:-7px;-webkit-animation:scale 1s 0s cubic-bezier(.09,.57,.49,.9) infinite;animation:scale 1s 0s cubic-bezier(.09,.57,.49,.9) infinite}.ball-clip-rotate-pulse>div:last-child{position:absolute;width:30px;height:30px;left:-16px;top:-2px;background:0 0;border:2px solid;border-color:#fff transparent;-webkit-animation:rotate 1s 0s cubic-bezier(.09,.57,.49,.9) infinite;animation:rotate 1s 0s cubic-bezier(.09,.57,.49,.9) infinite;-webkit-animation-duration:1s;animation-duration:1s}.ball-beat>div,.ball-scale-multiple>div{background-color:#fff;border-radius:100%}@keyframes rotate{0%{-webkit-transform:rotate(0) scale(1);transform:rotate(0) scale(1)}50%{-webkit-transform:rotate(180deg) scale(.6);transform:rotate(180deg) scale(.6)}100%{-webkit-transform:rotate(360deg) scale(1);transform:rotate(360deg) scale(1)}}.ball-clip-rotate-multiple{position:relative}.ball-clip-rotate-multiple>div{position:absolute;left:-20px;top:-20px;border:2px solid #fff;border-bottom-color:transparent;border-top-color:transparent;border-radius:100%;height:35px;width:35px;-webkit-animation:rotate 1s 0s ease-in-out infinite;animation:rotate 1s 0s ease-in-out infinite}.ball-clip-rotate-multiple>div:last-child{display:inline-block;top:-10px;left:-10px;width:15px;height:15px;-webkit-animation-duration:.5s;animation-duration:.5s;border-color:#fff transparent;-webkit-animation-direction:reverse;animation-direction:reverse}@-webkit-keyframes ball-scale-ripple{0%{-webkit-transform:scale(.1);transform:scale(.1);opacity:1}70%{-webkit-transform:scale(1);transform:scale(1);opacity:.7}100%{opacity:0}}@keyframes ball-scale-ripple{0%{-webkit-transform:scale(.1);transform:scale(.1);opacity:1}70%{-webkit-transform:scale(1);transform:scale(1);opacity:.7}100%{opacity:0}}.ball-scale-ripple>div{height:50px;width:50px;border-radius:100%;border:2px solid #fff;-webkit-animation:ball-scale-ripple 1s 0s infinite cubic-bezier(.21,.53,.56,.8);animation:ball-scale-ripple 1s 0s infinite cubic-bezier(.21,.53,.56,.8)}@-webkit-keyframes ball-scale-ripple-multiple{0%{-webkit-transform:scale(.1);transform:scale(.1);opacity:1}70%{-webkit-transform:scale(1);transform:scale(1);opacity:.7}100%{opacity:0}}@keyframes ball-scale-ripple-multiple{0%{-webkit-transform:scale(.1);transform:scale(.1);opacity:1}70%{-webkit-transform:scale(1);transform:scale(1);opacity:.7}100%{opacity:0}}.ball-scale-ripple-multiple{position:relative;-webkit-transform:translateY(-25px);transform:translateY(-25px)}.ball-scale-ripple-multiple>div:nth-child(0){-webkit-animation-delay:-.8s;animation-delay:-.8s}.ball-scale-ripple-multiple>div:nth-child(1){-webkit-animation-delay:-.6s;animation-delay:-.6s}.ball-scale-ripple-multiple>div:nth-child(2){-webkit-animation-delay:-.4s;animation-delay:-.4s}.ball-scale-ripple-multiple>div:nth-child(3){-webkit-animation-delay:-.2s;animation-delay:-.2s}.ball-scale-ripple-multiple>div{position:absolute;top:-2px;left:-26px;width:50px;height:50px;border-radius:100%;border:2px solid #fff;-webkit-animation:ball-scale-ripple-multiple 1.25s 0s infinite cubic-bezier(.21,.53,.56,.8);animation:ball-scale-ripple-multiple 1.25s 0s infinite cubic-bezier(.21,.53,.56,.8)}@-webkit-keyframes ball-beat{50%{opacity:.2;-webkit-transform:scale(.75);transform:scale(.75)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes ball-beat{50%{opacity:.2;-webkit-transform:scale(.75);transform:scale(.75)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}.ball-beat>div{width:15px;height:15px;margin:2px;display:inline-block;-webkit-animation:ball-beat .7s 0s infinite linear;animation:ball-beat .7s 0s infinite linear}.ball-beat>div:nth-child(2n-1){-webkit-animation-delay:-.35s!important;animation-delay:-.35s!important}@-webkit-keyframes ball-scale-multiple{0%{-webkit-transform:scale(0);transform:scale(0);opacity:0}5%{opacity:1}100%{-webkit-transform:scale(1);transform:scale(1);opacity:0}}@keyframes ball-scale-multiple{0%{-webkit-transform:scale(0);transform:scale(0);opacity:0}5%{opacity:1}100%{-webkit-transform:scale(1);transform:scale(1);opacity:0}}.ball-scale-multiple{position:relative;-webkit-transform:translateY(-30px);transform:translateY(-30px)}.ball-scale-multiple>div:nth-child(2){-webkit-animation-delay:-.4s;animation-delay:-.4s}.ball-scale-multiple>div:nth-child(3){-webkit-animation-delay:-.2s;animation-delay:-.2s}.ball-scale-multiple>div{position:absolute;left:-30px;top:0;opacity:0;margin:0;width:60px;height:60px;-webkit-animation:ball-scale-multiple 1s 0s linear infinite;animation:ball-scale-multiple 1s 0s linear infinite}.ball-triangle-path>div:nth-child(1),.ball-triangle-path>div:nth-child(2){-webkit-animation-duration:2s;-webkit-animation-timing-function:ease-in-out;-webkit-animation-iteration-count:infinite}@-webkit-keyframes ball-triangle-path-1{33%{-webkit-transform:translate(25px,-50px);transform:translate(25px,-50px)}66%{-webkit-transform:translate(50px,0);transform:translate(50px,0)}100%{-webkit-transform:translate(0,0);transform:translate(0,0)}}@keyframes ball-triangle-path-1{33%{-webkit-transform:translate(25px,-50px);transform:translate(25px,-50px)}66%{-webkit-transform:translate(50px,0);transform:translate(50px,0)}100%{-webkit-transform:translate(0,0);transform:translate(0,0)}}@-webkit-keyframes ball-triangle-path-2{33%{-webkit-transform:translate(25px,50px);transform:translate(25px,50px)}66%{-webkit-transform:translate(-25px,50px);transform:translate(-25px,50px)}100%{-webkit-transform:translate(0,0);transform:translate(0,0)}}@keyframes ball-triangle-path-2{33%{-webkit-transform:translate(25px,50px);transform:translate(25px,50px)}66%{-webkit-transform:translate(-25px,50px);transform:translate(-25px,50px)}100%{-webkit-transform:translate(0,0);transform:translate(0,0)}}@-webkit-keyframes ball-triangle-path-3{33%{-webkit-transform:translate(-50px,0);transform:translate(-50px,0)}66%{-webkit-transform:translate(-25px,-50px);transform:translate(-25px,-50px)}100%{-webkit-transform:translate(0,0);transform:translate(0,0)}}@keyframes ball-triangle-path-3{33%{-webkit-transform:translate(-50px,0);transform:translate(-50px,0)}66%{-webkit-transform:translate(-25px,-50px);transform:translate(-25px,-50px)}100%{-webkit-transform:translate(0,0);transform:translate(0,0)}}.ball-triangle-path{position:relative;-webkit-transform:translate(-29.99px,-37.51px);transform:translate(-29.99px,-37.51px)}.ball-triangle-path>div:nth-child(1){-webkit-animation-name:ball-triangle-path-1;animation-name:ball-triangle-path-1;-webkit-animation-delay:0;animation-delay:0;animation-duration:2s;animation-timing-function:ease-in-out;animation-iteration-count:infinite}.ball-triangle-path>div:nth-child(2){-webkit-animation-name:ball-triangle-path-2;animation-name:ball-triangle-path-2;-webkit-animation-delay:0;animation-delay:0;animation-duration:2s;animation-timing-function:ease-in-out;animation-iteration-count:infinite}.ball-triangle-path>div:nth-child(3){-webkit-animation-name:ball-triangle-path-3;animation-name:ball-triangle-path-3;-webkit-animation-delay:0;animation-delay:0;-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.ball-triangle-path>div{-webkit-animation-fill-mode:both;animation-fill-mode:both;position:absolute;width:10px;height:10px;border-radius:100%;border:1px solid #fff}.ball-grid-beat>div,.ball-pulse-rise>div{-webkit-animation-fill-mode:both;-webkit-animation-iteration-count:infinite}.ball-grid-beat>div,.ball-grid-pulse>div,.ball-pulse-rise>div{height:15px;border-radius:100%;display:inline-block;background-color:#fff;margin:2px}.ball-triangle-path>div:nth-of-type(1){top:50px}.ball-triangle-path>div:nth-of-type(2){left:25px}.ball-triangle-path>div:nth-of-type(3){top:50px;left:50px}@-webkit-keyframes ball-pulse-rise-even{0%{-webkit-transform:scale(1.1);transform:scale(1.1)}25%{-webkit-transform:translateY(-30px);transform:translateY(-30px)}50%{-webkit-transform:scale(.4);transform:scale(.4)}75%{-webkit-transform:translateY(30px);transform:translateY(30px)}100%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-transform:scale(1);transform:scale(1)}}@keyframes ball-pulse-rise-even{0%{-webkit-transform:scale(1.1);transform:scale(1.1)}25%{-webkit-transform:translateY(-30px);transform:translateY(-30px)}50%{-webkit-transform:scale(.4);transform:scale(.4)}75%{-webkit-transform:translateY(30px);transform:translateY(30px)}100%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes ball-pulse-rise-odd{0%{-webkit-transform:scale(.4);transform:scale(.4)}25%{-webkit-transform:translateY(30px);transform:translateY(30px)}50%{-webkit-transform:scale(1.1);transform:scale(1.1)}75%{-webkit-transform:translateY(-30px);transform:translateY(-30px)}100%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-transform:scale(.75);transform:scale(.75)}}@keyframes ball-pulse-rise-odd{0%{-webkit-transform:scale(.4);transform:scale(.4)}25%{-webkit-transform:translateY(30px);transform:translateY(30px)}50%{-webkit-transform:scale(1.1);transform:scale(1.1)}75%{-webkit-transform:translateY(-30px);transform:translateY(-30px)}100%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-transform:scale(.75);transform:scale(.75)}}.ball-pulse-rise>div{width:15px;animation-fill-mode:both;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:cubic-bezier(.15,.46,.9,.6);animation-timing-function:cubic-bezier(.15,.46,.9,.6);animation-iteration-count:infinite;-webkit-animation-delay:0;animation-delay:0}.ball-pulse-rise>div:nth-child(2n){-webkit-animation-name:ball-pulse-rise-even;animation-name:ball-pulse-rise-even}.ball-pulse-rise>div:nth-child(2n-1){-webkit-animation-name:ball-pulse-rise-odd;animation-name:ball-pulse-rise-odd}@-webkit-keyframes ball-grid-beat{50%{opacity:.7}100%{opacity:1}}@keyframes ball-grid-beat{50%{opacity:.7}100%{opacity:1}}.ball-grid-beat{width:57px}.ball-grid-beat>div:nth-child(1){-webkit-animation-delay:.15s;animation-delay:.15s;-webkit-animation-duration:1.45s;animation-duration:1.45s}.ball-grid-beat>div:nth-child(2){-webkit-animation-delay:-20ms;animation-delay:-20ms;-webkit-animation-duration:.97s;animation-duration:.97s}.ball-grid-beat>div:nth-child(3){-webkit-animation-delay:.66s;animation-delay:.66s;-webkit-animation-duration:1.23s;animation-duration:1.23s}.ball-grid-beat>div:nth-child(4){-webkit-animation-delay:.64s;animation-delay:.64s;-webkit-animation-duration:1.24s;animation-duration:1.24s}.ball-grid-beat>div:nth-child(5){-webkit-animation-delay:-.19s;animation-delay:-.19s;-webkit-animation-duration:1.13s;animation-duration:1.13s}.ball-grid-beat>div:nth-child(6){-webkit-animation-delay:.69s;animation-delay:.69s;-webkit-animation-duration:1.42s;animation-duration:1.42s}.ball-grid-beat>div:nth-child(7){-webkit-animation-delay:.58s;animation-delay:.58s;-webkit-animation-duration:1.14s;animation-duration:1.14s}.ball-grid-beat>div:nth-child(8){-webkit-animation-delay:.21s;animation-delay:.21s;-webkit-animation-duration:1.17s;animation-duration:1.17s}.ball-grid-beat>div:nth-child(9){-webkit-animation-delay:-.18s;animation-delay:-.18s;-webkit-animation-duration:.65s;animation-duration:.65s}.ball-grid-beat>div{width:15px;animation-fill-mode:both;float:left;-webkit-animation-name:ball-grid-beat;animation-name:ball-grid-beat;animation-iteration-count:infinite;-webkit-animation-delay:0;animation-delay:0}@-webkit-keyframes ball-grid-pulse{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(.5);transform:scale(.5);opacity:.7}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes ball-grid-pulse{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(.5);transform:scale(.5);opacity:.7}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.ball-grid-pulse{width:57px}.ball-grid-pulse>div:nth-child(1){-webkit-animation-delay:.22s;animation-delay:.22s;-webkit-animation-duration:.9s;animation-duration:.9s}.ball-grid-pulse>div:nth-child(2){-webkit-animation-delay:.64s;animation-delay:.64s;-webkit-animation-duration:1s;animation-duration:1s}.ball-grid-pulse>div:nth-child(3){-webkit-animation-delay:-.15s;animation-delay:-.15s;-webkit-animation-duration:.63s;animation-duration:.63s}.ball-grid-pulse>div:nth-child(4){-webkit-animation-delay:-30ms;animation-delay:-30ms;-webkit-animation-duration:1.24s;animation-duration:1.24s}.ball-grid-pulse>div:nth-child(5){-webkit-animation-delay:80ms;animation-delay:80ms;-webkit-animation-duration:1.37s;animation-duration:1.37s}.ball-grid-pulse>div:nth-child(6){-webkit-animation-delay:.43s;animation-delay:.43s;-webkit-animation-duration:1.55s;animation-duration:1.55s}.ball-grid-pulse>div:nth-child(7){-webkit-animation-delay:50ms;animation-delay:50ms;-webkit-animation-duration:.7s;animation-duration:.7s}.ball-grid-pulse>div:nth-child(8){-webkit-animation-delay:50ms;animation-delay:50ms;-webkit-animation-duration:.97s;animation-duration:.97s}.ball-grid-pulse>div:nth-child(9){-webkit-animation-delay:.3s;animation-delay:.3s;-webkit-animation-duration:.63s;animation-duration:.63s}.ball-grid-pulse>div{width:15px;-webkit-animation-fill-mode:both;animation-fill-mode:both;float:left;-webkit-animation-name:ball-grid-pulse;animation-name:ball-grid-pulse;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-delay:0;animation-delay:0}@-webkit-keyframes ball-spin-fade-loader{50%{opacity:.3;-webkit-transform:scale(.4);transform:scale(.4)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes ball-spin-fade-loader{50%{opacity:.3;-webkit-transform:scale(.4);transform:scale(.4)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}.ball-spin-fade-loader{position:relative;top:-10px;left:-10px}.ball-spin-fade-loader>div:nth-child(1){top:25px;left:0;-webkit-animation:ball-spin-fade-loader 1s -.96s infinite linear;animation:ball-spin-fade-loader 1s -.96s infinite linear}.ball-spin-fade-loader>div:nth-child(2){top:17.05px;left:17.05px;-webkit-animation:ball-spin-fade-loader 1s -.84s infinite linear;animation:ball-spin-fade-loader 1s -.84s infinite linear}.ball-spin-fade-loader>div:nth-child(3){top:0;left:25px;-webkit-animation:ball-spin-fade-loader 1s -.72s infinite linear;animation:ball-spin-fade-loader 1s -.72s infinite linear}.ball-spin-fade-loader>div:nth-child(4){top:-17.05px;left:17.05px;-webkit-animation:ball-spin-fade-loader 1s -.6s infinite linear;animation:ball-spin-fade-loader 1s -.6s infinite linear}.ball-spin-fade-loader>div:nth-child(5){top:-25px;left:0;-webkit-animation:ball-spin-fade-loader 1s -.48s infinite linear;animation:ball-spin-fade-loader 1s -.48s infinite linear}.ball-spin-fade-loader>div:nth-child(6){top:-17.05px;left:-17.05px;-webkit-animation:ball-spin-fade-loader 1s -.36s infinite linear;animation:ball-spin-fade-loader 1s -.36s infinite linear}.ball-spin-fade-loader>div:nth-child(7){top:0;left:-25px;-webkit-animation:ball-spin-fade-loader 1s -.24s infinite linear;animation:ball-spin-fade-loader 1s -.24s infinite linear}.ball-spin-fade-loader>div:nth-child(8){top:17.05px;left:-17.05px;-webkit-animation:ball-spin-fade-loader 1s -.12s infinite linear;animation:ball-spin-fade-loader 1s -.12s infinite linear}.ball-spin-fade-loader>div,.ball-spin-loader>div{-webkit-animation-fill-mode:both;position:absolute;width:15px;height:15px;border-radius:100%}.ball-spin-fade-loader>div{background-color:#fff;margin:2px;animation-fill-mode:both}@-webkit-keyframes ball-spin-loader{75%{opacity:.2}100%{opacity:1}}@keyframes ball-spin-loader{75%{opacity:.2}100%{opacity:1}}.ball-spin-loader{position:relative}.ball-spin-loader>span:nth-child(1){top:45px;left:0;-webkit-animation:ball-spin-loader 2s .9s infinite linear;animation:ball-spin-loader 2s .9s infinite linear}.ball-spin-loader>span:nth-child(2){top:30.68px;left:30.68px;-webkit-animation:ball-spin-loader 2s 1.8s infinite linear;animation:ball-spin-loader 2s 1.8s infinite linear}.ball-spin-loader>span:nth-child(3){top:0;left:45px;-webkit-animation:ball-spin-loader 2s 2.7s infinite linear;animation:ball-spin-loader 2s 2.7s infinite linear}.ball-spin-loader>span:nth-child(4){top:-30.68px;left:30.68px;-webkit-animation:ball-spin-loader 2s 3.6s infinite linear;animation:ball-spin-loader 2s 3.6s infinite linear}.ball-spin-loader>span:nth-child(5){top:-45px;left:0;-webkit-animation:ball-spin-loader 2s 4.5s infinite linear;animation:ball-spin-loader 2s 4.5s infinite linear}.ball-spin-loader>span:nth-child(6){top:-30.68px;left:-30.68px;-webkit-animation:ball-spin-loader 2s 5.4s infinite linear;animation:ball-spin-loader 2s 5.4s infinite linear}.ball-spin-loader>span:nth-child(7){top:0;left:-45px;-webkit-animation:ball-spin-loader 2s 6.3s infinite linear;animation:ball-spin-loader 2s 6.3s infinite linear}.ball-spin-loader>span:nth-child(8){top:30.68px;left:-30.68px;-webkit-animation:ball-spin-loader 2s 7.2s infinite linear;animation:ball-spin-loader 2s 7.2s infinite linear}.ball-spin-loader>div{animation-fill-mode:both;background:green}.ball-zig-zag-deflect>div,.ball-zig-zag>div{background-color:#fff;width:15px;height:15px;border-radius:100%;margin:2px 2px 2px 15px;top:4px;left:-7px}@-webkit-keyframes ball-zig{33%{-webkit-transform:translate(-15px,-30px);transform:translate(-15px,-30px)}66%{-webkit-transform:translate(15px,-30px);transform:translate(15px,-30px)}100%{-webkit-transform:translate(0,0);transform:translate(0,0)}}@keyframes ball-zig{33%{-webkit-transform:translate(-15px,-30px);transform:translate(-15px,-30px)}66%{-webkit-transform:translate(15px,-30px);transform:translate(15px,-30px)}100%{-webkit-transform:translate(0,0);transform:translate(0,0)}}@-webkit-keyframes ball-zag{33%{-webkit-transform:translate(15px,30px);transform:translate(15px,30px)}66%{-webkit-transform:translate(-15px,30px);transform:translate(-15px,30px)}100%{-webkit-transform:translate(0,0);transform:translate(0,0)}}@keyframes ball-zag{33%{-webkit-transform:translate(15px,30px);transform:translate(15px,30px)}66%{-webkit-transform:translate(-15px,30px);transform:translate(-15px,30px)}100%{-webkit-transform:translate(0,0);transform:translate(0,0)}}.ball-zig-zag{position:relative;-webkit-transform:translate(-15px,-15px);transform:translate(-15px,-15px)}.ball-zig-zag>div{-webkit-animation-fill-mode:both;animation-fill-mode:both;position:absolute}.ball-zig-zag>div:first-child{-webkit-animation:ball-zig .7s 0s infinite linear;animation:ball-zig .7s 0s infinite linear}.ball-zig-zag>div:last-child{-webkit-animation:ball-zag .7s 0s infinite linear;animation:ball-zag .7s 0s infinite linear}@-webkit-keyframes ball-zig-deflect{17%,84%{-webkit-transform:translate(-15px,-30px);transform:translate(-15px,-30px)}34%,67%{-webkit-transform:translate(15px,-30px);transform:translate(15px,-30px)}100%,50%{-webkit-transform:translate(0,0);transform:translate(0,0)}}@keyframes ball-zig-deflect{17%,84%{-webkit-transform:translate(-15px,-30px);transform:translate(-15px,-30px)}34%,67%{-webkit-transform:translate(15px,-30px);transform:translate(15px,-30px)}100%,50%{-webkit-transform:translate(0,0);transform:translate(0,0)}}@-webkit-keyframes ball-zag-deflect{17%,84%{-webkit-transform:translate(15px,30px);transform:translate(15px,30px)}34%,67%{-webkit-transform:translate(-15px,30px);transform:translate(-15px,30px)}100%,50%{-webkit-transform:translate(0,0);transform:translate(0,0)}}@keyframes ball-zag-deflect{17%,84%{-webkit-transform:translate(15px,30px);transform:translate(15px,30px)}34%,67%{-webkit-transform:translate(-15px,30px);transform:translate(-15px,30px)}100%,50%{-webkit-transform:translate(0,0);transform:translate(0,0)}}.ball-zig-zag-deflect{position:relative;-webkit-transform:translate(-15px,-15px);transform:translate(-15px,-15px)}.ball-zig-zag-deflect>div{-webkit-animation-fill-mode:both;animation-fill-mode:both;position:absolute}.line-scale-party>div,.line-scale-pulse-out-rapid>div,.line-scale-pulse-out>div,.line-scale>div{width:4px;height:35px;display:inline-block}.line-scale-party>div,.line-scale-pulse-out-rapid>div,.line-scale-pulse-out>div,.line-scale>div,.line-spin-fade-loader>div{border-radius:2px;margin:2px;background-color:#fff}.ball-zig-zag-deflect>div:first-child{-webkit-animation:ball-zig-deflect 1.5s 0s infinite linear;animation:ball-zig-deflect 1.5s 0s infinite linear}.ball-zig-zag-deflect>div:last-child{-webkit-animation:ball-zag-deflect 1.5s 0s infinite linear;animation:ball-zag-deflect 1.5s 0s infinite linear}@-webkit-keyframes line-scale{0%,100%{-webkit-transform:scaley(1);transform:scaley(1)}50%{-webkit-transform:scaley(.4);transform:scaley(.4)}}@keyframes line-scale{0%,100%{-webkit-transform:scaley(1);transform:scaley(1)}50%{-webkit-transform:scaley(.4);transform:scaley(.4)}}.line-scale>div:nth-child(1){-webkit-animation:line-scale 1s -.4s infinite cubic-bezier(.2,.68,.18,1.08);animation:line-scale 1s -.4s infinite cubic-bezier(.2,.68,.18,1.08)}.line-scale>div:nth-child(2){-webkit-animation:line-scale 1s -.3s infinite cubic-bezier(.2,.68,.18,1.08);animation:line-scale 1s -.3s infinite cubic-bezier(.2,.68,.18,1.08)}.line-scale>div:nth-child(3){-webkit-animation:line-scale 1s -.2s infinite cubic-bezier(.2,.68,.18,1.08);animation:line-scale 1s -.2s infinite cubic-bezier(.2,.68,.18,1.08)}.line-scale>div:nth-child(4){-webkit-animation:line-scale 1s -.1s infinite cubic-bezier(.2,.68,.18,1.08);animation:line-scale 1s -.1s infinite cubic-bezier(.2,.68,.18,1.08)}.line-scale>div:nth-child(5){-webkit-animation:line-scale 1s 0s infinite cubic-bezier(.2,.68,.18,1.08);animation:line-scale 1s 0s infinite cubic-bezier(.2,.68,.18,1.08)}.line-scale>div{-webkit-animation-fill-mode:both;animation-fill-mode:both}@-webkit-keyframes line-scale-party{0%,100%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(.5);transform:scale(.5)}}@keyframes line-scale-party{0%,100%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(.5);transform:scale(.5)}}.line-scale-party>div:nth-child(1){-webkit-animation-delay:.48s;animation-delay:.48s;-webkit-animation-duration:.54s;animation-duration:.54s}.line-scale-party>div:nth-child(2){-webkit-animation-delay:-.15s;animation-delay:-.15s;-webkit-animation-duration:1.15s;animation-duration:1.15s}.line-scale-party>div:nth-child(3){-webkit-animation-delay:40ms;animation-delay:40ms;-webkit-animation-duration:.77s;animation-duration:.77s}.line-scale-party>div:nth-child(4){-webkit-animation-delay:-.12s;animation-delay:-.12s;-webkit-animation-duration:.61s;animation-duration:.61s}.line-scale-party>div{-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-name:line-scale-party;animation-name:line-scale-party;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-delay:0;animation-delay:0}@-webkit-keyframes line-scale-pulse-out{0%,100%{-webkit-transform:scaley(1);transform:scaley(1)}50%{-webkit-transform:scaley(.4);transform:scaley(.4)}}@keyframes line-scale-pulse-out{0%,100%{-webkit-transform:scaley(1);transform:scaley(1)}50%{-webkit-transform:scaley(.4);transform:scaley(.4)}}.line-scale-pulse-out>div{-webkit-animation:line-scale-pulse-out .9s -.6s infinite cubic-bezier(.85,.25,.37,.85);animation:line-scale-pulse-out .9s -.6s infinite cubic-bezier(.85,.25,.37,.85)}.line-scale-pulse-out>div:nth-child(2),.line-scale-pulse-out>div:nth-child(4){-webkit-animation-delay:-.4s!important;animation-delay:-.4s!important}.line-scale-pulse-out>div:nth-child(1),.line-scale-pulse-out>div:nth-child(5){-webkit-animation-delay:-.2s!important;animation-delay:-.2s!important}@-webkit-keyframes line-scale-pulse-out-rapid{0%,90%{-webkit-transform:scaley(1);transform:scaley(1)}80%{-webkit-transform:scaley(.3);transform:scaley(.3)}}@keyframes line-scale-pulse-out-rapid{0%,90%{-webkit-transform:scaley(1);transform:scaley(1)}80%{-webkit-transform:scaley(.3);transform:scaley(.3)}}.line-scale-pulse-out-rapid>div{vertical-align:middle;-webkit-animation:line-scale-pulse-out-rapid .9s -.5s infinite cubic-bezier(.11,.49,.38,.78);animation:line-scale-pulse-out-rapid .9s -.5s infinite cubic-bezier(.11,.49,.38,.78)}.line-scale-pulse-out-rapid>div:nth-child(2),.line-scale-pulse-out-rapid>div:nth-child(4){-webkit-animation-delay:-.25s!important;animation-delay:-.25s!important}.line-scale-pulse-out-rapid>div:nth-child(1),.line-scale-pulse-out-rapid>div:nth-child(5){-webkit-animation-delay:0s!important;animation-delay:0s!important}@-webkit-keyframes line-spin-fade-loader{50%{opacity:.3}100%{opacity:1}}@keyframes line-spin-fade-loader{50%{opacity:.3}100%{opacity:1}}.line-spin-fade-loader{position:relative;top:-10px;left:-4px}.line-spin-fade-loader>div:nth-child(1){top:20px;left:0;-webkit-animation:line-spin-fade-loader 1.2s -.84s infinite ease-in-out;animation:line-spin-fade-loader 1.2s -.84s infinite ease-in-out}.line-spin-fade-loader>div:nth-child(2){top:13.64px;left:13.64px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-animation:line-spin-fade-loader 1.2s -.72s infinite ease-in-out;animation:line-spin-fade-loader 1.2s -.72s infinite ease-in-out}.line-spin-fade-loader>div:nth-child(3){top:0;left:20px;-webkit-transform:rotate(90deg);transform:rotate(90deg);-webkit-animation:line-spin-fade-loader 1.2s -.6s infinite ease-in-out;animation:line-spin-fade-loader 1.2s -.6s infinite ease-in-out}.line-spin-fade-loader>div:nth-child(4){top:-13.64px;left:13.64px;-webkit-transform:rotate(45deg);transform:rotate(45deg);-webkit-animation:line-spin-fade-loader 1.2s -.48s infinite ease-in-out;animation:line-spin-fade-loader 1.2s -.48s infinite ease-in-out}.line-spin-fade-loader>div:nth-child(5){top:-20px;left:0;-webkit-animation:line-spin-fade-loader 1.2s -.36s infinite ease-in-out;animation:line-spin-fade-loader 1.2s -.36s infinite ease-in-out}.line-spin-fade-loader>div:nth-child(6){top:-13.64px;left:-13.64px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-animation:line-spin-fade-loader 1.2s -.24s infinite ease-in-out;animation:line-spin-fade-loader 1.2s -.24s infinite ease-in-out}.line-spin-fade-loader>div:nth-child(7){top:0;left:-20px;-webkit-transform:rotate(90deg);transform:rotate(90deg);-webkit-animation:line-spin-fade-loader 1.2s -.12s infinite ease-in-out;animation:line-spin-fade-loader 1.2s -.12s infinite ease-in-out}.line-spin-fade-loader>div:nth-child(8){top:13.64px;left:-13.64px;-webkit-transform:rotate(45deg);transform:rotate(45deg);-webkit-animation:line-spin-fade-loader 1.2s 0s infinite ease-in-out;animation:line-spin-fade-loader 1.2s 0s infinite ease-in-out}.line-spin-fade-loader>div{-webkit-animation-fill-mode:both;animation-fill-mode:both;position:absolute;width:5px;height:15px}@-webkit-keyframes triangle-skew-spin{25%{-webkit-transform:perspective(100px) rotateX(180deg) rotateY(0);transform:perspective(100px) rotateX(180deg) rotateY(0)}50%{-webkit-transform:perspective(100px) rotateX(180deg) rotateY(180deg);transform:perspective(100px) rotateX(180deg) rotateY(180deg)}75%{-webkit-transform:perspective(100px) rotateX(0) rotateY(180deg);transform:perspective(100px) rotateX(0) rotateY(180deg)}100%{-webkit-transform:perspective(100px) rotateX(0) rotateY(0);transform:perspective(100px) rotateX(0) rotateY(0)}}@keyframes triangle-skew-spin{25%{-webkit-transform:perspective(100px) rotateX(180deg) rotateY(0);transform:perspective(100px) rotateX(180deg) rotateY(0)}50%{-webkit-transform:perspective(100px) rotateX(180deg) rotateY(180deg);transform:perspective(100px) rotateX(180deg) rotateY(180deg)}75%{-webkit-transform:perspective(100px) rotateX(0) rotateY(180deg);transform:perspective(100px) rotateX(0) rotateY(180deg)}100%{-webkit-transform:perspective(100px) rotateX(0) rotateY(0);transform:perspective(100px) rotateX(0) rotateY(0)}}.triangle-skew-spin>div{width:0;height:0;border-left:20px solid transparent;border-right:20px solid transparent;border-bottom:20px solid #fff;-webkit-animation:triangle-skew-spin 3s 0s cubic-bezier(.09,.57,.49,.9) infinite;animation:triangle-skew-spin 3s 0s cubic-bezier(.09,.57,.49,.9) infinite}@-webkit-keyframes square-spin{25%{-webkit-transform:perspective(100px) rotateX(180deg) rotateY(0);transform:perspective(100px) rotateX(180deg) rotateY(0)}50%{-webkit-transform:perspective(100px) rotateX(180deg) rotateY(180deg);transform:perspective(100px) rotateX(180deg) rotateY(180deg)}75%{-webkit-transform:perspective(100px) rotateX(0) rotateY(180deg);transform:perspective(100px) rotateX(0) rotateY(180deg)}100%{-webkit-transform:perspective(100px) rotateX(0) rotateY(0);transform:perspective(100px) rotateX(0) rotateY(0)}}@keyframes square-spin{25%{-webkit-transform:perspective(100px) rotateX(180deg) rotateY(0);transform:perspective(100px) rotateX(180deg) rotateY(0)}50%{-webkit-transform:perspective(100px) rotateX(180deg) rotateY(180deg);transform:perspective(100px) rotateX(180deg) rotateY(180deg)}75%{-webkit-transform:perspective(100px) rotateX(0) rotateY(180deg);transform:perspective(100px) rotateX(0) rotateY(180deg)}100%{-webkit-transform:perspective(100px) rotateX(0) rotateY(0);transform:perspective(100px) rotateX(0) rotateY(0)}}.square-spin>div{width:50px;height:50px;background:#fff;-webkit-animation:square-spin 3s 0s cubic-bezier(.09,.57,.49,.9) infinite;animation:square-spin 3s 0s cubic-bezier(.09,.57,.49,.9) infinite}.pacman>div:first-of-type,.pacman>div:nth-child(2){width:0;height:0;border-right:25px solid transparent;border-top:25px solid #fff;border-left:25px solid #fff;border-bottom:25px solid #fff;border-radius:25px;position:relative;left:-30px}@-webkit-keyframes rotate_pacman_half_up{0%,100%{-webkit-transform:rotate(270deg);transform:rotate(270deg)}50%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes rotate_pacman_half_up{0%,100%{-webkit-transform:rotate(270deg);transform:rotate(270deg)}50%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes rotate_pacman_half_down{0%,100%{-webkit-transform:rotate(90deg);transform:rotate(90deg)}50%{-webkit-transform:rotate(0);transform:rotate(0)}}@keyframes rotate_pacman_half_down{0%,100%{-webkit-transform:rotate(90deg);transform:rotate(90deg)}50%{-webkit-transform:rotate(0);transform:rotate(0)}}@-webkit-keyframes pacman-balls{75%{opacity:.7}100%{-webkit-transform:translate(-100px,-6.25px);transform:translate(-100px,-6.25px)}}@keyframes pacman-balls{75%{opacity:.7}100%{-webkit-transform:translate(-100px,-6.25px);transform:translate(-100px,-6.25px)}}.pacman{position:relative}.pacman>div:nth-child(3){-webkit-animation:pacman-balls 1s -.66s infinite linear;animation:pacman-balls 1s -.66s infinite linear}.pacman>div:nth-child(4){-webkit-animation:pacman-balls 1s -.33s infinite linear;animation:pacman-balls 1s -.33s infinite linear}.pacman>div:nth-child(5){-webkit-animation:pacman-balls 1s 0s infinite linear;animation:pacman-balls 1s 0s infinite linear}.pacman>div:first-of-type{-webkit-animation:rotate_pacman_half_up .5s 0s infinite;animation:rotate_pacman_half_up .5s 0s infinite}.pacman>div:nth-child(2){-webkit-animation:rotate_pacman_half_down .5s 0s infinite;animation:rotate_pacman_half_down .5s 0s infinite;margin-top:-50px}.pacman>div:nth-child(3),.pacman>div:nth-child(4),.pacman>div:nth-child(5),.pacman>div:nth-child(6){background-color:#fff;border-radius:100%;margin:2px;width:10px;height:10px;position:absolute;-webkit-transform:translate(0,-6.25px);transform:translate(0,-6.25px);top:25px;left:70px}@-webkit-keyframes cube-transition{25%{-webkit-transform:translateX(50px) scale(.5) rotate(-90deg);transform:translateX(50px) scale(.5) rotate(-90deg)}50%{-webkit-transform:translate(50px,50px) rotate(-180deg);transform:translate(50px,50px) rotate(-180deg)}75%{-webkit-transform:translateY(50px) scale(.5) rotate(-270deg);transform:translateY(50px) scale(.5) rotate(-270deg)}100%{-webkit-transform:rotate(-360deg);transform:rotate(-360deg)}}@keyframes cube-transition{25%{-webkit-transform:translateX(50px) scale(.5) rotate(-90deg);transform:translateX(50px) scale(.5) rotate(-90deg)}50%{-webkit-transform:translate(50px,50px) rotate(-180deg);transform:translate(50px,50px) rotate(-180deg)}75%{-webkit-transform:translateY(50px) scale(.5) rotate(-270deg);transform:translateY(50px) scale(.5) rotate(-270deg)}100%{-webkit-transform:rotate(-360deg);transform:rotate(-360deg)}}.cube-transition{position:relative;-webkit-transform:translate(-25px,-25px);transform:translate(-25px,-25px)}.cube-transition>div{width:10px;height:10px;position:absolute;top:-5px;left:-5px;background-color:#fff;-webkit-animation:cube-transition 1.6s 0s infinite ease-in-out;animation:cube-transition 1.6s 0s infinite ease-in-out}.cube-transition>div:last-child{-webkit-animation-delay:-.8s;animation-delay:-.8s}@-webkit-keyframes spin-rotate{0%{-webkit-transform:rotate(0);transform:rotate(0)}50%{-webkit-transform:rotate(180deg);transform:rotate(180deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes spin-rotate{0%{-webkit-transform:rotate(0);transform:rotate(0)}50%{-webkit-transform:rotate(180deg);transform:rotate(180deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.semi-circle-spin{position:relative;width:35px;height:35px;overflow:hidden}.semi-circle-spin>div{position:absolute;border-width:0;border-radius:100%;-webkit-animation:spin-rotate .6s 0s infinite linear;animation:spin-rotate .6s 0s infinite linear;background-image:linear-gradient(transparent 0,transparent 70%,#fff 30%,#fff 100%);width:100%;height:100%}

@font-face {
    font-family: 'ar-reg';
    src: url(//brunogaeta.com/wp-content/themes/subgrafica-theme/fonts/Archivo-Regular.eot);
    src: url(//brunogaeta.com/wp-content/themes/subgrafica-theme/fonts/Archivo-Regular.eot?#iefix) format('embedded-opentype'),
        url(//brunogaeta.com/wp-content/themes/subgrafica-theme/fonts/Archivo-Regular.woff2) format('woff2'),
        url(//brunogaeta.com/wp-content/themes/subgrafica-theme/fonts/Archivo-Regular.woff) format('woff'),
        url(//brunogaeta.com/wp-content/themes/subgrafica-theme/fonts/Archivo-Regular.ttf) format('truetype'),
        url(//brunogaeta.com/wp-content/themes/subgrafica-theme/fonts/Archivo-Regular.svg#Archivo-Regular) format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'lb-reg';
    src: url(//brunogaeta.com/wp-content/themes/subgrafica-theme/fonts/LibreBaskerville-Regular.eot);
    src: url(//brunogaeta.com/wp-content/themes/subgrafica-theme/fonts/LibreBaskerville-Regular.eot?#iefix) format('embedded-opentype'),
        url(//brunogaeta.com/wp-content/themes/subgrafica-theme/fonts/LibreBaskerville-Regular.woff2) format('woff2'),
        url(//brunogaeta.com/wp-content/themes/subgrafica-theme/fonts/LibreBaskerville-Regular.woff) format('woff'),
        url(//brunogaeta.com/wp-content/themes/subgrafica-theme/fonts/LibreBaskerville-Regular.ttf) format('truetype'),
        url(//brunogaeta.com/wp-content/themes/subgrafica-theme/fonts/LibreBaskerville-Regular.svg#LibreBaskerville-Regular) format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
/* Aktifo A Medium */
@font-face {
  font-family: 'AktifoA-Medium';
  src: url(//brunogaeta.com/wp-content/themes/subgrafica-theme/fonts/aktifo-a-medium.woff2) format('woff2'),
       url(//brunogaeta.com/wp-content/themes/subgrafica-theme/fonts/aktifo-a-medium.woff) format('woff');
  font-display: swap;
  font-weight: 500;
  font-style: normal;
}
/*
Theme Name:   Subgráfica theme
 Theme URI:    https://subgrafica.com/
 Description:  Subgráfica WP theme - 2026
 Author:       Subgráfica Estudio
 Author URI:   https://subgrafica.com/
 Template:     Divi
 Version:      7.0 2026 FEB
 License:      Attribution-NonCommercial 4.0 International
 License URI:  https://creativecommons.org/licenses/by-nc/4.0/
 */


/* =========================================================
   1. TOKENS / VARIABLES
========================================================= */
 :root {

    /* Colores */
  --gr: #B0B0B0;   /* gris */
  --ne: #111111;   /* negro */
  --bl: #F3F3F3;   /* blanco */
  --transp: transparent;

  /* Tipografías y pesos */
  --ffa: 'ar-reg', sans-serif;  /* Fuente A principal  */
  --ffb: 'lb-reg', sans-serif;  /* Fuente B secundaria */
  --fwl-reg: 400;           /* Peso regular */

  /* Tamaños para encabezados */
  --fs-h1: clamp(0.9rem, 1vw + 1rem, 0.9rem);    /* H1 */
  --fs-h2: clamp(1.0rem, 1vw + 1rem, 1.0rem);    /* H2 */
  --fs-h3: clamp(1.0rem, 1vw + 1rem, 1.0rem);    /* H3 */
  --fs-h4: clamp(1.0rem, 1vw + 1rem, 1.0rem);    /* H4 */
  --fs-h5: clamp(1.0rem, 1vw + 1rem, 1.0rem);    /* H5 */
  --fs-h6: clamp(1.0rem, 1vw + 1rem, 1.0rem);    /* H6 */

  /* Tamaños para párrafos */
  --fs-p-no: clamp(0.8rem, 2vw + 1rem, 0.8rem);  /* Párrafo normal  */
  --fs-p-gr: clamp(0.8rem, 1vw + 1rem, 0.85rem);     /* Párrafo grande  */
  --fls: 1px;
  /* Tamaños especiales */
  --fs-esp-h1: clamp(.9rem, 3vw + 1rem, 3.6rem); /* Especial H1 */
  --fs-esp-h4: clamp(.9rem, 3vw + 1rem, 2.2rem); /* Especial H4 */

  /* Line heights */
  --flh0: 100%;
  --flh1: 120%;
  --flh2: 150%;
}
/* =========================================================
   2. RESET / BASE
========================================================= */
html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}
/* =========================================================
   3. TIPOGRAFÍA Y TEXTO
========================================================= */
body {
  min-height: 100vh;
  min-height: 100dvh;
}

@supports (-webkit-touch-callout: none) {
  body {
    height: -webkit-fill-available;
  }
}
body {
  font-family: var(--ffa);
  font-size: var(--fs-p-no);
  font-weight: var(--fwl-reg);
  line-height: var(--flh1);
  color: var(--gr) !important; 
  background-color: var(--ne) !important;
  text-rendering: optimizeLegibility !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004);
}

::selection {
  background: var(--gr);
  color:var(--ne);
}

::-moz-selection {
  background: var(--gr);
  color:var(--ne);
}

a:active, a:active * {
  outline: none !important;
  outline-style: none !important;
}

a:focus, a:focus * {
  outline: none !important;
  outline-style: none !important;
}

 h1, h2, h3, h4, h5, h6 {
  color: var(--gr) !  important;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  hyphens: none;
  text-justify: inter-character;
 }

 p {
   hyphens: none;
   -webkit-hyphens: none;
   -moz-hyphens: none;
   text-align: justify;
   overflow-wrap: normal;
 }
br {
  margin-bottom: 4px;
}

a:link {
  text-decoration: none;
  opacity: 1;
  color: var(--gr);
  font-weight: var(--fwl-reg);
   transition-duration: 0.2s;
   -webkit-transition-timing-function: ease-in-out;
   transition-timing-function: ease-in-out;
 }

 a:hover {
   opacity: 1;
   text-decoration: none;
   color: var(--bl);
   transition: all 0.2s ease-in-out;
 }

 a:visited {
   color: var(--gr);
   opacity: 1;
 }
 /* Imágenes dentro de enlaces */
a img {
  transition: opacity 0.3s ease; /* transición base */
}

a:hover img {
  opacity: 0.9;
}

/* SVG inline dentro de enlaces */
a svg {
  transition: opacity 0.3s ease; /* transición base */
}

a:hover svg {
  opacity: 0.9;
}

a:visited svg {
  opacity: 1;
}

 h1 {
   font-family: var(--ffa);
   font-size: var(--fs-h1) !important;
   line-height: var(--flh1);
   letter-spacing: var(--fls);
 }
 h2 {
   font-family: var(--ffa);
   font-size: var(--fs-h1) !important;
   line-height: var(--flh1);
 }
 h3 {
   font-family: var(--ffa);
   font-size: var(--fs-h1) !important;
   line-height: var(--flh1);
 }
 h4 {
   font-family: var(--ffb);
   font-size: var(--fs-h2) !important;
   line-height: var(--flh1);
 }
 h5 {
   font-family: var(--ffb);
   font-size: var(--fs-h2) !important;
   line-height: var(--flh1);
 }
 h6 {
   font-family: var(--ffb);
   font-size: var(--fs-h2) !important;
   line-height: var(--flh1);
 }
 blockquote {
 border-color: var(--azul_claro);
}
.par-gra p {

}
.par-peq p {
  
}

 .no-text {
   cursor: default;
 }
 .no-data {
  -webkit-user-select: none; /* Safari */
     -moz-user-select: none; /* Firefox */
      -ms-user-select: none; /* IE10+ */
          user-select: none; /* Estándar moderno: Chrome, Edge, Firefox, Opera, Safari */
}
.link-especifico a:link,
.link-especifico a:visited {
  text-decoration: none;
  opacity: 1;
  transition: opacity 0.3s ease, color 0.3s ease;
}
.logo img {
  height: 14px !important;
  width: auto !important;
  max-width: none !important;
}

/* =========================================================
   4. LISTAS Y TEXTO DECORADO
========================================================= */
.lista-base ul {
  font-family: var(--ffb);
  list-style: none;
  color: var(--gr);
  font-size: var(--fs-p-gr);
  text-shadow: 0 1px 1px rgba(0,0,0,0.2);
  padding: 0;
  margin: 0;
  width: fit-content;
  text-align:left;
  line-height: none !important;
  cursor: default;
}

.lista-base ul li {
  margin-bottom: 5px;
  cursor: default;
}

.lista-base ul li a {
  font-family: var(--ffb);
  font-size: var(--fs-p-gr);
  line-height: var(--flh1);
  color: var(--gr);
  display: inline;
  text-decoration: none;
  opacity: 1;
}

/* Hover */
.lista-base ul li a:hover {
   text-decoration: none;
    color: var(--bl);
}

/* Visited */
.lista-base ul li a:visited {
  color: var(--gr);
  opacity: 1;
}

.lista-base ul {
  font-family: var(--ffb);
  list-style: none;
  color: var(--gr);
  font-size: var(--fs-p-gr);
  padding: 0;
  margin: 0;
  width: fit-content;
}

.lista-base ul li {
  margin-bottom: 5px;
}

.lista-base ul li a {
  font-family: var(--ffb);
  font-size: var(--fs-p-gr);
  color: var(--gr);
}

/* hover */
.lista-base ul li a:hover {
   text-decoration: none;
    color: var(--bl);
}

/* FIX REAL */
.lista-base a.is-active {
   text-decoration: none;
    color: var(--bl);
}

/* anchor auto */
.lista-base a.is-anchor-active {
   text-decoration: none;
    color: var(--bl);
}

/* horizontal */
.lista-base.horizontal ul {
  display: flex;
  gap: 25px;
}
/* =========================
   ACTIVE LINK PRO
========================= */

/* estado base activo */
.lista-base a.is-active{
  color: var(--bl);
  text-decoration: none;
}

/* hover del activo */
.lista-base a.is-active:hover{
  color: var(--bl);
  text-decoration: none;
}
/* visited se mantiene igual */
.lista-base a.is-active:visited{
  color: var(--bl);
}


/* ===============================
   VARIANTE HORIZONTAL
================================ */

.lista-base.horizontal ul {
  display: flex;
  gap: 25px; /* separación horizontal */
  align-items: left;
}

.lista-base.horizontal ul li {
  margin-bottom: 5px !important;
}
/* Link visualmente neutro (como span) */


/* estado editorial manual */
.lista-base .is-active {
   text-decoration: none;
    color: var(--bl);
}

/* estado automático por anchor */
.lista-base a.is-anchor-active {
   text-decoration: none;
    color: var(--bl);
}
/* asegurar hover visible siempre */
.lista-base ul li a:hover{
   text-decoration: none !important;
    color: var(--bl);
}

.archer {
   text-decoration: none !important;
    color: var(--bl) !important;
}

.lista-base .lang-switch a.is-active{
   text-decoration: none !important;
    color: var(--bl);
  opacity: 1 !important;
}

.back-close {
  display: inline-block;
  line-height: 0; /* evita espacio raro */
}

.back-close img {
  width: 20px;
  height: 20px;
  opacity: 0.6;
  transition: opacity 0.3s ease;
  cursor: pointer;
}

.back-close:hover img {
  opacity: 1;
}



/* Base para todos los p con ícono */
p.icono {
  position: relative;
  padding-left: 40px;   /* espacio para el ícono */
}

/* Estilo del pseudo-elemento */
p.icono::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
#proyecto {
  cursor: default;
}

#proyecto p {
color: var(--gr) !important;
padding-bottom: 20px;
text-align: justify;
}

#proyecto h4 {
  color: var(--gr) !important;
  padding-bottom: 30px;
}

/* Ícono mapa */
p.icono.map::before {
  background-image: url(https://oliverrenecirugiaplastica.com/wp-content/themes/subgrafica-theme/data/img/iconos/icon_LO.svg);
}

/* Ícono teléfono */
p.icono.tel::before {
  background-image: url(https://oliverrenecirugiaplastica.com/wp-content/themes/subgrafica-theme/data/img/iconos/icon_WH.svg);
}

.et_pb_preload::before {
  display: none !important;
}

/* Base: oculto pero ocupando el viewport fijo */
#sec-menu-movil {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100dvh;
  min-height: 100dvh;
  z-index: 99999;
  overflow: auto;
  -webkit-overflow-scrolling: touch;

  /* Estado oculto */
  opacity: 0;
  visibility: hidden;
  pointer-events: none;

  /* Fade fino */
  transition: opacity .28s ease, visibility .28s ease;
}

/* Visible */
#sec-menu-movil.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

/* Botón de cierre */
#sec-menu-movil .btn-close-menu-movil {
 /*  position: fixed;
  top: calc(17px + env(safe-area-inset-top));
  right: calc(4% + env(safe-area-inset-right));
  width: 50px;
  height: 50px;
  border: none;
  background: transparent;
  cursor: pointer;
  z-index: 100000;*/
}

/* Ícono X desde content */
#sec-menu-movil .btn-close-menu-movil::after {
 /*  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-image: url(https://oliverrenecirugiaplastica.com/wp-content/themes/subgrafica-theme/data/img/iconos/hm-oliver-rene_4.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;*/
}
/* Interacciones del botón */
#sec-menu-movil .btn-close-menu-movil:hover::after {/* 
 opacity: .8; */
}
#sec-menu-movil .btn-close-menu-movil:focus {
}

/* Bloqueo de scroll del documento cuando el menú está abierto */
html.no-scroll,
body.no-scroll {
  overflow: hidden !important;
  height: 100%;
  touch-action: none;
}
.navbar-blur {
  position: fixed;
  width: 100%;
  z-index: 1000;
}

/* Capa visual extendida */
.navbar-blur::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 150px; /* más grande que los 64px reales */

  pointer-events: none;

  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);

  /* Gradiente muy sutil */
  mask-image: linear-gradient(
    to bottom,
    black 0%,
    black 20%,
    transparent 100%
  );
  -webkit-mask-image: linear-gradient(
    to bottom,
    black 0%,
    black 20%,
    transparent 100%
  );
}


.lg-backdrop {
  background-color: var(--ne) !important;
}
.lg-outer .lg-img-wrap {
  padding: 10% !important;
}
/* Quitar zoom inicial LightGallery */
.lg-outer.lg-start-zoom .lg-object {
  transform: none !important;
  -webkit-transform: none !important;
  opacity: 1 !important;
  transition: none !important;
}
.grid-item {
  transition: opacity .35s ease !important;
}

.isotope-item {
  transition: opacity .35s ease !important;
}

/* evitar movimiento */
.grid-item,
.isotope-item {
  transition-property: opacity !important;
}
.difl_imagegallery_0 .grid .grid-item {
}
.lg-toolbar .lg-close::after {
  content: "\e070";
  position: fixed !important;
  top: 20px !important;
  right: 2% !important;
  width: 20px !important;
  height: 20px !important;
  background: url(https://subgrafica.com/data/img/close_.png) no-repeat center center !important;
    background-size: auto;
  background-size: auto;
  background-size: contain !important;
  border: none !important;
  color: transparent !important;
  font-size: 0 !important;
  opacity: 0.6 !important;
  padding: 0 !important;
  z-index: 9999999 !important;
  transition: opacity 0.3s ease;
}
.mfp-iframe-holder .mfp-content {
  line-height: 0;
  width: 100%;
  max-width: 1024px !important;
}


/* =========================================================
   7. LAYOUT Y UTILIDADES
========================================================= */
.vertical {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.left {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.bottom {
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.et_pb_row {
    max-width: 3840px !important;
}
.et_pb_section {
  background-color: transparent;
}

.et_pb_section.has-background {
  background-color: unset;
}
.df_ig_gallery {
  opacity: 0;
}

.df_ig_gallery.loaded {
  opacity: 1;
  transition: opacity .5s ease;
}
/* =========================================================
   8. EFECTOS Y ANIMACIONES
========================================================= */
.et_pb_preload, .et_pb_section.et_pb_section_video.et_pb_preload {
  position: relative;
  background: var(--ne) !important;
}

 /* Fade effect overlay-*/
 .animate {
   animation: fader 8s infinite linear;
 }

 @-webkit-keyframes fader {
   0% {
     opacity: 0;
   }

   80% {
     opacity: 0;
   }

   100% {
     opacity: 1;
   }
 }
 .effect::after {
     animation: grain 6s steps(10) infinite;
     background-image: url(https://subgrafica.com/data/img/grain.png);
     background-repeat: repeat;
     content: '';
     height: 300%;
     left: -100%;
     opacity: .04;
     pointer-events: none;
     position: fixed;
     top: -100%;
     transition: opacity 0.4s ease;
     width: 300%;
     will-change: transform;
     z-index: 3;
   }

 @keyframes grain {
   0% { transform: translate(20%, -15%) }
   10% { transform: translate(-20%, -15%) }
   20% { transform: translate(20%, -5%) }
   30% { transform: translate(-20%, -5%) }
   40% { transform: translate(20%, 5%) }
   50% { transform: translate(-20%, 5%) }
   60% { transform: translate(20%, 15%) }
   70% { transform: translate(-20%, 15%) }
   80% { transform: translate(20%, 5%) }
   90% { transform: translate(-20%, 5%) }
   100% { transform: translate(20%, -5%) }
 }

 /*  animation: fade-object 0.8s ease-out 0.2s forwards;
  transition: background 0.3s ease, transform 0.3s ease; */

 @keyframes fade-object {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* =========================================
   PAGE TRANSITION FADE
========================================= */

.page-transition-overlay{
  position: fixed;
  inset:0;
  background:var(--ne) !important;
  opacity:0;
  pointer-events:none;
  z-index:999999;
  transition: opacity .20s ease;
}

.page-transition-overlay.is-active{
  opacity:1;
  pointer-events:auto;
}

/* entrada suave al cargar */
body.page-enter{
  opacity:0;
  transition: opacity .20s ease;
}

body.page-enter.page-enter-active{
  opacity:1;
}


.is-editor-role #wp-admin-bar-et-use-visual-builder,
.is-editor-role #wp-admin-bar-et_visual_builder {
  display: none !important;
}

#wp-admin-bar-agsdg-et-use-visual-builder {
  display: none;
}

/* ============================
   MEDIA QUERIES DEFINITIVOS
============================ */

/* 1. Mundo móvil (tablets verticales + celulares) */
@media (max-width: 880px) {
  /* estilos móviles */
}

/* 2. Todo hasta desktop mediano (incluye tablets horizontales y laptops pequeñas) */
@media (max-width: 1365px) {
  /* estilos para pantallas <= 1365px */
}

/* 3. Desktop grande en adelante */
@media (min-width: 1366px) {
  /* estilos para pantallas grandes */
}
@media (max-width: 980px) {
  .et_pb_column {
    width: 100%;
    margin-bottom: 0px;
  }
}/*
Theme Name:   Subgráfica theme
 Theme URI:    https://subgrafica.com/
 Description:  Subgráfica WP theme - 2026
 Author:       Subgráfica Estudio
 Author URI:   https://subgrafica.com/
 Template:     Divi
 Version:      7.0 2026 FEB
 License:      Attribution-NonCommercial 4.0 International
 License URI:  https://creativecommons.org/licenses/by-nc/4.0/
 */


/* =========================================================
   1. TOKENS / VARIABLES
========================================================= */
 :root {

    /* Colores */
  --gr: #B0B0B0;   /* gris */
  --ne: #111111;   /* negro */
  --bl: #F3F3F3;   /* blanco */
  --transp: transparent;

  /* Tipografías y pesos */
  --ffa: 'ar-reg', sans-serif;  /* Fuente A principal  */
  --ffb: 'lb-reg', sans-serif;  /* Fuente B secundaria */
  --fwl-reg: 400;           /* Peso regular */

  /* Tamaños para encabezados */
  --fs-h1: clamp(0.9rem, 1vw + 1rem, 0.9rem);    /* H1 */
  --fs-h2: clamp(1.0rem, 1vw + 1rem, 1.0rem);    /* H2 */
  --fs-h3: clamp(1.0rem, 1vw + 1rem, 1.0rem);    /* H3 */
  --fs-h4: clamp(1.0rem, 1vw + 1rem, 1.0rem);    /* H4 */
  --fs-h5: clamp(1.0rem, 1vw + 1rem, 1.0rem);    /* H5 */
  --fs-h6: clamp(1.0rem, 1vw + 1rem, 1.0rem);    /* H6 */

  /* Tamaños para párrafos */
  --fs-p-no: clamp(0.8rem, 2vw + 1rem, 0.8rem);  /* Párrafo normal  */
  --fs-p-gr: clamp(0.8rem, 1vw + 1rem, 0.85rem);     /* Párrafo grande  */
  --fls: 1px;
  /* Tamaños especiales */
  --fs-esp-h1: clamp(.9rem, 3vw + 1rem, 3.6rem); /* Especial H1 */
  --fs-esp-h4: clamp(.9rem, 3vw + 1rem, 2.2rem); /* Especial H4 */

  /* Line heights */
  --flh0: 100%;
  --flh1: 120%;
  --flh2: 150%;
}
/* =========================================================
   2. RESET / BASE
========================================================= */
html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}
/* =========================================================
   3. TIPOGRAFÍA Y TEXTO
========================================================= */
body {
  min-height: 100vh;
  min-height: 100dvh;
}

@supports (-webkit-touch-callout: none) {
  body {
    height: -webkit-fill-available;
  }
}
body {
  font-family: var(--ffa);
  font-size: var(--fs-p-no);
  font-weight: var(--fwl-reg);
  line-height: var(--flh1);
  color: var(--gr) !important; 
  background-color: var(--ne) !important;
  text-rendering: optimizeLegibility !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004);
}

::selection {
  background: var(--gr);
  color:var(--ne);
}

::-moz-selection {
  background: var(--gr);
  color:var(--ne);
}

a:active, a:active * {
  outline: none !important;
  outline-style: none !important;
}

a:focus, a:focus * {
  outline: none !important;
  outline-style: none !important;
}

 h1, h2, h3, h4, h5, h6 {
  color: var(--gr) !  important;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  hyphens: none;
  text-justify: inter-character;
 }

 p {
   hyphens: none;
   -webkit-hyphens: none;
   -moz-hyphens: none;
   text-align: justify;
   overflow-wrap: normal;
 }
br {
  margin-bottom: 4px;
}

a:link {
  text-decoration: none;
  opacity: 1;
  color: var(--gr);
  font-weight: var(--fwl-reg);
   transition-duration: 0.2s;
   -webkit-transition-timing-function: ease-in-out;
   transition-timing-function: ease-in-out;
 }

 a:hover {
   opacity: 1;
   text-decoration: none;
   color: var(--bl);
   transition: all 0.2s ease-in-out;
 }

 a:visited {
   color: var(--gr);
   opacity: 1;
 }
 /* Imágenes dentro de enlaces */
a img {
  transition: opacity 0.3s ease; /* transición base */
}

a:hover img {
  opacity: 0.9;
}

/* SVG inline dentro de enlaces */
a svg {
  transition: opacity 0.3s ease; /* transición base */
}

a:hover svg {
  opacity: 0.9;
}

a:visited svg {
  opacity: 1;
}

 h1 {
   font-family: var(--ffa);
   font-size: var(--fs-h1) !important;
   line-height: var(--flh1);
   letter-spacing: var(--fls);
 }
 h2 {
   font-family: var(--ffa);
   font-size: var(--fs-h1) !important;
   line-height: var(--flh1);
 }
 h3 {
   font-family: var(--ffa);
   font-size: var(--fs-h1) !important;
   line-height: var(--flh1);
 }
 h4 {
   font-family: var(--ffb);
   font-size: var(--fs-h2) !important;
   line-height: var(--flh1);
 }
 h5 {
   font-family: var(--ffb);
   font-size: var(--fs-h2) !important;
   line-height: var(--flh1);
 }
 h6 {
   font-family: var(--ffb);
   font-size: var(--fs-h2) !important;
   line-height: var(--flh1);
 }
 blockquote {
 border-color: var(--azul_claro);
}
.par-gra p {

}
.par-peq p {
  
}

 .no-text {
   cursor: default;
 }
 .no-data {
  -webkit-user-select: none; /* Safari */
     -moz-user-select: none; /* Firefox */
      -ms-user-select: none; /* IE10+ */
          user-select: none; /* Estándar moderno: Chrome, Edge, Firefox, Opera, Safari */
}
.link-especifico a:link,
.link-especifico a:visited {
  text-decoration: none;
  opacity: 1;
  transition: opacity 0.3s ease, color 0.3s ease;
}
.logo img {
  height: 14px !important;
  width: auto !important;
  max-width: none !important;
}

/* =========================================================
   4. LISTAS Y TEXTO DECORADO
========================================================= */
.lista-base ul {
  font-family: var(--ffb);
  list-style: none;
  color: var(--gr);
  font-size: var(--fs-p-gr);
  text-shadow: 0 1px 1px rgba(0,0,0,0.2);
  padding: 0;
  margin: 0;
  width: fit-content;
  text-align:left;
  line-height: none !important;
  cursor: default;
}

.lista-base ul li {
  margin-bottom: 5px;
  cursor: default;
}

.lista-base ul li a {
  font-family: var(--ffb);
  font-size: var(--fs-p-gr);
  line-height: var(--flh1);
  color: var(--gr);
  display: inline;
  text-decoration: none;
  opacity: 1;
}

/* Hover */
.lista-base ul li a:hover {
   text-decoration: none;
    color: var(--bl);
}

/* Visited */
.lista-base ul li a:visited {
  color: var(--gr);
  opacity: 1;
}

.lista-base ul {
  font-family: var(--ffb);
  list-style: none;
  color: var(--gr);
  font-size: var(--fs-p-gr);
  padding: 0;
  margin: 0;
  width: fit-content;
}

.lista-base ul li {
  margin-bottom: 5px;
}

.lista-base ul li a {
  font-family: var(--ffb);
  font-size: var(--fs-p-gr);
  color: var(--gr);
}

/* hover */
.lista-base ul li a:hover {
   text-decoration: none;
    color: var(--bl);
}

/* FIX REAL */
.lista-base a.is-active {
   text-decoration: none;
    color: var(--bl);
}

/* anchor auto */
.lista-base a.is-anchor-active {
   text-decoration: none;
    color: var(--bl);
}

/* horizontal */
.lista-base.horizontal ul {
  display: flex;
  gap: 25px;
}
/* =========================
   ACTIVE LINK PRO
========================= */

/* estado base activo */
.lista-base a.is-active{
  color: var(--bl);
  text-decoration: none;
}

/* hover del activo */
.lista-base a.is-active:hover{
  color: var(--bl);
  text-decoration: none;
}
/* visited se mantiene igual */
.lista-base a.is-active:visited{
  color: var(--bl);
}


/* ===============================
   VARIANTE HORIZONTAL
================================ */

.lista-base.horizontal ul {
  display: flex;
  gap: 25px; /* separación horizontal */
  align-items: left;
}

.lista-base.horizontal ul li {
  margin-bottom: 5px !important;
}
/* Link visualmente neutro (como span) */


/* estado editorial manual */
.lista-base .is-active {
   text-decoration: none;
    color: var(--bl);
}

/* estado automático por anchor */
.lista-base a.is-anchor-active {
   text-decoration: none;
    color: var(--bl);
}
/* asegurar hover visible siempre */
.lista-base ul li a:hover{
   text-decoration: none !important;
    color: var(--bl);
}

.archer {
   text-decoration: none !important;
    color: var(--bl) !important;
}

.lista-base .lang-switch a.is-active{
   text-decoration: none !important;
    color: var(--bl);
  opacity: 1 !important;
}

.back-close {
  display: inline-block;
  line-height: 0; /* evita espacio raro */
}

.back-close img {
  width: 20px;
  height: 20px;
  opacity: 0.6;
  transition: opacity 0.3s ease;
  cursor: pointer;
}

.back-close:hover img {
  opacity: 1;
}



/* Base para todos los p con ícono */
p.icono {
  position: relative;
  padding-left: 40px;   /* espacio para el ícono */
}

/* Estilo del pseudo-elemento */
p.icono::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
#proyecto {
  cursor: default;
}

#proyecto p {
color: var(--gr) !important;
padding-bottom: 20px;
text-align: justify;
}

#proyecto h4 {
  color: var(--gr) !important;
  padding-bottom: 30px;
}

/* Ícono mapa */
p.icono.map::before {
  background-image: url(https://oliverrenecirugiaplastica.com/wp-content/themes/subgrafica-theme/data/img/iconos/icon_LO.svg);
}

/* Ícono teléfono */
p.icono.tel::before {
  background-image: url(https://oliverrenecirugiaplastica.com/wp-content/themes/subgrafica-theme/data/img/iconos/icon_WH.svg);
}

.et_pb_preload::before {
  display: none !important;
}

/* Base: oculto pero ocupando el viewport fijo */
#sec-menu-movil {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100dvh;
  min-height: 100dvh;
  z-index: 99999;
  overflow: auto;
  -webkit-overflow-scrolling: touch;

  /* Estado oculto */
  opacity: 0;
  visibility: hidden;
  pointer-events: none;

  /* Fade fino */
  transition: opacity .28s ease, visibility .28s ease;
}

/* Visible */
#sec-menu-movil.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

/* Botón de cierre */
#sec-menu-movil .btn-close-menu-movil {
 /*  position: fixed;
  top: calc(17px + env(safe-area-inset-top));
  right: calc(4% + env(safe-area-inset-right));
  width: 50px;
  height: 50px;
  border: none;
  background: transparent;
  cursor: pointer;
  z-index: 100000;*/
}

/* Ícono X desde content */
#sec-menu-movil .btn-close-menu-movil::after {
 /*  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-image: url(https://oliverrenecirugiaplastica.com/wp-content/themes/subgrafica-theme/data/img/iconos/hm-oliver-rene_4.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;*/
}
/* Interacciones del botón */
#sec-menu-movil .btn-close-menu-movil:hover::after {/* 
 opacity: .8; */
}
#sec-menu-movil .btn-close-menu-movil:focus {
}

/* Bloqueo de scroll del documento cuando el menú está abierto */
html.no-scroll,
body.no-scroll {
  overflow: hidden !important;
  height: 100%;
  touch-action: none;
}
.navbar-blur {
  position: fixed;
  width: 100%;
  z-index: 1000;
}

/* Capa visual extendida */
.navbar-blur::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 150px; /* más grande que los 64px reales */

  pointer-events: none;

  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);

  /* Gradiente muy sutil */
  mask-image: linear-gradient(
    to bottom,
    black 0%,
    black 20%,
    transparent 100%
  );
  -webkit-mask-image: linear-gradient(
    to bottom,
    black 0%,
    black 20%,
    transparent 100%
  );
}


.lg-backdrop {
  background-color: var(--ne) !important;
}
.lg-outer .lg-img-wrap {
  padding: 10% !important;
}
/* Quitar zoom inicial LightGallery */
.lg-outer.lg-start-zoom .lg-object {
  transform: none !important;
  -webkit-transform: none !important;
  opacity: 1 !important;
  transition: none !important;
}
.grid-item {
  transition: opacity .35s ease !important;
}

.isotope-item {
  transition: opacity .35s ease !important;
}

/* evitar movimiento */
.grid-item,
.isotope-item {
  transition-property: opacity !important;
}
.difl_imagegallery_0 .grid .grid-item {
}
.lg-toolbar .lg-close::after {
  content: "\e070";
  position: fixed !important;
  top: 20px !important;
  right: 2% !important;
  width: 20px !important;
  height: 20px !important;
  background: url(https://subgrafica.com/data/img/close_.png) no-repeat center center !important;
    background-size: auto;
  background-size: auto;
  background-size: contain !important;
  border: none !important;
  color: transparent !important;
  font-size: 0 !important;
  opacity: 0.6 !important;
  padding: 0 !important;
  z-index: 9999999 !important;
  transition: opacity 0.3s ease;
}
.mfp-iframe-holder .mfp-content {
  line-height: 0;
  width: 100%;
  max-width: 1024px !important;
}


/* =========================================================
   7. LAYOUT Y UTILIDADES
========================================================= */
.vertical {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.left {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.bottom {
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.et_pb_row {
    max-width: 3840px !important;
}
.et_pb_section {
  background-color: transparent;
}

.et_pb_section.has-background {
  background-color: unset;
}
.df_ig_gallery {
  opacity: 0;
}

.df_ig_gallery.loaded {
  opacity: 1;
  transition: opacity .5s ease;
}
/* =========================================================
   8. EFECTOS Y ANIMACIONES
========================================================= */
.et_pb_preload, .et_pb_section.et_pb_section_video.et_pb_preload {
  position: relative;
  background: var(--ne) !important;
}

 /* Fade effect overlay-*/
 .animate {
   animation: fader 8s infinite linear;
 }

 @-webkit-keyframes fader {
   0% {
     opacity: 0;
   }

   80% {
     opacity: 0;
   }

   100% {
     opacity: 1;
   }
 }
 .effect::after {
     animation: grain 6s steps(10) infinite;
     background-image: url(https://subgrafica.com/data/img/grain.png);
     background-repeat: repeat;
     content: '';
     height: 300%;
     left: -100%;
     opacity: .04;
     pointer-events: none;
     position: fixed;
     top: -100%;
     transition: opacity 0.4s ease;
     width: 300%;
     will-change: transform;
     z-index: 3;
   }

 @keyframes grain {
   0% { transform: translate(20%, -15%) }
   10% { transform: translate(-20%, -15%) }
   20% { transform: translate(20%, -5%) }
   30% { transform: translate(-20%, -5%) }
   40% { transform: translate(20%, 5%) }
   50% { transform: translate(-20%, 5%) }
   60% { transform: translate(20%, 15%) }
   70% { transform: translate(-20%, 15%) }
   80% { transform: translate(20%, 5%) }
   90% { transform: translate(-20%, 5%) }
   100% { transform: translate(20%, -5%) }
 }

 /*  animation: fade-object 0.8s ease-out 0.2s forwards;
  transition: background 0.3s ease, transform 0.3s ease; */

 @keyframes fade-object {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* =========================================
   PAGE TRANSITION FADE
========================================= */

.page-transition-overlay{
  position: fixed;
  inset:0;
  background:var(--ne) !important;
  opacity:0;
  pointer-events:none;
  z-index:999999;
  transition: opacity .20s ease;
}

.page-transition-overlay.is-active{
  opacity:1;
  pointer-events:auto;
}

/* entrada suave al cargar */
body.page-enter{
  opacity:0;
  transition: opacity .20s ease;
}

body.page-enter.page-enter-active{
  opacity:1;
}


.is-editor-role #wp-admin-bar-et-use-visual-builder,
.is-editor-role #wp-admin-bar-et_visual_builder {
  display: none !important;
}

#wp-admin-bar-agsdg-et-use-visual-builder {
  display: none;
}

/* ============================
   MEDIA QUERIES DEFINITIVOS
============================ */

/* 1. Mundo móvil (tablets verticales + celulares) */
@media (max-width: 880px) {
  /* estilos móviles */
}

/* 2. Todo hasta desktop mediano (incluye tablets horizontales y laptops pequeñas) */
@media (max-width: 1365px) {
  /* estilos para pantallas <= 1365px */
}

/* 3. Desktop grande en adelante */
@media (min-width: 1366px) {
  /* estilos para pantallas grandes */
}
@media (max-width: 980px) {
  .et_pb_column {
    width: 100%;
    margin-bottom: 0px;
  }
}/* ----------------------------------------------------------
   MEDIA HOVERS MODULE – Subgrafica
   FINAL PRO (ALIGNED WITH PHP)
----------------------------------------------------------- */

/* =========================================
   OUTER WRAPPER
========================================= */

.et_pb_media_hovers_wrapper{
  position:relative;
  width:100%;
  margin-bottom:40px;
  display:block;
}

/* =========================================
   MEDIA WRAPPER
========================================= */

.mh-media-wrapper{
  position:relative;
  width:100%;
  display:block;
  overflow:hidden;
}

/* =========================================
   LINK OVERLAY (SOLO IMAGEN)
========================================= */

.et_pb_media_hovers_wrapper.mh-click-link .mh-real-link{
  position:absolute;
  inset:0;
  display:block;
  z-index:3;
  text-indent:-9999px;
}

/* =========================================
   STILL IMAGE
========================================= */

.mh-image-wrapper{
  position:relative;
  width:100%;
  overflow:hidden;
}

.mh-background{
  width:100%;
  height:auto;
  display:block;
  object-fit:cover;
  object-position:center;
  opacity:0;
  transition:opacity .28s ease;
}

/* load sync */

.et_pb_media_hovers_wrapper.mh-loaded .mh-background{
  opacity:.9;
}

/* editorial hover */

.et_pb_media_hovers_wrapper:hover .mh-background{
  opacity:1;
}

/* =========================================
   HOVER VIDEO
========================================= */

.mh-hover-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  opacity:0;
  object-fit:cover;
  object-position:center;
  pointer-events:none;
  transition:opacity .28s ease;
}

.et_pb_media_hovers_wrapper.has-hover-video:hover .mh-background{
  opacity:0;
}

.et_pb_media_hovers_wrapper.has-hover-video:hover .mh-hover-video{
  opacity:1;
}

/* =========================================
   MOBILE FIX
========================================= */

@media (max-width:981px){

  .et_pb_media_hovers_wrapper.has-hover-video:hover .mh-background{
    opacity:.9 !important;
  }

  .et_pb_media_hovers_wrapper.has-hover-video:hover .mh-hover-video{
    opacity:0 !important;
  }

}

/* =========================================
   MEDIA FIT
========================================= */

.mh-fit-cover .mh-background,
.mh-fit-cover .mh-hover-video{
  object-fit:cover;
}

.mh-fit-contain .mh-background,
.mh-fit-contain .mh-hover-video{
  object-fit:contain;
}

/* =========================================
   VIDEO POSITION
========================================= */

.mh-pos-center .mh-hover-video{ object-position:center; }
.mh-pos-top .mh-hover-video{ object-position:top; }
.mh-pos-bottom .mh-hover-video{ object-position:bottom; }



/* =========================================
   PLAY ICON
========================================= */

.mh-play-icon{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:40px;
  height:40px;
  pointer-events:none;
  z-index:6;
}

.mfp-bg,
.mfp-wrap {
  position: fixed !important;
  height: 100vh !important;
  top: 0 !important;
}
/* FIX REAL VIEWPORT POPUP */

.mfp-bg,
.mfp-wrap {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100vh !important;
}

html.mfp-open,
body.mfp-open {
  height: 100% !important;
  overflow: hidden !important;
}
/* =========================================
   POPUP CLICK AREA
========================================= */

.et_pb_media_hovers_wrapper.mh-click-popup .mh-play-trigger{
  position:absolute;
  inset:0;
  z-index:7;
  cursor:pointer;
}
.mh-play-trigger{
  pointer-events:none;
}
.mh-click-popup .mh-real-link {
  display: none;
}
/* =========================================
   CURSOR (ZONAS CLICKABLES)
========================================= */

.et_pb_media_hovers_wrapper[data-destination-url] .mh-image-wrapper,
.et_pb_media_hovers_wrapper[data-destination-url] .mh-title,
.et_pb_media_hovers_wrapper[data-destination-url] .mh-subtitle,
.et_pb_media_hovers_wrapper[data-destination-url] .mh-category{
  cursor:pointer;
}
.et_pb_media_hovers_wrapper.mh-click-popup .mh-title:hover,
.et_pb_media_hovers_wrapper.mh-click-popup .mh-subtitle:hover,
.et_pb_media_hovers_wrapper.mh-click-popup .mh-category:hover{
  color: var(--bl) !important;
  transition: all 0.2s ease-in-out;
}
/* =========================================
   META
========================================= */

.mh-meta{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  color:var(--gr);
  opacity:0;
  transition:opacity .35s ease;
  transition-delay:.12s;
}

.et_pb_media_hovers_wrapper.mh-loaded .mh-meta{
  opacity:1;
}

.mh-meta-left{
  display:flex;
  flex-direction:column;
}

/* overlay */

.mh-media-wrapper .mh-meta{
  position:absolute;
  left:15px;
  right:15px;
  bottom:15px;
  z-index:5;
}

/* editorial */

.et_pb_media_hovers_wrapper > .mh-meta{
  position:relative;
  margin-top:10px;
}

/* =========================================
   TEXTS (SOPORTE PARA <a> Y <h>)
========================================= */

.mh-title,
.mh-subtitle,
.mh-category{
  display:inline-block;
  width:auto;
  max-width:max-content;
  font-family:var(--ffa);
  font-weight:var(--fwl-reg);
  margin:0;
  color:var(--gr);
  text-decoration:none;
  text-transform: uppercase;
  letter-spacing: 1px;
}

/* hover real tipo link */

.mh-title:hover,
.mh-subtitle:hover,
.mh-category:hover{
  color:var(--bl);
  text-decoration:none;
}

/* =========================================
   META OUT
========================================= */

.et_pb_media_hovers_wrapper.mh-meta-out > .mh-meta{
  flex-wrap:wrap;
  align-items:flex-start;
}

.et_pb_media_hovers_wrapper.mh-meta-out .mh-meta-left{
  flex:1 1 auto;
}

.et_pb_media_hovers_wrapper.mh-meta-out .mh-category{
  margin-left:auto;
  white-space:nowrap;
}

.media-button-insert:empty::after {
  content: "Seleccionar";
}

/* contenedor del popup */
.mfp-content{
  position: relative;
}

/* caption debajo del video */
.mh-popup-meta {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  margin-top: 10px;

  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  color: var(--gr);
  font-family: var(--ffa);
  text-transform: uppercase;
  letter-spacing: 1px;
  padding: 10px 10px;
}
.mh-popup-meta .mh-title,
.mh-popup-meta .mh-subtitle,
.mh-popup-meta .mh-category{
  cursor: default !important;
  pointer-events: none; 
  color: var(--gr) !important;
}
.mh-popup-meta .mh-sep{
  cursor: default !important;
  pointer-events: none;
}

/* quitar hover */
.mh-popup-meta .mh-title:hover,
.mh-popup-meta .mh-subtitle:hover,
.mh-popup-meta .mh-category:hover{
  color: var(--gr) !important;
}
.mh-popup-meta .mh-sep{
  margin: 0 8px;
}

/* =========================================
   MOBILE PREVIEW
========================================= */

@media (max-width:981px){

  .mh-mobile-disable .mh-hover-video{
    display:none !important;
  }

  .mh-mobile-preview-active .mh-hover-video{
    opacity:1;
  }

  .mh-mobile-preview-active .mh-background{
    opacity:0;
  }

}

/* =========================================
   RESPONSIVE
========================================= */

@media (max-width:767px){

  .mh-media-wrapper .mh-meta{
    left:14px;
    right:14px;
    bottom:12px;
  }

  .et_pb_media_hovers_wrapper > .mh-meta{
    margin-top:16px;
  }

  .mh-title{ font-size:15px!important; }
  .mh-subtitle{ font-size:13px!important; }
  .mh-category{ font-size:13px!important; }

}
/* ----------------------------------------------------------
   PROJECT LINK MODULE
   FINAL CSS – META PROTEGIDO DE OPACITY
----------------------------------------------------------- */

/* =========================================
   WRAPPER
========================================= */

.et_pb_project_link_wrapper {
  position: relative;
  width: 100%;
  display: block;
}

/* =========================================
   STILL IMAGE
========================================= */

.still-image-wrapper {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.still-background {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  object-position: center;
  transition: opacity 0.3s ease-in-out;
}

/* Hover SOLO afecta a la imagen */
.et_pb_project_link_wrapper.has-link:hover .still-background {
  opacity: 0.85;
}

/* =========================================
   PLAY ICON
========================================= */

.project-link-icon {
  width: 40px;
  height: auto;
  pointer-events: none;
}

.project-link-icon-trigger,
.project-link-icon-wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 5;
  cursor: pointer;
}

/* =========================================
   META BASE
========================================= */

.still-meta {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  color: var(--bl);
  text-decoration: none;
}

/* PROTECCIÓN CLAVE */
.project-link-trigger {
  opacity: 1 !important;
}

.project-link-trigger:hover {
  opacity: 1 !important;
}

/* =========================================
   META IN (OVERLAY)
========================================= */

.still-image-wrapper .still-meta {
  position: absolute;
  left: 30px;
  right: 30px;
  bottom: 30px;
  z-index: 6;
}

/* =========================================
   META OUT (EDITORIAL)
========================================= */

.et_pb_project_link_wrapper > .project-link-trigger,
.et_pb_project_link_wrapper > .still-meta {
  display: block;
}

.et_pb_project_link_wrapper > .project-link-trigger .still-meta,
.et_pb_project_link_wrapper > .still-meta {
  position: relative;
  margin-top:15px;     /* separación editorial base */
}

/* =========================================
   TEXTOS
========================================= */

.still-title,
.still-subtitle,
.still-category {
  font-family: var(--ffa);
  font-weight: var(--fwl-reg);
  line-height: var(--flh0);
  text-transform: uppercase;
  margin: 0;
  color: var(--bl);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  padding-bottom: 1px;
  transition: color 0.3s ease-in-out, border-bottom-color 0.3s ease-in-out;
}

.still-title {
  font-size: var(--fs-h1);
  font-weight: var(--fwl-med);
}

.still-subtitle,
.still-category {
  font-size: var(--fs-h2);
}

/* =========================================
   HOVER (LINK)
========================================= */

.project-link-trigger:hover .still-title,
.project-link-trigger:hover .still-subtitle,
.project-link-trigger:hover .still-category {
  border-bottom-color: currentColor;
  cursor: pointer;
}

/* =========================================
   RESPONSIVE
========================================= */

@media (max-width: 767px) {

  .still-image-wrapper .still-meta {
    left: 14px;
    right: 14px;
    bottom: 12px;
  }

  .still-title    { font-size: 16px; }
  .still-subtitle { font-size: 13px; }
  .still-category { font-size: 13px; }

  .et_pb_project_link_wrapper > .project-link-trigger .still-meta,
  .et_pb_project_link_wrapper > .still-meta {
    margin-top: 16px;
  }
}/* ----------------------------------------------------------
   VIDEO POPUP MODULE – subgrafica
   UNIFICADO CON MEDIA HOVERS & PROJECT LINK
   Underline premium (border-bottom)
----------------------------------------------------------- */

/* =========================================
   WRAPPER
========================================= */

.et_pb_video_popup_wrapper {
  position: relative;
  width: 100%;
  display: block;
  overflow: hidden;
}

/* =========================================
   STILL IMAGE
========================================= */

.video-image-wrapper {
  position: relative;
  width: 100%;
  overflow: hidden;
  opacity: 0.90;
}

.video-background {
  width: 100%;
  height: auto;
  display: block;
  transition: opacity 0.3s ease-in-out;
  object-fit: cover;
  object-position: center;
}

/* =========================================
   PLAY ICON
========================================= */

.video-play-icon {
  width: 40px;
  height: auto;
  pointer-events: none;
}

.video-play-trigger {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  cursor: pointer;
  z-index: 5;
}

/* Evitar cambios de opacidad en hover */
.video-play-trigger:hover {
  opacity: 1 !important;
}

/* No video, no icon */
.et_pb_video_popup_wrapper.no-video .video-play-icon {
  display: none !important;
}

/* =========================================
   META OVERLAY (DEFAULT – INSIDE)
========================================= */

.video-meta {
  position: absolute;
  left: 30px;
  right: 30px;
  bottom: 30px;
  z-index: 6;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  color: var(--bl);
  pointer-events: auto;
  transition: color 0.3s ease-in-out;
}

.video-meta-left {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/* =========================================
   TEXTS (underline premium)
========================================= */

.video-title,
.video-subtitle,
.video-category {
  font-family: var(--ffa);
  font-weight: var(--fwl-reg);
  line-height: var(--flh0);
  text-transform: uppercase;
  margin: 0;
  color: var(--bl);
  text-shadow: 0 1px 1px rgba(0,0,0,0.1);
  text-decoration: none !important;
  border-bottom: 1px solid transparent;
  padding-bottom: 1px;
  cursor: default;
  transition: color 0.3s ease-in-out, border-bottom-color 0.3s ease-in-out;
}

.video-title {
  font-size: var(--fs-h1) !important;
  font-weight: var(--fwl-med);
}

.video-subtitle,
.video-category {
  font-size: var(--fs-h2) !important;
}

/* =========================================
   GROUP HOVER
========================================= */

.et_pb_video_popup_wrapper.has-video .video-meta:hover .video-title,
.et_pb_video_popup_wrapper.has-video .video-meta:hover .video-subtitle,
.et_pb_video_popup_wrapper.has-video .video-meta:hover .video-category {
  border-bottom-color: currentColor !important;
  color: var(--bl);
  cursor: pointer;
}

.et_pb_video_popup_wrapper.has-video .video-meta:hover {
  cursor: pointer;
}

/* =========================================
   INTERACTIVITY
========================================= */

/* Imagen baja opacidad en hover */
.et_pb_video_popup_wrapper.has-video:hover .video-background {
  opacity: 0.85;
}

/* No interactividad cuando no hay video */
.et_pb_video_popup_wrapper.no-video .video-meta,
.et_pb_video_popup_wrapper.no-video .video-title,
.et_pb_video_popup_wrapper.no-video .video-subtitle,
.et_pb_video_popup_wrapper.no-video .video-category {
  pointer-events: none !important;
  cursor: default !important;
  border-bottom-color: transparent !important;
}

/* No interacción en imagen */
.video-image-wrapper img {
  pointer-events: none;
}

/* =========================================
   RESPONSIVE
========================================= */

@media (max-width: 767px) {
  .video-meta {
    left: 14px;
    right: 14px;
    bottom: 12px;
  }

  .video-title    { font-size: 16px !important; }
  .video-subtitle { font-size: 13px !important; }
  .video-category { font-size: 13px !important; }
}

/* =========================================
   META OUTSIDE — BASE (NUEVO)
========================================= */

.meta-outside .video-meta {
  position: relative;   /* sale del overlay */
  left: auto;
  right: auto;
  bottom: auto;

  margin-top:15px;     /* separación editorial base */

  z-index: auto;
}/* ----------------------------------------------------------
   MAGNIFIC POPUP – CUSTOM PREMIUM STYLES (Subgrafica)
   Uso global para TODOS los popups del tema
----------------------------------------------------------- */

/* =========================================
   OVERLAY + BACKGROUND
========================================= */

.mfp-fade.mfp-bg {
  opacity: 0;
  transition: opacity 0.3s ease;
}

.mfp-fade.mfp-bg.mfp-ready {
  opacity: 1;
  background-color: #0C0C0C !important; /* fondo premium */
}

.mfp-fade.mfp-bg.mfp-removing {
  opacity: 0;
}

/* =========================================
   CONTENT FADE
========================================= */

.mfp-fade .mfp-content {
  opacity: 0;
  transition: opacity 0.3s ease 0.3s;
}

.mfp-fade.mfp-ready .mfp-content {
  opacity: 1;
}

.mfp-fade.mfp-removing .mfp-content {
  opacity: 0;
  transition-delay: 0s;
}

/* =========================================
   CLOSE BUTTON (SUBGRAFICA)
   – botón premium igual al de Video Popup
   – fijo en esquina superior derecha
========================================= */

.mfp-close {
  position: fixed !important;
  top: 20px !important;
  right: 2% !important;

  width: 20px !important;
  height: 20px !important;

  background: url(https://subgrafica.com/data/img/close_.png)
              no-repeat center center !important;

  background-size: contain !important;
  border: none !important;

  color: transparent !important;
  font-size: 0 !important;

  opacity: 0.6 !important;
  padding: 0 !important;

  z-index: 9999999 !important;
  transition: opacity 0.3s ease;
}

.mfp-close:hover {
  opacity: 1 !important;
}

/* =========================================
   IFRAME CONTAINER
========================================= */

.mfp-iframe-scaler {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 56.25%; /* 16:9 */
  overflow: hidden;
}

.mfp-iframe-scaler iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: #000;
  box-shadow: 0 0 8px rgba(0,0,0,0.0) !important;
}
.mfp-figure::after {
  content: '';
  position: absolute;
  left: 0;
  top: 40px;
  bottom: 40px;
  display: block;
  right: 0;
  width: auto;
  height: auto;
  z-index: -1;
  box-shadow: 0 0 0px rgba(0, 0, 0, 0.0);
  background: transparent;
}
/* =========================================
   Z-INDEX GLOBAL FIX
========================================= */

.mfp-bg,
.mfp-wrap {
  z-index: 999999 !important;
}

/* =========================================
   OPTIONAL – IMPROVED SHADOW (si lo deseas)
========================================= */
/*
.mfp-content {
  filter: drop-shadow(0px 4px 18px rgba(0,0,0,0.4));
}
*//* ========================================
   RESET DEL MÓDULO PADRE
======================================== */

.masonry_sub {
    padding: 0 !important;
}

.masonry_sub .et_pb_module_inner {
    overflow: visible !important;
}

/* ========================================
   MASONRY GALLERY – BASE
======================================== */

.masonry-sub-wrapper {
    width: 100%;
}

/* ======================================================
   GRID 
====================================================== */

.masonry-sub-grid {
    width: 100%;
    column-gap: 15px;
}

/* ========================================
   ITEM (controlado por Item Styling del padre)
======================================== */

.masonry-sub-item {
    position: relative;
    overflow: hidden !important;
    margin-bottom: 15px;

    /* Controladores del padre */
    border-style: solid;
    border-width: var(--ms-item-border-width, 0px);
    border-color: var(--ms-item-border-color, transparent);
    border-radius: var(--ms-item-border-radius, 0px);

    /* 🔥 Fuerza a que imagen + overlay respeten EXACTAMENTE la forma */
    clip-path: inset(0 round var(--ms-item-border-radius, 0px));
}

.masonry-sub-img-wrap {
    overflow: hidden !important;
    border-radius: inherit !important;
}

.masonry-sub-image {
    display: block;
    width: 100%;
    height: auto;
    opacity: 1;
    border-radius: inherit !important;
}

/* ========================================
   GLOBAL SMOOTH TRANSITIONS
======================================== */

.masonry-sub-item,
.masonry-sub-image,
.masonry-sub-overlay {
    transition:
        opacity .6s cubic-bezier(0.25, 0.1, 0.25, 1),
        transform .6s cubic-bezier(0.25, 0.1, 0.25, 1),
        filter .6s cubic-bezier(0.25, 0.1, 0.25, 1) !important;
}

/* ========================================
   OVERLAY
======================================== */

.masonry-sub-overlay {
    position: absolute;
    inset: 0;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    opacity: 0;
    pointer-events: none;
    background-color: var(--overlay-color, rgba(0,0,0,.35));
    z-index: 5;
    border-radius: inherit !important;
}

.masonry-sub-item:hover .masonry-sub-overlay {
    opacity: 1;
}

/* ========================================
   FIX – evitar opacity heredado del tema
======================================== */

.masonry-sub-link-lightbox,
.masonry-sub-link-lightbox:hover {
    opacity: 1 !important;
}

/* ========================================
   TEXT POSITION
======================================== */

.masonry-sub-wrapper.text-pos-bottom-left   .masonry-sub-overlay { justify-content: flex-end; align-items: flex-start; text-align: left; }
.masonry-sub-wrapper.text-pos-bottom-center .masonry-sub-overlay { justify-content: flex-end; align-items: center;     text-align: center; }
.masonry-sub-wrapper.text-pos-bottom-right  .masonry-sub-overlay { justify-content: flex-end; align-items: flex-end;   text-align: right; }

.masonry-sub-wrapper.text-pos-center-left   .masonry-sub-overlay { justify-content: center; align-items: flex-start; text-align: left; }
.masonry-sub-wrapper.text-pos-center        .masonry-sub-overlay { justify-content: center; align-items: center;     text-align: center; }
.masonry-sub-wrapper.text-pos-center-right  .masonry-sub-overlay { justify-content: center; align-items: flex-end;   text-align: right; }

.masonry-sub-wrapper.text-pos-top-left      .masonry-sub-overlay { justify-content: flex-start; align-items: flex-start; text-align: left; }
.masonry-sub-wrapper.text-pos-top-center    .masonry-sub-overlay { justify-content: flex-start; align-items: center;     text-align: center; }
.masonry-sub-wrapper.text-pos-top-right     .masonry-sub-overlay { justify-content: flex-start; align-items: flex-end;   text-align: right; }

/* ========================================
   EFFECTS
======================================== */

/* Zoom In */
.masonry-sub-wrapper.effect-zoom_in.effect-mode-on_hover .masonry-sub-item:hover .masonry-sub-image {
    transform: scale(1.08);
}
.masonry-sub-wrapper.effect-zoom_in.effect-mode-invert .masonry-sub-image {
    transform: scale(1.08);
}

/* Zoom Out */
.masonry-sub-wrapper.effect-zoom_out.effect-mode-on_hover .masonry-sub-item:hover .masonry-sub-image {
    transform: scale(0.92);
}
.masonry-sub-wrapper.effect-zoom_out.effect-mode-invert .masonry-sub-image {
    transform: scale(0.92);
}

/* Blur (1px) */
.masonry-sub-wrapper.effect-blur.effect-mode-on_hover .masonry-sub-item:hover .masonry-sub-image {
    filter: blur(1px);
}
.masonry-sub-wrapper.effect-blur.effect-mode-invert .masonry-sub-image {
    filter: blur(1px);
}

/* Grayscale */
.masonry-sub-wrapper.effect-grayscale.effect-mode-on_hover .masonry-sub-item:hover .masonry-sub-image {
    filter: grayscale(50%);
}
.masonry-sub-wrapper.effect-grayscale.effect-mode-invert .masonry-sub-image {
    filter: grayscale(50%);
}
.masonry-sub-wrapper.effect-grayscale.effect-mode-invert .masonry-sub-item:hover .masonry-sub-image {
    filter: none !important;
}

/* ========================================
   BOX GRID MODE + RATIOS
======================================== */

.masonry-sub-wrapper.layout-mode-box .masonry-sub-img-wrap {
    width: 100%;
}

.masonry-sub-wrapper.layout-mode-box.ratio-original .masonry-sub-img-wrap {
    aspect-ratio: auto;
}

.masonry-sub-wrapper.layout-mode-box:not(.ratio-original) .masonry-sub-img-wrap {
    width: 100%;
}

.masonry-sub-wrapper.layout-mode-box:not(.ratio-original) .masonry-sub-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.masonry-sub-wrapper.layout-mode-box.ratio-1_1  .masonry-sub-img-wrap { aspect-ratio: 1/1; }
.masonry-sub-wrapper.layout-mode-box.ratio-4_3  .masonry-sub-img-wrap { aspect-ratio: 4/3; }
.masonry-sub-wrapper.layout-mode-box.ratio-3_2  .masonry-sub-img-wrap { aspect-ratio: 3/2; }
.masonry-sub-wrapper.layout-mode-box.ratio-16_9 .masonry-sub-img-wrap { aspect-ratio: 16/9; }
.masonry-sub-wrapper.layout-mode-box.ratio-2_1  .masonry-sub-img-wrap { aspect-ratio: 2/1; }

/* ========================================
   RESPONSIVE COLUMNS
======================================== */

.masonry-sub-wrapper[data-columns="1"] .masonry-sub-grid { column-count: 1; }
.masonry-sub-wrapper[data-columns="2"] .masonry-sub-grid { column-count: 2; }
.masonry-sub-wrapper[data-columns="3"] .masonry-sub-grid { column-count: 3; }
.masonry-sub-wrapper[data-columns="4"] .masonry-sub-grid { column-count: 4; }
.masonry-sub-wrapper[data-columns="5"] .masonry-sub-grid { column-count: 5; }
.masonry-sub-wrapper[data-columns="6"] .masonry-sub-grid { column-count: 6; }

@media (max-width: 980px) {
    .masonry-sub-grid { column-count: 2 !important; }
}

@media (max-width: 600px) {
    .masonry-sub-grid { column-count: 1 !important; }
}

/* ========================================
   LIGHTBOX WIDTH 85%
======================================== */

.masonry-sub-mfp img.mfp-img {
    max-width: 85% !important;
    height: auto !important;
    margin: 0 auto !important;
}

.masonry-sub-mfp .mfp-bottom-bar {
    width: 85% !important;
    margin: 0 auto !important;
    left: 0 !important;
    right: 0 !important;
}/* ============================================================
   SCROLLING IMAGES SUB – Subgrafica
   Basado en el Masonry, pero versión Carrusel Infinito
============================================================ */

/* ============================================================
   WRAPPER BASE
============================================================ */
.scrolling-images-sub-wrapper {
  width: 100%;
  position: relative;
  overflow: hidden;
  padding: 0;
  opacity: 0;                        /* Fade inicial */
  transition: opacity 0.6s ease-out; /* Duración y curva del fade */
}

/* Cuando JS termina de preparar el carrusel:
   - se activa la animación del track
   - se hace fade-in del wrapper */
.scrolling-images-sub-wrapper.scrolling-ready {
  opacity: 1;
}

/* TRACK DEL CARRUSEL */
.scrolling-images-sub-track {
  display: flex;
  align-items: center; /* valor por defecto, luego lo puede sobreescribir children-align-* */
  gap: var(--scroll-gap, 20px);
  width: max-content;
  will-change: transform;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  transition: 0.3s ease;
  animation-play-state: paused; /* por defecto pausado */
  backface-visibility: hidden;
}

/* Cuando JS marca .scrolling-ready → arranca la animación */
.scrolling-images-sub-wrapper.scrolling-ready .scrolling-images-sub-track {
  animation-play-state: running;
}

/* Pausar animación (desde JS + clase del padre) */
.scrolling-images-sub-wrapper.pause-on-hover.scrolling-images-sub-paused .scrolling-images-sub-track {
  animation-play-state: paused !important;
}

/* ============================================================
   ANIMACIONES DE DIRECCIÓN
============================================================ */
@keyframes scroll-left {
  0%   { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-50%, 0, 0); }
}

@keyframes scroll-right {
  0%   { transform: translate3d(-50%, 0, 0); }
  100% { transform: translate3d(0, 0, 0); }
}

.direction-left .scrolling-images-sub-track {
  animation-name: scroll-left;
}

.direction-right .scrolling-images-sub-track {
  animation-name: scroll-right;
}

/* ============================================================
   ITEM BASE
============================================================ */
.scrolling-img-item {
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
  display: block;
  max-width: var(--scroll-maxwidth, 200px);
  width: 100%;
}

/* Divi Border Radius debe funcionar */
.scrolling-img-item img {
  width: 100%;
  height: auto;
  display: block;
  transition: 0.35s ease;
  border-radius: inherit; /* Support Divi Border Controls */
}

/* ============================================================
   IMAGE RATIO & FIT
============================================================ */

/* Ratios fijos */
.ratio-4-3 .scrolling-img-item {
  aspect-ratio: 4 / 3;
}

.ratio-3-4 .scrolling-img-item {
  aspect-ratio: 3 / 4;
}

.ratio-1-1 .scrolling-img-item {
  aspect-ratio: 1 / 1;
}

.ratio-16-9 .scrolling-img-item {
  aspect-ratio: 16 / 9;
}

/* Imagen ocupando la caja del ratio */
.ratio-4-3 .scrolling-img-item img,
.ratio-3-4 .scrolling-img-item img,
.ratio-1-1 .scrolling-img-item img,
.ratio-16-9 .scrolling-img-item img {
  width: 100%;
  height: 100%;
}

/* Fit: cover / contain */
.ratio-fit-cover .scrolling-img-item img {
  object-fit: cover;
}

.ratio-fit-contain .scrolling-img-item img {
  object-fit: contain;
  background-color: transparent;
}

/* ============================================================
   VERTICAL ALIGN DE LOS HIJOS
============================================================ */
.children-align-top .scrolling-images-sub-track {
  align-items: flex-start;
}

.children-align-center .scrolling-images-sub-track {
  align-items: center;
}

.children-align-bottom .scrolling-images-sub-track {
  align-items: flex-end;
}

/* ============================================================
   OVERLAY (estilo Masonry)
============================================================ */
.scrolling-img-overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  background-color: var(--scroll-overlay, rgba(0,0,0,0.4));
  transition: opacity 0.35s ease;
}

/* Overlay always visible */
.overlay-mode-always .scrolling-img-overlay {
  opacity: 1 !important;
}

/* Overlay on hover */
.overlay-mode-hover .scrolling-img-item:hover .scrolling-img-overlay {
  opacity: 1;
}

/* ============================================================
   TEXT WRAPPER & POSITIONING (igual que Masonry)
============================================================ */
.scrolling-img-text-wrapper {
  position: absolute;
  inset: 0;
  display: flex;
  padding: 10px;
  transition: opacity 0.35s ease;
  opacity: 1;
  pointer-events: none;
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

/* Text visible only on hover */
.text-mode-hover .scrolling-img-text-wrapper {
  opacity: 0;
}

.text-mode-hover .scrolling-img-item:hover .scrolling-img-text-wrapper {
  opacity: 1;
}

/* POSICIONES – Masonry Style */
.text-pos-top-left      .scrolling-img-text-wrapper { justify-content:flex-start; align-items:flex-start; }
.text-pos-top-center    .scrolling-img-text-wrapper { justify-content:flex-start; align-items:center; }
.text-pos-top-right     .scrolling-img-text-wrapper { justify-content:flex-start; align-items:flex-end; }

.text-pos-center-left   .scrolling-img-text-wrapper { justify-content:center; align-items:flex-start; }
.text-pos-center-center .scrolling-img-text-wrapper { justify-content:center; align-items:center; }
.text-pos-center-right  .scrolling-img-text-wrapper { justify-content:center; align-items:flex-end; }

.text-pos-bottom-left   .scrolling-img-text-wrapper { justify-content:flex-end; align-items:flex-start; }
.text-pos-bottom-center .scrolling-img-text-wrapper { justify-content:flex-end; align-items:center; }
.text-pos-bottom-right  .scrolling-img-text-wrapper { justify-content:flex-end; align-items:flex-end; }

/* TITLES + SUBTITLES */
.scrolling-img-title {
  margin: 0;
  padding: 0;
  line-height: 1.2;
  pointer-events: none;
}

.scrolling-img-subtitle {
  margin: 5px 0 0;
  padding: 0;
  pointer-events: none;
}

/* ============================================================
   HOVER EFFECTS – Estilo Masonry pero adaptado
============================================================ */

/* NO EFFECT */
.effect-none .scrolling-img-item img {}

/* ZOOM */
.effect-zoom   .scrolling-img-item:hover img { transform: scale(1.08); }

/* BLUR */
.effect-blur   .scrolling-img-item:hover img { filter: blur(3px); }

/* OPACITY */
.effect-opacity .scrolling-img-item:hover img { opacity: 0.6; }

/* SHINE (con pseudo-elemento, tipo slick) */
.effect-shine .scrolling-img-item {
  overflow: hidden;
}

.effect-shine .scrolling-img-item::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.6) 50%, transparent 100%);
  transform: translate3d(-150%, 0, 0);
  transition: 0.6s ease;
}

.effect-shine .scrolling-img-item:hover::after {
  transform: translate3d(150%, 0, 0);
}

/* ROTATE */
.effect-rotate .scrolling-img-item:hover img { transform: rotate(3deg); }

/* SHADOW */
.effect-shadow .scrolling-img-item:hover img {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(0,0,0,0.25);
}

/* ============================================================
   PAUSE SUPPORT
============================================================ */
.scrolling-images-sub-paused .scrolling-images-sub-track {
  animation-play-state: paused !important;
}/* ============================================================
   SCROLLING IMAGES SUB – Subgrafica
   Basado en el Masonry, pero versión Carrusel Infinito
============================================================ */

/* ============================================================
   WRAPPER BASE
============================================================ */
.scrolling-images-sub-wrapper {
  width: 100%;
  position: relative;
  overflow: hidden;
  padding: 0;
  opacity: 0;                        /* Fade inicial */
  transition: opacity 0.6s ease-out; /* Duración y curva del fade */
}

/* Cuando JS termina de preparar el carrusel:
   - se activa la animación del track
   - se hace fade-in del wrapper */
.scrolling-images-sub-wrapper.scrolling-ready {
  opacity: 1;
}

/* TRACK DEL CARRUSEL */
.scrolling-images-sub-track {
  display: flex;
  align-items: center; /* valor por defecto, luego lo puede sobreescribir children-align-* */
  gap: var(--scroll-gap, 20px);
  width: max-content;
  will-change: transform;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  transition: 0.3s ease;
  animation-play-state: paused; /* por defecto pausado */
  backface-visibility: hidden;
}

/* Cuando JS marca .scrolling-ready → arranca la animación */
.scrolling-images-sub-wrapper.scrolling-ready .scrolling-images-sub-track {
  animation-play-state: running;
}

/* Pausar animación (desde JS + clase del padre) */
.scrolling-images-sub-wrapper.pause-on-hover.scrolling-images-sub-paused .scrolling-images-sub-track {
  animation-play-state: paused !important;
}

/* ============================================================
   ANIMACIONES DE DIRECCIÓN
============================================================ */
@keyframes scroll-left {
  0%   { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-50%, 0, 0); }
}

@keyframes scroll-right {
  0%   { transform: translate3d(-50%, 0, 0); }
  100% { transform: translate3d(0, 0, 0); }
}

.direction-left .scrolling-images-sub-track {
  animation-name: scroll-left;
}

.direction-right .scrolling-images-sub-track {
  animation-name: scroll-right;
}

/* ============================================================
   ITEM BASE
============================================================ */
.scrolling-img-item {
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
  display: block;
  max-width: var(--scroll-maxwidth, 200px);
  width: 100%;
}

/* Divi Border Radius debe funcionar */
.scrolling-img-item img {
  width: 100%;
  height: auto;
  display: block;
  transition: 0.35s ease;
  border-radius: inherit; /* Support Divi Border Controls */
}

/* ============================================================
   IMAGE RATIO & FIT
============================================================ */

/* Ratios fijos */
.ratio-4-3 .scrolling-img-item {
  aspect-ratio: 4 / 3;
}

.ratio-3-4 .scrolling-img-item {
  aspect-ratio: 3 / 4;
}

.ratio-1-1 .scrolling-img-item {
  aspect-ratio: 1 / 1;
}

.ratio-16-9 .scrolling-img-item {
  aspect-ratio: 16 / 9;
}

/* Imagen ocupando la caja del ratio */
.ratio-4-3 .scrolling-img-item img,
.ratio-3-4 .scrolling-img-item img,
.ratio-1-1 .scrolling-img-item img,
.ratio-16-9 .scrolling-img-item img {
  width: 100%;
  height: 100%;
}

/* Fit: cover / contain */
.ratio-fit-cover .scrolling-img-item img {
  object-fit: cover;
}

.ratio-fit-contain .scrolling-img-item img {
  object-fit: contain;
  background-color: transparent;
}

/* ============================================================
   VERTICAL ALIGN DE LOS HIJOS
============================================================ */
.children-align-top .scrolling-images-sub-track {
  align-items: flex-start;
}

.children-align-center .scrolling-images-sub-track {
  align-items: center;
}

.children-align-bottom .scrolling-images-sub-track {
  align-items: flex-end;
}

/* ============================================================
   OVERLAY (estilo Masonry)
============================================================ */
.scrolling-img-overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  background-color: var(--scroll-overlay, rgba(0,0,0,0.4));
  transition: opacity 0.35s ease;
}

/* Overlay always visible */
.overlay-mode-always .scrolling-img-overlay {
  opacity: 1 !important;
}

/* Overlay on hover */
.overlay-mode-hover .scrolling-img-item:hover .scrolling-img-overlay {
  opacity: 1;
}

/* ============================================================
   TEXT WRAPPER & POSITIONING (igual que Masonry)
============================================================ */
.scrolling-img-text-wrapper {
  position: absolute;
  inset: 0;
  display: flex;
  padding: 10px;
  transition: opacity 0.35s ease;
  opacity: 1;
  pointer-events: none;
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

/* Text visible only on hover */
.text-mode-hover .scrolling-img-text-wrapper {
  opacity: 0;
}

.text-mode-hover .scrolling-img-item:hover .scrolling-img-text-wrapper {
  opacity: 1;
}

/* POSICIONES – Masonry Style */
.text-pos-top-left      .scrolling-img-text-wrapper { justify-content:flex-start; align-items:flex-start; }
.text-pos-top-center    .scrolling-img-text-wrapper { justify-content:flex-start; align-items:center; }
.text-pos-top-right     .scrolling-img-text-wrapper { justify-content:flex-start; align-items:flex-end; }

.text-pos-center-left   .scrolling-img-text-wrapper { justify-content:center; align-items:flex-start; }
.text-pos-center-center .scrolling-img-text-wrapper { justify-content:center; align-items:center; }
.text-pos-center-right  .scrolling-img-text-wrapper { justify-content:center; align-items:flex-end; }

.text-pos-bottom-left   .scrolling-img-text-wrapper { justify-content:flex-end; align-items:flex-start; }
.text-pos-bottom-center .scrolling-img-text-wrapper { justify-content:flex-end; align-items:center; }
.text-pos-bottom-right  .scrolling-img-text-wrapper { justify-content:flex-end; align-items:flex-end; }

/* TITLES + SUBTITLES */
.scrolling-img-title {
  margin: 0;
  padding: 0;
  line-height: 1.2;
  pointer-events: none;
}

.scrolling-img-subtitle {
  margin: 5px 0 0;
  padding: 0;
  pointer-events: none;
}

/* ============================================================
   HOVER EFFECTS – Estilo Masonry pero adaptado
============================================================ */

/* NO EFFECT */
.effect-none .scrolling-img-item img {}

/* ZOOM */
.effect-zoom   .scrolling-img-item:hover img { transform: scale(1.08); }

/* BLUR */
.effect-blur   .scrolling-img-item:hover img { filter: blur(3px); }

/* OPACITY */
.effect-opacity .scrolling-img-item:hover img { opacity: 0.6; }

/* SHINE (con pseudo-elemento, tipo slick) */
.effect-shine .scrolling-img-item {
  overflow: hidden;
}

.effect-shine .scrolling-img-item::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.6) 50%, transparent 100%);
  transform: translate3d(-150%, 0, 0);
  transition: 0.6s ease;
}

.effect-shine .scrolling-img-item:hover::after {
  transform: translate3d(150%, 0, 0);
}

/* ROTATE */
.effect-rotate .scrolling-img-item:hover img { transform: rotate(3deg); }

/* SHADOW */
.effect-shadow .scrolling-img-item:hover img {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(0,0,0,0.25);
}

/* ============================================================
   PAUSE SUPPORT
============================================================ */
.scrolling-images-sub-paused .scrolling-images-sub-track {
  animation-play-state: paused !important;
}