/* ============================================================
   SCROLLBAR DE MARCA · todo el sitio y las landings (oct 2026)
   Una sola hoja, enlazada al final del <head> de cada página, para
   que gane a cualquier regla anterior (las landings tenían la suya).

   - Chrome, Edge, Safari, Opera: barra con el degradado iris → menta
     de la marca, sobre el fondo tinta. Las áreas con scroll interno
     (menú del celular, panel lateral, carruseles) usan una más fina
     con fondo transparente.
   - Firefox no permite degradados en la barra: usa el color iris.

   Ojo: en Chrome 121+, si un elemento tiene scrollbar-color o
   scrollbar-width distinto de "auto", se ignoran los ::-webkit-*.
   Por eso acá se devuelven a "auto" (salvo el carrusel de servicios,
   que oculta su barra a propósito).
   ============================================================ */
@supports selector(::-webkit-scrollbar) {
  *:not(.services-h__viewport) { scrollbar-width: auto !important; scrollbar-color: auto !important; }
}

/* barra principal de la página */
html::-webkit-scrollbar { width: 12px; height: 12px; }
html::-webkit-scrollbar-track { background: #060512; }
html::-webkit-scrollbar-thumb {
  border: 3px solid transparent;
  border-radius: 100px;
  background: linear-gradient(180deg, #6C63FF 0%, #3EE6A8 100%) padding-box;
  min-height: 48px;
}
html::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, #8A83FF 0%, #67F0C0 100%) padding-box; }
html::-webkit-scrollbar-thumb:active { background: linear-gradient(180deg, #A9A4F8 0%, #8CF5D0 100%) padding-box; }
html::-webkit-scrollbar-corner { background: #060512; }

/* áreas con scroll interno */
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 100px;
  background: linear-gradient(180deg, rgba(108, 99, 255, .85), rgba(62, 230, 168, .85)) padding-box;
}
*::-webkit-scrollbar-thumb:horizontal { background: linear-gradient(90deg, rgba(108, 99, 255, .85), rgba(62, 230, 168, .85)) padding-box; }
*::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, #8A83FF, #67F0C0) padding-box; }
*::-webkit-scrollbar-corner { background: transparent; }

/* Firefox */
@supports not selector(::-webkit-scrollbar) {
  html { scrollbar-width: thin; scrollbar-color: #6C63FF #060512; }
  body * { scrollbar-width: thin; scrollbar-color: rgba(108, 99, 255, .85) transparent; }
  .services-h__viewport { scrollbar-width: none; }
}