@font-face{font-family:'cocogooseprolightitalic';font-style:normal;font-weight:normal;src:url(fonts/CocogooseProLightItalic.ttf);src:url(fonts/CocogooseProLightItalic.woff2) format('woff2');font-display:swap;}
@font-face{font-family:'montserratmedium';font-style:normal;font-weight:normal;src:url(fonts/Montserrat-Medium.ttf);src:url(fonts/Montserrat-Medium.woff2) format('woff2');font-display:swap;}
@font-face{font-family:'montserratregular';font-style:normal;font-weight:normal;src:url(fonts/Montserrat-Regular.ttf);src:url(fonts/Montserrat-Regular.woff2) format('woff2');font-display:swap;}
@font-face{font-family:'montserratitalic';font-style:italic;font-weight:normal;src:url(fonts/Montserrat-Italic.ttf);src:url(fonts/Montserrat-Italic.woff2) format('woff2');font-display:swap;}
@font-face{font-family:'montserratmediumitalic';font-style:italic;font-weight:normal;src:url(fonts/Montserrat-MediumItalic.ttf);src:url(fonts/Montserrat-MediumItalic.woff2) format('woff2');font-display:swap;}
@font-face{font-family:'montserratsemibold';font-style:normal;font-weight:normal;src:url(fonts/Montserrat-SemiBold.ttf);src:url(fonts/Montserrat-SemiBold.woff2) format('woff2');font-display:swap;}

/* slick slider */
.slick-slider{position:relative;display:block;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent;}.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0;}.slick-list:focus{outline:none;}.slick-list.dragging{cursor:pointer;cursor:hand;}.slick-slider .slick-track,.slick-slider .slick-list{-webkit-transform:translate3d(0, 0, 0);-moz-transform:translate3d(0, 0, 0);-ms-transform:translate3d(0, 0, 0); -o-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);}.slick-track{position:relative;top:0;left:0;display:block;margin-left:auto;margin-right:auto;}.slick-track:before,.slick-track:after{display:table;content:'';}.slick-track:after{clear:both;}.slick-loading .slick-track{visibility:hidden;}.slick-slide{display:none;float:left;height:100%;min-height:1px;}[dir='rtl'] .slick-slide{float:right;}.slick-slide img{display:block;}.slick-slide.slick-loading img{display:none;}.slick-slide.dragging img{pointer-events:none;}.slick-initialized .slick-slide{display:block;}.slick-loading .slick-slide{visibility:hidden;}.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent;}.slick-arrow.slick-hidden {display:none;}
/* jquery modal 0.9.1 // https://jquerymodal.com/ // https://github.com/kylefox/jquery-modal#installation */
.blocker{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:auto;z-index:1;padding:0;box-sizing:border-box;background-color:#0D3C61;background-color:rgba(13,60,97,0.1);text-align:center;z-index:22}.blocker{padding:15px;}.blocker:before{content:"";display:inline-block;height:100%;vertical-align:middle;margin-right:-0.05em}.blocker.behind{background-color:transparent}.modal{display:none;vertical-align:middle;position:relative;z-index:2;max-width:500px;box-sizing:border-box;width:100%;background:#fff;padding:15px 30px;/*-webkit-border-radius:8px;-moz-border-radius:8px;-o-border-radius:8px;-ms-border-radius:8px;border-radius:8px;-webkit-box-shadow:0 0 10px #000;-moz-box-shadow:0 0 10px #000;-o-box-shadow:0 0 10px #000;-ms-box-shadow:0 0 10px #000;box-shadow:0 0 10px #000;*/text-align:left}.modal a.close-modal{position:absolute;top:0;right:0;display:block;width:40px;height:40px;text-indent:-9999px;background:#fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;opacity:0.5;border-radius:50% 0 50% 50%;}.modal a.close-modal:hover{opacity:0.75;}.modal-spinner{display:none;position:fixed;top:50%;left:50%;transform:translateY(-50%) translateX(-50%);padding:12px 16px;border-radius:5px;background-color:#111;height:20px}.modal-spinner>div{border-radius:100px;background-color:#fff;height:20px;width:2px;margin:0 1px;display:inline-block;-webkit-animation:sk-stretchdelay 1.2s infinite ease-in-out;animation:sk-stretchdelay 1.2s infinite ease-in-out}.modal-spinner .rect2{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.modal-spinner .rect3{-webkit-animation-delay:-1.0s;animation-delay:-1.0s}.modal-spinner .rect4{-webkit-animation-delay:-0.9s;animation-delay:-0.9s}@-webkit-keyframes sk-stretchdelay{0%,40%,100%{-webkit-transform:scaleY(0.5)}20%{-webkit-transform:scaleY(1.0)}}@keyframes sk-stretchdelay{0%,40%,100%{transform:scaleY(0.5);-webkit-transform:scaleY(0.5)}20%{transform:scaleY(1.0);-webkit-transform:scaleY(1.0)}}
/* magnific popup */
.mfp-bg{ top:0;left:0;width:100%;height:100%;z-index:10002;overflow:hidden;position:fixed;background:#0b0b0b;opacity:0.8;filter:alpha(opacity=80);}.mfp-wrap{ top:0;left:0;width:100%;height:100%;z-index:10003;position:fixed;outline:none !important;-webkit-backface-visibility:hidden;}.mfp-container{ text-align:center;position:absolute;width:100%;height:100%;left:0;top:0;padding:0 8px;}.mfp-container:before{ content:'';display:inline-block;height:100%;vertical-align:middle;}.mfp-align-top .mfp-container:before{ display:none;}.mfp-content{ position:relative;display:inline-block;vertical-align:middle;margin:0 auto;text-align:left;z-index:1045;}.mfp-inline-holder .mfp-content,.mfp-ajax-holder .mfp-content{ width:100%;cursor:auto;}.mfp-ajax-cur{ cursor:progress;}.mfp-zoom-out-cur,.mfp-zoom-out-cur .mfp-image-holder .mfp-close{ cursor:-moz-zoom-out;cursor:-webkit-zoom-out;cursor:zoom-out;}.mfp-zoom{ cursor:pointer;cursor:-webkit-zoom-in;cursor:-moz-zoom-in;cursor:zoom-in;}.mfp-auto-cursor .mfp-content{ cursor:auto;}.mfp-close,.mfp-arrow,.mfp-preloader,.mfp-counter{ -webkit-user-select:none;-moz-user-select:none;user-select:none;}.mfp-loading.mfp-figure{ display:none;}.mfp-hide{ display:none !important;}.mfp-preloader{ color:#CCC;position:absolute;top:50%;width:auto;text-align:center;margin-top:-0.8em;left:8px;right:8px;z-index:1044;}.mfp-preloader a{ color:#CCC;}.mfp-preloader a:hover{ color:#FFF;}.mfp-s-ready .mfp-preloader{ display:none;}.mfp-s-error .mfp-content{ display:none;}button.mfp-close,button.mfp-arrow{ overflow:visible;cursor:pointer;background:transparent;border:0;-webkit-appearance:none;display:block;outline:none;padding:0;z-index:1046;-webkit-box-shadow:none;box-shadow:none;} button::-moz-focus-inner{ padding:0;border:0;}.mfp-close{ width:44px;height:44px;line-height:44px;position:absolute;right:0;top:0;text-decoration:none;text-align:center;opacity:0.65;filter:alpha(opacity=65);padding:0 0 18px 10px;color:#FFF;font-style:normal;font-size:28px;font-family:Arial,Baskerville,monospace;}.mfp-close:hover,.mfp-close:focus{ opacity:1;filter:alpha(opacity=100);}.mfp-close:active{ top:1px;}.mfp-close-btn-in .mfp-close{ color:#333;}.mfp-image-holder .mfp-close,.mfp-iframe-holder .mfp-close{ color:#FFF;right:-6px;text-align:right;padding-right:6px;width:100%;}.mfp-counter{ position:absolute;top:0;right:0;color:#CCC;font-size:12px;line-height:18px;white-space:nowrap;}.mfp-arrow{ position:absolute;opacity:0.65;filter:alpha(opacity=65);margin:0;top:50%;margin-top:-55px;padding:0;width:90px;height:110px;-webkit-tap-highlight-color:rgba(0,0,0,0);}.mfp-arrow:active{ margin-top:-54px;}.mfp-arrow:hover,.mfp-arrow:focus{ opacity:1;filter:alpha(opacity=100);}.mfp-arrow:before,.mfp-arrow:after,.mfp-arrow .mfp-b,.mfp-arrow .mfp-a{ content:'';display:block;width:0;height:0;position:absolute;left:0;top:0;margin-top:35px;margin-left:35px;border:medium inset transparent;}.mfp-arrow:after,.mfp-arrow .mfp-a{ border-top-width:13px;border-bottom-width:13px;top:8px;}.mfp-arrow:before,.mfp-arrow .mfp-b{ border-top-width:21px;border-bottom-width:21px;opacity:0.7;}.mfp-arrow-left{ left:0;}.mfp-arrow-left:after,.mfp-arrow-left .mfp-a{ border-right:17px solid #FFF;margin-left:31px;}.mfp-arrow-left:before,.mfp-arrow-left .mfp-b{ margin-left:25px;border-right:27px solid #3F3F3F;}.mfp-arrow-right{ right:0;}.mfp-arrow-right:after,.mfp-arrow-right .mfp-a{ border-left:17px solid #FFF;margin-left:39px;}.mfp-arrow-right:before,.mfp-arrow-right .mfp-b{ border-left:27px solid #3F3F3F;}.mfp-iframe-holder{ padding-top:40px;padding-bottom:40px;}.mfp-iframe-holder .mfp-content{ line-height:0;width:100%;max-width:900px;}.mfp-iframe-holder .mfp-close{ top:-40px;}.mfp-iframe-scaler{ width:100%;height:0;overflow:hidden;padding-top:56.25%;}.mfp-iframe-scaler iframe{ position:absolute;display:block;top:0;left:0;width:100%;height:100%;box-shadow:0 0 8px rgba(0,0,0,0.6);background:#000;}
/* Main image in popup */
img.mfp-img{ width:auto;max-width:100%;height:auto;display:block;line-height:0;padding:40px 0 40px;margin:0 auto;}
/* The shadow behind the image */.mfp-figure{ line-height:0;}.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 8px rgba(0,0,0,0.6);background:#444;}.mfp-figure small{ color:#BDBDBD;display:block;font-size:12px;line-height:14px;}.mfp-figure figure{ margin:0;}.mfp-bottom-bar{ margin-top:-36px;position:absolute;top:100%;left:0;width:100%;cursor:auto;}.mfp-title{ text-align:left;line-height:18px;color:#F3F3F3;word-wrap:break-word;padding-right:36px;}.mfp-image-holder .mfp-content{ max-width:100%;}.mfp-gallery .mfp-image-holder .mfp-figure{ cursor:pointer;}
/* Fade Effect for opening */
.mfp-fade.mfp-bg{ background:#333;opacity:0;-webkit-transition:all 0.15s ease-out;-moz-transition:all 0.15s ease-out;transition:all 0.15s ease-out;}.mfp-fade.mfp-bg.mfp-ready{ opacity:0.94;}.mfp-fade.mfp-bg.mfp-removing{ opacity:0;}.mfp-fade.mfp-wrap .mfp-content{ opacity:0;-webkit-transition:all 0.15s ease-out;-moz-transition:all 0.15s ease-out;transition:all 0.15s ease-out;}.mfp-fade.mfp-wrap.mfp-ready .mfp-content{ opacity:1;}.mfp-fade.mfp-wrap.mfp-removing .mfp-content{ opacity:0;}
/* Zoom effect */
.mfp-zoom-in .mfp-with-anim{ opacity:0;-webkit-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out;-webkit-transform:scale(0.8);-ms-transform:scale(0.8);transform:scale(0.8);}.mfp-zoom-in.mfp-bg{ opacity:0;-webkit-transition:all 0.3s ease-out;transition:all 0.3s ease-out;}.mfp-zoom-in.mfp-ready .mfp-with-anim{ opacity:1;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1);}.mfp-zoom-in.mfp-ready.mfp-bg{ opacity:0.8;}.mfp-zoom-in.mfp-removing .mfp-with-anim{ -webkit-transform:scale(0.8);-ms-transform:scale(0.8);transform:scale(0.8);opacity:0;}.mfp-zoom-in.mfp-removing.mfp-bg{ opacity:0;}
@media screen and (max-width:800px) and (orientation:landscape),screen and (max-height:300px){ /** * Remove all paddings around the image on small screen */.mfp-img-mobile .mfp-image-holder{ padding-left:0;padding-right:0;}.mfp-img-mobile img.mfp-img{ padding:0;}.mfp-img-mobile .mfp-figure:after{ top:0;bottom:0;}.mfp-img-mobile .mfp-figure small{ display:inline;margin-left:5px;}.mfp-img-mobile .mfp-bottom-bar{ background:rgba(0,0,0,0.6);bottom:0;margin:0;top:auto;padding:3px 5px;position:fixed;}.mfp-img-mobile .mfp-bottom-bar:empty{ padding:0;}.mfp-img-mobile .mfp-counter{ right:5px;top:3px;}.mfp-img-mobile .mfp-close{ top:0;right:0;width:35px;height:35px;line-height:35px;background:rgba(0,0,0,0.6);position:fixed;text-align:center;padding:0;} } @media all and (max-width:900px){ .mfp-arrow{ -webkit-transform:scale(0.75);-ms-transform:scale(0.75);transform:scale(0.75);}.mfp-arrow-left{ -webkit-transform-origin:0;-ms-transform-origin:0;transform-origin:0;}.mfp-arrow-right{ -webkit-transform-origin:100%;-ms-transform-origin:100%;transform-origin:100%;}.mfp-container{ padding-left:6px;padding-right:6px;} }

:root{--animate-duration:1s;--animate-delay:1s;--animate-repeat:1}
.animate__animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-duration:var(--animate-duration);animation-duration:var(--animate-duration);-webkit-animation-fill-mode:both;animation-fill-mode:both;;}
.animate__animated:not(.animate__slideOutLeft){ opacity:0 }
@media (prefers-reduced-motion:reduce),print{.animate__animated{-webkit-animation-duration:1ms!important;animation-duration:1ms!important;-webkit-animation-iteration-count:1!important;animation-iteration-count:1!important;-webkit-transition-duration:1ms!important;transition-duration:1ms!important}}
@-webkit-keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}
@-webkit-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}
@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}
@-webkit-keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}
@-webkit-keyframes fadeOutDown{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes fadeOutDown{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}
@-webkit-keyframes slideOutLeft{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);visibility:hidden}}@keyframes slideOutLeft{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);visibility:hidden}}
.animate__fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn}
.animate__fadeInUp{-webkit-animation-name:fadeInUp;animation-name:fadeInUp}
.animate__fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}
.animate__fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}
.animate__fadeOutDown{-webkit-animation-name:fadeOutDown;animation-name:fadeOutDown}
.animate__slideOutLeft{-webkit-animation-name:slideOutLeft;animation-name:slideOutLeft}
.animate__animated.animate__delay-1s{-webkit-animation-delay:1s;animation-delay:1s;-webkit-animation-delay:var(--animate-delay);animation-delay:var(--animate-delay)}
.animate__animated.animate__faster{-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-duration:calc(var(--animate-duration)/2);animation-duration:calc(var(--animate-duration)/2)}
.animate__animated.animate__fast{-webkit-animation-duration:.8s;animation-duration:.8s;-webkit-animation-duration:calc(var(--animate-duration)*.8);animation-duration:calc(var(--animate-duration)*.8)}
.animate__animated.animate__slow{-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-duration:calc(var(--animate-duration)*2);animation-duration:calc(var(--animate-duration)*2)}
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html{-webkit-text-size-adjust:100%;}body{margin:0;}main{display:block;}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{color:currentColor;background-color:transparent;outline:0;text-decoration:none;}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder;}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sub{bottom:-0.25em;}sup{top:-0.5em;}img{border-style:none;}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input {overflow:visible;}button,select {text-transform:none;}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button;}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0;}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText;}fieldset{padding:0.35em 0.75em 0.625em;}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline;}textarea{overflow:auto;vertical-align:middle;}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto;}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block;}summary{display:list-item;}template{display:none;}[hidden]{display:none;}ul,ol{margin:0;padding:0;list-style:none;} img{vertical-align:middle;max-width:100%;} h1,h2,h3,h4,h5,h6{font-weight:normal;margin:0;} p{margin:0;} figure{padding:0;margin:0;} th{font-weight:normal;text-align:left;} i{ font-style:normal; }

html{ box-sizing:border-box; }
*, *:before, *:after{ box-sizing:inherit; }

body{font-family:montserratsemibold,fangsong;line-height:0.9;color:#666666;}

.d-none{ display:none !important; }
.text-center{ text-align:center; }
.text-right{ text-align:right; }
.text-red{ color:#ff0000; }
.tbl{ display:table; }
.tbl > *{ display:table-cell;vertical-align:middle; }
.float-right{ float:right !important; }

.form-check{display:block;min-height:26px;padding-left:38px;margin-bottom:0}.form-check .form-check-input{float:left;margin-left:-38px}.form-check-reverse .form-check-input{float:right;margin-right:0;margin-left:0}.form-check-input{width:26px;height:26px;margin-top:2px;vertical-align:top;background-color:#fff;background-repeat:no-repeat;background-position:center;background-size:contain;border:1px solid #666666;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-print-color-adjust:exact;color-adjust:exact;print-color-adjust:exact}.form-check-input[type=checkbox]{border-radius:5px}.form-check-input[type=radio]{border-radius:50%}.form-check-input:active{filter:brightness(90%)}.form-check-input:focus{border-color:#86b7fe;outline:0;}.form-check-input:checked{background-color:#E4001E;border-color:#E4001E}.form-check-input:checked[type=checkbox]{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e")}.form-check-input:checked[type=radio]{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e")}.form-check-input:disabled{pointer-events:none;filter:none;opacity:.5}.form-check-input:disabled~.form-check-label,.form-check-input[disabled]~.form-check-label{cursor:default;opacity:.5}.form-check-input~.form-check-label{font-size:23px;line-height:1.2;color:#808080;}

.iconos{display:inline-block;vertical-align:middle;background-image:url(../img/iconos.png);background-repeat:no-repeat;}
.conexion-1{ width:241px;height:112px;background-position:0 0; }
.conexion-2{ width:241px;height:112px;background-position:-241px 0; }
.sistemaparaopticas-1{ width:175px;height:131px;background-position:0 -112px; }
.laboratoriooptica-1{ width:108px;height:131px;background-position:-175px -112px; }
.consultorios-1{ width:157px;height:131px;background-position:-283px -112px; }
.historialmedidas-1{ width:57px;height:56px;background-position:0 -243px; }
.controlinventarios-1{ width:57px;height:63px;background-position:-57px -243px; }
.registroventas-1{ width:57px;height:56px;background-position:-114px -243px; }
.comprasmercaderia-1{ width:57px;height:53px;background-position:-171px -243px; }
.gestioncaja-1{ width:57px;height:46px;background-position:-228px -243px; }
.multiplesreportes-1{ width:57px;height:56px;background-position:-285px -243px; }
.utilidades-1{ width:57px;height:44px;background-position:-342px -243px; }
.kardex-1{ width:57px;height:57px;background-position:-399px -243px; }
.direccion-1{ width:32px;height:38px;background-position:-482px 0; }
.telefono-1{ width:32px;height:35px;background-position:-482px -38px; }
.correo-1{ width:32px;height:23px;background-position:-482px -73px; }
.direccion-2{ width:24px;height:22px;background-position:0 -323px; }
.telefono-2{ width:24px;height:17px;background-position:0 -306px; }
.correo-2{ width:24px;height:17px;background-position:0 -345px; }
.facebook-1{ width:13px;height:24px;background-position:-24px -306px; }
.whatsapp-1{ width:24px;height:24px;background-position:-37px -306px; }
.tarjeta-1{ width:52px;height:34px;background-position:-61px -306px; }
.tarjeta-2{ width:51px;height:33px;background-position:-113px -306px; }
.tarjeta-3{ width:47px;height:33px;background-position:-164px -306px; }
.ns-1{ width:170px;height:117px;background-position:0 -361px; }
.ns-2{ width:149px;height:117px;background-position:-170px -361px; }
.ns-3{ width:155px;height:117px;background-position:-319px -361px; }
.ns-caracteristicas-1{ width:152px;height:124px;background-position:0 -478px; }
.ns-caracteristicas-2{ width:128px;height:124px;background-position:-152px -478px; }
.ns-caracteristicas-3{ width:127px;height:124px;background-position:-280px -478px; }
.ns-caracteristicas-4{ width:124px;height:124px;background-position:-407px -478px; }
.ns-caracteristicas-5{ width:86px;height:124px;background-position:-531px -478px; }
.ns-caracteristicas-6{ width:149px;height:124px;background-position:-617px -478px; }
.caracteristicas-1{ width:68px;height:82px;background-position:0 -602px; }
.caracteristicas-2{ width:80px;height:82px;background-position:-68px -602px; }
.caracteristicas-3{ width:100px;height:82px;background-position:-148px -602px; }
.caracteristicas-4{ width:103px;height:82px;background-position:-248px -602px; }
.caracteristicas-5{ width:121px;height:82px;background-position:-351px -602px; }
.caracteristicas-6{ width:97px;height:82px;background-position:-472px -602px; }
.mp-1{ width:95px;height:62px;background-position:0 -684px; }
.mp-2{ width:94px;height:62px;background-position:-95px -684px; }
.mp-3{ width:86px;height:62px;background-position:-189px -684px; }
.mp-4{ width:59px;height:62px;background-position:-275px -684px; }
.mp-5{ width:60px;height:62px;background-position:-334px -684px; }
.mp-6{ width:60px;height:62px;background-position:-394px -684px; }
.mp-7{ width:61px;height:62px;background-position:-454px -684px; }
.mp-8{ width:60px;height:62px;background-position:-515px -684px; }
.mp-9{ width:58px;height:62px;background-position:-696px -684px; }
.inc-1{ width:74px;height:101px;background-position:0 -746px; }
.inc-2{ width:97px;height:101px;background-position:-74px -746px; }
.inc-3{ width:127px;height:101px;background-position:-171px -746px; }
.inc-4{ width:92px;height:101px;background-position:-298px -746px; }
.flecha-abajo-1{ width:21px;height:12px;background-position:-440px -155px; }
.plan-tarjeta-1{ width:123px;height:81px;background-position:0 -847px; }
.plan-tarjeta-2{ width:121px;height:81px;background-position:-123px -847px; }
.plan-tarjeta-3{ width:114px;height:81px;background-position:-244px -847px; }
.plan-tarjeta-4{ width:115px;height:81px;background-position:-358px -847px; }
.plan-tarjeta-5{ width:78px;height:81px;background-position:-473px -847px; }
.plan-tarjeta-6{ width:76px;height:81px;background-position:-551px -847px; }
.correo-3{ width:114px;height:98px;background-position:-474px -380px; }
.telefono-3{ width:80px;height:98px;background-position:-588px -380px; }
.whatsapp-3{ width:98px;height:98px;background-position:-668px -380px; }
.mp-tcd-1{ width:87px;height:56px;background-position:-390px -746px; }
.mp-tcd-2{ width:85px;height:56px;background-position:-477px -746px; }
.mp-tcd-3{ width:78px;height:56px;background-position:-562px -746px; }
.mp-tcd-4{ width:81px;height:56px;background-position:-640px -746px; }
.mp-yape{ width:60px;height:60px;background-position:-575px -684px; }
.mp-plin{ width:61px;height:61px;background-position:-635px -684px; }

h2{ color:#BA0D2A;font-size:30px;line-height:35px; }
h3{ color:#BA0D2A;font-size:26px; }
h4{ font-size:20px; }
.subtitulo{ display:block;font-size:40px;color:#BA0D2A; }
.container{ max-width:1920px;margin:0 auto;padding:0 15px;position:relative; }

.archivo{ overflow:hidden; }
.archivo input[type="file"]{ display:none; }
.archivo .uploaded-file{ float:left;color:#fff;background:#0D3C61;width:113px;text-align:center;padding:5px 0 3px;border-radius:4px;cursor:pointer; }
.archivo .uploaded-file + span{ display:block;margin-left:113px;font-size:12px;padding:5px 7px 0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden; }

@keyframes elementor-animation-pulse-grow{to{transform:scale(1.1)}}
.b-animado{ transition:all .3s; }
.b-animado:hover{ animation-name:elementor-animation-pulse-grow;animation-duration:.3s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate; }

.rel{ position:relative !important; }
.b-shadow{ box-shadow:7px 7px 5px 0px rgba(0,0,0,0.4);-webkit-box-shadow:7px 7px 5px 0px rgba(0,0,0,0.4);-moz-box-shadow:7px 7px 5px 0px rgba(0,0,0,0.4); }

.contenedor-menu-icon{ cursor:pointer; }
.contenedor-menu-icon .menu-icon{ position:relative;width:40px;height:30px;margin:0; }
.contenedor-menu-icon .menu-icon::before,
.contenedor-menu-icon .menu-icon::after,
.contenedor-menu-icon .menu-icon .menu-line{ content:"";position:absolute;left:0;width:100%;height:4px;border-radius:10px;background-color:#fff;transition:transform 0.2s ease, width 0.1s ease, left 0.1s ease, top 0.1s ease; }
.contenedor-menu-icon .menu-icon::before{ top:0;transform-origin:top left; }
.contenedor-menu-icon .menu-icon .menu-line{ top:50%;transform:translateY(-50%); }
.contenedor-menu-icon .menu-icon::after{ bottom:0;transform-origin:bottom left; }
.contenedor-menu-icon.active .menu-icon::before{ transform:rotate(41deg);left:6px; }
.contenedor-menu-icon.active .menu-icon::after{ transform:rotate(-41deg);left:6px; }
.contenedor-menu-icon.active .menu-icon .menu-line{ opacity:0; }

.banner{ height:325px;background-repeat:no-repeat;background-position:center center;-webkit-background-size:cover;background-size:cover;background-attachment:fixed;position:relative; }
.banner:before{ content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(186,13,42,0.5); }

.listado li{ font-size:25px;position:relative;padding:4px 0 11px 58px;line-height:30px;max-width:600px; }
.listado li:before{ content:"";position:absolute;top:0;left:0;width:42px;height:42px;background:url(../img/iconos.png) -440px -113px no-repeat; }

.listado-precios{ display:inline-block;max-width:1185px;width:100%;vertical-align:middle; }
.listado-precios li{ width:504px;background:#DADADA;padding:34px 0 0;margin:0 0 56px; }
.listado-precios li:first-child{ float:left; }
.listado-precios li:last-child{ float:right; }
.listado-precios li > span{ display:block;font-size:23px;text-align:left;padding:0 32px 65px; }
.listado-precios li h3{ line-height:31px; }
.listado-precios li h3 span{ display:block; }
.listado-precios li a{ display:inline-block;color:#DADADA;background:#BA0D2A;width:236px;text-align:center;padding:7px 0 9px;margin:0 0 11px;font-size:20px; }
.listado-precios li .tbl{ margin:58px auto 144px; }
.listado-precios li .tbl > div{ padding:12px 28px 56px; }
.listado-precios li .tbl > div h4{ margin:0 0 70px; }
.listado-precios li .tbl > div span{ display:block;font-size:40px;padding:0 0 20px; }
.listado-precios li .tbl > div small{ display:block;font-size:20px; }
.listado-precios li .tbl > div:first-child{ border-right:2px solid #E4001E; }
.listado-precios li .tbl > div:last-child{ border-left:2px solid #E4001E; }

.contactanos .container{ max-width:1278px;padding-top:77px;padding-bottom:54px; }
.contactanos .container .b-shadow{ box-shadow:7px 6px 9px 1px rgb(0 0 0 / 30%);-webkit-box-shadow:7px 6px 9px 1px rgb(0 0 0 / 30%);-moz-box-shadow:7px 6px 9px 1px rgb(0 0 0 / 30%); }
.contactanos .container > div{ padding:0 12px 0 243px;position:relative; }
.contactanos .container > div .datos{ position:absolute;top:35px;left:0;background:#DADADA;width:502.813px;padding:66px 34px 112px; }
.contactanos .container > div .datos h2{ text-align:center; }
.contactanos .container > div .datos ul{ margin:46px 0 0 0; }
.contactanos .container > div .datos ul li{ position:relative;padding:0 0 0 38px; }
.contactanos .container > div .datos ul li + li{ margin-top:68px; }
.contactanos .container > div .datos ul li > i{ position:absolute;top:0;left:0; }
.contactanos .container > div .datos ul li > span{ display:block;font-size:25px; }
.contactanos .container > div .datos ul li > p{ font-size:21px;margin:29px 0 0; }
.contactanos .container > div .datos ul li:nth-child(1) i{ top:-17px; }
.contactanos .container > div .datos ul li:nth-child(2) i{ top:-6px; }
.contactanos .container > div .datos ul li:nth-child(3) i{ top:-2px; }
.contactanos .container > div form{ padding:86px 41px 75px 310px; }
.contactanos .container > div form .form-group{ padding:0; }
.contactanos .container > div form .form-group label{ display:block;font-size:20px;margin:0 0 12px; }
.contactanos .container > div form .form-group input,
.contactanos .container > div form .form-group textarea{ width:100%;border:1px solid #C6C6C5;font-size:20px;outline:0;padding:6px 10px 5px; }
.contactanos .container > div form .form-group textarea{ min-height:130px; }
.contactanos .container > div form .form-group + .form-group{ margin-top:34px; }
.contactanos .container > div form button{ width:170px;display:inline-block;font-size:22px;color:#fff;background:#BA0D2A;border:0;vertical-align:middle;margin:37px 0 0 1px;padding:3px 0 5px;cursor:pointer; }

header{ position:absolute;top:0;left:0;width:100%;z-index:1;background:transparent; }
header .container{ padding-left:0;padding-right:0;position:relative; }
header .container .tbl{ width:100%;position:relative;z-index:1; }
header .container .tbl > div{ vertical-align:top; }
header .container .tbl > div:first-child{ width:497px;padding:0 15px;position:relative; }
header .container .tbl > div .logo a{ display:inline-block;vertical-align:middle; }
header .container .tbl > div .logo a img{ max-width:317px; }
header .container .tbl > div .contenedor-menu-icon.active + nav{ position:absolute;display:block;width:100%;top:calc(100% + 20px);left:0;padding:0 15px; }
header .container .tbl > div .contenedor-menu-icon.active + nav > ul{ background:rgba(186,13,42,0.8);padding:5px 15px; }
header .container .tbl > div .contenedor-menu-icon.active + nav > ul > li{ display:block;text-align:left;padding:10px 0;border-bottom:1px solid #fff; }
header .container .tbl > div .contenedor-menu-icon.active + nav > ul > li:last-child{ border-bottom:0; }
header .container .tbl > div .contenedor-menu-icon.active + nav > ul > li + li{ margin-left:0; }
header .container .tbl > div .contenedor-menu-icon.active + nav > ul > li > a{ display:block;padding:5px;color:#fff; }
header .container .tbl > div .contenedor-menu-icon.active + nav > ul > li:hover > a + ul{ display:none; }
header .container .tbl > div .contenedor-menu-icon.active + nav > ul > li.active > a + ul{ display:block;position:relative;top:0;margin:0 0 5px 15px; }
header .container .tbl > div .contenedor-menu-icon.active + nav > ul > li.active > a + ul > li:first-child{ margin-top:5px; }
header .container .tbl > div nav{ padding:35px 42px 20px 0;text-align:center; }
header .container .tbl > div nav > ul > li{ display:inline-block;vertical-align:middle;position:relative;margin:0 2.97%; }
header .container .tbl > div nav > ul > li > a{ display:inline-block;vertical-align:middle;color:#fff;font-size:28.23px; }
header .container .tbl > div nav > ul > li > a.active{ color:#E3B7C0 !important; }
header .container .tbl > div nav > ul > li > a + ul{ display:none;position:absolute;top:28px;left:0;white-space:nowrap;color:#868686;font-size:18.46px;text-align:left; }
header .container .tbl > div nav > ul > li > a + ul > li{ background:#fff; }
header .container .tbl > div nav > ul > li > a + ul > li:first-child{ padding-top:4px;margin-top:17px; }
header .container .tbl > div nav > ul > li > a + ul > li:last-child{ padding-top:2px; }
header .container .tbl > div nav > ul > li > a + ul > li > a{ display:block;font-family:montserratmedium,fangsong;padding:9px 11px; }
header .container .tbl > div nav > ul > li:hover > a + ul{ display:block }

/* Portada */

.animate__animated_1{ visibility:hidden;transform:translateY(10px) scale(0.6);opacity:0;transition:transform 1s ease,opacity 1s ease; }
.animate__animated_1.active{ visibility:visible;transform:translateY(0) scale(1);opacity:1; }
.animate__animated_2{ transform-origin:bottom;transition:transform 1s ease;transform:scaleY(0); }
.animate__animated_2.active{ transform:scaleY(1); }
.animate__animated_3{ visibility:hidden;opacity:0; }
.animate__animated_3.active{ visibility:visible;opacity:1; }

@keyframes fadeInUp{ from{ transform:translateY(50px);opacity:0; } to{transform:translateY(0);opacity:1; } }
.fade-in-up{ animation:0.75s both fadeInUp; }
.vivify{ -webkit-animation-duration:.8s;-webkit-animation-fill-mode:both;animation-duration:.8s;animation-fill-mode:both;opacity:0; }
.flipInY{-webkit-animation-name:flipInY;animation-name:flipInY;-webkit-animation-duration:1s;animation-duration:1s;opacity:1}@keyframes flipInY{from{opacity:0;-webkit-transform:perspective(400px) rotateY(90deg) scale3d(1.2,1.2,1.2);transform:perspective(400px) rotateY(90deg) scale3d(1.2,1.2,1.2)}50%{opacity:1;-webkit-animation-timing-function:cubic-bezier(0.455,0.03,0.515,0.955);animation-timing-function:cubic-bezier(0.455,0.03,0.515,0.955);-webkit-transform:perspective(400px) rotateY(-20deg) scale3d(1,1,1);transform:perspective(400px) rotateY(-20deg) scale3d(1,1,1)}to{-webkit-transform:perspective(400px) rotateY(0deg) scale3d(1,1,1);transform:perspective(400px) rotateY(0deg) scale3d(1,1,1)}}
.vivify{ position:relative; }
.vivify i{ position:relative;left:50%;transform:translate(-50%,0);transition:left 1s ease,transform 1s ease;/* -webkit-transition-delay:1s;transition-delay:1s */ }
@keyframes visibilityEffect{ 0%{ opacity:0; } to{left:0;opacity:1; } }
.vivify span{ position:relative;opacity:0; }
.vivify.active i{ left:0;transform:none; }
.vivify.active span{ opacity:1;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-name:visibilityEffect;animation-name:visibilityEffect;-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-delay:.5s;animation-delay:.5s }

#portada .banner{ background-image:url(../img/portada/banner-intranetoptica.jpg);background-position:center left;width:100%;height:100vh; }
#portada .banner:before{ background:rgba(123,11,30,0.5); }
#portada .banner img{ display:inline-block; }
#portada .banner .slick-slider{ height:100%; }
#portada .banner .slick-slider .slick-track,
#portada .banner .slick-slider .slick-list{ width:100%;height:100%; }
#portada .banner .container{ max-width:1620px;margin:0 auto;padding:0 15px;width:100%;height:100%;text-align:right; }
#portada .banner .container .subcontainer{ position:relative;display:inline-block;text-align:left;height:100%; }
#portada .banner .container .subcontainer > img{ position:absolute;top:198px;left:50%;transform:translate(-50%,0); }
#portada .banner .container .subcontainer .tbl{ height:100%;position:relative;padding:80.41px 0 0;margin:0 0 0 auto; }
#portada .banner .container .subcontainer .tbl > div:not(.with-img):first-child{ padding-right:83px; }
#portada .banner .container .subcontainer .tbl > div.with-img{ position:relative;padding-right:470px; }
#portada .banner .container .subcontainer .tbl > div > img{ position:absolute;top:60%;transform:translate(0,-50%) scale(0.6);right:0;transition:top 1s ease,transform 1s ease,opacity 1s ease; }
#portada .banner .container .subcontainer .tbl > div > img.active{ transform:translate(0,-50%) scale(1);top:50%; }
#portada .banner .container .subcontainer .tbl > div{ vertical-align:middle; }
#portada .banner .container .subcontainer .tbl > div > span{ display:block;line-height:1; }
#portada .banner .container .subcontainer .tbl > div > .span-1{ font-size:33.62px;color:#DADADA; }
#portada .banner .container .subcontainer .tbl > div > .span-2{ font-size:40.03px;color:#E4001E;margin:16px 0 46px; }
#portada .banner .container .subcontainer .tbl > div > .span-3{ font-size:36.93px;color:#E4001E; }
#portada .banner .container .subcontainer .tbl > div > .span-4{ font-size:27.03px;color:#fff;margin:22px 0 50px; }
#portada .banner .container .subcontainer .tbl > div > p{ font-family:'montserratmedium';font-size:23.08px;color:#CCCCCC;line-height:1.225;max-width:532.549px;margin:0; }
#portada .banner .container .subcontainer .tbl > div > .barra{ display:inline-block;width:37px; }
#portada .banner .container .subcontainer .tbl > div > .barra + .barra{ margin-left:26px; }
#portada .banner .container .subcontainer .tbl > div > .barra-1{ height:95px;background:rgb(121,13,12);background:linear-gradient(0deg,rgba(121,13,12,1) 0%,rgba(255,56,72,1) 100%); }
#portada .banner .container .subcontainer .tbl > div > .barra-2{ height:110px;background:rgb(218,218,218);background:linear-gradient(0deg,rgba(218,218,218,1) 0%,rgba(102,102,102,1) 100%); }
#portada .banner .container .subcontainer .tbl > div > .barra-3{ height:131px;background:rgb(121,13,12);background:linear-gradient(0deg,rgba(121,13,12,1) 0%,rgba(255,56,72,1) 100%); }
#portada .banner .container .subcontainer .tbl > div > .barra-4{ height:170px;background:rgb(218,218,218);background:linear-gradient(0deg,rgba(218,218,218,1) 0%,rgba(102,102,102,1) 100%); }
#portada .banner .container .subcontainer .tbl > div > .barra-5{ height:200px;background:rgb(121,13,12);background:linear-gradient(0deg,rgba(121,13,12,1) 0%,rgba(255,56,72,1) 100%); }
#portada .banner .container .subcontainer .tbl > div > .barra-6{ height:216px;background:rgb(218,218,218);background:linear-gradient(0deg,rgba(218,218,218,1) 0%,rgba(102,102,102,1) 100%); }

@media screen and (min-width:1051px) and (min-height:451px){
  #portada .banner .container .subcontainer > img{ display:none; }
}
@media screen and (min-width:1051px) and (min-height:940px){
  #portada .banner .container .subcontainer > img{ display:inline-block; }
}
@media screen and (max-width:1050px), screen and (max-height:450px){
  #portada .banner{ padding-top:150px; }
  #portada .banner,
  #portada .banner .container,
  #portada .banner .container .subcontainer,
  #portada .banner .container .subcontainer .tbl{ height:auto; }
  #portada .banner .container .subcontainer > img{ position:relative;top:0;left:0;transform:none; }
  #portada .banner .container .subcontainer .tbl,
  #portada .banner .container .subcontainer .tbl > div{ display:block; }
  #portada .banner .container .subcontainer .tbl{ padding:50px 0;width:100%; }
  #portada .banner .container .subcontainer .tbl > div{ padding-right:0 !important; }
  #portada .banner .container .subcontainer .tbl > div > img{ position:relative;top:0;transform:translateY(10px) scale(0.6);transition:transform 1s ease,opacity 1s ease; }
  #portada .banner .container .subcontainer .tbl > div > img.active{ transform:translateY(0) scale(1);top:0; }
  #portada .banner .container .subcontainer .tbl > div > p{ margin-bottom:30px;max-width:inherit; }
  #portada .banner .container .subcontainer .tbl > div > .span-2,
  #portada .banner .container .subcontainer .tbl > div > .span-4{ margin-bottom:30px; }
  #portada .banner .container .subcontainer{ display:block;text-align:center; }
}

#portada .servicios .container{ padding-top:97px; }
#portada .servicios .container > span{ position:absolute; }
#portada .servicios .container > span:first-child{ top:0;left:27px; }
#portada .servicios .container > span:last-child{ bottom:0;right:29px; }
#portada .servicios .container > ul{ text-align:center; }
#portada .servicios .container > ul li{ display:inline-block;margin-bottom:80px; }
#portada .servicios .container > ul li + li{ margin-left:8.32%; }
#portada .servicios .container > ul li span{ display:block;font-size:30px;padding:48px 0 0; }
#portada .contamos{ background:#F9F9F9;text-align:center; }
#portada .contamos .container{ max-width:1355px;padding-top:58px;padding-bottom:79px; }
#portada .contamos .container h2{ margin-bottom:103px; }
#portada .contamos .container .recursos{ position:relative;min-height:436px;text-align:center;max-width:1200px;width:100%;margin:0 auto; }
#portada .contamos .container .recursos img{ position:absolute;top:2px;left:calc(50% - 21px);transform:translate(-50%, 0); }
#portada .contamos .container .recursos ul{ position:relative;z-index:1; }
#portada .contamos .container .recursos ul li{ text-align:left;white-space:nowrap; }
#portada .contamos .container .recursos ul li span{ display:inline-block;vertical-align:middle;margin-left:12px;padding:0 2px 0 0; }
#portada .contamos .container .recursos ul:first-child{ float:left;margin-top:4px; }
#portada .contamos .container .recursos ul:first-child li:nth-child(1){ margin-bottom:68px; }
#portada .contamos .container .recursos ul:first-child li:nth-child(2){ margin-bottom:74px; }
#portada .contamos .container .recursos ul:first-child li:nth-child(3){ margin-bottom:86px; }
#portada .contamos .container .recursos ul + ul{ float:right; }
#portada .contamos .container .recursos ul + ul li:nth-child(1){ margin-bottom:67px; }
#portada .contamos .container .recursos ul + ul li:nth-child(2){ margin-bottom:70px; }
#portada .contamos .container .recursos ul + ul li:nth-child(3){ margin-bottom:68px; }
#portada .beneficios .titulo{ height:571px;background-image:url(../img/portada/beneficios-intranetoptica.jpg);background-repeat:no-repeat;background-position:center left;-webkit-background-size:cover;background-size:cover;background-attachment:fixed;position:relative;overflow:hidden; }
#portada .beneficios .titulo:before{ content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(123,11,30,0.5); }
#portada .beneficios .titulo .container{ z-index:1;height:100%; }
#portada .beneficios .titulo .container .circulo{ position:absolute;top:0;width:788px;height:788px;top:342px;margin:0 auto;background:#fff;border-radius:50%;left:50%;transform:translate(-50%,0); }
#portada .beneficios .titulo .container .circulo .borde{ position:absolute;top:0;width:93.03%;height:93.03%;margin:auto;border-radius:50%;top:calc(50% - 5px);left:50%;transform:translate(-50%,-50%);border:31px solid #E4001E;padding:0 30px; }
#portada .beneficios .titulo .container .circulo .borde h2{ position:absolute;top:135px;left:0;text-align:center;width:100%;z-index:1; }
#portada .beneficios .cuerpo .container{ max-width:1688px;padding:72px 15px 11px;text-align:center; }
#portada .beneficios .cuerpo .container ul li{ display:inline-block;width:25%;margin:0 0 78px;vertical-align:middle; }
#portada .beneficios .cuerpo .container ul li .tbl{ background:#DADADA;width:308px;height:326px;text-align:center;margin:0 auto; }
#portada .beneficios .cuerpo .container ul li .tbl > div{ font-size:25px;line-height:30px;padding:0 30px; }
#portada .caracteristicas .container{ max-width:1566px;padding-top:56px;padding-bottom:55px;background:#F9F9F9; }
#portada .caracteristicas .container h2{ margin:0 0 43px; }
#portada .caracteristicas .container .tbl{ width:100%; }
#portada .caracteristicas .container .tbl > div{ vertical-align:top; }
#portada .caracteristicas .container .tbl > div:first-child{ width:42.91%; }
#portada .caracteristicas .container .tbl > div:last-child{ padding:15px 0 0 64px; }
#portada .caracteristicas .container .tbl > div .listado li{ min-height:112px; }
#portada .caracteristicas .container .tbl > div figure{ display:inline-block;vertical-align:middle;position:relative; }
#portada .caracteristicas .container .tbl > div figure:before{ content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(123,11,30,0.5); }
#portada .precios .container{ max-width:1566px;text-align:center;padding-top:54px; }
#portada .precios .container h2{ margin:0 0 36px }
#portada .precios .container h2 + p{ font-size:25px;line-height:30px;margin:0 0 67px; }
#portada .probar-demo{ height:495px;background-image:url(../img/portada/demo-intranetoptica.jpg);background-repeat:no-repeat;background-position:top center;-webkit-background-size:cover;background-size:cover;background-attachment:fixed;position:relative; }
#portada .probar-demo:before{ content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(123,11,30,0.5); }
#portada .probar-demo .container{ max-width:1404px;height:100%;position:relative; }
#portada .probar-demo .container > div{ width:405px;text-align:left;position:absolute;bottom:42px;left:15px; }
#portada .probar-demo .container > div *{ display:block; }
#portada .probar-demo .container > div span{ display:inline-block;font-size:71.18px;color:#fff;line-height:85px;padding:0 0 37px 9px;text-align:center; }
#portada .probar-demo .container > div a{ color:#DADADA;background:#BA0D2A;font-size:34.36px;padding:12px 0 15px;text-align:center; }
#portada .marcas{ border:9px solid #DADADA;border-left:0;border-right:0;padding-top:31px;padding-bottom:65px; }
#portada .marcas .container{ max-width:1950px;text-align:center; }
#portada .marcas .container h2{ display:inline-block;font-size:40px;color:#666666;line-height:1.1;position:relative;padding:0 0 6px;margin-bottom:37px; }
#portada .marcas .container h2:before{ content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%,0);background:#BA0D2A;width:100%;height:2px; }
#portada .marcas .container .slick-slide{ text-align:center; }
#portada .marcas .container .slick-slide img{ display:inline-block; }

/* Nosotros */

#nosotros h2{ margin-bottom:33px; }
#nosotros p{ font-size:25px;line-height:30px; }
#nosotros .banner{ background-image:url(../img/nosotros/nosotros-intranetoptica.jpg); }
#nosotros .descripcion .container{ max-width:1296px;padding-top:35px; }
#nosotros .descripcion .container p + p{ margin-top:24px; }
#nosotros .descripcion .container ul{ max-width:1476px;margin:38px auto 0;text-align:center; }
#nosotros .descripcion .container ul:after{content:"";display:block;clear:both;}
#nosotros .descripcion .container ul li{ margin-bottom:38px; }
#nosotros .descripcion .container ul li div{ display:block;max-width:372px;width:100%;margin:0 auto;background:#DADADA;padding:24px 29px 28px;min-height:394px; }
#nosotros .descripcion .container ul li div i{ margin-bottom:15px; }
#nosotros .descripcion .container ul li div h3{ font-size:30px;line-height:36px;min-height:72px;margin:0 auto 18px; }
#nosotros .descripcion .container ul li div h3 span{ display:block; }
#nosotros .descripcion .container ul li div p{ font-size:20px;line-height:24px; }
#nosotros .descripcion .container a{ display:block;font-size:35px;line-height:1.2;max-width:403.781px;width:100%;background:#BA0D2A;text-align:center;color:#DADADA;padding:6px 0 10px;margin:20px 0 48px 0; }
#nosotros .caracteristicas{ background:#F9F9F9; }
#nosotros .caracteristicas .container{ max-width:1296px;text-align:center;padding-top:44px; }
#nosotros .caracteristicas .container h2{ text-align:left;max-width:1578px;margin:0 auto 80px; }
#nosotros .caracteristicas .container ul{ overflow:hidden; }
#nosotros .caracteristicas .container ul li{ float:left;width:33.33333%;min-height:329px; }
#nosotros .caracteristicas .container ul li div{ display:block;max-width:413px;width:100%;margin:0 auto; }
#nosotros .caracteristicas .container ul li div i{ margin-bottom:44px; }
#nosotros .caracteristicas .container ul li div p span{ display:block; }

/* Características */

#caracteristicas .banner{ background-image:url(../img/caracteristicas/caracteristicas-intranetoptica.jpg); }
#caracteristicas .descripcion .container{ max-width:1296px;padding-top:35px;padding-bottom:39px; }
#caracteristicas .descripcion .container h2 + p{ font-size:25px;line-height:30px;margin:17px 0 0; }
#caracteristicas .descripcion .container ul:after{content:"";display:block;clear:both;}
#caracteristicas .descripcion .container ul li{ float:left;width:33.33333%;padding:38px 0 35px;text-align:center; }
#caracteristicas .descripcion .container ul li div{ display:inline-block;width:372px;height:394px;background:#DADADA;padding:132px 35px 0;position:relative; }
#caracteristicas .descripcion .container ul li div i{ position:absolute;top:17px;left:19px; }
#caracteristicas .descripcion .container ul li div h3{ font-size:30px;line-height:36px;min-height:72px;width:100%;margin:0 0 16px; }
#caracteristicas .descripcion .container ul li div p{ font-size:20px;line-height:24px; }

/* Demo */

#demo{ padding-bottom:212px; }
#demo h2{ line-height:1.2; }
#demo p{ font-size:25px;line-height:1.2;text-align:justify;margin:44px auto 0;max-width:757.419px; }
#demo p + a{ display:inline-block;background:#BA0D2A;color:#DADADA;font-size:34.36px;padding:12px 0 15px;max-width:477px;width:100%;text-align:center;margin:73px 0 82px; }
#demo > .container{ max-width:1920px;padding-top:54px;padding-bottom:58px; }
#demo > .container > div{ position:relative; }
#demo > .container > div > img{ margin-top:44px; }
#demo > .container > div > .right{ padding-top:31px;position:relative;text-align:center; }
#demo > .container > div > .right > div{ padding-left:775px; }
#demo > .container > div > .right h2{ margin:0 0 14px; }
#demo > .container > div > .right .video{ display:inline-block;vertical-align:middle;margin:6px 0 0;position:relative;padding:9.239% 0 0; }
#demo > .container > div > .right .video > div{ position:absolute;top:0;text-align:center;width:66.2%;left:50%;transform:translate(-50%,0); }
#demo > .container > div > .right .video > a{ display:inline-block;vertical-align:middle;position:relative; }
#demo > .area-soporte{ background:#F9F9F9;text-align:center; }
#demo > .area-soporte .container{ max-width:1676px;overflow:hidden; }
#demo > .area-soporte .container .tbl{ max-width:1595px;width:100%; }
#demo > .area-soporte .container .tbl > div{ vertical-align:top; }
#demo > .area-soporte .container .tbl .left{ padding-top:56px;padding-right:20px;width:481px;text-align:left; }
#demo > .area-soporte .container .tbl .left h2{ font-size:35px;margin:0 auto;max-width:300px;text-align:center; }
#demo > .area-soporte .container .tbl .left p + a{ margin:106px 0 118px 4px;max-width:404px; }
#demo > .area-soporte .container .tbl .left img{ margin:0 0 0 10px; }
#demo > .area-soporte .container .tbl .right{ text-align:right; }
#demo > .area-soporte .container .tbl .right img{ position:relative;top:-1px; }

/* precios */

#precios .banner{ background-image:url(../img/precios/precios-intranetoptica.jpg); }
#precios .descripcion .container{ text-align:center;padding-top:35px; }
#precios .descripcion .container h2{ margin-bottom:68px; }
#precios .descripcion .container .subtitulo{ margin-bottom:121px; }
#precios .descripcion .container .listado-precios li{ margin-bottom:46px; }
#precios .incluye{ background:#F9F9F9; }
#precios .incluye .container{ text-align:center;padding-top:22px;padding-bottom:9px;max-width:1668px; }
#precios .incluye .container ul{padding:58px 0 0 0;}
#precios .incluye .container ul:after{content:"";display:block;clear:both;}
#precios .incluye .container ul li{ float:left;width:25%;padding-bottom:40px; }
#precios .incluye .container ul li > div{ display:inline-block;max-width:285px;width:100%;margin:0 auto; }
#precios .incluye .container ul li > div span{ display:block;font-size:25px;padding:20px 0 0;line-height:30px; }
#precios .consideraciones .container{ padding-top:46px;max-width:1214px; }
#precios .consideraciones .container .listado{ padding-top:37px; }
#precios .consideraciones .container .listado li{ max-width:inherit;padding:1px 0 47px 56px;text-align:justify;max-width:1016px; }
#precios .consideraciones .container .listado li:last-child{ padding-bottom:38px; }
#precios .metodos-pago .container{ max-width:1266px;padding-top:45px;padding-bottom:31px; }
#precios .metodos-pago .container h3{ font-size:25px;color:#666666;margin:0 0 20px; }
#precios .metodos-pago .container i + i{ margin-left:4px;margin-bottom:8px; }

/* Plan */

#plan .container{ text-align:center;padding-top:191px;max-width:1206px; }
#plan .container form{ border:1px solid #D4D4D3;border-width:1px 2px;margin:96px 0 176px;padding-top:12px; }
#plan .container form .pasos{ position:relative;display:table;vertical-align:middle;max-width:1106px;width:100%;margin:0 auto 40px; }
#plan .container form .pasos:before{ content:"";position:absolute;top:35px;left:0;width:100%;height:4px;background:#E4001E; }
#plan .container form .pasos > *{ display:table-cell;vertical-align:top;text-align:center;width:33.33333%; }
#plan .container form .pasos > *:first-child{ text-align:left; }
#plan .container form .pasos > *:last-child{ text-align:right; }
#plan .container form .pasos > * .paso{ position:relative;display:inline-block;vertical-align:top;background:#fff; }
#plan .container form .pasos > * .paso > span{ width:218px;position:relative;display:inline-block;vertical-align:middle;padding:42px 0 0;text-align:center; }
#plan .container form .pasos > * .paso > span .nro{ display:table;position:absolute;top:0;left:50%;transform:translate(-50%,0);width:83px;height:84px;border:4px solid #E4001E;border-radius:50%;text-align:center; }
#plan .container form .pasos > * .paso > span .nro span{ display:table-cell;vertical-align:top;font-size:30px;color:#BA0D2A;padding:13px 0 0; }
#plan .container form .pasos > * .paso > span > span:not(.nro){ display:block;background:#fff;line-height:1.1;font-family:'montserratregular';font-size:20px;color:#666666;position:relative;z-index:1;padding:12px 0; }
#plan .container form .pasos > *.active .paso > span .nro{ background:#E4001E; }
#plan .container form .pasos > *.active .paso > span .nro span{ color:#DADADA; }
#plan .container form .pasos ~ div:not(.active){ display:none; }
#plan .container form .gray-btn{ cursor:pointer;display:inline-block;line-height:1.2;border-radius:0;border:0;width:100%;font-size:23px;color:#fff;background:#C6C6C5;max-width:309px;padding:3px 0; }
#plan .container form .form-group{ margin-left:auto;margin-right:auto;padding:0 15px; }
#plan .container form .form-group .input-group{ position:relative; }
#plan .container form .form-group .input-group label.error:not(:empty){ font-family:'montserratregular';color:#ff0000;font-size:13px !important;position:absolute;top:100%;background:#ff0000;color:#fff;padding:5px 10px 3px;border-radius:6px;right:0;z-index:1; }
#plan .container form .form-group .input-group label.error:not(:empty):before{ content:"";background:url(../img/iconos.png) -440px -167px no-repeat;position:absolute;width:12px;height:5px;top:-5px;right:5px; }
#plan .container form .datos-empresa .form-group:not(:nth-child(4)),
#plan .container form .form-group:first-child{ display:flex;align-items:center;justify-content:space-between;margin-bottom:63px; }
#plan .container form .form-group label:not(.error){ display:block;line-height:1.1;font-size:23px;color:#666666;text-align:left;margin:0 0 11px; }
#plan .container form .form-group input[type="text"],
#plan .container form .form-group select{ font-size:20px;border:1px solid #C6C6C5;outline:0;color:#808080;padding:3px 18px 5px; }
#plan .container form .form-group input[type="text"]{ background:#fff;padding-top:7px;padding-bottom:4px; }
#plan .container form .form-group .select{ position:relative; }
#plan .container form .form-group .select > div{ position:absolute;top:1px;right:1px;width:50px;height:calc(100% - 2px);background:#fff;pointer-events:none;padding-top:9px; }
#plan .container form .form-group .pague-aqui{ border:1px solid #C6C6C5;padding:74px 15px 46px;margin:0 0 131px; }
#plan .container form .form-group .pague-aqui div{ padding:0 0 66px; }
#plan .container form .form-group .pague-aqui div i{ margin-bottom:9px; }
#plan .container form .form-group .pague-aqui div i + i{ margin-left:9px; }
#plan .container form .datos-empresa small{ display:block;font-family:'montserratmediumitalic';font-size:20px;line-height:1.2;text-align:left;margin:0 0 32px;color:#666666;padding:0; }
#plan .container form .datos-empresa .enlace{ color:#0D6EFD;position:relative; }
#plan .container form .datos-empresa .enlace:before{ content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:#0D6EFD; }
#plan .container form .datos-empresa .form-group{ max-width:1087px; }
#plan .container form .datos-empresa .form-group:nth-child(3){ margin-bottom:23px; }
#plan .container form .datos-empresa .form-group input[type="text"],
#plan .container form .datos-empresa .form-group select,
#plan .container form .datos-empresa .form-group .archivo .uploaded-file{ width:441px; }
#plan .container form .datos-empresa .form-group .archivo .uploaded-file{ font-size:23px;line-height:1.2;color:#fff;border-radius:0;background:#C6C6C5;border:0;max-width:inherit;padding:6px 11px 3px;margin:0;text-overflow:ellipsis;overflow:hidden; }
#plan .container form .datos-empresa .form-check{ text-align:left;padding-left:34px;margin-bottom:8px; }
#plan .container form .datos-empresa .form-check + label.error:not(:empty){ text-align:left;color:#ff0000; }
#plan .container form .datos-empresa .form-check-input{ width:15px;height:15px;border-color:#C2C2C2;border-radius:3px;margin-left:-34px;margin-top:4px; }
#plan .container form .datos-empresa .form-check-input~.form-check-label{ font-size:20px; }
#plan .container form .datos-empresa > button{ font-size:30px;color:#DADADA;background:#BA0D2A;max-width:318.387px;padding:5px 0;margin:47px 0 32px; }
#plan .container form .metodo-pago .form-group{ max-width:967px; }
#plan .container form .metodo-pago .form-group input[type="text"],
#plan .container form .metodo-pago .form-group select{ width:357px; }
#plan .container form .finalizar{ padding:30px 99px 190px; }
#plan .container form .finalizar ul li span{ display:block;color:#666666;font-size:23px;line-height:1.22;padding:0 0 22px; }
#plan .container form .finalizar ul li span:not(:first-child){ font-family:'montserratitalic';font-size:22px;padding-bottom:11px; }
#plan .container form .finalizar ul li{ position:relative;text-align:left;padding:14px 0 0 52px;margin:0 0 20px; }
#plan .container form .finalizar ul li:before{ content:"";position:absolute;top:0;left:0;width:42px;height:42px;background:url(../img/iconos.png) -440px -113px no-repeat; }
#plan .container form .finalizar ul li a{ margin:22px 0 0;text-align:center; }
#plan .container h2 + span{ display:block;font-size:30px;line-height:1.2;color:#666666;margin:40px 0 62px; }
#plan .container > ul{ display:table;max-width:1028px;width:100%;margin:0 auto 74px; }
#plan .container > ul li{ display:table-cell;vertical-align:middle;padding-bottom:40px; }
#plan .container > ul li > div{ display:inline-block;max-width:236px;width:100%;text-align:center; }
#plan .container > ul li > div i{ margin:0 0 49px; }
#plan .container > ul li > div a{ display:block;font-size:20px;color:#DADADA;background:#BA0D2A;line-height:1.2;padding:4px 0 6px; }

/* Elige medio de pago */

.elegir-medio-pago-blocker{ background:rgba(102,102,102,0.5); }
#elegir-medio-pago{ background:#DADADA;max-width:502px;padding:33px 34px 51px; }
#elegir-medio-pago form span{ display:block;font-size:23px;color:#666666;margin:0 0 64px;text-align:center; }
#elegir-medio-pago form .form-group > div:last-child{ padding:30px 42px 32px; }

#culqi-js + .swal-overlay{ z-index:999999999999;background-color:transparent; }

/* Error */

html.error,html.error body,html.error body .tbl{ height:100%;text-align:center; }
html.error body .tbl{ width:100%; }
html.error body .tbl *{ position:relative; }
html.error body .tbl span{ display:block;font-size:35px;margin:30px 0 15px; }
html.error body .tbl p{ font-size:18px; }
html.error body .tbl a{ display:inline-block;margin:25px 0 0;font-size:15px;text-align:center;background:#BA0D2A;color:#fff;line-height:18px;padding:15px 0 15px;border-radius:5px;width:300px; }

footer{ font-family:montserratregular,fangsong;background-color:#0D0D19;background-image:url(../img/footer-intranetoptica.jpg);background-repeat:no-repeat;background-position:center center;position:relative;color:#fff;padding:0 15px; }
footer:before{ content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(186,13,42,0.5); }
footer .container{ position:relative;z-index:1;overflow:hidden;padding-top:110px;padding-bottom:69px;max-width:1730px; }
footer .container h2{ color:#fff; }
footer .container ul li{ display:block; }
footer .container .tbl{ width:100%; }
footer .container .tbl > div{ vertical-align:top; }
footer .container .tbl > div > div{ display:inline-block;vertical-align:top; }
footer .container .tbl .left{ width:39%;text-align:center; }
footer .container .tbl .left .logo{ padding:15px 0 0 0; }
footer .container .tbl .left .logo a{ display:inline-block;vertical-align:middle; }
footer .container .tbl .left .redes-sociales{ display:inline-block;border-top:1px solid #E4001E;max-width:336px;width:100%;margin:75px 0 0;padding:7px 0 0 28px;text-align:left; }
footer .container .tbl .left .redes-sociales a{ display:inline-block; }
footer .container .tbl .left .redes-sociales a + a{ margin-left:20px; }
footer .container .tbl .right{ text-align:right; }
footer .container .tbl .right *{ text-align:left; }
footer .container .tbl .right .informacion ul li a:after,
footer .container .tbl .right .atencion ul li > a:after{ position:absolute;bottom:-5px;left:0;display:block;content:"";height:1px;width:0%;-webkit-transition:width .5s ease;-moz-transition:width .5s ease;-ms-transition:width .5s ease;transition:width .5s ease;background-color:#E4001E; }
footer .container .tbl .right .informacion ul li a:not(.active):hover:after,
footer .container .tbl .right .informacion ul li a.active:after,
footer .container .tbl .right .atencion ul li > a:hover:after{ width:100%; }
footer .container .tbl .right .informacion ul li a,
footer .container .tbl .right .atencion ul li > *:not(i){ font-size:18px;position:relative; }
footer .container .tbl .right .informacion h2{ margin:0 0 19px; }
footer .container .tbl .right .informacion ul li + li{ margin:27px 0 0; }
footer .container .tbl .right .atencion{ padding:0 0 0 11.22%; }
footer .container .tbl .right .atencion h2{ margin:0 0 17px; }
footer .container .tbl .right .atencion ul li{ position:relative;padding:0 0 0 32px; }
footer .container .tbl .right .atencion ul li i{ position:absolute;top:0;left:0; }
footer .container .tbl .right .atencion ul li:nth-child(1) i{ top:1px; }
footer .container .tbl .right .atencion ul li:nth-child(2) i{ top:-3px; }
footer .container .tbl .right .atencion ul li:nth-child(3) i{ top:2px; }
footer .container .tbl .right .atencion ul li > *:not(i){ display:inline-block;vertical-align:middle;line-height:21px; }
footer .container .tbl .right .atencion ul li + li{ margin-top:24px; }
footer .container .tbl .right .aceptamos{ padding:0 0 0 11.54%; }
footer .container .tbl .right .aceptamos h2{ margin-bottom:19px; }
footer .container .tbl .right .aceptamos i + i{ margin-left:5px; }

@media all and (max-width:1760px){
  footer{ background-position:left -158px center; }
  footer .container .tbl .left{ width:622px; }
  footer .container .tbl .right > *{ padding-left:5% !important; }
}
@media all and (max-width:1700px){
  #portada .servicios .container > span:first-child{ left:0; }
  #portada .servicios .container > span:last-child{ right:0; }
}
@media all and (max-width:1630px){
  #demo > .container > div > img{ width:80% }
  #demo > .container > div > .right > div{ padding-left:50%; }
}
@media all and (max-width:1600px){
  header .container .tbl > div nav > ul > li:last-child > a + ul{ left:inherit;right:0; }
  #portada .servicios .container{ overflow:hidden; }
  #portada .servicios .container > span:first-child{ left:-170px; }
  #portada .servicios .container > span:last-child{ right:-170px; }
}
@media all and (max-width:1520px){
  header .container .tbl > div nav{ padding-right:0; }
}
@media all and (max-width:1500px){
  footer .container .tbl .right > *{ padding-left:0 !important; }
  footer .container .tbl .right .informacion,
  footer .container .tbl .right .atencion{ width:50%; }
  footer .container .tbl .right .aceptamos{ width:100%;padding-top:30px; }
  footer .container .tbl > div{ vertical-align:middle; }
}
@media all and (max-width:1480px){
  header .container .tbl > div nav > ul > li{ margin:0 15px; }
}
@media all and (max-width:1400px){
  #portada .caracteristicas .container .tbl > div:first-child{ width:50%; }
  #portada .caracteristicas .container .tbl > div .listado li{ min-height:inherit; }
  #portada .caracteristicas .container .tbl > div .listado li + li{ margin-top:30px; }
  #portada .caracteristicas .container .tbl > div:last-child{ padding-left:30px; }
}
@media all and (max-width:1385px) and (min-width:1051px){
  #demo > .container > div > .right > div > a{ margin-bottom:0; }
}
@media all and (max-width:1385px){
  #demo > .container > div > .right > div:last-child{ padding:12% 0 0; }
}
@media all and (max-width:1360px){
  header .container .tbl > div:first-child{ width:300px; }
  header .container .tbl > div .logo{ padding:0 15px; }
  header .container .tbl > div .logo a img{ width:100%; }
  header .container .tbl > div nav{ padding-left:20px;padding-right:20px; }
  header .container .tbl > div nav > ul{ display:flex;justify-content:space-between; }
  header .container .tbl > div nav > ul > li{ margin:0; }
  header .container .tbl > div nav > ul > li > a + ul{ top:28px; }
  #nosotros .caracteristicas .container h2{ text-align:center; }
  #portada .beneficios .cuerpo .container ul li{ width:33.33333%; }
  #nosotros .caracteristicas .container ul li{ width:50%; }
  #demo > .area-soporte .container .tbl .left p + a{ margin:50px 0 70px; }
  #demo > .area-soporte .container .tbl .left img{ margin-left:0; }
}
@media all and (max-width:1358px){
  #portada .servicios .container > ul li span{ font-size:25px; }
  #portada .servicios .container > ul li + li{ margin-left:4%; }
}
@media all and (max-width:1340px){
  footer .container .tbl .right .informacion{ width:45%; }
  footer .container .tbl .right .atencion{ width:55%; }
}
@media all and (min-width:1301px){
  #nosotros h2,
  #nosotros h2 ~ p{  padding:0 25px; }
  #nosotros .descripcion .container a{ margin-left:25px; }
}
@media all and (max-width:1250px) and (min-width:1051px){
  #demo > .area-soporte .container .tbl .left{ width:350px; }
  #demo > .area-soporte .container .tbl .left p{ text-align:left; }
  #demo > .area-soporte .container .tbl .left p + a{ font-size:25px; }
}
@media all and (max-width:1250px){
  footer{ background-position:left -10% center;-webkit-background-size:cover;background-size:cover; }
  footer .container{ padding:30px 0 0; }
  footer .container .tbl .left{ width:100%; }
  footer .container .tbl,
  footer .container .tbl > *{ display:block; }
  footer .container .tbl .left .logo{ display:block; }
  footer .container .tbl .right{ padding:40px 0 30px; }
  footer .container .tbl .right *{ text-align:center; }
  footer .container .tbl .right > div{ width:33.33333% !important; }
  footer .container .tbl .right .atencion ul{ display:inline-block; }
  footer .container .tbl .right .atencion ul *{ text-align:left; }
  footer .container .tbl .right .aceptamos{ padding-top:0; }
  footer .container .tbl .left .redes-sociales{ text-align:center;padding:20px 0 0;margin:30px 0 0; }
}
@media all and (max-width:1245px) and (min-width:771px){
  #caracteristicas .descripcion .container ul li{ width:50%; }
  #caracteristicas .descripcion .container ul li div{ width:90%; }
}
@media all and (min-width:1241px){
  .contactanos .container > div .datos{ padding-right:20px; }
}
@media all and (max-width:1240px){
  .contactanos .container > div{ padding:243px 12px 0 0; }
  .contactanos .container > div .datos{ width:100%;padding-bottom:0; }
  .contactanos .container > div .datos ul{ text-align:center; }
  .contactanos .container > div .datos ul li{ display:inline-block;text-align:left;vertical-align:top;margin-bottom:66px; }
  .contactanos .container > div .datos ul li > p span{display:block;}
  .contactanos .container > div .datos ul li > p span + span{margin-top:5px;}
  .contactanos .container > div .datos ul li > p span:nth-child(2){display:none;}
  .contactanos .container > div .datos ul li + li{ margin-left:50px;margin-top:0; }
  .contactanos .container > div form{ padding:170px 41px 75px 41px; }
  .contactanos .container > div form .form-group.w-flex .input-group:not(:nth-child(1)){ width:auto;flex:1; }
}
@media all and (min-width:1221px){
  #nosotros .descripcion .container ul li{ float:left;width:33.33333%; }
}
@media all and (max-width:1220px) and (min-width:841px){
  #nosotros .descripcion .container{ margin-bottom:18px; }
  #nosotros .descripcion .container ul li{ margin-bottom:50px; }
  #nosotros .descripcion .container ul li div{ max-width:inherit;min-height:inherit;padding-bottom:24px; }
  #nosotros .descripcion .container ul li div:after{content:"";display:block;clear:both;}
  #nosotros .descripcion .container ul li div figure{ float:left;padding:0 30px 0 0; }
  #nosotros .descripcion .container ul li div figure > *{ float:left; }
  #nosotros .descripcion .container ul li div figure i{ margin-bottom:0; }
  #nosotros .descripcion .container ul li div figure figcaption{ width:230px;padding:24px 20px 0 0; }
  #nosotros .descripcion .container ul li div figure h3{ margin-bottom:0; }
  #nosotros .descripcion .container ul li div figure h3 span{ display:inline-block; }
  #nosotros .descripcion .container ul li div p{ overflow:hidden;text-align:left; }
}
@media all and (max-width:1144px){
  #portada .caracteristicas .container .tbl > div,
  #portada .caracteristicas .container .tbl > div{ display:block;width:100% !important;text-align:center; }
  #portada .caracteristicas .container .tbl > div:last-child{ padding-left:0; }
  #portada .caracteristicas .container .tbl > div .listado{ display:inline-block;text-align:left; }
  #portada .caracteristicas .container .tbl > div .listado li{ max-width:100%; }
  #portada .caracteristicas .container .tbl > div h2{ margin-top:40px; }
}
@media all and (max-width:1190px){
  #precios .incluye .container ul li{ width:50%; }
}
@media all and (max-width:1120px){
  #portada .contamos .container .recursos img{ opacity:0.1;left:50%; }
}
@media all and (max-width:1130px){
  #precios .subtitulo{ font-size:30px;line-height:1.2; }
  #precios .descripcion .container h2{ margin-bottom:30px; }
  #precios .descripcion .container .subtitulo{ margin-bottom:40px; }
}
@media all and (max-width:1130px) and (min-width:1051px){
  #demo > .area-soporte .container .tbl .left{ padding-top:40px; }
  #demo > .area-soporte .container .tbl .left p{ margin-top:30px; }
  #demo > .area-soporte .container .tbl .left p + a{ margin:40px 0; }
}
@media all and (max-width:1110px){
  header .container .tbl > div nav > ul > li > a{ font-size:20px; }
  header .container .tbl > div nav > ul > li > a + ul{ top:21px; }
  #portada .beneficios .cuerpo .container ul li{ width:50%; }
}
@media all and (min-width:1081px){
  .listado-precios li .tbl{ margin:31px auto 91px; }
  .listado-precios li .tbl > div{ padding-left:25px;padding-right:25px;padding-bottom:38px; }
  .listado-precios li .tbl > div div{ font-size:15px;padding:4px 0 0; }
  .listado-precios li a{ margin-bottom:12px; }
}
@media all and (max-width:1080px){
  .listado-precios li{ width:100%; }
  .listado-precios li > span{ padding-bottom:30px; }
  .listado-precios li h3 span{ display:inline-block; }
  .listado-precios li h3 span + span{ margin-left:5px; }
  .listado-precios li .tbl{ margin-top:30px;margin-bottom:30px; }
  .listado-precios li .tbl > div{ padding-bottom:12px; }
}
@media all and (min-width:1051px){
  #demo > .container > div > img{ position:absolute;top:0;left:-53px; }
}
@media all and (max-width:1050px){
  #demo p{ max-width:inherit; }
  #demo > .container{ padding-bottom:0; }
  #demo > .container > div{ text-align:center;overflow:hidden; }
  #demo > .container > div > img{ position:relative;left:calc(50% + 160px);margin-right:5%;width:auto;max-width:inherit;transform:translate(-50%,0); }
  #demo > .container > div > .right{ text-align:center;padding-top:0;top:-70px; }
  #demo > .container > div > .right > div{ padding-left:0; }
  #demo > .container > div > .right > div:first-child{ display:inline-block; }
  #demo > .container > div > .right > div:last-child{ padding-top:0; }
  #demo > .container > div > .right .video{ padding-top:15%; }
  #demo > .area-soporte .container .tbl,
  #demo > .area-soporte .container .tbl > div{ display:block; }
  #demo > .area-soporte .container .tbl > div{ padding-bottom:50px; }
  #demo > .area-soporte .container .tbl .left{ width:100%;text-align:center; }
}
@media all and (max-width:1000px){
  .contactanos .container > div .datos ul li > p span,
  .contactanos .container > div .datos ul li > p span:nth-child(2){ display:inline-block; }
  .contactanos .container > div .datos ul li > p span:nth-child(2){ margin:0 5px; }
  .contactanos .container > div .datos ul li > p span + span{ margin-top:0; }
  .contactanos .container > div form{ padding-top:280px; }
}
@media all and (max-width:990px){
  #portada .servicios .container > ul li span{ font-size:20px; }
}
@media all and (max-width:978px){
  #plan .container form .datos-empresa .form-group .input-group{ flex:1; }
  #plan .container form .datos-empresa .form-group .input-group + .input-group{ margin-left:15px; }
  #plan .container form .datos-empresa .form-group input[type="text"],
  #plan .container form .datos-empresa .form-group select,
  #plan .container form .datos-empresa .form-group .archivo .uploaded-file{ width:100%; }
}
@media all and (max-width:930px){
  #nosotros .caracteristicas .container{ padding-bottom:80px; }
  #nosotros .caracteristicas .container ul li{ width:100%;min-height:inherit; }
  #nosotros .caracteristicas .container ul li + li{ margin-top:60px; }
  #nosotros .caracteristicas .container ul li div{ max-width:inherit; }
}
@media all and (min-width:901px){
  header .franja{ position:absolute;width:50%;top:0;right:0;background:#BA0D2A;height:100%; }
  header .container .tbl > div .logo{ position:absolute;text-align:center;width:100%;top:12px;left:0; }
  header .container .tbl > div .contenedor-menu-icon{ display:none; }
  header .container .tbl > div nav{ background:#BA0D2A; }
}
@media all and (max-width:900px){
  header .container .tbl{ margin:12px 0 0; }
  header .container .tbl > div{ vertical-align:middle;padding:0 15px; }
  header .container .tbl > div:first-child{ width:auto; }
  header .container .tbl > div:last-child{ text-align:right; }
  header .container .tbl > div .contenedor-menu-icon{ display:inline-block;background:#BA0D2A;padding:20px; }
  header .container .tbl > div .contenedor-menu-icon .menu-icon{ display:inline-block;vertical-align:middle; }
  header .container .tbl > div .contenedor-menu-icon + nav{ display:none; }
  header .container .tbl > div .logo{ padding:0; }
  header .container .tbl > div nav > ul{ flex-direction:column; }
  #portada .banner .container .subcontainer > img{ display:none; }
}
@media all and (max-width:845px){
  #portada .servicios .container > ul li{ display:block; }
  #portada .servicios .container > ul li span{ font-size:30px; }
  #portada .servicios .container > ul li + li{ margin-left:0; }
  footer{ background-position:left 13% center; }
  footer .container .tbl .right > div{ width:100% !important; }
  footer .container .tbl .right > .atencion{ padding:40px 0; }
}
@media all and (max-width:840px){
  #nosotros .descripcion .container ul li div h3{ min-height:inherit; }
  #nosotros .descripcion .container ul li div{ max-width:inherit;min-height:inherit;padding-top:40px;padding-bottom:40px; }
  #nosotros .descripcion .container a{ margin-left:auto;margin-right:auto; }
}
@media all and (max-width:810px){
  #plan .container form{ border-width:1px;padding-left:15px;padding-right:15px; }
  #plan .container form .pasos{ max-width:1023px; }
  #plan .container form .pasos > * .paso{ padding-left:20px;padding-right:20px; }
  #plan .container form .pasos > * .paso > span{ width:100px; }
  #plan .container form .pasos > *:first-child .paso{ padding-left:0;padding-right:20px; }
  #plan .container form .pasos > *:last-child .paso{ padding-left:20px;padding-right:0; }
  #plan .container form .form-group{ padding:0; }
  #plan .container form .form-group .input-group{ flex:1; }
  #plan .container form .form-group .input-group + .input-group{ margin-left:15px; }
  #plan .container form .form-group input[type="text"],
  #plan .container form .form-group select{ width:100% !important; }
  #plan .container form .datos-empresa .form-group{ flex-direction:column;margin-bottom:20px !important; }
  #plan .container form .datos-empresa .form-group .input-group{ width:100%; }
  #plan .container form .datos-empresa .form-group .input-group + .input-group{ margin:20px 0 0; }
}
@media all and (max-width:810px) and (min-width:501px){
  #plan .container > ul li > div{ width:140px; }
}
@media all and (min-width:801px){
  #nosotros .descripcion .container h2 ~ p{ text-align:justify; }
}
@media all and (min-width:866px){
  #caracteristicas .descripcion .container h2,
  #caracteristicas .descripcion .container h2 + p{ padding:0 25px; }
  #caracteristicas .descripcion .container ul li:last-child div{ padding-left:20px;padding-right:20px; }
}
@media all and (max-width:865px){
  #caracteristicas .descripcion .container{ padding-bottom:70px; }
  #caracteristicas .descripcion .container ul li{ width:100%;padding-bottom:10px; }
  #caracteristicas .descripcion .container ul li div{ width:100%;height:inherit;padding-bottom:50px; }
  #caracteristicas .descripcion .container ul li div h3{ min-height:inherit; }
}
@media all and (max-width:750px){
  #portada .beneficios .cuerpo .container{ padding-bottom:39px; }
  #portada .beneficios .cuerpo .container ul li{ width:100%;margin-bottom:50px; }
  #portada .beneficios .cuerpo .container ul li .tbl{ width:100%;height:auto;padding:40px 15px; }
}
@media all and (max-width:725px){
  #demo > .container{ padding-bottom:70px; }
  #demo > .container > div > img{ width:900px;left:calc(50% + 130px); }
  #demo > .container > div > .right{ top:0; }
}
@media all and (min-width:721px){
  .contactanos .container > div form .form-group.w-flex{ display:flex; }
  .contactanos .container > div form .form-group.w-flex .input-group:nth-child(1){ flex:1;margin-right:30px; }
  .contactanos .container > div form .form-group.w-flex .input-group:not(:nth-child(1)){ width:346px; }
}
@media all and (max-width:720px){
  .contactanos .container > div .datos ul{ text-align:left; }
  .contactanos .container > div .datos ul li{ display:block;text-align:left;margin-bottom:50px; }
  .contactanos .container > div .datos ul li + li{ margin-left:0; }
  .contactanos .container > div .datos ul li > p span{ display:block; }
  .contactanos .container > div .datos ul li > p span:nth-child(2){ display:none; }
  .contactanos .container > div .datos ul li > p span + span{ margin-top:10px; }
  .contactanos .container > div form{ padding-top:380px; }
  .contactanos .container > div form .form-group .input-group + .input-group{ margin-top:34px; }
}
@media all and (max-width:690px){
  .listado-precios li h3 span{ display:block; }
  .listado-precios li h3 span + span{ margin-left:0; }
}
@media all and (min-width:661px){
  .show-660{ display:none !important; }
}
@media all and (max-width:660px){
  .hide-660{ display:none !important; }
  #portada .contamos .container{ padding-bottom:50px; }
  #portada .contamos .container h2{ margin-bottom:70px; }
  #portada .contamos .container .recursos ul{ display:inline-block;float:none !important; }
  #portada .contamos .container .recursos ul li{ margin-bottom:50px !important;text-align:center; }
  #portada .contamos .container .recursos ul li span{ display:block;margin:20px 0 0; }
  #portada .contamos .container .recursos img{ top:50%;transform:translate(-50%,-50%); }
}
@media all and (max-width:645px){
  #precios .incluye .container ul li{ width:100%; }
}
@media all and (max-width:535px){
  #demo > .container > div > img{ width:800px;left:calc(50% + 120px); }
}
@media all and (max-width:510px){
  .listado-precios li h3{ font-size:20px; }
  .listado-precios li > span{ font-size:17px;padding-bottom:20px; }
  .listado-precios li .tbl > div{ padding-left:20px;padding-right:20px; }
  .listado-precios li .tbl > div span{ font-size:30px; }
}
@media all and (min-width:501px){
  #plan .container > ul li:first-child{ text-align:left; }
  #plan .container > ul li:last-child{ text-align:right; }
  #plan .container > ul li{ width:33.33333%; }
}
@media all and (max-width:500px){
  #portada .servicios .container > ul li span{ font-size:20px; }
  #portada .probar-demo .container > div{ width:100%;left:0;padding:0 15px; }
  #portada .probar-demo .container > div span{ display:block;padding-left:0;line-height:1.3; }
  #nosotros p{ font-size:20px; }
  #nosotros .descripcion .container ul li div p{ font-size:17px; }
  #nosotros .descripcion .container a{ font-size:20px; }
  #caracteristicas .descripcion .container h2,
  #caracteristicas .descripcion .container ul li div h3{ font-size:25px;line-height:30px; }
  #caracteristicas .descripcion .container h2 + p{ line-height:25px; }
  #caracteristicas .descripcion .container h2 + p,
  #caracteristicas .descripcion .container ul li div p{ font-size:17px; }
  #demo > .container > div > .right h2,
  #demo > .area-soporte .container .tbl .left h2{ font-size:25px; }
  #demo p{ font-size:17px; }
  #demo p + a{ font-size:20px;margin-top:40px; }
  #demo > .area-soporte .container .tbl .left p{ text-align:center;margin:30px 0 0; }
  #demo > .area-soporte .container .tbl .left p + a{ margin-top:30px; }
  #plan .container form{ padding-left:15px;padding-right:15px; }
  #plan .container form .pasos > * .paso{ padding-left:5px;padding-right:5px; }
  #plan .container form .pasos > *:first-child .paso{ padding-left:0;padding-right:5px; }
  #plan .container form .pasos > *:last-child .paso{ padding-left:5px;padding-right:0; }
  #plan .container form .metodo-pago .form-group{ flex-direction:column; }
  #plan .container form .metodo-pago .form-group .input-group{ width:100%; }
  #plan .container form .metodo-pago .form-group .input-group + .input-group{ margin:20px 0 0; }
  #plan .container > ul,
  #plan .container > ul li{ display:block; }
}
@media all and (max-width:490px){
  .contactanos .container > div .datos ul li > span{ font-size:20px; }
  .contactanos .container > div .datos ul li > p{ font-size:15px;margin-top:15px; }
  .contactanos .container > div form{ padding-top:300px;padding-left:15px;padding-right:15px; }
}
@media all and (max-width:455px){
  #demo > .container > div > img{ width:700px;left:calc(50% + 110px); }
}
@media all and (max-width:430px){
  #portada .beneficios .titulo .container .circulo .borde h2{ max-width:300px;margin:0 auto;right:0;top:90px; }
  #portada .banner{ padding-top:40%; }
  #portada .banner .container .subcontainer .tbl{ padding-top:20px; }
  #portada .banner .container .subcontainer .tbl > div > .span-1{ font-size:20px; }
  #portada .banner .container .subcontainer .tbl > div > .span-2{ font-size:25px;margin:15px 0; }
  #portada .banner .container .subcontainer .tbl > div > .span-3{ font-size:25px; }
  #portada .banner .container .subcontainer .tbl > div > .span-4{ font-size:20px;margin:15px 0; }
  #portada .banner .container .subcontainer .tbl > div > p{ font-size:17px; }
  #portada .banner .container .subcontainer .tbl > div > .barra{ width:25px; }
  #portada .banner .container .subcontainer .tbl > div > .barra + .barra{ margin-left:10px; }
}
@media all and (max-width:420px){
  #portada .probar-demo .container > div span{ font-size:50px; }
}
@media all and (max-width:405px){
  .contenedor-menu-icon .menu-icon{ width:35px;height:20px;margin:0; }
  .contenedor-menu-icon.active .menu-icon::before{ transform:rotate(28deg);left:3px; }
  .contenedor-menu-icon.active .menu-icon::after{ transform:rotate(-28deg);left:3px; }
  header .container .tbl > div .contenedor-menu-icon{ padding:7px; }
  header .container .tbl > div nav > ul > li > a{ font-size:17px; }
  #demo > .container > div > img{ width:600px;left:calc(50% + 90px); }
}
@media all and (max-width:405px) and (min-width:321px){
  #plan .container form .pasos:before{ top:25px; }
  #plan .container form .pasos > * .paso{ padding-left:0;padding-right:0; }
  #plan .container form .pasos > * .paso > span{ width:84px;padding-top:30px; }
  #plan .container form .pasos > * .paso > span .nro{ width:60px;height:60px; }
  #plan .container form .pasos > * .paso > span .nro span{ font-size:17px; }
  #plan .container form .pasos > * .paso > span > span:not(.nro){ font-size:17px;padding:7px 0; }
  #plan .container form .pasos > *:first-child .paso{ padding-left:0;padding-right:0; }
  #plan .container form .pasos > *:last-child .paso{ padding-left:0;padding-right:0; }
}
@media all and (max-width:380px){
  .listado-precios li{ float:none !important; }
  .listado-precios li .tbl > div span{ font-size:25px; }
}
@media all and (max-width:350px){
  #demo > .container > div > img{ width:500px;left:calc(50% + 75px); }
  #plan .container form .metodo-pago .form-group .pague-aqui div i{ display:block;margin-left:auto !important;margin-right:auto !important; }
}
@media all and (max-width:330px){
  #demo p{ text-align:left; }
  footer .container .tbl .right .informacion ul li a, footer .container .tbl .right .atencion ul li > *:not(i){ font-size:15px; }
}
@media all and (max-width:320px){
  #plan .container form .pasos,
  #plan .container form .pasos > *{ display:block;width:100%;text-align:center !important; }
  #plan .container form .pasos > * + *{ padding-top:20px; }
  #plan .container form .pasos:before{ content:inherit; }
}
@media all and (max-width:300px){
  .listado-precios li a{ display:block;width:auto; }
  .listado-precios li .tbl{ margin-left:15px;margin-right:15px; }
  .listado-precios li .tbl,
  .listado-precios li .tbl > div{ display:block; }
  .listado-precios li .tbl > div h4{ margin-bottom:20px; }
  .listado-precios li .tbl > div:first-child{ border:0;border-bottom:2px solid #E4001E;padding-bottom:30px; }
  .listado-precios li .tbl > div:last-child{ border:0;border-top:2px solid #E4001E;padding-top:30px; }
  .contactanos .container{ padding-top:10px; }
  .contactanos .container > div{ padding-top:350px; }
  .contactanos .container > div .datos{ padding-top:40px;padding-left:15px;padding-right:15px; }
  .contactanos .container > div .datos h2{ font-size:20px; }
  .contactanos .container > div .datos ul li{ padding-left:0;text-align:center; }
  .contactanos .container > div .datos ul li > i{ position:relative;top:0;margin-bottom:15px; }
  .listado li{ font-size:20px; }
  #portada .beneficios .cuerpo .container ul li .tbl > div{ font-size:20px;padding:0; }
  #portada .precios .container h2 + p{ font-size:20px; }
  #portada .probar-demo .container > div span{ font-size:40px; }
  #caracteristicas .descripcion .container ul li div{ padding-left:15px;padding-right:15px; }
  #precios h2{ font-size:20px; }
  #precios .subtitulo{ font-size:25px; }
  #precios .incluye .container ul li > div span{ font-size:17px; }
  #precios .consideraciones .container .listado li{ font-size:17px; }
  #demo p + a{ font-size:17px; }
  #plan .container form .gray-btn{ font-size:17px !important;padding-top:7px !important;padding-bottom:7px !important; }
}
@media all and (max-width:295px){
  #demo > .container > div > img{ width:400px;left:calc(50% + 70px); }
}
/* ===== Banner dinámico de la portada ===== */
/* Capas: foto (0) · velo rojo (1) · luces y partículas (1) · contenido (2) · indicadores (3) */
#portada .banner{ z-index:0;isolation:isolate;overflow:hidden;background-attachment:scroll; }
#portada .banner:before{ z-index:1;background:linear-gradient(100deg,rgba(40,3,10,0.88) 0%,rgba(110,9,27,0.62) 45%,rgba(123,11,30,0.42) 100%); }
#portada .banner .slick-slider{ z-index:2; }
.banner-fx{ position:absolute;inset:0;overflow:hidden;pointer-events:none; }
.banner-fx .bfx-img{ position:absolute;inset:-4%;z-index:0;background:url(../img/portada/banner-intranetoptica.jpg) center left/cover no-repeat;transform-origin:30% 40%;
  animation:bfxZoom 26s ease-in-out infinite alternate;translate:calc(var(--mx,0) * -14px) calc(var(--my,0) * -10px);transition:translate .6s ease-out; }
@keyframes bfxZoom{ from{ transform:scale(1); } to{ transform:scale(1.13) rotate(0.6deg); } }
.banner-fx .bfx-glow{ position:absolute;z-index:1;border-radius:50%;filter:blur(70px);opacity:.5;mix-blend-mode:screen; }
.banner-fx .g1{ width:46vw;height:46vw;left:-12vw;top:30%;background:radial-gradient(circle,rgba(228,0,30,.75),transparent 65%);animation:bfxFlotar1 14s ease-in-out infinite alternate; }
.banner-fx .g2{ width:38vw;height:38vw;right:-8vw;top:-10%;background:radial-gradient(circle,rgba(255,90,110,.55),transparent 65%);animation:bfxFlotar2 18s ease-in-out infinite alternate; }
@keyframes bfxFlotar1{ to{ transform:translate(18vw,-14vh) scale(1.2); } }
@keyframes bfxFlotar2{ to{ transform:translate(-14vw,22vh) scale(.85); } }
.banner-fx .bfx-particulas{ position:absolute;inset:0;z-index:1;width:100%;height:100%; }

/* Frase que se escribe sola, con brillo */
#portada .banner .span-2 .rotador{ background:linear-gradient(90deg,#E4001E 0%,#ff5468 35%,#ffd0d6 50%,#ff5468 65%,#E4001E 100%);background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;animation:bannerBrillo 3.5s linear infinite;white-space:nowrap; }
@keyframes bannerBrillo{ from{ background-position:100% 0; } to{ background-position:-120% 0; } }
#portada .banner .span-2 .cursor{ display:inline-block;width:3px;height:.9em;margin-left:6px;vertical-align:-0.05em;background:#ff5468;animation:bannerCursor 1s steps(1) infinite; }
@keyframes bannerCursor{ 50%{ opacity:0; } }

/* Botones */
.banner-cta{ display:flex;flex-wrap:wrap;gap:14px;margin-top:38px; }
.btn-banner{ display:inline-flex;align-items:center;gap:10px;padding:15px 28px;border-radius:40px;border:2px solid rgba(255,255,255,.7);color:#fff;font-size:16px;line-height:1;letter-spacing:.3px;
  transition:transform .25s ease,background-color .25s ease,box-shadow .25s ease,border-color .25s ease; }
.btn-banner:hover{ transform:translateY(-3px);background:rgba(255,255,255,.12);border-color:#fff; }
.btn-banner.primario{ background:#E4001E;border-color:#E4001E;animation:bannerLatido 2.4s ease-out infinite; }
.btn-banner.primario:hover{ background:#ff1a37;border-color:#ff1a37; }
.btn-banner.primario::after{ content:"\2192";transition:transform .25s ease; }
.btn-banner.primario:hover::after{ transform:translateX(4px); }
@keyframes bannerLatido{ 0%{ box-shadow:0 0 0 0 rgba(228,0,30,.55); } 70%,100%{ box-shadow:0 0 0 16px rgba(228,0,30,0); } }

/* Barras con brillo, línea de tendencia y burbuja */
#portada .banner .tbl > .barras{ position:relative;translate:calc(var(--mx,0) * 12px) calc(var(--my,0) * 8px);transition:translate .6s ease-out; }
#portada .banner .tbl > div > .barra{ position:relative;overflow:hidden;border-radius:6px 6px 0 0;box-shadow:0 10px 30px rgba(0,0,0,.25); }
#portada .banner .tbl > div > .barra::after{ content:"";position:absolute;left:0;right:0;height:60%;bottom:-60%;background:linear-gradient(0deg,transparent,rgba(255,255,255,.55),transparent); }
#portada .banner .barras.lista > .barra::after{ animation:barraBrillo 3.2s ease-in-out infinite; }
#portada .banner .barras.lista > .barra-2::after{ animation-delay:.25s; }
#portada .banner .barras.lista > .barra-3::after{ animation-delay:.5s; }
#portada .banner .barras.lista > .barra-4::after{ animation-delay:.75s; }
#portada .banner .barras.lista > .barra-5::after{ animation-delay:1s; }
#portada .banner .barras.lista > .barra-6::after{ animation-delay:1.25s; }
@keyframes barraBrillo{ 0%{ bottom:-60%; } 60%,100%{ bottom:110%; } }
.barras .tendencia{ position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible;pointer-events:none; }
.barras .tendencia .ruta{ fill:none;stroke:none; }
.barras .tendencia .linea{ fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;filter:drop-shadow(0 0 6px rgba(255,255,255,.8));opacity:0; }
.barras.lista .tendencia .linea{ opacity:1;animation:tendenciaDibujar 1.4s ease-out forwards; }
@keyframes tendenciaDibujar{ to{ stroke-dashoffset:0; } }
.barras .tendencia .punto{ fill:#fff;opacity:0;filter:drop-shadow(0 0 8px #ff5468) drop-shadow(0 0 3px #fff); }
.barras.lista .tendencia .punto{ opacity:1;transition:opacity .4s ease 1.4s; }
.barras .burbuja{ position:absolute;right:-10px;top:calc(50% - 190px);display:inline-block;padding:10px 16px;border-radius:30px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.35);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font-size:15px;line-height:1;white-space:nowrap;opacity:0;transform:translateY(10px);transition:opacity .6s ease,transform .6s ease; }
.barras.lista .burbuja{ opacity:1;transform:none;animation:burbujaFlotar 3.6s ease-in-out .6s infinite; }
@keyframes burbujaFlotar{ 50%{ translate:0 -8px; } }

/* Imagen de la segunda diapositiva: flota */
#portada .banner .with-img > img.active{ animation:imgFlotar 5s ease-in-out 1s infinite; }
@keyframes imgFlotar{ 50%{ translate:0 -14px; } }

/* Indicadores de diapositiva y flecha para bajar */
.banner-nav{ position:absolute;left:50%;bottom:34px;transform:translateX(-50%);z-index:3;display:flex;gap:12px; }
.banner-nav button{ width:46px;height:6px;padding:0;border:0;border-radius:6px;background:rgba(255,255,255,.3);cursor:pointer;overflow:hidden; }
.banner-nav button i{ display:block;height:100%;width:0;background:#fff;border-radius:inherit; }
.banner-nav button.on i{ animation:navProgreso var(--dur,9s) linear forwards; }
@keyframes navProgreso{ to{ width:100%; } }
.banner-bajar{ position:absolute;right:40px;bottom:28px;z-index:3;width:28px;height:46px;border:2px solid rgba(255,255,255,.7);border-radius:16px; }
.banner-bajar i{ position:absolute;left:50%;top:9px;width:4px;height:9px;margin-left:-2px;border-radius:2px;background:#fff;animation:bajarRueda 1.8s ease-in-out infinite; }
@keyframes bajarRueda{ 0%{ opacity:0;transform:translateY(-4px); } 40%{ opacity:1; } 80%,100%{ opacity:0;transform:translateY(12px); } }

@media screen and (max-width:1050px), screen and (max-height:450px){
  .banner-cta{ justify-content:center;margin:0 0 30px; }
  #portada .banner .tbl > .barras{ display:inline-block;margin-top:70px; }
  .barras .burbuja{ right:auto;left:50%;transform:translate(-50%,10px);top:-62px; }
  .barras.lista .burbuja{ transform:translate(-50%,0); }
  .banner-nav{ position:relative;left:auto;bottom:auto;transform:none;justify-content:center;padding:0 0 40px; }
  .banner-bajar{ display:none; }
}
@media all and (max-width:430px){
  #portada .banner .span-2 .rotador{ white-space:normal; }
  #portada .banner .span-2{ min-height:2.1em; }
  .btn-banner{ padding:13px 20px;font-size:14px; }
  .barras .burbuja{ font-size:13px; }
}
@media (prefers-reduced-motion:reduce){
  .banner-fx .bfx-img,.banner-fx .bfx-glow,#portada .banner .span-2 .rotador,.btn-banner.primario,.barras .burbuja,#portada .banner .with-img > img.active,.banner-bajar i,
  #portada .banner .barras.lista > .barra::after{ animation:none !important; }
}

/* ===== Servicios: tarjetas con icono que se pinta de rojo ===== */
#portada .servicios .container > span.iconos{ animation:servOnda 4.5s ease-in-out infinite; }
#portada .servicios .container > span.iconos:last-child{ animation-delay:-2.2s; }
@keyframes servOnda{ 0%,100%{ transform:scale(1);opacity:1; } 50%{ transform:scale(1.07);opacity:.75; } }
#portada .servicios .container > ul{ display:flex;justify-content:center;flex-wrap:wrap;gap:30px;padding:0 0 80px;position:relative;z-index:1; }
#portada .servicios .container > ul li{ flex:0 1 360px;margin:0 !important;padding:38px 22px 34px;border-radius:22px;background:#fff;position:relative;overflow:hidden;
  box-shadow:0 10px 30px rgba(120,10,30,.07);border:1px solid #eee;cursor:default;
  opacity:0;transform:translateY(40px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,border-color .35s ease; }
#portada .servicios .container > ul li:nth-child(2){ transition-delay:.15s,.15s,0s,0s; }
#portada .servicios .container > ul li:nth-child(3){ transition-delay:.3s,.3s,0s,0s; }
#portada .servicios.visible .container > ul li{ opacity:1;transform:none; }
#portada .servicios .container > ul li::before{ content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:linear-gradient(90deg,#E4001E,#ff5468);transform:scaleX(0);transform-origin:left;transition:transform .5s ease; }
#portada .servicios .container > ul li::after{ content:"";position:absolute;width:260px;height:260px;right:-120px;top:-120px;border-radius:50%;background:radial-gradient(circle,rgba(228,0,30,.10),transparent 70%);opacity:0;transition:opacity .5s ease; }
#portada .servicios .container > ul li i.iconos{ position:relative;background-image:none;background-color:#d6d6d6;
  -webkit-mask-image:url(../img/iconos.png);mask-image:url(../img/iconos.png);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;transition:transform .5s cubic-bezier(.2,.8,.2,1); }
#portada .servicios .container > ul li i.iconos::after{ content:"";position:absolute;inset:0;background:linear-gradient(135deg,#ff3a52,#BA0D2A);opacity:0;transition:opacity .45s ease; }
#portada .servicios .sistemaparaopticas-1{ -webkit-mask-position:0 -112px;mask-position:0 -112px; }
#portada .servicios .laboratoriooptica-1{ -webkit-mask-position:-175px -112px;mask-position:-175px -112px; }
#portada .servicios .consultorios-1{ -webkit-mask-position:-283px -112px;mask-position:-283px -112px; }
#portada .servicios .container > ul li span{ font-size:22px;padding:30px 0 0;line-height:1.1;transition:color .35s ease; }
#portada .servicios .container > ul li p{ font-family:montserratmedium,fangsong;font-size:15px;line-height:1.45;color:#888;margin:14px auto 0;max-width:260px; }
/* Resaltada: al pasar el mouse o cuando le toca en el recorrido automático */
#portada .servicios .container > ul li:hover,
#portada .servicios .container > ul li.resalta{ transform:translateY(-10px);box-shadow:0 24px 50px rgba(186,13,42,.16);border-color:#f6c9d0; }
#portada .servicios .container > ul li:hover::before,
#portada .servicios .container > ul li.resalta::before{ transform:scaleX(1); }
#portada .servicios .container > ul li:hover::after,
#portada .servicios .container > ul li.resalta::after{ opacity:1; }
#portada .servicios .container > ul li:hover i.iconos,
#portada .servicios .container > ul li.resalta i.iconos{ transform:scale(1.08) rotate(-2deg); }
#portada .servicios .container > ul li:hover i.iconos::after,
#portada .servicios .container > ul li.resalta i.iconos::after{ opacity:1; }
#portada .servicios .container > ul li:hover span,
#portada .servicios .container > ul li.resalta span{ color:#BA0D2A; }

/* ===== Contamos con un sistema más completo ===== */
#portada .contamos{ overflow:hidden; } /* los anillos del halo no deben ensanchar la página en celular */
#portada .contamos .container h2{ position:relative; }
#portada .contamos .container h2::after{ content:"";position:absolute;left:50%;bottom:-22px;width:90px;height:4px;margin-left:-45px;border-radius:4px;background:linear-gradient(90deg,#E4001E,#ff5468);transform:scaleX(0);transition:transform .8s ease .2s; }
#portada .contamos.visible .container h2::after{ transform:scaleX(1); }
#portada .contamos .container .recursos img{ transition:opacity 1s ease,scale 1s cubic-bezier(.2,.8,.2,1);opacity:0;scale:.85; }
#portada .contamos.visible .container .recursos img{ opacity:1;scale:1;animation:sistemaFlotar 6s ease-in-out 1s infinite; }
@keyframes sistemaFlotar{ 50%{ translate:0 -12px; } }
#portada .contamos .recursos-halo{ position:absolute;left:calc(50% - 21px);top:220px;width:400px;height:400px;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(228,0,30,.10) 0%,rgba(228,0,30,.04) 45%,transparent 70%);opacity:0;transition:opacity 1s ease; }
#portada .contamos.visible .recursos-halo{ opacity:1; }
#portada .contamos .recursos-halo i{ position:absolute;inset:0;border-radius:50%;border:2px dashed rgba(186,13,42,.18);animation:haloGirar 30s linear infinite; }
#portada .contamos .recursos-halo i + i{ inset:-40px;border:1px solid rgba(186,13,42,.10);border-top-color:rgba(228,0,30,.45);animation-duration:9s;animation-direction:reverse; }
@keyframes haloGirar{ to{ transform:rotate(360deg); } }
#portada .contamos .container .recursos ul li{ cursor:default; }
#portada .contamos .container .recursos ul li i{ transition:left 1s ease,transform .45s cubic-bezier(.2,.8,.2,1),filter .45s ease; }
#portada .contamos .container .recursos ul li span{ transition:color .35s ease; }
#portada .contamos .container .recursos ul li.active:hover i,
#portada .contamos .container .recursos ul li.active.resalta i{ transform:scale(1.18) rotate(-6deg);filter:drop-shadow(0 6px 10px rgba(186,13,42,.35)); }
#portada .contamos .container .recursos ul li.active:hover span,
#portada .contamos .container .recursos ul li.active.resalta span{ color:#BA0D2A; }

@media all and (max-width:1120px){
  /* Aquí la imagen va de fondo, detrás de los textos */
  #portada .contamos.visible .container .recursos img{ opacity:.1; }
  #portada .contamos.visible .recursos-halo{ opacity:.5; }
}
@media all and (max-width:660px){
  #portada .contamos .recursos-halo{ left:50%;top:50%;width:300px;height:300px; }
}
@media all and (max-width:1100px){
  #portada .servicios .container > ul li{ flex-basis:300px;padding:30px 20px 28px; }
  #portada .servicios .container > ul li span{ font-size:21px; }
}
@media all and (max-width:430px){
  #portada .servicios .container > ul{ gap:20px;padding-bottom:50px; }
  #portada .servicios .container > ul li span{ font-size:20px; }
}
@media (prefers-reduced-motion:reduce){
  #portada .servicios .container > span.iconos,#portada .contamos .recursos-halo i,#portada .contamos.visible .container .recursos img{ animation:none !important; }
  #portada .servicios .container > ul li{ opacity:1;transform:none; }
}

/* ===== Beneficios: círculo con brillo y ondas, tarjetas con icono ===== */
/* Ondas que salen del círculo, como una señal */
#portada .beneficios .titulo .container .circulo::before,
#portada .beneficios .titulo .container .circulo::after{ content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(255,255,255,.7);z-index:-1;animation:benOnda 4.2s ease-out infinite; }
#portada .beneficios .titulo .container .circulo::after{ animation-delay:2.1s; }
@keyframes benOnda{ from{ transform:scale(1);opacity:.85; } to{ transform:scale(1.32);opacity:0; } }
/* Brillo que recorre el aro rojo */
#portada .beneficios .titulo .container .circulo .borde::before{ content:"";position:absolute;inset:-31px;border-radius:50%;pointer-events:none;
  background:conic-gradient(from 0deg,transparent 0 62%,rgba(255,255,255,.15) 75%,rgba(255,255,255,.85) 88%,transparent 92%);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 31px),#000 calc(100% - 30px));mask:radial-gradient(farthest-side,transparent calc(100% - 31px),#000 calc(100% - 30px));
  animation:benBrillo 5s linear infinite; }
@keyframes benBrillo{ to{ transform:rotate(360deg); } }
#portada .beneficios .titulo .container .circulo .borde h2{ opacity:0;translate:0 24px;transition:opacity .8s ease,translate .8s cubic-bezier(.2,.8,.2,1); }
#portada .beneficios.visible .titulo .container .circulo .borde h2{ opacity:1;translate:0 0; }

/* Tarjetas */
#portada .beneficios .cuerpo .container ul li{ perspective:900px; }
#portada .beneficios .ben-card{ position:relative;overflow:hidden;width:308px;max-width:100%;min-height:326px;margin:0 auto;padding:44px 28px 36px;border-radius:24px;background:#fff;text-align:center;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;border:1px solid #eee;box-shadow:0 14px 34px rgba(120,10,30,.08);
  transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--ty,0px));transform-style:preserve-3d;
  opacity:0;translate:0 50px;transition:opacity .7s ease,translate .7s cubic-bezier(.2,.8,.2,1),transform .35s ease,box-shadow .35s ease,background-color .35s ease; }
#portada .beneficios.visible .ben-card{ opacity:1;translate:0 0; }
#portada .beneficios .cuerpo li:nth-child(2) .ben-card{ transition-delay:.1s,.1s,0s,0s,0s; }
#portada .beneficios .cuerpo li:nth-child(3) .ben-card{ transition-delay:.2s,.2s,0s,0s,0s; }
#portada .beneficios .cuerpo li:nth-child(4) .ben-card{ transition-delay:.3s,.3s,0s,0s,0s; }
#portada .beneficios .cuerpo li:nth-child(5) .ben-card{ transition-delay:.4s,.4s,0s,0s,0s; }
#portada .beneficios .cuerpo li:nth-child(6) .ben-card{ transition-delay:.5s,.5s,0s,0s,0s; }
/* Fondo rojo que entra desde abajo al resaltar */
#portada .beneficios .ben-card::before{ content:"";position:absolute;inset:0;background:linear-gradient(150deg,#ff2d48 0%,#E4001E 45%,#8f0a22 100%);transform:translateY(101%);transition:transform .5s cubic-bezier(.2,.8,.2,1);z-index:0; }
#portada .beneficios .ben-card > *{ position:relative;z-index:1; }
#portada .beneficios .ben-num{ position:absolute;top:18px;left:24px;font-size:46px;line-height:1;color:rgba(186,13,42,.10);transition:color .4s ease; }
#portada .beneficios .ben-ico{ width:118px;height:118px;border-radius:50%;background:#fdf0f2;display:grid;place-items:center;flex:none;transition:background-color .4s ease,transform .5s cubic-bezier(.2,.8,.2,1); }
#portada .beneficios .ben-ico i.iconos{ flex:none;background-image:none;background-color:#BA0D2A;scale:.58;transition:background-color .4s ease;
  -webkit-mask-image:url(../img/iconos.png);mask-image:url(../img/iconos.png);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat; }
#portada .beneficios .ben-ico .ns-caracteristicas-1{ -webkit-mask-position:0 -478px;mask-position:0 -478px; }
#portada .beneficios .ben-ico .ns-caracteristicas-2{ -webkit-mask-position:-152px -478px;mask-position:-152px -478px; }
#portada .beneficios .ben-ico .ns-caracteristicas-4{ -webkit-mask-position:-407px -478px;mask-position:-407px -478px; }
#portada .beneficios .ben-ico .ns-caracteristicas-5{ -webkit-mask-position:-531px -478px;mask-position:-531px -478px; }
#portada .beneficios .ben-ico .ns-caracteristicas-6{ -webkit-mask-position:-617px -478px;mask-position:-617px -478px; }
#portada .beneficios .ben-ico .inc-3{ -webkit-mask-position:-171px -746px;mask-position:-171px -746px; }
#portada .beneficios .ben-card p{ font-size:23px;line-height:1.3;color:#666;transition:color .4s ease; }
#portada .beneficios .ben-card:hover,
#portada .beneficios .ben-card.resalta{ --ty:-10px;box-shadow:0 26px 50px rgba(186,13,42,.28); }
#portada .beneficios .ben-card:hover::before,
#portada .beneficios .ben-card.resalta::before{ transform:translateY(0); }
#portada .beneficios .ben-card:hover p,
#portada .beneficios .ben-card.resalta p{ color:#fff; }
#portada .beneficios .ben-card:hover .ben-num,
#portada .beneficios .ben-card.resalta .ben-num{ color:rgba(255,255,255,.28); }
#portada .beneficios .ben-card:hover .ben-ico,
#portada .beneficios .ben-card.resalta .ben-ico{ background:rgba(255,255,255,.16);transform:scale(1.08) rotate(-6deg); }
#portada .beneficios .ben-card:hover .ben-ico i.iconos,
#portada .beneficios .ben-card.resalta .ben-ico i.iconos{ background-color:#fff; }

@media all and (max-width:750px){
  #portada .beneficios .ben-card{ width:100%;min-height:0;padding:34px 20px 30px;gap:18px; }
  #portada .beneficios .ben-ico{ width:96px;height:96px; }
  #portada .beneficios .ben-ico i.iconos{ scale:.48; }
  #portada .beneficios .ben-card p{ font-size:20px; }
}
@media (prefers-reduced-motion:reduce){
  #portada .beneficios .titulo .container .circulo::before,#portada .beneficios .titulo .container .circulo::after,
  #portada .beneficios .titulo .container .circulo .borde::before{ animation:none !important; }
  #portada .beneficios .titulo .container .circulo::before,#portada .beneficios .titulo .container .circulo::after{ display:none; }
}

/* ===== El sistema te permite: imagen viva y lista con checks ===== */
#portada .caracteristicas{ overflow:hidden; }
#portada .caracteristicas .container .tbl > div:first-child{ perspective:1000px; }
#portada .caracteristicas .container .tbl > div figure{ overflow:hidden;border-radius:24px;box-shadow:26px 26px 0 0 rgba(228,0,30,.12);
  clip-path:inset(-50px 100% -50px -50px);transition:clip-path 1.2s cubic-bezier(.7,0,.2,1),transform .4s ease;
  transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)); }
#portada .caracteristicas.visible .container .tbl > div figure{ clip-path:inset(-50px -50px -50px -50px); }
#portada .caracteristicas .container .tbl > div figure img{ display:block;transform-origin:60% 40%;animation:carZoom 18s ease-in-out infinite alternate; }
@keyframes carZoom{ from{ transform:scale(1); } to{ transform:scale(1.12); } }
#portada .caracteristicas .container .tbl > div figure:before{ z-index:1;background:linear-gradient(160deg,rgba(123,11,30,.35),rgba(80,5,20,.65)); }
/* Luz que cruza la imagen */
#portada .caracteristicas figure .car-luz{ position:absolute;top:-20%;bottom:-20%;left:-60%;width:40%;z-index:2;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);transform:skewX(-18deg);animation:carLuz 6s ease-in-out 1.5s infinite; }
@keyframes carLuz{ 0%{ left:-60%; } 45%,100%{ left:130%; } }
/* Etiquetas flotantes */
#portada .caracteristicas figure .car-badge{ position:absolute;z-index:3;display:inline-flex;align-items:center;gap:10px;padding:11px 18px;border-radius:30px;font-size:16px;line-height:1;color:#fff;white-space:nowrap;
  background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.4);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 10px 30px rgba(0,0,0,.2);
  opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease; }
#portada .caracteristicas figure .car-badge.b1{ top:26px;right:26px; }
#portada .caracteristicas figure .car-badge.b2{ bottom:26px;left:26px; }
#portada .caracteristicas.visible figure .car-badge{ opacity:1;transform:none;animation:carFlotar 4s ease-in-out infinite; }
#portada .caracteristicas.visible figure .car-badge.b1{ transition-delay:1s;animation-delay:1.6s; }
#portada .caracteristicas.visible figure .car-badge.b2{ transition-delay:1.3s;animation-delay:2.4s; }
@keyframes carFlotar{ 50%{ translate:0 -8px; } }
#portada .caracteristicas figure .car-badge i{ width:10px;height:10px;border-radius:50%;background:#3ddc84;box-shadow:0 0 0 0 rgba(61,220,132,.7);animation:carPunto 1.8s ease-out infinite; }
@keyframes carPunto{ 70%,100%{ box-shadow:0 0 0 9px rgba(61,220,132,0); } }

/* Título y lista */
#portada .caracteristicas .container h2{ position:relative;opacity:0;translate:30px 0;transition:opacity .7s ease .2s,translate .7s ease .2s; }
#portada .caracteristicas .container h2::after{ content:"";display:block;width:80px;height:4px;margin-top:14px;border-radius:4px;background:linear-gradient(90deg,#E4001E,#ff5468);transform:scaleX(0);transform-origin:left;transition:transform .8s ease .6s; }
#portada .caracteristicas.visible .container h2{ opacity:1;translate:0 0; }
#portada .caracteristicas.visible .container h2::after{ transform:scaleX(1); }
#portada .caracteristicas .listado{ position:relative;isolation:isolate; }
/* Línea que une los checks y se llena de rojo */
#portada .caracteristicas .listado::before,
#portada .caracteristicas .listado::after{ content:"";position:absolute;left:20px;top:30px;bottom:60px;width:2px;background:#e3e3e3;z-index:0; }
#portada .caracteristicas .listado::after{ background:linear-gradient(#E4001E,#ff5468);transform:scaleY(0);transform-origin:top;transition:transform 2.4s cubic-bezier(.4,0,.2,1) .4s; }
#portada .caracteristicas.visible .listado::after{ transform:scaleY(1); }
/* Cada punto va encima de la línea: su check (con fondo) la tapa por dentro del círculo */
#portada .caracteristicas .listado li{ z-index:1;cursor:default;opacity:0;translate:40px 0;transition:opacity .6s ease,translate .6s cubic-bezier(.2,.8,.2,1),color .35s ease; }
#portada .caracteristicas .listado li:before{ z-index:1;background-color:#F9F9F9;border-radius:50%;transform:scale(0) rotate(-90deg);transition:transform .5s cubic-bezier(.3,1.6,.5,1); }
#portada .caracteristicas.visible .listado li{ opacity:1;translate:0 0; }
#portada .caracteristicas.visible .listado li:before{ transform:scale(1) rotate(0); }
#portada .caracteristicas.visible .listado li:nth-child(1){ transition-delay:.4s,.4s,0s; } #portada .caracteristicas.visible .listado li:nth-child(1):before{ transition-delay:.7s; }
#portada .caracteristicas.visible .listado li:nth-child(2){ transition-delay:.85s,.85s,0s; } #portada .caracteristicas.visible .listado li:nth-child(2):before{ transition-delay:1.15s; }
#portada .caracteristicas.visible .listado li:nth-child(3){ transition-delay:1.3s,1.3s,0s; } #portada .caracteristicas.visible .listado li:nth-child(3):before{ transition-delay:1.6s; }
#portada .caracteristicas.visible .listado li:nth-child(4){ transition-delay:1.75s,1.75s,0s; } #portada .caracteristicas.visible .listado li:nth-child(4):before{ transition-delay:2.05s; }
#portada .caracteristicas.visible .listado li:nth-child(5){ transition-delay:2.2s,2.2s,0s; } #portada .caracteristicas.visible .listado li:nth-child(5):before{ transition-delay:2.5s; }
/* Resaltado (mouse o recorrido automático): el check late y el texto se pone rojo */
#portada .caracteristicas .listado li::after{ content:"";position:absolute;left:0;top:0;width:42px;height:42px;border-radius:50%;box-shadow:0 0 0 0 rgba(228,0,30,.45);pointer-events:none; }
#portada .caracteristicas .listado li:hover,
#portada .caracteristicas .listado li.resalta{ color:#BA0D2A; }
#portada .caracteristicas.visible .listado li:hover:before,
#portada .caracteristicas.visible .listado li.resalta:before{ transform:scale(1.15);transition-delay:0s; }
#portada .caracteristicas .listado li:hover::after,
#portada .caracteristicas .listado li.resalta::after{ animation:carLatido 1.2s ease-out; }
@keyframes carLatido{ 0%{ box-shadow:0 0 0 0 rgba(228,0,30,.45); } 100%{ box-shadow:0 0 0 16px rgba(228,0,30,0); } }

@media all and (max-width:1144px){
  /* La lista va centrada: sin línea vertical */
  #portada .caracteristicas .listado::before,#portada .caracteristicas .listado::after{ display:none; }
  #portada .caracteristicas .container h2::after{ margin:14px auto 0;transform-origin:center; }
}
@media all and (max-width:430px){
  #portada .caracteristicas figure .car-badge{ font-size:13px;padding:8px 13px;gap:8px; }
  #portada .caracteristicas figure .car-badge.b1{ top:14px;right:14px; }
  #portada .caracteristicas figure .car-badge.b2{ bottom:14px;left:14px; }
}
@media (prefers-reduced-motion:reduce){
  #portada .caracteristicas .container .tbl > div figure img,#portada .caracteristicas figure .car-luz,#portada .caracteristicas figure .car-badge{ animation:none !important; }
}

/* ===== Precios (portada y página Precios): tarjetas vivas, montos que cuentan y botón con brillo ===== */
#portada .precios{ position:relative;overflow:hidden; }
#portada .precios::before,
#portada .precios::after{ content:"";position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;z-index:0; }
#portada .precios::before{ width:520px;height:520px;left:-180px;top:120px;background:rgba(228,0,30,.10);animation:prFlotar 16s ease-in-out infinite alternate; }
#portada .precios::after{ width:440px;height:440px;right:-140px;bottom:-60px;background:rgba(255,84,104,.12);animation:prFlotar 20s ease-in-out infinite alternate-reverse; }
@keyframes prFlotar{ to{ transform:translate(120px,-80px) scale(1.15); } }
#portada .precios .container{ position:relative;z-index:1; }
#portada .precios .container h2,
#portada .precios .container h2 + p{ opacity:0;translate:0 24px;transition:opacity .7s ease,translate .7s ease; }
#portada .precios .container h2 + p{ transition-delay:.15s; }
#portada .precios.visible .container h2,
#portada .precios.visible .container h2 + p{ opacity:1;translate:0 0; }

:is(#portada .precios,#precios .descripcion) .listado-precios{ display:flex;justify-content:center;flex-wrap:wrap;gap:40px 56px;max-width:1185px; }
:is(#portada .precios,#precios .descripcion) .listado-precios li{ float:none;width:504px;max-width:100%;margin:0 0 56px;padding:34px 0 0;position:relative;overflow:hidden;
  background:#fff;border:1px solid #eee;border-radius:26px;box-shadow:0 18px 44px rgba(120,10,30,.09);
  transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--ty,0px));
  opacity:0;translate:0 60px;transition:opacity .8s ease,translate .8s cubic-bezier(.2,.8,.2,1),transform .35s ease,box-shadow .35s ease,border-color .35s ease; }
:is(#portada .precios,#precios .descripcion) .listado-precios li + li{ transition-delay:.18s,.18s,0s,0s,0s; }
:is(#portada .precios.visible,#precios .descripcion.visible) .listado-precios li{ opacity:1;translate:0 0; }
:is(#portada .precios,#precios .descripcion) .listado-precios li::before{ content:"";position:absolute;left:0;right:0;top:0;height:6px;background:linear-gradient(90deg,#8f0a22,#E4001E,#ff5468,#E4001E,#8f0a22);background-size:200% 100%;animation:prFranja 4s linear infinite; }
@keyframes prFranja{ to{ background-position:-200% 0; } }
:is(#portada .precios,#precios .descripcion) .listado-precios li:hover{ --ty:-12px;border-color:#f6c9d0;box-shadow:0 30px 60px rgba(186,13,42,.2); }
/* Etiqueta del plan */
:is(#portada .precios,#precios .descripcion) .listado-precios li > span{ display:table;margin:0 0 44px 32px;padding:9px 18px;border-radius:30px;font-size:17px;color:#BA0D2A;background:#fdf0f2; }
:is(#portada .precios,#precios .descripcion) .listado-precios li h3{ padding:0 24px; }
:is(#portada .precios,#precios .descripcion) .listado-precios li h3 span:nth-child(2){ display:inline-flex;width:30px;height:30px;margin:8px 0;align-items:center;justify-content:center;border-radius:50%;background:#E4001E;color:#fff;font-size:22px;line-height:1;animation:prMas 2.6s ease-in-out infinite; }
@keyframes prMas{ 50%{ transform:rotate(90deg) scale(1.1); } }
/* Montos y línea divisoria animada */
:is(#portada .precios,#precios .descripcion) .listado-precios li .tbl{ position:relative; }
:is(#portada .precios,#precios .descripcion) .listado-precios li .tbl > div{ border:0; }
:is(#portada .precios,#precios .descripcion) .listado-precios li .tbl::after{ content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;margin-left:-1px;background:linear-gradient(transparent,#E4001E 20%,#E4001E 80%,transparent);
  transform:scaleY(0);transition:transform 1s cubic-bezier(.4,0,.2,1) .6s; }
:is(#portada .precios.visible,#precios .descripcion.visible) .listado-precios li .tbl::after{ transform:scaleY(1); }
:is(#portada .precios,#precios .descripcion) .listado-precios li .tbl > div span{ font-variant-numeric:tabular-nums;color:#4a4a4a;transition:color .35s ease,transform .35s ease; }
:is(#portada .precios,#precios .descripcion) .listado-precios li:hover .tbl > div span{ color:#BA0D2A;transform:scale(1.05); }
/* Botón */
:is(#portada .precios,#precios .descripcion) .listado-precios li .text-right{ text-align:center;padding:0 32px 32px; }
:is(#portada .precios,#precios .descripcion) .listado-precios li a{ position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:12px;width:100%;margin:0;padding:17px 20px;border-radius:40px;
  color:#fff;font-size:18px;letter-spacing:.5px;background:linear-gradient(135deg,#E4001E,#a10a24);box-shadow:0 10px 24px rgba(186,13,42,.3);transition:transform .25s ease,box-shadow .25s ease; }
:is(#portada .precios,#precios .descripcion) .listado-precios li a::before{ content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);animation:prBrillo 3.5s ease-in-out infinite; }
:is(#portada .precios,#precios .descripcion) .listado-precios li + li a::before{ animation-delay:1.75s; }
@keyframes prBrillo{ 0%{ left:-60%; } 50%,100%{ left:130%; } }
:is(#portada .precios,#precios .descripcion) .listado-precios li a::after{ content:"\2192";font-size:20px;transition:transform .25s ease; }
:is(#portada .precios,#precios .descripcion) .listado-precios li a:hover{ transform:translateY(-3px);box-shadow:0 16px 32px rgba(186,13,42,.42); }
:is(#portada .precios,#precios .descripcion) .listado-precios li a:hover::after{ transform:translateX(5px); }

@media all and (max-width:510px){
  :is(#portada .precios,#precios .descripcion) .listado-precios li > span{ margin:0 0 26px 20px; }
  :is(#portada .precios,#precios .descripcion) .listado-precios li .text-right{ padding:0 20px 24px; }
}
@media all and (max-width:300px){
  :is(#portada .precios,#precios .descripcion) .listado-precios li .tbl::after{ display:none; }
  :is(#portada .precios,#precios .descripcion) .listado-precios li .tbl > div:first-child{ border-bottom:2px solid #E4001E; }
}
@media (prefers-reduced-motion:reduce){
  #portada .precios::before,#portada .precios::after,:is(#portada .precios,#precios .descripcion) .listado-precios li::before,
  :is(#portada .precios,#precios .descripcion) .listado-precios li h3 span:nth-child(2),:is(#portada .precios,#precios .descripcion) .listado-precios li a::before{ animation:none !important; }
}

/* ===== Accede a nuestro demo ===== */
#portada .probar-demo{ position:relative;overflow:hidden; }
#portada .probar-demo:before{ z-index:0;background:linear-gradient(90deg,rgba(60,4,14,.85) 0%,rgba(110,9,27,.55) 45%,rgba(123,11,30,.35) 100%); }
#portada .probar-demo .container{ z-index:2; }
/* Cuadros de vidrio que flotan, como los botones táctiles de la foto */
.pd-cuadros{ position:absolute;inset:0;z-index:1;pointer-events:none; }
.pd-cuadros i{ position:absolute;width:var(--t,110px);height:var(--t,110px);border-radius:18px;border:1.5px solid rgba(255,205,215,.65);background:rgba(255,255,255,.07);
  box-shadow:0 0 22px rgba(255,120,140,.35),inset 0 0 18px rgba(255,255,255,.12);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  animation:pdFlotar var(--d,9s) ease-in-out var(--r,0s) infinite alternate,pdBrillo 3.4s ease-in-out var(--r,0s) infinite; }
.pd-cuadros i:nth-child(1){ --t:120px;--d:9s;--r:-2s;left:46%;top:14%; }
.pd-cuadros i:nth-child(2){ --t:84px;--d:11s;--r:-5s;left:62%;top:58%; }
.pd-cuadros i:nth-child(3){ --t:140px;--d:13s;--r:-1s;left:78%;top:22%; }
.pd-cuadros i:nth-child(4){ --t:64px;--d:8s;--r:-4s;left:90%;top:66%; }
.pd-cuadros i:nth-child(5){ --t:96px;--d:10s;--r:-7s;left:36%;top:68%; }
.pd-cuadros i:nth-child(6){ --t:52px;--d:7s;--r:-3s;left:70%;top:6%; }
@keyframes pdFlotar{ from{ transform:translate(0,0) rotate(-4deg); } to{ transform:translate(-18px,-26px) rotate(5deg); } }
@keyframes pdBrillo{ 0%,100%{ border-color:rgba(255,205,215,.45);box-shadow:0 0 14px rgba(255,120,140,.25),inset 0 0 14px rgba(255,255,255,.08); }
  50%{ border-color:rgba(255,230,235,.95);box-shadow:0 0 34px rgba(255,120,140,.6),inset 0 0 22px rgba(255,255,255,.2); } }
/* Título línea por línea */
#portada .probar-demo .container > div span.pd-titulo{ padding-bottom:16px; }
#portada .probar-demo .pd-titulo b{ font-weight:normal;opacity:0;translate:-40px 0;transition:opacity .7s ease,translate .7s cubic-bezier(.2,.8,.2,1); }
#portada .probar-demo .pd-titulo b:nth-child(2){ transition-delay:.15s; }
#portada .probar-demo .pd-titulo b:nth-child(3){ transition-delay:.3s; }
#portada .probar-demo.visible .pd-titulo b{ opacity:1;translate:0 0; }
#portada .probar-demo .pd-titulo .pd-demo{ background:linear-gradient(90deg,#fff 0%,#fff 35%,#ffb3c0 50%,#fff 65%,#fff 100%);background-size:250% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;animation:pdTexto 3.5s linear infinite; }
@keyframes pdTexto{ from{ background-position:100% 0; } to{ background-position:-150% 0; } }
#portada .probar-demo .pd-sub{ font-style:normal;font-family:montserratmedium,fangsong;font-size:19px;line-height:1.35;color:#f6dde1;text-align:center;margin:0 0 24px;
  opacity:0;transition:opacity .7s ease .5s; }
#portada .probar-demo.visible .pd-sub{ opacity:1; }
/* Botón PROBAR */
#portada .probar-demo .container > div a{ position:relative;overflow:hidden;border-radius:50px;color:#fff;background:linear-gradient(135deg,#E4001E,#a10a24);
  box-shadow:0 0 0 0 rgba(228,0,30,.6);animation:bannerLatido 2.4s ease-out infinite;opacity:0;translate:0 20px;transition:opacity .7s ease .65s,translate .7s ease .65s; }
#portada .probar-demo.visible .container > div a{ opacity:1;translate:0 0; }
#portada .probar-demo .container > div a::before{ content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);animation:prBrillo 3.5s ease-in-out infinite; }
#portada .probar-demo .container > div a::after{ content:" \2192";transition:margin .25s ease; }
#portada .probar-demo .container > div a:hover::after{ margin-left:8px; }

/* ===== Contáctanos (portada y Precios) ===== */
.contactanos .container .b-shadow{ box-shadow:0 22px 50px rgba(120,10,30,.14);-webkit-box-shadow:0 22px 50px rgba(120,10,30,.14); }
.contactanos .container > div .datos{ z-index:1;overflow:hidden;border-radius:26px;color:#fff;background:linear-gradient(150deg,#d4112f 0%,#a30c25 55%,#6e0718 100%); }
/* Anillos de señal que giran en la tarjeta roja */
.contactanos .container > div .datos::before,
.contactanos .container > div .datos::after{ content:"";position:absolute;border-radius:50%;pointer-events:none;border:2px dashed rgba(255,255,255,.18);animation:benBrillo 40s linear infinite; }
.contactanos .container > div .datos::before{ width:340px;height:340px;right:-140px;bottom:-140px; }
.contactanos .container > div .datos::after{ width:220px;height:220px;right:-80px;bottom:-80px;border-style:solid;border-color:rgba(255,255,255,.1);border-top-color:rgba(255,255,255,.55);animation-duration:7s;animation-direction:reverse; }
.contactanos .container > div .datos > *{ position:relative;z-index:1; }
.contactanos .container > div .datos h2{ color:#fff; }
.contactanos .container > div .datos h2::after{ content:"";display:block;width:70px;height:4px;margin:14px auto 0;border-radius:4px;background:rgba(255,255,255,.85); }
.contactanos .container > div .datos ul li{ transition:transform .3s ease; }
.contactanos .container > div .datos ul li:hover{ transform:translateX(6px); }
.contactanos .container > div .datos ul li > span{ color:#fff; }
.contactanos .container > div .datos ul li > p{ color:#fbe3e7; }
.contactanos .container > div .datos ul li > p a{ color:inherit;background:linear-gradient(currentColor,currentColor) 0 100%/0 2px no-repeat;transition:background-size .3s ease; }
.contactanos .container > div .datos ul li > p a:hover{ background-size:100% 2px; }
/* Iconos en blanco (mismo dibujo, pintado con máscara) */
.contactanos .container > div .datos ul li > i.iconos{ background-image:none;background-color:#fff;-webkit-mask-image:url(../img/iconos.png);mask-image:url(../img/iconos.png);
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;animation:ctIcono 3s ease-in-out infinite; }
.contactanos .container > div .datos ul li:nth-child(2) > i.iconos{ animation-delay:.4s; }
.contactanos .container > div .datos ul li:nth-child(3) > i.iconos{ animation-delay:.8s; }
.contactanos .direccion-1{ -webkit-mask-position:-482px 0;mask-position:-482px 0; }
.contactanos .telefono-1{ -webkit-mask-position:-482px -38px;mask-position:-482px -38px; }
.contactanos .correo-1{ -webkit-mask-position:-482px -73px;mask-position:-482px -73px; }
@keyframes ctIcono{ 0%,60%,100%{ translate:0 0; } 30%{ translate:0 -6px; } }
.contactanos .container > div .datos ul li:nth-child(2):hover > i.iconos{ animation:ctTimbre .5s ease-in-out infinite; }
@keyframes ctTimbre{ 0%,100%{ rotate:0deg; } 25%{ rotate:-14deg; } 75%{ rotate:14deg; } }
/* Formulario */
.contactanos .container > div form{ background:#fff;border-radius:26px; }
.contactanos .container > div form .form-group label{ color:#555;transition:color .25s ease; }
.contactanos .container > div form .form-group input,
.contactanos .container > div form .form-group textarea{ border:1.5px solid #e1e1e1;border-radius:12px;padding:12px 14px;background:#fafafa;transition:border-color .25s ease,box-shadow .25s ease,background-color .25s ease; }
.contactanos .container > div form .form-group input:focus,
.contactanos .container > div form .form-group textarea:focus{ border-color:#E4001E;background:#fff;box-shadow:0 0 0 4px rgba(228,0,30,.12); }
.contactanos .container > div form .form-group:focus-within > label,
.contactanos .container > div form .input-group:focus-within > label{ color:#BA0D2A; }
.contactanos .container > div form button{ position:relative;overflow:hidden;width:200px;padding:14px 0;border-radius:40px;font-family:inherit;background:linear-gradient(135deg,#E4001E,#a10a24);
  box-shadow:0 10px 24px rgba(186,13,42,.3);transition:transform .25s ease,box-shadow .25s ease; }
.contactanos .container > div form button::before{ content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);animation:prBrillo 3.5s ease-in-out infinite; }
.contactanos .container > div form button::after{ content:" \2192"; }
.contactanos .container > div form button:hover{ transform:translateY(-3px);box-shadow:0 16px 32px rgba(186,13,42,.42); }
/* Entrada al aparecer en pantalla (solo si el JS está activo) */
.contactanos.anim .container > div .datos{ opacity:0;translate:-60px 0;transition:opacity .8s ease,translate .8s cubic-bezier(.2,.8,.2,1); }
.contactanos.anim .container > div form{ opacity:0;translate:0 50px;transition:opacity .8s ease .2s,translate .8s cubic-bezier(.2,.8,.2,1) .2s; }
.contactanos.anim .container > div .datos ul li{ opacity:0;translate:-20px 0;transition:opacity .5s ease,translate .5s ease,transform .3s ease; }
.contactanos.anim .container > div .datos ul li:nth-child(1){ transition-delay:.5s,.5s,0s; }
.contactanos.anim .container > div .datos ul li:nth-child(2){ transition-delay:.65s,.65s,0s; }
.contactanos.anim .container > div .datos ul li:nth-child(3){ transition-delay:.8s,.8s,0s; }
.contactanos.anim.visible .container > div .datos,
.contactanos.anim.visible .container > div form,
.contactanos.anim.visible .container > div .datos ul li{ opacity:1;translate:0 0; }

@media all and (max-width:690px){
  .pd-cuadros{ opacity:.5; }
}
@media (prefers-reduced-motion:reduce){
  .pd-cuadros i,#portada .probar-demo .pd-titulo .pd-demo,#portada .probar-demo .container > div a,#portada .probar-demo .container > div a::before,
  .contactanos .container > div .datos::before,.contactanos .container > div .datos::after,.contactanos .container > div .datos ul li > i.iconos,
  .contactanos .container > div form button::before{ animation:none !important; }
}

/* ===== Cartelera de clientes: cinta continua de logos ===== */
#portada .marcas{ overflow:hidden; }
#portada .marcas .container h2:before{ transform:translate(-50%,0) scaleX(0);transition:transform .9s cubic-bezier(.4,0,.2,1) .2s; }
#portada .marcas.visible .container h2:before{ transform:translate(-50%,0) scaleX(1); }
#portada .marcas .container h2{ margin-bottom:14px; }
#portada .marcas .marcas-sub{ font-family:montserratmedium,fangsong;font-size:18px;line-height:1.4;color:#999;margin:0 0 34px; }
/* La cinta se desvanece en los bordes */
.marcas-cinta{ position:relative;overflow:hidden;padding:14px 0 22px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); }
.marcas-pista{ display:flex;width:max-content;animation:marcasCorrer 32s linear infinite; }
.marcas-cinta:hover .marcas-pista{ animation-play-state:paused; }
@keyframes marcasCorrer{ to{ transform:translateX(calc(-100% / 3)); } } /* la pista tiene 3 copias de los logos */
/* Cada logo en su tarjeta: gris, y rojo al pasar el mouse */
.marcas-pista .marca{ flex:none;display:grid;place-items:center;width:250px;height:150px;margin-right:28px;border-radius:22px;background:#fff;border:1px solid #ececec;
  box-shadow:0 10px 26px rgba(0,0,0,.05);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,border-color .35s ease; }
.marcas-pista .marca i{ width:200px;height:110px;background:#a5a5a5;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center;transition:background-color .35s ease,transform .35s ease; }
.marcas-pista .marca:hover{ transform:translateY(-8px);border-color:#f6c9d0;box-shadow:0 20px 40px rgba(186,13,42,.16); }
.marcas-pista .marca:hover i{ background:linear-gradient(135deg,#E4001E,#8f0a22);transform:scale(1.06); }

@media all and (max-width:600px){
  #portada .marcas .container h2{ font-size:30px; }
  .marcas-pista{ animation-duration:22s; }
  .marcas-pista .marca{ width:190px;height:116px;margin-right:18px; }
  .marcas-pista .marca i{ width:150px;height:84px; }
}
@media (prefers-reduced-motion:reduce){
  .marcas-pista{ animation:none; }
  .marcas-cinta{ overflow-x:auto; }
}

/* ===== Pie de página (todas las páginas) ===== */
footer{ overflow:hidden; }
/* Franja de luz arriba */
footer::after{ content:"";position:absolute;left:0;right:0;top:0;height:3px;z-index:2;background:linear-gradient(90deg,transparent,#E4001E,#ffb3c0,#E4001E,transparent);background-size:50% 100%;background-repeat:no-repeat;animation:pieFranja 5s ease-in-out infinite; }
@keyframes pieFranja{ 0%{ background-position:-60% 0; } 100%{ background-position:160% 0; } }
/* Línea que escanea de arriba abajo, como la huella de la foto */
.pie-escaner{ position:absolute;left:0;right:0;top:0;height:140px;z-index:0;pointer-events:none;
  background:linear-gradient(transparent,rgba(255,90,110,.16) 70%,rgba(255,200,210,.5) 98%,transparent);animation:pieEscaner 7s ease-in-out infinite alternate; }
@keyframes pieEscaner{ from{ transform:translateY(-140px); } to{ transform:translateY(calc(var(--alto,600px))); } }
/* Logo con brillo que late */
footer .container .tbl .left .logo img{ animation:pieLogo 3.6s ease-in-out infinite; }
@keyframes pieLogo{ 0%,100%{ filter:drop-shadow(0 0 0 rgba(255,80,100,0)); } 50%{ filter:drop-shadow(0 0 14px rgba(255,80,100,.75)); } }
/* Redes sociales: botones redondos */
footer .container .tbl .left .redes-sociales a{ width:46px;height:46px;border-radius:50%;display:inline-grid;place-items:center;border:1.5px solid rgba(255,255,255,.45);background:rgba(255,255,255,.06);
  transition:transform .3s cubic-bezier(.2,.8,.2,1),background-color .3s ease,border-color .3s ease,box-shadow .3s ease; }
footer .container .tbl .left .redes-sociales a:hover{ transform:translateY(-5px) scale(1.06);background:#E4001E;border-color:#E4001E;box-shadow:0 10px 24px rgba(228,0,30,.45); }
footer .container .tbl .left .redes-sociales a + a{ margin-left:14px; }
/* Enlaces: se corren un poco al pasar el mouse */
footer .container .tbl .right .informacion ul li a,
footer .container .tbl .right .atencion ul li > a{ display:inline-block;transition:transform .3s ease,color .3s ease; }
footer .container .tbl .right .informacion ul li a:hover,
footer .container .tbl .right .atencion ul li > a:hover{ transform:translateX(6px);color:#ffd5dc; }
footer .container .tbl .right .atencion ul li i{ transition:transform .3s ease; }
footer .container .tbl .right .atencion ul li:hover i{ transform:scale(1.25); }
footer .container .tbl .right h2{ position:relative;display:inline-block; }
footer .container .tbl .right h2::after{ content:"";position:absolute;left:0;bottom:-6px;width:36px;height:3px;border-radius:3px;background:#E4001E;transition:width .4s ease; }
footer .container .tbl .right > div:hover h2::after{ width:100%; }
/* Tarjetas de pago */
footer .container .tbl .right .aceptamos .tarjetas i{ border-radius:6px;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s ease; }
footer .container .tbl .right .aceptamos .tarjetas i:hover{ transform:translateY(-5px) rotate(-3deg);box-shadow:0 10px 20px rgba(0,0,0,.35); }
/* Barra final */
.pie-final{ position:relative;z-index:1;max-width:1730px;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 28px;padding:18px 0 24px;
  border-top:1px solid rgba(255,255,255,.18);font-size:14px;line-height:1.4;color:rgba(255,255,255,.75); }
.pie-final .pie-subir{ display:inline-flex;align-items:center;gap:8px;padding:7px 16px;border-radius:30px;border:1px solid rgba(255,255,255,.35);color:#fff;transition:background-color .3s ease,border-color .3s ease; }
.pie-final .pie-subir i{ display:inline-block;transition:transform .3s ease; }
.pie-final .pie-subir:hover{ background:rgba(255,255,255,.12);border-color:#fff; }
.pie-final .pie-subir:hover i{ transform:translateY(-3px); }
/* Entrada al aparecer en pantalla (solo si el JS está activo) */
footer.anim .container .tbl .left,
footer.anim .container .tbl .right > div{ opacity:0;translate:0 40px;transition:opacity .8s ease,translate .8s cubic-bezier(.2,.8,.2,1); }
footer.anim .container .tbl .right > div:nth-child(1){ transition-delay:.15s; }
footer.anim .container .tbl .right > div:nth-child(2){ transition-delay:.3s; }
footer.anim .container .tbl .right > div:nth-child(3){ transition-delay:.45s; }
footer.anim.visible .container .tbl .left,
footer.anim.visible .container .tbl .right > div{ opacity:1;translate:0 0; }

@media (prefers-reduced-motion:reduce){
  footer::after,.pie-escaner,footer .container .tbl .left .logo img{ animation:none !important; }
  .pie-escaner{ display:none; }
}

/* ===== Métodos de pago (Precios) ===== */
#precios .metodos-pago .container{ display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:26px 40px;margin:0 auto 50px;padding:34px 40px;max-width:1236px;width:calc(100% - 30px);
  background:#fff;border:1px solid #eee;border-radius:26px;box-shadow:0 18px 44px rgba(120,10,30,.08);position:relative;overflow:hidden; }
#precios .metodos-pago .container::before{ content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(#ff5468,#E4001E,#8f0a22); }
#precios .metodos-pago .container h3{ margin:0 0 8px;font-size:25px;color:#BA0D2A; }
#precios .metodos-pago .mp-texto p{ font-family:montserratmedium,fangsong;font-size:17px;line-height:1.4;color:#888; }
#precios .metodos-pago .mp-lista{ display:flex;flex-wrap:wrap;gap:14px;justify-content:center; }
#precios .metodos-pago .mp-lista li{ display:flex;flex-direction:column;align-items:center;gap:10px; }
#precios .metodos-pago .mp-ficha{ position:relative;overflow:hidden;width:112px;height:84px;display:grid;place-items:center;border-radius:18px;background:#fafafa;border:1px solid #eee;
  transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,border-color .35s ease; }
#precios .metodos-pago .mp-ficha i{ margin:0 !important; }
/* Destello que recorre las fichas una tras otra */
#precios .metodos-pago .mp-ficha::after{ content:"";position:absolute;top:0;bottom:0;left:-70%;width:45%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.75),transparent);transform:skewX(-20deg);
  animation:mpDestello 6s ease-in-out infinite; }
#precios .metodos-pago li:nth-child(2) .mp-ficha::after{ animation-delay:.25s; }
#precios .metodos-pago li:nth-child(3) .mp-ficha::after{ animation-delay:.5s; }
#precios .metodos-pago li:nth-child(4) .mp-ficha::after{ animation-delay:.75s; }
#precios .metodos-pago li:nth-child(5) .mp-ficha::after{ animation-delay:1s; }
@keyframes mpDestello{ 0%{ left:-70%; } 25%,100%{ left:140%; } }
#precios .metodos-pago .mp-lista li small{ font-size:13px;color:#999;transition:color .3s ease; }
#precios .metodos-pago .mp-lista li:hover .mp-ficha{ transform:translateY(-8px) rotate(-3deg);border-color:#f6c9d0;box-shadow:0 18px 32px rgba(186,13,42,.18); }
#precios .metodos-pago .mp-lista li:hover small{ color:#BA0D2A; }
/* Entrada: las fichas aparecen con un pequeño salto, una tras otra */
#precios .metodos-pago.anim .container{ opacity:0;translate:0 40px;transition:opacity .8s ease,translate .8s cubic-bezier(.2,.8,.2,1); }
#precios .metodos-pago.anim .mp-lista li{ opacity:0;scale:.6;transition:opacity .5s ease,scale .6s cubic-bezier(.3,1.6,.5,1); }
#precios .metodos-pago.anim .mp-lista li:nth-child(1){ transition-delay:.35s; }
#precios .metodos-pago.anim .mp-lista li:nth-child(2){ transition-delay:.47s; }
#precios .metodos-pago.anim .mp-lista li:nth-child(3){ transition-delay:.59s; }
#precios .metodos-pago.anim .mp-lista li:nth-child(4){ transition-delay:.71s; }
#precios .metodos-pago.anim .mp-lista li:nth-child(5){ transition-delay:.83s; }
#precios .metodos-pago.anim.visible .container{ opacity:1;translate:0 0; }
#precios .metodos-pago.anim.visible .mp-lista li{ opacity:1;scale:1; }

@media all and (max-width:900px){
  #precios .metodos-pago .container{ justify-content:center;text-align:center;padding:30px 20px;margin-bottom:40px; }
}
@media all and (max-width:430px){
  #precios .metodos-pago .mp-lista{ gap:12px; }
  #precios .metodos-pago .mp-ficha{ width:104px;height:78px;border-radius:14px; }
  #precios .metodos-pago .mp-ficha i{ scale:.85; }
}
@media (prefers-reduced-motion:reduce){
  #precios .metodos-pago .mp-ficha::after{ animation:none; }
}

/* ===== Nosotros · Nuestro sistema ===== */
#nosotros .descripcion{ position:relative;overflow:hidden; }
#nosotros .descripcion::before{ content:"";position:absolute;width:560px;height:560px;right:-220px;top:80px;border-radius:50%;filter:blur(90px);background:rgba(228,0,30,.08);animation:prFlotar 18s ease-in-out infinite alternate;pointer-events:none; }
#nosotros .descripcion .container{ position:relative;z-index:1; }
#nosotros .descripcion .container h2{ position:relative;display:inline-block; }
#nosotros .descripcion .container h2::after{ content:"";position:absolute;left:0;bottom:-10px;width:90px;height:4px;border-radius:4px;background:linear-gradient(90deg,#E4001E,#ff5468);transform:scaleX(0);transform-origin:left;transition:transform .8s ease .3s; }
#nosotros .descripcion.visible .container h2::after{ transform:scaleX(1); }
#nosotros .descripcion .container p strong{ font-weight:normal;color:#BA0D2A; }
/* Tarjetas */
#nosotros .descripcion .container ul li{ perspective:1000px; }
#nosotros .descripcion .container ul li div{ position:relative;overflow:hidden;background:#fff;border:1px solid #eee;border-radius:24px;box-shadow:0 16px 40px rgba(120,10,30,.09);
  transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--ty,0px));transition:transform .35s ease,box-shadow .35s ease; }
#nosotros .descripcion .container ul li div::before{ content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(150deg,#ff2d48 0%,#E4001E 45%,#8f0a22 100%);transform:translateY(101%);transition:transform .5s cubic-bezier(.2,.8,.2,1); }
#nosotros .descripcion .container ul li div > *{ position:relative;z-index:1; }
#nosotros .descripcion .container ul li div h3,
#nosotros .descripcion .container ul li div p{ transition:color .4s ease; }
#nosotros .descripcion .ns-ico{ display:inline-block;transition:transform .5s cubic-bezier(.2,.8,.2,1); }
/* Los íconos del sprite son semitransparentes: el filtro (definido en la vista) los vuelve sólidos */
#nosotros .descripcion .ns-ico{ filter:url(#nsAlfa); }
#nosotros .descripcion .ns-ico i.iconos{ display:block;background-image:none;background-color:#BA0D2A;transition:background-color .4s ease;
  -webkit-mask-image:url(../img/iconos.png);mask-image:url(../img/iconos.png);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat; }
#nosotros .descripcion .ns-ico .ns-1{ -webkit-mask-position:0 -361px;mask-position:0 -361px; }
#nosotros .descripcion .ns-ico .ns-2{ -webkit-mask-position:-170px -361px;mask-position:-170px -361px; }
#nosotros .descripcion .ns-ico .ns-3{ -webkit-mask-position:-319px -361px;mask-position:-319px -361px; }
#nosotros .descripcion .container ul li div:hover,
#nosotros .descripcion .container ul li div.resalta{ --ty:-10px;box-shadow:0 28px 54px rgba(186,13,42,.28); }
#nosotros .descripcion .container ul li div:hover::before,
#nosotros .descripcion .container ul li div.resalta::before{ transform:translateY(0); }
#nosotros .descripcion .container ul li div:hover h3,
#nosotros .descripcion .container ul li div.resalta h3,
#nosotros .descripcion .container ul li div:hover p,
#nosotros .descripcion .container ul li div.resalta p{ color:#fff; }
#nosotros .descripcion .container ul li div:hover .ns-ico,
#nosotros .descripcion .container ul li div.resalta .ns-ico{ transform:scale(1.08) rotate(-4deg); }
#nosotros .descripcion .container ul li div:hover .ns-ico i.iconos,
#nosotros .descripcion .container ul li div.resalta .ns-ico i.iconos{ background-color:#fff; }
/* Botón del demo */
#nosotros .descripcion .container a.b-animado{ position:relative;overflow:hidden;border-radius:50px;color:#fff;background:linear-gradient(135deg,#E4001E,#a10a24);font-size:26px;padding:16px 0;
  box-shadow:0 0 0 0 rgba(228,0,30,.6);animation:bannerLatido 2.4s ease-out infinite; }
#nosotros .descripcion .container a.b-animado::before{ content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);animation:prBrillo 3.5s ease-in-out infinite; }
#nosotros .descripcion .container a.b-animado::after{ content:" \2192"; }
/* Entrada al aparecer */
#nosotros .descripcion.anim .container > p,
#nosotros .descripcion.anim .container > a{ opacity:0;translate:0 30px;transition:opacity .8s ease,translate .8s cubic-bezier(.2,.8,.2,1); }
#nosotros .descripcion.anim .container > p:nth-of-type(2){ transition-delay:.15s; }
#nosotros .descripcion.anim .container ul li{ opacity:0;translate:0 50px;transition:opacity .8s ease,translate .8s cubic-bezier(.2,.8,.2,1); }
#nosotros .descripcion.anim .container ul li:nth-child(1){ transition-delay:.3s; }
#nosotros .descripcion.anim .container ul li:nth-child(2){ transition-delay:.45s; }
#nosotros .descripcion.anim .container ul li:nth-child(3){ transition-delay:.6s; }
#nosotros .descripcion.anim.visible .container > p,
#nosotros .descripcion.anim.visible .container > a,
#nosotros .descripcion.anim.visible .container ul li{ opacity:1;translate:0 0; }
@media (prefers-reduced-motion:reduce){
  #nosotros .descripcion::before,#nosotros .descripcion .container a.b-animado,#nosotros .descripcion .container a.b-animado::before{ animation:none !important; }
}

/* ===== Nosotros · llamado al demo ===== */
#nosotros .descripcion .ns-cta{ position:relative;overflow:hidden;display:flex;align-items:center;gap:30px 50px;margin:10px 0 60px;padding:44px 48px;border-radius:28px;color:#fff;
  background:linear-gradient(120deg,#6e0718 0%,#b10c28 45%,#E4001E 100%);background-size:200% 200%;animation:ctaFondo 12s ease-in-out infinite alternate;box-shadow:0 24px 50px rgba(186,13,42,.3); }
@keyframes ctaFondo{ from{ background-position:0% 50%; } to{ background-position:100% 50%; } }
/* Aros de señal que giran a la derecha */
#nosotros .ns-cta .ns-cta-aros,
#nosotros .ns-cta .ns-cta-aros::before,
#nosotros .ns-cta .ns-cta-aros::after{ position:absolute;border-radius:50%;pointer-events:none; }
#nosotros .ns-cta .ns-cta-aros{ width:420px;height:420px;right:-150px;top:50%;margin-top:-210px;border:2px dashed rgba(255,255,255,.18);animation:benBrillo 40s linear infinite; }
#nosotros .ns-cta .ns-cta-aros::before{ content:"";inset:60px;border:2px solid rgba(255,255,255,.12);border-top-color:rgba(255,255,255,.6);animation:benBrillo 6s linear infinite reverse; }
#nosotros .ns-cta .ns-cta-aros::after{ content:"";inset:130px;background:radial-gradient(circle,rgba(255,255,255,.25),transparent 70%);animation:ctaLatido 3s ease-in-out infinite; }
@keyframes ctaLatido{ 50%{ transform:scale(1.25);opacity:.5; } }
#nosotros .ns-cta .ns-cta-texto{ position:relative;z-index:1;flex:1;min-width:0; }
#nosotros .ns-cta p{ color:#fbe3e7;padding:0;font-size:21px;line-height:1.45;text-align:left; }
#nosotros .ns-cta p + p{ margin-top:16px; }
#nosotros .ns-cta .ns-cta-llamado{ color:#fff;font-size:24px;line-height:1.35; }
#nosotros .descripcion .container .ns-cta a.b-animado{ position:relative;z-index:1;flex:none;width:320px;max-width:100%;margin:0;color:#BA0D2A;background:#fff;font-size:22px;padding:18px 0;
  box-shadow:0 0 0 0 rgba(255,255,255,.6);animation:ctaPulso 2.4s ease-out infinite; }
#nosotros .descripcion .container .ns-cta a.b-animado::before{ background:linear-gradient(90deg,transparent,rgba(228,0,30,.18),transparent); }
@keyframes ctaPulso{ 0%{ box-shadow:0 0 0 0 rgba(255,255,255,.55); } 70%,100%{ box-shadow:0 0 0 16px rgba(255,255,255,0); } }
#nosotros .descripcion.anim .ns-cta{ opacity:0;scale:.94;transition:opacity .8s ease,scale .8s cubic-bezier(.2,.8,.2,1); }
#nosotros .descripcion.anim.visible .ns-cta{ opacity:1;scale:1; }
@media all and (max-width:900px){
  #nosotros .descripcion .ns-cta{ flex-direction:column;align-items:stretch;text-align:center;padding:34px 24px;margin-left:15px;margin-right:15px; }
  #nosotros .ns-cta p{ text-align:center;font-size:18px; }
  #nosotros .ns-cta .ns-cta-llamado{ font-size:20px; }
  #nosotros .descripcion .container .ns-cta a.b-animado{ width:100%;font-size:20px; }
  #nosotros .ns-cta .ns-cta-aros{ right:-220px;top:auto;bottom:-260px;margin-top:0; }
}

/* ===== Nosotros · ¿Por qué elegirnos? ===== */
#nosotros .caracteristicas{ position:relative;overflow:hidden; }
#nosotros .caracteristicas .container h2{ position:relative;text-align:center; }
#nosotros .caracteristicas .container h2::after{ content:"";display:block;width:90px;height:4px;margin-top:14px;border-radius:4px;background:linear-gradient(90deg,#E4001E,#ff5468);transform:scaleX(0);transition:transform .8s ease .2s;margin-left:auto;margin-right:auto; }
#nosotros .caracteristicas.visible .container h2::after{ transform:scaleX(1); }
/* Grilla con tarjetas de igual alto en cada fila */
#nosotros .caracteristicas .container ul{ display:flex;flex-wrap:wrap;padding:10px 0 30px; }
#nosotros .caracteristicas .container ul li{ float:none;display:flex;min-height:0;padding:0 14px 28px; }
#nosotros .caracteristicas .container ul li > div{ flex:1; }
#nosotros .caracteristicas .container ul li div{ position:relative;overflow:hidden;min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;padding:34px 24px;
  background:#fff;border:1px solid #eee;border-radius:24px;box-shadow:0 14px 34px rgba(120,10,30,.07);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,border-color .35s ease; }
#nosotros .caracteristicas .container ul li div p{ font-size:22px;line-height:1.35;transition:color .35s ease; }
/* Círculo del ícono con aro que gira al resaltar */
#nosotros .caracteristicas .pq-ico{ position:relative;width:170px;height:150px;display:grid;place-items:center;flex:none; }
#nosotros .caracteristicas .pq-ico::before{ content:"";position:absolute;inset:-6px 4px;border-radius:50%;background:#fdf0f2;transition:background-color .4s ease,transform .5s ease; }
#nosotros .caracteristicas .pq-ico::after{ content:"";position:absolute;inset:-14px -4px;border-radius:50%;border:2px dashed rgba(228,0,30,.35);opacity:0;transition:opacity .4s ease;animation:benBrillo 12s linear infinite; }
#nosotros .caracteristicas .container ul li div .pq-ico i.iconos{ position:relative;margin:0;scale:.72;background-image:none;background-color:#BA0D2A;transition:background-color .4s ease,scale .5s cubic-bezier(.2,.8,.2,1);
  -webkit-mask-image:url(../img/iconos.png);mask-image:url(../img/iconos.png);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat; }
#nosotros .caracteristicas .pq-ico .ns-caracteristicas-1{ -webkit-mask-position:0 -478px;mask-position:0 -478px; }
#nosotros .caracteristicas .pq-ico .ns-caracteristicas-2{ -webkit-mask-position:-152px -478px;mask-position:-152px -478px; }
#nosotros .caracteristicas .pq-ico .ns-caracteristicas-3{ -webkit-mask-position:-280px -478px;mask-position:-280px -478px; }
#nosotros .caracteristicas .pq-ico .ns-caracteristicas-4{ -webkit-mask-position:-407px -478px;mask-position:-407px -478px; }
#nosotros .caracteristicas .pq-ico .ns-caracteristicas-5{ -webkit-mask-position:-531px -478px;mask-position:-531px -478px; }
#nosotros .caracteristicas .pq-ico .ns-caracteristicas-6{ -webkit-mask-position:-617px -478px;mask-position:-617px -478px; }
#nosotros .caracteristicas .container ul li div:hover,
#nosotros .caracteristicas .container ul li div.resalta{ transform:translateY(-10px);border-color:#f6c9d0;box-shadow:0 26px 50px rgba(186,13,42,.18); }
#nosotros .caracteristicas .container ul li div:hover .pq-ico::before,
#nosotros .caracteristicas .container ul li div.resalta .pq-ico::before{ background:linear-gradient(150deg,#ff2d48,#BA0D2A);transform:scale(1.05); }
#nosotros .caracteristicas .container ul li div:hover .pq-ico::after,
#nosotros .caracteristicas .container ul li div.resalta .pq-ico::after{ opacity:1; }
#nosotros .caracteristicas .container ul li div:hover .pq-ico i.iconos,
#nosotros .caracteristicas .container ul li div.resalta .pq-ico i.iconos{ background-color:#fff;scale:.78; }
#nosotros .caracteristicas .container ul li div:hover p,
#nosotros .caracteristicas .container ul li div.resalta p{ color:#BA0D2A; }
/* Entrada escalonada */
#nosotros .caracteristicas.anim .container ul li{ opacity:0;translate:0 50px;transition:opacity .7s ease,translate .7s cubic-bezier(.2,.8,.2,1); }
#nosotros .caracteristicas.anim .container ul li:nth-child(2){ transition-delay:.1s; }
#nosotros .caracteristicas.anim .container ul li:nth-child(3){ transition-delay:.2s; }
#nosotros .caracteristicas.anim .container ul li:nth-child(4){ transition-delay:.3s; }
#nosotros .caracteristicas.anim .container ul li:nth-child(5){ transition-delay:.4s; }
#nosotros .caracteristicas.anim .container ul li:nth-child(6){ transition-delay:.5s; }
#nosotros .caracteristicas.anim.visible .container ul li{ opacity:1;translate:0 0; }
@media all and (max-width:430px){
  #nosotros .caracteristicas .container ul li div{ min-height:0;gap:18px;padding:30px 18px; }
  #nosotros .caracteristicas .container ul li div p{ font-size:19px; }
  #nosotros .caracteristicas .pq-ico{ width:140px;height:124px; }
  #nosotros .caracteristicas .container ul li div .pq-ico i.iconos{ scale:.6; }
}
@media (prefers-reduced-motion:reduce){
  #nosotros .descripcion .ns-cta,#nosotros .ns-cta .ns-cta-aros,#nosotros .ns-cta .ns-cta-aros::before,#nosotros .ns-cta .ns-cta-aros::after,
  #nosotros .descripcion .container .ns-cta a.b-animado,#nosotros .caracteristicas .pq-ico::after{ animation:none !important; }
}

/* ===== Página Características ===== */
@property --caAng{ syntax:'<angle>';inherits:false;initial-value:0deg; }
#caracteristicas .descripcion{ position:relative;overflow:hidden; }
#caracteristicas .descripcion::before{ content:"";position:absolute;width:600px;height:600px;left:-240px;top:200px;border-radius:50%;filter:blur(90px);background:rgba(228,0,30,.07);animation:prFlotar 18s ease-in-out infinite alternate;pointer-events:none; }
#caracteristicas .descripcion .container{ position:relative;z-index:1; }
#caracteristicas .descripcion .container h2{ position:relative;display:inline-block; }
#caracteristicas .descripcion .container h2::after{ content:"";position:absolute;left:0;bottom:-10px;width:90px;height:4px;border-radius:4px;background:linear-gradient(90deg,#E4001E,#ff5468);transform:scaleX(0);transform-origin:left;transition:transform .8s ease .3s; }
#caracteristicas .descripcion.visible .container h2::after{ transform:scaleX(1); }
#caracteristicas .descripcion .container h2 + p{ margin-top:26px; }
/* Tarjetas */
#caracteristicas .descripcion .container ul li{ perspective:1000px; }
#caracteristicas .descripcion .container ul li div{ background:#fff;border-radius:26px;border:1px solid #eee;box-shadow:0 16px 40px rgba(120,10,30,.08);overflow:hidden;
  transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--ty,0px));transition:transform .35s ease,box-shadow .35s ease; }
/* Borde de luz que gira alrededor de la tarjeta resaltada */
#caracteristicas .descripcion .container ul li div::before{ content:"";position:absolute;inset:0;border-radius:inherit;padding:2px;pointer-events:none;opacity:0;transition:opacity .4s ease;
  background:conic-gradient(from var(--caAng),transparent 0 55%,#ff5468 70%,#E4001E 82%,transparent 95%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  animation:caGirar 3s linear infinite; }
@keyframes caGirar{ to{ --caAng:360deg; } }
/* Luz que sigue al mouse dentro de la tarjeta */
#caracteristicas .descripcion .container ul li div::after{ content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .3s ease;
  background:radial-gradient(260px circle at var(--mx,50%) var(--my,30%),rgba(228,0,30,.09),transparent 70%); }
#caracteristicas .descripcion .container ul li div > *{ position:relative;z-index:1; }
#caracteristicas .descripcion .container ul li div h3,
#caracteristicas .descripcion .container ul li div p{ transition:color .35s ease; }
/* Número e ícono */
#caracteristicas .descripcion .ca-num{ position:absolute !important;top:22px;right:26px;font-size:44px;line-height:1;color:rgba(186,13,42,.10);transition:color .35s ease,transform .5s ease; }
#caracteristicas .descripcion .ca-ico{ position:absolute !important;top:22px;left:24px;width:96px;height:96px;border-radius:24px;background:#fdf0f2;display:grid;place-items:center;
  transition:background-color .4s ease,transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .4s ease; }
/* Los íconos del sprite son casi transparentes: el filtro (definido en la vista) los vuelve sólidos */
#caracteristicas .descripcion .ca-ico > span{ display:grid;place-items:center;filter:url(#caAlfa); }
#caracteristicas .descripcion .container ul li div .ca-ico i.iconos{ position:static;scale:.66;background-image:none;background-color:#BA0D2A;transition:background-color .4s ease;
  -webkit-mask-image:url(../img/iconos.png);mask-image:url(../img/iconos.png);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat; }
#caracteristicas .ca-ico .caracteristicas-1{ -webkit-mask-position:0 -602px;mask-position:0 -602px; }
#caracteristicas .ca-ico .caracteristicas-2{ -webkit-mask-position:-68px -602px;mask-position:-68px -602px; }
#caracteristicas .ca-ico .caracteristicas-3{ -webkit-mask-position:-148px -602px;mask-position:-148px -602px; }
#caracteristicas .ca-ico .caracteristicas-4{ -webkit-mask-position:-248px -602px;mask-position:-248px -602px; }
#caracteristicas .ca-ico .caracteristicas-5{ -webkit-mask-position:-351px -602px;mask-position:-351px -602px; }
#caracteristicas .ca-ico .caracteristicas-6{ -webkit-mask-position:-472px -602px;mask-position:-472px -602px; }
/* Resaltada: mouse o recorrido automático */
#caracteristicas .descripcion .container ul li div:hover,
#caracteristicas .descripcion .container ul li div.resalta{ --ty:-10px;box-shadow:0 28px 54px rgba(186,13,42,.18); }
#caracteristicas .descripcion .container ul li div:hover::before,
#caracteristicas .descripcion .container ul li div.resalta::before,
#caracteristicas .descripcion .container ul li div:hover::after{ opacity:1; }
#caracteristicas .descripcion .container ul li div:hover .ca-ico,
#caracteristicas .descripcion .container ul li div.resalta .ca-ico{ background:linear-gradient(150deg,#ff2d48,#BA0D2A);transform:rotate(-6deg) scale(1.06);box-shadow:0 12px 24px rgba(186,13,42,.35); }
#caracteristicas .descripcion .container ul li div:hover .ca-ico i.iconos,
#caracteristicas .descripcion .container ul li div.resalta .ca-ico i.iconos{ background-color:#fff; }
#caracteristicas .descripcion .container ul li div:hover .ca-num,
#caracteristicas .descripcion .container ul li div.resalta .ca-num{ color:rgba(186,13,42,.3);transform:translateY(-3px); }
/* Entrada escalonada */
#caracteristicas .descripcion.anim .container h2 + p{ opacity:0;translate:0 24px;transition:opacity .7s ease .1s,translate .7s ease .1s; }
#caracteristicas .descripcion.anim .container ul li{ opacity:0;translate:0 50px;transition:opacity .7s ease,translate .7s cubic-bezier(.2,.8,.2,1); }
#caracteristicas .descripcion.anim .container ul li:nth-child(1){ transition-delay:.2s; }
#caracteristicas .descripcion.anim .container ul li:nth-child(2){ transition-delay:.3s; }
#caracteristicas .descripcion.anim .container ul li:nth-child(3){ transition-delay:.4s; }
#caracteristicas .descripcion.anim .container ul li:nth-child(4){ transition-delay:.5s; }
#caracteristicas .descripcion.anim .container ul li:nth-child(5){ transition-delay:.6s; }
#caracteristicas .descripcion.anim .container ul li:nth-child(6){ transition-delay:.7s; }
#caracteristicas .descripcion.anim.visible .container h2 + p,
#caracteristicas .descripcion.anim.visible .container ul li{ opacity:1;translate:0 0; }
@media (prefers-reduced-motion:reduce){
  #caracteristicas .descripcion::before,#caracteristicas .descripcion .container ul li div::before{ animation:none !important; }
}

/* ===== Pie: el dedo de la foto "toca" la huella ===== */
/* La foto se copia en una capa propia (hereda imagen, tamaño y posición del pie) para poder moverla;
   --dx/--dy es la punta del dedo, la calcula el JS según cómo se ve la foto en cada pantalla */
footer{ isolation:isolate; }
.pie-foto{ position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:inherit;background-size:inherit;background-position:inherit;background-repeat:inherit;
  transform-origin:var(--dx,25%) var(--dy,50%);animation:pieDedo 3.6s ease-in-out infinite; }
/* Se aleja un poco (el dedo sube) y luego empuja hacia la huella (el dedo presiona) */
@keyframes pieDedo{
  0%,100%{ transform:scale(1.04) translateY(0); }
  38%{ transform:scale(1.03) translateY(-7px); }
  52%{ transform:scale(1.08) translateY(5px); }
  62%{ transform:scale(1.06) translateY(2px); }
}
/* Ondas y destello que salen de la huella en cada toque */
.pie-toque{ position:absolute;left:var(--dx,25%);top:var(--dy,50%);width:0;height:0;z-index:0;pointer-events:none; }
.pie-toque::before{ content:"";position:absolute;width:150px;height:150px;left:-75px;top:-75px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.85),rgba(255,140,160,.35) 35%,transparent 70%);opacity:0;animation:pieDestello 3.6s ease-out infinite; }
@keyframes pieDestello{ 0%,48%{ opacity:0;transform:scale(.4); } 54%{ opacity:1;transform:scale(1); } 80%,100%{ opacity:0;transform:scale(1.3); } }
.pie-toque b{ position:absolute;width:140px;height:140px;left:-70px;top:-70px;border-radius:50%;border:2px solid rgba(255,220,228,.9);opacity:0;animation:pieOnda 3.6s ease-out infinite; }
.pie-toque b:nth-child(2){ animation-name:pieOnda2; }
.pie-toque b:nth-child(3){ animation-name:pieOnda3; }
@keyframes pieOnda{ 0%,50%{ opacity:0;transform:scale(.4); } 54%{ opacity:.9; } 100%{ opacity:0;transform:scale(2.6); } }
@keyframes pieOnda2{ 0%,56%{ opacity:0;transform:scale(.4); } 60%{ opacity:.7; } 100%{ opacity:0;transform:scale(3.2); } }
@keyframes pieOnda3{ 0%,62%{ opacity:0;transform:scale(.4); } 66%{ opacity:.5; } 100%{ opacity:0;transform:scale(3.8); } }
footer.quieto .pie-foto,footer.quieto .pie-toque::before,footer.quieto .pie-toque b{ animation-play-state:paused; }
@media (prefers-reduced-motion:reduce){
  .pie-foto,.pie-toque::before,.pie-toque b{ animation:none !important; }
  .pie-toque{ display:none; }
}

/* ===== Página Demo · acceso al sistema demo ===== */
/* Ilustración que flota con un brillo suave */
#demo > .container > div > img.demo-ilus{ animation:demoFlotar 6s ease-in-out infinite;filter:drop-shadow(0 20px 30px rgba(90,60,200,.18)); }
@keyframes demoFlotar{ 0%,100%{ translate:0 0; } 50%{ translate:0 -16px; } }
/* Chispas de datos que suben alrededor de la ilustración (solo en pantallas anchas) */
.demo-chispas{ position:absolute;left:0;top:0;width:min(775px,50%);height:640px;pointer-events:none;z-index:1; }
.demo-chispas i{ position:absolute;bottom:10%;width:8px;height:8px;border-radius:50%;background:#ff5468;box-shadow:0 0 12px 3px rgba(255,84,104,.6);opacity:0;animation:demoChispa 5s ease-in infinite; }
.demo-chispas i:nth-child(even){ background:#8c7dff;box-shadow:0 0 12px 3px rgba(140,125,255,.6); }
.demo-chispas i:nth-child(1){ left:12%;animation-delay:0s; }   .demo-chispas i:nth-child(2){ left:24%;animation-delay:1.2s;animation-duration:6s; }
.demo-chispas i:nth-child(3){ left:38%;animation-delay:2.4s; }  .demo-chispas i:nth-child(4){ left:52%;animation-delay:.6s;animation-duration:5.5s; }
.demo-chispas i:nth-child(5){ left:64%;animation-delay:3s; }    .demo-chispas i:nth-child(6){ left:76%;animation-delay:1.8s;animation-duration:6.5s; }
.demo-chispas i:nth-child(7){ left:86%;animation-delay:3.6s; }  .demo-chispas i:nth-child(8){ left:30%;animation-delay:4.2s;animation-duration:4.5s; }
@keyframes demoChispa{ 0%{ opacity:0;transform:translateY(0) scale(.6); } 15%{ opacity:1; } 80%{ opacity:.8; } 100%{ opacity:0;transform:translateY(-420px) scale(1.1); } }
/* Textos */
#demo > .container > div > .right h2{ position:relative;display:inline-block; }
#demo > .container > div > .right h2::after{ content:"";position:absolute;left:50%;bottom:-10px;width:90px;height:4px;margin-left:-45px;border-radius:4px;background:linear-gradient(90deg,#E4001E,#ff5468);
  transform:scaleX(0);transition:transform .8s ease .3s; }
#demo p.demo-lema{ font-size:28px;line-height:1.3;color:#BA0D2A;text-align:center;margin-top:36px; }
#demo p.demo-texto{ text-align:left;margin-top:18px;line-height:1.35; }
/* Botón de WhatsApp */
#demo p + a.demo-wsp{ position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:14px;border-radius:50px;color:#fff;
  background:linear-gradient(135deg,#2bd96b,#128c4f);box-shadow:0 0 0 0 rgba(37,211,102,.55);animation:demoWsp 2.4s ease-out infinite; }
#demo p + a.demo-wsp::before{ content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);animation:prBrillo 3.5s ease-in-out infinite; }
#demo p + a.demo-wsp i{ flex:none;scale:1.3; }
@keyframes demoWsp{ 0%{ box-shadow:0 0 0 0 rgba(37,211,102,.55); } 70%,100%{ box-shadow:0 0 0 18px rgba(37,211,102,0); } }
/* Video: señal que late y botón de reproducir */
#demo > .container > div > .right .video > div img{ transform-origin:50% 100%;animation:demoSenal 2.6s ease-in-out infinite; }
@keyframes demoSenal{ 0%,100%{ opacity:.6;scale:.96; } 50%{ opacity:1;scale:1.04; } }
#demo > .container > div > .right .video > a img{ transition:scale .4s ease,filter .4s ease; }
#demo > .container > div > .right .video > a:hover img{ scale:1.02;filter:brightness(.92); }
.demo-play{ position:absolute;left:50%;top:50%;width:92px;height:92px;margin:-46px 0 0 -46px;border-radius:50%;background:linear-gradient(135deg,#E4001E,#a10a24);
  box-shadow:0 12px 30px rgba(186,13,42,.45);transition:transform .3s cubic-bezier(.2,.8,.2,1); }
.demo-play::before{ content:"";position:absolute;left:36px;top:28px;border-style:solid;border-width:18px 0 18px 28px;border-color:transparent transparent transparent #fff; }
.demo-play::after{ content:"";position:absolute;inset:0;border-radius:50%;border:3px solid rgba(228,0,30,.6);animation:demoOnda 2s ease-out infinite; }
@keyframes demoOnda{ from{ transform:scale(1);opacity:1; } to{ transform:scale(1.7);opacity:0; } }
#demo > .container > div > .right .video > a:hover .demo-play{ transform:scale(1.12); }
/* Entrada al aparecer */
#demo .demo-anim .right > div > *{ opacity:0;translate:0 30px;transition:opacity .7s ease,translate .7s cubic-bezier(.2,.8,.2,1); }
#demo .demo-anim .right > div > :nth-child(2){ transition-delay:.12s; }
#demo .demo-anim .right > div > :nth-child(3){ transition-delay:.24s; }
#demo .demo-anim .right > div > :nth-child(4){ transition-delay:.36s; }
#demo .demo-anim.visible .right > div:first-child > *,
#demo .demo-anim .right > div.visible > *{ opacity:1;translate:0 0; }
#demo .demo-anim .right > div.visible h2::after,
#demo .demo-anim.visible .right > div:first-child h2::after{ transform:scaleX(1); }
@media all and (max-width:1050px){
  .demo-chispas{ display:none; }
}
@media all and (max-width:510px){
  #demo p.demo-lema{ font-size:21px; }
  .demo-play{ width:64px;height:64px;margin:-32px 0 0 -32px; }
  .demo-play::before{ left:25px;top:19px;border-width:13px 0 13px 20px; }
}
@media (prefers-reduced-motion:reduce){
  #demo > .container > div > img.demo-ilus,.demo-chispas i,#demo p + a.demo-wsp,#demo p + a.demo-wsp::before,
  #demo > .container > div > .right .video > div img,.demo-play::after{ animation:none !important; }
  .demo-chispas{ display:none; }
}

/* ===== Demo: panel de vidrio, lema palabra por palabra, chips y mini pantallas del sistema ===== */
#demo > .container > div > .right > div:first-child{ position:relative; }
#demo .demo-panel{ position:relative;padding:40px 44px 46px;border-radius:30px;background:rgba(255,255,255,.72);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:0 24px 60px rgba(120,10,30,.12); }
/* Borde de luz que gira alrededor del panel */
#demo .demo-panel::before{ content:"";position:absolute;inset:0;border-radius:inherit;padding:2px;pointer-events:none;
  background:conic-gradient(from var(--caAng),rgba(228,0,30,.08) 0 55%,#ff5468 72%,#8c7dff 84%,rgba(228,0,30,.08) 96%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  animation:caGirar 4s linear infinite; }
#demo .demo-panel > *{ position:relative; }
#demo .demo-panel p{ max-width:none; }
/* Lema: las palabras entran una por una; "revolución" con brillo */
#demo p.demo-lema .pal{ display:inline-block;opacity:0;translate:0 18px;filter:blur(4px);transition:opacity .5s ease,translate .5s cubic-bezier(.2,.8,.2,1),filter .5s ease; }
#demo .visible p.demo-lema .pal{ opacity:1;translate:0 0;filter:blur(0); }
#demo p.demo-lema .pal.destaca{ background:linear-gradient(90deg,#E4001E,#8c7dff,#ff5468,#E4001E);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:demoDestaca 4s linear infinite; }
@keyframes demoDestaca{ to{ background-position:-300% 0; } }
/* Chips */
#demo .demo-chips{ display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:26px 0 0; }
#demo .demo-chips li{ display:inline-flex;align-items:center;gap:8px;padding:9px 16px 9px 10px;border-radius:30px;background:#fff;border:1px solid #f1d4d9;font-size:15px;line-height:1;color:#555;
  transition:transform .35s cubic-bezier(.2,.8,.2,1),background-color .35s ease,color .35s ease,border-color .35s ease,box-shadow .35s ease; }
#demo .demo-chips li::before{ content:"\2713";display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#E4001E;color:#fff;font-size:13px;transition:background-color .35s ease,color .35s ease; }
#demo .demo-chips li:hover,#demo .demo-chips li.resalta{ transform:translateY(-4px);background:#E4001E;border-color:#E4001E;color:#fff;box-shadow:0 10px 22px rgba(228,0,30,.3); }
#demo .demo-chips li:hover::before,#demo .demo-chips li.resalta::before{ background:#fff;color:#E4001E; }
/* Botón (ahora va después de los chips) */
#demo .demo-panel a.demo-wsp{ position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:14px;max-width:477px;width:100%;margin:34px 0 0;padding:16px 0 18px;
  border-radius:50px;font-size:30px;color:#fff;text-align:center;background:linear-gradient(135deg,#2bd96b,#128c4f);box-shadow:0 0 0 0 rgba(37,211,102,.55);animation:demoWsp 2.4s ease-out infinite; }
#demo .demo-panel a.demo-wsp::before{ content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);animation:prBrillo 3.5s ease-in-out infinite; }
#demo .demo-panel a.demo-wsp i{ flex:none;scale:1.3;animation:demoTimbre 3s ease-in-out infinite; }
@keyframes demoTimbre{ 0%,70%,100%{ rotate:0deg; } 75%{ rotate:-16deg; } 80%{ rotate:14deg; } 85%{ rotate:-10deg; } 90%{ rotate:6deg; } }
/* Entrada: el panel y sus partes, en cascada */
#demo .demo-anim .right .demo-panel > *{ opacity:0;translate:0 26px;transition:opacity .6s ease,translate .6s cubic-bezier(.2,.8,.2,1); }
#demo .demo-anim .right .demo-panel > :nth-child(2){ transition-delay:.1s; }
#demo .demo-anim .right .demo-panel > :nth-child(3){ transition-delay:.9s; }
#demo .demo-anim .right .demo-panel > :nth-child(4){ transition-delay:1.05s; }
#demo .demo-anim .right .demo-panel > :nth-child(5){ transition-delay:1.2s; }
#demo .demo-anim.visible .right .demo-panel > *{ opacity:1;translate:0 0; }
#demo .demo-anim .right .demo-panel > p.demo-lema{ opacity:1;translate:0 0; }

/* Mini pantallas del sistema sobre la ilustración (pantallas anchas) */
.demo-widgets{ position:absolute;left:0;top:0;width:min(775px,50%);height:620px;pointer-events:none;z-index:2; }
.demo-widgets .dw{ position:absolute;display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:18px;background:rgba(255,255,255,.82);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:0 18px 40px rgba(60,30,140,.18);border:1px solid rgba(255,255,255,.9);color:#444;font-size:14px;line-height:1.25;opacity:0;scale:.8;
  transition:opacity .6s ease,scale .6s cubic-bezier(.3,1.5,.5,1); }
#demo .visible .demo-widgets .dw,.demo-anim.visible .demo-widgets .dw{ opacity:1;scale:1; }
.demo-widgets .dw-aviso{ left:2%;top:70px;min-width:230px;transition-delay:1.2s;animation:dwFlotar 5s ease-in-out 1.8s infinite; }
.demo-widgets .dw-grafico{ right:4%;top:430px;flex-direction:column;align-items:flex-start;gap:8px;transition-delay:1.5s;animation:dwFlotar 6s ease-in-out 2.4s infinite reverse; }
.demo-widgets .dw-estado{ right:10%;top:30px;font-size:13px;gap:8px;transition-delay:1.8s;animation:dwFlotar 4.5s ease-in-out 2s infinite; }
@keyframes dwFlotar{ 50%{ translate:0 -10px; } }
.demo-widgets .dw-ico{ flex:none;width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,#ff3a52,#BA0D2A);display:grid;place-items:center;color:#fff;font-style:normal;font-size:18px; }
.demo-widgets .dw-ico::before{ content:var(--ico,"\2713"); }
.demo-widgets .dw-aviso b{ display:block;color:#222;font-size:14px; }
.demo-widgets .dw-aviso small{ color:#999;font-size:12px; }
.demo-widgets .dw-aviso > span{ transition:opacity .3s ease,translate .3s ease; }
.demo-widgets .dw-aviso.cambia > span,.demo-widgets .dw-aviso.cambia .dw-ico{ opacity:0;translate:0 8px; }
.demo-widgets .dw-aviso .dw-ico{ transition:opacity .3s ease,translate .3s ease; }
.demo-widgets .dw-grafico small{ color:#777;font-size:12px; }
.demo-widgets .dw-barras{ display:flex;align-items:flex-end;gap:6px;height:58px; }
.demo-widgets .dw-barras i{ width:14px;height:var(--h,40%);border-radius:4px 4px 0 0;background:linear-gradient(#ff5468,#BA0D2A);transition:height .9s cubic-bezier(.4,0,.2,1); }
.demo-widgets .dw-barras i:nth-child(even){ background:linear-gradient(#a79bff,#5b4bd6); }
.demo-widgets .dw-punto{ width:10px;height:10px;border-radius:50%;background:#2bd96b;box-shadow:0 0 0 0 rgba(43,217,107,.7);animation:carPunto 1.8s ease-out infinite; }

@media all and (max-width:1050px){
  .demo-widgets{ display:none; }
  #demo .demo-panel{ padding:32px 22px 36px;margin:0 15px; }
}
@media all and (max-width:510px){
  #demo .demo-panel a.demo-wsp{ font-size:20px;gap:10px; }
  #demo .demo-chips li{ font-size:13px; }
}
@media (prefers-reduced-motion:reduce){
  #demo .demo-panel::before,#demo p.demo-lema .pal.destaca,#demo .demo-panel a.demo-wsp,#demo .demo-panel a.demo-wsp::before,#demo .demo-panel a.demo-wsp i,.demo-widgets .dw{ animation:none !important; }
}

/* ===== Demo: el video se reproduce (sin sonido) al pasar el mouse ===== */
#demo > .container > div > .right .video > a .demo-vista{ position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:6px;pointer-events:none;opacity:0;background:#000;transition:opacity .45s ease; }
#demo > .container > div > .right .video > a.reproduciendo.cargado .demo-vista{ opacity:1; }
#demo > .container > div > .right .video > a .demo-play{ transition:transform .3s cubic-bezier(.2,.8,.2,1),opacity .3s ease; }
#demo > .container > div > .right .video > a.reproduciendo.cargado .demo-play{ opacity:0;transform:scale(.6); }
#demo > .container > div > .right .video > a::after{ content:"\1F50A  Haz clic para verlo con sonido";position:absolute;left:50%;bottom:18px;transform:translate(-50%,10px);padding:9px 16px;border-radius:30px;
  background:rgba(0,0,0,.72);color:#fff;font-size:14px;line-height:1;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .3s ease,transform .3s ease;z-index:2; }
#demo > .container > div > .right .video > a.reproduciendo.cargado::after{ opacity:1;transform:translate(-50%,0); }

/* ===== Demo · Área de soporte: la red de la ilustración cobra vida ===== */
#demo > .area-soporte{ position:relative;overflow:hidden; }
#demo > .area-soporte .so-ilus{ position:relative;display:inline-block;max-width:100%;vertical-align:top; }
#demo > .area-soporte .so-ilus > img{ display:block;max-width:100%; }
/* Señal wifi que late en cada nube y equipo */
.so-onda{ position:absolute;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;border:2px solid rgba(228,0,30,.55);pointer-events:none;opacity:0;animation:soOnda 3.2s ease-out infinite; }
@keyframes soOnda{ 0%{ transform:scale(.3);opacity:0; } 15%{ opacity:.9; } 100%{ transform:scale(1.6);opacity:0; } }
/* Paquetes de datos que viajan por los cables entre la nube y los equipos */
.so-dato{ position:absolute;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#E4001E;box-shadow:0 0 0 4px rgba(228,0,30,.15),0 0 14px 4px rgba(228,0,30,.55);
  pointer-events:none;opacity:0;animation:soViaje 3.4s cubic-bezier(.5,0,.5,1) infinite; }
@keyframes soViaje{ 0%{ top:var(--y1);opacity:0; } 12%{ opacity:1; } 88%{ opacity:1; } 100%{ top:var(--y2);opacity:0; } }
/* Pantallas de los equipos: barras de actividad que se llenan */
.so-pantalla{ position:absolute;pointer-events:none;border-radius:3px;overflow:hidden;
  background:repeating-linear-gradient(transparent 0 14%,rgba(228,0,30,.16) 14% 24%,transparent 24% 34%);background-size:100% 100%;
  clip-path:inset(0 100% 0 0);animation:soPantalla 4s ease-in-out infinite; }
@keyframes soPantalla{ 0%{ clip-path:inset(0 100% 0 0); } 45%,70%{ clip-path:inset(0 0 0 0); } 100%{ clip-path:inset(0 0 0 100%); } }
/* Texto y botón */
#demo > .area-soporte .container .tbl .left h2{ position:relative; }
#demo > .area-soporte .container .tbl .left h2::after{ content:"";display:block;width:80px;height:4px;margin:14px auto 0;border-radius:4px;background:linear-gradient(90deg,#E4001E,#ff5468);transform:scaleX(0);transition:transform .8s ease .3s; }
#demo > .area-soporte.visible .container .tbl .left h2::after{ transform:scaleX(1); }
#demo > .area-soporte .container .tbl .left p{ text-align:left;line-height:1.35; }
#demo > .area-soporte .container .tbl .left p + a{ position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:12px;border-radius:50px;color:#fff;
  background:linear-gradient(135deg,#E4001E,#a10a24);box-shadow:0 10px 24px rgba(186,13,42,.3); }
#demo > .area-soporte .container .tbl .left p + a::before{ content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);animation:prBrillo 3.5s ease-in-out infinite; }
#demo > .area-soporte .container .tbl .left p + a::after{ content:"\2193";display:inline-block;animation:soFlecha 1.6s ease-in-out infinite; }
@keyframes soFlecha{ 0%,100%{ transform:translateY(-2px); } 50%{ transform:translateY(4px); } }
/* Arcos de señal de la izquierda: se encienden de adentro hacia afuera */
#demo > .area-soporte .container .tbl .left > div img{ transform-origin:50% 100%;animation:demoSenal 2.6s ease-in-out infinite; }
/* Entrada al aparecer */
#demo > .area-soporte.anim .tbl .left > *{ opacity:0;translate:-30px 0;transition:opacity .7s ease,translate .7s cubic-bezier(.2,.8,.2,1); }
#demo > .area-soporte.anim .tbl .left > :nth-child(2){ transition-delay:.12s; }
#demo > .area-soporte.anim .tbl .left > :nth-child(3){ transition-delay:.24s; }
#demo > .area-soporte.anim .tbl .left > :nth-child(4){ transition-delay:.36s; }
#demo > .area-soporte.anim .tbl .right .so-ilus{ opacity:0;scale:.92;transition:opacity .9s ease .2s,scale .9s cubic-bezier(.2,.8,.2,1) .2s; }
#demo > .area-soporte.anim.visible .tbl .left > *{ opacity:1;translate:0 0; }
#demo > .area-soporte.anim.visible .tbl .right .so-ilus{ opacity:1;scale:1; }
@media all and (max-width:510px){
  .so-onda{ width:40px;height:40px;margin:-20px 0 0 -20px; }
  .so-dato{ width:9px;height:9px;margin:-4.5px 0 0 -4.5px; }
}
@media (prefers-reduced-motion:reduce){
  .so-onda,.so-dato,.so-pantalla,#demo > .area-soporte .container .tbl .left p + a::before,#demo > .area-soporte .container .tbl .left p + a::after,
  #demo > .area-soporte .container .tbl .left > div img{ animation:none !important; }
  .so-onda,.so-dato{ display:none; }
}

/* ===== Página Precios: encabezado ===== */
#precios .descripcion{ position:relative;overflow:hidden; }
#precios .descripcion::before{ content:"";position:absolute;width:520px;height:520px;left:-180px;top:160px;border-radius:50%;filter:blur(80px);background:rgba(228,0,30,.09);animation:prFlotar 16s ease-in-out infinite alternate;pointer-events:none; }
#precios .descripcion::after{ content:"";position:absolute;width:440px;height:440px;right:-140px;bottom:0;border-radius:50%;filter:blur(80px);background:rgba(255,84,104,.1);animation:prFlotar 20s ease-in-out infinite alternate-reverse;pointer-events:none; }
#precios .descripcion .container{ position:relative;z-index:1; }
#precios .descripcion .container h2{ position:relative;display:inline-block; }
#precios .descripcion .container h2::after{ content:"";position:absolute;left:50%;bottom:-10px;width:60px;height:3px;margin-left:-30px;border-radius:3px;background:linear-gradient(90deg,#E4001E,#ff5468);transform:scaleX(0);transition:transform .8s ease .2s; }
#precios .descripcion.visible .container h2::after{ transform:scaleX(1); }
#precios .descripcion .container .subtitulo{ display:block;background:linear-gradient(90deg,#BA0D2A 0%,#BA0D2A 40%,#ff6b80 50%,#BA0D2A 60%,#BA0D2A 100%);background-size:250% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;animation:pdTexto 5s linear infinite; }
#precios .descripcion .container h2,
#precios .descripcion .container .subtitulo{ opacity:0;translate:0 24px;transition:opacity .7s ease,translate .7s ease; }
#precios .descripcion .container .subtitulo{ transition-delay:.15s; }
#precios .descripcion.visible .container h2,
#precios .descripcion.visible .container .subtitulo{ opacity:1;translate:0 0; }
@media (prefers-reduced-motion:reduce){
  #precios .descripcion::before,#precios .descripcion::after,#precios .descripcion .container .subtitulo{ animation:none !important; }
}

/* ===== Página Precios · Incluye ===== */
#precios .incluye{ position:relative;overflow:hidden; }
#precios .incluye .container .subtitulo{ position:relative;display:inline-block; }
#precios .incluye .container .subtitulo::after{ content:"";position:absolute;left:50%;bottom:-12px;width:70px;height:4px;margin-left:-35px;border-radius:4px;background:linear-gradient(90deg,#E4001E,#ff5468);transform:scaleX(0);transition:transform .8s ease .2s; }
#precios .incluye.visible .container .subtitulo::after{ transform:scaleX(1); }
/* Tarjetas del mismo alto */
#precios .incluye .container ul{ display:flex;flex-wrap:wrap;padding-top:46px; }
#precios .incluye .container ul li{ float:none;display:flex;justify-content:center;padding:0 12px 28px; }
#precios .incluye .container ul li > div{ position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:20px;padding:30px 20px 28px;background:#fff;border:1px solid #eee;border-radius:24px;
  box-shadow:0 14px 34px rgba(120,10,30,.07);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,border-color .35s ease; }
#precios .incluye .container ul li > div span:not(.inc-ico){ padding:0;transition:color .35s ease; }
/* Ícono en círculo; se pinta con máscara para poder cambiarle el color */
#precios .incluye .inc-ico{ position:relative;width:150px;height:150px;border-radius:50%;background:#fdf0f2;display:grid;place-items:center;flex:none;transition:background-color .4s ease,transform .5s ease; }
#precios .incluye .inc-ico i.iconos{ background-image:none;background-color:#BA0D2A;transition:background-color .4s ease;
  -webkit-mask-image:url(../img/iconos.png);mask-image:url(../img/iconos.png);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat; }
#precios .incluye .inc-1{ -webkit-mask-position:0 -746px;mask-position:0 -746px; }
#precios .incluye .inc-2{ -webkit-mask-position:-74px -746px;mask-position:-74px -746px; }
#precios .incluye .inc-3{ -webkit-mask-position:-171px -746px;mask-position:-171px -746px; }
#precios .incluye .inc-4{ -webkit-mask-position:-298px -746px;mask-position:-298px -746px; }
/* La regla vieja de los textos (span) no debe afectar al círculo del ícono */
#precios .incluye .container ul li > div span.inc-ico{ display:grid;padding:0;font-size:15px; }
/* Cada ícono con su propio movimiento */
.inc-ico.ic-soporte i{ transform-origin:50% 90%;animation:incHabla 2.4s ease-in-out infinite; }
@keyframes incHabla{ 0%,60%,100%{ rotate:0deg; } 65%{ rotate:-6deg; } 72%{ rotate:6deg; } 79%{ rotate:-4deg; } 86%{ rotate:3deg; } }
.inc-ico.ic-soporte::after{ content:"";position:absolute;width:12px;height:12px;right:26px;top:30px;border-radius:50%;background:#2bd96b;box-shadow:0 0 0 0 rgba(43,217,107,.7);animation:carPunto 1.8s ease-out infinite; }
.inc-ico.ic-hosting i{ animation:incSube 3s ease-in-out infinite; }
@keyframes incSube{ 50%{ translate:0 -7px; } }
.inc-ico.ic-hosting::after{ content:"";position:absolute;left:50%;bottom:22px;width:56px;height:8px;margin-left:-28px;border-radius:50%;background:rgba(186,13,42,.18);animation:incSombra 3s ease-in-out infinite; }
@keyframes incSombra{ 50%{ transform:scaleX(.7);opacity:.5; } }
.inc-ico.ic-update::before{ content:"";position:absolute;inset:8px;border-radius:50%;border:2px dashed rgba(228,0,30,.4);animation:benBrillo 6s linear infinite; }
.inc-ico.ic-update i{ animation:incLatido 2s ease-in-out infinite; }
@keyframes incLatido{ 50%{ scale:1.07; } }
.inc-ico.ic-seguro i{ animation:incCandado 3.2s ease-in-out infinite; }
@keyframes incCandado{ 0%,70%,100%{ translate:0 0; } 74%{ translate:-3px 0; } 78%{ translate:3px 0; } 82%{ translate:-2px 0; } 86%{ translate:2px 0; } }
.inc-ico.ic-seguro::after{ content:"\2713";position:absolute;right:22px;bottom:24px;width:26px;height:26px;border-radius:50%;background:#2bd96b;color:#fff;font-size:15px;line-height:26px;text-align:center;
  box-shadow:0 4px 10px rgba(43,217,107,.4);scale:0;animation:incCheck 3.2s ease-in-out infinite; }
@keyframes incCheck{ 0%,86%{ scale:0; } 92%,100%{ scale:1; } }
/* Resaltada: mouse o recorrido automático */
#precios .incluye .container ul li > div:hover,
#precios .incluye .container ul li > div.resalta{ transform:translateY(-10px);border-color:#f6c9d0;box-shadow:0 26px 50px rgba(186,13,42,.18); }
#precios .incluye .container ul li > div:hover .inc-ico,
#precios .incluye .container ul li > div.resalta .inc-ico{ background:linear-gradient(150deg,#ff2d48,#BA0D2A);transform:scale(1.05); }
#precios .incluye .container ul li > div:hover .inc-ico i.iconos,
#precios .incluye .container ul li > div.resalta .inc-ico i.iconos{ background-color:#fff; }
#precios .incluye .container ul li > div:hover span:not(.inc-ico),
#precios .incluye .container ul li > div.resalta span:not(.inc-ico){ color:#BA0D2A; }
/* Entrada escalonada */
#precios .incluye.anim .container ul li{ opacity:0;translate:0 40px;transition:opacity .7s ease,translate .7s cubic-bezier(.2,.8,.2,1); }
#precios .incluye.anim .container ul li:nth-child(2){ transition-delay:.12s; }
#precios .incluye.anim .container ul li:nth-child(3){ transition-delay:.24s; }
#precios .incluye.anim .container ul li:nth-child(4){ transition-delay:.36s; }
#precios .incluye.anim.visible .container ul li{ opacity:1;translate:0 0; }
@media all and (max-width:430px){
  #precios .incluye .inc-ico{ width:124px;height:124px; }
  #precios .incluye .inc-ico i.iconos{ scale:.85; }
}
@media (prefers-reduced-motion:reduce){
  .inc-ico i,.inc-ico::before,.inc-ico::after{ animation:none !important; }
  .inc-ico.ic-seguro::after{ scale:1; }
}

/* ===== Página Precios · Consideraciones: línea de pasos ===== */
/* Las tarjetas entran desde la derecha: sin esto ensanchan la página en celular */
#precios .consideraciones{ overflow:hidden; }
#precios .consideraciones .container h2{ position:relative;display:inline-block; }
#precios .consideraciones .container h2::after{ content:"";position:absolute;left:0;bottom:-10px;width:80px;height:4px;border-radius:4px;background:linear-gradient(90deg,#E4001E,#ff5468);transform:scaleX(0);transform-origin:left;transition:transform .8s ease .2s; }
#precios .consideraciones.visible .container h2::after{ transform:scaleX(1); }
#precios .consideraciones .container .listado{ position:relative;isolation:isolate;padding-top:40px;padding-bottom:40px;max-width:1016px; }
/* Línea que une los pasos (gris) y se llena de rojo */
#precios .consideraciones .container .listado::before,
#precios .consideraciones .container .listado::after{ content:"";position:absolute;left:38px;top:80px;bottom:100px;width:3px;border-radius:3px;background:#e4e4e4;z-index:0; }
#precios .consideraciones .container .listado::after{ background:linear-gradient(#E4001E,#ff5468);transform:scaleY(0);transform-origin:top;transition:transform 2.6s cubic-bezier(.4,0,.2,1) .3s; }
#precios .consideraciones.visible .container .listado::after{ transform:scaleY(1); }
/* Cada paso en una tarjeta */
#precios .consideraciones .container .listado li{ position:relative;z-index:1;max-width:none;margin:0 0 18px;padding:22px 26px 22px 80px;text-align:left;line-height:1.4;background:#fff;border:1px solid #eee;border-radius:20px;
  box-shadow:0 10px 26px rgba(120,10,30,.06);transition:transform .35s cubic-bezier(.2,.8,.2,1),border-color .35s ease,box-shadow .35s ease,color .35s ease; }
#precios .consideraciones .container .listado li:last-child{ padding-bottom:22px; }
#precios .consideraciones .container .listado li:before{ left:18px;top:50%;margin-top:-21px;border-radius:50%;background-color:#fff;transition:transform .5s cubic-bezier(.3,1.6,.5,1); }
#precios .consideraciones .container .listado li::after{ content:"";position:absolute;left:18px;top:50%;width:42px;height:42px;margin-top:-21px;border-radius:50%;pointer-events:none; }
#precios .consideraciones .container .listado li:hover,
#precios .consideraciones .container .listado li.resalta{ transform:translateX(8px);border-color:#f6c9d0;box-shadow:0 16px 34px rgba(186,13,42,.14);color:#4a4a4a; }
#precios .consideraciones .container .listado li:hover:before,
#precios .consideraciones .container .listado li.resalta:before{ transform:scale(1.15); }
#precios .consideraciones .container .listado li:hover::after,
#precios .consideraciones .container .listado li.resalta::after{ animation:carLatido 1.2s ease-out; }
/* Entrada: los pasos aparecen en orden y el check entra girando */
#precios .consideraciones.anim .container .listado li{ opacity:0;translate:40px 0;transition:opacity .6s ease,translate .6s cubic-bezier(.2,.8,.2,1),transform .35s cubic-bezier(.2,.8,.2,1),border-color .35s ease,box-shadow .35s ease,color .35s ease; }
#precios .consideraciones.anim .container .listado li:before{ transform:scale(0) rotate(-90deg); }
#precios .consideraciones.anim.visible .container .listado li{ opacity:1;translate:0 0; }
#precios .consideraciones.anim.visible .container .listado li:before{ transform:scale(1) rotate(0); }
#precios .consideraciones.anim.visible .container .listado li:nth-child(1){ transition-delay:.3s,.3s,0s,0s,0s,0s; } #precios .consideraciones.anim.visible .container .listado li:nth-child(1):before{ transition-delay:.6s; }
#precios .consideraciones.anim.visible .container .listado li:nth-child(2){ transition-delay:.75s,.75s,0s,0s,0s,0s; } #precios .consideraciones.anim.visible .container .listado li:nth-child(2):before{ transition-delay:1.05s; }
#precios .consideraciones.anim.visible .container .listado li:nth-child(3){ transition-delay:1.2s,1.2s,0s,0s,0s,0s; } #precios .consideraciones.anim.visible .container .listado li:nth-child(3):before{ transition-delay:1.5s; }
#precios .consideraciones.anim.visible .container .listado li:nth-child(4){ transition-delay:1.65s,1.65s,0s,0s,0s,0s; } #precios .consideraciones.anim.visible .container .listado li:nth-child(4):before{ transition-delay:1.95s; }
#precios .consideraciones.anim.visible .container .listado li:nth-child(5){ transition-delay:2.1s,2.1s,0s,0s,0s,0s; } #precios .consideraciones.anim.visible .container .listado li:nth-child(5):before{ transition-delay:2.4s; }
#precios .consideraciones.anim.visible .container .listado li.resalta:before,
#precios .consideraciones.anim.visible .container .listado li:hover:before{ transform:scale(1.15);transition-delay:0s; }
@media all and (max-width:510px){
  #precios .consideraciones .container .listado li{ padding:18px 16px 18px 66px;font-size:17px; }
  #precios .consideraciones .container .listado li:before,#precios .consideraciones .container .listado li::after{ left:12px; }
  #precios .consideraciones .container .listado::before,#precios .consideraciones .container .listado::after{ left:32px; }
}

/* ===== Menú: botón de la persona (iniciar sesión / mi cuenta) ===== */
header .container .tbl > div nav > ul > li.nav-cuenta{ margin-right:0; }
header .container .tbl > div nav > ul > li > a.cuenta-btn{ position:relative;display:inline-grid;place-items:center;width:46px;height:46px;border-radius:50%;
  border:2px solid rgba(255,255,255,.7);background:rgba(255,255,255,.1);color:#fff;transition:background-color .25s ease,color .25s ease,transform .25s ease,border-color .25s ease; }
header .container .tbl > div nav > ul > li > a.cuenta-btn:hover,
header .container .tbl > div nav > ul > li > a.cuenta-btn.active{ background:#fff;color:#BA0D2A !important;border-color:#fff;transform:scale(1.06); }
header .container .tbl > div nav > ul > li > a.cuenta-btn .cuenta-txt{ position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0); }
/* Con sesión: punto verde de "conectado" */
header .container .tbl > div nav > ul > li > a.cuenta-btn.conectado::after{ content:"";position:absolute;right:-1px;top:-1px;width:12px;height:12px;border-radius:50%;background:#2bd96b;border:2px solid #BA0D2A;
  box-shadow:0 0 0 0 rgba(43,217,107,.7);animation:carPunto 1.8s ease-out infinite; }
header .container .tbl > div nav > ul > li.nav-cuenta > a + ul{ left:auto;right:0;top:46px;min-width:240px;border-radius:14px;overflow:hidden;box-shadow:0 18px 40px rgba(0,0,0,.2); }
header .container .tbl > div nav > ul > li.nav-cuenta > a + ul > li:first-child{ margin-top:10px; }
header .container .tbl > div nav > ul > li.nav-cuenta .cuenta-info{ padding:12px 14px 10px;border-bottom:1px solid #f0f0f0;white-space:normal; }
header .container .tbl > div nav > ul > li.nav-cuenta .cuenta-info b{ display:block;font-weight:normal;color:#BA0D2A;font-size:15px;line-height:1.3; }
header .container .tbl > div nav > ul > li.nav-cuenta .cuenta-info small{ display:block;font-size:12px;color:#999;margin-top:3px;line-height:1.3; }
header .container .tbl > div nav > ul > li.nav-cuenta a.cuenta-salir{ color:#BA0D2A; }
/* En el menú del celular se ve como texto */
header .container .tbl > div .contenedor-menu-icon.active + nav > ul > li > a.cuenta-btn{ display:flex;width:auto;height:auto;border:0;border-radius:0;background:none;gap:10px;justify-content:flex-start;transform:none; }
header .container .tbl > div .contenedor-menu-icon.active + nav > ul > li > a.cuenta-btn .cuenta-txt{ position:static;width:auto;height:auto;clip:auto; }
header .container .tbl > div .contenedor-menu-icon.active + nav > ul > li > a.cuenta-btn.conectado::after{ display:none; }
@media (prefers-reduced-motion:reduce){ header .container .tbl > div nav > ul > li > a.cuenta-btn.conectado::after{ animation:none; } }

/* ===== Menú: botón del carrito ===== */
header .container .tbl > div nav > ul > li.nav-carrito{ margin-right:12px; }
header .container .tbl > div nav > ul > li > a.carrito-btn{ position:relative;display:inline-grid;place-items:center;width:46px;height:46px;border-radius:50%;
  border:2px solid rgba(255,255,255,.7);background:rgba(255,255,255,.1);color:#fff;transition:background-color .25s ease,color .25s ease,transform .25s ease; }
header .container .tbl > div nav > ul > li > a.carrito-btn:hover{ background:#fff;color:#BA0D2A !important;transform:scale(1.06); }
header .container .tbl > div nav > ul > li > a.carrito-btn b{ position:absolute;right:-6px;top:-6px;min-width:22px;height:22px;padding:0 5px;border-radius:11px;background:#fff;color:#BA0D2A;
  font-weight:normal;font-size:12px;line-height:22px;text-align:center;box-shadow:0 3px 8px rgba(0,0,0,.25);animation:catSalta .5s ease; }
header .container .tbl > div nav > ul > li > a.carrito-btn b[hidden]{ display:none; }
header .container .tbl > div nav > ul > li > a.carrito-btn .cuenta-txt{ position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0); }
header .container .tbl > div .contenedor-menu-icon.active + nav > ul > li > a.carrito-btn{ display:flex;width:auto;height:auto;border:0;border-radius:0;background:none;gap:10px;justify-content:flex-start;transform:none; }
header .container .tbl > div .contenedor-menu-icon.active + nav > ul > li > a.carrito-btn b{ position:static;box-shadow:none; }
header .container .tbl > div .contenedor-menu-icon.active + nav > ul > li > a.carrito-btn .cuenta-txt{ position:static;width:auto;height:auto;clip:auto; }

/* ===== Menú en laptops (1361–1800 px): todo en una sola línea, con el carrito y la persona incluidos ===== */
@media all and (min-width:1361px) and (max-width:1800px){
  header .container .tbl > div nav{ padding-left:30px;padding-right:30px; }
  header .container .tbl > div nav > ul{ display:flex;justify-content:space-between;align-items:center; }
  header .container .tbl > div nav > ul > li{ margin:0; }
  header .container .tbl > div nav > ul > li > a{ font-size:clamp(22px,1.65vw,28.23px); }
  header .container .tbl > div nav > ul > li > a + ul{ top:100%; }
}