/* Forzar color naranja en iconos de formación y eventos con máxima especificidad */
#formacion .service-block i.fa,
#formacion .service-block i.fas,
#formacion .service-block i.far,
#formacion .service-block i.fal,
#formacion .service-block i.fab,
.events-area .event-block i.fa,
.events-area .event-block i.fas,
.events-area .event-block i.far,
.events-area .event-block i.fal,
.events-area .event-block i.fab {
  color: #e45447 !important;
}
/* Iconos naranja en formación y eventos */
#formacion .service-block i,
.events-area .event-block i {
  color: #e45447 !important;
}
/* Todos los iconos FontAwesome en naranja */
i.fa, i.fas, i.far, i.fal, i.fab {
  color: #e45447 !important;
}
/* Iconos naranja en sección venta online */
#venta-online .service-block i {
  color: #e45447 !important;
}
/* Botón invertido: gris por defecto, naranja al hacer hover, con animación */
.btn-invert {
  background: #e45447 !important;
  color: #fff !important;
  border: none !important;
  position: relative;
  overflow: hidden;
}
.btn-invert::before {
  background: #90acd1 !important;
  z-index: 1;
  transform: scaleX(0) !important;
}
.btn-invert:hover::before {
  background: #90acd1 !important;
  transform: scaleX(1) !important;
}
.btn-invert:hover,
.btn-invert:focus {
  color: #fff !important;
}
/*
Template Name: Cobra - Vue Personal Portfolio Template
Version: 2.0
Author: Karim Ezzat
Author URI: http://themeforest.net/user/karimezzat
Description: Cobra on-page Website Responsive Vue Template
Tags: One-Page, Nuxt, Vue, Website, Business, Portfolio, Responsive, Vue, Css3, jQuery, Bootstrap
*/
/*
Style Index
==================================================
    1. Basic Style & Reset
    2. Header Menu
    3. Hero Area Section
    4. Services Area Section
    5. About Area Section
    6. Resume Area Section
    7. Works Area Section
    8. Price Area Section
    9. Hire Me Area
    10. Testimonial Area Section
    11. Blog Area Section
    12 Contact Area Section
    13. Footer Area
    14. Buttons
    15. Preloader
    16. Bootstrap Elements
    17. Go To Top
    18. Sticky Nav
    19. Slick Slider
*/
/* =================================== */
/*    Basic Style & Reset
/* =================================== */
/* reset elements */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, div
pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q,
s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
figure, header, nav, section, article, aside, footer, figcaption {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
}

::-moz-selection {
  background-color: #e45447;
  color: #fff;
}

::selection {
  background-color: #e45447;
  color: #fff;
}

::-webkit-input-placeholder {
  color: #777777;
  font-weight: 300;
}

:-moz-placeholder {
  color: #777777;
  opacity: 1;
  font-weight: 300;
}

::-moz-placeholder {
  color: #777777;
  opacity: 1;
  font-weight: 300;
}

:-ms-input-placeholder {
  color: #777777;
  font-weight: 300;
}

::-ms-input-placeholder {
  color: #777777;
  font-weight: 300;
}

body {
  font-family: "Roboto", sans-serif;
  color: #777777;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.625em;
  position: relative;
  background: #fff !important;
}

h1, h2, h3,
h4, h5, h6 {
  font-family: "Poppins", sans-serif;
  color: #222222;
  font-weight: 400;
  line-height: 1.5;
}

h1, .h1 {
  font-size: 36px;
}

h2, .h2 {
  font-size: 30px;
}

h3, .h3 {
  font-size: 24px;
}

h4, .h4 {
  font-size: 18px;
}

h5, .h5 {
  font-size: 16px;
}

h6, .h6 {
  font-size: 14px;
}

.img {
  max-width: 100%;
}

.clear {
  clear: both;
}

a,
:after,
:before,
.transition {
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -ms-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
a,
a:focus, a:hover {
  text-decoration: none;
}

ul, ol {
  list-style: none;
}

.section-padding {
  padding: 90px 0;
}

.mb-50 {
  margin-bottom: 50px;
}

.mt-50 {
  margin-top: 50px;
}

.sky-blue {
  background: #f9f9ff;
}

.section-title {
  text-align: center;
}
/* Forzar fondo blanco en wrappers y descendientes de eventos */
.events-area > div,
.events-area > section,
.events-area > .section-padding,
.events-area > .sky-blue {
  background: #fff !important;
  background-image: none !important;
}

.section-title h2 {
  color: #222222;
  font-weight: 700;
  position: relative;
  margin-bottom: 70px;
  font-size: 45px;
  line-height: 44px;
}

.section-title h2:before,
.section-title h2:after {
  content: "";
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  background: #e45447;
}

.section-title h2:before {
  bottom: -31px;
  width: 100px;
  height: 2px;
}

.section-title h2:after {
  bottom: -35px;
  width: 10px;
  height: 10px;
  border-radius: 8px;
}

.section-title p {
  max-width: 540px;
  margin: 0 auto;
}

/* =================================== */
/*    Header Menu
/* =================================== */
.header-transparrent {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 9;
}

.main-header {
  z-index: 3;
}
.main-header .main-menu ul li {
  display: inline-block;
  position: relative;
  z-index: 1;
  margin: 0 5px;
}
.main-header .main-menu ul li > .nav-link {
  color: #222222;
  font-weight: 400;
  padding: 25px 16px;
  font-weight: 400;
  display: block;
  font-size: 16px;
  text-transform: capitalize;
}
.main-header .main-menu ul li > .nav-link::before {
  position: absolute;
  content: "";
  left: 0;
  bottom: 14px;
  background: #e45447;
  height: 1px;
  width: 0;
}
.main-header .main-menu ul li > .nav-link:hover::before, .main-header .main-menu ul li > .nav-link.active::before {
  width: 100%;
}
.main-header .main-menu ul ul.submenu {
  position: absolute;
  width: 170px;
  background: #fff;
  left: 0;
  top: 80%;
  visibility: hidden;
  opacity: 0;
  box-shadow: 0 0 10px 3px rgba(0, 0, 0, 0.05);
  padding: 17px 0;
}
.main-header .main-menu ul ul.submenu > li {
  margin-left: 7px;
  display: block;
}
.main-header .main-menu ul ul.submenu > li > a {
  padding: 6px 10px !important;
  font-size: 14px;
  color: #222222;
  text-transform: capitalize;
}
.main-header .main-menu ul ul.submenu > li > a::before {
  position: absolute;
  content: "";
  left: -5px;
  background: #90acd1;
  height: 2px;
  width: 0;
  top: 50%;
}
.main-header .main-menu ul ul.submenu > li > a:hover {
  padding-left: 15px !important;
}
.main-header .main-menu ul ul.submenu > li > a:hover::before {
  width: 10px;
}

.main-header ul > li:hover > ul.submenu {
  visibility: visible;
  opacity: 1;
  top: 100%;
}

/* =================================== */
/*    Hero Area Section
/* =================================== */
.hero-area {
  min-height: 1000px;
  position: relative;
}
.hero-area .hero-caption {
  width: 100%;
}
.hero-area .hero-caption .subheading {
  text-transform: uppercase;
  font-size: 16px;
  font-weight: 700;
  color: #90acd1;
  letter-spacing: 4px;
}
.hero-area .hero-caption h1 {
  font-size: 60px;
  font-weight: 700;
}
.hero-area .hero-caption div {
  color: #e45447;
  font-weight: 400;
  font-size: 30px;
  line-height: 42px;
  margin-bottom: 30px;
}
.hero-area .hero-caption p {
  margin-bottom: 45px;
  padding-right: 155px;
}
.hero-area .hero-img {
  float: right;
}
.hero-area .hero-img img {
  position: relative;
  right: -63px;
}
.hero-area .hero-shape {
  position: absolute;
  top: 13%;
  left: 51%;
}

.custom-animation {
  backface-visibility: hidden;
  animation: jumping 9s ease-in-out 2s infinite alternate;
  animation-delay: 1s;
  transition: all 7s ease 2s;
  user-select: none;
}

@keyframes jumping {
  0% {
    transform: translateY(10px) translateX(0) rotate(0) scale(1);
    opacity: 0.9;
  }
  20% {
    transform: translateY(20px) translateX(10px) rotate(-20deg) scale(0.8);
    opacity: 0.8;
  }
  40% {
    transform: translateY(15px) translateX(-15px) rotate(10deg) scale(0.75);
    opacity: 0.8;
  }
  40% {
    transform: translateY(-15px) translateX(-25px) rotate(10deg) scale(0.5);
    opacity: 1;
  }
  80% {
    transform: translateY(-30px) translateX(20px) rotate(-20deg) scale(0.75);
    opacity: 0.6;
  }
  100% {
    transform: translateY(15px) translateX(15px) rotate(0) scale(0.95);
    opacity: 0.7;
  }
}
/* =================================== */
/*    Service Area Section
/* =================================== */
.service-area {
  position: relative;
  overflow: hidden;
  z-index: 1;
}
.service-area::before {
  position: absolute;
  content: "";
  right: 0px;
  top: 30px;
  width: 100%;
  height: 100%;
  background-position: top right;
  z-index: -1;
}

/* Contenedor de tarjetas con altura uniforme */
.service-area .row {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}

.service-area .service-block {
  padding: 50px 40px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0px 0px 40px 0px rgba(85, 128, 255, 0.2);
  margin-top: 1.5rem;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.service-area .service-block i {
  font-size: 35px;
  background: rgba(144, 172, 209, 0.2);
  width: 70px;
  height: 70px;
  text-align: center;
  padding-top: 16px;
  border-radius: 10px;
  display: block;
  color: #222222;
  margin: 0 auto 25px auto;
}

/* Forzar estilo idéntico en tarjetas de eventos */
#formacion .service-block {
  padding: 50px 40px !important;
  background: #fff !important;
  border-radius: 10px !important;
  box-shadow: 0px 0px 40px 0px rgba(85, 128, 255, 0.2) !important;
}
#formacion .service-block i {
  font-size: 35px !important;
  background: rgba(144, 172, 209, 0.2) !important;
  width: 70px !important;
  height: 70px !important;
  text-align: center !important;
  padding-top: 16px !important;
  border-radius: 10px !important;
  display: inline-block !important;
  color: #222222 !important;
}


/* Eventos: mismo estilo que ventas */
.events-area .event-block {
  padding: 50px 40px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0px 0px 40px 0px rgba(85, 128, 255, 0.2);
}
.events-area .event-block i {
  font-size: 35px;
  background: rgba(144, 172, 209, 0.2);
  width: 70px;
  height: 70px;
  text-align: center;
  padding-top: 16px;
  border-radius: 10px;
  display: inline-block;
  color: #222222;
}
.service-area .service-block h4 {
  margin-top: 0;
  font-weight: 600;
  margin-bottom: 15px;
  text-align: center;
}

/* Asegurar altura uniforme en venta online específicamente */
#venta-online .service-block {
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
}

#venta-online .row {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
}

#venta-online .col-lg-4,
#venta-online .col-md-6 {
  display: flex !important;
  flex-direction: column !important;
}

h2.service-title {
  font-size: 44px;
  font-weight: 700;
}

/* =================================== */
/*    About Area Section
/* =================================== */
.about-area .section-title {
  text-align: left;
}
.about-area .section-title h2::after, .about-area .section-title h2::before {
  left: 0;
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
}
.about-area .img-about img {
  outline: 10px solid #90acd1;
  outline-offset: -54px;
  border: 44px solid transparent;
  border-width: 0px 10px 0px 85px;
}
.about-area .about-details .about-info li {
  display: flex;
  margin-bottom: 10px;
}
.about-area .about-details .about-info li span {
  width: calc(100% - 130px);
}
.about-area .about-details .about-info li span:first-child {
  font-size: 16px;
  font-weight: 600;
  color: #222222;
  width: 130px;
}

/* =================================== */
/*    Resume Area Section
/* =================================== */
#navi {
  top: 180px;
  position: -webkit-sticky;
  position: sticky;
  margin: 0;
}
#navi li {
  font-weight: 700;
  margin-bottom: 10px;
}
#navi li:last-child {
  margin-bottom: 0;
}
#navi li a {
  color: #000000;
}
#navi li a.current {
  color: #90acd1;
  margin-left: 20px;
  position: relative;
}
#navi li a.current::after {
  position: absolute;
  top: 50%;
  left: -24px;
  width: 20px;
  height: 2px;
  content: "";
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  background: #90acd1;
}

.page {
  width: 100%;
  margin-bottom: 3em;
}
.page:last-child {
  margin-bottom: 0;
}
.page .heading {
  font-weight: 700;
  margin-bottom: 30px;
}
.page .resume-wrap {
  width: 100%;
  margin-bottom: 30px;
  background-color: #f9f9ff;
  padding: 40px 30px;
  border-radius: 10px;
}
.page .resume-wrap:last-child {
  margin-bottom: 0;
}
.page .resume-wrap .icon {
  width: 50px;
  height: 50px;
  background: #90acd1;
  border-radius: 50%;
}
.page .resume-wrap .icon span {
  color: #fff;
  font-size: 20px;
}
.page .resume-wrap .text {
  width: calc(100% - 100px);
  padding: 0 0 10px;
}
.page .resume-wrap .date {
  font-weight: 700;
  font-size: 16px;
  color: #222222;
}
.page .resume-wrap h4 {
  font-size: 20px;
  font-weight: 700;
}
.page .resume-wrap .position {
  display: inline-block;
  margin-bottom: 10px;
}
.page .resume-wrap:hover {
  background: #90acd1;
  color: #ffffff;
}
.page .resume-wrap:hover .icon {
  background: #fff;
}
.page .resume-wrap:hover .icon span {
  color: #222222;
  font-weight: bold;
}
.page .resume-wrap:hover h4,
.page .resume-wrap:hover .date {
  color: #fff;
}

.progress-wrap {
  width: 100%;
  margin-bottom: 30px;
}
.progress-wrap h5 {
  font-size: 16px;
  margin-bottom: 10px;
  font-weight: 500;
}

.progress {
  height: 6px;
  background: #e6e6e6;
  overflow: visible;
}

.progress-bar {
  background: #90acd1;
  position: relative;
  font-size: 12px;
  line-height: 1.2;
  color: #000000;
  font-weight: 600;
  position: relative;
  overflow: visible;
  border-radius: 2px;
}
.progress-bar::after {
  position: absolute;
  top: -2px;
  right: 0;
  width: 10px;
  height: 10px;
  content: "";
  background: #90acd1;
  border-radius: 50%;
}
.progress-bar span {
  position: absolute;
  top: -38px;
  right: 0;
  font-size: 16px;
  font-weight: 500;
  color: #000000;
}

/* =================================== */
/*    Works Area Section
/* =================================== */
.filters li {
  display: inline-block;
  padding: 15px;
  color: #222222;
  cursor: pointer;
  position: relative;
}
.filters li::before {
  content: "";
  background: #e45447;
  opacity: 0.5;
  height: 15px;
  width: 15px;
  border-radius: 50%;
  -webkit-transform: translate3d(-100%, -100%, 0) scale(0);
  -ms-transform: translate3d(-100%, -100%, 0) scale(0);
  transform: translate3d(-100%, -100%, 0) scale(0);
  position: absolute;
  top: 44%;
  left: 11px;
  z-index: 1;
}
.filters li.active::before, .filters li:hover::before {
  -webkit-transform: translate3d(-30%, -70%, 0) scale(1);
  -ms-transform: translate3d(-30%, -70%, 0) scale(1);
  transform: translate3d(-30%, -70%, 0) scale(1);
}

.filters-content .grid .single-work:first-of-type, .filters-content .grid .single-work:nth-of-type(2), .filters-content .grid .single-work:nth-of-type(3) {
  margin-bottom: 30px;
}
.filters-content .grid .single-work img {
  width: 100%;
}
.filters-content .grid .single-work .overlay {
  position: absolute;
  left: 0;
  opacity: 0.9;
  top: 0;
  height: 100%;
  width: 100%;
}
.filters-content .grid .single-work:hover .overlay {
  top: 20px;
  background: #e45447;
  left: 20px;
}
.filters-content .grid .single-work .short-info {
  position: absolute;
  bottom: 44px;
  font-size: 14px;
  left: 80px;
  color: #ffffff;
  opacity: 0;
  visibility: hidden;
}
.filters-content .grid .single-work .short-info h4 {
  color: #fff;
  font-size: 20px;
  margin-bottom: 8px;
}
.filters-content .grid .single-work:hover .short-info {
  bottom: 24px;
  left: 60px;
  opacity: 1;
  visibility: visible;
}

/* =================================== */
/*    Price Area Section
/* =================================== */
.pricing-item {
  padding: 40px 0;
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1);
  position: relative;
}
.pricing-item .title {
  color: #e45447;
  text-transform: uppercase;
  margin: 0 0 16px 0;
}
.pricing-item .amount {
  display: block;
  font-size: 50px;
  color: #333;
  line-height: 1;
}
.pricing-item .month {
  display: block;
  font-size: 13px;
  color: #999;
  text-transform: uppercase;
  margin: 5px 0 20px 0;
}
.pricing-item .icon {
  margin-bottom: 30px;
  position: relative;
}
.pricing-item .icon::before, .pricing-item .icon::after {
  content: "";
  width: 30px;
  height: 1px;
  background: #dadada;
  position: absolute;
  top: 50%;
}
.pricing-item .icon::before {
  left: 0;
}
.pricing-item .icon::after {
  right: 0;
}
.pricing-item .icon i {
  font-size: 25px;
  color: #333;
  line-height: 40px;
  position: relative;
}
.pricing-item .pricing-content {
  list-style: none;
  padding: 0;
  margin: 0 0 40px 0;
}
.pricing-item .pricing-content li {
  line-height: 15px;
  margin-bottom: 25px;
}
.pricing-item.middle {
  background: #90acd1;
  box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.25);
  color: #fff;
  position: relative;
  z-index: 1;
}
.pricing-item.middle a.btn {
  border: 2px solid #fff;
}

.pricing-item.middle .btn:hover {
  color: #444;
}

.pricing-item.middle a:before {
  background-color: #fff;
}

.pricing-item.middle .title,
.pricing-item.middle .amount,
.pricing-item.middle .month,
.pricing-item.middle .icon i,
.pricing-item.middle a.btn-area,
.pricing-item.middle .pricing-content li {
  color: #fff;
}

.pricing-shape .shape1,
.pricing-shape .shape2 {
  position: absolute;
  z-index: 0;
}
.pricing-shape .shape1 {
  bottom: 0;
  left: 0;
}
.pricing-shape .shape2 {
  top: 0;
  right: 0;
}

/* =================================== */
/*    Hire Me Area
/* =================================== */
.hire-me-area {
  background: #e45447;
}
.hire-me-area .section-title h2 {
  color: #fff;
}
.hire-me-area .section-title h2::before, .hire-me-area .section-title h2::after {
  background: #fff;
}
.hire-me-area .section-title p {
  color: #fff;
  max-width: 540px;
  margin: 0 auto;
}
.hire-me-area .btn {
  border: 2px solid #fff;
  background: transparent;
  font-weight: bold;
}
.hire-me-area .btn:hover {
  color: #222222 !important;
}
.hire-me-area .btn:hover::before {
  background: #fff;
}

.hire-box {
  text-align: center;
}
.hire-box h4 {
  font-weight: 600;
  color: #fff;
  line-height: 40px;
}

/* =================================== */
/*    Testimonial Area Section
/* =================================== */
.test-slider {
  border: solid 3px #90acd1;
  padding: 25px;
  position: relative;
  margin-bottom: 0 !important;
}
.test-slider::before {
  content: "\f10d";
  font-family: "FontAwesome";
  position: absolute;
  top: -10px;
  background-color: #fff;
  color: #e45447;
  padding: 0 35px;
  font-size: 22px;
  left: 15px;
  line-height: 0.8;
}
.test-slider .author-info {
  display: inline-block;
  position: relative;
  padding: 15px 60px;
}
.test-slider .author-info img {
  position: absolute;
  border-radius: 50%;
  left: 0;
  width: 50px;
  height: 50px;
}
.test-slider .author-info h4 {
  padding-top: 10px;
  font-size: 21px;
  font-weight: 700;
}
.test-slider .author-info .position {
  font-weight: 400;
  text-transform: capitalize;
}
.test-slider .author-info .position span {
  color: #90acd1;
}

/* =================================== */
/*    Blog Area Section
/* =================================== */
.blog-text {
  padding: 0 40px;
}
.blog-text .blog-text-inner {
  background: #fff;
  margin-top: -80px;
  z-index: 3;
  position: relative;
  padding: 30px 30px 50px 30px;
  -webkit-box-shadow: 0px 0px 19px 0px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0px 0px 19px 0px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 0px 19px 0px rgba(0, 0, 0, 0.2);
}
.blog-text .blog-text-inner .blog-date a {
  font-size: 14px;
  color: #6b6d6f;
  margin-right: 30px;
  position: relative;
}
.blog-text .blog-text-inner .blog-date a::before {
  content: "";
  background: #424242;
  height: 14px;
  width: 1px;
  position: absolute;
  left: -15px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
.blog-text .blog-text-inner .blog-date a:first-child::before {
  display: none;
}
.blog-text .blog-text-inner .blog-date a i {
  color: #e45447;
  padding-right: 8px;
}
.blog-text .blog-text-inner h4 {
  padding: 15px 0px 22px 0px;
}

.blog-right {
  padding-right: 30px;
}
.blog-right .media-body small {
  display: block;
  color: #e45447;
  padding: 4px 0px;
  font-size: 14px;
}
.blog-right .media-body small i {
  padding-right: 8px;
  color: #90acd1;
}

/* =================================== */
/*    Contact Area Section
/* =================================== */
.contact-area .media .media-body {
  padding-left: 25px;
}
.contact-area .media .media-icon {
  font-size: 23px;
  color: #90acd1;
  width: 50px;
  font-weight: bolder;
  text-align: center;
  height: 50px;
  border-radius: 50%;
  line-height: 50px;
  border: 2px solid #e45447;
}
.contact-area {
  background: #fff !important;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: center;
}
.contact-area .media h4 {
  margin-bottom: 8px;
}
.contact-area .media span {
  font-size: 15px;
}
.contact-area .contact-form .btn {
  background: #e45447;
  margin-top: 15px;
}
.contact-area .contact-form .btn:hover::before {
  background: #90acd1;
}

/* Sombra azulada en la tarjeta del formulario de contacto */
.contact-area .contact-form {
  padding: 50px 40px !important;
  background: #fff !important;
  border-radius: 10px !important;
  box-shadow: 0px 0px 40px 0px rgba(85, 128, 255, 0.2) !important;
  height: 100%;
}

/* Contenedor de información de contacto que ocupa la altura completa */
.contact-area .contact-info {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}

/* Sombra azulada en las tarjetas con clase contact-item */
.contact-area .contact-item {
  padding: 25px 20px !important;
  background: #fff !important;
  border-radius: 10px !important;
  box-shadow: 0px 0px 40px 0px rgba(85, 128, 255, 0.2) !important;
  flex: 1 !important;
  margin-bottom: 20px !important;
  display: flex !important;
  align-items: center !important;
}

/* Última tarjeta sin margen inferior */
.contact-area .contact-item:last-child {
  margin-bottom: 0 !important;
}

/* Tarjetas de contacto con sombra azulada igual que ventas y eventos */
.contact-area .contact-block {
  padding: 50px 40px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0px 0px 40px 0px rgba(85, 128, 255, 0.2);
}

/* =================================== */
/*    Footer Area
/* =================================== */
.footer-area {
  padding: 50px 0 !important;
  background: #1c1c1a !important;
  box-shadow: none !important;
  opacity: 1 !important;
  filter: none !important;
}
.footer-area .footer-logo h4 {
  font-size: 21px;
  color: #777777;
  font-weight: 700;
  margin-top: 48px;
}
.footer-area .footer-social {
  margin: 25px 0px 50px;
}
.footer-area .footer-social a {
  padding: 0 20px;
}
.footer-area .footer-social a i {
  color: #cccccc;
  font-size: 36px;
}
.footer-area .footer-social a i:hover {
  color: #e45447;
}
.footer-area .footer-bottom p {
  margin-bottom: 0;
}
.footer-area .footer-bottom a {
  color: #e45447;
}

.footer-logo-img {
  max-height: 320px;
  width: auto;
  margin-bottom: 15px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* =================================== */
/*    Buttons
/* =================================== */
.btn {
  background: #90acd1;
  text-transform: capitalize;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 1px;
  line-height: 0;
  padding: 30px 44px;
  border-radius: 5px;
  transition: color 0.4s linear;
  position: relative;
  z-index: 1;
  border: 0;
  overflow: hidden;
}
.btn::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #e45447;
  z-index: 1;
  border-radius: 5px;
  transition: transform 0.5s;
  transition-timing-function: ease;
  transform-origin: 0 0;
  transition-timing-function: cubic-bezier(0.5, 1.6, 0.4, 0.7);
  -webkit-transform: scaleX(0);
  -ms-transform: scaleX(0);
  transform: scaleX(0);
}
.btn:hover {
  color: #fff;
}
.btn:hover::before {
  -webkit-transform: scaleX(1);
  -ms-transform: scaleX(1);
  transform: scaleX(1);
  color: #fff !important;
  z-index: -1;
}
.btn:focus {
  outline: 0;
  box-shadow: none;
}

.radius-btn {
  padding: 25px 43px;
  border-radius: 30px;
}

/* =================================== */
/*    Preloader
/* =================================== */
.preloader-area {
  background-color: #1c1c1a;
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 9999;
  transition: opacity 0.5s ease, visibility 0.5s ease;
}
.preloader-area .loader {
  width: 150px;
  height: 150px;
  border-radius: 50%;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  position: absolute;
  animation: loading-1 20s infinite linear;
}

.loader .loader-inner {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.loader .loader-inner::after {
  content: "";
  width: 20px;
  height: 20px;
  border: 1px solid #fff;
  position: absolute;
  left: 20px;
  top: 20px;
  animation: loading-2 2s infinite;
}

.loader .loader-inner:nth-child(1) {
  transform: rotate(0deg);
}

.loader .loader-inner:nth-child(1):after {
  animation-delay: -0.5s;
}

.loader .loader-inner:nth-child(2) {
  transform: rotate(45deg);
}

.loader .loader-inner:nth-child(2):after {
  animation-delay: -1s;
}

.loader .loader-inner:nth-child(3) {
  transform: rotate(90deg);
}

.loader .loader-inner:nth-child(3):after {
  animation-delay: -1.5s;
}

.loader .loader-inner:nth-child(4) {
  transform: rotate(135deg);
}

.loader .loader-inner:nth-child(4):after {
  animation-delay: -2s;
}

.loader .loader-inner:nth-child(5) {
  transform: rotate(180deg);
}

.loader .loader-inner:nth-child(5):after {
  animation-delay: -2.5s;
}

.loader .loader-inner:nth-child(6) {
  transform: rotate(225deg);
}

.loader .loader-inner:nth-child(6):after {
  animation-delay: -3s;
}

.loader .loader-inner:nth-child(7) {
  transform: rotate(270deg);
}

.loader .loader-inner:nth-child(7):after {
  animation-delay: -3.5s;
}

.loader .loader-inner:nth-child(8) {
  transform: rotate(315deg);
}

.loader .loader-inner:nth-child(8):after {
  animation-delay: -4;
}

@keyframes loading-1 {
  100% {
    transform: rotate(-360deg);
  }
}
@keyframes loading-2 {
  50% {
    border-radius: 50%;
    transform: scale(0.4, 0.4) rotate(-90deg);
  }
}
/* =================================== */
/*    BOOTSTRAP ELEMENTS
/* =================================== */
.progress {
  box-shadow: none;
}

.border {
  border: none !important;
}

.media {
  margin-bottom: 30px;
  display: flex;
}

.media:last-child {
  margin-bottom: 0;
}

.media .media-body {
  padding-left: 30px;
}

/* === Form Control === */
.form-control {
  display: block;
  border-radius: 0;
  width: 100%;
  height: 48px;
  padding: 10px 24px;
  font-size: 15px;
  font-weight: 400;
  border-radius: 25px;
  line-height: 1.6;
  color: #333;
  background-image: none;
  border: solid 1px #90acd1;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.form-control:focus {
  border-color: #e45447;
  outline: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
}

textarea.form-control {
  height: 120px;
}

.form-group {
  margin-bottom: 20px;
}

/* =================================== */
/*    Go To Top
/* =================================== */
#scrollUp {
  background: #90acd1;
  height: 50px;
  width: 50px;
  right: 31px;
  bottom: 18px;
  color: #fff;
  font-size: 20px;
  text-align: center;
  border-radius: 50%;
  line-height: 48px;
  border: 2px solid transparent;
}
#scrollUp:hover {
  color: #fff;
}

/* =================================== */
/*    Sticky Nav
/* =================================== */
.sticky-bar {
  left: 0;
  margin: auto;
  position: fixed;
  top: 0;
  width: 100%;
  -webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
  box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
  z-index: 9999;
  background: #fff;
}

/* Sticky end */
.header-sticky ul li a {
  padding: 10px 19px;
}

.header-sticky.sticky-bar.sticky .main-menu ul > li > a {
  padding: 25px 16px;
}

.header-sticky.sticky-bar.sticky .main-menu ul > li > a:before {
  bottom: 11px;
}

.slicknav_menu .slicknav_icon-bar {
  background-color: #e45447 !important;
}

.slicknav_nav {
  margin-top: 0px;
}

.header-sticky.sticky-bar.sticky .header-btn .get-btn {
  padding: 20px 20px;
}

.header-area .slicknav_btn {
  top: -43px;
}

.slicknav_menu .slicknav_nav a:hover {
  background: transparent;
  color: #e45447;
}

.slicknav_menu {
  background: transparent;
  margin-top: 5px !important;
}

.mobile_menu {
  position: absolute;
  right: 0px;
  width: 100%;
  z-index: 99;
}

/* =================================== */
/*    Slick Slider
/* =================================== */
.slick-dots {
  position: absolute;
  bottom: 50px;
  right: 15px;
  left: auto;
  display: block;
  width: 100%;
  text-align: right;
}
.slick-dots li {
  position: relative;
  display: inline-block;
  width: 11px;
  height: 10px;
  margin: 0 1px;
  cursor: pointer;
}
.slick-dots li button {
  position: relative;
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  opacity: 0.5;
  background: #e45447;
}
.slick-dots li button::before {
  content: "";
  opacity: 0;
}
.slick-dots li.slick-active button {
  opacity: 1;
}

/* =================================== */
/*    Owl Slider
/* =================================== */
.owl-prev,
.owl-next {
  height: 25px;
  width: 25px;
  text-align: center;
  position: absolute;
  right: 0px;
  bottom: 0px;
  z-index: 3;
  color: #fff;
  cursor: pointer;
}

.owl-prev {
  right: 30px;
}

.owl-prev:before,
.owl-next:before {
  content: "";
  background: #90acd1;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0px;
  top: 0px;
  z-index: -1;
}

.logo-img {
  max-height: 50px;
  width: auto;
}

.events-area {
  background: #fff !important;
  box-shadow: none !important;
  filter: none !important;
  opacity: 1 !important;
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  min-height: 100vh !important;
}
/* Forzar fondo blanco en todos los descendientes de eventos */
.events-area * {
  background: #fff !important;
  background-image: none !important;
}
.events-area .section-padding,
.events-area .sky-blue {
  background: #fff !important;
  background-image: none !important;
}
section.events-area, .events-area, .events-area > * {
  background: #fff !important;
}

/* === PRIORIDAD MÁXIMA: Fondo blanco absoluto en eventos === */
#formacion,
section#formacion,
.events-area,
section.events-area,
.events-area *,
#formacion *,
section#formacion * {
  background: #fff !important;
  background-image: none !important;
}

/* Fondo gris claro para la sección de consultoría */
#consultoria {
  background: #e8e7e7;
}

/* Fondo gris claro para la sección de ayudas */
#ayudas {
  background: #e8e7e7;
}

/* =================================== */
/*    Process Block Vertical Centering
/* =================================== */
#venta-online .col-lg-5 {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.process-block.pl-4 {
  width: 100% !important;
}