/* =====================================================================
   Flash Logistic Travel Company - Estilos publicos
   Tema BLANCO, sin degradados. Acentos: naranja + azul marino (logo).
   ===================================================================== */

:root{
  --blanco:#ffffff;
  --naranja:#ee7203;
  --naranja-osc:#cf6202;
  --naval:#16243f;
  --naval-2:#1f3a5f;
  --texto:#25303f;
  --texto-suave:#5a6675;
  --gris-1:#f6f8fb;   /* fondos suaves */
  --gris-2:#eef1f6;   /* bordes suaves */
  --borde:#e2e7ee;
  --exito:#1c7c4a;
  --error:#c0392b;
  --sombra:0 6px 20px rgba(22,36,63,.08);
  --radio:10px;
  --contenedor:1200px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--texto);
  background:var(--blanco);
  line-height:1.6;
  font-size:16px;
}
img{max-width:100%;display:block}
a{color:var(--naranja);text-decoration:none}
a:hover{color:var(--naranja-osc)}
h1,h2,h3,h4{color:var(--naval);line-height:1.25;margin:0 0 .5em}
h1{font-size:2.4rem}
h2{font-size:1.9rem}
h3{font-size:1.25rem}
p{margin:0 0 1rem}
.contenedor{max-width:var(--contenedor);margin:0 auto;padding:0 20px}
.seccion{padding:70px 0}
.seccion--gris{background:var(--gris-1)}
.text-center{text-align:center}

/* ---------- Botones ---------- */
.btn{
  display:inline-block;padding:12px 26px;border-radius:var(--radio);
  font-weight:600;border:2px solid transparent;cursor:pointer;
  transition:background .15s,color .15s,border-color .15s;font-size:1rem;
}
.btn--naranja{background:var(--naranja);color:#fff}
.btn--naranja:hover{background:var(--naranja-osc);color:#fff}
.btn--naval{background:var(--naval);color:#fff}
.btn--naval:hover{background:var(--naval-2);color:#fff}
.btn--ghost{background:transparent;color:var(--naval);border-color:var(--borde)}
.btn--ghost:hover{border-color:var(--naranja);color:var(--naranja)}
.btn--blanco{background:#fff;color:var(--naval)}
.btn--blanco:hover{background:var(--gris-1)}

/* ---------- Cabecera / navbar ---------- */
.site-header{
  position:sticky;top:0;z-index:50;background:#fff;
  border-bottom:1px solid var(--borde);
}
.navbar{display:flex;align-items:center;justify-content:space-between;height:76px}
.navbar__logo{display:flex;align-items:center;gap:12px;text-decoration:none}
.navbar__logo--img img{height:56px;width:auto}
.navbar__emblema{height:48px;width:48px;object-fit:contain;flex:none}
.navbar__marca{display:flex;flex-direction:column;line-height:1.05}
.navbar__marca-1{color:var(--naranja);font-weight:800;font-size:1.18rem;letter-spacing:.2px}
.navbar__marca-2{color:var(--naval);font-weight:700;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase}
.navbar__menu{display:flex;align-items:center;gap:6px;list-style:none;margin:0;padding:0}
.navbar__menu a{
  color:var(--naval);font-weight:600;padding:10px 14px;border-radius:8px;
  display:block;font-size:.98rem;
}
.navbar__menu a:hover,.navbar__menu a.activo{color:var(--naranja);background:var(--gris-1)}
.navbar__cta{margin-left:8px}
.navbar__toggle{
  display:none;background:none;border:0;cursor:pointer;padding:8px;
}
.navbar__toggle span{display:block;width:26px;height:3px;background:var(--naval);margin:5px 0;border-radius:3px;transition:.2s}

/* ---------- Hero ---------- */
.hero{
  background:var(--blanco);border-bottom:1px solid var(--borde);
  padding:80px 0;
}
.hero__grid{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:center}
.hero__eyebrow{
  display:inline-block;color:var(--naranja);font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;font-size:.82rem;margin-bottom:14px;
}
.hero h1{font-size:2.8rem;margin-bottom:18px}
.hero p{font-size:1.15rem;color:var(--texto-suave);max-width:560px}
.hero__botones{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.hero__media{
  border-radius:16px;overflow:hidden;border:1px solid var(--borde);
  background:var(--gris-1);box-shadow:var(--sombra);
}
.hero__media img{width:100%;height:100%;object-fit:contain;padding:24px}

/* ---------- Encabezado de seccion ---------- */
.seccion__head{max-width:680px;margin:0 auto 46px;text-align:center}
.seccion__head .eyebrow{
  color:var(--naranja);font-weight:700;text-transform:uppercase;
  letter-spacing:.08em;font-size:.8rem;
}
.seccion__head p{color:var(--texto-suave)}

/* ---------- Rejillas / tarjetas ---------- */
.grid{display:grid;gap:26px}
.grid--3{grid-template-columns:repeat(3,1fr)}
.grid--4{grid-template-columns:repeat(4,1fr)}
.grid--2{grid-template-columns:repeat(2,1fr)}

.card{
  background:#fff;border:1px solid var(--borde);border-radius:var(--radio);
  padding:28px;transition:transform .15s,box-shadow .15s;height:100%;
}
.card:hover{transform:translateY(-4px);box-shadow:var(--sombra)}
.card__icono{
  width:56px;height:56px;border-radius:12px;background:var(--gris-1);
  display:flex;align-items:center;justify-content:center;margin-bottom:18px;
  color:var(--naranja);
}
.card__icono svg{width:28px;height:28px}
.card h3{margin-bottom:8px}
.card p{color:var(--texto-suave);font-size:.96rem}
.card__link{font-weight:600;display:inline-flex;align-items:center;gap:6px;margin-top:8px}

/* ---------- Presentacion / about ---------- */
.about__grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.stat-list{display:flex;gap:34px;flex-wrap:wrap;margin-top:20px}
.stat b{display:block;font-size:2rem;color:var(--naranja);line-height:1}
.stat span{color:var(--texto-suave);font-size:.9rem}

/* ---------- Ventajas ---------- */
.ventaja{display:flex;gap:14px;align-items:flex-start}
.ventaja__icono{color:var(--naranja);flex:0 0 auto;margin-top:2px}
.ventaja h4{margin:0 0 4px;color:var(--naval)}
.ventaja p{margin:0;color:var(--texto-suave);font-size:.94rem}

/* ---------- Proceso ---------- */
.proceso{display:grid;grid-template-columns:repeat(6,1fr);gap:18px;counter-reset:paso}
.proceso__item{text-align:center;position:relative}
.proceso__num{
  width:46px;height:46px;border-radius:50%;background:var(--naval);color:#fff;
  display:flex;align-items:center;justify-content:center;margin:0 auto 12px;font-weight:700;
}
.proceso__item h4{font-size:1rem;margin:0 0 4px}
.proceso__item p{font-size:.85rem;color:var(--texto-suave);margin:0}

/* ---------- Cobertura ---------- */
.cobertura{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.chip{
  background:#fff;border:1px solid var(--borde);color:var(--naval);
  padding:10px 18px;border-radius:30px;font-weight:600;font-size:.92rem;
}

/* ---------- CTA ---------- */
.cta{background:var(--naval);color:#fff;text-align:center;padding:64px 0}
.cta h2{color:#fff}
.cta p{color:#cfd8e6;max-width:560px;margin:0 auto 26px}

/* ---------- Blog ---------- */
.post-card{
  background:#fff;border:1px solid var(--borde);border-radius:var(--radio);
  overflow:hidden;display:flex;flex-direction:column;height:100%;transition:box-shadow .15s,transform .15s;
}
.post-card:hover{box-shadow:var(--sombra);transform:translateY(-4px)}
.post-card__img{aspect-ratio:16/9;background:var(--gris-1);overflow:hidden}
.post-card__img img{width:100%;height:100%;object-fit:cover}
.post-card__body{padding:22px;display:flex;flex-direction:column;flex:1}
.post-card__cat{color:var(--naranja);font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em}
.post-card h3{font-size:1.15rem;margin:8px 0}
.post-card p{color:var(--texto-suave);font-size:.94rem;flex:1}
.post-card__meta{color:var(--texto-suave);font-size:.82rem;margin-top:10px}

/* ---------- Contenido de articulo/servicio ---------- */
.contenido-rico{max-width:820px;margin:0 auto}
.contenido-rico img{border-radius:var(--radio);margin:20px 0}
.contenido-rico h2,.contenido-rico h3{margin-top:1.4em}
.lista-check{list-style:none;padding:0;margin:0}
.lista-check li{padding:8px 0 8px 30px;position:relative;color:var(--texto)}
.lista-check li::before{
  content:"";position:absolute;left:0;top:14px;width:16px;height:16px;border-radius:50%;
  background:var(--naranja);
}

/* ---------- Formularios ---------- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form-group{margin-bottom:18px}
.form-group.full{grid-column:1/-1}
label{display:block;font-weight:600;margin-bottom:6px;color:var(--naval);font-size:.92rem}
input[type=text],input[type=email],input[type=tel],input[type=password],
input[type=search],select,textarea{
  width:100%;padding:12px 14px;border:1px solid var(--borde);border-radius:8px;
  font-size:1rem;font-family:inherit;background:#fff;color:var(--texto);
}
input:focus,select:focus,textarea:focus{
  outline:none;border-color:var(--naranja);box-shadow:0 0 0 3px rgba(238,114,3,.12);
}
textarea{min-height:130px;resize:vertical}
.checkbox{display:flex;gap:10px;align-items:flex-start;font-weight:400;color:var(--texto-suave);font-size:.9rem}
.checkbox input{margin-top:4px}

/* ---------- Alertas ---------- */
.alert{padding:14px 18px;border-radius:8px;margin-bottom:18px;font-size:.95rem;border:1px solid}
.alert-success{background:#eaf7f0;border-color:#bfe6cf;color:var(--exito)}
.alert-error{background:#fbeceb;border-color:#f2c9c4;color:var(--error)}
.alert-info{background:#eaf0f8;border-color:#c9d8ee;color:var(--naval-2)}
.alert-warning{background:#fdf6e7;border-color:#f3e2b6;color:#8a6d1a}

/* ---------- Info de contacto ---------- */
.contact-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:start}
.info-item{display:flex;gap:14px;margin-bottom:20px}
.info-item__ico{color:var(--naranja);flex:0 0 auto}
.info-item b{display:block;color:var(--naval)}
.info-item span{color:var(--texto-suave);font-size:.94rem}
.mapa{border-radius:var(--radio);overflow:hidden;border:1px solid var(--borde);margin-top:20px}
.mapa iframe{width:100%;height:280px;border:0;display:block}

/* ---------- Paginacion ---------- */
.paginacion{display:flex;gap:8px;justify-content:center;margin-top:40px;flex-wrap:wrap}
.paginacion a,.paginacion span{
  padding:10px 16px;border:1px solid var(--borde);border-radius:8px;color:var(--naval);font-weight:600;
}
.paginacion a:hover{border-color:var(--naranja);color:var(--naranja)}
.paginacion .actual{background:var(--naranja);border-color:var(--naranja);color:#fff}

/* ---------- Footer ---------- */
.site-footer{background:var(--naval);color:#cfd8e6;padding:56px 0 26px}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:34px}
.site-footer h4{color:#fff;margin-bottom:16px;font-size:1.05rem}
.site-footer a{color:#cfd8e6}
.site-footer a:hover{color:var(--naranja)}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{margin-bottom:9px}
.footer-logo{background:#fff;padding:10px 14px;border-radius:10px;display:inline-block;margin-bottom:14px}
.footer-logo img{height:44px}
.social{display:flex;gap:10px;margin-top:14px}
.social a{
  width:38px;height:38px;border-radius:8px;background:rgba(255,255,255,.08);
  display:flex;align-items:center;justify-content:center;color:#fff;
}
.social a:hover{background:var(--naranja)}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.12);margin-top:34px;padding-top:20px;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:.86rem;color:#9fb0c6;
}

/* ---------- Page header (paginas internas) ---------- */
.page-header{background:var(--gris-1);border-bottom:1px solid var(--borde);padding:50px 0;text-align:center}
.page-header h1{margin:0 0 8px}
.breadcrumbs{color:var(--texto-suave);font-size:.9rem}
.breadcrumbs a{color:var(--texto-suave)}
.breadcrumbs a:hover{color:var(--naranja)}

/* ---------- Utilidades ---------- */
.mt-0{margin-top:0}.mb-0{margin-bottom:0}
.hidden{display:none}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width:1024px){
  .grid--4{grid-template-columns:repeat(2,1fr)}
  .proceso{grid-template-columns:repeat(3,1fr);row-gap:30px}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  h1{font-size:2rem}.hero h1{font-size:2.1rem}
  .hero__grid,.about__grid,.contact-grid{grid-template-columns:1fr}
  .hero__media{order:-1}
  .grid--3{grid-template-columns:1fr 1fr}
  .navbar__menu{
    position:fixed;inset:76px 0 auto 0;background:#fff;flex-direction:column;
    gap:0;padding:10px 20px 20px;border-bottom:1px solid var(--borde);
    transform:translateY(-140%);transition:transform .25s;box-shadow:var(--sombra);
  }
  .navbar__menu.abierto{transform:translateY(0)}
  .navbar__menu li{width:100%}
  .navbar__menu a{padding:14px 8px;border-radius:0;border-bottom:1px solid var(--gris-2)}
  .navbar__cta{margin:12px 0 0}
  .navbar__toggle{display:block}
}
@media (max-width:560px){
  .seccion{padding:48px 0}
  .grid--3,.grid--2{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
  .proceso{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column;text-align:center}
  h1{font-size:1.7rem}.hero h1{font-size:1.8rem}
}

/* =====================================================================
   HERO SLIDER (banner principal)  ·  añadido para dar vida a la home
   Tema: fondo azul marino solido (sin degradados), acentos naranja/blanco.
   ===================================================================== */
.hero-slider{
  position:relative;
  background:var(--naval);
  overflow:hidden;
  isolation:isolate;
}
/* Textura sutil de puntos (sin degradados) */
.hero-slider::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.06) 1.4px, transparent 1.5px);
  background-size:26px 26px;opacity:.6;
}
.hero-slider__track{position:relative;min-height:100vh;z-index:1}
.slide{
  position:absolute;inset:0;
  display:flex;align-items:center;
  opacity:0;visibility:hidden;
  transition:opacity .6s ease;
  padding:48px 0;
}
.slide.is-active{opacity:1;visibility:visible;z-index:2}
.slide__grid{
  display:flex;align-items:center;justify-content:space-between;gap:40px;width:100%;
}
.slide__texto{flex:1 1 52%;max-width:560px}
.slide__media{
  flex:1 1 44%;position:relative;
  display:flex;align-items:center;justify-content:center;min-height:420px;
}
/* Halo circular que ancla la escena */
.slide__media::before{
  content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:440px;height:440px;border-radius:50%;
  background:rgba(255,255,255,.05);
  box-shadow:0 0 0 40px rgba(255,255,255,.03);
}
.slide__eyebrow{
  display:inline-block;color:var(--naranja);font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;font-size:.8rem;margin-bottom:16px;
}
.slide__titulo{color:#fff;font-size:2.9rem;line-height:1.15;margin:0 0 18px;max-width:15ch}
.slide__desc{color:#c9d3e2;font-size:1.18rem;max-width:52ch;margin:0 0 30px}
.slide__botones{display:flex;gap:14px;flex-wrap:wrap}
.btn--claro{background:#fff;color:var(--naval)}
.btn--claro:hover{background:var(--gris-1);color:var(--naval)}

/* Entrada escalonada del contenido de la diapositiva activa */
.slide__eyebrow,.slide__titulo,.slide__desc,.slide__botones{
  opacity:0;transform:translateY(22px);
}
.slide.is-active .slide__eyebrow{animation:slideUp .6s .10s forwards}
.slide.is-active .slide__titulo{animation:slideUp .6s .22s forwards}
.slide.is-active .slide__desc{animation:slideUp .6s .34s forwards}
.slide.is-active .slide__botones{animation:slideUp .6s .46s forwards}
@keyframes slideUp{to{opacity:1;transform:translateY(0)}}

/* Escena SVG */
.slide__media{display:flex;justify-content:center}
.escena{position:relative;z-index:1;width:100%;max-width:520px;height:auto;filter:drop-shadow(0 18px 30px rgba(0,0,0,.28))}

/* Flechas (agrupadas abajo a la derecha para no solaparse con el texto) */
.hero-slider__flecha{
  position:absolute;bottom:24px;z-index:4;
  width:44px;height:44px;border-radius:50%;
  border:1px solid rgba(255,255,255,.35);
  background:rgba(255,255,255,.08);color:#fff;
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  transition:background .15s,border-color .15s,transform .15s;
}
.hero-slider__flecha:hover{background:var(--naranja);border-color:var(--naranja)}
.hero-slider__flecha:active{transform:scale(.94)}
.hero-slider__flecha--prev{right:78px}
.hero-slider__flecha--next{right:24px}

/* Puntos (abajo a la izquierda) */
.hero-slider__puntos{
  position:absolute;left:0;right:0;bottom:34px;z-index:4;
  display:flex;justify-content:center;gap:10px;
}
.hero-slider__puntos .punto{
  width:11px;height:11px;border-radius:50%;cursor:pointer;padding:0;
  border:2px solid rgba(255,255,255,.6);background:transparent;
  transition:background .2s,transform .2s,border-color .2s;
}
.hero-slider__puntos .punto:hover{border-color:#fff}
.hero-slider__puntos .punto.is-active{background:var(--naranja);border-color:var(--naranja);transform:scale(1.2)}

/* Barra de progreso del autoplay */
.hero-slider__progreso{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.12);z-index:4}
.hero-slider__progreso span{display:block;height:100%;width:0;background:var(--naranja)}
.hero-slider.is-playing .hero-slider__progreso span{animation:progreso var(--slider-int,7s) linear forwards}
@keyframes progreso{from{width:0}to{width:100%}}

/* -------- Animaciones de las escenas -------- */
.es-bob{animation:esBob 4s ease-in-out infinite;transform-origin:center}
@keyframes esBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
.es-float{animation:esFloat 5s ease-in-out infinite}
@keyframes esFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.es-wave{animation:esWave 3.4s ease-in-out infinite}
.es-wave-slow{animation:esWave 5.2s ease-in-out infinite}
@keyframes esWave{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
.es-twinkle{animation:esTwinkle 3s ease-in-out infinite}
@keyframes esTwinkle{0%,100%{opacity:.35}50%{opacity:.85}}
.es-dash{animation:esDash 6s linear infinite}
@keyframes esDash{to{stroke-dashoffset:-140}}
.es-dash--2{animation-duration:8s}
.es-cloud{animation:esCloud 16s linear infinite}
.es-cloud--2{animation:esCloud 22s linear infinite}
.es-cloud--3{animation:esCloud 19s linear infinite}
@keyframes esCloud{0%{transform:translateX(-14px)}50%{transform:translateX(18px)}100%{transform:translateX(-14px)}}
.es-fly{animation:esFly 5s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes esFly{0%,100%{transform:translate(0,0)}50%{transform:translate(-6px,-10px)}}
.es-rot{animation:esRot 26s linear infinite;transform-box:fill-box;transform-origin:center}
@keyframes esRot{to{transform:rotate(360deg)}}
.es-plane-move{animation:esPlaneMove 7s ease-in-out infinite;transform-box:fill-box}
@keyframes esPlaneMove{
  0%{transform:translate(120px,300px) rotate(-28deg);opacity:0}
  15%{opacity:1}
  85%{opacity:1}
  100%{transform:translate(520px,238px) rotate(18deg);opacity:0}
}

/* =====================================================================
   UTILIDADES DE APARICION AL HACER SCROLL (reveal) + micro-interacciones
   ===================================================================== */
[data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .6s ease,transform .6s ease}
[data-reveal].reveal-in{opacity:1;transform:none}
/* Escalonado de hijos directos */
[data-reveal-stagger].reveal-in>*{animation:revealChild .55s ease both}
[data-reveal-stagger].reveal-in>*:nth-child(1){animation-delay:.04s}
[data-reveal-stagger].reveal-in>*:nth-child(2){animation-delay:.12s}
[data-reveal-stagger].reveal-in>*:nth-child(3){animation-delay:.20s}
[data-reveal-stagger].reveal-in>*:nth-child(4){animation-delay:.28s}
[data-reveal-stagger].reveal-in>*:nth-child(5){animation-delay:.36s}
[data-reveal-stagger].reveal-in>*:nth-child(6){animation-delay:.44s}
[data-reveal-stagger].reveal-in>*:nth-child(7){animation-delay:.52s}
[data-reveal-stagger].reveal-in>*:nth-child(8){animation-delay:.60s}
@keyframes revealChild{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}

/* Cabecera con sombra al hacer scroll */
.site-header{transition:box-shadow .25s ease}
.site-header.is-scrolled{box-shadow:0 6px 20px rgba(22,36,63,.10)}

/* Realce de tarjetas y botones (mas vida) */
.card,.ventaja,.post-card{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.card:hover,.post-card:hover{transform:translateY(-6px);box-shadow:0 14px 30px rgba(22,36,63,.12)}
.card:hover .card__icono{transform:scale(1.08)}
.card__icono{transition:transform .25s ease}
.ventaja:hover{transform:translateY(-4px);box-shadow:var(--sombra)}
.ventaja:hover .ventaja__icono{background:var(--naranja);color:#fff}
.ventaja__icono{transition:background .2s ease,color .2s ease}
.btn{transition:background .15s,color .15s,border-color .15s,transform .12s,box-shadow .15s}
.btn:active{transform:translateY(1px)}
.btn--naranja:hover{box-shadow:0 8px 20px rgba(238,114,3,.28)}
.chip{transition:transform .15s ease,background .15s ease,color .15s ease}
.chip:hover{transform:translateY(-3px);background:var(--naval);color:#fff}

/* =====================================================================
   RESPONSIVE del slider
   ===================================================================== */
@media (max-width:960px){
  .hero-slider__track{min-height:auto}
  .slide{position:relative;opacity:1;visibility:visible;display:none;padding:40px 0 84px}
  .slide.is-active{display:flex}
  .slide__grid{flex-direction:column;gap:22px;text-align:center}
  .slide__texto{flex:none;max-width:640px;margin:0 auto}
  .slide__media{flex:none;order:-1;min-height:0;width:100%}
  .slide__media::before{width:320px;height:320px;box-shadow:0 0 0 26px rgba(255,255,255,.03)}
  .escena{max-width:340px}
  .slide__titulo{font-size:2.1rem}
  .slide__desc{margin-left:auto;margin-right:auto}
  .slide__botones{justify-content:center}
  .hero-slider__flecha{width:40px;height:40px;bottom:20px}
  .hero-slider__puntos{bottom:30px}
}
@media (max-width:520px){
  .slide__titulo{font-size:1.7rem}
  .slide__desc{font-size:1.02rem}
  .escena{max-width:300px}
  .hero-slider__flecha{display:none}
}

/* =====================================================================
   Respeto por usuarios que prefieren menos movimiento
   ===================================================================== */
@media (prefers-reduced-motion:reduce){
  .slide{transition:none}
  .slide__eyebrow,.slide__titulo,.slide__desc,.slide__botones{opacity:1;transform:none;animation:none}
  .es-bob,.es-float,.es-wave,.es-wave-slow,.es-twinkle,.es-dash,.es-cloud,.es-cloud--2,.es-cloud--3,.es-fly,.es-rot,.es-plane-move{animation:none}
  .es-plane-move{opacity:0}
  .hero-slider.is-playing .hero-slider__progreso span{animation:none;width:100%}
  [data-reveal]{opacity:1;transform:none;transition:none}
  [data-reveal-stagger].reveal-in>*{animation:none}
  html{scroll-behavior:auto}
}

/* =====================================================================
   LOADER DE CARGA + ASISTENTE VIRTUAL  (añadido)
   Tema blanco. Acentos naranja (--naranja) + azul marino (--naval).
   ===================================================================== */

/* ---------------------------- LOADER ---------------------------- */
#fltc-loader{
  position:fixed; inset:0; z-index:9999;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:26px; padding:24px; text-align:center;
  background:radial-gradient(1200px 600px at 50% 30%, #ffffff 0%, #f4f7fb 70%, #eef2f8 100%);
  transition:opacity .5s ease, visibility .5s ease;
}
#fltc-loader.fltc-oculto{ opacity:0; visibility:hidden; pointer-events:none; }
body.fltc-cargando{ overflow:hidden; }

.fltc-loader__logo{
  width:min(230px,58vw); height:auto;
  filter:drop-shadow(0 10px 26px rgba(22,36,63,.18));
  animation:fltcFlota 3s ease-in-out infinite;
}
@keyframes fltcFlota{
  0%,100%{ transform:translateY(0) }
  50%{ transform:translateY(-10px) }
}

/* Anillo giratorio detrás del logo */
.fltc-loader__marca{ position:relative; display:grid; place-items:center; }
.fltc-loader__marca::before{
  content:""; position:absolute; width:min(300px,74vw); height:min(300px,74vw);
  border-radius:50%;
  border:3px solid var(--gris-2);
  border-top-color:var(--naranja);
  border-right-color:var(--naval);
  animation:fltcGira 1.5s linear infinite;
}
@keyframes fltcGira{ to{ transform:rotate(360deg) } }

/* Fila de iconos (modos de transporte) */
.fltc-loader__modos{
  display:flex; align-items:flex-start; justify-content:center;
  gap:14px; flex-wrap:wrap; max-width:520px;
}
.fltc-modo{
  display:flex; flex-direction:column; align-items:center; gap:8px;
  width:88px; color:var(--texto-suave);
  opacity:.45; transform:translateY(4px);
  transition:opacity .35s ease, transform .35s ease, color .35s ease;
}
.fltc-modo svg{ width:40px; height:40px; }
.fltc-modo__txt{ font-size:.72rem; font-weight:700; letter-spacing:.02em; line-height:1.15; }
.fltc-modo.is-activo{
  opacity:1; transform:translateY(-2px); color:var(--naval);
}
.fltc-modo.is-activo svg{
  color:var(--naranja);
  filter:drop-shadow(0 6px 12px rgba(238,114,3,.28));
  animation:fltcLatido .7s ease;
}
@keyframes fltcLatido{
  0%{ transform:scale(.8) } 60%{ transform:scale(1.12) } 100%{ transform:scale(1) }
}

/* Estado + barra de progreso */
.fltc-loader__estado{
  min-height:1.2em; font-weight:700; color:var(--naval);
  font-size:1.02rem; letter-spacing:.02em;
}
.fltc-loader__barra{
  width:min(280px,70vw); height:6px; border-radius:999px;
  background:var(--gris-2); overflow:hidden;
}
.fltc-loader__barra span{
  display:block; height:100%; width:40%; border-radius:999px;
  background:linear-gradient(90deg,var(--naranja),var(--naval));
  animation:fltcBarra 1.4s ease-in-out infinite;
}
@keyframes fltcBarra{
  0%{ transform:translateX(-120%) }
  100%{ transform:translateX(320%) }
}

@media (prefers-reduced-motion: reduce){
  .fltc-loader__logo,
  .fltc-loader__marca::before,
  .fltc-modo.is-activo svg,
  .fltc-loader__barra span{ animation:none; }
}

/* ------------------------ ASISTENTE VIRTUAL ------------------------ */
#fltc-asistente{ position:fixed; right:20px; bottom:20px; z-index:9000; }

.fltc-asis__btn{
  position:relative; display:flex; align-items:center; justify-content:center;
  width:62px; height:62px; border-radius:50%; border:none; cursor:pointer;
  background:var(--naval); color:#fff; box-shadow:0 10px 24px rgba(22,36,63,.28);
  transition:transform .18s ease, background .18s ease;
}
.fltc-asis__btn:hover{ transform:translateY(-2px); background:var(--naval-2); }
.fltc-asis__btn svg{ width:30px; height:30px; }
.fltc-asis__btn::after{               /* punto de aviso */
  content:""; position:absolute; top:6px; right:6px;
  width:12px; height:12px; border-radius:50%;
  background:var(--naranja); border:2px solid #fff;
  animation:fltcPing 1.8s ease-in-out infinite;
}
.fltc-asis--abierto .fltc-asis__btn::after{ display:none; }
@keyframes fltcPing{ 0%,100%{ transform:scale(1) } 50%{ transform:scale(1.35) } }

/* Globo de saludo flotante */
.fltc-asis__globo{
  position:absolute; right:74px; bottom:8px; width:230px;
  background:#fff; color:var(--texto); border:1px solid var(--borde);
  border-radius:14px; padding:12px 14px; box-shadow:var(--sombra);
  font-size:.9rem; line-height:1.4;
  opacity:0; transform:translateY(8px) scale(.96); pointer-events:none;
  transition:opacity .25s ease, transform .25s ease;
}
.fltc-asis__globo.is-visible{ opacity:1; transform:translateY(0) scale(1); pointer-events:auto; }
.fltc-asis__globo b{ color:var(--naval); }
.fltc-asis__globo-x{
  position:absolute; top:6px; right:8px; border:none; background:none;
  color:var(--texto-suave); font-size:1rem; cursor:pointer; line-height:1;
}

/* Panel del chat */
.fltc-asis__panel{
  position:absolute; right:0; bottom:76px; width:340px; max-width:calc(100vw - 40px);
  background:#fff; border:1px solid var(--borde); border-radius:16px;
  box-shadow:0 18px 50px rgba(22,36,63,.22); overflow:hidden;
  display:flex; flex-direction:column;
  opacity:0; transform:translateY(14px) scale(.98); pointer-events:none;
  transition:opacity .22s ease, transform .22s ease;
}
.fltc-asis--abierto .fltc-asis__panel{ opacity:1; transform:translateY(0) scale(1); pointer-events:auto; }

.fltc-asis__cab{
  display:flex; align-items:center; gap:10px; padding:14px 16px;
  background:var(--naval); color:#fff;
}
.fltc-asis__cab img{ width:38px; height:38px; border-radius:50%; background:#fff; object-fit:contain; padding:3px; flex:none; }
.fltc-asis__cab h4{ color:#fff; margin:0; font-size:1rem; }
.fltc-asis__cab small{ display:flex; align-items:center; gap:6px; opacity:.85; font-size:.78rem; }
.fltc-asis__cab small::before{ content:""; width:8px; height:8px; border-radius:50%; background:#39d98a; }
.fltc-asis__cerrar{ margin-left:auto; background:none; border:none; color:#fff; font-size:1.4rem; cursor:pointer; line-height:1; }

.fltc-asis__cuerpo{
  padding:16px; display:flex; flex-direction:column; gap:10px;
  max-height:min(50vh,360px); overflow-y:auto; background:var(--gris-1);
}
.fltc-msg{
  max-width:85%; padding:10px 13px; border-radius:14px; font-size:.9rem; line-height:1.45;
  animation:fltcMsgIn .25s ease;
}
@keyframes fltcMsgIn{ from{ opacity:0; transform:translateY(6px) } to{ opacity:1; transform:none } }
.fltc-msg--bot{ align-self:flex-start; background:#fff; border:1px solid var(--borde); color:var(--texto); border-bottom-left-radius:4px; }
.fltc-msg--user{ align-self:flex-end; background:var(--naval); color:#fff; border-bottom-right-radius:4px; }

.fltc-asis__chips{ display:flex; flex-wrap:wrap; gap:8px; padding:12px 16px; border-top:1px solid var(--borde); background:#fff; }
.fltc-chip{
  border:1px solid var(--borde); background:#fff; color:var(--naval);
  padding:8px 12px; border-radius:999px; font-size:.82rem; font-weight:600;
  cursor:pointer; text-decoration:none; transition:background .15s, border-color .15s, color .15s;
}
.fltc-chip:hover{ background:var(--naranja); border-color:var(--naranja); color:#fff; }

@media (max-width:480px){
  .fltc-asis__globo{ display:none; }
}
@media (prefers-reduced-motion: reduce){
  .fltc-asis__btn::after{ animation:none; }
}

/* =====================================================================
   FORMULARIO DE CONTACTO PROFESIONAL + SELECTOR CON BUSCADOR (añadido)
   ===================================================================== */

/* Tarjeta del formulario */
.form-card{
  background:#fff; border:1px solid var(--borde); border-radius:16px;
  box-shadow:0 10px 30px rgba(22,36,63,.07); padding:26px 26px 30px;
}
.form-card__head{
  display:flex; align-items:flex-start; gap:14px;
  padding-bottom:18px; margin-bottom:22px; border-bottom:1px solid var(--gris-2);
}
.form-card__ico{
  flex:none; width:46px; height:46px; border-radius:12px;
  display:grid; place-items:center; color:var(--naranja);
  background:rgba(238,114,3,.10);
}
.form-card__head h2{ margin:0 0 4px; font-size:1.4rem; }
.form-card__head p{ margin:0; color:var(--texto-suave); font-size:.94rem; }
label .req{ color:var(--naranja); font-weight:700; }

.btn--enviar{ margin-top:6px; min-width:200px; }

/* Fila de teléfono: prefijo + número */
.tel-row{ display:grid; grid-template-columns:158px 1fr; gap:10px; align-items:stretch; }
@media (max-width:420px){ .tel-row{ grid-template-columns:130px 1fr; } }

/* ------------------- Combo con buscador ------------------- */
.fltc-combo{ position:relative; }
/* Con JS ocultamos el <select> nativo; sin JS queda visible y funcional */
.fltc-combo.is-enhanced .fltc-combo__select{
  position:absolute; opacity:0; pointer-events:none; height:0; width:0; padding:0; border:0;
}

.fltc-combo__control{
  width:100%; display:flex; align-items:center; gap:8px;
  padding:12px 14px; border:1px solid var(--borde); border-radius:8px;
  background:#fff; color:var(--texto); font-size:1rem; font-family:inherit;
  cursor:pointer; text-align:left; min-height:48px;
}
.fltc-combo__control:hover{ border-color:#cfd8e6; }
.fltc-combo.is-open .fltc-combo__control{
  border-color:var(--naranja); box-shadow:0 0 0 3px rgba(238,114,3,.12);
}
.fltc-combo__txt{ flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fltc-combo__txt.es-placeholder{ color:#9aa4b2; }
.fltc-combo__flecha{ flex:none; color:var(--texto-suave); transition:transform .18s ease; }
.fltc-combo.is-open .fltc-combo__flecha{ transform:rotate(180deg); }

.fltc-combo__panel{
  position:absolute; z-index:60; top:calc(100% + 6px); left:0; right:0;
  background:#fff; border:1px solid var(--borde); border-radius:12px;
  box-shadow:0 16px 40px rgba(22,36,63,.18); overflow:hidden;
  display:none;
}
.fltc-combo.is-open .fltc-combo__panel{ display:block; }
/* El prefijo abre un panel algo más ancho para leer el país */
.fltc-combo--dial .fltc-combo__panel{ min-width:280px; }

.fltc-combo__buscar-wrap{ padding:10px; border-bottom:1px solid var(--gris-2); position:relative; }
.fltc-combo__buscar{
  width:100%; padding:10px 12px 10px 34px; border:1px solid var(--borde);
  border-radius:8px; font-size:.95rem;
}
.fltc-combo__lupa{
  position:absolute; left:20px; top:50%; transform:translateY(-50%);
  color:var(--texto-suave); pointer-events:none;
}
.fltc-combo__lista{ max-height:260px; overflow-y:auto; padding:6px; }
.fltc-combo__op{
  display:flex; align-items:center; gap:10px;
  padding:9px 10px; border-radius:8px; cursor:pointer; font-size:.94rem; color:var(--texto);
}
.fltc-combo__op .bandera{ font-size:1.15rem; line-height:1; flex:none; }
.fltc-combo__op .dial{ color:var(--texto-suave); margin-left:auto; font-variant-numeric:tabular-nums; }
.fltc-combo__op:hover,
.fltc-combo__op.is-marcado{ background:var(--gris-1); }
.fltc-combo__op.is-selec{ background:rgba(238,114,3,.10); color:var(--naval); font-weight:600; }
.fltc-combo__vacio{ padding:16px; text-align:center; color:var(--texto-suave); font-size:.9rem; }

@media (prefers-reduced-motion: reduce){
  .fltc-combo__flecha{ transition:none; }
}

/* =====================================================================
   COBERTURA — dos cards (contenido + esfera giratoria estilo Cloudflare)
   + GALERÍAS de sección + banner con imagen
   ===================================================================== */
.cobertura-grid{
  display:grid; grid-template-columns:1.05fr .95fr; gap:36px; align-items:stretch;
}
.cob-card{
  border-radius:var(--radio-xl); padding:clamp(28px,3.4vw,48px);
  border:1px solid var(--borde); background:#fff; box-shadow:var(--sombra-md);
}
.cob-card--texto{ display:flex; flex-direction:column; justify-content:center; }
.cob-card--texto h2{ margin-top:12px; }
.cob-card--texto .cobertura{ justify-content:flex-start; margin-top:8px; }

.cob-card--globo{
  position:relative; overflow:hidden; min-height:380px;
  display:flex; align-items:center; justify-content:center;
  background:#fff; border:1px solid var(--borde); box-shadow:var(--sombra-md);
}
.cob-card--globo::before{ /* textura de puntos muy sutil sobre blanco */
  content:""; position:absolute; inset:0;
  background-image:radial-gradient(rgba(22,36,63,.06) 1px, transparent 1.4px);
  background-size:30px 30px; opacity:.7;
}

/* ---------------- Globo ---------------- */
.globo-wrap{ position:relative; z-index:1; filter:drop-shadow(0 24px 50px rgba(0,0,0,.45)); }
.globo{ position:relative; width:min(300px,64vw); aspect-ratio:1; }
.globo__esfera{
  position:absolute; inset:0; border-radius:50%;
  background:
    radial-gradient(circle at 32% 26%, rgba(255,255,255,.35) 0%, rgba(255,255,255,0) 34%),
    radial-gradient(rgba(255,255,255,.85) 1.5px, transparent 1.7px),
    radial-gradient(circle at 50% 50%, #2b527f 0%, #1b3355 52%, #0e1c33 100%);
  background-size:auto, 15px 15px, auto;
  background-position:0 0, 0 0, 0 0;
  box-shadow:inset -22px -26px 60px rgba(0,0,0,.55), inset 16px 14px 40px rgba(255,255,255,.10),
             0 0 60px rgba(238,114,3,.14);
  animation:globoGira 14s linear infinite;
}
/* La textura de puntos "gira" desplazándose horizontalmente */
@keyframes globoGira{ from{ background-position:0 0, 0 0, 0 0; } to{ background-position:0 0, -150px 0, 0 0; } }

.globo__brillo{
  position:absolute; inset:0; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle at 30% 24%, rgba(255,255,255,.30) 0%, rgba(255,255,255,0) 40%);
}
.globo__lineas{
  position:absolute; inset:0; width:100%; height:100%; border-radius:50%; overflow:hidden;
  opacity:.55;
}
/* Puntos activos (nodos) que laten */
.globo__punto{
  position:absolute; width:10px; height:10px; border-radius:50%;
  background:var(--naranja); box-shadow:0 0 0 4px rgba(238,114,3,.25), 0 0 12px rgba(238,114,3,.8);
  animation:globoPing 2.4s ease-in-out infinite;
}
.globo__punto--1{ top:30%; left:34%; animation-delay:0s; }
.globo__punto--2{ top:52%; left:62%; animation-delay:.7s; }
.globo__punto--3{ top:66%; left:40%; animation-delay:1.2s; background:#fff; box-shadow:0 0 0 4px rgba(255,255,255,.2),0 0 12px rgba(255,255,255,.7); }
.globo__punto--4{ top:40%; left:70%; animation-delay:1.8s; }
@keyframes globoPing{ 0%,100%{ transform:scale(.7); opacity:.55 } 50%{ transform:scale(1.15); opacity:1 } }

/* Órbita inclinada (satélite) alrededor del globo */
.globo__orbita{
  position:absolute; top:50%; left:50%; width:132%; height:132%;
  transform:translate(-50%,-50%) rotateX(72deg) rotateZ(0deg);
  border:1.5px dashed rgba(238,114,3,.5); border-radius:50%;
  animation:globoOrbita 9s linear infinite;
}
@keyframes globoOrbita{ from{ transform:translate(-50%,-50%) rotateX(72deg) rotateZ(0deg); } to{ transform:translate(-50%,-50%) rotateX(72deg) rotateZ(360deg); } }

/* ---------------- Galería de sección ---------------- */
.galeria{ display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:16px; }
.galeria__item{
  display:block; aspect-ratio:4/3; border-radius:var(--radio-lg); overflow:hidden;
  border:1px solid var(--borde); box-shadow:var(--sombra-sm); background:var(--gris-1);
}
.galeria__item img{ width:100%; height:100%; object-fit:cover; transition:transform .45s ease; }
.galeria__item:hover img{ transform:scale(1.07); }

/* ---------------- Banner con imagen (cabeceras) ---------------- */
.page-header--img::before{ opacity:.28; }
.page-header--img::after{ opacity:.5; }

@media (max-width:860px){
  .cobertura-grid{ grid-template-columns:1fr; }
  .cob-card--globo{ min-height:320px; }
}
@media (prefers-reduced-motion: reduce){
  .globo__esfera{ animation:none; }
  .globo__orbita{ animation:none; }
  .globo__punto{ animation:none; }
}

/* =====================================================================
   Tokens y ajustes de soporte (autocontenidos, para los añadidos nuevos)
   ===================================================================== */
:root{
  --radio-lg:16px;
  --radio-xl:24px;
  --sombra-sm:0 4px 16px rgba(22,36,63,.06);
  --sombra-md:0 14px 34px rgba(22,36,63,.10);
  --sombra-lg:0 28px 64px rgba(22,36,63,.16);
  --naval-deep:#0f1b30;
  --naranja-tint:rgba(238,114,3,.10);
}

/* Banner con imagen: texto legible sobre la foto (overlay oscuro) */
.page-header--img{ color:#fff; }
.page-header--img h1{ color:#fff; }
.page-header--img .breadcrumbs{ color:#dfe6f0; }
.page-header--img .breadcrumbs a{ color:#fff; }
.page-header--img .breadcrumbs a:hover{ color:var(--naranja); }

/* =====================================================================
   HERO MINIMALISTA — slider de fotos con capa de fondo plana (sin degradados)
   ===================================================================== */
.hero-slider{ background:#0f1b30; }
.hero-slider::before{ display:none; }            /* sin textura de puntos */

.slide{
  background-size:cover; background-position:center; background-repeat:no-repeat;
  padding:0;
}
.slide::before{                                   /* capa de fondo PLANA (sin gradiente) */
  content:""; position:absolute; inset:0; z-index:0;
  background:rgba(11,20,36,.56);
}
.slide__grid{ position:relative; z-index:1; display:block; }
.slide__texto{ flex:none; max-width:660px; }
.slide__media{ display:none; }                    /* fuera la ilustración */

/* Eyebrow minimalista: línea + texto */
.slide__eyebrow{
  display:inline-flex; align-items:center; gap:12px;
  margin-bottom:18px; font-size:.78rem; letter-spacing:.24em; color:var(--naranja);
}
.slide__eyebrow::before{ content:""; width:36px; height:1px; background:var(--naranja); }

.slide__titulo{
  color:#fff; font-weight:800; letter-spacing:-.02em;
  font-size:clamp(2.2rem,5.2vw,4.2rem); line-height:1.05; margin:0 0 18px; max-width:16ch;
}
.slide__desc{ color:#e8edf4; font-size:clamp(1.02rem,1.5vw,1.22rem); max-width:52ch; margin:0 0 32px; }
.slide__botones{ display:flex; gap:14px; flex-wrap:wrap; }

/* Botón claro -> outline minimalista */
.btn--claro{ background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,.65); }
.btn--claro:hover{ background:#fff; color:var(--naval); border-color:#fff; }

/* Puntos alineados a la izquierda (bajo el texto) */
.hero-slider__puntos.contenedor{ left:0; right:0; margin-inline:auto; justify-content:flex-start; }

@media (max-width:768px){
  .slide{ display:flex; }
  .slide__texto{ max-width:none; }
  .slide__botones{ }
}

/* Video responsivo (YouTube) en la seccion Nosotros */
.video-embed{
  position:relative; width:100%; aspect-ratio:16/9;
  border-radius:var(--radio-lg,16px); overflow:hidden;
  border:1px solid var(--borde); box-shadow:var(--sombra-md,0 14px 34px rgba(22,36,63,.10)); background:#000;
}
.video-embed iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }

/* =====================================================================
   PAGINA DE DETALLE (servicio / articulo) — contenido + menu lateral
   ===================================================================== */
.detalle-grid{ display:grid; grid-template-columns:1fr 350px; gap:44px; align-items:start; }
.detalle-main{ min-width:0; }

/* Intro destacada con acento (como en la referencia) */
.detalle-lead{
  font-size:clamp(1.15rem,1.6vw,1.35rem); line-height:1.55; color:var(--naval);
  font-weight:600; border-left:3px solid var(--naranja); padding:2px 0 2px 20px; margin:26px 0;
}

/* Menu lateral pegajoso */
.detalle-side{ position:sticky; top:100px; display:flex; flex-direction:column; gap:18px; }

.side-card{ background:var(--naval); color:#fff; border-radius:16px; padding:24px; }
.side-card h3{ color:#fff; margin:0 0 8px; font-size:1.18rem; }
.side-card p{ color:#c7d2e2; margin:0 0 18px; font-size:.92rem; line-height:1.5; }
.side-card__title{ color:#fff; margin:0 0 14px; font-size:1.05rem; }
.side-btn{ width:100%; justify-content:center; gap:8px; }

/* Ficha (clave / valor) */
.ficha__row{ display:flex; justify-content:space-between; align-items:center; gap:12px;
  padding:13px 0; border-top:1px solid rgba(255,255,255,.10); }
.ficha__row:first-child{ border-top:0; padding-top:0; }
.ficha__k{ font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:#8fa0b8; }
.ficha__v{ font-weight:700; color:#fff; text-align:right; }

/* Enlaces "sigue explorando" */
.side-link{ display:block; padding:13px 0; border-top:1px solid rgba(255,255,255,.10); }
.side-link:first-of-type{ border-top:0; padding-top:0; }
.side-link__k{ display:block; font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--naranja); }
.side-link__v{ display:block; font-weight:600; color:#fff; margin-top:3px; line-height:1.35; }
.side-link:hover .side-link__v{ color:var(--naranja); }

@media (max-width:900px){
  .detalle-grid{ grid-template-columns:1fr; gap:28px; }
  .detalle-side{ position:static; }
}