/* Civiltek · Pulido de la portada (22/10/2026).
   Misma estructura y contenido; solo profundidad sutil en el fondo oscuro, el showreel destacado,
   entradas suaves al hacer scroll y respuesta al pasar el ratón. */

/* Grano finísimo sobre todo el fondo: quita el aspecto de negro plano */
body::after{content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.06;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}

/* Portada: luz turquesa tenue detrás del showreel */
.home-experience .home-origin.home-gateway{background:
  radial-gradient(50% 70% at 72% 42%,rgba(20,213,207,.17),rgba(20,213,207,0) 72%),
  radial-gradient(40% 52% at 4% 100%,rgba(20,213,207,.07),rgba(20,213,207,0) 70%),
  #0d1117}

/* El showreel como pieza principal: borde de luz en lugar de sombra negra */
/* reflejo turquesa solo por encima del reel, sobre la portada en negro */
.home-showreel .showreel-frame{box-shadow:0 0 0 1px rgba(20,213,207,.22),0 -34px 70px -38px rgba(20,213,207,.55);transition:box-shadow .5s ease}
.home-showreel:hover .showreel-frame{box-shadow:0 0 0 1px rgba(20,213,207,.4),0 -38px 80px -38px rgba(20,213,207,.65)}


/* Respuesta al pasar el ratón */
.vd-section a[href*="visor.civiltek.es"],.home-flow-steps button,.plicas-visual,.home-areas-strip a,.showreel-cta{transition:transform .28s cubic-bezier(.16,1,.3,1),box-shadow .28s,border-color .28s}
.vd-section a[href*="visor.civiltek.es"]:hover{transform:translateY(-4px)}
.showreel-cta:hover{transform:translateY(-2px)}
.plicas-visual:hover{transform:translateY(-4px)}

/* Entradas suaves: el contenido es visible por defecto; solo se anima lo que aún no está en pantalla */
.pul-pre{opacity:0;transform:translateY(18px)}
.pul-in{opacity:1;transform:none;transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1)}

@media (prefers-reduced-motion:reduce){
  .pul-pre{opacity:1;transform:none}
  .pul-in{transition:none}
  .home-showreel .showreel-frame,.vd-section a,.showreel-cta,.plicas-visual{transition:none}
}

/* Relieve de Civiltek como fondo fijo de toda la portada: la cámara avanza sobre el terreno al hacer scroll (pulido.js).
   Las secciones quedan en velo oscuro semitransparente para que el texto se lea y el relieve se intuya detrás. */
main.home-experience{background:transparent}
.home-experience .home-origin.home-gateway{background:transparent}
.home-experience .vd-section,.home-experience .home-area,.home-experience .plicas-section,.home-experience .home-areas-strip,.home-experience .home-finale{
  background-color:rgba(13,17,23,.5);background-image:none;border-top:0;border-bottom:0}
#pul-fondo{position:fixed;inset:0;z-index:-1;overflow:hidden;background:#0d1117;pointer-events:none}
#pul-fondo .terreno{position:absolute;inset:0;width:100%;height:100%;display:block}
#pul-fondo .velo{position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(13,17,23,.8) 0%,rgba(13,17,23,.6) 26%,rgba(13,17,23,.14) 55%,rgba(13,17,23,0) 75%),
  linear-gradient(180deg,rgba(13,17,23,.32) 0%,rgba(13,17,23,0) 18%,rgba(13,17,23,0) 80%,rgba(13,17,23,.36) 100%)}
@media (max-width:900px){#pul-fondo .velo{background:linear-gradient(180deg,rgba(13,17,23,.72),rgba(13,17,23,.48) 50%,rgba(13,17,23,.62))}}

/* Eje de replanteo que recorre la portada */
#pul-eje{position:absolute;top:0;left:0;width:56px;pointer-events:none;z-index:50;overflow:visible}
#pul-eje .base{stroke:rgba(20,213,207,.14);stroke-width:1;fill:none}
#pul-eje .traza{stroke:#14d5cf;stroke-width:1.4;fill:none;stroke-linecap:round}
#pul-eje .pk{fill:rgba(20,213,207,.75);font:500 11px Outfit,"Segoe UI",sans-serif;letter-spacing:.06em;font-variant-numeric:tabular-nums}
#pul-eje .tick{stroke:rgba(20,213,207,.6);stroke-width:1}
#pul-eje .estacion{fill:#14d5cf}
#pul-eje .halo{fill:rgba(20,213,207,.18)}
@media (max-width:900px){#pul-eje .pk{font-size:8.5px;letter-spacing:.04em}#pul-eje .traza{stroke-width:1.1}}
@media (prefers-reduced-motion:reduce){#pul-eje .halo{display:none}}

/* Cabecera: deja ver el relieve de fondo a través de un cristal oscuro */
html body header.site-header{background:linear-gradient(90deg,rgba(13,17,23,.66),rgba(13,17,23,.28) 55%,rgba(13,17,23,.12))!important;
  -webkit-backdrop-filter:blur(1.5px) saturate(1.2);backdrop-filter:blur(1.5px) saturate(1.2);border-bottom-color:rgba(20,213,207,.16)}

/* Pie: el recorrido termina con el relieve más presente detrás del pie */
html body footer.site-footer{background:linear-gradient(90deg,rgba(13,17,23,.66),rgba(13,17,23,.28) 55%,rgba(13,17,23,.12))!important;border-top:0!important;
  -webkit-backdrop-filter:blur(1.5px) saturate(1.2);backdrop-filter:blur(1.5px) saturate(1.2)}
html body footer.site-footer a,html body footer.site-footer p,html body footer.site-footer li,html body footer.site-footer small{text-shadow:0 1px 10px rgba(13,17,23,.9)}

/* Modelo 3D del intercambiador: sin caja negra, el relieve de fondo se ve detrás (escena con transparent:true en home-model.js) */
.home-experience .home-service .home-model{background:transparent;border-color:transparent}
/* velo negro translúcido y difuminado detrás del modelo, con los bordes desvanecidos (sin caja) */
.home-experience .home-service .home-model::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:rgba(13,17,23,.5);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  -webkit-mask-image:radial-gradient(ellipse 78% 76% at 50% 50%,#000 32%,transparent 100%);mask-image:radial-gradient(ellipse 78% 76% at 50% 50%,#000 32%,transparent 100%)}
.home-experience .home-service .home-model>picture{position:relative;z-index:1;pointer-events:none}

/* Plicas en un MacBook: marco negro de pantalla con cámara, base de aluminio con muesca y ventana de macOS */
.plicas-section .plicas-visual{overflow:visible;padding:clamp(10px,1.4vw,16px) clamp(10px,1.4vw,16px) clamp(14px,1.8vw,20px);margin-bottom:30px;
  background:linear-gradient(180deg,#16181b,#0b0c0e);border:1px solid #2c2f34;border-radius:18px 18px 6px 6px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.04),0 34px 60px -26px rgba(0,0,0,.85)}
.plicas-section .plicas-visual:hover{border-color:#3a3e44}
.plicas-section .plicas-visual::before{content:"";position:absolute;top:calc(clamp(10px,1.4vw,16px) / 2 - 2.5px);left:50%;width:5px;height:5px;margin-left:-2.5px;
  border-radius:50%;background:#10181d;box-shadow:inset 0 0 0 1px #2c3a42,0 0 3px rgba(20,213,207,.15)}
.plicas-section .plicas-visual::after{content:"";position:absolute;left:-7%;right:-7%;bottom:-15px;height:15px;border-radius:3px 3px 16px 16px/3px 3px 12px 12px;
  background:linear-gradient(#8e949a,#8e949a) 50% 0/15% 4px no-repeat,linear-gradient(180deg,#e2e5e8 0%,#c3c8cd 35%,#9aa0a6 75%,#70757b 100%);
  box-shadow:0 16px 24px -12px rgba(0,0,0,.75),inset 0 1px 0 rgba(255,255,255,.6)}
.plicas-section .plicas-browser{border-radius:4px 4px 0 0;background:#1e2329}
.plicas-section .plicas-browser i:nth-child(1){background:#ff5f57}
.plicas-section .plicas-browser i:nth-child(2){background:#febc2e}
.plicas-section .plicas-browser i:nth-child(3){background:#28c840}
.plicas-section .plicas-visual img{border-radius:0 0 3px 3px}
@media (max-width:760px){.plicas-section .plicas-visual::after{left:-5%;right:-5%;height:11px;bottom:-11px}}

/* Accesos de licitaciones: tarjetas de cristal sobre el relieve (sin la escena 3D de cajas grises) */
.home-experience .tender-actions .tender-action{background:rgba(13,17,23,.46);border:1px solid rgba(255,255,255,.08);border-radius:6px;
  -webkit-backdrop-filter:blur(10px) saturate(1.15);backdrop-filter:blur(10px) saturate(1.15);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);transition:transform .35s cubic-bezier(.16,1,.3,1),border-color .3s,background-color .3s,box-shadow .3s}
.home-experience .tender-actions .tender-action:hover,.home-experience .tender-actions .tender-action:focus-visible{outline:0;transform:translateY(-3px);
  border-color:rgba(20,213,207,.55);background:rgba(20,213,207,.07);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 18px 40px -24px rgba(20,213,207,.45)}
.home-experience .tender-actions .tender-action-contact{background:linear-gradient(160deg,rgba(20,213,207,.14),rgba(13,17,23,.46) 70%);border-color:rgba(20,213,207,.28)}
@media (prefers-reduced-motion:reduce){.home-experience .tender-actions .tender-action:hover{transform:none}}