:root{
  --navy:#0a2f4f; --navy-dark:#071f36; --blue:#1d6fb8;
  --bg:#0c1220; --bg-soft:#0f1826; --line:#22304a;
  --ink:#e9eff6; --ink-soft:#a9b8c8; --ink-mute:#7f90a3; --card:#111b2c;
  --wa:#25d366; --wa-dark:#1ea952;
  --sans:'Inter',sans-serif;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--bg); color:var(--ink); font-family:var(--sans); line-height:1.55; -webkit-font-smoothing:antialiased;}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
.wrap{max-width:1200px; margin:0 auto; padding:0 28px;}
::selection{background:var(--blue); color:#fff;}

/* ===== FONDO TÉCNICO (engranajes, rodamientos, bombas — muy sutil) ===== */
.tech-bg{
  background-color:var(--bg-soft);
  background-image:radial-gradient(70% 120% at 85% 0%, rgba(29,111,184,.14), transparent 60%);
}
.tech-bg-dark{
  background-color:#0a1424;
  background-image:linear-gradient(180deg, rgba(6,12,24,.78), rgba(6,12,24,.9)), url("images/fondo-blueprint.jpg");
  background-size:auto, cover;
  background-position:center, center 22%;
}

/* ===== NAV — barra negra ===== */
header{position:sticky; top:0; z-index:100; background:linear-gradient(90deg, #000 0%, #000 300px, rgba(6,9,14,.94) 560px, rgba(6,9,14,.94) 100%); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);}
header::after{content:''; display:block; height:2px; background:linear-gradient(90deg, transparent 0%, #1d6fb8 22%, #3db4f2 50%, #1d6fb8 78%, transparent 100%); opacity:.85;}
.nav{display:flex; align-items:center; justify-content:space-between; padding:14px 28px; max-width:1200px; margin:0 auto;}
.brand{display:flex; align-items:center;}
.brand-logo{height:42px; width:auto; display:block;}
@media(max-width:480px){
  .brand-logo{height:34px;}
  header{background:linear-gradient(90deg, #000 0%, #000 180px, rgba(6,9,14,.94) 360px, rgba(6,9,14,.94) 100%);}
}
.navlinks{display:none; gap:32px; font-size:.9rem; font-weight:600; letter-spacing:.4px; color:#93a3b4;}
.navlinks a{position:relative; padding:6px 0; transition:color .2s;}
.navlinks a::after{content:''; position:absolute; left:0; right:100%; bottom:-2px; height:2px; background:linear-gradient(90deg,#1d6fb8,#3db4f2); transition:right .25s ease; border-radius:2px;}
.navlinks a:hover{color:#fff;}
.navlinks a:hover::after{right:0;}
.navlinks a.active{color:#fff;}
.navlinks a.active::after{right:0;}
@media(min-width:880px){.navlinks{display:flex;}}
.btn{display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:.9rem; padding:12px 22px; border-radius:8px; cursor:pointer; border:1px solid transparent; transition:transform .15s, box-shadow .2s, background .2s;}
.btn-wa{background:var(--wa); color:#fff;}
.btn-wa:hover{background:var(--wa-dark); transform:translateY(-1px); box-shadow:0 6px 16px rgba(37,211,102,.35);}
.btn-outline{border-color:var(--line); color:#dfe8f1; background:transparent;}
.btn-outline:hover{border-color:var(--blue); color:#fff;}
.btn-white{background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,.55);}
.btn-white:hover{transform:translateY(-1px); background:rgba(255,255,255,.12); border-color:#fff;}
.btn svg{width:18px; height:18px;}

/* ===== MARCAS QUE TRABAJAMOS ===== */
.brands-strip{background:var(--bg-soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:34px 0;}
.brands-strip .b-label{text-align:center; font-size:.75rem; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:var(--ink-mute); margin-bottom:18px;}
.brands-logos{display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:14px; max-width:1080px; margin:0 auto;}
.brands-logos .bl{background:#fff; border:1px solid var(--line); border-radius:12px; height:86px; display:flex; align-items:center; justify-content:center; padding:12px 16px; transition:transform .2s, box-shadow .2s;}
.brands-logos .bl:hover{transform:translateY(-3px); box-shadow:0 14px 30px -12px rgba(10,47,79,.22);}
.brands-logos .bl img{max-width:100%; max-height:58px; object-fit:contain; display:block;}
.brands-legal{text-align:center; font-size:.72rem; color:var(--ink-mute); margin-top:18px;}

/* ===== SECTION SCAFFOLD ===== */
section{padding:88px 0;}
.sec-head{max-width:620px; margin-bottom:46px;}
.sec-eyebrow{font-size:.78rem; font-weight:700; letter-spacing:1px; text-transform:uppercase; color:var(--blue); margin-bottom:12px; display:block;}
h2.sec-title{font-size:clamp(1.7rem,2.8vw,2.3rem); font-weight:800; letter-spacing:-.5px; color:#f2f7fc; line-height:1.15;}
.sec-desc{margin-top:14px; color:var(--ink-soft); font-size:1rem; line-height:1.7;}

/* ===== TRUST STRIP ===== */
.trust{background:var(--navy); padding:22px 0;}
.trust-row{display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap;}
.trust-item{display:flex; align-items:center; gap:10px; flex:1; min-width:210px; color:#cfe0ef; font-size:.84rem; font-weight:600;}
.trust-item .ic{width:30px; height:30px; border-radius:7px; background:rgba(255,255,255,.12); display:flex; align-items:center; justify-content:center; flex-shrink:0; font-weight:800; font-size:.82rem; color:#fff;}

/* ===== TARJETAS ===== */
.svc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
@media(max-width:900px){.svc-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.svc-grid{grid-template-columns:1fr;}}
.svc-card{background:var(--card); border-radius:12px; padding:28px 24px; box-shadow:0 1px 2px rgba(10,47,79,.04), 0 1px 0 rgba(10,47,79,.03), 0 0 0 1px rgba(10,47,79,.06); transition:box-shadow .25s, transform .25s;}
.svc-card:hover{box-shadow:0 1px 2px rgba(10,47,79,.05), 0 16px 32px -10px rgba(10,47,79,.18), 0 0 0 1px rgba(10,47,79,.08); transform:translateY(-3px);}
.svc-icon{width:42px; height:42px; border-radius:10px; background:var(--navy); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; margin-bottom:16px; font-size:.86rem; letter-spacing:.5px; box-shadow:0 6px 14px -4px rgba(10,47,79,.4);}
.svc-card h3{font-size:1.08rem; font-weight:700; margin-bottom:8px; color:#f2f7fc;}
.svc-card p{font-size:.87rem; color:var(--ink-soft); line-height:1.6;}
.svc-link{display:inline-block; margin-top:14px; font-size:.82rem; font-weight:700; color:var(--blue);}

/* ===== CERTIFICADO / GAUGE CARD ===== */
.gaugecard{background:var(--card); border:1px solid var(--line); color:var(--ink); border-radius:14px; padding:28px; box-shadow:0 2px 4px rgba(10,47,79,.04), 0 16px 40px -12px rgba(10,47,79,.22);}
.gaugecard .ghead{font-weight:800; font-size:.92rem; border-bottom:2px solid var(--blue); padding-bottom:12px; margin-bottom:20px; display:flex; justify-content:space-between; align-items:baseline; color:#f2f7fc;}
.gaugecard .ghead span{font-size:.62rem; color:#94a3b8; font-weight:600; font-family:monospace;}
.grow{margin-bottom:22px;}
.grow-top{display:flex; justify-content:space-between; align-items:center; margin-bottom:8px;}
.grow-top b{font-size:.85rem;}
.cert-badge{font-size:.6rem; font-weight:800; padding:3px 10px; border-radius:20px; text-transform:uppercase; letter-spacing:.4px; color:#fff;}
.gtrack{position:relative; height:10px; border-radius:6px;}
.gmarker{position:absolute; top:-7px; width:0; height:0; border-left:6px solid transparent; border-right:6px solid transparent; border-top:10px solid #0f172a; margin-left:-6px;}
.glabels{display:flex; justify-content:space-between; font-size:.62rem; color:#94a3b8; margin-top:6px; font-family:monospace;}
.gaugecard .cert-qr{display:flex; align-items:center; gap:12px; margin-top:18px; padding-top:16px; border-top:1px dashed var(--line);}
.cert-qr-box{width:40px; height:40px; border-radius:4px; background:linear-gradient(90deg,#0f172a 3px, transparent 3px) 0 0/9px 9px, linear-gradient(#0f172a 3px, transparent 3px) 0 0/9px 9px; background-color:#fff; border:2px solid #0f172a; flex-shrink:0;}
.cert-qr-text{font-size:.62rem; color:#64748b; line-height:1.4;}
.cert-qr-text b{display:block; color:#0f172a; font-size:.66rem;}

/* ===== FOOTER ===== */
footer{background:var(--navy-dark); padding:50px 0 28px; color:#8fa7bd;}
.foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:36px; margin-bottom:38px;}
@media(max-width:760px){.foot-grid{grid-template-columns:1fr; gap:28px;}}
.foot-brand{font-weight:800; font-size:1.1rem; color:#fff; margin-bottom:10px;}
.foot-col h5{font-size:.72rem; text-transform:uppercase; letter-spacing:1px; color:#5f7d97; margin-bottom:12px;}
.foot-col p, .foot-col a{display:block; font-size:.87rem; margin-bottom:9px;}
.foot-col a:hover{color:#fff;}
.foot-bottom{border-top:1px solid rgba(255,255,255,.08); padding-top:20px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:.76rem;}

.reveal{opacity:0; transform:translateY(20px); transition:opacity .6s ease, transform .6s ease;}
.reveal.show{opacity:1; transform:translateY(0);}
@media (prefers-reduced-motion: reduce){ *{transition:none !important;} }

/* ===== INGENIERÍA DE TALLER — plano técnico ===== */
.ing-sec{background-color:#0a1424; background-image:linear-gradient(rgba(61,180,242,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(61,180,242,.055) 1px, transparent 1px), radial-gradient(90% 70% at 50% 0%, rgba(29,111,184,.16), transparent 65%); background-size:36px 36px, 36px 36px, 100% 100%;}
.ing-sec .kicker{color:#3db4f2;}
.ing-sec h2{color:#fff;}
.ing-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:16px; margin-top:30px;}
.ing-card{background:rgba(255,255,255,.045); border:1px solid rgba(61,180,242,.18); border-left:3px solid var(--blue); border-radius:12px; padding:20px 20px 18px; backdrop-filter:blur(2px); transition:transform .2s, box-shadow .2s, background .2s;}
.ing-card:hover{transform:translateY(-3px); background:rgba(61,180,242,.09); box-shadow:0 18px 36px -14px rgba(0,0,0,.5);}
.ing-card h4{color:#fff; font-size:1.02rem; margin-bottom:7px;}
.ing-card p{font-size:.9rem; color:#b6c6d6; line-height:1.55;}

/* ===== INDUSTRIAS — tiles con iconos ===== */
.inds{background:linear-gradient(115deg,#0c2036 0%,#123a63 55%,#1d6fb8 140%); padding:56px 0; position:relative; overflow:hidden;}
.inds::after{content:''; position:absolute; width:420px; height:420px; border-radius:50%; border:60px solid rgba(255,255,255,.045); top:-160px; right:-140px;}
.inds-wrap{display:grid; grid-template-columns:1fr 1.5fr; gap:44px; align-items:center; position:relative; z-index:1;}
.inds .b-label{color:#9fd1f5; font-size:.75rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; margin-bottom:10px;}
.inds-left h2{color:#fff; font-size:clamp(1.6rem,3vw,2.3rem); font-weight:800; line-height:1.2; letter-spacing:-.5px;}
.inds-left h2 em{font-style:normal; color:#8fd4ff;}
.inds-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:26px 14px;}
.ind{text-align:center;}
.ind .ic{width:72px; height:72px; border-radius:20px; background:linear-gradient(160deg,rgba(255,255,255,.16),rgba(255,255,255,.05)); border:1px solid rgba(255,255,255,.25); display:grid; place-items:center; margin:0 auto 10px; box-shadow:0 12px 26px -12px rgba(0,0,0,.5); backdrop-filter:blur(3px); transition:transform .2s, background .2s;}
.ind:hover .ic{transform:translateY(-4px); background:linear-gradient(160deg,rgba(255,255,255,.26),rgba(255,255,255,.1));}
.ind .ic svg{width:34px; height:34px;}
.ind span{display:block; color:#eaf4fc; font-size:.84rem; font-weight:600; line-height:1.25;}
@media(max-width:820px){
  .inds-wrap{grid-template-columns:1fr; gap:28px; text-align:center;}
  .inds-grid{grid-template-columns:repeat(2,1fr); gap:22px 10px;}
}

/* ===== FAQ ===== */
.faq{max-width:820px; margin:26px auto 0;}
.faq details{background:var(--card); border:1px solid var(--line); border-radius:12px; margin-bottom:10px; overflow:hidden;}
.faq summary{cursor:pointer; padding:16px 18px; font-weight:700; color:#eaf2f9; font-size:.98rem; list-style:none; position:relative; padding-right:40px;}
.faq summary::after{content:'+'; position:absolute; right:18px; top:50%; transform:translateY(-50%); color:var(--blue); font-size:1.3rem; font-weight:700; transition:transform .2s;}
.faq details[open] summary::after{transform:translateY(-50%) rotate(45deg);}
.faq details p{padding:0 18px 16px; color:var(--ink-soft); font-size:.92rem; line-height:1.6;}

/* ===== FORM VENTA ===== */
.fventa{max-width:680px; margin:0 auto; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:28px; box-shadow:0 20px 45px -18px rgba(10,47,79,.18);}
.fventa label{display:block; font-size:.82rem; font-weight:700; color:#cfe0ef; margin:16px 0 6px;}
.fventa input, .fventa select, .fventa textarea{width:100%; box-sizing:border-box; border:1px solid var(--line); border-radius:9px; padding:11px 12px; font-size:.95rem; font-family:inherit; color:var(--ink); background:#0d1524;}
.fventa input:focus, .fventa select:focus, .fventa textarea:focus{outline:2px solid rgba(29,111,184,.35); border-color:var(--blue);}
.fventa .frow{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
@media(max-width:560px){.fventa .frow{grid-template-columns:1fr;}}
.fventa .radios{display:flex; gap:18px; margin-top:4px;}
.fventa .radios label{display:flex; align-items:center; gap:7px; margin:0; font-weight:600;}
.fventa .radios input{width:auto;}
.fventa button{margin-top:22px; width:100%; border:none; cursor:pointer;}

/* ===== BOTÓN AZUL ===== */
.btn-blue{background:linear-gradient(135deg,#1d6fb8,#3db4f2); color:#fff !important; box-shadow:0 10px 24px -10px rgba(29,111,184,.55); border:none;}
.btn-blue:hover{filter:brightness(1.08); transform:translateY(-1px);}

/* ===== MENÚ MÓVIL ===== */
.menu-btn{display:none; margin-left:12px; background:none; border:1px solid rgba(255,255,255,.3); color:#fff; border-radius:9px; font-size:1.25rem; padding:6px 11px; cursor:pointer;}
@media(max-width:879px){
  .menu-btn{display:block;}
  .navlinks{display:none;}
  body.nav-open .navlinks{display:flex; position:absolute; top:100%; left:0; right:0; flex-direction:column; gap:0; background:rgba(6,9,14,.98); border-bottom:2px solid var(--blue); padding:8px 0 10px; z-index:99;}
  body.nav-open .navlinks a{padding:14px 26px; color:#dfe8f1; font-size:1rem; border-bottom:1px solid rgba(255,255,255,.06);}
  body.nav-open .navlinks a.active{color:#3db4f2;}
  body.nav-open .navlinks a::after{display:none;}
}

/* ===== IDENTIDAD: destello azul + engranaje fantasma ===== */
.streak{height:3px; border:none; margin:0; background:linear-gradient(90deg, transparent, #1d6fb8 30%, #56c1ff 50%, #1d6fb8 70%, transparent); filter:drop-shadow(0 0 8px rgba(61,180,242,.55)); opacity:.9;}
.ghost-gear{position:relative; overflow:hidden;}
.ghost-gear::after{content:''; position:absolute; width:440px; height:430px; background:url("images/gear-mark.webp") no-repeat center/contain; opacity:.05; right:-130px; bottom:-130px; animation:gearspin 80s linear infinite; pointer-events:none;}
@keyframes gearspin{from{transform:rotate(0);} to{transform:rotate(360deg);}}

/* ===== TERRENO 24/7 — reloj ===== */
.t24{position:relative; overflow:hidden; padding:70px 0 80px;
  background:
    radial-gradient(60% 90% at 78% 45%, rgba(29,111,184,.22), transparent 60%),
    linear-gradient(rgba(61,180,242,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(61,180,242,.05) 1px, transparent 1px),
    #0a1120;
  background-size:auto, 38px 38px, 38px 38px, auto;
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.t24-grid{display:grid; grid-template-columns:1.05fr 1fr; gap:44px; align-items:center;}
.t24-badge{display:inline-flex; align-items:center; gap:9px; background:rgba(61,180,242,.12); border:1px solid rgba(61,180,242,.4); color:#8fd4ff; font-size:.75rem; font-weight:700; letter-spacing:2px; padding:8px 14px; border-radius:24px; text-transform:uppercase;}
.t24-dot{width:9px; height:9px; border-radius:50%; background:#37e08b; position:relative;}
.t24-dot::after{content:''; position:absolute; inset:-5px; border-radius:50%; border:2px solid rgba(55,224,139,.6); animation:t24pulse 1.8s ease-out infinite;}
@keyframes t24pulse{from{transform:scale(.5); opacity:1;} to{transform:scale(1.6); opacity:0;}}
.t24-h2{font-size:clamp(1.7rem,3.4vw,2.5rem); font-weight:800; letter-spacing:-.6px; margin:18px 0 12px; line-height:1.15; color:#f2f7fc;}
.t24-h2 em{font-style:normal; background:linear-gradient(90deg,#3db4f2,#7ec9f7); -webkit-background-clip:text; background-clip:text; color:transparent;}
.t24-sub{color:#a9bacb; max-width:460px; line-height:1.65;}
.t24-feats{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:24px 0 26px; max-width:480px;}
.t24-feat{display:flex; gap:10px; align-items:center; background:rgba(255,255,255,.045); border:1px solid rgba(61,180,242,.16); border-radius:11px; padding:11px 13px; font-size:.87rem; color:#dce7f1;}
.t24-feat b{color:#8fd4ff;}
.t24-dialwrap{position:relative; display:flex; justify-content:center;}
.t24-dial{position:relative; width:min(400px,86vw); aspect-ratio:1; border-radius:50%;}
.t24-ticks{position:absolute; inset:0; border-radius:50%; background:repeating-conic-gradient(rgba(120,160,200,.4) 0deg .8deg, transparent .8deg 15deg); -webkit-mask:radial-gradient(closest-side, transparent 88%, #000 89%); mask:radial-gradient(closest-side, transparent 88%, #000 89%);}
.t24-ringbase{position:absolute; inset:7%; border-radius:50%; border:1.5px solid rgba(61,180,242,.22);}
.t24-arc{position:absolute; inset:7%; border-radius:50%; background:conic-gradient(from 0deg, transparent 0 68%, rgba(61,180,242,.15) 74%, #3db4f2 88%, #9fdcff 97%, transparent 100%); -webkit-mask:radial-gradient(closest-side, transparent 93%, #000 94%); mask:radial-gradient(closest-side, transparent 93%, #000 94%); filter:drop-shadow(0 0 10px rgba(61,180,242,.8)); animation:t24spin 7s linear infinite;}
@keyframes t24spin{to{transform:rotate(360deg);}}
.t24-core{position:absolute; inset:0; display:grid; place-items:center; text-align:center;}
.t24-big{font-size:clamp(3.4rem,8vw,5.2rem); font-weight:800; letter-spacing:-3px; line-height:1; background:linear-gradient(180deg,#fff,#7ec9f7); -webkit-background-clip:text; background-clip:text; color:transparent;}
.t24-small{color:#8ea3b8; font-size:.78rem; letter-spacing:3px; text-transform:uppercase; margin-top:8px;}
.t24-van{position:absolute; bottom:-6%; left:50%; transform:translateX(-52%); width:112%; max-width:520px; filter:drop-shadow(0 26px 40px rgba(0,0,0,.65));}
@media(max-width:860px){ .t24-grid{grid-template-columns:1fr; gap:26px;} .t24-dialwrap{order:-1;} .t24-dial{width:min(320px,80vw);} }

/* ===== NO ENCUENTRAS TU EQUIPO ===== */
.noeq{padding:0 0 46px;}
.noeq-box{display:grid; grid-template-columns:auto 1fr; gap:22px; align-items:flex-start; background:var(--card); border:1px solid rgba(61,180,242,.2); border-left:3px solid var(--blue); border-radius:14px; padding:26px 28px;}
.noeq-ic{width:52px; height:52px; border-radius:12px; background:rgba(61,180,242,.12); display:grid; place-items:center; flex:none;}
.noeq-ic svg{width:26px; height:26px;}
.noeq-box h2{color:#f2f7fc; font-size:1.25rem; font-weight:800; margin-bottom:10px;}
.noeq-box p{color:var(--ink-soft); font-size:.92rem; line-height:1.65; margin-bottom:10px;}
.noeq-box .btn{margin-top:8px;}
@media(max-width:600px){.noeq-box{grid-template-columns:1fr; text-align:left;}}

/* ===== BOTÓN FLOTANTE DE WHATSAPP ===== */
.wa-fab{position:fixed; right:18px; bottom:18px; z-index:900; display:flex; align-items:center; gap:10px;
  background:var(--wa); color:#fff; padding:13px 18px 13px 15px; border-radius:40px; font-weight:700;
  font-size:.9rem; box-shadow:0 8px 26px rgba(0,0,0,.42); transition:transform .18s, box-shadow .2s;}
.wa-fab:hover{transform:translateY(-2px); box-shadow:0 12px 32px rgba(37,211,102,.42); color:#fff;}
.wa-fab svg{width:23px; height:23px; flex-shrink:0;}
.wa-fab span{white-space:nowrap;}
@media(max-width:560px){.wa-fab{padding:14px; right:14px; bottom:14px;} .wa-fab span{display:none;}}
@media print{.wa-fab{display:none;}}