* {
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
}

body {
    --color-beige-100: #F5F5DC;
    --color-beige-200: #EDECE4;
    --color-brown-900: #3E2723;
    --color-brown-800: #4E342E;
    --color-brown-700: #5D4037;
    --color-brown-600: #6D4C41;
    --color-brown-500: #795548;
    --color-yellow-500: #FFD700;
    --color-yellow-400: #FFEA00;
    --color-yellow-300: #FFEB3B;
    background-color: var(--color-beige-100);
    color: var(--color-brown-900);
}

.bg-beige-100 { background-color: var(--color-beige-100); }
.bg-beige-200 { background-color: var(--color-beige-200); }
.bg-brown-900 { background-color: var(--color-brown-900); }
.bg-brown-800 { background-color: var(--color-brown-800); }
.bg-brown-700 { background-color: var(--color-brown-700); }
.bg-brown-600 { background-color: var(--color-brown-600); }
.bg-brown-500 { background-color: var(--color-brown-500); }
.bg-yellow-500 { background-color: var(--color-yellow-500); }
.bg-yellow-600 { background-color: #FFC107; /* Slightly darker yellow for hover */ }

.text-brown-900 { color: var(--color-brown-900); }
.text-brown-800 { color: var(--color-brown-800); }
.text-brown-700 { color: var(--color-brown-700); }
.text-brown-600 { color: var(--color-brown-600); }
.text-brown-500 { color: var(--color-brown-500); }
.text-beige-100 { color: var(--color-beige-100); }
.text-beige-200 { color: var(--color-beige-200); }
.text-beige-300 { color: #D7D4C8; /* Lighter beige for subtle text */ }
.text-yellow-500 { color: var(--color-yellow-500); }
.text-yellow-400 { color: var(--color-yellow-400); }
.text-yellow-300 { color: var(--color-yellow-300); }
.text-yellow-600 { color: #FFC107; }
.placeholder-beige-300::placeholder { color: #D7D4C8; }
.border-yellow-500 { border-color: var(--color-yellow-500); }
.focus\:ring-yellow-500:focus { --tw-ring-color: var(--color-yellow-500); }
.focus\:border-yellow-500:focus { border-color: var(--color-yellow-500); }

/* Custom Font Awesome Flag Icon for Portugal */
.fa-flag-pt::before {
    content: '\f024'; /* Generic flag icon, as specific PT flag isn't standard FA */
}

/* Responsive Typography for Headings */
/* h1 */
.text-6xl {
    font-size: 2.5rem; /* Mobile */
}
@media (min-width: 768px) {
    .md\:text-6xl {
        font-size: 3.5rem; /* Tablet */
    }
}
@media (min-width: 1024px) {
    .lg\:text-6xl {
        font-size: 4.5rem; /* Desktop */
    }
}

/* h2 */
.text-5xl {
    font-size: 2rem; /* Mobile */
}
@media (min-width: 768px) {
    .md\:text-5xl {
        font-size: 2.8rem; /* Tablet */
    }
}
@media (min-width: 1024px) {
    .lg\:text-5xl {
        font-size: 3.5rem; /* Desktop */
    }
}

/* h3 */
.text-2xl {
    font-size: 1.25rem; /* Mobile */
}
@media (min-width: 768px) {
    .md\:text-2xl {
        font-size: 1.5rem; /* Tablet */
    }
}
@media (min-width: 1024px) {
    .lg\:text-2xl {
        font-size: 1.875rem; /* Desktop */
    }
}

/* Logo/Site Name */
header a span.text-2xl {
    font-size: 1.25rem; /* Mobile */
}
@media (min-width: 768px) {
    header a span.text-2xl {
        font-size: 1.5rem; /* Tablet */
    }
}
@media (min-width: 1024px) {
    header a span.text-2xl {
        font-size: 1.875rem; /* Desktop */
    }
}

/* Ensure images in game cards have consistent height */
.game-card-image {
    height: 12rem; /* Fixed height for consistency */
    object-fit: cover;
}

/* Hide scrollbar for mobile menu when not active */
body.no-scroll {
    overflow: hidden;
}

/* Footer logos styling */
.footer-logos img {
    max-width: 120px;
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* Adjustments for mobile button text wrapping */
button {
    text-decoration: none;
}

.whitespace-normal {
    white-space: normal;
}

.break-words {
    word-break: break-word;
}

.text-center {
    text-align: center;
}
/*
 * New stock styles for common typography elements within the .legalFoldBox container.
 * These styles provide a clean, readable baseline for content.
 */

/* Parent container styling for spacing and layout */
.legalFoldBox {
    padding: 20px 25px; /* Internal padding for top/bottom and sides */
    margin-top: 30px;  /* External top margin to separate from preceding content */
    /* You might want to add a max-width and center it if not already done */
    /* max-width: 800px; */
    /* margin-left: auto; */
    /* margin-right: auto; */
    font-family: Arial, sans-serif; /* A common, readable font */
    color: #333; /* Default text color */
}

/* Heading 1 styles: Moderately sized for primary section titles */
.legalFoldBox h1 {
    font-size: 26px;
    font-weight: 700; /* Bold */
    line-height: 1.2;
    margin-top: 30px; /* Space above the heading */
    margin-bottom: 15px; /* Space below the heading */
    color: #222; /* Slightly darker for prominence */
}

/* Heading 2 styles: Slightly smaller than H1, for sub-sections */
.legalFoldBox h2 {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.3;
    margin-top: 25px;
    margin-bottom: 12px;
    color: #222;
}

/* Heading 3 styles: Further reduced size for more granular sections */
.legalFoldBox h3 {
    font-size: 19px;
    font-weight: 700;
    line-height: 1.4;
    margin-top: 20px;
    margin-bottom: 10px;
    color: #333;
}

/* Heading 4 styles: Approaching body text size, but still bold and distinct */
.legalFoldBox h4 {
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
    margin-top: 15px;
    margin-bottom: 8px;
    color: #333;
}

/* Heading 5 styles: Smallest heading, often used for minor distinctions */
.legalFoldBox h5 {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.5;
    margin-top: 10px;
    margin-bottom: 6px;
    color: #444;
}

/* Paragraph styles: Standard body text with good readability */
.legalFoldBox p {
    font-size: 16px;
    line-height: 1.6; /* Generous line height for readability */
    margin-bottom: 1em; /* Space between paragraphs */
    color: #555; /* Slightly lighter than headings for body text */
}

/* Unordered list styles: Standard bullet points with indentation */
.legalFoldBox ul {
    list-style-type: disc; /* Default bullet style */
    padding-left: 25px; /* Indent for bullet points */
    margin-bottom: 1em; /* Space after the list */
    margin-top: 0.5em; /* Space before the list */
}

/* Ordered list styles: Standard numbered lists with indentation */
.legalFoldBox ol {
    list-style-type: decimal; /* Default numbered style */
    padding-left: 25px; /* Indent for numbers */
    margin-bottom: 1em; /* Space after the list */
    margin-top: 0.5em; /* Space before the list */
}

/* List item styles: Consistent text style for all list items */
.legalFoldBox li {
    font-size: 16px;
    line-height: 1.6; /* Consistent line height with paragraphs */
    margin-bottom: 0.5em; /* Space between individual list items */
    color: #555;
}
