header {
    margin-block-end: var(--space-xxl);
}

.logo {
    width: var(--logo-width);
}

main {
    display: flex;
    flex-direction: column;
    gap: var(--space-xxl);
    flex: 1;
}

.illustration {
    flex: var(--illustration-ratio);
}

.illustration img {
    width: 100%;
    height: auto;
}

.content {
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
}

h1 {
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    font-size: var(--font-size-heading);
    margin-block-end: var(--space-md);
}

.paragraph-content {
    line-height: clamp(1.5rem, 5vw, 1.7rem);
    opacity: 0.9;
    margin-block-end: var(--space-lg);
}

.register-btn {
    background-color: var(--white);
    color: var(--violet);
    border: none;
    border-radius: var(--btn-border-radius);
    font-family: 'Poppins', sans-serif;
    font-size: var(--font-size-btn);
    padding: var(--btn-padding-vertical) var(--btn-padding-horizontal);
    box-shadow: var(--btn-shadow);
    align-self: center;
    width: fit-content;
}

.register-btn:hover {
    background-color: var(--soft-magenta);
    color: var(--white);
    transform: translateY(-2px);
}

footer {
    margin-block-start: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-md);
    padding-block-start: var(--space-xl);
}

.social-icons {
    display: flex;
    justify-content: center;
    gap: var(--space-sm);
}
.attribution {
    font-size: var(--font-size-attribution);
    text-align: center;
}

.social-icons a {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: var(--social-icon-size);
    height: var(--social-icon-size);
    border: 1px solid var(--white);
    border-radius: 50%;
    font-size: calc(var(--social-icon-size) * 0.5);
}

.attribution a {
    color: var(--soft-magenta);
    text-decoration: underline;
}

.social-icons a:hover {
    color: var(--soft-magenta);
    border-color: var(--soft-magenta);
    transform: translateY(-2px);
}