.registration {
  height: 50vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  margin-bottom: 4rem;
}

section.registration h1,
section.registration h2 {
    align-content: end;
    margin: 0; 
    min-height: 5rem;
    font-size: 4rem;
    text-align: center;
    text-transform: uppercase;
}

section.registration .sub { 
    opacity: .65;
    margin: 6px 0 0;
    min-height: 5rem;
    text-align: center;
 }

.registration-btn-block {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.btn-block-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;  
}

/* Tlačítko */
section.registration .btn {
    background: var(--my-color-road-sign);
    color: #000;
    font-size: 2rem;
    font-weight: bold;
    text-align: center;
    border: none;
    padding: 15px 30px;
    cursor: pointer;
    text-decoration: none; /* 🔥 vypne podtržení */
    opacity: 1;
    transition: opacity 0.2s ease-in-out;
    -webkit-transition: opacity 0.2s ease-in-out;
    will-change: opacity;
}

section.registration .btn:hover {
    opacity: 0.85;
    text-decoration: none; /* 🔥 vypne podtržení */
}

.hidden-text {
  color: rgb(255, 255, 255);
  text-align: center;
  overflow: hidden;                
  white-space: nowrap;
  width: 0;                         
  border-right: 2px solid transparent;
  font-size: 1rem;
  margin-top: 12px;
  opacity: 0;                       
  transition: opacity 0.3s ease;
}

/* Aktivace animace pouze při hoveru na sekci s registrací */
#registration:hover #hiddenText {
  opacity: 0.65;
  animation: typing 3s steps(40, end) forwards,
             blink-caret .75s step-end infinite;
  border-right: 2px solid var(--my-color-road-sign); /* barva kurzoru */
}

/* Efekt psaní */
@keyframes typing {
  from { width: 0 }
  to { width: 100% }
}

/* Blikající kurzor */
@keyframes blink-caret {
  from, to { border-color: transparent }
  50% { border-color: var(--my-color-road-sign); }
}

/* == DESKTOP == */
@media (min-width: 768px){  

}