/* Integraciones WebSocket para operaciones de flota */
.websocket-section { position:relative; overflow:hidden; display:grid; grid-template-columns:minmax(0,.92fr) minmax(390px,1.08fr); gap:clamp(34px,6vw,88px); align-items:center; background:radial-gradient(circle at 85% 12%,rgba(229,36,45,.19),transparent 28%),linear-gradient(135deg,#080808,#161617 62%,#090909); color:#fff; }
.websocket-section::before { content:""; position:absolute; inset:0; pointer-events:none; opacity:.45; background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size:34px 34px; mask-image:linear-gradient(90deg,#000,transparent 83%); }
.websocket-section > * { position:relative; z-index:1; }
.websocket-section .eyebrow { color:#78b9f2; }
.websocket-section h1,.websocket-section h2 { color:#fff; }
.websocket-section h1 em,.websocket-section h2 em { color:var(--red); }
.websocket-section .ws-lead { max-width:505px; margin:24px 0 0; color:rgba(255,255,255,.72); line-height:1.67; }
.ws-tag { display:inline-flex; align-items:center; gap:8px; margin-top:24px; padding:8px 11px; border:1px solid rgba(255,255,255,.16); border-radius:999px; color:#fff; font:600 12px/1 'Space Grotesk',sans-serif; }
.ws-tag b { width:8px; height:8px; border-radius:50%; background:#45d391; box-shadow:0 0 0 0 rgba(69,211,145,.5); animation:ws-pulse 2.1s infinite; }
.ws-visual { min-height:350px; display:grid; place-items:center; position:relative; border:1px solid rgba(255,255,255,.13); border-radius:24px; overflow:hidden; background:radial-gradient(circle at center,rgba(229,36,45,.17),transparent 32%),rgba(255,255,255,.035); }
.ws-visual::before,.ws-visual::after { content:""; position:absolute; width:320px; height:320px; border:1px solid rgba(255,255,255,.08); border-radius:50%; }
.ws-visual::after { width:210px; height:210px; border-color:rgba(229,36,45,.34); animation:ws-orbit 12s linear infinite; }
.ws-hub { z-index:2; width:112px; height:112px; display:grid; place-items:center; align-content:center; border:1px solid rgba(255,255,255,.31); border-radius:50%; background:var(--red); box-shadow:0 0 0 14px rgba(229,36,45,.12),0 18px 40px rgba(0,0,0,.35); color:#fff; text-align:center; }
.ws-hub i { width:16px; height:16px; margin-bottom:4px; }
.ws-hub > svg { width:16px; height:16px; margin-bottom:4px; stroke-width:2.1; }
.ws-hub b { font:700 13px/1 'Space Grotesk',sans-serif; letter-spacing:.08em; }
.ws-node { position:absolute; z-index:3; display:flex; align-items:center; gap:8px; padding:9px 11px; border:1px solid rgba(255,255,255,.15); border-radius:10px; background:rgba(13,13,14,.86); box-shadow:0 10px 24px rgba(0,0,0,.24); color:#eee; font:600 11px/1 'Space Grotesk',sans-serif; }
.ws-node svg { width:15px; height:15px; color:#ff737a; }
.ws-node.one { left:8%; top:18%; }.ws-node.two { right:7%; top:20%; }.ws-node.three { left:8%; bottom:18%; }.ws-node.four { right:8%; bottom:18%; }
.ws-node::after { content:""; position:absolute; z-index:-1; height:1px; width:90px; background:repeating-linear-gradient(90deg,rgba(255,117,124,.72) 0 4px,transparent 4px 9px); transform-origin:left center; animation:ws-flow 1.7s linear infinite; }
.ws-node.one::after { left:100%; top:100%; transform:rotate(29deg); }.ws-node.two::after { right:100%; top:100%; transform-origin:right center; transform:rotate(-29deg); }.ws-node.three::after { left:100%; bottom:100%; transform:rotate(-29deg); }.ws-node.four::after { right:100%; bottom:100%; transform-origin:right center; transform:rotate(29deg); }
.ws-benefits { grid-column:1/-1; display:grid; grid-template-columns:repeat(3,1fr); gap:1px; border:1px solid rgba(255,255,255,.12); border-radius:15px; overflow:hidden; background:rgba(255,255,255,.12); }
.ws-benefits article { min-height:124px; padding:20px; background:rgba(11,11,12,.86); }
.ws-benefits svg { width:22px; height:22px; color:#ff6870; }
.ws-benefits h3 { margin:13px 0 6px; color:#fff; font:700 16px/1.1 'Space Grotesk',sans-serif; }
.ws-benefits p { margin:0; color:rgba(255,255,255,.62); font-size:13px; line-height:1.45; }
@keyframes ws-pulse { 70% { box-shadow:0 0 0 7px rgba(69,211,145,0); } 100% { box-shadow:0 0 0 0 rgba(69,211,145,0); } }
@keyframes ws-flow { to { background-position-x:-27px; } }
@keyframes ws-orbit { to { transform:rotate(360deg); } }
@media (max-width:850px) { .websocket-section { grid-template-columns:1fr; gap:32px; } .ws-benefits { grid-column:auto; } .ws-visual { min-height:330px; } }
@media (max-width:570px) { .websocket-section { padding-top:66px; padding-bottom:66px; } .ws-visual { min-height:310px; border-radius:18px; transform:scale(.96); transform-origin:center; } .ws-visual::before { width:260px; height:260px; }.ws-visual::after { width:170px; height:170px; }.ws-hub { width:95px; height:95px; }.ws-node { padding:8px; font-size:10px; gap:5px; }.ws-node svg { width:13px; height:13px; }.ws-node.one,.ws-node.three { left:4%; }.ws-node.two,.ws-node.four { right:4%; }.ws-node::after { width:58px; }.ws-benefits { grid-template-columns:1fr; }.ws-benefits article { min-height:0; padding:18px; } }
@media (prefers-reduced-motion:reduce) { .ws-tag b,.ws-node::after,.ws-visual::after { animation:none; } }

/* Hero typography alignment. */
.websocket-section h1{font-style:italic}


/* Página de integraciones API */
.integration-api h1{font:700 clamp(43px,5vw,75px)/.99 'Space Grotesk',sans-serif;letter-spacing:-4px;margin:0}
.integration-api .api-title{transform:none!important;text-align:left}
.integration-api .api-title-line{display:block;transform:skewX(-5deg);transform-origin:left center}
.integration-api .api-title-line em{font-style:normal!important}
.integration-api{grid-template-columns:minmax(0,.88fr) minmax(390px,1.12fr);gap:clamp(36px,6vw,90px);background:radial-gradient(circle at 85% 12%,rgba(25,118,210,.25),transparent 28%),linear-gradient(135deg,#07101d,#101922 62%,#07101b)}
.integration-api .api-intro{align-self:center}.api-secondary-copy{max-width:530px;margin:18px 0 0;color:rgba(255,255,255,.63);font-size:14px;line-height:1.65}.api-trust{display:flex;flex-wrap:wrap;gap:9px;margin-top:25px}.api-trust span{display:inline-flex;align-items:center;gap:7px;padding:8px 10px;border:1px solid rgba(160,209,255,.2);border-radius:999px;background:rgba(25,118,210,.12);color:#dceeff;font:700 10px/1 'Space Grotesk',sans-serif;letter-spacing:.04em}.api-trust svg{width:14px;height:14px;color:#7bc1f5}
.api-flow-panel{padding:27px;border:1px solid rgba(151,205,255,.22);border-radius:24px;background:rgba(255,255,255,.98);box-shadow:0 24px 58px rgba(0,0,0,.24);color:#151820}.api-flow-heading{display:flex;align-items:center;gap:14px;padding-bottom:20px;border-bottom:1px solid #dce5ee}.api-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:12px;background:var(--red);color:#fff}.api-icon svg{width:25px;height:25px}.api-flow-heading p,.api-card-kicker{margin:0;color:var(--red);font:800 10px/1 'Space Grotesk',sans-serif;letter-spacing:.1em}.api-flow-heading h2{margin:7px 0 0;color:#151820;font:700 24px/1.1 'Space Grotesk',sans-serif;letter-spacing:-1px}.api-flow-list{display:grid;gap:8px;margin:22px 0 0;padding:0;list-style:none;counter-reset:api-step}.api-flow-list li{display:flex;align-items:center;gap:12px;min-height:44px;padding:8px 12px;border:1px solid #d6e1eb;border-radius:11px;background:#fff;box-shadow:0 4px 10px rgba(17,34,52,.035);counter-increment:api-step;font:600 13px/1.2 'DM Sans',sans-serif;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}.api-flow-list li:hover{transform:translateX(5px);border-color:var(--red);box-shadow:0 8px 18px rgba(25,118,210,.13)}.api-flow-list i{display:grid;place-items:center;flex:none;width:25px;height:25px;padding:5px;border-radius:8px;background:color-mix(in srgb,var(--red) 12%,transparent);color:var(--red)}.api-flow-list svg{width:15px;height:15px}.api-flow-list li::after{content:'0' counter(api-step);margin-left:auto;color:#9aacc0;font:700 10px 'Space Grotesk',sans-serif}
.api-white-label{grid-column:1/-1;display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:20px;padding:30px;border:1px solid rgba(154,207,255,.18);border-radius:20px;background:linear-gradient(135deg,rgba(25,118,210,.16),rgba(255,255,255,.055));box-shadow:0 18px 42px rgba(0,0,0,.14)}.api-card-icon{grid-row:span 3;display:grid;place-items:center;align-self:start;width:58px;height:58px;border-radius:15px;background:var(--red);color:#fff}.api-card-icon svg{width:29px;height:29px}.api-white-label h2{margin:6px 0 10px;color:#fff;font:700 clamp(27px,3vw,39px)/1 'Space Grotesk',sans-serif;letter-spacing:-1.8px}.api-white-label h2 em{color:#a8d8ff}.api-white-label>p{margin:0;color:rgba(255,255,255,.72);line-height:1.62}.api-white-label ul{grid-column:2;margin:17px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px;list-style:none}.api-white-label li{padding:7px 9px;border-radius:999px;background:rgba(255,255,255,.09);color:#dceeff;font-size:11px}.api-white-label li::before{content:'✓';color:#7bc1f5;margin-right:6px;font-weight:800}
.api-pillars{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.api-pillars article{padding:23px;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:rgba(11,17,27,.74);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}.api-pillars article:hover{transform:translateY(-7px);border-color:rgba(123,193,245,.7);box-shadow:inset 0 -5px 0 var(--red),0 16px 30px rgba(0,0,0,.22)}.api-pillars>article>i,.api-pillars>article>svg{display:grid;place-items:center;width:42px;height:42px;padding:10px;box-sizing:border-box;border-radius:11px;background:color-mix(in srgb,var(--red) 90%,transparent);color:#fff}.api-pillars svg{width:22px;height:22px}.api-pillars h3{margin:17px 0 8px;color:#fff;font:700 18px 'Space Grotesk',sans-serif}.api-pillars p{margin:0;color:rgba(255,255,255,.64);font-size:13px;line-height:1.55}
@media(max-width:980px){.integration-api{grid-template-columns:1fr}.api-white-label,.api-pillars{grid-column:auto}.api-pillars{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.integration-api{padding-top:64px;padding-bottom:64px}.api-flow-panel{padding:19px;border-radius:18px}.api-flow-heading h2{font-size:21px}.api-flow-list li{font-size:12px}.api-white-label{grid-template-columns:1fr;gap:15px;padding:23px}.api-card-icon{grid-row:auto}.api-white-label ul{grid-column:auto}.api-pillars{grid-template-columns:1fr}.api-trust{gap:7px}}