:root{
  --azul: #0E2A54;
  --azul-oscuro: #081B38;
  --naranja: #C24E08;
  --naranja-oscuro: #A34004;
  --naranja-claro: #E8600C;
  --acero: #4A5A6B;
  --concreto: #F3F4F1;
  --blanco: #FFFFFF;
  --grafito: #12181F;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
/* cursor personalizado: alzaprima — se mantiene el puntero estándar en elementos interactivos por usabilidad */
html, body{
  cursor: url('../img/cursor-alzaprima.svg') 4 3, auto;
}
a, button, .btn, input[type="submit"], input[type="button"], select,
.menu-toggle, .faq-item summary, .checkbox-group label, .file-drop, label[for]{
  cursor: pointer;
}
body{
  font-family:'Inter', sans-serif;
  color:var(--grafito);
  background:var(--blanco);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{ font-family:'Barlow Condensed', sans-serif; font-weight:800; letter-spacing:0.01em; line-height:1.05; }
.mono{ font-family:'IBM Plex Mono', monospace; }
a{ color:inherit; text-decoration:none; }
img{ display:block; max-width:100%; }
.container{ max-width:1180px; margin:0 auto; padding:0 24px; }
.visually-hidden{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline:3px solid var(--naranja); outline-offset:2px;
}

/* placeholder de imagen faltante */
.ph{
  position:relative;
  background: repeating-linear-gradient(135deg, #dfe3e8 0 2px, #eceef1 2px 14px);
  border:1px dashed var(--acero);
  display:flex; align-items:center; justify-content:center;
  color:var(--acero); text-align:center; overflow:hidden;
}
.ph .ph-label{
  background:rgba(14,42,84,0.92); color:#fff; font-family:'IBM Plex Mono', monospace;
  font-size:11px; letter-spacing:.04em; padding:10px 14px; border-radius:2px; max-width:80%;
}
.ph .ph-label b{ display:block; font-size:12.5px; color:#ffb37a; margin-bottom:3px;}

/* topbar */
.topbar{ background:var(--azul-oscuro); color:#c9d3e0; font-size:12.5px; }
.topbar .container{ display:flex; justify-content:space-between; align-items:center; height:34px; }
.topbar a{ color:#fff; }
.topbar .sep{ opacity:.4; margin:0 8px; }

/* header */
header.main{ background:#fff; border-bottom:1px solid #E7E9EC; position:sticky; top:0; z-index:50; }
header.main .container{ display:flex; align-items:center; justify-content:space-between; height:78px; }
.logo{ display:flex; align-items:center; gap:10px; }
.logo-img{ height:38px; width:auto; display:block; }
.logo-img-white{ filter: brightness(0) invert(1); opacity:.95; }
nav.desktop{ display:flex; align-items:center; gap:34px; font-weight:600; font-size:14.5px; }
nav.desktop .drop{ position:relative; padding-bottom:12px; margin-bottom:-12px; }
nav.desktop .drop:hover .drop-menu, nav.desktop .drop:focus-within .drop-menu{ display:block; }
nav.desktop .drop-menu{
  display:none; position:absolute; top:100%; left:-16px; margin-top:0; background:#fff; border:1px solid #E7E9EC;
  box-shadow:0 16px 32px rgba(14,42,84,.12); min-width:230px; padding:8px; z-index:60;
}
nav.desktop .drop-menu a{ display:block; padding:10px 12px; font-weight:600; font-size:14px; border-radius:2px; }
nav.desktop .drop-menu a:hover{ background:var(--concreto); color:var(--naranja); }
nav.desktop a.top-link:hover{ color:var(--naranja); cursor:pointer; }
nav.desktop a.active{ color:var(--naranja); }
.header-actions{ display:flex; gap:10px; align-items:center; }
.btn{ display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:14px; padding:12px 22px; border-radius:2px; transition:.15s; border:none; cursor:pointer; font-family:'Inter'; }
.btn-primary{ background:var(--naranja); color:#fff; }
.btn-primary:hover{ background:var(--naranja-oscuro); }
.btn-outline{ border:1.5px solid var(--azul); color:var(--azul); background:transparent; }
.btn-outline:hover{ background:var(--azul); color:#fff; }
.btn-outline-white{ border:1.5px solid #fff; color:#fff; background:transparent; }
.btn-outline-white:hover{ background:#fff; color:var(--azul); }
.btn-wsp{ background:#1E7B45; color:#fff; }
.btn-wsp:hover{ background:#166236; }
.btn-block{ width:100%; justify-content:center; }
.menu-toggle{ display:none; background:none; border:none; padding:8px; }
.menu-toggle span{ display:block; width:24px; height:2px; background:var(--azul); margin:5px 0; }

/* breadcrumb */
.breadcrumb{ background:var(--concreto); padding:14px 0; font-size:13px; color:var(--acero); }
.breadcrumb a:hover{ color:var(--naranja); }
.breadcrumb .sep{ margin:0 6px; opacity:.5; }

/* HERO home */
.hero{ position:relative; background:var(--azul); color:#fff; overflow:hidden; }
.hero::before{
  content:""; position:absolute; inset:0;
  background-image: linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px);
  background-size:56px 56px; opacity:.5;
}
/* video de fondo del hero: puramente estético, el texto va siempre encima */
.hero-video-bg::before{ display:none; } /* el video reemplaza la grilla como efecto de fondo */
.hero-bg-video{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;
}
.hero-bg-overlay{
  position:absolute; inset:0; z-index:1;
  background: linear-gradient(100deg,
    rgba(8,27,56,.94) 0%, rgba(8,27,56,.88) 30%,
    rgba(10,32,64,.72) 55%, rgba(14,42,84,.48) 78%, rgba(14,42,84,.32) 100%);
}
.hero-content{ position:relative; z-index:2; padding:104px 0 88px; }
.hero-video-badge{
  position:absolute; right:20px; bottom:18px; z-index:2;
  background:rgba(8,27,56,.75); backdrop-filter: blur(2px);
  color:#ffb37a; font-family:'IBM Plex Mono'; font-size:10.5px; letter-spacing:.05em;
  padding:6px 10px; border-radius:2px; display:flex; align-items:center; gap:7px;
}
.hero-grid{ position:relative; display:grid; grid-template-columns:1.05fr 0.95fr; gap:48px; align-items:center; padding:76px 0 64px; }
.eyebrow{ font-family:'IBM Plex Mono'; font-size:12.5px; letter-spacing:.12em; color:#ffb37a; text-transform:uppercase; display:flex; align-items:center; gap:10px; margin-bottom:18px;}
.eyebrow .line{ width:32px; height:1px; background:#ffb37a; }
.hero h1{ font-size:52px; color:#fff; margin-bottom:20px; max-width:700px; text-shadow: 0 2px 18px rgba(0,0,0,.25); }
.hero p.sub{ font-size:18px; color:#e4eaf2; max-width:480px; margin-bottom:32px; text-shadow: 0 1px 10px rgba(0,0,0,.2); }
.hero-ctas{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:36px; }
.hero-facts{ display:flex; gap:28px; border-top:1px solid rgba(255,255,255,.28); padding-top:22px; flex-wrap:wrap; }
.hero-facts .num{ font-family:'Barlow Condensed'; font-weight:800; font-size:30px; color:#fff; }
.hero-facts .lbl{ font-size:12px; color:#d7e0ec; text-transform:uppercase; letter-spacing:.05em; }
.hero-img .ph{ height:460px; border-radius:2px; border-color:rgba(255,255,255,.3); }
.hero-img .ph .ph-label{ background:rgba(0,0,0,.55); }

/* hero tecnico (paginas de producto/empresa/cotizar) */
.hero-tec{ background:var(--azul); color:#fff; position:relative; overflow:hidden; padding:56px 0; }
.hero-tec::before{
  content:""; position:absolute; inset:0;
  background-image: linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px);
  background-size:56px 56px; opacity:.5;
}
.hero-tec .container{ position:relative; }
.hero-tec h1{ font-size:44px; color:#fff; margin-bottom:14px; max-width:760px; }
.hero-tec p{ font-size:17px; color:#cfd8e6; max-width:640px; }

section{ padding:88px 0; }
.alt{ background:var(--concreto); }
.section-head{ max-width:680px; margin-bottom:44px; }
.kicker{ font-family:'IBM Plex Mono'; font-size:12px; letter-spacing:.1em; color:var(--naranja); text-transform:uppercase; margin-bottom:10px; display:block; }
.section-head h2{ font-size:36px; color:var(--azul); margin-bottom:14px; }
.section-head p{ color:var(--acero); font-size:16.5px; }

/* soluciones grid (home) */
.sol-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.sol-card{ background:#fff; border:1px solid #E7E9EC; border-radius:2px; overflow:hidden; transition:.2s; }
.sol-card:hover{ box-shadow:0 14px 30px rgba(14,42,84,.12); transform:translateY(-3px); }
.sol-card .img-wrap{ height:170px; overflow:hidden; }
.sol-card .img-wrap img{ width:100%; height:100%; object-fit:cover; }
.sol-card .body{ padding:20px; }
.sol-card .num{ font-family:'IBM Plex Mono'; font-size:11px; color:var(--naranja); font-weight:600; }
.sol-card h3{ font-size:22px; color:var(--azul); margin:6px 0 8px; }
.sol-card p{ font-size:14px; color:var(--acero); margin-bottom:16px; min-height:56px; }
.sol-card .link{ font-weight:700; font-size:13.5px; color:var(--azul); display:flex; align-items:center; gap:6px; }
.sol-card:hover .link{ color:var(--naranja); }

/* necesidad */
.need-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.need-card{ background:#fff; border:1px solid #E7E9EC; padding:26px 20px; border-left:3px solid var(--naranja); }
.need-card .tag{ font-family:'IBM Plex Mono'; font-size:11px; color:var(--acero); }
.need-card h4{ font-family:'Inter'; font-weight:700; font-size:16px; color:var(--azul); margin:8px 0 6px; }
.need-card .sol{ font-size:13px; color:var(--naranja); font-weight:600; }

/* por que alpint */
.why-wrap{ display:grid; grid-template-columns:0.9fr 1.1fr; gap:56px; align-items:center; }
.why-list{ display:flex; flex-direction:column; gap:26px; }
.why-item{ display:flex; gap:18px; }
.why-item .n{ font-family:'Barlow Condensed'; font-weight:800; font-size:34px; color:#D7DEE7; min-width:52px; }
.why-item h4{ font-size:17px; color:var(--azul); margin-bottom:4px; }
.why-item p{ font-size:14.5px; color:var(--acero); }
.why-badge{ display:inline-block; background:var(--azul); color:#fff; font-family:'IBM Plex Mono'; font-size:11px; padding:3px 8px; border-radius:2px; margin-top:6px; }

/* como trabajamos */
.flow{ display:flex; align-items:stretch; gap:0; overflow-x:auto; }
.flow-step{ flex:1; min-width:200px; position:relative; padding:26px 20px; }
.flow-step:not(:last-child)::after{ content:"→"; position:absolute; right:-4px; top:40px; color:var(--acero); font-size:18px; }
.flow-icon{ width:44px; height:44px; margin-bottom:10px; }
.flow-step .n{ font-family:'IBM Plex Mono'; color:var(--naranja); font-size:12px; }
.flow-step h4{ font-size:18px; color:var(--azul); margin-top:6px; margin-bottom:8px; }
.flow-step p{ font-size:13.5px; color:var(--acero); line-height:1.5; max-width:220px; }

/* proyectos vacio */
.proj-empty{ border:1px dashed var(--acero); background:#fff; padding:56px 24px; text-align:center; color:var(--acero); }
.proj-empty .mono{ color:var(--naranja); font-size:12.5px; display:block; margin-bottom:10px; }

/* banner de proyectos con foto real + overlay */
.proj-banner{ position:relative; border-radius:2px; overflow:hidden; height:340px; }
.proj-banner img{ width:100%; height:100%; object-fit:cover; }
.proj-banner-overlay{
  position:absolute; inset:0;
  background: linear-gradient(0deg, rgba(8,27,56,.94) 0%, rgba(8,27,56,.75) 32%, rgba(8,27,56,.25) 60%, rgba(8,27,56,0) 85%);
}
.proj-banner-text{ position:absolute; left:0; right:0; bottom:0; padding:28px 32px; color:#fff; }
.proj-banner-text h3{ font-size:26px; margin-bottom:6px; text-shadow: 0 2px 14px rgba(0,0,0,.3); }
.proj-banner-text p{ color:#ffb37a; font-size:12px; letter-spacing:.04em; text-shadow: 0 1px 8px rgba(0,0,0,.3); }
@media (max-width:600px){
  .proj-banner{ height:260px; }
  .proj-banner-text{ padding:20px; }
  .proj-banner-text h3{ font-size:21px; }
}

/* CTA final */
.cta-final{ background:var(--azul); color:#fff; position:relative; overflow:hidden; }
.cta-final::before{ content:""; position:absolute; inset:0; background-image:linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px); background-size:56px 56px;}
.cta-final .container{ position:relative; text-align:center; padding:20px 0; }
.cta-final h2{ font-size:36px; color:#fff; max-width:640px; margin:0 auto 14px; }
.cta-final p{ color:#cfd8e6; max-width:520px; margin:0 auto 30px; font-size:16px; }
.cta-final .ctas{ display:flex; justify-content:center; gap:14px; flex-wrap:wrap; }

/* footer */
footer{ background:var(--azul-oscuro); color:#aebbcc; padding:64px 0 24px; font-size:14px; }
.foot-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:36px; margin-bottom:44px; }
.foot-grid h5{ color:#fff; font-size:13px; letter-spacing:.05em; text-transform:uppercase; margin-bottom:16px; font-family:'Inter'; font-weight:700; }
.foot-grid a{ display:block; color:#aebbcc; margin-bottom:10px; }
.foot-grid a:hover{ color:var(--naranja); }
.foot-bottom{ border-top:1px solid rgba(255,255,255,.1); padding-top:22px; display:flex; justify-content:space-between; font-size:12.5px; color:#7f8ea3; flex-wrap:wrap; gap:10px;}
.foot-bottom a{ color:#7f8ea3; }
.foot-bottom a:hover{ color:var(--naranja); }

/* mobile cta bar */
.mobile-cta-bar{ display:none; }

/* ==== PAGINA DE PRODUCTO ==== */
.prod-grid{ display:grid; grid-template-columns:1fr 1fr; gap:52px; align-items:start; }
.prod-grid .ph, .prod-grid img{ border-radius:2px; }
.prod-gallery{ display:grid; grid-template-columns:1fr; gap:14px; }
.prod-gallery .gallery-item{ overflow:hidden; border-radius:2px; position:relative; }
.prod-gallery img, .prod-gallery .ph{ height:240px; width:100%; object-fit:cover; transition:transform .45s ease; display:block; }
.prod-gallery .gallery-item:hover img{ transform:scale(1.06); }
.prod-gallery .gallery-caption{
  position:absolute; left:0; right:0; bottom:0; padding:10px 14px;
  background:linear-gradient(0deg, rgba(8,27,56,.85), transparent);
  color:#fff; font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:.02em;
}
.feature-cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.feature-cols h4{ color:var(--azul); font-size:19px; margin-bottom:8px; }
.feature-cols p{ color:var(--acero); font-size:14.5px; }

table.specs{ width:100%; border-collapse:collapse; font-size:14px; background:#fff; }
table.specs caption{ text-align:left; font-family:'IBM Plex Mono'; font-size:12px; color:var(--acero); margin-bottom:10px; }
table.specs th, table.specs td{ padding:12px 14px; border:1px solid #E7E9EC; text-align:left; font-family:'IBM Plex Mono'; font-size:13px;}
table.specs thead th{ background:var(--azul); color:#fff; font-family:'Inter'; font-weight:700; font-size:12.5px; text-transform:uppercase; letter-spacing:.03em; }
table.specs tbody tr:nth-child(even){ background:var(--concreto); }
.specs-cards{ display:none; }

.cert-badge{ display:inline-flex; align-items:center; gap:10px; background:#fff; border:1.5px solid var(--azul); padding:12px 18px; border-radius:2px; margin-top:18px; }
.cert-badge .ico{ width:34px; height:34px; background:var(--azul); border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-size:15px; font-weight:800; font-family:'Barlow Condensed'; flex:none;}
.cert-badge .txt{ font-size:13px; color:var(--azul); font-weight:700; line-height:1.3; }
.cert-badge .txt span{ display:block; font-family:'IBM Plex Mono'; font-weight:500; color:var(--acero); font-size:11.5px; }

.faq-item{ border-bottom:1px solid #E7E9EC; padding:20px 0; }
.faq-item summary{ cursor:pointer; font-weight:700; font-size:16px; color:var(--azul); list-style:none; display:flex; justify-content:space-between; align-items:center; gap:12px;}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{ content:"+"; font-family:'Barlow Condensed'; font-size:22px; color:var(--naranja); flex:none; }
.faq-item[open] summary::after{ content:"–"; }
.faq-item p{ color:var(--acero); font-size:14.5px; margin-top:12px; max-width:720px; }

.prod-cta-bar{ display:flex; gap:14px; flex-wrap:wrap; margin-top:26px; }

/* ==== EMPRESA ==== */
.timeline{ display:flex; flex-direction:column; gap:0; border-left:2px solid #E7E9EC; margin-left:8px; }
.tl-item{ position:relative; padding:0 0 40px 32px; }
.tl-item:last-child{ padding-bottom:0; }
.tl-item::before{ content:""; position:absolute; left:-7px; top:2px; width:12px; height:12px; border-radius:50%; background:var(--naranja); border:3px solid #fff; box-shadow:0 0 0 2px var(--naranja);}
.tl-item .yr{ font-family:'IBM Plex Mono'; color:var(--naranja); font-size:13px; font-weight:600; }
.tl-item h4{ font-size:20px; color:var(--azul); margin:4px 0 6px; }
.tl-item p{ color:var(--acero); font-size:14.5px; max-width:560px; }

.stat-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.stat-card{ background:#fff; border:1px solid #E7E9EC; padding:28px 22px; text-align:center; }
.stat-card .num{ font-family:'Barlow Condensed'; font-weight:800; font-size:44px; color:var(--azul); }
.stat-card .lbl{ font-size:13px; color:var(--acero); margin-top:4px; }

.empresa-gallery{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.empresa-gallery img{ width:100%; height:420px; object-fit:cover; border-radius:2px; transition:transform .45s ease; }
.empresa-gallery img:hover{ transform:scale(1.025); }
@media (max-width:600px){ .empresa-gallery{ grid-template-columns:1fr; } .empresa-gallery img{ height:280px; } }

/* ==== COTIZAR ==== */
.quote-wrap{ display:grid; grid-template-columns:1.5fr 1fr; gap:48px; align-items:start; }
.quote-form{ background:#fff; border:1px solid #E7E9EC; padding:36px; border-radius:2px; }

.alz-picker-public{ border-collapse:collapse; }
.alz-picker-public th{ background:var(--concreto); text-align:left; padding:8px 10px; font-size:11px; text-transform:uppercase; color:var(--acero); border-bottom:1px solid #E0E3E7; }
.alz-picker-public td{ padding:7px 10px; border-bottom:1px solid #E7E9EC; vertical-align:middle; }
@media (max-width:600px){
  #alzaprimaModelsWrap{ overflow-x:auto; }
  .alz-picker-public{ min-width:480px; }
}
.form-step-label{ font-family:'IBM Plex Mono'; font-size:11.5px; color:var(--naranja); text-transform:uppercase; letter-spacing:.06em; margin:28px 0 14px; display:block; }
.form-step-label:first-of-type{ margin-top:0; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.field{ margin-bottom:16px; }
.field label{ display:block; font-size:13.5px; font-weight:600; color:var(--grafito); margin-bottom:6px; }
.field .hint{ font-size:12px; color:var(--acero); font-weight:400; }
.field input, .field select, .field textarea{
  width:100%; padding:12px 14px; border:1.5px solid #D9DEE4; border-radius:2px; font-family:'Inter'; font-size:14.5px; background:#fff;
}
.field input:focus, .field select:focus, .field textarea:focus{ border-color:var(--azul); outline:none; }
.checkbox-group{ display:flex; flex-wrap:wrap; gap:10px; }
.checkbox-group label{ display:flex; align-items:center; gap:8px; border:1.5px solid #D9DEE4; padding:9px 14px; border-radius:2px; font-size:13.5px; font-weight:600; cursor:pointer; }
.checkbox-group input{ width:auto; accent-color:var(--naranja); }
.file-drop{ border:1.5px dashed #B9C2CC; padding:22px; text-align:center; font-size:13.5px; color:var(--acero); border-radius:2px; }
.form-success{ display:none; background:#EAF6EE; border:1.5px solid #1E7B45; padding:24px; border-radius:2px; text-align:center; }
.form-success h4{ color:#1E7B45; font-size:20px; margin-bottom:6px; }
.form-success p{ color:#2f5c3f; font-size:14px; }

.side-contact{ background:var(--azul); color:#fff; padding:32px; border-radius:2px; }
.side-contact h4{ font-size:20px; margin-bottom:16px; }
.side-contact .row{ display:flex; gap:12px; padding:14px 0; border-top:1px solid rgba(255,255,255,.14); font-size:14px; }
.side-contact .row:first-of-type{ border-top:none; }
.side-contact .row b{ display:block; font-size:12px; color:#ffb37a; text-transform:uppercase; letter-spacing:.04em; margin-bottom:2px; font-weight:700; }
.side-contact a{ color:#fff; }
.side-contact a:hover{ color:#ffb37a; }

/* ============================================================
   EFECTOS DINÁMICOS — actividad constructiva en movimiento
   Todo con propósito: orientar, jerarquizar o confirmar acción.
   ============================================================ */

/* grilla de plano técnico con deriva lenta (hero y hero-tec) */
@keyframes gridDrift{
  0%{ background-position: 0 0, 0 0; }
  100%{ background-position: 56px 56px, 56px 56px; }
}
.hero-tec::before, .cta-final::before{
  animation: gridDrift 26s linear infinite;
}
@media (prefers-reduced-motion: reduce){
  .hero-tec::before, .cta-final::before{ animation: none; }
}

/* franja de seguridad — "cinta de obra" animada, usada como divisor */
.stripe-divider{
  height:8px;
  background: repeating-linear-gradient(45deg,
    var(--naranja) 0 22px, var(--azul) 22px 44px);
  background-size: 62px 62px;
  animation: stripeMove 3.2s linear infinite;
}
@keyframes stripeMove{
  0%{ background-position: 0 0; }
  100%{ background-position: 62px 0; }
}
@media (prefers-reduced-motion: reduce){
  .stripe-divider{ animation: none; }
}

/* revelado progresivo al hacer scroll — "se construye" el bloque */
.reveal{
  opacity:0; transform: translateY(28px);
  transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1);
}
.reveal.is-visible{ opacity:1; transform:none; }
.reveal-stagger > *{ opacity:0; transform: translateY(28px); transition: opacity .6s ease, transform .6s ease; }
.reveal-stagger.is-visible > *{ opacity:1; transform:none; }
.reveal-stagger.is-visible > *:nth-child(1){ transition-delay:.05s; }
.reveal-stagger.is-visible > *:nth-child(2){ transition-delay:.14s; }
.reveal-stagger.is-visible > *:nth-child(3){ transition-delay:.23s; }
.reveal-stagger.is-visible > *:nth-child(4){ transition-delay:.32s; }
.reveal-stagger.is-visible > *:nth-child(5){ transition-delay:.41s; }
.reveal-stagger.is-visible > *:nth-child(6){ transition-delay:.5s; }
@media (prefers-reduced-motion: reduce){
  .reveal, .reveal-stagger > *{ opacity:1; transform:none; transition:none; }
}

/* poste de andamio que "se arma" al pasar el mouse sobre una tarjeta */
.sol-card{ position:relative; }
.sol-card::after{
  content:""; position:absolute; left:14px; bottom:0; width:3px; height:0;
  background: var(--naranja); transition: height .35s cubic-bezier(.2,.8,.2,1);
}
.sol-card:hover::after{ height:100%; }
.need-card{ position:relative; overflow:hidden; }
.need-card::after{
  content:""; position:absolute; left:0; top:0; width:3px; height:0;
  background: var(--naranja); transition: height .3s ease;
}
.need-card:hover::after{ height:100%; }

/* linea de progreso del flujo "como trabajamos" — se dibuja al entrar en vista */
.flow{ position:relative; }
/* iconos animados de "Como trabajamos" — cada uno referencia visualmente su paso */
.flow-icon-necesidad .pulse-ring{ transform-origin:24px 24px; animation: iconPulseRing 2.4s ease-out infinite; }
@keyframes iconPulseRing{
  0%{ opacity:.9; transform:scale(.55); }
  70%{ opacity:0; transform:scale(1.5); }
  100%{ opacity:0; transform:scale(1.5); }
}

.flow-icon-evaluacion .draw-check{ stroke-dasharray:22; stroke-dashoffset:22; animation: iconDrawCheck 2.6s ease-in-out infinite; }
@keyframes iconDrawCheck{
  0%, 15%{ stroke-dashoffset:22; }
  45%, 78%{ stroke-dashoffset:0; }
  100%{ stroke-dashoffset:22; }
}

.flow-icon-cotizacion .write-line{ stroke-dasharray:16; stroke-dashoffset:16; animation: iconWriteLine 2.4s ease-in-out infinite; }
@keyframes iconWriteLine{
  0%, 15%{ stroke-dashoffset:16; }
  50%, 80%{ stroke-dashoffset:0; }
  100%{ stroke-dashoffset:16; }
}

.flow-icon-coordinacion .gear-a{ transform-origin:18px 24px; animation: iconRotateCW 7s linear infinite; }
.flow-icon-coordinacion .gear-b{ transform-origin:32px 17px; animation: iconRotateCCW 5s linear infinite; }
@keyframes iconRotateCW{ from{ transform:rotate(0deg); } to{ transform:rotate(360deg); } }
@keyframes iconRotateCCW{ from{ transform:rotate(0deg); } to{ transform:rotate(-360deg); } }

.flow-icon-entrega .truck{ animation: iconTruckMove 2.4s ease-in-out infinite; }
@keyframes iconTruckMove{
  0%, 100%{ transform:translateX(-3px); }
  50%{ transform:translateX(4px); }
}

.flow-icon-soporte .pulse-ring{ transform-origin:24px 24px; animation: iconPulseRing 2.8s ease-out infinite; }
.flow-icon-soporte .draw-check{ stroke-dasharray:20; stroke-dashoffset:20; animation: iconDrawCheck 2.8s ease-in-out infinite; }

@media (prefers-reduced-motion: reduce){
  .flow-icon-necesidad .pulse-ring, .flow-icon-soporte .pulse-ring,
  .flow-icon-evaluacion .draw-check, .flow-icon-soporte .draw-check,
  .flow-icon-cotizacion .write-line,
  .flow-icon-coordinacion .gear-a, .flow-icon-coordinacion .gear-b,
  .flow-icon-entrega .truck{
    animation:none;
  }
  .flow-icon-evaluacion .draw-check, .flow-icon-soporte .draw-check{ stroke-dashoffset:0; }
  .flow-icon-cotizacion .write-line{ stroke-dashoffset:0; }
}

.flow-step .n{ position:relative; }
.flow-step.is-visible .n{ animation: popIn .4s ease both; }
@keyframes popIn{
  0%{ opacity:0; transform: scale(.6) translateY(4px); }
  100%{ opacity:1; transform: scale(1) translateY(0); }
}

/* contador ascendente para cifras clave */
[data-count]{ font-variant-numeric: tabular-nums; }

/* linea de cota tecnica animada como acento de seccion */
.cota-line{
  display:flex; align-items:center; gap:10px; margin:0 0 18px;
}
.cota-line .bar{
  flex:1; height:1px; background: linear-gradient(90deg, transparent, #D9DEE4 20%, #D9DEE4 80%, transparent);
  position:relative; overflow:hidden;
}
.cota-line .bar::after{
  content:""; position:absolute; top:0; left:-30%; width:30%; height:100%;
  background: linear-gradient(90deg, transparent, var(--naranja), transparent);
  animation: cotaSweep 3.5s ease-in-out infinite;
}
@keyframes cotaSweep{
  0%{ left:-30%; } 50%{ left:100%; } 100%{ left:100%; }
}
@media (prefers-reduced-motion: reduce){
  .cota-line .bar::after{ animation: none; display:none; }
}

/* hero video */
.hero-video-wrap{ position:relative; border-radius:2px; overflow:hidden; aspect-ratio:4/5; border:1px solid rgba(255,255,255,.2); }
.hero-video-wrap video{ width:100%; height:100%; object-fit:cover; display:block; }
.hero-video-wrap::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background: linear-gradient(180deg, rgba(14,42,84,0) 55%, rgba(8,27,56,.65) 100%);
}
.hero-video-badge{
  position:absolute; left:14px; bottom:14px; z-index:2;
  background:rgba(8,27,56,.75); backdrop-filter: blur(2px);
  color:#ffb37a; font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:.05em;
  padding:6px 10px; border-radius:2px; display:flex; align-items:center; gap:7px;
}
.hero-video-badge .dot{ width:6px; height:6px; border-radius:50%; background:#ffb37a; animation: dotPulse 1.6s ease-in-out infinite; }
@keyframes dotPulse{ 0%,100%{ opacity:1; } 50%{ opacity:.25; } }
@media (prefers-reduced-motion: reduce){ .hero-video-badge .dot{ animation:none; } }

/* andamios decorativos en los costados del sitio — "obra en construcción constante" */
.site-scaffold-rail{
  display:none;
  position:fixed; top:0; bottom:0; width:36px; z-index:3; pointer-events:none;
  background-image:url('../img/scaffold-rail.svg');
  background-repeat: repeat-y; background-size:36px 140px;
}
.site-scaffold-rail.left{ left:0; }
.site-scaffold-rail.right{ right:0; transform:scaleX(-1); }
.site-scaffold-rail .worker-light{
  position:absolute; left:6px; width:6px; height:6px; border-radius:50%;
  background:var(--naranja); box-shadow:0 0 8px 2px rgba(232,96,12,.6);
  animation: railTravel 9s ease-in-out infinite;
}
.site-scaffold-rail.right .worker-light{ left:auto; right:6px; }
@keyframes railTravel{
  0%{ top:4%; opacity:.9; }
  48%{ top:92%; opacity:.9; }
  50%{ opacity:0; }
  52%{ top:4%; opacity:0; }
  55%{ opacity:.9; }
  100%{ top:4%; opacity:.9; }
}
@media (min-width:1440px){
  .site-scaffold-rail{ display:block; }
}
@media (prefers-reduced-motion: reduce){
  .site-scaffold-rail .worker-light{ animation:none; opacity:.7; top:50%; }
}

@media (max-width: 980px){
  nav.desktop{ display:none; }
  .menu-toggle{ display:block; }
  .hero-grid{ grid-template-columns:1fr; padding:44px 0 40px; }
  .hero-content{ padding:64px 0 56px; }
  .hero h1{ font-size:34px; max-width:100%; }
  .hero-tec h1{ font-size:32px; }
  .hero-facts{ flex-wrap:wrap; }
  .hero-video-badge{ font-size:9.5px; right:14px; bottom:12px; }
  .sol-grid{ grid-template-columns:1fr 1fr; }
  .need-grid{ grid-template-columns:1fr 1fr; }
  .why-wrap{ grid-template-columns:1fr; }
  .foot-grid{ grid-template-columns:1fr 1fr; }
  .prod-grid{ grid-template-columns:1fr; }
  .feature-cols{ grid-template-columns:1fr; }
  .stat-grid{ grid-template-columns:1fr; }
  .quote-wrap{ grid-template-columns:1fr; }
  .field-row{ grid-template-columns:1fr; }
  section{ padding:56px 0; }
  .section-head h2{ font-size:27px; }
  table.specs{ display:none; }
  .specs-cards{ display:grid; gap:12px; }
  .spec-card{ background:#fff; border:1px solid #E7E9EC; padding:16px; }
  .spec-card .model{ font-family:'IBM Plex Mono'; font-weight:700; color:var(--azul); font-size:14px; margin-bottom:8px; }
  .spec-card .row{ display:flex; justify-content:space-between; font-size:13px; padding:5px 0; border-top:1px solid #EEF0F2; }
  .spec-card .row:first-of-type{ border-top:none; }
  .spec-card .row .k{ color:var(--acero); }
  .spec-card .row .v{ font-family:'IBM Plex Mono'; font-weight:600; }
  .mobile-cta-bar{
    display:flex; position:sticky; bottom:0; z-index:60;
    background:#fff; border-top:1px solid #E7E9EC; padding:10px 14px; gap:10px;
  }
  .mobile-cta-bar .btn{ flex:1; justify-content:center; padding:13px 10px; font-size:13.5px; }
}
@media (max-width:600px){
  .sol-grid, .need-grid{ grid-template-columns:1fr; }
  .foot-grid{ grid-template-columns:1fr; }
  .prod-gallery{ grid-template-columns:1fr; }
}