/********** Template CSS **********/
:root {
    --primary: #7EBC12;
    --secondary: #FF0F10;
    --light: #F2F2F2;
    --dark: #1D2833;
}


/*** Spinner ***/
#spinner {
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s ease-out, visibility 0s linear .5s;
    z-index: 99999;
}

#spinner.show {
    transition: opacity .5s ease-out, visibility 0s linear 0s;
    visibility: visible;
    opacity: 1;
}

.back-to-top {
    position: fixed;
    display: none;
    right: 45px;
    bottom: 45px;
    z-index: 99;
}


/*** Heading ***/
h1,
h2,
.fw-bold {
    font-weight: 700 !important;
}

h3,
h4,
.fw-semi-bold {
    font-weight: 600 !important;
}

h5,
h6,
.fw-medium {
    font-weight: 500 !important;
}


/*** Button ***/
.btn {
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    transition: .5s;
}

.btn.btn-primary,
.btn.btn-secondary {
    color: #FFFFFF;
}

.btn-square {
    width: 38px;
    height: 38px;
}

.btn-sm-square {
    width: 32px;
    height: 32px;
}

.btn-lg-square {
    width: 48px;
    height: 48px;
}

.btn-square,
.btn-sm-square,
.btn-lg-square {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: normal;
    border-radius: 8px;
}


/*** Navbar ***/
.navbar-light .navbar-nav .nav-link {
    position: relative;
    margin-left: 25px;
    padding: 35px 0;
    font-size: 15px;
    font-family: 'Montserrat', sans-serif;
    color: #FFFFFF !important;
    text-transform: uppercase;
    font-weight: 500;
    outline: none;
    transition: .5s;
}

.sticky-top.navbar-light .navbar-nav .nav-link {
    padding: 20px 0;
    color: var(--dark) !important;
}

.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link.active {
    color: var(--secondary) !important;
}

.navbar-light .navbar-brand h1 {
    color: #FFFFFF;
}

.navbar-light .navbar-brand img {
    max-height: 60px;
    transition: .5s;
}

.sticky-top.navbar-light .navbar-brand img {
    max-height: 45px;
}

@media (max-width: 991.98px) {
    .sticky-top.navbar-light {
        position: relative;
        background: #FFFFFF;
    }

    .navbar-light .navbar-collapse {
        margin-top: 15px;
        border-top: 1px solid #DDDDDD;
    }

    .navbar-light .navbar-nav .nav-link,
    .sticky-top.navbar-light .navbar-nav .nav-link {
        padding: 10px 0;
        margin-left: 0;
        color: var(--dark) !important;
    }

    .navbar-light .navbar-brand h1 {
        color: var(--primary);
    }

    .navbar-light .navbar-brand img {
        max-height: 45px;
    }
}

@media (min-width: 992px) {
    .navbar-light {
        position: absolute;
        width: 100%;
        top: 0;
        left: 0;
        z-index: 999;
    }
    
    .sticky-top.navbar-light {
        position: fixed;
        background: #FFFFFF;
    }

    .sticky-top.navbar-light .navbar-brand h1 {
        color: var(--primary);
    }
}


/*** Hero Header ***/
.hero-header {
    background:
        url(../img/bg-round.png),
        url(../img/bg-round-2.png),
        url(../img/bg-square.png),
        url(../img/bg-line.png),
        url(../img/bg-bottom-hero.png);
    background-position:
        0px 40%,
        right 0 top 0,
        left 50% top 0,
        left 50% top 50%,
        center bottom -1px;
    background-repeat: no-repeat;
}

.breadcrumb-item + .breadcrumb-item::before {
    color: rgba(255, 255, 255, .5);
}


/*** Section Title ***/
.section-title::before {
    position: absolute;
    content: "";
    width: 60px;
    height: 11px;
    bottom: 0;
    left: 0;
    border-top: 1px solid #5A5A5A;
    border-bottom: 1px solid #5A5A5A;
}

.section-title::after {
    position: absolute;
    content: "";
    width: 90px;
    height: 1px;
    bottom: 5px;
    left: 0;
    background: var(--primary);
}

.section-title.text-center::before {
    left: 50%;
    margin-left: -30px;
}

.section-title.text-center::after {
    width: 120px;
    left: 50%;
    margin-left: -60px;
}


/*** Domain Search ***/
.domain {
    background: url(../img/bg-domain.png) center center no-repeat;
    background-size: contain;
}


/*** Comparison ***/
@media (min-width: 992px) {
    .comparison::after {
        position: absolute;
        content: "";
        width: 1px;
        top: 56px;
        bottom: 20px;
        left: 50%;
        background: #DDDDDD;
    }
}

/*** Services ***/
.services-carousel .owl-item .services-item,
.services-carousel .owl-item.center .services-item * {
    transition: .5s;
}

.services-carousel .owl-item.center .services-item {
    background: var(--primary) !important;
    border-color: var(--secondary) !important;
}

.services-carousel .owl-item.center .services-item .position-absolute {
    background: var(--secondary) !important;
}

.services-carousel .owl-item.center .services-item * {
    color: #FFFFFF;
}

.services-carousel .owl-item.center .services-item h6 {
    color: var(--dark) !important;
}

.services-carousel .owl-dots {
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.services-carousel .owl-dot {
    position: relative;
    display: inline-block;
    margin: 0 5px;
    width: 15px;
    height: 15px;
    background: #DDDDDD;
    border-radius: 15px;
    transition: .5s;
}

.services-carousel .owl-dot.active {
    width: 30px;
    background: var(--primary);
}


/*** Testimonial ***/
/* ===== ZEUS PALETTE ===== */
:root{
  --zeus-ink:#0f172a;          /* texto principal */
  --zeus-muted:#64748b;        /* texto suave */
  --zeus-primary:#2563eb;      /* azul */
  --zeus-secondary:#6d28d9;    /* violeta */
  --zeus-accent:#14b8a6;       /* teal (toques sutiles) */
  --zeus-surface:#ffffff;      /* fondo tarjeta */
  --zeus-border:#e5e7eb;       /* bordes claros */
  --zeus-dot:#e2e8f0;          /* dot inactivo */
  --zeus-shadow:0 16px 40px rgba(2,6,23,.08);
}

/*** Testimonial (ZEUS) ***/
.testimonial-carousel .testimonial-item{
  background: var(--zeus-surface) !important;
  border: 1px solid var(--zeus-border) !important;
  color: var(--zeus-ink);
  box-shadow: var(--zeus-shadow);
  transition: transform .35s ease, box-shadow .35s ease, background .35s ease, color .35s ease;
}
.testimonial-carousel .testimonial-item p{
  color: var(--zeus-muted);
}
.testimonial-carousel .testimonial-item .position-absolute{
  background: linear-gradient(135deg, rgba(37,99,235,.15), rgba(109,40,217,.15)) !important;
}

/* Tarjeta activa (centro) — gradiente suave + glow */
.testimonial-carousel .owl-item.center .testimonial-item{
  background: linear-gradient(135deg, rgba(37,99,235,.10), rgba(109,40,217,.10)) !important;
  border-color: rgba(99,102,241,.25) !important;
  box-shadow: 0 18px 48px rgba(37,99,235,.18), 0 12px 24px rgba(109,40,217,.12);
}
.testimonial-carousel .owl-item.center .testimonial-item p{
  color: var(--zeus-ink);
}
.testimonial-carousel .owl-item.center .testimonial-item h6{
  color: var(--zeus-ink) !important;
}
.testimonial-carousel .owl-item.center .testimonial-item .position-absolute{
  background: linear-gradient(135deg, var(--zeus-primary), var(--zeus-secondary)) !important;
}

/* Dots ZEUS */
.testimonial-carousel .owl-dots{
  display:flex; align-items:center; justify-content:center; gap:6px; margin-top:6px;
}
.testimonial-carousel .owl-dot{
  width:12px; height:12px; border-radius:12px; background: var(--zeus-dot);
  transition: all .35s ease; position:relative; overflow:hidden;
}
.testimonial-carousel .owl-dot.active{
  width:28px;
  background: linear-gradient(90deg, var(--zeus-primary), var(--zeus-secondary));
  box-shadow: 0 6px 16px rgba(37,99,235,.25);
}

/* Micro interacciones */
.testimonial-carousel .testimonial-item:hover{
  transform: translateY(-2px);
  box-shadow: 0 20px 52px rgba(2,6,23,.10);
}
