/* Grúas El Piojito – estilos de widgets y efectos globales */
:root{
  --gp-ink:#0a1733;--gp-ink-2:#102546;--gp-ink-3:#1a3258;
  --gp-red:#dc2626;--gp-red-hot:#ef4444;--gp-red-deep:#991b1b;--gp-red-glow:rgba(220,38,38,.55);
  --gp-gold:#f5b800;--gp-gold-glow:rgba(245,184,0,.5);
  --gp-blue:#1e88e5;--gp-gray:#cbd5e1;
  --gp-font:'Inter',sans-serif;--gp-display:'Space Grotesk',sans-serif;--gp-bebas:'Bebas Neue',sans-serif;
}

/* ===== Efectos globales ===== */
body.gp-fx{cursor:none}
body.gp-fx a,body.gp-fx button{cursor:none}
.gp-preloader{position:fixed;inset:0;background:var(--gp-ink);z-index:100000;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1.5rem;animation:gp-pre-failsafe .1s 7s forwards}
@keyframes gp-pre-failsafe{to{visibility:hidden;opacity:0}}
.gp-preloader-logo{font-family:var(--gp-display);font-size:clamp(2.5rem,5vw,4rem);font-weight:700;letter-spacing:-.02em;overflow:hidden;line-height:1;color:#fff}
.gp-preloader-logo-inner{display:inline-block;transform:translateY(110%)}
.gp-preloader-logo span span{color:var(--gp-red)}
.gp-preloader-bar{width:200px;height:2px;background:rgba(255,255,255,.08);border-radius:2px;overflow:hidden;position:relative}
.gp-preloader-bar::after{content:'';position:absolute;left:0;top:0;height:100%;width:0;background:var(--gp-red);animation:gp-pre-bar 2s cubic-bezier(.7,0,.3,1) forwards}
@keyframes gp-pre-bar{to{width:100%}}
.gp-preloader-counter{font-family:var(--gp-display);font-size:.9rem;color:var(--gp-gray);letter-spacing:.1em}
.gp-preloader-counter span{color:var(--gp-red);font-weight:700}

.gp-cursor{position:fixed;width:12px;height:12px;background:var(--gp-red);border-radius:50%;pointer-events:none;z-index:99999;transform:translate(-50%,-50%);transition:width .3s,height .3s,background .3s;mix-blend-mode:difference}
.gp-cursor-follower{position:fixed;left:0;top:0;width:40px;height:40px;border:1px solid rgba(214,40,40,.4);border-radius:50%;pointer-events:none;z-index:99998;transition:width .4s,height .4s,background .4s,border-color .4s}
.gp-cursor.hover{width:50px;height:50px;background:transparent;border:2px solid var(--gp-red);mix-blend-mode:normal}
.gp-cursor-follower.hover{width:80px;height:80px;background:rgba(214,40,40,.05);border-color:rgba(214,40,40,.6)}
.gp-grain{position:fixed;inset:0;pointer-events:none;z-index:99997;opacity:.05;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:gp-grain .5s steps(3) infinite}
@keyframes gp-grain{0%{transform:translate(0,0)}33%{transform:translate(-2%,1%)}66%{transform:translate(1%,-1%)}100%{transform:translate(0,0)}}

/* Header: fondo cambia al hacer scroll (clase puesta por gruas.js) */
.elementor-location-header .gp-nav-scrolled{background:rgba(10,23,51,.7) !important;backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px)}

/* ===== Botones ===== */
.gp-btn{display:inline-flex;align-items:center;gap:.6rem;padding:1rem 2rem;border-radius:12px;font-family:var(--gp-font);font-weight:700;font-size:.95rem;text-decoration:none;transition:background .3s,color .3s,border-color .3s,transform .3s;position:relative;overflow:hidden}
.gp-btn-primary{background:linear-gradient(135deg,var(--gp-red-hot) 0%,var(--gp-red) 60%,var(--gp-red-deep) 100%);color:#fff;border:1px solid rgba(255,255,255,.18);box-shadow:0 10px 32px rgba(220,38,38,.5),0 2px 6px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.4),inset 0 -1px 0 rgba(0,0,0,.25)}
.gp-btn-primary:hover{background:linear-gradient(135deg,#f87171 0%,var(--gp-red-hot) 60%,var(--gp-red) 100%);box-shadow:0 16px 40px rgba(239,68,68,.65),0 4px 10px rgba(0,0,0,.4);color:#fff}
.gp-btn-secondary{background:rgba(255,255,255,.06);color:#fff;border:1px solid rgba(255,255,255,.15);backdrop-filter:blur(10px)}
.gp-btn-secondary:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.3);color:#fff}
.gp-btn::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at center,rgba(255,255,255,.4),transparent 50%);opacity:0;transform:scale(0);transition:transform .6s,opacity .6s}
.gp-btn:hover::after{opacity:1;transform:scale(2)}
.gp-btn-icon{width:20px;height:20px;position:relative;z-index:1}
.gp-btn span{position:relative;z-index:1}

/* ===== Hero ===== */
.gp-hero{position:relative;height:100vh;min-height:750px;overflow:hidden;display:flex;align-items:center;color:#fff;font-family:var(--gp-font)}
.gp-hero *{box-sizing:border-box}
.gp-hero-carousel{position:absolute;inset:-10%;z-index:0}
.gp-hero-slide{position:absolute;inset:0;opacity:0;transition:opacity 1.8s ease-in-out}
.gp-hero-slide.active{opacity:1}
.gp-hero-slide img{width:100%;height:100%;object-fit:cover;object-position:center 45%;transform:scale(1.02)}
.gp-hero-slide.active img{animation:gp-kb 16s ease-in-out infinite alternate}
@keyframes gp-kb{0%{transform:scale(1.02) translate(0,0)}100%{transform:scale(1.08) translate(-1%,.6%)}}
.gp-hero-overlay{position:absolute;inset:0;background:linear-gradient(115deg,rgba(10,23,51,.95) 0%,rgba(10,23,51,.75) 40%,rgba(30,136,229,.22) 100%);z-index:1}
.gp-hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);background-size:60px 60px;z-index:1;opacity:.5}
.gp-hero-dots{position:absolute;bottom:8rem;left:50%;transform:translateX(-50%);z-index:3;display:flex;gap:.8rem}
.gp-hero-dot{width:40px;height:22px;display:flex;align-items:center;justify-content:center;font-family:var(--gp-display);font-size:.75rem;font-weight:700;letter-spacing:.1em;color:rgba(255,255,255,.4);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:4px;cursor:pointer;transition:all .4s;position:relative;overflow:hidden}
.gp-hero-dot.active{color:var(--gp-red);background:rgba(255,255,255,.4)}
.gp-hero-dot.active::after{content:'';position:absolute;inset:0;background:var(--gp-red);animation:gp-dot var(--gp-interval,5s) linear forwards}
@keyframes gp-dot{from{transform:translateX(-100%)}to{transform:translateX(0)}}
.gp-hero-counter{position:absolute;bottom:8rem;right:3rem;z-index:3;font-family:var(--gp-bebas);font-size:1.1rem;color:rgba(244,246,249,.5);letter-spacing:.2em}
.gp-hero-counter span{color:var(--gp-red)}
.gp-hero-content{position:relative;z-index:3;max-width:1400px;margin:0 auto;padding:0 3rem;width:100%}
.gp-hero-availability{margin-top:1.5rem;display:flex;align-items:center;gap:.7rem;color:rgba(248,250,252,.85);font-size:.74rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;font-family:var(--gp-display);opacity:0}
.gp-hero-availability::before{content:'';width:40px;height:1px;background:linear-gradient(to right,var(--gp-gold) 0%,var(--gp-gold) 40%,transparent 100%);display:inline-block;box-shadow:0 0 8px var(--gp-gold-glow)}
.gp-hero-availability svg{width:15px;height:15px;color:var(--gp-gold);flex-shrink:0}
.gp-hero-availability b{color:#fff;font-weight:800;letter-spacing:.14em}
.gp-hero-title{font-family:var(--gp-display);font-size:clamp(3rem,8vw,7rem);font-weight:700;line-height:.95;letter-spacing:-.04em;margin:0 0 2rem;max-width:1100px;color:#fff}
.gp-word{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.05em}
.gp-word-inner{display:inline-block;transform:translateY(110%)}
.gp-word-inner.accent{color:var(--gp-red);font-family:var(--gp-bebas);letter-spacing:.02em;font-weight:400;text-shadow:0 0 30px var(--gp-red-glow)}
.gp-word-inner.outline{color:transparent;-webkit-text-stroke:1.5px var(--gp-gold);font-family:var(--gp-bebas);letter-spacing:.02em;font-weight:400}
.gp-hero-sub{font-size:clamp(1rem,1.4vw,1.15rem);color:rgba(255,255,255,.88);max-width:560px;line-height:1.7;margin:0 0 2.5rem;opacity:0;transform:translateY(20px)}
.gp-hero-actions{display:flex;gap:1rem;flex-wrap:wrap;opacity:0;transform:translateY(20px)}
.gp-hero-float{position:absolute;z-index:2;pointer-events:none;opacity:0}
.gp-hero-float-1{top:15%;right:8%;width:120px;height:120px;border:1px solid rgba(220,38,38,.2);border-radius:50%;animation:gp-float 6s ease-in-out infinite}
.gp-hero-float-2{bottom:25%;left:5%;width:80px;height:80px;background:radial-gradient(circle,rgba(245,184,0,.12),transparent);border-radius:50%;animation:gp-float 8s ease-in-out infinite reverse}
@keyframes gp-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-25px)}}
/* En el editor mostramos todo sin animaciones de entrada */
.elementor-editor-active .gp-word-inner,.elementor-editor-active .gp-hero-sub,.elementor-editor-active .gp-hero-actions,.elementor-editor-active .gp-hero-availability,.elementor-editor-active .gp-hero-float{transform:none !important;opacity:1 !important}

/* ===== Marquesina ===== */
.gp-marquee{padding:1.8rem 0;border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06);overflow:hidden;background:var(--gp-ink);position:relative}
.gp-marquee-track{display:flex;gap:4rem;width:max-content;animation:gp-marquee 30s linear infinite}
.gp-marquee-item{font-family:var(--gp-bebas);font-size:clamp(2.5rem,5vw,4.5rem);color:#fff;letter-spacing:.02em;display:flex;align-items:center;gap:3rem;white-space:nowrap;font-weight:400;line-height:1.2}
.gp-marquee-item.outline{color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.2)}
.gp-marquee-item .dot{width:12px;height:12px;background:var(--gp-gold);border-radius:50%;display:inline-block;box-shadow:0 0 12px var(--gp-gold-glow)}
@keyframes gp-marquee{to{transform:translateX(-50%)}}

/* ===== Servicios con scroll horizontal ===== */
.gp-hs{background:var(--gp-ink);font-family:var(--gp-font);color:#fff}
.gp-hs-pin{position:relative;height:100vh;overflow:hidden}
.gp-hs-wrap{position:absolute;inset:0;display:flex;align-items:center;padding:0 4rem}
.gp-hs-track{display:flex;gap:2rem;will-change:transform}
.gp-card{position:relative;flex:0 0 460px;height:70vh;max-height:600px;border-radius:24px;overflow:hidden;transition:transform .6s cubic-bezier(.16,1,.3,1)}
.gp-card-img{position:absolute;inset:0}
.gp-card-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.16,1,.3,1)}
.gp-card:hover .gp-card-img img{transform:scale(1.12)}
.gp-card-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(10,23,51,.22) 0%,rgba(10,23,51,.05) 55%,rgba(10,23,51,0) 100%)}
.gp-card-num{position:absolute;top:1.5rem;left:1.5rem;font-family:var(--gp-bebas);font-size:5rem;color:rgba(245,184,0,.28);letter-spacing:.02em;line-height:1;z-index:2}
.gp-card-tag{position:absolute;top:1.5rem;right:1.5rem;font-size:.7rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--gp-gold);background:rgba(10,23,51,.6);backdrop-filter:blur(10px);padding:.4rem .8rem;border-radius:6px;z-index:2;border:1px solid rgba(245,184,0,.35)}
.gp-card-content{position:absolute;bottom:0;left:0;right:0;padding:2rem;z-index:2}
.gp-card-title{font-family:var(--gp-display);font-size:1.8rem;font-weight:700;line-height:1.1;margin:0 0 .6rem;color:#fff}
.gp-card-desc{font-size:.9rem;color:rgba(244,246,249,.7);line-height:1.6;margin:0;max-height:0;opacity:0;overflow:hidden;transition:max-height .6s cubic-bezier(.16,1,.3,1),opacity .4s,margin .4s}
.gp-card:hover .gp-card-desc{max-height:100px;opacity:1;margin-bottom:1.2rem}
.gp-card-link{display:inline-flex;align-items:center;gap:.4rem;font-size:.85rem;font-weight:600;color:var(--gp-red);text-decoration:none}
.gp-card-link svg{transition:transform .3s}
.gp-card:hover .gp-card-link svg{transform:translateX(4px)}

/* ===== Responsive ===== */
@media(max-width:1024px){.gp-card{flex:0 0 400px}}
@media(max-width:768px){
  body.gp-fx,body.gp-fx a,body.gp-fx button{cursor:auto}
  .gp-cursor,.gp-cursor-follower{display:none}
  .gp-hero-content{padding:0 1.5rem}
  .gp-hs-pin{height:auto;overflow:visible}
  .gp-hs-wrap{position:relative;height:auto;display:block;padding:0 1.5rem}
  .gp-hs-track{flex-direction:column;gap:1.5rem}
  .gp-card{flex:0 0 85vw;height:60vh}
}
