/* style.css */

:root {
    /* Tetradic Color Scheme - Creative & Neo-Brutalism */
    --primary-color: #FF5733; /* Fiery Orange - Main Call to Action, Brutalist Accents */
    --primary-darker: #D64521;
    --primary-lighter: #FF7D5C;

    --secondary-color: #4ECDC4; /* Teal - Secondary Actions, Highlights */
    --secondary-darker: #3AA89F;
    --secondary-lighter: #6FE3D9;

    --tertiary-color: #54A0FF; /* Sky Blue - Informational elements, backgrounds */
    --tertiary-darker: #3B78D9;
    --tertiary-lighter: #7BB9FF;
    
    --accent-color: #A775FF; /* Amethyst Purple - Subtle accents, links */
    --accent-darker: #8A58E0;
    --accent-lighter: #C49EFF;

    /* Neutral Colors */
    --text-color: #333333; /* Dark gray for main text */
    --text-light: #F8F9FA; /* Very light gray/white for dark backgrounds */
    --text-muted: #6c757d;
    --headings-color: #222222; /* Very dark gray/black for headings */
    --background-color: #FFFFFF;
    --background-light-gray: #F8F9FA;
    --background-dark: #1A1A1A; 
    --border-color: #DDDDDD;
    --neo-border-color: #111111; 

    /* Fonts */
    --font-family-headings: 'Manrope', sans-serif;
    --font-family-body: 'Rubik', sans-serif;

    /* Spacing & Sizing */
    --spacing-unit: 1rem; /* 16px */
    --container-width: 1140px;
    --header-height: 80px;
    --border-radius-sharp: 0px;
    --border-radius-subtle: 4px;
    --neo-shadow: 4px 4px 0px var(--neo-border-color);
    --neo-shadow-hover: 6px 6px 0px var(--neo-border-color);


    /* Transitions */
    --transition-speed: 0.25s;
    --transition-timing: ease-in-out;
}

/* Global Styles */
*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    font-size: 100%; /* 16px base */
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-family-body);
    line-height: 1.65;
    color: var(--text-color);
    background-color: var(--background-color);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden; /* Prevent horizontal scroll */
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-family-headings);
    color: var(--headings-color);
    margin-top: 0;
    margin-bottom: calc(var(--spacing-unit) * 0.75);
    line-height: 1.3;
    font-weight: 800; /* Manrope bold */
}

h1 { font-size: 2.8rem; }
h2 { font-size: 2.2rem; }
h3 { font-size: 1.75rem; }
h4 { font-size: 1.4rem; }

@media (max-width: 768px) {
    h1 { font-size: 2.2rem; }
    h2 { font-size: 1.8rem; }
    h3 { font-size: 1.5rem; }
}

p {
    margin-bottom: var(--spacing-unit);
    font-size: 1rem;
    color: var(--text-color);
}

a {
    color: var(--accent-color);
    text-decoration: none;
    transition: color var(--transition-speed) var(--transition-timing);
}

a:hover, a:focus {
    color: var(--accent-darker);
    text-decoration: underline;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* Utility Classes */
.container {
    width: 90%;
    max-width: var(--container-width);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--spacing-unit);
    padding-right: var(--spacing-unit);
}

.section-padding {
    padding-top: calc(var(--spacing-unit) * 3.5);
    padding-bottom: calc(var(--spacing-unit) * 3.5);
}

.section-light-bg {
    background-color: var(--background-light-gray);
}

.section-dark-bg {
    background-color: var(--background-dark);
    color: var(--text-light);
}

.section-dark-bg h1, .section-dark-bg h2, .section-dark-bg h3, .section-dark-bg h4,
.section-dark-bg p, .section-dark-bg label {
    color: var(--text-light);
}
.section-dark-bg .section-title, .section-dark-bg .card-title {
     text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
}


.text-center {
    text-align: center;
}

.section-title {
    text-align: center;
    margin-bottom: calc(var(--spacing-unit) * 2.5);
    font-weight: 800;
    color: var(--headings-color);
    position: relative;
}
.section-title::after {
    content: '';
    display: block;
    width: 60px;
    height: 4px;
    background-color: var(--primary-color);
    margin: 0.5rem auto 0;
    border-radius: var(--border-radius-subtle);
}


.section-intro {
    text-align: center;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: calc(var(--spacing-unit) * 2.5);
    font-size: 1.1rem;
    color: var(--text-muted);
}
.section-dark-bg .section-intro {
    color: #D0D0D0;
}


/* Basic Column Support (Bulma-like from HTML) */
.columns {
    display: flex;
    flex-wrap: wrap;
    margin-left: -0.75rem;
    margin-right: -0.75rem;
    margin-top: -0.75rem;
}
.columns.is-vcentered {
    align-items: center;
}
.columns.is-centered {
    justify-content: center;
}
.columns.is-multiline {
    flex-wrap: wrap;
}

.column {
    display: block;
    flex-basis: 0;
    flex-grow: 1;
    flex-shrink: 1;
    padding: 0.75rem;
}

.column.is-two-thirds { flex: none; width: 66.6666%; }
.column.is-one-third { flex: none; width: 33.3333%; }
.column.is-half { flex: none; width: 50%; }
.column.is-one-quarter { flex: none; width: 25%; }
.column.is-full-tablet { width: 100%;}


@media screen and (max-width: 768px) {
    .column.is-one-third-desktop, .column.is-half-tablet, .column.is-one-quarter-desktop {
        flex: none;
        width: 100%;
    }
    .columns {
        margin-left: 0;
        margin-right: 0;
    }
    .column {
        padding-left: 0;
        padding-right: 0;
    }
}
@media screen and (min-width: 769px) {
    .column.is-half-tablet {
        flex: none;
        width: 50%;
    }
    .column.is-full-tablet {
         width: auto; /* Reset for desktop if needed */
    }
}
@media screen and (min-width: 1024px) {
    .column.is-one-third-desktop {
        flex: none;
        width: 33.3333%;
    }
    .column.is-one-quarter-desktop {
        flex: none;
        width: 25%;
    }
}


/* Header & Navigation */
.site-header {
    background-color: rgba(255, 255, 255, 0.9); /* Slightly transparent white */
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: calc(var(--spacing-unit) * 0.8) 0;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    height: var(--header-height);
}

.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo {
    font-family: var(--font-family-headings);
    font-size: 1.8rem;
    font-weight: 800;
    color: var(--primary-color);
    text-decoration: none;
}
.logo:hover {
    color: var(--primary-darker);
    text-decoration: none;
}

.logo-accent {
    color: var(--secondary-color);
}

.main-nav .nav-list {
    list-style: none;
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
}

.main-nav .nav-link {
    font-family: var(--font-family-headings);
    font-weight: 700;
    color: var(--text-color);
    text-decoration: none;
    padding: 0.5rem 1rem;
    margin-left: 0.5rem;
    border-radius: var(--border-radius-subtle);
    transition: background-color var(--transition-speed) var(--transition-timing), color var(--transition-speed) var(--transition-timing);
    position: relative;
}
.main-nav .nav-link:hover,
.main-nav .nav-link.active {
    color: var(--primary-color);
    background-color: rgba(var(--primary-color-rgb, 255, 87, 51), 0.1); /* Use RGB for opacity */
}
.main-nav .nav-link::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    background-color: var(--primary-color);
    transition: width var(--transition-speed) var(--transition-timing);
}
.main-nav .nav-link:hover::after,
.main-nav .nav-link.active::after {
    width: 70%;
}

/* Mobile Navigation */
.nav-toggle {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.5rem;
    z-index: 1001;
}

.hamburger-line {
    display: block;
    width: 25px;
    height: 3px;
    background-color: var(--headings-color);
    margin: 5px 0;
    border-radius: 3px;
    transition: all var(--transition-speed) var(--transition-timing);
}

@media (max-width: 768px) {
    .main-nav .nav-list {
        display: none;
        flex-direction: column;
        position: absolute;
        top: var(--header-height);
        left: 0;
        width: 100%;
        background-color: var(--background-color);
        box-shadow: 0 5px 10px rgba(0,0,0,0.1);
        padding: var(--spacing-unit) 0;
    }
    .main-nav .nav-list.active {
        display: flex;
    }
    .main-nav .nav-link {
        display: block;
        width: 100%;
        text-align: center;
        padding: 1rem;
        margin-left: 0;
    }
    .nav-toggle {
        display: block;
    }
    .nav-toggle[aria-expanded="true"] .hamburger-line:nth-child(1) {
        transform: translateY(8px) rotate(45deg);
    }
    .nav-toggle[aria-expanded="true"] .hamburger-line:nth-child(2) {
        opacity: 0;
    }
    .nav-toggle[aria-expanded="true"] .hamburger-line:nth-child(3) {
        transform: translateY(-8px) rotate(-45deg);
    }
}

/* Page content adjustments for fixed header */
.page-content, #hero {
    padding-top: var(--header-height); 
}
/* Specific padding for privacy and terms page containers */
body[data-barba-namespace="privacy"] .page-content .container,
body[data-barba-namespace="terms"] .page-content .container {
    padding-top: calc(var(--header-height) + var(--spacing-unit));
}


/* Global Button Styles */
.button, button, input[type="submit"], input[type="button"] {
    display: inline-block;
    font-family: var(--font-family-headings);
    font-weight: 700;
    font-size: 1rem;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    padding: 0.75rem 1.75rem;
    border-radius: var(--border-radius-sharp); /* Neo-brutalism sharp edges */
    border: 2px solid var(--neo-border-color);
    transition: all var(--transition-speed) var(--transition-timing);
    position: relative;
    overflow: hidden;
    box-shadow: var(--neo-shadow);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.button:hover, button:hover, input[type="submit"]:hover, input[type="button"]:hover {
    transform: translate(-2px, -2px);
    box-shadow: var(--neo-shadow-hover);
    text-decoration: none;
}
.button:active, button:active, input[type="submit"]:active, input[type="button"]:active {
    transform: translate(0, 0);
    box-shadow: none;
}

.button-primary, .form-submit-button {
    background-color: var(--primary-color);
    color: var(--text-light);
    border-color: var(--neo-border-color);
}
.button-primary:hover, .form-submit-button:hover {
    background-color: var(--primary-darker);
    color: var(--text-light);
}

.button-secondary {
    background-color: var(--secondary-color);
    color: var(--text-light);
    border-color: var(--neo-border-color);
}
.button-secondary:hover {
    background-color: var(--secondary-darker);
    color: var(--text-light);
}

/* Hero Section */
.hero-section {
    color: var(--text-light);
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(100vh - var(--header-height)); /* Adjust if header is not transparent */
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    position: relative;
}
/* The linear gradient is applied inline in HTML for data-prompt */

.hero-content {
    max-width: 800px;
    position: relative; /* For z-index if needed */
    z-index: 1;
}

.hero-title {
    font-size: 3.2rem; /* Larger for hero */
    font-weight: 800;
    margin-bottom: var(--spacing-unit);
    color: #FFFFFF; /* Explicitly white as requested */
    text-shadow: 2px 2px 6px rgba(0,0,0,0.7); /* Stronger shadow for readability */
}

.hero-subtitle {
    font-size: 1.3rem;
    margin-bottom: calc(var(--spacing-unit) * 1.8);
    line-height: 1.7;
    color: #FFFFFF; /* Explicitly white as requested */
    text-shadow: 1px 1px 4px rgba(0,0,0,0.5);
}

@media (max-width: 768px) {
    .hero-title { font-size: 2.5rem; }
    .hero-subtitle { font-size: 1.1rem; }
    .hero-section { min-height: 70vh; }
}

/* Card Styles (Generic) */
.card {
    background-color: var(--background-color);
    border: 2px solid var(--neo-border-color);
    box-shadow: var(--neo-shadow);
    border-radius: var(--border-radius-sharp);
    overflow: hidden;
    transition: transform var(--transition-speed) var(--transition-timing), box-shadow var(--transition-speed) var(--transition-timing);
    display: flex;
    flex-direction: column;
    height: 100%; /* Ensure cards in a row have same height */
    align-items: center; /* Center card items if they don't fill width */
}
.card:hover {
    transform: translateY(-5px) translateX(-5px);
    box-shadow: 8px 8px 0px var(--neo-border-color);
}

.card-image { /* Container for the image */
    width: 100%;
    height: 220px; /* Fixed height for image containers */
    overflow: hidden;
    position: relative; /* For potential overlays */
}

.card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Crop and cover */
    transition: transform var(--transition-speed) var(--transition-timing);
}
.card:hover .card-image img {
    transform: scale(1.05);
}

.card-content {
    padding: calc(var(--spacing-unit) * 1.2);
    text-align: center; /* Center content within the card */
    flex-grow: 1; /* Allow content to fill space if card height is fixed by row */
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Pushes button to bottom */
}

.card-title {
    font-size: 1.4rem;
    margin-bottom: calc(var(--spacing-unit) * 0.5);
    color: var(--headings-color);
}
.card-content p {
    font-size: 0.95rem;
    color: var(--text-muted);
    margin-bottom: var(--spacing-unit);
    flex-grow: 1;
}
.card-content .button {
    margin-top: auto; /* Pushes button to bottom */
    align-self: center; /* Center button if it's not full width */
}

/* Recipe Card Specifics (if any) */
.recipe-card {}

/* Instructor Card Specifics */
.instructor-card .card-image {
    height: 300px; /* Profile pictures might be taller or square */
}
.instructor-specialty {
    font-style: italic;
    color: var(--primary-color);
    margin-bottom: 0.5rem;
    font-size: 0.9rem;
}


/* Filter Switches */
.filter-switches {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: var(--spacing-unit) * 1.5;
}
.switch {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 28px;
}
.switch input { 
  opacity: 0;
  width: 0;
  height: 0;
}
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  transition: .4s;
}
.slider:before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  transition: .4s;
}
input:checked + .slider {
  background-color: var(--primary-color);
}
input:focus + .slider {
  box-shadow: 0 0 1px var(--primary-color);
}
input:checked + .slider:before {
  transform: translateX(22px);
}
.slider.round {
  border-radius: 34px;
}
.slider.round:before {
  border-radius: 50%;
}
.filter-switches span {
    margin-left: 0.8rem;
    font-family: var(--font-family-body);
    color: var(--text-color);
}


/* Research Section (Nutricionizam) */
#nutricionizam .image-container img {
    border-radius: var(--border-radius-subtle);
    border: 2px solid var(--neo-border-color);
    box-shadow: var(--neo-shadow);
}
#nutricionizam h3 {
    color: var(--primary-color);
    margin-bottom: var(--spacing-unit);
}

/* Resources Section */
.resource-card {
    background-color: var(--background-color);
    padding: var(--spacing-unit);
    border: 2px solid var(--border-color);
    border-left: 5px solid var(--secondary-color);
    margin-bottom: var(--spacing-unit);
    border-radius: var(--border-radius-sharp);
    transition: box-shadow var(--transition-speed) var(--transition-timing);
}
.resource-card:hover {
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}
.resource-card h3 {
    margin-bottom: 0.5rem;
}
.resource-card h3 a {
    color: var(--headings-color);
    font-weight: 700;
}
.resource-card h3 a:hover {
    color: var(--secondary-darker);
}
.resource-card p {
    font-size: 0.9rem;
    color: var(--text-muted);
    margin-bottom: 0;
}


/* Partners Section */
#partneri {
    background-color: var(--background-light-gray);
}
.partner-logo {
    text-align: center;
    padding: var(--spacing-unit);
}
.partner-logo img {
    max-height: 70px; /* Adjust as needed */
    width: auto;
    margin: 0 auto var(--spacing-unit);
    filter: grayscale(80%);
    transition: filter var(--transition-speed) var(--transition-timing);
}
.partner-logo img:hover {
    filter: grayscale(0%);
}
.partner-logo p {
    font-size: 0.9rem;
    color: var(--text-muted);
}


/* Contact Section & Form */
#kontakt, #kontakt-stranica { /* Apply to both homepage section and contact page section */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.contact-form {
    max-width: 650px;
    width: 100%;
    margin: 0 auto;
    background-color: rgba(255, 255, 255, 0.05); /* Glassmorphism hint for dark bg */
    padding: calc(var(--spacing-unit) * 2);
    border-radius: var(--border-radius-subtle);
    border: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}
.section-light-bg .contact-form { /* If form is on light bg */
    background-color: rgba(0, 0, 0, 0.02);
    border: 1px solid rgba(0, 0, 0, 0.05);
}


.form-field {
    margin-bottom: calc(var(--spacing-unit) * 1.2);
}

.form-label {
    display: block;
    font-family: var(--font-family-headings);
    font-weight: 700;
    margin-bottom: 0.4rem;
    color: var(--text-light); /* Default for dark bg */
}
.section-light-bg .form-label {
    color: var(--text-color);
}


.form-input,
.form-textarea {
    width: 100%;
    padding: 0.8rem 1rem;
    border: 2px solid var(--border-color);
    border-radius: var(--border-radius-sharp);
    background-color: var(--background-color);
    color: var(--text-color);
    font-family: var(--font-family-body);
    font-size: 1rem;
    transition: border-color var(--transition-speed) var(--transition-timing), box-shadow var(--transition-speed) var(--transition-timing);
}
.form-input:focus,
.form-textarea:focus {
    outline: none;
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(var(--primary-color-rgb, 255, 87, 51), 0.3);
}
.section-dark-bg .form-input,
.section-dark-bg .form-textarea {
    background-color: rgba(255,255,255,0.9);
    border-color: rgba(255,255,255,0.3);
    color: var(--text-color);
}
.section-dark-bg .form-input:focus,
.section-dark-bg .form-textarea:focus {
     border-color: var(--primary-lighter);
     box-shadow: 0 0 0 3px rgba(var(--primary-lighter-rgb, 255, 125, 92), 0.4);
}

.form-textarea {
    min-height: 120px;
    resize: vertical;
}

.contact-info {
    text-align: center;
    margin-top: calc(var(--spacing-unit) * 2);
}
.contact-info p {
    color: var(--text-light); /* Default for dark bg */
    margin-bottom: 0.5rem;
}
.contact-info a {
    color: var(--secondary-lighter);
    font-weight: 500;
}
.contact-info a:hover {
    color: var(--secondary-color);
}

/* Footer */
.site-footer {
    background-color: var(--headings-color); /* Dark footer for contrast */
    color: var(--text-light);
    padding: calc(var(--spacing-unit) * 2.5) 0;
    font-size: 0.95rem;
}

.site-footer .footer-container {
    /* Footer already uses .container */
}

.footer-heading {
    font-family: var(--font-family-headings);
    font-size: 1.25rem;
    color: var(--primary-lighter);
    margin-bottom: var(--spacing-unit);
    font-weight: 700;
}

.site-footer p {
    color: #B0B0B0; /* Lighter gray for footer text */
    margin-bottom: 0.5rem;
}

.footer-links, .footer-social-links {
    list-style: none;
    padding-left: 0;
}

.footer-links li, .footer-social-links li {
    margin-bottom: 0.5rem;
}

.footer-links a, .footer-social-links a {
    color: #D0D0D0;
    text-decoration: none;
    transition: color var(--transition-speed) var(--transition-timing);
}
.footer-links a:hover, .footer-social-links a:hover {
    color: var(--secondary-lighter);
    text-decoration: underline;
}
/* Social links are text-only as requested */
.footer-social-links a {
    display: inline-block;
    /* Add any specific styling for text-based social links here if needed */
}

.footer-bottom {
    border-top: 1px solid #444444;
    padding-top: var(--spacing-unit);
    margin-top: calc(var(--spacing-unit) * 1.5);
    text-align: center;
    font-size: 0.9rem;
}
.footer-bottom p {
    color: #999999;
}

/* Specific Page Styles */

/* Success Page */
body[data-barba-namespace="success"] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}
body[data-barba-namespace="success"] main {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}
.success-page.section-padding {
    flex-grow: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}
.success-icon {
    font-size: 5rem;
    color: var(--secondary-color); /* Greenish for success */
    margin-bottom: 1.5rem;
    line-height: 1;
}
.success-page .section-title {
    color: var(--headings-color);
}
.success-page .section-intro {
    color: var(--text-muted);
}

/* Privacy & Terms Pages */
.page-content .content-text h2 {
    color: var(--primary-color);
    margin-top: calc(var(--spacing-unit) * 1.8);
    margin-bottom: var(--spacing-unit);
    border-bottom: 2px solid var(--border-color);
    padding-bottom: 0.5rem;
}
.page-content .content-text ul {
    margin-bottom: var(--spacing-unit);
    padding-left: calc(var(--spacing-unit) * 1.5);
}
.page-content .content-text li {
    margin-bottom: 0.5rem;
}
.inline-link {
    color: var(--primary-color);
    font-weight: 500;
}
.inline-link:hover {
    color: var(--primary-darker);
}

/* Parallax Effect Placeholder (JS will handle actual parallax) */
[data-parallax] {
    /* background-attachment: fixed; */ /* Basic CSS parallax, can interfere with complex JS */
    /* JS will likely manipulate background-position */
}

/* Animations on Scroll (basic setup, JS will add/remove class) */
.animate-on-scroll {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s var(--transition-timing), transform 0.6s var(--transition-timing);
}
.animate-on-scroll.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Barba.js Page Transitions */
.page-transition {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: var(--primary-color);
    z-index: 9999;
    transform: translateY(-100%);
    transition: transform 0.5s cubic-bezier(0.65, 0, 0.35, 1);
}
html.is-animating .page-transition {
    transform: translateY(0);
}
/* Example of a different out transition */
/*
.fade-out .page-transition {
    transform: translateY(100%);
}
*/


/* Cookie Consent Popup */
#cookieConsentPopup {
    /* Styles are inline in HTML as per prompt */
    /* This is just a placeholder if you move them */
}

/* Ensure high contrast for text on image backgrounds */
/* This is generally handled by the linear-gradient in the HTML style attribute */
/* Example: style="background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url(...)" */
/* All sections with background images and text on top should use such overlays. */

/* Final Responsive Tweaks */
@media (max-width: 1023px) { /* Tablet and below */
    .container {
        width: 95%;
    }
}

@media (max-width: 480px) { /* Small mobile */
    h1 { font-size: 2rem; }
    h2 { font-size: 1.6rem; }
    .hero-title { font-size: 2.2rem; }
    .hero-subtitle { font-size: 1rem; }
    .button, button, input[type="submit"], input[type="button"] {
        padding: 0.6rem 1.2rem;
        font-size: 0.9rem;
    }
    .section-padding {
        padding-top: calc(var(--spacing-unit) * 2.5);
        padding-bottom: calc(var(--spacing-unit) * 2.5);
    }
    .contact-form {
        padding: var(--spacing-unit);
    }
}