/* Reset margin and padding for all elements */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Full height for the body and html to center vertically */
body, html {
    height: 100%;
    margin: 0;
    font-family: 'Work Sans', sans-serif;
    overflow: hidden;
}

/* Full-screen video background */
video {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
}

/* Content container (flexbox to center everything) */
.content-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 20px;
    position: absolute;
    top: 50%; /* Center vertically */
    left: 50%; /* Center horizontally */
    transform: translate(-50%, -50%); /* Offset the position to truly center */
    z-index: 1;
    color: white;
    max-width: 500px; /* Set a max-width for the content area */
    width: 100%; /* Make it responsive */
}


/* Logo styles */
.logo img {
    max-width: 150px; /* Smaller logo size */
    height: auto;
    margin-bottom: 40px;
}
/* Info section styling */
.info .name {
    font-size: 1.0em;
    font-weight: bold;
    margin-bottom: 3px; /* Smaller space below the name */
}

.info .role,
.info .email {
    font-size: 0.8em;
    margin-top: 3px; /* Smaller space between lines */
    margin-bottom: 2px; /* Increased space below the phone number */
}

/* Add more space below the phone number */
.info .phone {
    font-size: 0.8em;
    margin-top: 4px; /* Smaller space between lines */
    margin-bottom: 50px; /* Increased space below the phone number */
}

.info .text {
    font-size: 0.7em;
    margin-top: 10px; /* Space before the text block */
    margin-bottom: 15px; /* Increased space below the phone number */
}


/* Link styling */
a {
    color: white;
    text-decoration: underline;
}

.social-icons {
    margin-top: 20px;
}

.social-icons a {
    color: white;
    font-size: 28px;
    margin-right: 8px;   /* ↓ Minska detta värde för mindre avstånd */
    text-decoration: none;
    transition: opacity 0.3s ease;
}

.social-icons a:hover {
    opacity: 0.7;
}