.voltio {
--bg: #FBFBFD;
--surface: #FFFFFF;
--surface-2: #F5F5F7;
--surface-dark: #1D1D1F;
--line: #D2D2D7;
--accent: #0071E3;
--accent-hover: #0077ED;
--text: #1D1D1F;
--text-muted: #6E6E73;
--text-on-dark: #F5F5F7;
--radius-l: 22px;
--radius-m: 14px;
background: var(--bg);
color: var(--text);
font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", Helvetica, Arial, sans-serif;
line-height: 1.47;
letter-spacing: -0.01em;
-webkit-font-smoothing: antialiased;
overflow-x: hidden;
}
@media (prefers-color-scheme: dark) {
.voltio {
--bg: #000000;
--surface: #1D1D1F;
--surface-2: #161617;
--line: #38383A;
--text: #F5F5F7;
--text-muted: #98989D;
}
}
.voltio *, .voltio *::before, .voltio *::after { box-sizing: border-box; }
.voltio h1, .voltio h2, .voltio h3, .voltio p, .voltio form { margin: 0; padding: 0; }
.voltio h1, .voltio h2, .voltio h3 { font-weight: 600; letter-spacing: -0.02em; text-transform: none; }
.voltio a { color: inherit; text-decoration: none; }
.voltio img { max-width: 100%; }
.voltio :focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.voltio .wrap { max-width: 1040px; margin: 0 auto; padding: 0 24px; }
@media (max-width: 640px) { .voltio .wrap { padding: 0 20px; } }
/* ---- barra propia (bórrala si te basta con la cabecera del tema) ---- */
.voltio .vt-nav { border-bottom: 1px solid var(--line); }
.voltio .vt-nav .wrap { display: flex; align-items: center; gap: 20px; height: 52px; }
.voltio .brand { font-size: 16px; font-weight: 600; }
.voltio .links { display: flex; gap: 26px; font-size: 13px; margin-left: auto; }
.voltio .links a { color: var(--text-muted); }
.voltio .links a:hover { color: var(--text); }
.voltio .nav-right { display: flex; align-items: center; gap: 18px; margin-left: auto; }
.voltio .links + .nav-right { margin-left: 0; }
.voltio .nav-cta { font-size: 13px; color: var(--accent); white-space: nowrap; }
.voltio .nav-cta:hover { color: var(--accent-hover); }
@media (max-width: 800px) { .voltio .links { display: none; } }
/* ---- selector de idioma ---- */
.voltio .lang { display: flex; align-items: center; gap: 5px; color: var(--text-muted); }
.voltio .lang:hover, .voltio .lang:focus-within { color: var(--text); }
.voltio .lang svg { width: 15px; height: 15px; flex-shrink: 0; }
.voltio .lang select {
appearance: none; -webkit-appearance: none;
background: transparent; border: none; box-shadow: none;
color: inherit; font-family: inherit; font-size: 13px;
padding: 4px 2px; margin: 0; cursor: pointer; height: auto; min-height: 0;
}
.voltio .lang option { color: #1D1D1F; background: #fff; }
.voltio .btn {
font-size: 15px; font-weight: 400; font-family: inherit;
padding: 10px 20px; border-radius: 980px;
border: 1px solid transparent; cursor: pointer;
display: inline-block; text-transform: none; letter-spacing: inherit;
width: auto; min-height: 0; line-height: 1.47;
}
.voltio .btn-primary { background: var(--accent); color: #fff; }
.voltio .btn-primary:hover { background: var(--accent-hover); color: #fff; }
.voltio .btn-link { color: var(--accent); padding: 10px 4px; }
.voltio .btn-link:hover { color: var(--accent-hover); }
.voltio .btn-link::after { content: " \203A"; }
/* ---- hero ---- */
.voltio .hero { text-align: center; padding: 84px 0 56px; }
.voltio .hero .kicker { font-size: 19px; color: var(--text-muted); margin-bottom: 6px; }
.voltio .hero h1 { font-size: clamp(40px, 6vw, 68px); line-height: 1.05; max-width: 15ch; margin: 0 auto; }
.voltio .hero p.lead { margin: 18px auto 0; font-size: 21px; color: var(--text-muted); max-width: 34ch; }
.voltio .hero .cta-row { margin-top: 26px; display: flex; gap: 26px; justify-content: center; align-items: center; flex-wrap: wrap; }
.voltio .hero-stage {
margin-top: 56px; height: 340px;
border-radius: var(--radius-l);
background: linear-gradient(160deg, #EEF3F8 0%, #E4EBF4 55%, #DCE6F2 100%);
position: relative; overflow: hidden;
display: flex; align-items: center; justify-content: center;
}
@media (prefers-color-scheme: dark) {
.voltio .hero-stage { background: linear-gradient(160deg, #1C2733 0%, #141C24 60%, #0E1318 100%); }
}
/* ---- fichas de producto ---- */
.voltio .spotlight { padding: 90px 0; text-align: center; border-top: 1px solid var(--line); }
.voltio .spotlight.dark { background: var(--surface-dark); color: var(--text-on-dark); }
.voltio .spotlight .kicker { font-size: 17px; color: var(--text-muted); }
.voltio .spotlight.dark .kicker { color: #98989D; }
.voltio .spotlight h2 { font-size: clamp(30px, 4.4vw, 48px); margin-top: 4px; }
.voltio .spotlight p.desc { margin: 14px auto 0; max-width: 34ch; font-size: 17px; color: var(--text-muted); }
.voltio .spotlight.dark p.desc { color: #A1A1A6; }
.voltio .spotlight .price-tag { margin-top: 18px; font-size: 15px; color: var(--text-muted); }
.voltio .spotlight.dark .price-tag { color: #A1A1A6; }
.voltio .spotlight .links { margin-top: 18px; display: flex; gap: 24px; justify-content: center; }
.voltio .stage {
margin: 44px auto 0; width: min(560px, 100%);
aspect-ratio: 16 / 10; border-radius: var(--radius-l);
display: flex; align-items: center; justify-content: center;
position: relative; overflow: hidden;
}
.voltio .stage canvas, .voltio .hero-stage canvas { width: 100%; height: 100%; display: block; cursor: grab; }
/* ---- visores de foto ---- */
.voltio .spin, .voltio .photo-3d {
width: 100%; height: 100%;
display: flex; align-items: center; justify-content: center;
touch-action: none; cursor: grab; position: relative;
}
.voltio .spin.dragging, .voltio .photo-3d.dragging { cursor: grabbing; }
.voltio .photo-3d { perspective: 900px; }
.voltio .spin img, .voltio .photo-3d img {
max-width: 80%; max-height: 80%; object-fit: contain;
pointer-events: none; -webkit-user-select: none; user-select: none;
}
.voltio .photo-3d img {
border-radius: var(--radius-m);
box-shadow: 0 30px 50px -20px rgba(0,0,0,0.35);
transform-style: preserve-3d; will-change: transform;
transition: transform .35s cubic-bezier(.22,.61,.36,1);
}
.voltio .photo-3d.active img { transition: none; }
.voltio .hint {
position: absolute; bottom: 12px; left: 50%; transform: translateX(-50%);
font-size: 11px; color: var(--text-muted);
background: rgba(255,255,255,0.7);
padding: 4px 10px; border-radius: 980px;
pointer-events: none; opacity: .85;
}
/* ---- ventajas ---- */
.voltio .features { padding: 80px 0; border-top: 1px solid var(--line); }
.voltio .features-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; text-align: center; margin-top: 44px; }
@media (max-width: 760px) { .voltio .features-grid { grid-template-columns: 1fr; gap: 44px; } }
.voltio .feature h3 { font-size: 21px; }
.voltio .feature p { margin-top: 8px; font-size: 15px; color: var(--text-muted); }
.voltio .feature .glyph { width: 48px; height: 48px; margin: 0 auto 18px; display: block; }
.voltio .section-head { text-align: center; max-width: 42ch; margin: 0 auto; }
.voltio .section-head h2 { font-size: clamp(28px, 3.6vw, 38px); }
.voltio .section-head p { margin-top: 12px; color: var(--text-muted); font-size: 17px; }
/* ---- asistente ---- */
.voltio .ai-intro { padding: 84px 0; border-top: 1px solid var(--line); text-align: center; background: var(--surface-2); }
.voltio .ai-intro h2 { font-size: clamp(28px, 3.6vw, 40px); max-width: 20ch; margin: 0 auto; }
.voltio .ai-intro p { margin: 14px auto 0; color: var(--text-muted); font-size: 17px; max-width: 40ch; }
.voltio .ai-intro .btn { margin-top: 26px; }
/* ---- lista de espera ---- */
.voltio .signup { padding: 90px 0; border-top: 1px solid var(--line); text-align: center; }
.voltio .signup h2 { font-size: clamp(28px, 3.6vw, 40px); }
.voltio .signup p { margin: 14px auto 0; color: var(--text-muted); max-width: 40ch; font-size: 17px; }
.voltio .signup-form { display: flex; gap: 10px; margin: 26px auto 0; max-width: 440px; justify-content: center; }
.voltio .signup-form input {
flex: 1; min-width: 0; background: var(--surface);
border: 1px solid var(--line); border-radius: 980px;
padding: 12px 18px; color: var(--text);
font-family: inherit; font-size: 15px; height: auto; margin: 0;
}
.voltio .form-note { margin-top: 12px; font-size: 13px; color: var(--text-muted); min-height: 18px; }
.voltio .vt-footer { padding: 40px 0 60px; border-top: 1px solid var(--line); }
.voltio .vt-footer .wrap { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 14px; align-items: center; }
.voltio .vt-footer p { font-size: 12px; color: var(--text-muted); }
/* ---- burbuja del asistente ---- */
.voltio .ai-fab {
position: fixed; right: 20px; bottom: calc(20px + env(safe-area-inset-bottom, 0px)); z-index: 40;
display: flex; align-items: center; gap: 9px;
padding: 13px 20px 13px 16px; border-radius: 980px;
border: 1px solid var(--line); background: var(--surface); color: var(--text);
font-size: 14.5px; font-weight: 500; font-family: inherit;
cursor: pointer; box-shadow: 0 10px 30px -8px rgba(0,0,0,0.18);
}
.voltio .ai-fab .orb, .voltio .ai-head .orb {
width: 20px; height: 20px; border-radius: 50%;
background: linear-gradient(135deg, var(--accent), #63C7FF); flex-shrink: 0;
}
.voltio .ai-head .orb { width: 16px; height: 16px; }
.voltio .ai-fab:hover { border-color: var(--accent); }
.voltio .ai-panel {
position: fixed; right: 20px; bottom: calc(84px + env(safe-area-inset-bottom, 0px)); z-index: 41;
width: min(380px, calc(100vw - 40px));
max-height: min(560px, calc(100vh - 190px));
display: flex; flex-direction: column;
background: var(--surface); border: 1px solid var(--line);
border-radius: var(--radius-l);
box-shadow: 0 24px 60px -14px rgba(0,0,0,0.22);
overflow: hidden; opacity: 0;
transform: translateY(10px) scale(0.98); pointer-events: none;
transition: opacity .18s ease, transform .18s ease;
}
.voltio .ai-panel.open { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.voltio .ai-head { padding: 16px 18px; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.voltio .ai-head .title { font-weight: 600; font-size: 15px; display: flex; align-items: center; gap: 8px; }
.voltio .ai-head p { font-size: 12px; color: var(--text-muted); margin-top: 2px; }
.voltio .ai-close { background: none; border: none; color: var(--text-muted); cursor: pointer; font-size: 17px; line-height: 1; padding: 4px; }
.voltio .ai-body { flex: 1; overflow-y: auto; padding: 16px 18px; display: flex; flex-direction: column; gap: 12px; }
.voltio .ai-msg { font-size: 13.5px; line-height: 1.5; max-width: 92%; white-space: pre-wrap; }
.voltio .ai-msg.user { align-self: flex-end; background: var(--surface-2); padding: 9px 13px; border-radius: 14px 14px 2px 14px; }
.voltio .ai-msg.bot { align-self: flex-start; color: var(--text); }
.voltio .ai-msg.bot .label { display: block; font-size: 11px; color: var(--accent); margin-bottom: 3px; font-weight: 600; }
.voltio .ai-empty { font-size: 13px; color: var(--text-muted); }
.voltio .ai-foot { border-top: 1px solid var(--line); padding: 12px; display: flex; gap: 8px; }
.voltio .ai-foot input {
flex: 1; min-width: 0; background: var(--surface-2);
border: 1px solid var(--line); border-radius: 980px;
padding: 10px 14px; color: var(--text);
font-family: inherit; font-size: 13.5px; height: auto; margin: 0;
}
.voltio .ai-foot button {
font-weight: 600; font-size: 13px; padding: 0 18px;
border-radius: 980px; border: none; background: var(--accent);
color: #fff; cursor: pointer; font-family: inherit;
}
.voltio .ai-foot button:disabled { opacity: 0.5; cursor: default; }
Voltio
Voltio
Tecnología pequeña. Pensada al detalle.
Tres gadgets esenciales, enviados a toda la Unión Europea.
Voltio Núcleo 10K
La batería que no se nota hasta que la necesitas
Carga dos dispositivos a la vez y aguanta un fin de semana entero fuera de casa, sin buscar un enchufe.
Desde 24,90 €
Voltio Arco
Tu casa, un poco más lista
Controla cualquier lámpara o aparato desde el móvil. Sin instalación, sin obras.
Desde 17,90 €
Voltio Órbita
Gira contigo, no al revés
Se fija al salpicadero en segundos y gira 360° sin un solo tornillo.
Desde 14,90 €
Comprar en Voltio, sin fricción
Todo lo que rodea al producto, pensado igual de bien que el producto mismo.
Envío desde la UE
Sale de almacenes europeos, sin aranceles ni sorpresas en la aduana.
Pago seguro
Tarjeta, PayPal, Apple Pay o Google Pay. Cifrado de principio a fin.
30 días para decidir
Si algo no encaja, se devuelve sin preguntas.
Pregúntale al asistente qué te conviene
Conoce el catálogo entero, los envíos y las devoluciones. Responde al momento, abajo a la derecha.
Sé de los primeros en comprar
Avisamos por correo el día del lanzamiento, con un 10% para quien se apunte antes.
Asistente Voltio
Pregunta por productos, envíos o devoluciones
Por ejemplo: "¿qué me recomiendas para el coche?" o "¿cómo funcionan las devoluciones?"
