/*
Theme Name: 	MSE Twentytwentyfour Child Theme
Template:		twentytwentyfour
Theme URI: 	https://mstreament.com/
Author: 	mse dev team
Author URI: 	https://mstreament.com/dev
Description: 	Twenty Twenty-Four custom tweaks for MainStream Entertainment
Version: 		1.6
License: 		GPL v2 or later
Text Domain: 	mse-twentytwentyfour-child-theme
*/

/* Import Google Fonts */
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@700&family=Poppins:wght@300;600&family=Roboto:wght@300;400&display=swap");

/* MSE Brand Colors */
:root {
    --mse-dark-bg: #160402;
    --mse-light-grey: #d5d8dc;
    --mse-burgundy: #c0392b;
    --mse-salmon: #ec7063;
    --mse-white: #fbfcfc;
}

/* Global Styles */
body {
    font-family: "Roboto", sans-serif;
    color: var(--mse-light-grey);
    background: var(--mse-dark-bg);
    background: linear-gradient(135deg, #160402 0%, #331108 100%);
}

.wp-site-blocks {
    color: var(--mse-light-grey);
}

/* Typography */
h1, h3, h4 {
    font-family: "Montserrat", sans-serif;
    font-weight: 700;
    color: var(--mse-light-grey);
}

h2 {
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    color: var(--mse-light-grey);
}

/* Links & Buttons */
a {
    color: var(--mse-burgundy);
    transition: color 0.3s ease;
}

a:hover {
    color: var(--mse-salmon);
}

button,
.wp-block-button__link {
    background-color: var(--mse-burgundy);
    color: var(--mse-white);
    border: none;
    padding: 12px 24px;
    border-radius: 4px;
    transition: background-color 0.3s ease;
}

button:hover,
.wp-block-button__link:hover {
    background-color: var(--mse-salmon);
}

/* Block Editor Support */
.wp-block-columns {
    gap: 2rem;
}

.wp-block-cover {
    color: var(--mse-white);
}

.wp-block-group.has-background {
    color: var(--mse-light-grey);
}

/* Responsive */
@media (max-width: 768px) {
    .wp-block-columns {
        flex-direction: column;
        gap: 1rem;
    }
}

/* Animation */
.mse-fadeup {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.mse-fadeup.is-visible {
    opacity: 1;
    transform: translateY(0);
}