 

 

 
 
.btn[hidden] {
  display: none;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2xs);
  min-height: var(--control-h);
  padding: var(--sp-2xs) var(--control-pad-x);
  border: var(--linea) solid transparent;
  border-radius: var(--radius-s);
  font-size: var(--fs-small);
  font-weight: var(--fw-semibold);
  text-decoration: none;
  white-space: nowrap;    
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-out),
              border-color var(--dur-fast) var(--ease-out),
              transform var(--dur-fast) var(--ease-out);
}

.btn svg { width: 16px; height: 16px; flex-shrink: 0; }

.btn:active { transform: translateY(1px); }

.btn--primary { background: var(--c-primary); color: var(--c-on-primary); }
 
.btn--primary:hover {
  background: var(--c-primary-hover);
  border-color: var(--c-primary-filo-hover);
  color: var(--c-on-primary);
}

 
.btn--pill {
  border-radius: var(--radius-pill);
  border-color: var(--c-border);
  background: transparent;
  color: var(--c-text);
  padding-inline: var(--sp-m);
}

.btn--pill:hover {
  border-color: var(--c-text-faint);
  color: var(--c-text);
}

 
 
.btn--cta {
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: var(--sp-2xs);

   
  min-height: var(--control-h-lg);
  padding: var(--sp-2xs) var(--control-pad-x);
  border-radius: var(--radius-s);
  background: var(--c-primary);
  color: var(--c-on-primary);
  text-align: left;
}

.btn--cta span {
  font-size: var(--fs-small);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  line-height: 1.2;

   
  white-space: normal;
  overflow-wrap: anywhere;
}

 
.btn--cta svg { order: 1; }

.btn--cta:hover {
  background: var(--c-primary-hover);
  border-color: var(--c-primary-filo-hover);
  color: var(--c-on-primary);
}

.btn--cta svg {
  width: 18px;
  height: 18px;
  stroke-width: 2;
  transition: transform var(--dur-base) var(--ease-out);
}

.btn--cta:hover svg { transform: translate3d(3px, -3px, 0); }

 

.eyebrow {
  font-family: var(--font-mono);
  font-size: var(--fs-eyebrow);
  font-weight: var(--fw-regular);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: var(--c-text-faint);

   
  min-width: 0;
  overflow-wrap: anywhere;
}

 
.eyebrow--vertical { color: var(--c-vertical-ink, var(--c-vertical-soft)); }

.datum {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  color: var(--c-text-mono);
  min-width: 0;
  overflow-wrap: anywhere;
}

 
.link-arrow {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2xs);

   
  min-height: var(--tap-target-min);

   
  color: var(--c-vertical-ink, var(--c-vertical-soft));
  font-weight: var(--fw-medium);
  font-size: var(--fs-small);
  text-decoration: none;

   
  transition: color var(--dur-fast) var(--ease-out),
              gap var(--dur-base) var(--ease-out);
}

.link-arrow svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  transition: transform var(--dur-base) var(--ease-out);
}

 
.link-arrow:hover,
.link-arrow:focus-visible,
.vertical-card:hover .link-arrow,
.vertical-card:focus-within .link-arrow,
.post-card:hover .link-arrow,
.post-card:focus-within .link-arrow,
.case-card:hover .link-arrow,
.case-card:focus-within .link-arrow {
   
  color: color-mix(in srgb, var(--c-vertical-ink, var(--c-vertical-soft)) 40%, var(--c-text));
  text-decoration: underline;
  text-underline-offset: 0.25em;
}

 
.link-arrow:hover,
.link-arrow:focus-visible,
.vertical-card:hover .link-arrow,
.vertical-card:focus-within .link-arrow,
.post-card:hover .link-arrow,
.post-card:focus-within .link-arrow,
.case-card:hover .link-arrow,
.case-card:focus-within .link-arrow { gap: var(--sp-xs); }

.link-arrow:hover svg,
.link-arrow:focus-visible svg,
.vertical-card:hover .link-arrow svg,
.vertical-card:focus-within .link-arrow svg,
.post-card:hover .link-arrow svg,
.post-card:focus-within .link-arrow svg,
.case-card:hover .link-arrow svg,
.case-card:focus-within .link-arrow svg { transform: translate3d(4px, 0, 0); }

 
@media (prefers-reduced-motion: reduce) {
  .btn--cta:hover svg,
  .link-arrow:hover svg,
  .link-arrow:focus-visible svg,
  .vertical-card:hover .link-arrow svg,
  .vertical-card:focus-within .link-arrow svg,
  .post-card:hover .link-arrow svg,
  .post-card:focus-within .link-arrow svg,
  .case-card:hover .link-arrow svg,
  .case-card:focus-within .link-arrow svg { transform: none; }

   
  .link-arrow:hover,
  .link-arrow:focus-visible,
  .vertical-card:hover .link-arrow,
  .vertical-card:focus-within .link-arrow,
  .post-card:hover .link-arrow,
  .post-card:focus-within .link-arrow,
  .case-card:hover .link-arrow,
  .case-card:focus-within .link-arrow { gap: var(--sp-2xs); }
}

 

 

 
html.js [data-reveal]:not(.is-visible) { will-change: opacity, translate; }

 
html.js [data-reveal]:not(.is-visible) {
  opacity: 0;
  translate: 0 18px;
}

 
@media (prefers-reduced-motion: no-preference) {
  html.js [data-reveal].is-visible {
    animation: reveal-entra var(--dur-slow) var(--ease-out) backwards;
    animation-delay: calc(var(--reveal-paso, 0) * var(--stagger));
  }
}

@keyframes reveal-entra {
  from { opacity: 0; translate: 0 18px; }
  to   { opacity: 1; translate: 0 0; }
}

 
html.js [data-reveal].is-visible { opacity: 1; }

 
html.js [data-reveal] {
  transition: translate var(--dur-hover) var(--ease-out),
              box-shadow var(--dur-hover) var(--ease-out),
              border-color var(--dur-hover) var(--ease-out),
              background-color var(--dur-hover) var(--ease-out),
              color var(--dur-hover) var(--ease-out);
}

 
html.js [data-reveal]:target {
  animation: none;
  opacity: 1;
  translate: 0 0;
}

@media (prefers-reduced-motion: reduce) {
  html.js [data-reveal]:not(.is-visible) { opacity: 1; translate: 0 0; }
}

 
html.reveal-fallback [data-reveal] {
  opacity: 1 !important;
  transform: none !important;
  translate: 0 0 !important;
  animation: none !important;
}

 
 
html.js [data-reveal-cadena]:not(.is-visible) :is(.section__eyebrow, .lead),
html.js [data-reveal-cadena]:not(.is-visible) > .btn {
  opacity: 0;
  translate: 0 14px;
}

 
html.js [data-reveal-cadena]:not(.is-visible) :is(h1, h2) {
  translate: 0 14px;
}

@media (prefers-reduced-motion: no-preference) {
  html.js [data-reveal-cadena].is-visible :is(.section__eyebrow, .lead),
  html.js [data-reveal-cadena].is-visible > .btn {
    animation: reveal-entra var(--dur-slow) var(--ease-out) backwards;
  }

  html.js [data-reveal-cadena].is-visible :is(h1, h2) {
    animation: reveal-sube var(--dur-slow) var(--ease-out) backwards;
  }

   
  html.js [data-reveal-cadena].is-visible .lead { animation-delay: var(--stagger); }
  html.js [data-reveal-cadena].is-visible > .btn { animation-delay: calc(var(--stagger) * 2); }
}

 
html.js [data-reveal-cadena].is-visible :is(.section__eyebrow, .lead, h1, h2),
html.js [data-reveal-cadena].is-visible > .btn {
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  html.js [data-reveal-cadena] :is(.section__eyebrow, .lead, h1, h2),
  html.js [data-reveal-cadena] > .btn { opacity: 1; translate: 0 0; }
}

 
html.reveal-fallback [data-reveal-cadena] :is(.section__eyebrow, .lead, h1, h2),
html.reveal-fallback [data-reveal-cadena] > .btn {
  opacity: 1 !important;
  translate: 0 0 !important;
  animation: none !important;
}

 
@keyframes reveal-sube {
  from { translate: 0 14px; }
  to   { translate: 0 0; }
}

 
@property --barrido {
  syntax: '<percentage>';
  inherits: true;
  initial-value: 0%;
}

@media (prefers-reduced-motion: no-preference) {
   
  html.js .section__head--barrido.is-visible {
    animation: barrido-titulo var(--dur-barrido) var(--ease-color) forwards;
  }

   
  html.js .section__head--barrido h2 {
    clip-path: inset(0 calc(100% - var(--barrido)) 0 0);

     
    background-image: linear-gradient(
      90deg,
      transparent calc(var(--barrido) - 26%),
      var(--c-vertical) calc(var(--barrido) - 26%),
      var(--c-vertical) var(--barrido),
      transparent var(--barrido));
  }

   
  @keyframes barrido-titulo {
    from { --barrido: 0%; }
    to   { --barrido: 126%; }
  }
}

 
html.reveal-fallback .section__head--barrido h2 {
  clip-path: none;
  background-image: none;
}


 
@media (prefers-reduced-motion: no-preference) {
  html.js .scope-note.is-visible {
    animation: reveal-entra var(--dur-slow) var(--ease-out) backwards,
               barrido-titulo var(--dur-barrido) var(--ease-color) forwards;
    animation-delay: calc(var(--reveal-paso, 0) * var(--stagger));
  }

  html.js .scope-note {
     
    clip-path: inset(0 calc(100% - var(--barrido)) 0 0);

     
    background-image: linear-gradient(90deg, var(--c-vertical), var(--c-vertical));
    background-repeat: no-repeat;
    background-size: var(--linea-fuerte) 100%;
    background-position: calc(var(--barrido) - var(--linea-fuerte) - 1px) 0;
  }
}

html.reveal-fallback .scope-note {
  clip-path: none;
  background-image: none;
}
 

.hero {
   
  --hero-pad-top: clamp(3rem, 2rem + 5vw, 6rem);

   
  --hero-golpe: calc(100svh - var(--header-h) - var(--hero-pad-top) - var(--sp-l));

  position: relative;

   
  padding-block: var(--hero-pad-top) clamp(3rem, 2rem + 4vw, 5rem);
  overflow: hidden;
  isolation: isolate;
}

 
 
 
 
.hero__bg {
   
  --hero-luz-tenue: 0.20;

  position: absolute;
  inset: 0 -25%;
  z-index: -2;
  pointer-events: none;
  overflow: hidden;
  mask-image: linear-gradient(
    to bottom,
    rgb(0 0 0 / var(--hero-luz-tenue)) 0,
    rgb(0 0 0 / var(--hero-luz-tenue)) calc(var(--hero-pad-top) + var(--hero-golpe)),
    #000 calc(var(--hero-pad-top) + var(--hero-golpe) + var(--sp-3xl))
  );
}

 
.hero__bg--cenit {
  mask-image: linear-gradient(
    to bottom,
    #000 0,
    #000 calc(var(--hero-pad-top) * 0.55),
    transparent var(--hero-pad-top)
  );
}

 
.hero__bg span {
  position: absolute;
  display: block;

   
  height: var(--alto, 34px);
  width: var(--w, 70%);
  opacity: var(--o, 0.85);
  mix-blend-mode: screen;

   
  mask-image: linear-gradient(
    to bottom,
    transparent 0,
    rgb(0 0 0 / 0.10) 26%,
    rgb(0 0 0 / 0.34) 40%,
    rgb(0 0 0 / 0.74) 46.5%,
    #000 48.5%,
    #000 51.5%,
    rgb(0 0 0 / 0.74) 53.5%,
    rgb(0 0 0 / 0.34) 60%,
    rgb(0 0 0 / 0.10) 74%,
    transparent 100%
  );

   
  background: linear-gradient(
    90deg,
    transparent,
    var(--c) 18%,
    color-mix(in srgb, var(--c) var(--nucleo, 25%), var(--c-text)) 50%,
    var(--c) 82%,
    transparent
  );

   
  rotate: var(--r, -18deg);
  animation: streak var(--dur, 18s) ease-in-out infinite alternate;
}

 
.hero__bg span { --pliegue: calc(var(--hero-pad-top) + var(--hero-golpe)); }

 

 
.hero__bg:not(.hero__bg--cenit) span:nth-child(1) { --c: var(--c-primary);      --r: -14deg; --w: 58%; --alto: 34px; --o: .50; --nucleo: 70%; top: calc(var(--pliegue) * 0.24); left: -16%; --dur: 11s; }
.hero__bg:not(.hero__bg--cenit) span:nth-child(2) { --c: var(--c-ecommerce);    --r: -8deg;  --w: 44%; --alto: 44px; --o: .31; --nucleo: 70%; top: calc(var(--pliegue) * 0.40); left: 30%;  --dur: 14s; animation-delay: -5s; }
.hero__bg:not(.hero__bg--cenit) span:nth-child(3) { --c: var(--c-primary);      --r: -16deg; --w: 68%; --alto: 40px;   --o: .53; --nucleo: 55%; top: calc(var(--pliegue) * 0.55); left: -20%; --dur: 17s; animation-delay: -9s; }
.hero__bg:not(.hero__bg--cenit) span:nth-child(4) { --c: var(--c-marketing);    --r: -6deg;  --w: 38%; --alto: 28px;   --o: .74; --nucleo: 55%; top: calc(var(--pliegue) * 0.68); left: 48%;  --dur: 12s; animation-delay: -3s; }
.hero__bg:not(.hero__bg--cenit) span:nth-child(5) { --c: var(--c-ecommerce);    --r: -12deg; --w: 60%; --alto: 34px; --o: .78; --nucleo: 55%; top: calc(var(--pliegue) * 0.80); left: -6%;  --dur: 15s; animation-delay: -11s; }
.hero__bg:not(.hero__bg--cenit) span:nth-child(6) { --c: var(--c-capacitacion); --r: -9deg;  --w: 50%; --alto: 32px;   --o: .68; --nucleo: 55%; top: calc(var(--pliegue) * 0.92); left: 22%;  --dur: 13s; animation-delay: -7s; }

 
.hero__bg:not(.hero__bg--cenit) span:nth-child(7) { --c: var(--c-primary);      --r: -18deg; --w: 62%; --alto: 36px; --o: .9;  top: 66%; left: -10%; --dur: 16s; animation-delay: -6s; }
.hero__bg:not(.hero__bg--cenit) span:nth-child(8) { --c: var(--c-marketing);    --r: -11deg; --w: 54%; --alto: 48px;   --o: .25; --nucleo: 55%; top: 80%; left: 20%;  --dur: 19s; animation-delay: -13s; }
.hero__bg:not(.hero__bg--cenit) span:nth-child(9) { --c: var(--c-ecommerce);    --r: -24deg; --w: 46%; --alto: 56px;   --o: .25; --nucleo: 55%; top: 92%; left: -4%;  --dur: 14s; animation-delay: -2s; }

 
.hero__bg--cenit span:nth-child(1) { --c: var(--c-primary);      --r: -6deg; --w: 58%; --alto: 52px; --o: .95; top: calc(var(--hero-pad-top) * 0.28); left: -14%; --dur: 13s; }
.hero__bg--cenit span:nth-child(2) { --c: var(--c-capacitacion); --r: -4deg; --w: 40%; --alto: 40px;   --o: .85; top: calc(var(--hero-pad-top) * 0.55); left: 42%;  --dur: 17s; animation-delay: -8s; }
.hero__bg--cenit span:nth-child(3) { --c: var(--c-vertical);     --r: -8deg; --w: 34%; --alto: 42px;   --o: .9;  top: calc(var(--hero-pad-top) * 0.10); left: 12%;  --dur: 10s; animation-delay: -4s; }

 
@keyframes streak {
  from {
    translate: -14% 0;
    scale: 0.94 1;
    opacity: calc(var(--o, .55) * 0.84);
  }
  50% {
    opacity: var(--o, .55);
  }
  to {
    translate: 16% 0;
    scale: 1.12 1;
    opacity: calc(var(--o, .55) * 0.88);
  }
}

 
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: repeating-linear-gradient(
    to right,
    color-mix(in srgb, var(--c-text) 4%, transparent) 0 1px,
    transparent 1px 18%
  );
}

@media (prefers-reduced-motion: reduce) {
  .hero__bg span { animation: none; }
}

 
@media (prefers-reduced-motion: no-preference) {
   
  .hero__eyebrow {
    animation: hero-enter 620ms var(--ease-out) backwards;
  }

  .hero__title {
    animation: hero-lift 620ms var(--ease-out) backwards;
  }

  .hero__lead {
    animation: hero-enter 620ms var(--ease-out) backwards;
    animation-delay: var(--stagger);
  }

  .hero__actions,
  .hero__cue {
    animation: hero-enter 620ms var(--ease-out) backwards;
    animation-delay: calc(var(--stagger) * 2);
  }

   

   
  .hero__eyebrow::before {
    animation: antetitulo-traza var(--dur-slow) var(--ease-out) backwards;
  }
}

 
@keyframes hero-lift {
  from { transform: translate3d(0, 14px, 0); }
  to   { transform: none; }
}

@keyframes hero-enter {
  from { opacity: 0; transform: translate3d(0, 16px, 0); }
  to   { opacity: 1; transform: none; }
}

 
.hero__intro {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: var(--hero-golpe);

   
  padding-bottom: var(--sp-2xl);

   
  container-type: inline-size;
}

 
.hero__title {
   
  font-size: clamp(2.25rem, 1.27rem + 4.77cqw, 4.75rem);
  line-height: 1.02;
  letter-spacing: var(--tracking-tighter);
  font-weight: var(--fw-bold);
  max-width: 18ch;
}

 
.hero__title em {
  font-style: normal;
  color: var(--c-vertical);
}

 
.hero__title small {
  display: block;
  margin-top: 0.08em;
  font-size: 0.56em;
  font-weight: var(--fw-bold);
  letter-spacing: -0.02em;
}

 
.hero__title--acento-aparte em { display: block; }

 
.hero__copy {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--sp-l) var(--sp-2xl);
  margin-top: clamp(var(--sp-l), 4cqw, var(--sp-2xl));
}

@media (min-width: 960px) {
  .hero__title { max-width: none; }
}

.hero__lead {
   
  max-width: 34ch;
  min-width: 0;
  margin: 0;
  font-size: var(--fs-lead);
  line-height: 1.35;
  color: var(--c-text);
}

.hero__actions { margin-top: 0; }

 
.hero__cue {
   
  position: absolute;
  inset-block-end: 0;
  inset-inline-end: 0;

  display: flex;
  align-items: center;
  gap: var(--sp-2xs);
  padding-block: var(--sp-3xs);
  font-family: var(--font-mono);
  font-size: var(--fs-eyebrow);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: var(--c-text-faint);
  text-decoration: none;
  transition: color var(--dur-base) var(--ease-out);
}

.hero__cue:hover,
.hero__cue:focus-visible { color: var(--c-text); }

 
.hero__cue i {
  position: relative;
  display: block;
  width: 1px;
  height: var(--sp-l);
  overflow: hidden;
  background: var(--c-border);
}

.hero__cue i::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: calc(var(--sp-l) / 3);
  background: currentcolor;
}

 
@media (prefers-reduced-motion: no-preference) {
  .hero__cue i::after {
    animation: hero-cue-baja 2.2s ease-in-out infinite;
  }
}

@keyframes hero-cue-baja {
  from { translate: 0 -100%; opacity: 0; }
  35%  { opacity: 1; }
  to   { translate: 0 var(--sp-l); opacity: 0; }
}

.hero__media {
  position: relative;

   
  margin-top: var(--sp-2xl);

   
  aspect-ratio: 4 / 3;
  border-radius: var(--radius-l);
  overflow: hidden;
  background: var(--c-surface);
}

@media (min-width: 768px) {
  .hero__media { aspect-ratio: 16 / 9; }
}

 
.hero__media > video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

 
.hero__media > img,
.hero__media > img[width][height] {
  width: 100%;
  height: 100%;
  object-fit: cover;

   
  max-width: none;
}

 
.hero__media {
   
  container-type: inline-size;
}

.reticula {
  position: absolute;

   
  inset: clamp(0.625rem, 3cqw, 1.25rem);
  pointer-events: none;
}

.reticula i {
  --brazo: clamp(0.875rem, 6cqw, 1.75rem);

  position: absolute;
  width: var(--brazo);
  height: var(--brazo);

   
  border: 2px solid var(--c-vertical-soft);
}

 
.reticula i:nth-child(1) { top: 0;    left: 0;  border-right: 0; border-bottom: 0; --dx: -1; --dy: -1; }
.reticula i:nth-child(2) { top: 0;    right: 0; border-left: 0;  border-bottom: 0; --dx:  1; --dy: -1; }
.reticula i:nth-child(3) { bottom: 0; right: 0; border-left: 0;  border-top: 0;    --dx:  1; --dy:  1; }
.reticula i:nth-child(4) { bottom: 0; left: 0;  border-right: 0; border-top: 0;    --dx: -1; --dy:  1; }

 
@media (prefers-reduced-motion: no-preference) {
  html.js .hero__media[data-reveal].is-visible .reticula i {
    animation: reticula-fija 520ms var(--ease-out) backwards;
  }

  html.js .hero__media[data-reveal].is-visible .reticula i:nth-child(1) { animation-delay: calc(var(--stagger) * 4); }
  html.js .hero__media[data-reveal].is-visible .reticula i:nth-child(2) { animation-delay: calc(var(--stagger) * 4.5); }
  html.js .hero__media[data-reveal].is-visible .reticula i:nth-child(3) { animation-delay: calc(var(--stagger) * 5); }
  html.js .hero__media[data-reveal].is-visible .reticula i:nth-child(4) { animation-delay: calc(var(--stagger) * 5.5); }
}

 
@media (prefers-reduced-motion: no-preference) {
  html.js .hero__media[data-reveal].is-visible {
    animation: hero-media-entra 720ms var(--ease-out) backwards;
    animation-delay: 0s;
  }
}

html.js .hero__media[data-reveal]:not(.is-visible) { will-change: opacity, translate, scale; }

@keyframes hero-media-entra {
  from { opacity: 0; translate: 0 28px; scale: 1.03; }
  to   { opacity: 1; translate: 0 0; scale: 1; }
}

 
.hero--sin-media .hero__intro {
   
  min-height: 0;

   
  padding-bottom: 0;
}

 
.hero--sin-media {
  padding-block-end: clamp(3.5rem, 2rem + 5vw, 7rem);
}

 
.hero--sin-media .hero__bg:not(.hero__bg--cenit) span:nth-child(n + 7) {
  display: none;
}

 
.hero--sin-media .hero__bg span {
  --pliegue: 100%;
}

 
.hero--sin-media .hero__bg:not(.hero__bg--cenit) span:nth-child(1) {
  --o: 0.25;
}

 

 
@keyframes reticula-fija {
  from {
    opacity: 0;

     
    translate: calc(var(--dx) * 10px) calc(var(--dy) * 10px);
  }
  to {
    opacity: 1;
    translate: 0 0;
  }
}

 
@media (prefers-reduced-motion: reduce) {
  .reticula i { animation: none; }
}

 

.client-strip {
  --marquee-duration: 42s;

   
  --strip-gap: clamp(calc(var(--logo-w) * 0.36), 5.5vw, calc(var(--logo-w) * 0.64));

  position: relative;
  display: flex;
  overflow: hidden;
  padding-block: var(--sp-s);
  mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent);
}

 
.client-strip__lead {
  max-width: 62ch;
  margin-top: var(--sp-l);
  color: var(--c-text-muted);
  font-size: var(--fs-lead);
  line-height: var(--lh-medio);
  min-width: 0;
  overflow-wrap: anywhere;
}

 
.client-strip--hero {
  margin-top: clamp(var(--sp-m), 4vw, var(--sp-2xl));
  border-top: var(--linea) solid var(--c-border-soft);

   
  padding-block: var(--sp-m);
}

 
.client-strip--framed {
  margin-top: clamp(var(--sp-s), 2vw, var(--sp-m));
  padding-block: var(--sp-m);
  border-block: var(--linea) solid var(--c-border-soft);
}

 

.client-strip__track {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  gap: var(--strip-gap);
  padding-right: var(--strip-gap);
  animation: marquee-scroll var(--marquee-duration) linear infinite;
}

 
.client-strip.is-offscreen .client-strip__track {
  animation-play-state: paused;
}

 
 
html:not(.js) .hero__bg span,
html:not(.js) .hero__cue i::after,
html:not(.js) .client-strip__track,
html:not(.js) .marquee__track {
  animation: none;
}

@media (prefers-reduced-motion: no-preference) {
  [data-movimiento="pausado"] .client-strip__track,
  [data-movimiento="pausado"] .marquee__track,

   
  [data-movimiento="pausado"] .hero__bg span,
  [data-movimiento="pausado"] .hero__cue i::after {
    animation-play-state: paused;
  }

  [data-movimiento="pausado"] .client-strip,
  [data-movimiento="pausado"] .marquee {
    overflow-x: auto;

     
    overflow-y: hidden;
  }

   
  [data-movimiento="pausado"] .client-strip {
    mask-image: none;
  }
}

 
.btn--quieto {
  align-self: center;
  padding: var(--sp-3xs) var(--sp-xs);
  border: var(--linea) solid var(--c-border);
  border-radius: var(--radius-pill);
  background: transparent;
  color: var(--c-text-muted);
  font-size: var(--fs-small);
  cursor: pointer;
  transition: color var(--dur-base) var(--ease-out),
              border-color var(--dur-base) var(--ease-out);
}

.btn--quieto:hover,
.btn--quieto:focus-visible {
  color: var(--c-text);
  border-color: var(--c-text-faint);
}

.btn--quieto[aria-pressed="true"] {
  color: var(--c-text);
  border-color: var(--c-vertical-soft);
}

 
.marca-pie {
   
  min-width: 0;

  margin-top: var(--sp-2xl);
  color: var(--c-marca-pie);
}

.marca-pie__svg {
  display: block;
  width: 100%;

   
  fill: currentColor;

   
  height: auto;
  aspect-ratio: var(--ratio-marca-wordmark);
}

 
.marca-pie[data-variante="lockup"] .marca-pie__svg {
  aspect-ratio: var(--ratio-marca-lockup);
}

.marca-pie[data-variante="completo"] .marca-pie__svg {
  aspect-ratio: var(--ratio-marca-completo);
}

 
.marca-pie__iso-disco { fill: var(--c-marca-iso-disco); }
.marca-pie__iso-lente { fill: var(--c-marca-iso-lente); }
.marca-pie__iso-pupila { fill: var(--c-marca-iso-pupila); }

 
.marca-pie[data-variante="lockup"] {
  --c-marca-iso-disco: var(--c-marca-pie);
  --c-marca-iso-lente: var(--c-bg-elev);
  --c-marca-iso-pupila: var(--c-marca-pie);
}

 

.client-strip__item {
  display: flex;
  align-items: center;
  white-space: nowrap;

   
  cursor: default;
  user-select: none;

   
  font-size: var(--fs-small);
  font-weight: var(--fw-medium);
  letter-spacing: 0.01em;
  color: var(--c-text-faint);

   
  transition: color var(--dur-apagar) var(--ease-color),
              filter var(--dur-apagar) var(--ease-color);
}

 
.client-strip__item img {
  filter: grayscale(1);

   
  transition: filter var(--dur-apagar) var(--ease-color);
}

 
 
.client-strip__item[data-logo="color"] img {
   
  filter: grayscale(1) var(--logo-tint);
  transition: filter var(--dur-apagar) var(--ease-color);
}

 
.client-strip__item[data-logo="gris"] img {
  filter: grayscale(1);
  transition: filter var(--dur-apagar) var(--ease-color);
}

 

 
.client-strip__item[data-logo="blanco"] img {
  filter: brightness(0) invert(1);
}

 
 
.client-strip__item img,
.client-strip__item img[width][height] {
   
  width: calc(var(--logo-w) * var(--logo-k, 1));
  height: calc(var(--logo-h) * var(--logo-k, 1));
  object-fit: contain;

   
  max-width: none;
}

 
.client-strip__item:hover {
   
  color: var(--c-text);

   
  transition-duration: var(--dur-encender);
}

 
 
.client-strip__item[data-logo="color"]:hover img {
  filter: grayscale(0) contrast(1) brightness(1);

   
  transition-duration: var(--dur-encender);
}

 
.client-strip__item[data-logo="gris"]:hover img {
  filter: grayscale(0);
  transition-duration: var(--dur-encender);
}

 
.client-strip__item:where(:hover) img {
  filter: grayscale(0);

   
  transition-duration: var(--dur-encender);
}

 
 
@media (prefers-reduced-motion: reduce) {
  .client-strip {
     
    overflow-x: auto;
    overflow-y: hidden;

     
    mask-image: none;
  }

  .client-strip__track {
    animation: none;
    padding-right: 0;
  }
}

 

 
.search-form {
  display: flex;
  gap: var(--sp-2xs);
  max-width: var(--measure-form);
}

.search-form label {
  flex: 1;
  min-width: 0;
}

 

.search-field {
  width: 100%;
  min-height: var(--control-h);
  padding: var(--sp-2xs) var(--sp-xs);
  border: var(--linea) solid var(--c-border);
  border-radius: var(--radius-s);
  background: var(--c-surface);
  color: var(--c-text);
  font: inherit;
  font-size: var(--fs-small);
  transition: border-color var(--dur-fast) var(--ease-out);
}

.search-field::placeholder {
  color: var(--c-text-faint);
}

 
.search-field:hover {
  border-color: var(--c-text-faint);
}

 

 
.stats-card {
  border: var(--linea) solid var(--c-border);
  border-radius: var(--radius-l);
}

 
@media (min-width: 640px) {
  .stats-card { --linegrid-cols: 2; }

   
  .stat:nth-child(odd):last-child { grid-column: 1 / -1; }
}

 
@media (min-width: 1200px) {
  .stats-card { --linegrid-cols: 4; }

   
  .stat:nth-child(odd):last-child { grid-column: auto; }
  .stats-card:has(.stat:nth-child(6):last-child) { --linegrid-cols: 3; }
  .stats-card:has(.stat:nth-child(5):last-child) { --linegrid-cols: 5; }
  .stats-card:has(.stat:nth-child(3):last-child) { --linegrid-cols: 3; }
  .stats-card:has(.stat:nth-child(2):last-child) { --linegrid-cols: 2; }
  .stats-card:has(.stat:only-child) { --linegrid-cols: 1; }
}

.stat {
  display: flex;
  flex-direction: column;
  gap: var(--sp-xs);
  padding: var(--sp-l) var(--sp-m);
}

 
.stat__icon {
  width: 32px;
  height: 32px;

   
  color: var(--c-vertical);
  stroke-width: 2;
}

.stat__value {
  font-size: var(--fs-metric);
  font-weight: var(--fw-bold);
  line-height: 1;
  letter-spacing: var(--tracking-tighter);
  font-variant-numeric: tabular-nums;
  min-height: 1em;
}

.stat__text {
  font-size: var(--fs-small);
  color: var(--c-text-muted);
  line-height: 1.5;
}

 
.stat__source {
  margin-top: auto;
  padding-top: var(--sp-s);
}

 
.stats-note {
  position: relative;
  max-width: 48ch;
  margin-top: var(--sp-xl);
  padding-top: var(--sp-m);
  color: var(--c-text);
  font-size: var(--fs-lead);
  font-weight: var(--fw-medium);
  line-height: var(--lh-medio);
}

 
.stats-note::before {
  content: "";
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  width: var(--sp-l);
  height: var(--linea-fuerte);
  background: var(--c-vertical);
}

 

.vertical-card {
   
  --c-vertical: var(--c-vertical-neutral);
  --c-vertical-soft: var(--c-vertical-neutral-soft);

   
  container-type: inline-size;
  container-name: vcard;

  position: relative;
  display: grid;
  border: var(--linea) solid var(--c-border-soft);
  border-top: 3px solid var(--c-vertical);
  border-radius: var(--radius-m);
  background: var(--c-surface);
  overflow: hidden;
  transition: translate var(--dur-base) var(--ease-out),
              box-shadow var(--dur-base) var(--ease-out),
              border-color var(--dur-base) var(--ease-out);
}

 
.vertical-card,
.case-card,
.post-card,
.solution,
.feature {
  box-shadow: var(--luz-caja);
}
 

 
.vertical-card:hover,
.vertical-card:focus-within,
.case-card:hover,
.case-card:focus-within,
.post-card:hover,
.post-card:focus-within {
   
  translate: 0 calc(-1 * var(--tarjeta-elev));
  border-color: color-mix(in srgb, var(--c-vertical) 45%, var(--c-border));

   
  box-shadow: var(--luz-caja),
              var(--shadow-card),
              0 0 22px color-mix(in srgb, var(--c-vertical) 28%, transparent);
}

 
.vertical-card:hover,
.vertical-card:focus-within { border-top-color: var(--c-vertical-soft); }

 
@media (prefers-reduced-motion: reduce) {
  .vertical-card:hover,
  .vertical-card:focus-within,
  .case-card:hover,
  .case-card:focus-within,
  .post-card:hover,
  .post-card:focus-within { translate: none; }
}

 
.vertical-card__media::before,
.case-card__media::before,
.post-card__media::before {
  content: "";
  position: absolute;
  inset: 0;

   
  pointer-events: none;

  transition: scale var(--dur-base) var(--ease-out);
}

 
.vertical-card__media::before {
  background: radial-gradient(60% 60% at 60% 45%, color-mix(in srgb, var(--c-vertical) 22%, transparent), transparent 70%);
}

.case-card__media::before {
  background: radial-gradient(70% 70% at 50% 40%, color-mix(in srgb, var(--c-vertical) 14%, transparent), transparent 72%);
}

.post-card__media::before {
  background: radial-gradient(60% 60% at 50% 45%, color-mix(in srgb, var(--c-vertical) 16%, transparent), transparent 70%);
}

 
.vertical-card:hover .vertical-card__media::before,
.vertical-card:focus-within .vertical-card__media::before,
.case-card:hover .case-card__media::before,
.case-card:focus-within .case-card__media::before,
.post-card:hover .post-card__media::before,
.post-card:focus-within .post-card__media::before {
  scale: var(--luz-zoom);
}

 
.vertical-card__media > img,
.vertical-card__media > video,
.case-card__media img,
.post-card__media img,
.solution__media img {
  transition: transform var(--dur-slow) var(--ease-out);
}

 
.vertical-card:hover .vertical-card__media > img,
.vertical-card:focus-within .vertical-card__media > img,
.vertical-card:hover .vertical-card__media > video,
.vertical-card:focus-within .vertical-card__media > video,
.case-card:hover .case-card__media img,
.case-card:focus-within .case-card__media img,
.post-card:hover .post-card__media img,
.post-card:focus-within .post-card__media img,
.solution:hover .solution__media img,
.solution:focus-within .solution__media img {
  transform: scale(var(--media-zoom));
}

 

.vertical-card[data-vertical="farma"] {
  --c-vertical: var(--c-farma);
  --c-vertical-soft: var(--c-farma-soft);
}

.vertical-card[data-vertical="capacitacion"] {
  --c-vertical: var(--c-capacitacion);
  --c-vertical-soft: var(--c-capacitacion-soft);
}

.vertical-card[data-vertical="ecommerce"] {
  --c-vertical: var(--c-ecommerce);
  --c-vertical-soft: var(--c-ecommerce-soft);
}

.vertical-card[data-vertical="marketing"] {
  --c-vertical: var(--c-marketing);
  --c-vertical-soft: var(--c-marketing-soft);
}

 
.grid:has(> .vertical-card) {
  container-type: inline-size;
  container-name: vcards;
}

@container vcards (min-width: 848px) {
  .vertical-card {
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.85fr);
    min-height: 420px;
  }
}

.vertical-card__body {
   
  padding: clamp(var(--sp-m), 3.8cqw, var(--sp-xl));
  display: flex;
  flex-direction: column;

   
  gap: var(--sp-xs);
}

 

 
 
.vertical-card__label {
  margin-bottom: var(--sp-3xs);
}

.vertical-card__title {
  font-size: var(--fs-h3);
  color: var(--c-text);
}

.vertical-card__title a {
  color: var(--c-text);
  text-decoration: none;
}

 
.vertical-card__title a::after {
  content: "";
  position: absolute;
  inset: 0;
}

.vertical-card__text {
  color: var(--c-text-muted);
  max-width: 52ch;

   
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  line-clamp: 4;
  overflow: hidden;
}

 
.vertical-card__link { margin-top: auto; padding-top: var(--sp-2xs); }

 
 
.vertical-card__media {
  position: relative;

  width: 100%;
  aspect-ratio: 3 / 2;

   
  min-height: 0;

   
  background: var(--c-surface-2);

   
  overflow: clip;

  display: grid;
  place-items: center;
}

 
@container vcards (min-width: 848px) {
  .vertical-card__media {
    aspect-ratio: auto;
     
    min-height: 220px;
  }
}

 
.vertical-card__media > video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

 
.vertical-card__media > img,
.vertical-card__media > img[width][height] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  max-width: none;
}

 
 
.media-hint {
  position: relative;

  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  color: var(--c-text-muted);
  padding: var(--sp-s);
  text-align: center;
  max-width: 100%;
  overflow-wrap: anywhere;
}

 

.marquee {
  --marquee-duration: 34s;

   
  --marquee-gap: clamp(var(--sp-m), 3vw, var(--sp-xl));

  position: relative;
  display: flex;
  overflow: hidden;
  padding-block: clamp(var(--sp-s), 2vw, var(--sp-m));
  border-block: var(--linea) solid var(--c-border-soft);
}

.marquee__track {
  display: flex;
  flex-shrink: 0;
  align-items: baseline;
  gap: var(--marquee-gap);
  padding-right: var(--marquee-gap);
  animation: marquee-scroll var(--marquee-duration) linear infinite;
}

 
.marquee.is-offscreen .marquee__track {
  animation-play-state: paused;
}

.marquee__item {
   
  --c-vertical: var(--c-primary);
  --c-vertical-soft: var(--c-accent);
  font-size: var(--fs-display-l);
  font-weight: var(--fw-bold);
  letter-spacing: var(--tracking-tight);
  line-height: 1.05;
  color: var(--c-vertical-soft);
  white-space: nowrap;
  text-decoration: none;
  transition: color var(--dur-fast) var(--ease-out),
              -webkit-text-stroke-color var(--dur-fast) var(--ease-out);
}

.marquee__item[data-vertical="farma"] {
  --c-vertical: var(--c-farma);
  --c-vertical-soft: var(--c-farma-soft);
}

.marquee__item[data-vertical="capacitacion"] {
  --c-vertical: var(--c-capacitacion);
  --c-vertical-soft: var(--c-capacitacion-soft);
}

.marquee__item[data-vertical="ecommerce"] {
  --c-vertical: var(--c-ecommerce);
  --c-vertical-soft: var(--c-ecommerce-soft);
}

.marquee__item[data-vertical="marketing"] {
  --c-vertical: var(--c-marketing);
  --c-vertical-soft: var(--c-marketing-soft);
}

 
.marquee__item:nth-child(even) {
  color: transparent;
  -webkit-text-stroke: 2px var(--c-vertical-soft);
}

 
a.marquee__item:hover,
a.marquee__item:focus-visible {
  color: color-mix(in srgb, var(--c-vertical-soft) 60%, var(--c-text));
}

a.marquee__item:nth-child(even):hover,
a.marquee__item:nth-child(even):focus-visible {
  color: var(--c-vertical-soft);
  -webkit-text-stroke-color: transparent;
}

 
@media (forced-colors: active) {
  .marquee__item:nth-child(even) {
    -webkit-text-stroke-color: currentColor;
  }
}

@keyframes marquee-scroll {
  to { transform: translate3d(-100%, 0, 0); }
}

 
@media (prefers-reduced-motion: reduce) {
  .marquee { overflow: visible; }

  .marquee__track {
    animation: none;
    flex-wrap: wrap;
    flex-shrink: 1;
    min-width: 0;
    justify-content: center;
    row-gap: var(--sp-2xs);
    padding-right: 0;
  }
}

 

 

.feature-list {
  display: grid;

   
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 28rem), 1fr));

  gap: var(--sp-s);
  margin: 0;
  padding: 0;
  list-style: none;
}

.feature {
  display: grid;

   
  grid-template-columns: 1fr;
  gap: 0;
  align-items: start;
  padding: var(--sp-m);
  background: var(--c-surface);
  border: var(--linea) solid var(--c-border-soft);

   
  border-top: 3px solid var(--c-vertical);

  border-radius: var(--radius-m);
  color: var(--c-text-muted);
}

 
.feature:hover {
  border-color: color-mix(in srgb, var(--c-vertical) 45%, var(--c-border));
  border-top-color: var(--c-vertical-soft);
}

 
.feature__title {
  margin: 0 0 var(--sp-2xs);
  min-width: 0;
  font-size: var(--fs-card);
  font-weight: var(--fw-semibold);
  line-height: var(--lh-heading);
  letter-spacing: -0.01em;
  color: var(--c-text);
  text-wrap: balance;
  overflow-wrap: anywhere;
}

 
.feature__desc {
  margin: 0;
  min-width: 0;
  max-width: var(--measure);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--c-text-muted);
  overflow-wrap: anywhere;
}

 
@media (min-width: 640px) {
  .feature__title { min-height: calc(2em * var(--lh-heading)); }
}

@supports (grid-template-rows: subgrid) {
  @media (min-width: 640px) {
    .feature {
      grid-row: span 2;
      grid-template-rows: subgrid;
    }

    .feature__title { min-height: 0; margin-bottom: 0; }
  }
}

 
.vertical-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 28rem), 1fr));
  gap: var(--sp-s);
  margin: 0;
  padding: 0;
  list-style: none;
}

 
.vertical-list__item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--sp-xs);
  min-width: 0;
  padding: var(--sp-m);
  background: var(--c-surface);
  border: var(--linea) solid var(--c-border-soft);
  border-radius: var(--radius-m);
}

 
.vertical-list__text {
  margin: 0;
  min-width: 0;
  max-width: var(--measure);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--c-text-muted);
  overflow-wrap: anywhere;
}

 
.vertical-list__label {
  color: var(--c-text);
  font-weight: var(--fw-semibold);
}

 
.vertical-list__link {
  margin-top: auto;
}

 

.testimonial {
   
  --testimonial-medida: 53rem;    
  max-width: var(--testimonial-medida);
  min-width: 0;
}

 
.testimonial__label {
   
  margin-bottom: var(--sp-2xs);
}

 
.testimonial__title {
  font-size: var(--fs-h1);
  letter-spacing: var(--tracking-tight);
  margin-bottom: var(--sp-m);
  max-width: 22ch;
}

 
.testimonial__quote {
  font-size: var(--fs-h3);
  font-weight: var(--fw-regular);
  line-height: var(--lh-snug);
  letter-spacing: var(--tracking-soft);

   
  overflow-wrap: anywhere;
}

 
.testimonial__quote::before {
  content: "\201C" / "";
  display: block;
  font-size: var(--fs-display);
  line-height: 0.62;
  font-weight: var(--fw-bold);
  color: var(--c-vertical);

   
  opacity: 0.55;
}

 
.testimonial__author {
  display: flex;
  align-items: center;
  gap: var(--sp-m);

   
  margin-top: var(--sp-2xl);
  font-size: var(--fs-body);
  color: var(--c-text-muted);
  font-style: normal;

   
  min-width: 0;
}

 
.testimonial__photo {
   
  --testimonial-foto: 72px;
  width: var(--testimonial-foto);
  height: var(--testimonial-foto);
  flex-shrink: 0;
  border-radius: var(--radius-pill);
  object-fit: cover;
   
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--c-vertical) 70%, transparent);
}

.testimonial__name {
  display: block;
  color: var(--c-text);
  font-weight: var(--fw-semibold);

   
  font-size: var(--fs-lead);
}

.testimonial__role {
  display: block;

   
  color: var(--c-text-muted);
   
  overflow-wrap: anywhere;
}

.testimonial[data-placeholder="true"] .testimonial__quote::after {
  content: " · texto pendiente de confirmación";
  color: var(--c-text-mono);
  font-size: var(--fs-small);
  font-weight: var(--fw-regular);
}

 
@media (min-width: 768px) {
  .testimonial__photo {
    --testimonial-foto: 96px;
  }
}

 

.testimonios {
  display: grid;
  gap: var(--sp-m);
}

.testimonios__pista {
  display: flex;
  gap: var(--sp-m);
  overflow-x: auto;
   
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
   
  overscroll-behavior-x: contain;
}

 
html.js .testimonios__pista { scrollbar-width: none; }
html.js .testimonios__pista::-webkit-scrollbar { display: none; }

.testimonios__cita {
   
  flex: 0 0 100%;
   
  min-width: 0;
  scroll-snap-align: start;
   
  scroll-snap-stop: always;

   
  display: flex;
  flex-direction: column;
}

 
.testimonios__cita .testimonial__author {
  margin-top: auto;
  padding-top: var(--sp-m);
}

 
.testimonios__cita { max-width: none; }
.testimonios__cita .testimonial__quote { max-width: var(--testimonial-medida); }

 
.testimonios__cita .testimonial__quote { margin-bottom: 0; }

.testimonios__controles {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-s);
   
  flex-wrap: wrap;
}

 
.testimonios__controles[hidden] { display: none; }

.testimonios__puntos {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-3xs);
}

 
.testimonios__punto {
  --punto: var(--sp-2xs);

  width: var(--tap-target-min);
  height: var(--tap-target-min);
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  background: none;
  border-radius: var(--radius-pill);
  cursor: pointer;
}

.testimonios__punto::after {
  content: "";
  width: var(--punto);
  height: var(--punto);
  border-radius: var(--radius-pill);
  background: var(--c-text-faint);
  transition: width var(--dur-hover) var(--ease-out),
              background-color var(--dur-hover) var(--ease-out);
}

 
.testimonios__punto[aria-current="true"]::after {
  width: calc(var(--punto) * 2);
  background: var(--c-vertical-soft);
}

 
.testimonios__punto:not([aria-current="true"]):hover::after { background: var(--c-text); }

.testimonios__flechas {
  display: flex;
  gap: var(--sp-2xs);
}

.testimonios__flecha {
   
  width: var(--control-h);
  height: var(--control-h);
  display: grid;
  place-items: center;
  padding: 0;
   
  border: var(--linea) solid var(--c-border);
  border-radius: var(--radius-pill);
  background: transparent;
  color: var(--c-text);
  cursor: pointer;
  transition: border-color var(--dur-hover) var(--ease-out),
              color var(--dur-hover) var(--ease-out);
}

 
.testimonios__flecha svg {
  width: 16px;
  height: 16px;
  transition: translate var(--dur-hover) var(--ease-out);
}

 
.testimonios__flecha--atras svg { scale: -1 1; }

.testimonios__flecha:hover,
.testimonios__flecha:focus-visible {
  border-color: var(--c-vertical-soft);
  color: var(--c-vertical-soft);
}

 
.testimonios__flecha:hover svg,
.testimonios__flecha:focus-visible svg { translate: 4px 0; }

.testimonios__flecha--atras:hover svg,
.testimonios__flecha--atras:focus-visible svg { translate: -4px 0; }

 
.testimonios__flecha[aria-disabled="true"] {
  color: var(--c-text-faint);
  border-color: var(--c-border-soft);
  cursor: default;
}

.testimonios__flecha[aria-disabled="true"]:hover {
  border-color: var(--c-border-soft);
  color: var(--c-text-faint);
}

 
.testimonios__flecha[aria-disabled="true"]:hover svg,
.testimonios__flecha[aria-disabled="true"]:focus-visible svg { translate: none; }

 
@media (prefers-reduced-motion: no-preference) {
  .testimonios__cita.es-nueva { animation: testimonio-llega var(--dur-base) var(--ease-out) backwards; }
}

 
@media (prefers-reduced-motion: reduce) {
  .testimonios__cita.es-nueva { animation: testimonio-llega var(--dur-base) var(--ease-out) backwards; }
}

 

@keyframes testimonio-llega {
  from { opacity: 0.35; }
  to   { opacity: 1; }
}

 

.faq { display: grid; gap: var(--sp-2xs); }

.faq__item {
   
  --faq-dur-open: var(--dur-base);
  --faq-dur-close: calc(var(--dur-base) * 0.7);

  border: var(--linea) solid var(--c-border-soft);
  border-radius: var(--radius-m);
  background: var(--c-surface);
}

.faq__item summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-s);
  padding: var(--sp-s) var(--sp-m);
  font-weight: var(--fw-medium);
  cursor: pointer;
  list-style: none;
   
  transition:
    background var(--dur-fast) var(--ease-out),
    border-radius var(--dur-fast) var(--ease-out);
}

.faq__item summary::-webkit-details-marker { display: none; }

.faq__item:hover { border-color: color-mix(in srgb, var(--c-vertical) 45%, var(--c-border)); }
.faq__item summary:hover { background: var(--c-surface-2); }

 
.faq__item summary { border-radius: calc(var(--radius-m) - 1px); }

.faq__item[open] summary {
  border-radius: calc(var(--radius-m) - 1px) calc(var(--radius-m) - 1px) 0 0;
}

.faq__item summary::after {
  content: "";
  width: 10px;
  height: 10px;
  border-right: 2px solid var(--c-vertical-soft);
  border-bottom: 2px solid var(--c-vertical-soft);
  transform: rotate(45deg);
   
  transition: transform var(--faq-dur-close) var(--ease-out);
  flex-shrink: 0;
}

.faq__item[open] summary::after {
  transform: rotate(-135deg);
  transition-duration: var(--faq-dur-open);
}

.faq__answer {
  padding: 0 var(--sp-m) var(--sp-m);
  color: var(--c-text-muted);
}

 
.faq__answer p,
.faq__answer li { max-width: var(--measure); }

 
@supports selector(::details-content) {

  .faq__item::details-content {
    display: grid;
    grid-template-rows: 0fr;
     
    overflow: clip;
    opacity: 0;
    transition:
      grid-template-rows var(--faq-dur-close) var(--ease-out),
      opacity var(--faq-dur-close) var(--ease-out),
      content-visibility var(--faq-dur-close) allow-discrete;
  }

  .faq__item[open]::details-content {
    grid-template-rows: 1fr;
    opacity: 1;
     
    transition:
      grid-template-rows var(--faq-dur-open) var(--ease-out),
      opacity calc(var(--faq-dur-open) * 0.6) var(--ease-out),
      content-visibility var(--faq-dur-open) allow-discrete;
  }

   
  .faq__answer { min-height: 0; }

   
  @media (prefers-reduced-motion: reduce) {
    .faq__item::details-content,
    .faq__item[open]::details-content { transition: none; }
  }
}

 
@media (prefers-reduced-motion: reduce) {
  .faq__item summary { transition: background var(--dur-fast) var(--ease-out); }
}

 

.cta-block {
  display: grid;
  gap: var(--sp-xl);
}

.cta-block__head {
  display: grid;
  gap: var(--sp-s);
  justify-items: center;
  text-align: center;

   
  min-width: 0;
}

.cta-block__head .lead { max-width: 60ch; }

 

.cta-block__grid {
  display: grid;
  gap: var(--sp-m);
}

@media (min-width: 900px) {
  .cta-block__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.cta-card {
  display: flex;
  flex-direction: column;
  gap: var(--sp-s);
  min-width: 0;
  padding: var(--sp-l);
  background: var(--c-surface);
  border: var(--linea) solid var(--c-border);
  border-radius: var(--radius-l);
}

.cta-card__title {
  display: flex;
  align-items: center;
  gap: var(--sp-2xs);
  font-size: var(--fs-card);
  min-width: 0;
  overflow-wrap: anywhere;
}

.cta-card__icon {
  width: 22px;
  height: 22px;
  flex-shrink: 0;
  color: var(--c-accent);
}

.cta-card__sub {
  font-size: var(--fs-small);
  color: var(--c-text-muted);
}

 
.cta-card__embed {
  display: grid;
  place-items: center;

   
  min-height: calc(
    var(--cal-alto) + 2 * var(--panel-inset) +
    var(--panel-linea) + var(--panel-linea-acento)
  );
  margin-top: auto;
  border: var(--linea) solid var(--c-border-soft);
  border-radius: var(--radius-m);
  background: var(--c-bg-elev);
  overflow: hidden;
}

 
.cta-card__embed:has(iframe),
.cta-form__embed:has(iframe.hs-form-iframe) {
  display: block;
  padding: var(--panel-inset);
  border: var(--panel-linea) solid var(--c-panel-line);

   
  border-top: var(--panel-linea-acento) solid var(--c-vertical);
  border-radius: var(--radius-m);
  background: var(--c-panel);
  box-shadow: var(--shadow-card);
}

 
.cta-card__embed:has(iframe) {
  background: var(--c-bg-elev);
  border-color: var(--c-border-soft);
  border-top-color: var(--c-vertical);
}

 
.cta-card__embed iframe,
.cta-form__embed iframe.hs-form-iframe {
  border-radius: calc(var(--radius-m) - 1px);

   
  display: block;
}

 
.cta-card__embed .meetings-iframe-container {
  width: 100%;
}

.cta-card__embed:has(iframe) {
   
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;

   
  overflow-x: auto;
  overscroll-behavior-x: contain;
}

 
.cta-card__embed[tabindex]:focus-visible {
  border-radius: var(--radius-m);
}

 
@media (max-width: 420px) {
  .cta-card { padding: var(--sp-m); }
}

.cta-card__embed iframe { width: 100%; border: 0; }

.cta-card__fallback {
  display: grid;
  gap: var(--sp-s);
  justify-items: center;
  padding: var(--sp-m);
  color: var(--c-text-muted);
  font-size: var(--fs-small);
  text-align: center;

   
  max-width: 100%;
  min-width: 0;
}

 
.cta-card__fallback .btn {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}

 
.cta-form__panel {
  display: flex;
  flex-direction: column;
  gap: var(--sp-s);
  min-width: 0;
}

 
.cta-form__panel {
  flex: 1;
  justify-content: center;
}

 
.cta-form__embed[data-hubspot-form] {
  min-height: calc(
    var(--cta-form-alto, 794px) + 2 * var(--panel-inset) +
    var(--panel-linea) + var(--panel-linea-acento)
  );
}

 
@container cta-form (min-width: 442px) {
  .cta-form__embed[data-hubspot-form] {
    min-height: calc(
      var(--cta-form-alto-md, 610px) + 2 * var(--panel-inset) +
      var(--panel-linea) + var(--panel-linea-acento)
    );
  }
}

@container cta-form (min-width: 482px) {
  .cta-form__embed[data-hubspot-form] {
    min-height: calc(
      var(--cta-form-alto-lg, 590px) + 2 * var(--panel-inset) +
      var(--panel-linea) + var(--panel-linea-acento)
    );
  }
}

 
.cta-form__fallback {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--sp-s);
  padding: var(--sp-m);
  border: 1px dashed var(--c-border);
  border-radius: var(--radius-m);

   
  background: var(--c-surface);
  color: var(--c-text-muted);
  font-size: var(--fs-small);
}

 

 
.video-facade {
  position: relative;
  aspect-ratio: 16 / 9;
  width: 100%;
}

.video-facade__trigger {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  padding: 0;
  border-radius: var(--radius-m);
  overflow: hidden;
  background: var(--c-surface);
  cursor: pointer;
}

 
.video-facade img,
.video-facade img[width][height] { width: 100%; height: 100%; max-width: none; object-fit: cover; }

.video-facade__play { position: absolute; inset: 0; display: grid; place-items: center; }

.video-facade__play span {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--c-primary) 90%, transparent);
  color: var(--c-on-primary);
  transition: transform var(--dur-base) var(--ease-out);
}

.video-facade:hover .video-facade__play span { transform: scale(1.08); }

 
@media (prefers-reduced-motion: reduce) {
  .video-facade:hover .video-facade__play span { transform: none; }
}

.video-facade iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;

   
  border-radius: var(--radius-m);
}

 

.post-card {
  --c-vertical: var(--c-primary);
  --c-vertical-soft: var(--c-accent);
  position: relative;
  display: flex;
  flex-direction: column;
  color: var(--c-text);
  background: var(--c-surface);
  border: var(--linea) solid var(--c-border-soft);
  border-radius: var(--radius-m);
  overflow: hidden;
  text-decoration: none;
  transition: translate var(--dur-base) var(--ease-out),
              border-color var(--dur-base) var(--ease-out),
              box-shadow var(--dur-base) var(--ease-out);
}

 
.post-card:hover,
.post-card:focus-within { color: var(--c-text); }

.post-card__media {
  aspect-ratio: 4 / 3;
  position: relative;
  display: grid;
  place-items: center;

   
  background: var(--c-surface-2);

   
  overflow: clip;
}

 
.post-card__media img,
.post-card__media img[width][height] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;

   
  max-width: none;
}

.post-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2xs);
  padding: var(--sp-m);
}

.post-card__title { font-size: var(--fs-card); }

.post-card__text {
  font-size: var(--fs-small);
  color: var(--c-text-muted);

   
  max-width: 56ch;
}

 

.chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2xs);
  margin-bottom: var(--sp-xl);
}

.chip {
  --c-vertical: var(--c-primary);
  --c-vertical-soft: var(--c-accent);
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: var(--sp-3xs) var(--sp-s);
  border: var(--linea) solid var(--c-border);
  border-radius: var(--radius-pill);
  font-size: var(--fs-small);
  color: var(--c-text-muted);
  text-decoration: none;
  transition: color var(--dur-fast) var(--ease-out),
              border-color var(--dur-fast) var(--ease-out),
              background var(--dur-fast) var(--ease-out);
}

 
@media (pointer: coarse) {
  .chip { min-height: var(--control-h); }
}

.chip:hover {
  color: var(--c-vertical-soft);
  border-color: color-mix(in srgb, var(--c-vertical) 55%, var(--c-border));
}

 
.chip[aria-current="page"] {
  background: color-mix(in srgb, var(--c-vertical) 18%, var(--c-bg));
  border-color: var(--c-vertical-soft);
  color: var(--c-vertical-soft);
  font-weight: var(--fw-semibold);
}

 

.prose > * + * { margin-top: var(--sp-s); }
.prose h2 { margin-top: var(--sp-xl); }
.prose h3 { margin-top: var(--sp-l); }
.prose p, .prose li { color: var(--c-text-muted); }
.prose img { border-radius: var(--radius-m); margin-block: var(--sp-l); }

.prose blockquote {
  margin: var(--sp-l) 0;
  padding-left: var(--sp-m);
  border-left: 2px solid var(--c-vertical);
  font-size: var(--fs-card);
  color: var(--c-text);
}

 
.privacidad-pendiente {
  padding: var(--sp-m);
  border: var(--linea) solid var(--c-border);
  border-radius: var(--radius-m);
  background: var(--c-surface-2);
}

.privacidad-pendiente p {
  color: var(--c-text);
}

 

 

.hero__eyebrow { margin-bottom: var(--sp-s); }


 

.stats-card--plain .stat { gap: var(--sp-2xs); }

 
.stat__rule,
.metric__rule {
  width: 32px;
  height: 3px;
  border-radius: var(--radius-pill);
  background: var(--c-vertical-soft);
  margin-bottom: var(--sp-2xs);
}

.stats-card--plain .stat__text {
  font-size: var(--fs-body);
  color: var(--c-text-muted);
}

 

.split {
  display: grid;
  gap: var(--sp-xl);
}

.split__copy,
.split__media { min-width: 0; }

.split__title {
  font-size: var(--fs-h1);
  letter-spacing: var(--tracking-tight);
  margin-bottom: var(--sp-m);
}

.split__text { color: var(--c-text-muted); }
.split__text p + p { margin-top: var(--sp-s); }

.split__media img {
  width: 100%;

   
  aspect-ratio: 3 / 2;
  object-fit: cover;
  border-radius: var(--radius-l);
  border: var(--linea) solid var(--c-border-soft);
}

@media (min-width: 900px) {
  .split {
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
    gap: var(--sp-2xl);
    align-items: center;
  }
}

 

.philosophy { max-width: min(100%, 46rem); }

.philosophy__title {
  font-size: var(--fs-h1);
  letter-spacing: var(--tracking-tight);
  margin-bottom: var(--sp-m);
}

.philosophy__text {
   
  font-size: var(--fs-card);
  color: var(--c-text-muted);
}

 

.process {
  display: grid;
  gap: var(--sp-m);
  margin: 0;
  padding: 0;
  list-style: none;
}

 
.process__step {
  position: relative;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--sp-2xs);
  padding-top: var(--sp-m);

   
  border-top: 2px solid color-mix(in srgb, var(--c-vertical) 30%, transparent);
}

 
.process__step::before {
  content: "";
  position: absolute;

   
  top: -2px;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--c-vertical);
  transform-origin: left center;
  pointer-events: none;
}

@media (prefers-reduced-motion: no-preference) {
  html.js .process__step::before {
    transform: scaleX(0);
    animation: proceso-avanza var(--dur-slow) var(--ease-out) forwards;

     
    animation-play-state: paused;
  }

  html.js .process__step.is-visible::before {
    animation-play-state: running;

     
    animation-delay: calc(var(--reveal-paso, 0) * var(--stagger) + var(--dur-slow));
  }
}

 
@keyframes proceso-avanza {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}

 
.process__marker {
  display: grid;
  place-items: center;

   
  width: clamp(2rem, 1.4rem + 2vw, 3rem);
  height: clamp(2rem, 1.4rem + 2vw, 3rem);
  border-radius: 50%;
  background: color-mix(in srgb, var(--c-vertical) 16%, transparent);
}

.process__marker::before {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--c-vertical-soft);
}

.process__title {
  font-size: var(--fs-card);
  color: var(--c-text);
}

.process__text {
  color: var(--c-text-muted);
  font-size: var(--fs-small);
}

 
@media (min-width: 640px) {
  .process { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-l); }

  .process__step:nth-child(odd):last-child { grid-column: 1 / -1; }

   
  .process__title { min-height: calc(2em * var(--lh-heading)); }
}

@media (min-width: 900px) {
  .process { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .process:has(.process__step:nth-child(3):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .process:has(.process__step:nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .process:has(.process__step:only-child) { grid-template-columns: minmax(0, 1fr); }

  .process__step:nth-child(odd):last-child { grid-column: auto; }
}

 

.case-card {
  --c-vertical: var(--c-primary);
  --c-vertical-soft: var(--c-accent);
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  background: var(--c-surface);
  border: var(--linea) solid var(--c-border-soft);
  border-radius: var(--radius-m);
  transition: translate var(--dur-base) var(--ease-out),
              border-color var(--dur-base) var(--ease-out),
              box-shadow var(--dur-base) var(--ease-out);
}

 
.case-card__media {
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  border-radius: calc(var(--radius-m) - 1px) calc(var(--radius-m) - 1px) 0 0;

   
  background: var(--c-surface-2);
}

.case-card__media img,
.case-card__media img[width][height] {
   
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

 

.case-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2xs);
  min-width: 0;
  padding: var(--sp-m);
}

 
.case-card__tag {
  min-height: calc(2 * var(--fs-eyebrow) * 1.3);
}

.case-card__title {
  font-size: var(--fs-card);

   
  min-height: calc(2em * var(--lh-heading));
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
}

.case-card__title a {
  color: var(--c-text);
  text-decoration: none;
}

 
.case-card__title a::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
}

.case-card__title a:hover { color: var(--c-vertical-soft); }

.case-card__text {
  color: var(--c-text-muted);
  font-size: var(--fs-small);

   
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;

   
  overflow-wrap: anywhere;
}

@media (prefers-reduced-motion: reduce) {
  .case-card:hover,
  .case-card:focus-within { transform: none; }
  .case-card:hover .case-card__media img,
  .case-card:focus-within .case-card__media img { transform: none; }
}

 
.tag-pill {
  display: inline-flex;
  align-items: center;

   
  min-height: 32px;
  padding: var(--sp-3xs) var(--sp-s);
  border: var(--linea) solid color-mix(in srgb, var(--c-vertical) 55%, var(--c-border));
  border-radius: var(--radius-pill);
  text-decoration: none;
  transition: background var(--dur-fast) var(--ease-out),
              border-color var(--dur-fast) var(--ease-out);
}

@media (pointer: coarse) {
  .tag-pill { min-height: var(--control-h); }
}

a.tag-pill:hover {
  background: color-mix(in srgb, var(--c-vertical) 18%, var(--c-bg));
  border-color: var(--c-vertical-soft);
  color: var(--c-vertical-soft);
}

 

.article-figure {
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 16 / 9;
  border-radius: var(--radius-l);
  overflow: hidden;
  background: var(--c-surface);
  border: var(--linea) solid var(--c-border-soft);
}

.article-figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

 
.scope-note {
  margin: var(--sp-l) 0 0;
  padding-left: var(--sp-m);
  border-left: 2px solid var(--c-vertical);
  color: var(--c-text-muted);
  font-size: var(--fs-lead);

   
  max-width: var(--measure);

   
  min-width: 0;
  overflow-wrap: anywhere;
}

 

.blog-head { padding-bottom: 0; }

 
.blog-head__inner {
  margin-bottom: var(--sp-l);
}

.blog-head__title {
  font-size: var(--fs-display);
  line-height: 1.05;
  letter-spacing: var(--tracking-tighter);
  font-weight: var(--fw-bold);
  max-width: 18ch;
}

 
@media (min-width: 960px) {
  .blog-head__title { max-width: none; }
}

 
.blog-head__inner .lead { max-width: 52ch; }

 
.blog-grid { margin-top: var(--sp-l); }

 
@media (min-width: 640px) and (max-width: 899.98px) {
  .grid.blog-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

  .grid.blog-grid > * { grid-column: span 2; }

   
  .grid.blog-grid > :last-child:nth-child(2n + 1) { grid-column: 2 / span 2; }
}

 
@media (min-width: 900px) {
  .grid.blog-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }

  .grid.blog-grid > * { grid-column: span 2; }

   
  .grid.blog-grid > :last-child:nth-child(3n + 1) { grid-column: 3 / span 2; }

   
  .grid.blog-grid > :nth-last-child(2):nth-child(3n + 1) { grid-column: 2 / span 2; }
}

 

.post-card--feature { margin-bottom: var(--sp-l); }

.post-card__meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--sp-s);
  flex-wrap: wrap;
}

 
.post-card__meta .eyebrow {
  min-height: calc(var(--fs-eyebrow) * var(--lh-body));
  min-height: 1lh;
}

 
.post-card__more { margin-top: var(--sp-2xs); }

 
@media (min-width: 900px) {
  .post-card--feature {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    align-items: stretch;
  }

  .post-card--feature .post-card__media { aspect-ratio: auto; min-height: 320px; }

  .post-card--feature .post-card__body {
    justify-content: center;
    gap: var(--sp-s);
    padding: var(--sp-2xl);
  }

  .post-card--feature .post-card__title { font-size: var(--fs-feature); }

  .post-card--feature .post-card__text {
    font-size: var(--fs-body);
    max-width: 46ch;
  }
}

 

 
.article-head .tag-pill { margin-bottom: var(--sp-m); }

 
.article-head__title { letter-spacing: var(--tracking-tight); }

 
.byline {
  display: flex;
  align-items: center;
  gap: var(--sp-s);
  margin-top: var(--sp-l);
  padding-top: var(--sp-m);
  border-top: var(--linea) solid var(--c-border-soft);
  font-size: var(--fs-small);
}

.byline__avatar {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  flex-shrink: 0;
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--c-vertical) 22%, var(--c-surface));

   
  --c-vertical-ink: color-mix(in srgb, var(--c-vertical-soft) 90%, var(--c-text));
  color: var(--c-vertical-ink, var(--c-vertical-soft));

  font-weight: var(--fw-bold);
  font-size: 1.0625rem;
  line-height: 1;
}

.byline__name {
  display: block;
  color: var(--c-text);
  font-weight: var(--fw-semibold);
}

.byline__meta {
  display: block;
  color: var(--c-text-faint);
}

.byline__dot { margin-inline: var(--sp-3xs); }

 

.prose > *:first-child { margin-top: 0; }

 
.prose > p,
.prose > ul,
.prose > ol,
.prose > blockquote { max-width: var(--measure); }

 
.prose blockquote[data-instgrm-permalink],
.prose blockquote.twitter-tweet,
.prose blockquote.tiktok-embed { min-width: 0 !important; }

 
.prose img.prose__qr { width: var(--qr-lado); }

 
.prose--flush { max-width: var(--container-narrow); }

.prose a {
  color: var(--c-vertical-soft);
  text-decoration-color: color-mix(in srgb, var(--c-vertical-soft) 45%, transparent);
}

.prose a:hover {
  color: var(--c-vertical-soft);
  text-decoration-color: currentColor;
}

.prose li::marker { color: var(--c-vertical-soft); }
.prose li + li { margin-top: var(--sp-2xs); }

.prose h2 { letter-spacing: -0.02em; }

 
.prose figure { margin-block: var(--sp-l); }

.prose figure img {
  border-radius: var(--radius-m);
  margin-block: 0;
}

.prose figcaption {
  margin-top: var(--sp-2xs);
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  color: var(--c-text-mono);
}

 
.prose blockquote p:last-child { margin-bottom: 0; }

.prose blockquote cite {
  display: block;
  margin-top: var(--sp-s);
  font-size: var(--fs-small);
  font-style: normal;
  color: var(--c-text-faint);
}

 
.prose hr,
.prose .wp-block-separator {
  width: 96px;
  height: 3px;
  margin: var(--sp-2xl) auto;
  border: 0;
  border-radius: var(--radius-pill);
  background: linear-gradient(90deg, var(--c-vertical), var(--c-vertical-soft));
}

 
.prose .wp-block-video video,
.prose video {
  width: 100%;
  height: auto;
  border-radius: var(--radius-m);
  background: var(--c-surface);
}

 
.prose iframe,
.prose embed,
.prose object {
  max-width: 100%;
  width: 100%;
  aspect-ratio: 16 / 9;
  height: auto;
  border: 0;
  border-radius: var(--radius-m);
  background: var(--c-surface);
}

 
.prose .ig-embed {
  max-width: 400px;
  margin-inline: auto;
}

.prose iframe.ig-embed__frame {
  aspect-ratio: 400 / 880;
}

 
.ig-embed {
  position: relative;
}

.ig-embed__fallback {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--sp-m);
  text-align: center;
  background: var(--c-surface);
  border-radius: var(--radius-m);
  color: var(--c-vertical-soft);
  text-decoration-color: color-mix(in srgb, var(--c-vertical-soft) 45%, transparent);
}

.ig-embed__fallback:hover {
  text-decoration-color: currentColor;
}

.prose pre {
  max-width: 100%;
  overflow-x: auto;
  padding: var(--sp-m);
  background: var(--c-surface);
  border: var(--linea) solid var(--c-border-soft);
  border-radius: var(--radius-m);
  font-family: var(--font-mono);
  font-size: var(--fs-small);
}

.prose code {
  font-family: var(--font-mono);
  font-size: 0.9em;
  color: var(--c-vertical-soft);
}

.prose pre code { color: inherit; }

 
.prose table {
  display: block;
  max-width: 100%;
  overflow-x: auto;
  border-collapse: collapse;
  font-size: var(--fs-small);
}

.prose th,
.prose td {
  padding: var(--sp-2xs) var(--sp-s);
  border: var(--linea) solid var(--c-border-soft);
  text-align: left;
}

.prose th {
  background: var(--c-surface);
  color: var(--c-text);
  font-weight: var(--fw-semibold);
}

 

 

.prose .aligncenter {
  display: block;
  margin-inline: auto;
}

.prose .alignnone,
.prose .aligncenter {
  margin-block: var(--sp-l);
}

 
.prose .alignleft,
.prose .alignright {
  display: block;
  margin-inline: auto;
  margin-block: var(--sp-l);
}

@media (min-width: 640px) {
  .prose .alignleft {
    float: left;
    max-width: 50%;
    margin: var(--sp-2xs) var(--sp-m) var(--sp-s) 0;
  }

  .prose .alignright {
    float: right;
    max-width: 50%;
    margin: var(--sp-2xs) 0 var(--sp-s) var(--sp-m);
  }
}

 
.prose h2,
.prose h3,
.prose hr,
.prose .wp-block-separator {
  clear: both;
}

 
.prose::after {
  content: "";
  display: block;
  clear: both;
}

 

 
.prose .wp-caption {
  max-width: 100%;
  margin-block: var(--sp-l);
}

.prose .wp-caption img {
  width: 100%;
  height: auto;
  border-radius: var(--radius-m);
}

 
.prose .wp-caption-text {
  margin: var(--sp-2xs) 0 0;
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  color: var(--c-text-mono);
  text-align: left;
}

 

 
.prose .gallery {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--sp-s);
  margin-block: var(--sp-l);
  padding: 0;
  list-style: none;
}

.prose .gallery-columns-1 { grid-template-columns: minmax(0, 1fr); }

@media (min-width: 640px) {
  .prose .gallery-columns-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .prose .gallery-columns-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .prose .gallery-columns-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .prose .gallery-columns-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .prose .gallery-columns-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
  .prose .gallery-columns-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
  .prose .gallery-columns-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); }
}

 
.prose .gallery-item {
  min-width: 0;
  margin: 0;
  text-align: left;
}

.prose .gallery-icon { margin: 0; }

.prose .gallery-icon img {
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border: var(--linea) solid var(--c-border-soft);
  border-radius: var(--radius-s);
}

.prose .gallery-caption {
  display: block;
  margin: var(--sp-3xs) 0 0;
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  line-height: 1.4;
  color: var(--c-text-mono);
}

 

 
.has-small-font-size { font-size: var(--fs-small) !important; }
.has-body-font-size  { font-size: var(--fs-body) !important; }
.has-h-4-font-size   { font-size: var(--fs-card) !important; }
.has-h-3-font-size   { font-size: var(--fs-h3) !important; }
.has-h-2-font-size   { font-size: var(--fs-feature) !important; }

 
.has-text-color    { color: var(--c-text) !important; }

 
.has-bg-color      { color: var(--c-bg) !important; }
.has-surface-color { color: var(--c-surface) !important; }
.has-muted-color   { color: var(--c-text-muted) !important; }
.has-primary-color { color: var(--c-primary) !important; }
.has-accent-color  { color: var(--c-accent) !important; }

.has-bg-background-color      { background-color: var(--c-bg) !important; }
.has-surface-background-color { background-color: var(--c-surface) !important; }
.has-text-background-color    { background-color: var(--c-text) !important; }
.has-muted-background-color   { background-color: var(--c-text-muted) !important; }
.has-primary-background-color { background-color: var(--c-primary) !important; }
.has-accent-background-color  { background-color: var(--c-accent) !important; }

 
:is(p, h1, h2, h3, h4, h5, h6)[class*="-background-color"] {
  padding: var(--sp-s) var(--sp-m);
  border-radius: var(--radius-m);
}


 
:where(.is-layout-flex),
:where(.is-layout-grid) { gap: 0.5em; }

 
:where(.wp-block-columns.is-layout-flex),
:where(.wp-block-columns.is-layout-grid) { gap: 2em; }

body .is-layout-flex { display: flex; }
.is-layout-flex { flex-wrap: wrap; align-items: center; }
.is-layout-flex > :is(*, div) { margin: 0; }

body .is-layout-grid { display: grid; }
.is-layout-grid > :is(*, div) { margin: 0; }

.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  max-width: var(--container-narrow);
  margin-left: auto !important;
  margin-right: auto !important;
}


 

 
.has-text-align-left   { text-align: left; }
.has-text-align-center { text-align: center; }
.has-text-align-right  { text-align: right; }

 
.prose .wp-block-separator.is-style-wide {
  width: 100%;
  height: var(--linea);
  border-radius: 0;
  background: var(--c-border);
}

 
.prose .wp-block-separator.is-style-dots {
  width: auto;
  height: auto;
  background: none;
  border: 0;
  text-align: center;
  line-height: 1;
}

.prose .wp-block-separator.is-style-dots::before {
  content: "\00b7\00b7\00b7";
  display: block;
  color: var(--c-vertical-soft);
  font-family: var(--font-sans);
  font-size: 1.5em;
  letter-spacing: 2em;
   
  padding-left: 2em;
}

 
.prose .wp-block-image.is-style-rounded img,
.prose figure.is-style-rounded img {
  border-radius: 9999px;
}

 
.prose blockquote.wp-block-quote.is-style-plain {
  padding-left: 0;
  border-left: 0;
}

 
.prose > .alignfull {
  margin-inline: calc(-1 * var(--gutter));
  width: calc(100% + 2 * var(--gutter));
  max-width: none;
}
 

.pagination {
  margin-top: var(--sp-2xl);
}

.pagination .page-numbers {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: var(--sp-2xs);
  margin: 0;
  padding: 0;
  list-style: none;
}

.pagination li { display: block; }

.pagination a.page-numbers,
.pagination span.page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--tap-target);
  min-height: var(--control-h);
  padding-inline: var(--sp-xs);
  border: var(--linea) solid var(--c-border);
  border-radius: var(--radius-s);
  font-size: var(--fs-small);
  color: var(--c-text-muted);
  text-decoration: none;
  transition: border-color var(--dur-fast) var(--ease-out),
              color var(--dur-fast) var(--ease-out),
              background var(--dur-fast) var(--ease-out);
}

.pagination a.page-numbers:hover {
  border-color: var(--c-accent);
  color: var(--c-accent);
}

.pagination .page-numbers.current {
  background: var(--c-surface-2);
  border-color: var(--c-accent);
  color: var(--c-text);
  font-weight: var(--fw-semibold);
}

.pagination .page-numbers.dots {
  border-color: transparent;
  min-width: 0;
  color: var(--c-text-faint);
}

 

.empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-s);
  padding: var(--sp-2xl) var(--sp-m);
  text-align: center;
  border: 1px dashed var(--c-border);
  border-radius: var(--radius-l);
  background: var(--c-bg-elev);
}

.empty-state__mark {
  display: block;
  width: 48px;
  height: 48px;
  color: var(--c-accent);
  opacity: 0.8;
}

.empty-state__mark svg { width: 100%; height: 100%; }

.empty-state__title {
  margin: 0;
  font-size: var(--fs-h3);
  font-weight: var(--fw-semibold);
  color: var(--c-text);
}

.empty-state__text {
  margin: 0;
  max-width: 46ch;
  color: var(--c-text-muted);
}

.empty-state__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--sp-2xs);
  margin-top: var(--sp-2xs);
}

.empty-state__search {
  width: 100%;
  max-width: 28rem;
  margin-top: var(--sp-s);
}

 

.error-page { text-align: center; }

.error-page__code {
  margin: 0 0 var(--sp-s);
  font-size: var(--fs-display-xl);
  font-weight: var(--fw-bold);
  line-height: 0.9;
  letter-spacing: var(--tracking-display);

   
  color: var(--c-primary);
  background-image: linear-gradient(
    100deg,
    var(--c-farma-soft),
    var(--c-capacitacion-soft) 35%,
    var(--c-ecommerce-soft) 65%,
    var(--c-marketing-soft)
  );
  -webkit-background-clip: text;
  background-clip: text;
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .error-page__code { color: transparent; }
}

.error-page__title { letter-spacing: var(--tracking-tight); }

.error-page__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--sp-2xs);
  margin-top: var(--sp-l);
}

.error-page__verticals {
  display: grid;
  gap: var(--sp-2xs);
  margin-top: var(--sp-2xl);
}

.error-page__vertical {
  display: flex;
  align-items: center;
  gap: var(--sp-s);
  min-width: 0;
  padding: var(--sp-s) var(--sp-m);
  border: var(--linea) solid var(--c-border-soft);
  border-radius: var(--radius-m);
  background: var(--c-surface);
  color: var(--c-text);
  text-align: left;
  text-decoration: none;
  transition: border-color var(--dur-fast) var(--ease-out),
              background var(--dur-fast) var(--ease-out);
}

.error-page__vertical:hover {
  border-color: color-mix(in srgb, var(--c-vertical) 55%, var(--c-border));
  background: var(--c-surface-2);
  color: var(--c-text);
}

.error-page__icon {
  width: 22px;
  height: 22px;
  flex-shrink: 0;
  color: var(--c-vertical-soft);
}

.error-page__search { margin-top: var(--sp-2xl); }

.error-page__search-label {
  margin-bottom: var(--sp-s);
  font-size: var(--fs-small);
  color: var(--c-text-faint);
}

 
.error-page__search .search-form { margin-inline: auto; }

@media (min-width: 640px) {
  .error-page__verticals { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

 

.search-panel { margin-bottom: var(--sp-2xl); }

.search-results {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: var(--linea) solid var(--c-border-soft);
}

.search-result {
  min-width: 0;
  padding-block: var(--sp-m);
  border-bottom: var(--linea) solid var(--c-border-soft);
}

.search-result__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-2xs) var(--sp-s);
  margin-bottom: var(--sp-2xs);
}

.search-result__vertical { color: var(--c-vertical-soft); }

.search-result__title {
  font-size: var(--fs-card);
  margin-bottom: var(--sp-2xs);
}

.search-result__title a {
  color: var(--c-text);
  text-decoration: none;

   
  padding-block: max(0px, calc((var(--tap-target-min) - 1lh) / 2));
}

.search-result__title a:hover {
  color: var(--c-vertical-soft);
  text-decoration: underline;
}

.search-result__text {
  margin: 0;
  color: var(--c-text-muted);
  font-size: var(--fs-small);

   
  max-width: 56ch;
}

 

 
 
.cta-form__privacidad {
  margin: 0;
  color: var(--c-text-muted);
  font-size: var(--fs-small);
}

.cta-form__privacidad a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.cta-form__status:empty { display: none; }

.cta-form__status {
  display: flex;
  align-items: center;
  gap: var(--sp-2xs);
  margin: 0;
  padding: var(--sp-xs) var(--sp-s);
  border: var(--linea) solid var(--c-border);
  border-radius: var(--radius-m);
  background: var(--c-surface-2);
  color: var(--c-text-muted);
  font-size: var(--fs-small);
}

.cta-form__status[data-state="sending"] {
  border-color: color-mix(in srgb, var(--c-accent) 45%, var(--c-border));
  color: var(--c-accent);
}

.cta-form__status[data-state="sent"] {
  border-color: color-mix(in srgb, var(--c-capacitacion-soft) 55%, var(--c-border));
  color: var(--c-capacitacion-soft);
}

.cta-form__status[data-state="error"] {
  border-color: color-mix(in srgb, var(--c-marketing-soft) 55%, var(--c-border));
  color: var(--c-marketing-soft);
}

 
.cta-form__status[data-state="sending"]::before {
  content: "";
  width: 8px;
  height: 8px;
  flex-shrink: 0;
  border-radius: var(--radius-pill);
  background: currentColor;
  animation: status-pulse 1.2s ease-in-out infinite;
}

@keyframes status-pulse {
  0%, 100% { opacity: 0.35; }
  50%      { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .cta-form__status[data-state="sending"]::before { animation: none; opacity: 1; }
}

 

.contact-form {
  display: grid;
  gap: var(--sp-s);
  min-width: 0;

   
  position: relative;
}

 
.cta-form__panel {
  container-type: inline-size;
  container-name: cta-form;
}

.contact-form__fields {
  display: grid;
  gap: var(--sp-s);
}

 
@container cta-form (min-width: 440px) {
  .contact-form__fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.field {
  display: grid;
  gap: var(--sp-3xs);

   
  min-width: 0;

   
  align-content: start;
}

 
.field--full { grid-column: 1 / -1; }

.field__label {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--sp-3xs);
  font-size: var(--fs-small);
  font-weight: var(--fw-medium);
  color: var(--c-text);

   
  overflow-wrap: anywhere;
}

 
.field__optional {
  font-size: var(--fs-micro);
  font-weight: var(--fw-regular);
  color: var(--c-text-muted);
}

.field__control {
  width: 100%;
  max-width: 100%;
  min-height: var(--control-h);
  padding: var(--sp-2xs) var(--sp-xs);
  border: var(--linea) solid var(--c-border);
  border-radius: var(--radius-s);
  background: var(--c-bg-elev);
  color: var(--c-text);
  font: inherit;
  font-size: var(--fs-small);
  transition: border-color var(--dur-fast) var(--ease-out),
              background var(--dur-fast) var(--ease-out);
}

.field__control::placeholder { color: var(--c-text-faint); }

.field__control:hover { border-color: var(--c-text-faint); }

.field__control:focus-visible {
  outline: 2px solid var(--c-text);
  outline-offset: 2px;
  border-color: var(--c-accent);
  background: var(--c-surface);
}

 
.field--select .field__control {
  appearance: none;
  padding-right: var(--sp-l);

   
  background-image: linear-gradient(45deg, transparent 50%, currentColor 50%),
                    linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position: calc(100% - 18px) center, calc(100% - 13px) center;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}

.field--textarea .field__control {
  min-height: 7rem;
  resize: vertical;
}

.field__help {
  margin: 0;
  font-size: var(--fs-micro);
  color: var(--c-text-muted);
  overflow-wrap: anywhere;
}

 
.field__error:empty { display: none; }

.field__error {
  margin: 0;
  font-size: var(--fs-micro);
  color: var(--c-marketing-soft);
  overflow-wrap: anywhere;
}

 
.field__control[aria-invalid="true"] {
  border-color: var(--c-marketing-soft);
  background: color-mix(in srgb, var(--c-marketing) 10%, var(--c-bg-elev));
}

 
.contact-form__summary:empty { display: none; }

.contact-form__summary {
  display: grid;
  gap: var(--sp-2xs);
  padding: var(--sp-xs) var(--sp-s);
  border: var(--linea) solid color-mix(in srgb, var(--c-marketing-soft) 55%, var(--c-border));
  border-radius: var(--radius-m);
  background: color-mix(in srgb, var(--c-marketing) 12%, var(--c-surface));
  color: var(--c-text);
  font-size: var(--fs-small);
}

.contact-form__summary p { margin: 0; font-weight: var(--fw-medium); }

.contact-form__summary ul {
  margin: 0;
  padding-left: var(--sp-s);
  display: grid;
  gap: var(--sp-3xs);
  font-size: var(--fs-micro);
}

.contact-form__summary a {
  color: var(--c-text);
  text-decoration: underline;
  text-underline-offset: 0.2em;
  overflow-wrap: anywhere;
}

 
.contact-form__hp {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.contact-form__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-s);
}

 
.contact-form__submit {
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
}

.contact-form__submit:disabled {
  opacity: 0.6;
  cursor: progress;
}

 
.cta-form__panel.is-sending .contact-form {
  opacity: 0.6;
  pointer-events: none;
}

 
.cta-form__direct {
  margin: 0;
  font-size: var(--fs-micro);
  color: var(--c-text-muted);
  overflow-wrap: anywhere;
}

.cta-form__direct a { color: var(--c-accent); }

 

.cta-form__embed .hs-form,
.cta-form__embed form {
  display: grid;
  gap: var(--sp-s);
  font-family: var(--font-sans);
}

.cta-form__embed .hs-form-field { min-width: 0; }

.cta-form__embed .hs-form-field > label,
.cta-form__embed .hs-form-field > label span {
  display: inline-block;
  margin-bottom: var(--sp-3xs);
  font-size: var(--fs-small);
  font-weight: var(--fw-medium);
  color: var(--c-text);
}

 
.cta-form__embed .hs-form-required { color: var(--c-accent); }

.cta-form__embed .hs-field-desc {
  margin-top: var(--sp-3xs);
  font-size: var(--fs-micro);
  color: var(--c-text-faint);
}

.cta-form__embed .hs-input,
.cta-form__embed input[type="text"],
.cta-form__embed input[type="email"],
.cta-form__embed input[type="tel"],
.cta-form__embed input[type="number"],
.cta-form__embed input[type="url"],
.cta-form__embed select,
.cta-form__embed textarea {
  width: 100%;
  max-width: 100%;
  min-height: var(--control-h);
  padding: var(--sp-2xs) var(--sp-xs);
  border: var(--linea) solid var(--c-border);
  border-radius: var(--radius-s);
  background: var(--c-bg-elev);
  color: var(--c-text);
  font: inherit;
  font-size: var(--fs-small);
  transition: border-color var(--dur-fast) var(--ease-out),
              background var(--dur-fast) var(--ease-out);
}

.cta-form__embed textarea { min-height: 120px; resize: vertical; }

.cta-form__embed .hs-input::placeholder,
.cta-form__embed textarea::placeholder { color: var(--c-text-faint); }

.cta-form__embed .hs-input:hover { border-color: var(--c-text-faint); }

.cta-form__embed .hs-input:focus,
.cta-form__embed .hs-input:focus-visible {
  outline: 2px solid var(--c-text);
  outline-offset: 2px;
  border-color: var(--c-accent);
  background: var(--c-surface);
}

 
.cta-form__embed input[type="checkbox"],
.cta-form__embed input[type="radio"] {
  width: 18px;
  height: 18px;
  min-height: 0;
  margin-right: var(--sp-2xs);
  accent-color: var(--c-primary);
}

.cta-form__embed .hs-form-booleancheckbox-display,
.cta-form__embed .hs-form-checkbox-display,
.cta-form__embed .hs-form-radio-display {
  display: flex;
  align-items: flex-start;
  gap: var(--sp-3xs);
  font-size: var(--fs-small);
  color: var(--c-text-muted);
}

.cta-form__embed ul.inputs-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

 
.cta-form__embed .hs-input.error,
.cta-form__embed .hs-input.invalid {
  border-color: var(--c-marketing-soft);
  background: color-mix(in srgb, var(--c-marketing) 10%, var(--c-bg-elev));
}

.cta-form__embed .hs-error-msgs,
.cta-form__embed .hs-error-msg {
  margin: var(--sp-3xs) 0 0;
  padding: 0;
  list-style: none;
  font-size: var(--fs-micro);
  color: var(--c-marketing-soft);
}

.cta-form__embed .hs-richtext,
.cta-form__embed .legal-consent-container {
  font-size: var(--fs-micro);
  color: var(--c-text-muted);
}

.cta-form__embed .hs-richtext a { color: var(--c-accent); }

.cta-form__embed .hs-button,
.cta-form__embed input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-height: var(--control-h);
  padding: var(--sp-2xs) var(--control-pad-x);
  border: var(--linea) solid transparent;
  border-radius: var(--radius-s);
  background: var(--c-primary);
  color: var(--c-on-primary);
  font: inherit;
  font-size: var(--fs-small);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--tracking-caps);
  cursor: pointer;

   
  transition: background var(--dur-fast) var(--ease-out),
              border-color var(--dur-fast) var(--ease-out),
              transform var(--dur-fast) var(--ease-out);
}

 
.cta-form__embed .hs-button:hover,
.cta-form__embed input[type="submit"]:hover {
  background: var(--c-primary-hover);
  border-color: var(--c-primary-filo-hover);
}

.cta-form__embed .hs-button:active,
.cta-form__embed input[type="submit"]:active { transform: translateY(1px); }

 
.cta-form__panel.is-sending .cta-form__embed {
  opacity: 0.6;
  pointer-events: none;
}

 
.cta-form__embed .submitted-message {
  padding: var(--sp-m);
  border: var(--linea) solid color-mix(in srgb, var(--c-capacitacion) 45%, var(--c-border));
  border-radius: var(--radius-m);
  background: color-mix(in srgb, var(--c-capacitacion) 10%, var(--c-surface));
  color: var(--c-text);
}

 

 
.cta-form__embed fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

 
.cta-form__embed fieldset:not(:has(input:not([type="hidden"]), select, textarea)) {
  display: none;
}

 
.cta-form__embed .form-columns-1,
.cta-form__embed .form-columns-2,
.cta-form__embed .form-columns-3 {
  display: grid;
  gap: var(--sp-s);

   
  grid-template-columns: minmax(0, 1fr);
}

 
.cta-form__embed .hs-form-field > .input { min-width: 0; }

@container cta-form (min-width: 440px) {
  .cta-form__embed .form-columns-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cta-form__embed .form-columns-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

 
.cta-form__embed .hs-input.hs-fieldtype-intl-phone {
  display: flex;
  gap: var(--sp-2xs);
  min-height: 0;
  padding: 0;
  border: 0;
  background: none;
}

.cta-form__embed .hs-fieldtype-intl-phone > select {
  flex: 0 1 auto;

   
  width: auto;
  max-width: 45%;
  min-width: 0;
}

.cta-form__embed .hs-fieldtype-intl-phone > input {
  flex: 1 1 auto;
  min-width: 0;
}

 
.cta-form__embed .grecaptcha-badge {
  box-shadow: none !important;
  border: var(--linea) solid var(--c-border);
  border-radius: var(--radius-s);

   
  overflow: hidden;
}

 
.cta-form__embed .hs_recaptcha > label:empty { display: none; }

 

 

.solution-list {
  display: grid;
  gap: var(--sp-m);
}

.solution {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--sp-2xs);
  min-width: 0;

   
  --solution-pad: var(--sp-m);
  padding: var(--solution-pad);
  background: var(--c-surface);
  border: var(--linea) solid var(--c-border-soft);
  border-top: 2px solid var(--c-vertical);
  border-radius: var(--radius-m);

   
  transition: border-color var(--dur-hover) var(--ease-out),
              background-color var(--dur-hover) var(--ease-out),
              translate var(--dur-hover) var(--ease-out),
              box-shadow var(--dur-hover) var(--ease-out);
}

@media (min-width: 900px) {
   
  .solution { --solution-pad: var(--sp-l); }
}

 
.solution:hover,
.solution:focus-within {
  border-color: color-mix(in srgb, var(--c-vertical) 45%, var(--c-border));
  background-color: var(--c-surface-2);
  translate: 0 calc(-1 * var(--tarjeta-elev));

   
  box-shadow: var(--luz-caja),
              var(--shadow-card),
              0 0 22px color-mix(in srgb, var(--c-vertical) 22%, transparent);
}

 
.solution:hover,
.solution:focus-within {
  --c-vertical-ink: color-mix(in srgb, var(--c-vertical-soft) 85%, var(--c-text));
}

 
.solution .eyebrow--vertical {
  transition: color var(--dur-hover) var(--ease-out);
}

 
.solution:hover,
.solution:focus-within { border-top-color: var(--c-vertical-soft); }

 
@media (prefers-reduced-motion: reduce) {
  .solution:hover,
  .solution:focus-within { translate: none; }
}

 
.solution__title {
  font-size: var(--fs-h3);
  letter-spacing: var(--tracking-tight);
  overflow-wrap: anywhere;

   
  max-width: 30ch;
  text-wrap: balance;
}

.solution__text {
  color: var(--c-text-muted);
  font-size: var(--fs-body);

   
  max-width: 56ch;
  overflow-wrap: anywhere;
}

 
.solution__link { margin-top: var(--sp-2xs); }

 
 

 
.solution__cuerpo {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--sp-2xs);
  min-width: 0;
}

.solution--con-imagen {
   
  padding: 0;

   
  gap: 0;

   
  align-items: stretch;

   
  overflow: clip;
}

.solution--con-imagen .solution__cuerpo {
  padding: var(--solution-pad);
}

 
.solution__media {
  position: relative;
  width: 100%;
  aspect-ratio: 3 / 2;

   
  min-height: 0;

  background: var(--c-surface-2);
}

 
.solution__media img,
.solution__media img[width][height] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

 
@media (min-width: 900px) {
  .solution--con-imagen {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
  }

   
  .solution--con-imagen .solution__media {
    aspect-ratio: auto;
    min-height: 220px;
  }
}

 
 

 

 

 
 
 

.metric-grid {
  border: var(--linea) solid var(--c-border-soft);
  border-radius: var(--radius-m);
}

.metric {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2xs);

   
  padding: var(--sp-l) var(--sp-m);
}

 

@media (min-width: 640px) {
  .metric-grid { --linegrid-cols: 2; }

   
  .metric:nth-child(odd):last-child { grid-column: 1 / -1; }
}

 
.metric__text {
  color: var(--c-text);
  font-size: var(--fs-card);
  line-height: var(--lh-snug);
  overflow-wrap: anywhere;
}

 
.metric__source {
  margin-top: auto;
  padding-top: var(--sp-2xs);
}

 

.featured-case {
  display: grid;
  gap: var(--sp-m);
  padding: var(--sp-m);
  background: var(--c-surface);
  border: var(--linea) solid var(--c-border-soft);
  border-radius: var(--radius-l);
}

@media (min-width: 900px) {
  .featured-case {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
    gap: var(--sp-xl);
    padding: var(--sp-l);
  }
}

 
.featured-case__media {
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  border-radius: var(--radius-m);
  background:
    radial-gradient(70% 70% at 50% 40%, color-mix(in srgb, var(--c-vertical) 14%, transparent), transparent 72%),
    var(--c-surface-2);
}

.featured-case__media img,
.featured-case__media img[width][height] {
   
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.featured-case__body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--sp-s);
  min-width: 0;
}

.featured-case__title {
  font-size: var(--fs-h3);
  letter-spacing: var(--tracking-tight);
  overflow-wrap: anywhere;
}

.featured-case__text {
  color: var(--c-text-muted);
  overflow-wrap: anywhere;
}


 

.case-list {
  display: grid;
  gap: var(--sp-xl);
  margin-top: var(--sp-l);
}

.case-detail {
   
  --c-vertical: var(--c-primary);
  --c-vertical-soft: var(--c-accent);
  display: grid;
  gap: var(--sp-m);
  padding: var(--sp-m);
  background: var(--c-surface);
  border: var(--linea) solid var(--c-border-soft);
  border-radius: var(--radius-l);

   
  box-shadow: var(--luz-caja);

   
}

@media (min-width: 900px) {
  .case-detail {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
    gap: var(--sp-xl);
    padding: var(--sp-l);
  }

   
  .case-detail:nth-child(even) .case-detail__media {
    grid-column: 2;
    grid-row: 1;
  }

  .case-detail:nth-child(even) .case-detail__body {
    grid-column: 1;
    grid-row: 1;
  }
}

 
.case-detail__media {
  position: relative;
  display: grid;
  place-items: center;
  min-width: 0;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  border-radius: var(--radius-m);
   
  background: var(--c-surface-2);
}

 
.case-detail__media::before {
  content: "";
  position: absolute;
  inset: 0;

   
  pointer-events: none;

  background: radial-gradient(70% 70% at 50% 40%, color-mix(in srgb, var(--c-vertical) 14%, transparent), transparent 72%);

  transition: scale var(--dur-base) var(--ease-out);
}

 
.case-detail__media img,
.case-detail__media img[width][height] {
   
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.case-detail__body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--sp-s);

   
  min-width: 0;
}

.case-detail__title {
  font-size: var(--fs-h3);
  letter-spacing: var(--tracking-tight);

   
  overflow-wrap: anywhere;
}

.case-detail__text { color: var(--c-text-muted); }

 
.case-detail__metric {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3xs);
  margin: 0;
  padding-left: var(--sp-m);
  border-left: 3px solid var(--c-vertical);
  min-width: 0;
}

.case-detail__metric-value {
  font-size: var(--fs-feature);
  font-weight: var(--fw-bold);
  line-height: 1;
  letter-spacing: var(--tracking-tighter);
  color: var(--c-vertical-soft);

   
  font-variant-numeric: tabular-nums;
  min-height: 1em;
}

.case-detail__metric-label {
  font-size: var(--fs-small);
  color: var(--c-text-muted);

   
  max-width: 34ch;
  overflow-wrap: anywhere;
}

 
.case-detail__cta { margin-top: var(--sp-2xs); }

 

 

 
.vertical-card,
.case-card,
.post-card,
.solution {
  isolation: isolate;
}

.solution { position: relative; }

 
.vertical-card,
.case-card,
.solution { --tarjeta-luz-a: 14%; }

.post-card { --tarjeta-luz-a: 7.5%; }

 

.vertical-card::before,
.case-card::before,
.post-card::before,
.solution::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(
    circle 300px at var(--pt-x, 50%) var(--pt-y, 50%),
    color-mix(in srgb, var(--c-vertical) var(--tarjeta-luz-a), transparent) 0%,
    color-mix(in srgb, var(--c-vertical) calc(var(--tarjeta-luz-a) / 2), transparent) 42%,
    transparent 74%
  );
  transition: opacity var(--dur-tarjeta) var(--ease-tarjeta);
}

.vertical-card:hover::before,
.vertical-card:focus-within::before,
.case-card:hover::before,
.case-card:focus-within::before,
.post-card:hover::before,
.post-card:focus-within::before,
.solution:hover::before,
.solution:focus-within::before {
  opacity: 1;
}

 
html.js .vertical-card,
html.js .case-card,
html.js .post-card,
html.js .solution {
  transition: translate var(--dur-tarjeta) var(--ease-tarjeta),
              transform var(--dur-tarjeta) var(--ease-tarjeta),
              box-shadow var(--dur-tarjeta) var(--ease-tarjeta),
              border-color var(--dur-hover) var(--ease-out),
              border-top-color var(--dur-hover) var(--ease-out),
              background-color var(--dur-hover) var(--ease-out),
              color var(--dur-hover) var(--ease-out);
}

@media (hover: hover) and (pointer: fine) {
   
  html.js .vertical-card.is-puntero,
  html.js .case-card.is-puntero,
  html.js .post-card.is-puntero,
  html.js .solution.is-puntero {
    transform: perspective(1200px)
               rotateX(calc(var(--pt-ny, 0) * -1 * var(--tarjeta-tilt)))
               rotateY(calc(var(--pt-nx, 0) * var(--tarjeta-tilt)));

     
    transition: transform 110ms linear,
                translate var(--dur-tarjeta) var(--ease-tarjeta),
                box-shadow var(--dur-tarjeta) var(--ease-tarjeta),
                border-color var(--dur-hover) var(--ease-out),
                border-top-color var(--dur-hover) var(--ease-out),
                background-color var(--dur-hover) var(--ease-out),
                color var(--dur-hover) var(--ease-out);
  }

   
  .vertical-card,
  .solution { --tarjeta-tilt: 1.2deg; }

   
  .case-card:hover .case-card__media img,
  .case-card:focus-within .case-card__media img,
  .post-card:hover .post-card__media img,
  .post-card:focus-within .post-card__media img {
    transform: scale(1.06);
    translate: calc(var(--pt-nx, 0) * var(--tarjeta-parallax) * -1)
               calc(var(--pt-ny, 0) * var(--tarjeta-parallax) * -1);
  }

  .case-card__media img,
  .post-card__media img {
    transition: transform var(--dur-tarjeta) var(--ease-tarjeta),
                translate 110ms linear;
  }

   

   
  .vertical-card:hover .media-hint,
  .vertical-card:focus-within .media-hint {
    translate: calc(var(--pt-nx, 0) * var(--tarjeta-parallax) / 3)
               calc(var(--pt-ny, 0) * var(--tarjeta-parallax) / 3);
  }

  .vertical-card:hover .vertical-card__media > img,
  .vertical-card:focus-within .vertical-card__media > img,
  .vertical-card:hover .vertical-card__media > video,
  .vertical-card:focus-within .vertical-card__media > video {
    transform: scale(1.06);
    translate: calc(var(--pt-nx, 0) * var(--tarjeta-parallax) * -1)
               calc(var(--pt-ny, 0) * var(--tarjeta-parallax) * -1);
  }

  .media-hint { transition: translate 140ms linear; }

  .vertical-card__media > img,
  .vertical-card__media > video {
    transition: transform var(--dur-tarjeta) var(--ease-tarjeta),
                translate 110ms linear;
  }
}

 
.vertical-card::after,
.case-card::after,
.post-card::after,
.solution::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  z-index: 1;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(
    90deg,
    transparent 0%,
    var(--c-vertical-soft) 16%,
    color-mix(in srgb, #fff 45%, var(--c-vertical-soft)) 50%,
    var(--c-vertical-soft) 84%,
    transparent 100%
  );

   
  clip-path: inset(0 100% 0 0);
  transition: clip-path var(--dur-filo) var(--ease-tarjeta),
              opacity var(--dur-fast) var(--ease-out);
}

.vertical-card:hover::after,
.vertical-card:focus-within::after,
.case-card:hover::after,
.case-card:focus-within::after,
.post-card:hover::after,
.post-card:focus-within::after,
.solution:hover::after,
.solution:focus-within::after {
  opacity: 1;
  clip-path: inset(0 0 0 0);
}

 
@media (prefers-reduced-motion: no-preference) {
  html.js .vertical-card.is-visible .vertical-card__body > *,
  html.js .solution.is-visible > * {
    animation: tarjeta-interior var(--dur-base) var(--ease-out) backwards;
    animation-delay: calc(var(--reveal-paso, 0) * var(--stagger) + 140ms
                          + var(--interior-paso, 0) * 55ms);
  }

  html.js .vertical-card.is-visible .vertical-card__body > *:nth-child(2),
  html.js .solution.is-visible > *:nth-child(2) { --interior-paso: 1; }

  html.js .vertical-card.is-visible .vertical-card__body > *:nth-child(3),
  html.js .solution.is-visible > *:nth-child(3) { --interior-paso: 2; }

  html.js .vertical-card.is-visible .vertical-card__body > *:nth-child(n + 4),
  html.js .solution.is-visible > *:nth-child(n + 4) { --interior-paso: 3; }
}

 
@keyframes tarjeta-interior {
  from { opacity: 0; translate: 0 10px; }
  to   { opacity: 1; translate: 0 0; }
}

 
@media (hover: none) {
  .vertical-card:hover,
  .post-card:hover,
  .case-card:hover,
  .solution:hover { translate: none; }

  .btn--cta:hover svg,
  .link-arrow:hover svg,
  .vertical-card:hover .link-arrow svg,
  .post-card:hover .link-arrow svg,
  .case-card:hover .link-arrow svg { transform: none; }

   
  .vertical-card:hover .vertical-card__media > img,
  .vertical-card:hover .vertical-card__media > video,
  .case-card:hover .case-card__media img,
  .post-card:hover .post-card__media img,
  .solution:hover .solution__media img { transform: none; }

  .vertical-card:hover .vertical-card__media::before,
  .case-card:hover .case-card__media::before,
  .post-card:hover .post-card__media::before { scale: none; }

  .video-facade:hover .video-facade__play span { transform: none; }

   
  .testimonios__flecha:hover svg,
  .testimonios__flecha--atras:hover svg { translate: none; }

   
  .vertical-card:focus-within,
  .post-card:focus-within,
  .case-card:focus-within,
  .solution:focus-within { translate: 0 -4px; }

  .link-arrow:focus-visible svg,
  .vertical-card:focus-within .link-arrow svg,
  .post-card:focus-within .link-arrow svg,
  .case-card:focus-within .link-arrow svg { transform: translate3d(4px, 0, 0); }

   
  .vertical-card:focus-within .vertical-card__media > img,
  .vertical-card:focus-within .vertical-card__media > video,
  .case-card:focus-within .case-card__media img,
  .post-card:focus-within .post-card__media img,
  .solution:focus-within .solution__media img { transform: scale(var(--media-zoom)); }

  .vertical-card:focus-within .vertical-card__media::before,
  .case-card:focus-within .case-card__media::before,
  .post-card:focus-within .post-card__media::before { scale: var(--luz-zoom); }

  .testimonios__flecha:focus-visible svg { translate: 4px 0; }
  .testimonios__flecha--atras:focus-visible svg { translate: -4px 0; }
}

 
@media (prefers-reduced-motion: reduce) {
  .testimonios__flecha:hover svg,
  .testimonios__flecha:focus-visible svg,
  .testimonios__flecha--atras:hover svg,
  .testimonios__flecha--atras:focus-visible svg { translate: none; }
}

 
@media (prefers-reduced-motion: reduce) {
  .btn--cta:hover svg,
  .link-arrow:hover svg,
  .link-arrow:focus-visible svg,
  .vertical-card:hover .link-arrow svg,
  .vertical-card:focus-within .link-arrow svg,
  .post-card:hover .link-arrow svg,
  .post-card:focus-within .link-arrow svg,
  .case-card:hover .link-arrow svg,
  .case-card:focus-within .link-arrow svg { transform: none; }

  .link-arrow:hover,
  .link-arrow:focus-visible,
  .vertical-card:hover .link-arrow,
  .vertical-card:focus-within .link-arrow,
  .post-card:hover .link-arrow,
  .post-card:focus-within .link-arrow,
  .case-card:hover .link-arrow,
  .case-card:focus-within .link-arrow { gap: var(--sp-2xs); }

   
  .vertical-card:focus-within,
  .post-card:focus-within,
  .case-card:focus-within,
  .solution:focus-within { translate: none; }

   
  .vertical-card::after,
  .case-card::after,
  .post-card::after,
  .solution::after { clip-path: none; }

  .vertical-card:hover .vertical-card__media > img,
  .vertical-card:focus-within .vertical-card__media > img,
  .vertical-card:hover .vertical-card__media > video,
  .vertical-card:focus-within .vertical-card__media > video,
  .case-card:hover .case-card__media img,
  .case-card:focus-within .case-card__media img,
  .post-card:hover .post-card__media img,
  .post-card:focus-within .post-card__media img,
  .solution:hover .solution__media img,
  .solution:focus-within .solution__media img {
    transform: none;
    translate: none;
  }

  .vertical-card:hover .vertical-card__media::before,
  .vertical-card:focus-within .vertical-card__media::before,
  .case-card:hover .case-card__media::before,
  .case-card:focus-within .case-card__media::before,
  .post-card:hover .post-card__media::before,
  .post-card:focus-within .post-card__media::before { scale: none; }
}

 
.case-detail__acciones {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-s) var(--sp-l);
  margin: 0;
}

.article-webar { margin-top: var(--sp-l); }

 

.case-detail__media img {
  transition: transform var(--dur-slow) var(--ease-out);
}

.case-detail__media:hover::before,
.case-detail:focus-within .case-detail__media::before { scale: var(--luz-zoom); }

.case-detail__media:hover img,
.case-detail:focus-within .case-detail__media img { transform: scale(var(--media-zoom)); }

 
@media (hover: none) {
  .case-detail__media:hover::before { scale: none; }
  .case-detail__media:hover img { transform: none; }
}

 
@media (prefers-reduced-motion: reduce) {
  .case-detail__media:hover::before,
  .case-detail:focus-within .case-detail__media::before { scale: none; }

  .case-detail__media:hover img,
  .case-detail:focus-within .case-detail__media img { transform: none; }
}
 

.momentos {
   
  --momento-ratio: 4 / 5;

   
  container-type: inline-size;
}

 
.momentos__cabecera {
  align-items: center;
}

.momentos__flechas {
  display: flex;
  gap: var(--sp-2xs);
}

 
.momentos__flechas[hidden] { display: none; }

 
.momentos__flecha {
  width: var(--control-h);
  height: var(--control-h);
  display: grid;
  place-items: center;
  padding: 0;
  border: var(--linea) solid var(--c-border);
  border-radius: var(--radius-pill);
  background: transparent;
  color: var(--c-text);
  cursor: pointer;
  transition: border-color var(--dur-hover) var(--ease-out),
              color var(--dur-hover) var(--ease-out);
}

 
.momentos__flecha svg {
  width: 16px;
  height: 16px;
  transition: translate var(--dur-hover) var(--ease-out);
}

 
.momentos__flecha--atras svg { scale: -1 1; }

.momentos__flecha:hover,
.momentos__flecha:focus-visible {
  border-color: var(--c-vertical-soft);
  color: var(--c-vertical-soft);
}

 
.momentos__flecha:hover svg,
.momentos__flecha:focus-visible svg { translate: 4px 0; }

.momentos__flecha--atras:hover svg,
.momentos__flecha--atras:focus-visible svg { translate: -4px 0; }

 
.momentos__flecha[aria-disabled="true"] {
  color: var(--c-text-faint);
  border-color: var(--c-border-soft);
  cursor: default;
}

.momentos__flecha[aria-disabled="true"]:hover {
  border-color: var(--c-border-soft);
  color: var(--c-text-faint);
}

 
.momentos__flecha[aria-disabled="true"]:hover svg,
.momentos__flecha[aria-disabled="true"]:focus-visible svg { translate: none; }

 
.momentos__pista {
  --lead: max(var(--gutter), calc((100cqw - var(--container)) / 2 + var(--gutter)));

   
  --hueco: var(--sp-m);

   
  --banda: calc(100cqw - var(--lead));

   
  --visibles: 1.3;
  --huecos: 1;

  display: flex;
  gap: var(--hueco);
  padding-inline: var(--lead);
  overflow-x: auto;
   
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
   
  scroll-padding-inline: var(--lead);
   
  overscroll-behavior-x: contain;
}

 
html.js .momentos__pista {
  scrollbar-width: none;
}

html.js .momentos__pista::-webkit-scrollbar { display: none; }

 
@media (min-width: 560px) {
  .momentos__pista { --visibles: 1.9; --huecos: 1; }
}

@media (min-width: 900px) {
  .momentos__pista { --visibles: 2.9; --huecos: 2; }
}

 
@media (min-width: 1040px) {
  .momentos__pista { --visibles: 3.6; --huecos: 3; }
}

.momentos__momento {
   
  flex: 0 0 auto;

   
  width: clamp(220px, calc((var(--banda) - var(--huecos) * var(--hueco)) / var(--visibles)), calc(var(--container) / 3));

   
  position: relative;
  aspect-ratio: var(--momento-ratio);

  scroll-snap-align: start;

  border-radius: var(--radius-l);
   
  background: var(--c-surface-2);
}

 
.momentos__momento:last-child { scroll-snap-align: end; }

 
.momentos .momentos__momento img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
   
  object-fit: cover;
  border-radius: inherit;
}

 
@media (prefers-reduced-motion: reduce) {
  .momentos__flecha:hover svg,
  .momentos__flecha:focus-visible svg,
  .momentos__flecha--atras:hover svg,
  .momentos__flecha--atras:focus-visible svg { translate: none; }
}
