:root{--r:#E30613;--b:#0d0d0d}*{margin:0;padding:0;box-sizing:border-box;font-family:Arial}body{background:#0d0d0d;color:#fff;padding-top:86px}header{position:fixed;top:0;left:0;right:0;z-index:90;display:flex;justify-content:space-between;padding:16px 5%;border-bottom:2px solid var(--r)}nav a{color:#fff;margin:0 12px;text-decoration:none;font-size:14px}.hero{padding:70px 5%;display:grid;grid-template-columns:1.2fr .8fr;gap:20px}.btn{background:var(--r);color:#fff;padding:14px 24px;border-radius:6px;text-decoration:none;display:inline-block;font-weight:800;margin-top:18px}.cards{padding:40px 5%;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;background:#f5f5f5;color:#111}.card{background:#fff;padding:20px;border-radius:10px;text-align:center;box-shadow:0 4px 12px rgba(0,0,0,.1)}footer{background:#000;text-align:center;padding:16px;font-size:13px;color:#aaa}.contacto{padding:40px 5%;display:grid;grid-template-columns:1fr 1fr;gap:20px}@media(max-width:860px){.hero,.cards,.contacto{grid-template-columns:1fr}}

.trabajos{padding:40px 5%}
/* Tipografia homologada de secciones */
h1{font-size:42px;line-height:1.15}
h2{font-size:28px;line-height:1.2}
h3{font-size:18px;line-height:1.3}
p{font-size:16px;line-height:1.55}
@media(max-width:640px){h1{font-size:30px}h2{font-size:22px}}
/* Estado del formulario */
.form-status{padding:12px 14px;border-radius:8px;font-weight:600;margin-bottom:10px}
.form-status:empty{display:none}
.form-status.ok{color:#8fe3a2;background:rgba(46,160,67,.18)}
.form-status.bad{color:#c62828;background:#fdecea}
/* Boton flotante de WhatsApp */
.whatsapp{position:fixed;right:18px;bottom:18px;z-index:99;width:56px;height:56px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(0,0,0,.55);transition:transform .2s ease}
.whatsapp:hover{transform:scale(1.08)}
.whatsapp svg{width:28px;height:28px;fill:#fff;display:block}

/* Redes sociales */
.social-card{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;margin-top:16px;padding:14px 16px;border:1px solid rgba(255,255,255,.25);border-radius:12px;background:rgba(255,255,255,.06)}
.social-title{font-size:13px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:#bbb;margin-right:4px}
.social-card a{display:flex;flex:0 0 auto;line-height:0;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;color:#fff}
.social-card a svg{width:22px;height:22px;fill:currentColor;display:block}
.social-card a:hover,.social-card a:focus-visible,.social-card a:active{color:#E30613}

/* Galeria animada (marquee) */
.marquee{overflow:hidden;margin-top:16px}
.marquee-track{display:flex;width:max-content;animation:marquee 40s linear infinite}
.gal-item{flex:0 0 auto;margin-right:14px;background:none;border:0;padding:0;cursor:pointer}
.gal-item img{width:300px;height:210px;object-fit:cover;border-radius:10px;display:block}
.marquee:hover .marquee-track,.marquee:focus-within .marquee-track{animation-play-state:paused}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee-track{animation:none}.marquee{overflow-x:auto}}
/* Lightbox (visor de imagenes) */
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.87);z-index:300;display:flex;align-items:center;justify-content:center;gap:14px;padding:24px}
.lightbox[hidden]{display:none}
.lb-img{max-width:88vw;max-height:78vh;border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.lb-cap{color:#fff;text-align:center;margin-top:10px;font-size:14px}
.lb-close,.lb-prev,.lb-next{border:0;cursor:pointer;background:rgba(255,255,255,.15);color:#fff;width:44px;height:44px;border-radius:50%;font-size:22px;line-height:1}
.lb-close{position:absolute;top:18px;right:18px}
.lightbox figure{margin:0;text-align:center}
/* Mapa de ubicacion */
.mapa{display:block;width:100%;height:240px;border:1px solid #333;border-radius:10px;margin-top:16px}
.mapa-link{margin-top:10px;font-size:14px}
.mapa-link a{color:#fff;text-decoration:underline}
/* Logo en header (chip blanco sobre fondo negro) */
.logo-chip{display:inline-block}
.logo-chip img{display:block;height:40px;width:auto}
header{align-items:center}
/* Seccion quienes somos */
.quienes{padding:40px 5%}
.quienes p{margin-top:10px;color:#ddd;max-width:1000px}
/* Seccion servicios con encabezado */
.servicios{padding:40px 5%;background:#f5f5f5;color:#111}
.servicios h2{color:#111}
.servicios .intro{margin-top:10px;color:#555;max-width:1000px}
.servicios .cards{padding:0;background:none}
.cta-centro{text-align:center;margin-top:22px}
/* Banda de valores */
.valores{padding:40px 5%}
.valores-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.v-card{background:#1a1a1a;border:1px solid #333;padding:22px;border-radius:10px}
.v-card h3{color:#fff}
.v-card p{margin-top:10px;color:#ddd;font-size:15px}
@media(max-width:860px){.valores-grid{grid-template-columns:1fr}}

/* Scroll reveal */
.js .reveal{opacity:0;transform:translateY(34px);transition:opacity .8s cubic-bezier(.2,.6,.2,1),transform .8s cubic-bezier(.2,.6,.2,1);transition-delay:var(--d,0s)}
.js .reveal-left{transform:translateX(-44px)}
.js .reveal-right{transform:translateX(44px)}
.js .reveal-scale{transform:scale(.94)}
.js .reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none;transition:none}}

/* Titulo del formulario */
.form-title{margin:0 0 12px;font-size:17px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:#111;border-left:4px solid #E30613;padding-left:10px}

/* Header fijo translucido con desenfoque */
header{
background:rgba(0,0,0,.75);
-webkit-backdrop-filter:blur(8px);
backdrop-filter:blur(8px)}
/* Header fijo: compensacion de anclas */
section[id],div[id]{scroll-margin-top:96px}
/* Burger y menu movil (variante oscura) */
.burger{display:none;background:none;border:0;cursor:pointer;padding:10px;color:#fff}
.burger span{display:block;width:26px;height:3px;background:currentColor;margin:5px 0;border-radius:2px;transition:transform .3s,opacity .3s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
.menu-movil{position:fixed;top:86px;left:0;right:0;z-index:89;background:#0d0d0d;color:#fff;border-top:2px solid #E30613;box-shadow:0 12px 24px rgba(0,0,0,.45);padding:10px 5% 18px}
.menu-movil a{display:block;margin:0;padding:13px 0;font-size:16px;font-weight:700;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.12);color:#fff}
@media(max-width:820px){header nav{display:none}.burger{display:block}}
@media(min-width:821px){.menu-movil{display:none}}
/* Consentimiento Ley 21.719 art. 12 (tarjeta blanca del formulario) */
.consent{display:flex;gap:9px;align-items:flex-start;font-size:13px;color:#333;margin:10px 0}
.consent input{width:18px;height:18px;margin-top:2px;flex:0 0 auto;accent-color:#E30613}
.consent a{color:#E30613;font-weight:700}
/* Modal politica de privacidad */
.policy-modal{position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:320;display:flex;align-items:center;justify-content:center;padding:20px}
.policy-modal[hidden]{display:none}
.policy-box{position:relative;width:min(920px,96vw);height:86vh;background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 24px 70px rgba(0,0,0,.45)}
.policy-frame{width:100%;height:100%;border:0}
.policy-close{position:absolute;top:10px;right:12px;z-index:2;width:40px;height:40px;border-radius:50%;border:0;background:#E30613;color:#fff;font-size:22px;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.35)}
/* Mapa: linea de direccion (variante oscura) */
.mapa-line{margin:0;color:#fff}
footer a{color:#ccc;text-decoration:underline}
/* Nav: estado activo de la seccion visible */
nav a.active:not([style]){color:#E30613;font-weight:800}
.menu-movil a.active:not([style]){color:#E30613;background:rgba(227,6,19,.07)}

/* Scroll suave al navegar por anclas */
@media (prefers-reduced-motion: no-preference){html{scroll-behavior:smooth}}

/* Lightbox en movil: imagen completa y centrada */
.lightbox figure{min-width:0}
.lb-img{max-width:100%;object-fit:contain}
@media(max-width:640px){
  .lightbox{padding:12px}
  .lb-img{max-width:calc(100vw - 24px);max-height:72vh}
  .lb-prev,.lb-next{position:absolute;top:50%;transform:translateY(-50%);z-index:2}
  .lb-prev{left:10px}
  .lb-next{right:10px}
  .lb-cap{font-size:12px}
}

.consent span{line-height:1.45}

/* UX: foco visible y estados de interaccion */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #E30613;outline-offset:2px}
input:focus-visible,textarea:focus-visible{border-color:#E30613;box-shadow:0 0 0 3px rgba(227,6,19,.15)}
input:user-invalid,textarea:user-invalid{border-color:#c62828;box-shadow:0 0 0 3px rgba(198,40,40,.12)}
.btn,.btn-rojo,.burger,.lb-prev,.lb-next{transition:filter .2s ease,transform .15s ease,box-shadow .2s ease}
.btn:hover,.btn-rojo:hover{filter:brightness(1.08)}
button[type="submit"]:active,.btn:active,.btn-rojo:active{transform:translateY(1px)}
button[type="submit"]:disabled{opacity:.7;cursor:progress}