IninsaY

@keyframes text-move {
	0% {
		left: 0;
		top: 0;
	}
	33.3% {
		left: 0;
		bottom: 0;
    top:unset;
	}
	66.3% {
    left:unset;
		right: 0;
		bottom: 0;
	}
	100% {
		right: 0;
		top: 0;
	}
}

Чтобы скроллилось, вместо href вешай

onclick="window.scrollTo({ top: [расчетная прокрутка], behavior: 'smooth'});"

. Но это не ест осел, поэтому если он тебе нужен, стоит воспользоваться либо аналогичной функцией jQuery, либо анимировать по старинке.

Если же тебе нужно, чтобы просто проскакивало к объекту и это можно было использовать из коробки для того, чтобы формировать ссылку — выше написали про якоря.

ЗЫ: если используешь JS вместо якоря, то ссылку вообще не обязательно и скорее не стоит использовать.

Тоже сейчас размышляю о подобном(для своего(команды) сайта).
Вот из последнего для вдохновения что мне подкинули:
mystaticself.com
Так же рекомендую посмотреть на работы с awwwards:
awwwards.com

Потому что содержимое флексов выравнивается вдоль главной оси свойством justify-content, а не text-align

.center-buttons {
display: flex;
align-items: center;
width: 10.6%;
background-color: red;
margin-right: 5px;
justify-content: center;
}

from functools import reduce
from operator import mul

def persistence(n):
    i = 0
    while n > 9:
        n = reduce(mul, map(int, str(n)), 1)
        i += 1
    return i

Вариант без дополнительных импортов:

def persistence(n):
    i = 0
    while n > 9:
        n = eval('*'.join(f'{n}'))
        i += 1
    return i

Вариант без while:

from functools import reduce
from operator import mul
from itertools import count

def persistence(n):
    for i in count(0):
        if n > 9:
            n = reduce(mul, map(int, str(n)), 1)
        else:
            return i

Проверки корректности результата:

assert persistence(39) == 3
assert persistence(999) == 4
assert persistence(4) == 0

Как вариант без использования дополнительных импортов:

def persistence(num):
    temp = 1
    while num > 9:
        for n in map(int, list(str(num))):
            temp = temp * n
        num, temp = temp, 1
    return num

text-align: center;

.content-block-2-text-2 {
text-align: center;
}
Если требуется такое же подчеркивание пунктирной линией, то добавить:
border-bottom: 2px dotted #d51b31;

Попробуйте сделать через элемент before и абсолютное позиционирование как здесь https://codepen.io/Natalia_ai_ivanova/pen/GRRPoLq

Вариант без псевдоэлементов, фон через linear-gradient

.wrapper{
  text-align: center;
  background-image: 
  linear-gradient(transparent calc(49%), skyblue calc(49%), transparent calc(49% + 1px)),
  linear-gradient(transparent calc(49%), skyblue calc(49%), transparent calc(49% + 1px));
  background-size: calc(45% - 80px);
  background-repeat: no-repeat;
  background-position: 0 0, 100% 0;
}

UPD: теперь корректно работает с картинкой на фоне