/* ===== VARIABLES Y RESET ===== */
*{
 margin:0;
 padding:0;
 box-sizing:border-box;
}

:root{
 --primary:#046bd2;
 --primary-dark:#045cb4;
 --secondary:#1e293b;
 --text:#334155;
 --text-light:#64748b;
 --bg-light:#F0F5FA;
 --white:#ffffff;
 --shadow:0 10px 30px rgba(0,0,0,0.1);
 --shadow-hover:0 15px 40px rgba(0,0,0,0.15);
}

/* ===== ESTILOS GLOBALES ===== */
body{
 font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif;
 font-size:16px;
 line-height:1.65;
 color:var(--text);
 overflow-x:hidden;
}

.container{
 max-width:1200px;
 margin:0 auto;
 padding:0 20px;
}

/* ===== HEADER Y NAVEGACIÓN ===== */
header{
 background:rgba(255,255,255,0.98);
 backdrop-filter:blur(10px);
 padding:20px 0;
 position:sticky;
 top:0;
 z-index:100;
 box-shadow:0 2px 20px rgba(0,0,0,0.08);
 transition:all 0.3s ease;
}

header.scrolled{
 padding:15px 0;
 box-shadow:0 4px 30px rgba(0,0,0,0.12);
}

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

.logo img{
 height:50px;
 transition:transform 0.3s ease;
}

.logo a{
 display:block;
}

.logo:hover img{
 transform:scale(1.05);
}

nav ul{
 display:flex;
 list-style:none;
 gap:35px;
}

nav li{
 position:relative;
}

nav a{
 color:var(--secondary);
 text-decoration:none;
 font-size:16px;
 font-weight:500;
 transition:all 0.3s;
 position:relative;
 padding:5px 0;
 display:flex;
 align-items:center;
 gap:5px;
}

nav a::after{
 content:'';
 position:absolute;
 bottom:0;
 left:0;
 width:0;
 height:2px;
 background:var(--primary);
 transition:width 0.3s ease;
}

nav a:hover::after{
 width:100%;
}

nav a:hover{
 color:var(--primary);
}

/* Dropdown */
.dropdown{
 position:relative;
}

.dropdown > a::before{
 content:'▼';
 font-size:10px;
 margin-left:5px;
 transition:transform 0.3s ease;
}

.dropdown:hover > a::before{
 transform:rotate(-180deg);
}

.dropdown-menu{
 display:none;
 position:absolute;
 top:100%;
 left:0;
 background:rgba(255,255,255,0.98);
 backdrop-filter:blur(10px);
 border-radius:8px;
 padding:10px 0;
 box-shadow:0 10px 30px rgba(0,0,0,0.15);
 min-width:200px;
 z-index:1000;
 margin-top:10px;
}

.dropdown:hover .dropdown-menu{
 display:block;
}

.dropdown-menu a{
 display:block;
 padding:12px 20px;
 color:var(--secondary);
 font-size:15px;
 transition:all 0.3s ease;
}

.dropdown-menu a::after{
 display:none;
}

.dropdown-menu a:hover{
 background:var(--bg-light);
 color:var(--primary);
 padding-left:25px;
}

.menu-toggle{
 display:none;
 background:none;
 border:none;
 font-size:28px;
 cursor:pointer;
 color:var(--primary);
}

/* ===== HERO SECTION ===== */
.hero{
 min-height:300px;
 display:flex;
 align-items:center;
 color:white;
 padding:80px 20px;
 position:relative;
 overflow:hidden;
}

/* LCP:Imagen de fondo optimizada con fetchpriority="high" */
.hero-bg-image{
 position:absolute;
 top:0;
 left:0;
 width:100%;
 height:100%;
 object-fit:cover;
 object-position:center;
 z-index:0;
}

/* Gradiente overlay sobre la imagen */
.hero::after{
 content:'';
 position:absolute;
 top:0;
 left:0;
 width:100%;
 height:100%;
 background:linear-gradient(135deg,rgba(4,107,210,0.9),rgba(4,92,180,0.85));
 z-index:1;
}

.hero::before{
 content:'';
 position:absolute;
 top:0;
 left:0;
 right:0;
 bottom:0;
 background:radial-gradient(circle at 20% 50%,rgba(255,255,255,0.1) 0%,transparent 50%);
 z-index:2;
}

.hero-content{
 max-width:900px;
 position:relative;
 z-index:3;
 text-align:center;
 margin:0 auto;
}

.hero h1{
 font-size:40px;
 margin-bottom:10px;
 font-weight:700;
 line-height:1.2;
 text-shadow:2px 2px 4px rgba(0,0,0,0.2);
}

.hero p{
 font-size:18px;
 margin-bottom:0;
 line-height:1.6;
 opacity:0.95;
}

/* ===== BOTONES (UNIFICADOS) ===== */
.btn{
 display:inline-block;
 background:var(--white);
 color:var(--primary);
 padding:16px 40px;
 text-decoration:none;
 border-radius:50px;
 font-weight:600;
 transition:all 0.3s ease;
 box-shadow:0 5px 20px rgba(255,255,255,0.3);
 border:none;
 cursor:pointer;
}

.btn:hover{
 transform:translateY(-3px);
 box-shadow:0 8px 30px rgba(255,255,255,0.4);
}

.btn-primary{
 background:var(--primary);
 color:var(--white);
}

.btn-primary:hover{
 background:var(--primary-dark);
 box-shadow:0 8px 30px rgba(4,107,210,0.4);
}

.btn-form{
 background:var(--primary);
 color:var(--white);
 padding:14px 30px;
 border:none;
 border-radius:6px;
 font-size:18px;
 font-weight:600;
 cursor:pointer;
 transition:background 0.3s,transform 0.3s;
 width:100%;
 box-shadow:0 5px 15px rgba(4,107,210,0.3);
}

.btn-form:hover{
 background:var(--primary-dark);
 transform:translateY(-2px);
}

.btn-cta{
 display:inline-block;
 background:var(--primary);
 color:var(--white);
 padding:16px 40px;
 text-decoration:none;
 border-radius:50px;
 font-weight:600;
 transition:all 0.3s ease;
 box-shadow:0 5px 20px rgba(4,107,210,0.4);
}

.btn-cta:hover{
 background:var(--primary-dark);
 transform:translateY(-2px);
 box-shadow:0 8px 30px rgba(4,107,210,0.5);
}

/* ===== SECCIÓN DE PRODUCTOS ===== */
.products{
 padding:100px 20px;
 text-align:center;
 background:linear-gradient(180deg,var(--white) 0%,var(--bg-light) 100%);
}

.products h2{
 font-size:38px;
 margin-bottom:20px;
 color:var(--secondary);
 font-weight:700;
}

.products > p{
 color:var(--text-light);
 font-size:18px;
 margin-bottom:60px;
}

.products-grid{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
 gap:30px;
 margin-top:50px;
}

.product-card{
 padding:40px 30px;
 background:var(--white);
 border-radius:16px;
 box-shadow:var(--shadow);
 transition:all 0.4s ease;
 border:1px solid transparent;
}

.product-card:hover{
 transform:translateY(-10px);
 box-shadow:var(--shadow-hover);
 border-color:var(--primary);
}

.product-icon{
 width:70px;
 height:70px;
 background:linear-gradient(135deg,var(--primary),var(--primary-dark));
 border-radius:16px;
 margin:0 auto 25px;
 display:flex;
 align-items:center;
 justify-content:center;
 font-size:32px;
 color:white;
}

.product-card h3{
 font-size:22px;
 margin:20px 0 15px;
 color:var(--secondary);
 font-weight:600;
}

.product-card p{
 color:var(--text-light);
 line-height:1.6;
}

.product-detail-card{
 display:flex;
 align-items:center;
 background:var(--white);
 border-radius:20px;
 box-shadow:var(--shadow);
 margin-bottom:50px;
 padding:40px;
 text-align:left;
 transition:transform 0.3s ease;
}

.product-detail-card:hover{
 transform:translateY(-5px);
}

.product-detail-card:nth-child(odd){
 flex-direction:row-reverse;
}

.product-detail-content{
 flex:1;
 padding:0 30px;
}

.product-detail-icon{
 width:90px;
 height:90px;
 background:var(--primary);
 border-radius:50%;
 display:flex;
 align-items:center;
 justify-content:center;
 font-size:40px;
 color:white;
 margin-bottom:20px;
}

.product-detail-content h3{
 font-size:28px;
 color:var(--primary);
 margin-bottom:15px;
}

.product-detail-content p{
 font-size:17px;
 margin-bottom:20px;
 color:var(--text);
}

.product-detail-image{
 flex:0 0 40%;
}

.product-detail-image img{
 width:100%;
 height:auto;
 border-radius:15px;
 box-shadow:0 5px 20px rgba(0,0,0,0.1);
}

/* ===== SECCIÓN ABOUT ===== */
.about{
 padding:100px 20px;
 background:var(--white);
}

.about-grid{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:80px;
 align-items:center;
 margin-bottom:100px;
}

.about-grid img{
 width:100%;
 border-radius:20px;
 box-shadow:var(--shadow);
 transition:transform 0.4s ease;
}

.about-grid img:hover{
 transform:scale(1.05);
}

.about h2{
 font-size:36px;
 margin-bottom:25px;
 color:var(--secondary);
 line-height:1.3;
 font-weight:700;
}

.about h4{
 color:var(--primary);
 margin-bottom:15px;
 font-size:16px;
 text-transform:uppercase;
 letter-spacing:1px;
 font-weight:600;
}

.about p{
 color:var(--text);
 line-height:1.8;
 margin-bottom:25px;
 font-size:17px;
}

/* ===== SECCIÓN STATS ===== */
.stats{
 background:var(--primary);
 color:white;
 padding:60px 20px;
 text-align:center;
}

.stats h2{
 font-size:38px;
 margin-bottom:40px;
 font-weight:700;
}

.stats-grid{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
 gap:40px;
 max-width:1000px;
 margin:0 auto;
}

.stat-item{
 text-align:center;
}

.stat-item .stat-icon{
 font-size:40px;
 margin-bottom:15px;
 display:block;
}

.stat-item h3{
 font-size:22px;
 font-weight:600;
 margin-bottom:10px;
}

.stat-item p{
 font-size:16px;
 opacity:0.9;
}

/* ===== SECCIÓN SERVICIOS ===== */
.services{
 padding:100px 20px;
 background:linear-gradient(180deg,var(--bg-light) 0%,var(--white) 100%);
}

.services h3{
 text-align:center;
 font-size:38px;
 margin-bottom:20px;
 color:var(--secondary);
 font-weight:700;
}

.services > .container > p{
 text-align:center;
 color:var(--text-light);
 font-size:18px;
 margin-bottom:60px;
}

.services-grid{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
 gap:35px;
}

.service-card{
 text-align:center;
 padding:45px 35px;
 background:var(--white);
 border-radius:16px;
 box-shadow:var(--shadow);
 transition:all 0.4s ease;
}

.service-card:hover{
 transform:translateY(-8px);
 box-shadow:var(--shadow-hover);
}

.service-icon{
 width:70px;
 height:70px;
 margin:0 auto 25px;
 background:linear-gradient(135deg,var(--primary),var(--primary-dark));
 border-radius:50%;
 display:flex;
 align-items:center;
 justify-content:center;
 font-size:28px;
 color:white;
 transition:transform 0.3s ease;
}

.service-card:hover .service-icon{
 transform:rotate(360deg) scale(1.1);
}

.service-card h2{
 font-size:22px;
 margin-bottom:15px;
 color:var(--secondary);
 font-weight:600;
}

.service-card p{
 color:var(--text-light);
 line-height:1.6;
}

/* ===== SECCIÓN RESEÑAS ===== */
.reviews{
 padding:100px 20px;
 background:linear-gradient(135deg,#f8fafc 0%,#e7f0f7 100%);
}

.reviews h2{
 text-align:center;
 font-size:38px;
 margin-bottom:60px;
 color:var(--secondary);
 font-weight:700;
}

.reviews-grid{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
 gap:35px;
}

.review-card{
 background:var(--white);
 padding:40px 35px;
 border-radius:16px;
 text-align:center;
 box-shadow:var(--shadow);
 transition:all 0.4s ease;
 position:relative;
}

.review-card::before{
 content:'"';
 position:absolute;
 top:20px;
 left:25px;
 font-size:80px;
 color:var(--primary);
 opacity:0.1;
 font-family:Georgia,serif;
}

.review-card:hover{
 transform:translateY(-8px);
 box-shadow:var(--shadow-hover);
}

.review-card > p:first-child{
 font-style:italic;
 color:var(--text);
 line-height:1.7;
 margin-bottom:25px;
 position:relative;
 z-index:1;
}

.review-avatar{
 width:70px;
 height:70px;
 border-radius:50%;
 margin:25px auto 15px;
 object-fit:cover;
 border:4px solid var(--primary);
 box-shadow:0 5px 15px rgba(4,107,210,0.2);
}

/* ===== SERVIDORES CLOUD ===== */
.server-cards-section{
 padding:60px 20px;
 background:var(--bg-light);
}

.server-cards-section h2{
 text-align:center;
 font-size:32px;
 color:var(--primary-dark);
 margin-bottom:50px;
 font-weight:700;
}

.server-cards-grid{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
 gap:30px;
 margin-bottom:40px;
}

.server-card{
 background:var(--white);
 border-radius:12px;
 padding:40px 30px;
 text-align:center;
 box-shadow:var(--shadow);
 transition:all 0.3s ease;
 position:relative;
 overflow:hidden;
 border-top:4px solid var(--primary);
}

.server-card::before{
 content:'';
 position:absolute;
 top:0;
 left:0;
 right:0;
 bottom:0;
 background:linear-gradient(135deg,rgba(4,107,210,0.05),transparent);
 opacity:0;
 transition:opacity 0.3s ease;
}

.server-card:hover{
 transform:translateY(-10px);
 box-shadow:var(--shadow-hover);
}

.server-card:hover::before{
 opacity:1;
}

.server-card h3{
 font-size:28px;
 color:var(--primary-dark);
 margin-bottom:10px;
 font-weight:700;
}

.server-card .plan-type{
 font-size:14px;
 color:var(--text-light);
 text-transform:uppercase;
 letter-spacing:1px;
 margin-bottom:20px;
 font-weight:600;
}

.server-card .price{
 font-size:36px;
 color:var(--primary);
 font-weight:700;
 margin-bottom:5px;
}

.server-card .price-period{
 font-size:14px;
 color:var(--text-light);
 margin-bottom:30px;
}

.server-card .specs{
 text-align:left;
 margin-bottom:30px;
 list-style:none;
}

.server-card .specs li{
 padding:12px 0;
 border-bottom:1px solid var(--bg-light);
 color:var(--text);
 font-size:15px;
}

.server-card .specs li:last-child{
 border-bottom:none;
}

.server-card .specs strong{
 color:var(--primary-dark);
}

.server-card .cta-btn{
 display:inline-block;
 margin-top:20px;
 position:relative;
 z-index:1;
}

.popular-badge{
 position:absolute;
 top:-5px;
 right:20px;
 background:linear-gradient(135deg,#ff6b6b,#ff8787);
 color:white;
 padding:8px 16px;
 border-radius:50px;
 font-size:12px;
 font-weight:700;
 text-transform:uppercase;
 letter-spacing:1px;
 box-shadow:0 4px 15px rgba(255,107,107,0.4);
 transform:rotate(-5deg);
 z-index:10;
}

.server-card.popular-card{
 border-top:4px solid #ff6b6b;
 transform:scale(1.02);
}

.server-card.popular-card:hover{
 transform:translateY(-10px) scale(1.02);
}

/* ===== CARRUSEL DE IMÁGENES ===== */
.carousel-section{
 margin-top:60px;
 margin-bottom:60px;
}

.carousel-section h3{
 text-align:center;
 font-size:24px;
 color:var(--primary-dark);
 margin-bottom:40px;
 font-weight:700;
}

.carousel-wrapper{
 position:relative;
 max-width:1200px;
 margin:0 auto;
 overflow:hidden;
 border-radius:12px;
}

.carousel-container{
 display:flex;
 gap:20px;
 overflow-x:auto;
 scroll-behavior:smooth;
 padding-bottom:15px;
 scroll-snap-type:x mandatory;
}

.carousel-container::-webkit-scrollbar{
 height:8px;
}

.carousel-container::-webkit-scrollbar-track{
 background:var(--bg-light);
 border-radius:10px;
}

.carousel-container::-webkit-scrollbar-thumb{
 background:var(--primary);
 border-radius:10px;
 transition:background 0.3s ease;
}

.carousel-container::-webkit-scrollbar-thumb:hover{
 background:var(--primary-dark);
}

.carousel-item{
 min-width:280px;
 height:400px;
 border-radius:12px;
 overflow:hidden;
 box-shadow:var(--shadow);
 transition:all 0.3s ease;
 scroll-snap-align:center;
 position:relative;
 cursor:pointer;
}

.carousel-item:hover{
 transform:translateY(-15px);
 box-shadow:var(--shadow-hover);
}

.carousel-item img{
 width:100%;
 height:100%;
 object-fit:cover;
 transition:transform 0.4s ease;
}

.carousel-item:hover img{
 transform:scale(1.08);
}

.carousel-item::after{
 content:'';
 position:absolute;
 top:0;
 left:0;
 right:0;
 bottom:0;
 background:linear-gradient(135deg,rgba(4,107,210,0) 0%,rgba(4,107,210,0.2) 100%);
 opacity:0;
 transition:opacity 0.3s ease;
}

.carousel-item:hover::after{
 opacity:1;
}

.carousel-nav{
 display:flex;
 justify-content:center;
 gap:10px;
 margin-top:20px;
}

.carousel-btn{
 background:var(--primary);
 color:white;
 border:none;
 padding:12px 20px;
 border-radius:50px;
 cursor:pointer;
 font-size:16px;
 font-weight:600;
 transition:all 0.3s ease;
 box-shadow:0 4px 15px rgba(4,107,210,0.3);
}

.carousel-btn:hover{
 background:var(--primary-dark);
 transform:translateY(-2px);
 box-shadow:0 6px 20px rgba(4,107,210,0.4);
}

/* ===== CENTRO DE DATOS ===== */
.data-center-section{
 padding:80px 20px;
 background:var(--white);
}

.data-center-section h2{
 font-size:32px;
 color:var(--primary-dark);
 border-bottom:2px solid var(--bg-light);
 padding-bottom:10px;
 margin-bottom:30px;
}

.data-center-section h3{
 font-size:24px;
 color:var(--secondary);
 margin-top:40px;
 margin-bottom:15px;
}

.data-center-content p{
 margin-bottom:20px;
 color:var(--text);
 line-height:1.7;
}

.data-center-grid{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
 gap:20px;
 margin-bottom:40px;
}

.data-center-grid ul{
 list-style:none;
 padding-left:0;
}

.data-center-grid li{
 background:var(--bg-light);
 padding:10px 15px;
 margin-bottom:10px;
 border-radius:8px;
 font-size:15px;
 color:var(--secondary);
 font-weight:500;
 border-left:4px solid var(--primary);
}

.feature-item{
 display:flex;
 align-items:flex-start;
 margin-bottom:30px;
}

.feature-icon{
 font-size:40px;
 margin-right:20px;
 color:var(--primary);
 flex-shrink:0;
}

.feature-text h3{
 margin-top:0;
 color:var(--primary-dark);
}

/* ===== CONTACTO ===== */
.page-hero{
 background:linear-gradient(135deg,rgba(4,107,210,0.9),rgba(4,92,180,0.85)),
 url('../images/contac.jpg');
 background-size:cover;
 background-position:center;
 min-height:250px;
 display:flex;
 align-items:center;
 color:white;
 padding:50px 20px;
}

.page-hero h1{
 font-size:42px;
 font-weight:700;
}

.contact-section{
 padding:80px 20px;
 background:var(--bg-light);
}

.contact-grid{
 display:grid;
 grid-template-columns:1fr 1.5fr;
 gap:50px;
 align-items:flex-start;
}

.info-card{
 background:var(--white);
 padding:30px;
 border-radius:12px;
 box-shadow:var(--shadow);
}

.info-card h2{
 color:var(--primary);
 font-size:28px;
 margin-bottom:30px;
}

.info-item{
 display:flex;
 align-items:center;
 margin-bottom:25px;
 padding-bottom:25px;
 border-bottom:1px solid #e2e8f0;
}

.info-item:last-child{
 border-bottom:none;
 margin-bottom:0;
 padding-bottom:0;
}

.info-icon{
 font-size:24px;
 color:var(--primary);
 width:40px;
 text-align:center;
 margin-right:15px;
}

.info-content p{
 line-height:1.4;
 color:var(--text);
}

.info-content a{
 color:var(--primary);
 text-decoration:none;
 font-weight:500;
}

.contact-form{
 background:var(--white);
 padding:40px;
 border-radius:12px;
 box-shadow:var(--shadow);
}

.contact-form h3{
 color:var(--secondary);
 font-size:26px;
 margin-bottom:30px;
 font-weight:600;
}

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

.form-group label{
 display:block;
 margin-bottom:8px;
 font-weight:500;
 color:var(--secondary);
}

.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form input[type="tel"],
.contact-form select,
.contact-form textarea{
 width:100%;
 padding:12px;
 border:1px solid #cbd5e1;
 border-radius:6px;
 font-size:16px;
 transition:border-color 0.3s;
}

.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus{
 border-color:var(--primary);
 outline:none;
 box-shadow:0 0 0 3px rgba(4,107,210,0.2);
}

.contact-form textarea{
 resize:vertical;
 min-height:120px;
}

.form-message{
 padding:15px;
 border-radius:6px;
 margin-bottom:20px;
 font-weight:600;
 text-align:center;
 display:none;
}

.form-message.success{
 background:#d1fae5;
 color:#065f46;
 display:block;
}

.form-message.error{
 background:#fee2e2;
 color:#991b1b;
 display:block;
}

.cta-section{
 padding:60px 20px;
 text-align:center;
 background:var(--bg-light);
}

.cta-section h2{
 font-size:32px;
 color:var(--secondary);
 margin-bottom:20px;
}

.cta-section p{
 font-size:18px;
 color:#50698d (--text-light);
 margin-bottom:40px;
}

/* ===== PARTNERS CARRUSEL ===== */
.partners{
 padding:30px 20px;
 background:var(--white);
 text-align:center;
 overflow:hidden;
}

.partners h2{
 font-size:24px;
 color:var(--text-light);
 margin-bottom:30px;
 font-weight:500;
}

.logo-carousel-track{
 display:flex;
 white-space:nowrap;
 animation:scroll 40s linear infinite;
 width:200%;
}

.logo-item{
 display:inline-block;
 flex-shrink:0;
 width:calc(100% / 12);
 padding:0 40px;
 box-sizing:border-box;
 display:flex;
 align-items:center;
 justify-content:center;
}

.logo-item img{
 max-width:100%;
 width:auto;
 height:60px;
 object-fit:contain;
 filter:grayscale(100%);
 opacity:0.6;
 transition:all 0.3s ease;
}

.logo-item img:hover{
 filter:none;
 opacity:1;
}

@keyframes scroll{
 0%{
 transform:translateX(0);
}
 100%{
 transform:translateX(-50%);
}
}

/* ===== FOOTER ===== */
footer{
 background:var(--secondary);
 color:var(--white);
 padding:30px 20px;
 text-align:center;
}

footer p{
 opacity:0.9;
}

footer a{
 color:var(--primary);
 text-decoration:none;
}

/* ===== SCROLL TOP ===== */
.scroll-top{
 position:fixed;
 bottom:30px;
 right:30px;
 background:linear-gradient(135deg,var(--primary),var(--primary-dark));
 color:white;
 width:55px;
 height:55px;
 border-radius:50%;
 display:none;
 align-items:center;
 justify-content:center;
 cursor:pointer;
 transition:all 0.3s ease;
 box-shadow:0 5px 20px rgba(4,107,210,0.4);
 font-size:24px;
}

.scroll-top:hover{
 transform:translateY(-5px);
 box-shadow:0 8px 30px rgba(4,107,210,0.5);
}

/* ===== WHATSAPP FLOTANTE ===== */
.whatsapp-float{
 position:fixed;
 width:60px;
 height:60px;
 bottom:30px;
 left:30px;
 background-color:#25d366;
 color:#FFF;
 border-radius:50px;
 text-align:center;
 font-size:32px;
 box-shadow:0 5px 20px rgba(0,0,0,0.2);
 z-index:9999;
 transition:all 0.3s ease;
 display:flex;
 align-items:center;
 justify-content:center;
 text-decoration:none;
}

.whatsapp-float:hover{
 transform:scale(1.1) rotate(5deg);
 box-shadow:0 8px 30px rgba(37,211,102,0.6);
}

/* ===== RESPONSIVE DESIGN ===== */
@media (max-width:544px){
 .whatsapp-float{
 width:50px;
 height:50px;
 bottom:20px;
 left:20px;
 font-size:28px;
}
}

@media (max-width:992px){
 .product-detail-card{
 flex-direction:column !important;
 padding:30px;
}

 .product-detail-image{
 flex:0 0 100%;
 margin-top:20px;
}

 .product-detail-content{
 padding:0;
}

 .product-detail-card:nth-child(odd) .product-detail-content{
 order:-1;
}
}

@media (max-width:900px){
 .contact-grid{
 grid-template-columns:1fr;
}

 .info-card,
 .contact-form{
 padding:30px;
}
}

@media (max-width:768px){
 nav ul{
 display:none;
 flex-direction:column;
 position:absolute;
 top:70px;
 left:0;
 right:0;
 background:rgba(255,255,255,0.98);
 backdrop-filter:blur(10px);
 padding:30px 20px;
 box-shadow:0 10px 30px rgba(0,0,0,0.1);
 gap:20px;
}

 nav ul.active{
 display:flex;
}

 .menu-toggle{
 display:block;
}

 .hero{
 min-height:250px;
 padding:50px 20px;
}

 .hero h1{
 font-size:30px;
}

 .hero p{
 font-size:16px;
}

 .page-hero h1{
 font-size:32px;
}

 .products,
 .services,
 .reviews,
 .about,
 .contact-section,
 .data-center-section{
 padding:60px 20px;
}

 .products h2,
 .services h3,
 .reviews h2,
 .about h2{
 font-size:28px;
}

 .about-grid{
 grid-template-columns:1fr;
 gap:40px;
 margin-bottom:60px;
}

 .server-cards-grid{
 grid-template-columns:1fr;
}

 .server-card h3{
 font-size:24px;
}

 .server-card .price{
 font-size:32px;
}

 .data-center-section h2{
 font-size:26px;
}

 .stats h2{
 font-size:28px;
}

 .stats-grid{
 gap:30px;
}

 .stat-item h3{
 font-size:22px;
}

 .product-detail-content h3{
 font-size:24px;
}

 .logo-item{
 width:calc(100% / 6);
 padding:0 20px;
}

 .logo-item img{
 width:auto;
 height:45px;
 object-fit:contain;
}
}