/* =========================================
HOME PAGE
========================================= */

.home-page {
background: #000;
color: #fff;


width: min(1200px, 94%);
margin: 0 auto;

padding: 10px 50px 80px;

box-sizing: border-box;


}

/* =========================================
LOGO
========================================= */

.home-logo-section {
display: flex;


justify-content: center;
align-items: center;

padding: 10px 0 30px;


}

.home-logo {
display: block;


width: 300px;
height: 300px;

object-fit: cover;

border-radius: 50%;


}

/* =========================================
TAGLINE
========================================= */

.home-tagline {
text-align: center;


padding: 0 20px 35px;


}

.home-tagline p {
max-width: 850px;


margin: 0 auto;

line-height: 1.6;

font-size: 20px;

color: #aaa;


}

/* =========================================
LATEST VIDEO
========================================= */

.latest-video {
width: 100%;


margin: 0 auto 35px;


}

.latest-video h2 {
margin-top: 0;
margin-bottom: 15px;


text-align: center;


}

.youtube-container {
position: relative;


width: 100%;

max-width: 900px;

margin: 0 auto;

aspect-ratio: 16 / 9;

background: #111;

border: 1px solid #333;


}

.youtube-container iframe {
position: absolute;


top: 0;
left: 0;

width: 100%;
height: 100%;

border: 0;


}

/* =========================================
HOME BUTTONS
========================================= */

.home-buttons {
display: flex;


flex-direction: column;

align-items: center;

gap: 12px;

width: 100%;

margin: 0 auto 50px;


}

.home-button {
display: block;


width: min(400px, 100%);

padding: 14px 24px;

box-sizing: border-box;

background: #eee;

color: #111;

text-decoration: none;

text-align: center;

font-weight: bold;

border: 1px solid #eee;

transition:
    background 0.15s ease,
    color 0.15s ease;


}

.home-button:hover {
background: #222;


color: #fff;

border-color: #555;


}

/* =========================================
LATEST NEWS
========================================= */

.home-news {
border-top: 1px solid #333;


padding: 35px 20px 0;

text-align: center;


}

.home-news h2 {
margin-top: 0;


margin-bottom: 20px;


}

.home-news p {
max-width: 850px;


margin: 0 auto;

line-height: 1.6;


}

/* =========================================
MOBILE
========================================= */

@media (max-width: 768px) {


.home-page {
    width: 100%;

    padding: 30px 15px 60px;
}

.home-logo-section {
    padding-top: 5px;

    padding-bottom: 25px;
}

.home-logo {
    width: 190px;
    height: 190px;
}

.home-tagline {
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 30px;
}

.home-tagline p {
    font-size: 18px;
}

.latest-video {
    margin-bottom: 30px;
}

.home-button {
    width: min(350px, 100%);
}

.home-news {
    padding-left: 10px;
    padding-right: 10px;
}


}