/*
  Theme: Dodávka a inštalácia klimatického обладнання
  Design System: Corporate
  Trend: Adaptive Typography
  Color Scheme: Analogous
  Animation Style: Elastic Animations
  Fonts: Manrope (Headings), Rubik (Body)
  Framework: Bootstrap 5
*/

/* CSS Variables */
:root {
    /* Fonts */
    --font-primary: 'Manrope', sans-serif;
    --font-secondary: 'Rubik', sans-serif;

    /* Primary Color Palette (Analogous - Blue Base) */
    --color-primary-dark: #0D47A1;     /* Deep Blue */
    --color-primary-medium: #1976D2;   /* Medium Blue */
    --color-primary-light: #42A5F5;    /* Light Blue */
    --color-primary-very-light: #90CAF9;/* Very Light Blue */
    --color-primary-bg-tint: #E3F2FD;  /* Extremely Light Blue Tint for backgrounds */

    /* Analogous Colors */
    --color-analogous-1: #00695C;      /* Dark Teal */
    --color-analogous-2: #283593;      /* Dark Indigo */

    /* Text Colors */
    --color-text-dark: #212529;
    --color-text-darker: #1a1a1a; /* For strong headings */
    --color-text-light: #f8f9fa;
    --color-text-on-primary: #FFFFFF;
    --color-text-muted: #6c757d;

    /* Background Colors */
    --color-background-body: #FFFFFF;
    --color-background-light: #FFFFFF;
    --color-background-grey: #f8f9fa; /* Bootstrap's light grey */
    --color-background-dark: var(--color-primary-dark);

    /* Semantic Colors */
    --color-success: #198754; /* Bootstrap Success Green */
    --color-warning: #ffc107;
    --color-danger: #dc3545;
    --color-info: #0dcaf0;

    /* Gradients */
    --gradient-primary: linear-gradient(135deg, var(--color-primary-medium), var(--color-primary-dark));
    --gradient-subtle-light: linear-gradient(135deg, var(--color-primary-bg-tint), var(--color-background-light));
    --gradient-dark-overlay: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5));

    /* Shadows */
    --shadow-sm: 0 .125rem .25rem rgba(0,0,0,.075);
    --shadow-md: 0 .5rem 1rem rgba(0,0,0,.15);
    --shadow-lg: 0 1rem 3rem rgba(0,0,0,.175);

    /* Borders */
    --border-radius-sm: .25rem;
    --border-radius-md: .5rem; /* Default for cards */
    --border-radius-lg: 1rem;
    --border-radius-pill: 50px; /* For buttons */
    --border-color: #dee2e6;

    /* Transitions */
    --transition-speed-fast: 0.2s;
    --transition-speed-normal: 0.3s;
    --transition-speed-slow: 0.5s;
    --transition-easing: ease-in-out;
    --transition-elastic: cubic-bezier(0.68, -0.55, 0.27, 1.55); /* For elastic animations */

    /* Spacing (can use Bootstrap's spacing utilities or define more if needed) */
    --spacing-xs: 0.25rem;
    --spacing-sm: 0.5rem;
    --spacing-md: 1rem;
    --spacing-lg: 1.5rem;
    --spacing-xl: 3rem;

    /* Z-index */
    --z-index-sticky: 1020; /* Bootstrap's sticky */
    --z-index-dropdown: 1000;
    --z-index-modal: 1050;
    --z-index-cookie-popup: 9999;
}

/* Global Styles */
body {
    font-family: var(--font-secondary);
    color: var(--color-text-dark);
    background-color: var(--color-background-body);
    line-height: 1.7; /* Increased for better readability */
    font-size: 1rem; /* Base font size (16px) */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-primary);
    font-weight: 700; /* Bootstrap's default is often lighter */
    color: var(--color-text-darker);
    line-height: 1.3;
    margin-bottom: var(--spacing-md);
}

/* Adaptive Typography - Bootstrap's RFS handles this well. These are for reference/override. */
h1, .h1 { font-size: clamp(2rem, 1.625rem + 1.5vw, 3rem); font-weight: 800;} /* e.g. 40px for Manrope */
h2, .h2 { font-size: clamp(1.75rem, 1.4375rem + 1.25vw, 2.5rem); font-weight: 800; } /* e.g. 32px */
h3, .h3 { font-size: clamp(1.5rem, 1.25rem + 1vw, 2rem); }     /* e.g. 28px */
h4, .h4 { font-size: clamp(1.25rem, 1.125rem + 0.75vw, 1.75rem); }  /* e.g. 24px */

.lead {
    font-size: clamp(1.1rem, 1rem + 0.25vw, 1.25rem);
    font-weight: 400;
    color: var(--color-text-muted);
}

p {
    margin-bottom: var(--spacing-md);
    color: var(--color-text-dark);
}

a {
    color: var(--color-primary-medium);
    text-decoration: none;
    transition: color var(--transition-speed-fast) var(--transition-easing);
}
a:hover {
    color: var(--color-primary-dark);
    text-decoration: underline;
}

img {
    max-width: 100%;
    height: auto;
    display: block; /* Removes bottom space under images */
}

/* Utility Classes */
.section-title {
    margin-bottom: var(--spacing-sm);
    text-align: center;
    color: var(--color-text-darker);
    text-shadow: 1px 1px 2px rgba(0,0,0,0.05);
}
.section-title + .lead { /* Subtitle directly after main title */
    margin-top: calc(var(--spacing-sm) * -0.5); /* Pull up slightly */
    margin-bottom: var(--spacing-xl);
    text-align: center;
}

.text-primary-dark { color: var(--color-primary-dark) !important; }
.text-primary-medium { color: var(--color-primary-medium) !important; }
.text-primary-light { color: var(--color-primary-light) !important; }

.bg-primary-dark { background-color: var(--color-primary-dark) !important; }
.bg-primary-medium { background-color: var(--color-primary-medium) !important; }
.bg-primary-light { background-color: var(--color-primary-light) !important; }
.bg-primary-tint { background-color: var(--color-primary-bg-tint) !important; }

.object-cover {
    object-fit: cover;
    width: 100%;
    height: 100%;
}

/* Global Button Styles */
.btn, button, input[type="submit"], input[type="button"] {
    font-family: var(--font-secondary);
    font-weight: 500;
    padding: 0.75rem 1.75rem; /* Slightly more padding */
    border-radius: var(--border-radius-pill);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-width: 2px;
    border-style: solid;
    transition: all var(--transition-speed-normal) var(--transition-elastic); /* Elastic transition */
    cursor: pointer;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    user-select: none;
    font-size: 0.95rem;
}
.btn:hover, button:hover, input[type="submit"]:hover, input[type="button"]:hover {
    transform: translateY(-3px) scale(1.03); /* Elastic hover effect */
    box-shadow: var(--shadow-md);
}
.btn:active, button:active, input[type="submit"]:active, input[type="button"]:active {
    transform: translateY(-1px) scale(0.98); /* Click effect */
    box-shadow: var(--shadow-sm);
}

/* Primary Button */
.btn-primary {
    background-color: var(--color-primary-medium);
    border-color: var(--color-primary-medium);
    color: var(--color-text-on-primary);
}
.btn-primary:hover {
    background-color: var(--color-primary-dark);
    border-color: var(--color-primary-dark);
    color: var(--color-text-on-primary);
}

/* Outline Buttons */
.btn-outline-light { /* Specifically for light outlines on dark backgrounds */
    color: var(--color-text-light);
    border-color: var(--color-text-light);
    background-color: transparent;
}
.btn-outline-light:hover {
    background-color: var(--color-text-light);
    color: var(--color-primary-dark); /* Text color changes to dark on light bg */
    border-color: var(--color-text-light);
}

.btn-outline-primary {
    color: var(--color-primary-medium);
    border-color: var(--color-primary-medium);
    background-color: transparent;
}
.btn-outline-primary:hover {
    background-color: var(--color-primary-medium);
    color: var(--color-text-on-primary);
    border-color: var(--color-primary-medium);
}

/* Read More Link Style */
.read-more-link {
    display: inline-block;
    font-weight: 500;
    color: var(--color-primary-medium);
    text-decoration: none;
    position: relative;
    padding-bottom: 2px;
}
.read-more-link::after {
    content: '→';
    margin-left: var(--spacing-xs);
    transition: transform var(--transition-speed-fast) var(--transition-easing);
}
.read-more-link:hover {
    color: var(--color-primary-dark);
    text-decoration: none;
}
.read-more-link:hover::after {
    transform: translateX(4px);
}

/* Header & Navbar */
.navbar.sticky-top {
    box-shadow: var(--shadow-sm);
    background-color: var(--color-background-light) !important;
    padding-top: var(--spacing-sm);
    padding-bottom: var(--spacing-sm);
    transition: padding var(--transition-speed-normal) var(--transition-easing);
}
.navbar-brand {
    font-family: var(--font-primary);
    font-weight: 800;
    font-size: 1.75rem; /* Slightly larger */
    color: var(--color-primary-dark) !important;
}
.navbar-brand img {
    margin-right: var(--spacing-sm);
    height: 40px; /* Ensure consistent logo height */
}
.navbar-nav .nav-link {
    font-family: var(--font-secondary);
    font-weight: 500;
    color: var(--color-text-dark) !important;
    padding: var(--spacing-sm) var(--spacing-md);
    text-transform: uppercase;
    font-size: 0.9rem;
    letter-spacing: 0.5px;
    position: relative;
}
.navbar-nav .nav-link::after { /* Underline effect */
    content: '';
    position: absolute;
    bottom: 5px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 2px;
    background-color: var(--color-primary-medium);
    transition: width var(--transition-speed-normal) var(--transition-easing);
}
.navbar-nav .nav-link:hover::after,
.navbar-nav .nav-link.active::after {
    width: 70%;
}
.navbar-nav .nav-link.active {
    color: var(--color-primary-medium) !important;
    font-weight: 700;
}
.navbar-toggler {
    border: none;
    padding: var(--spacing-xs);
}
.navbar-toggler:focus {
    box-shadow: none;
}
.navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(0, 0, 0, 0.75)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.dropdown-menu {
    border-radius: var(--border-radius-sm);
    box-shadow: var(--shadow-md);
    border: 1px solid var(--border-color);
}
.dropdown-item {
    font-family: var(--font-secondary);
    font-weight: 500;
    color: var(--color-text-dark);
}
.dropdown-item:hover, .dropdown-item:focus {
    background-color: var(--color-primary-bg-tint);
    color: var(--color-primary-dark);
}
.dropdown-item.active {
    background-color: var(--color-primary-medium);
    color: var(--color-text-on-primary) !important;
}

/* Hero Section */
.hero-section {
    /* min-height: 85vh; Removed as per instruction, height determined by content and padding */
    padding-top: 10vh; /* Ensure content is visible below navbar */
    padding-bottom: 10vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed; /* Parallax effect */
    text-align: center;
    color: var(--color-text-on-primary) !important; /* Ensure white text */
}
.hero-section h1 {
    color: var(--color-text-on-primary) !important;
    text-shadow: 2px 2px 8px rgba(0,0,0,0.6);
    font-size: clamp(2.5rem, 2rem + 2.5vw, 4rem); /* Larger for hero */
}
.hero-section .lead {
    color: var(--color-text-light) !important; /* Lighter white for lead */
    opacity: 0.9;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
    font-size: clamp(1.2rem, 1.05rem + 0.5vw, 1.5rem);
}
.hero-section .btn {
    margin: var(--spacing-sm);
}

/* Section Default Padding */
section {
    padding-top: var(--spacing-xl);
    padding-bottom: var(--spacing-xl);
}
section:nth-of-type(even) { /* Alternate background for sections */
    background-color: var(--color-background-grey);
}
#hero + section { /* First section after hero */
    /* No special padding, rely on section default */
}


/* Card Styles (Generic) */
.card {
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-md);
    box-shadow: var(--shadow-sm);
    transition: transform var(--transition-speed-normal) var(--transition-elastic),
                box-shadow var(--transition-speed-normal) var(--transition-easing);
    background-color: var(--color-background-light);
    display: flex; /* For centering content */
    flex-direction: column;
    overflow: hidden; /* To contain image hover effects */
}
.card:hover {
    transform: translateY(-8px) scale(1.02); /* Elastic hover */
    box-shadow: var(--shadow-lg);
}

.card-image { /* Wrapper for images */
    width: 100%;
    overflow: hidden; /* For image zoom effect */
    display: flex; /* For centering */
    justify-content: center; /* Center image horizontally */
    align-items: center; /* Center image vertically */
    position: relative; /* For potential overlays */
}
/* Fixed height for consistent card image containers */
.portfolio-card .card-image, .news .card-image {
    height: 250px;
}
.methodology-card .card-image { /* For rounded images in methodology */
    height: 150px; /* Adjusted */
    width: 150px;
    margin: 0 auto; /* Center the circle itself */
    border-radius: 50%;
}
.gallery-section .card-image {
    height: 300px; /* Example, adjust as needed */
}
.card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Ensures image covers the container */
    transition: transform var(--transition-speed-slow) var(--transition-easing);
    margin: 0 auto; /* Center image within its container */
}
.card:hover .card-image img {
    transform: scale(1.1); /* Subtle zoom on hover */
}

.card-body {
    padding: var(--spacing-lg);
    display: flex;
    flex-direction: column;
    flex-grow: 1; /* Allows card body to fill remaining space */
    text-align: center; /* Center text content in cards */
}
.card-title {
    font-family: var(--font-primary);
    font-weight: 700;
    color: var(--color-primary-dark);
    margin-bottom: var(--spacing-sm);
    font-size: 1.3rem;
}
.card-text {
    color: var(--color-text-muted);
    font-size: 0.95rem;
    flex-grow: 1; /* Pushes buttons/links to bottom if needed */
    margin-bottom: var(--spacing-md);
}
.card .btn, .card .read-more-link {
    margin-top: auto; /* Pushes button to the bottom of the card body */
    align-self: center; /* Center button if card-body is flex */
}

/* Feature Section Specifics */
.feature-card .feature-icon {
    width: 80px; /* Adjusted size for better visual */
    height: 80px;
    background-color: var(--color-primary-bg-tint);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto var(--spacing-md) auto; /* Center icon */
    box-shadow: var(--shadow-sm);
}
.feature-card .feature-icon img {
    max-width: 50px;
    max-height: 50px;
    object-fit: contain;
    transform: none !important; /* No zoom for icons */
}
.feature-card .card-title {
    font-size: 1.4rem; /* Slightly larger for features */
}

/* Methodology Section Specifics */
.methodology-card {
    text-align: center;
}
.methodology-card .card-image img { /* For the circular images */
    border: 4px solid var(--color-primary-light);
    box-shadow: var(--shadow-sm);
}
.methodology-card .card-body {
    padding-top: var(--spacing-sm);
}
.progress {
    height: 8px; /* More visible progress bar */
    border-radius: var(--border-radius-pill);
    background-color: var(--color-primary-bg-tint);
}
.progress-bar {
    background-color: var(--color-primary-medium);
    border-radius: var(--border-radius-pill);
}

/* Case Studies & Events (Cards with horizontal layout on larger screens) */
#case-studies .card, #events .card {
    flex-direction: row; /* Horizontal layout for these cards */
}
#case-studies .card-image, #events .card-image {
    flex: 0 0 40%; /* Image takes 40% width */
    height: auto; /* Auto height for row layout */
    min-height: 250px; /* Minimum height to ensure visibility */
}
#case-studies .card-image img, #events .card-image img {
    border-top-right-radius: 0;
    border-bottom-left-radius: var(--border-radius-md);
}
#case-studies .card-body, #events .card-body {
    text-align: left; /* Align text left for these cards */
    flex: 1 1 60%;
    align-self: stretch; /* Ensure body stretches */
}
@media (max-width: 768px) { /* Stack on smaller screens */
    #case-studies .card, #events .card {
        flex-direction: column;
    }
    #case-studies .card-image, #events .card-image {
        flex-basis: auto;
        height: 250px; /* Reset height for stacked view */
    }
    #case-studies .card-image img, #events .card-image img {
        border-bottom-left-radius: 0;
        border-top-right-radius: var(--border-radius-md);
    }
    #case-studies .card-body, #events .card-body {
        text-align: center;
    }
}

/* Gallery Section */
#gallery .gsap-zoom-in a { /* Image wrapper for lightbox */
    display: block;
    border-radius: var(--border-radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-md);
    position: relative;
}
#gallery .gsap-zoom-in img {
    border-radius: var(--border-radius-md);
    transition: transform var(--transition-speed-slow) var(--transition-easing), filter var(--transition-speed-normal) var(--transition-easing);
}
#gallery .gsap-zoom-in a::before { /* Hover overlay for gallery */
    content: '\F4E0'; /* Bootstrap Icons search icon (example) or FontAwesome */
    font-family: 'bootstrap-icons'; /* Requires Bootstrap Icons font */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.8);
    font-size: 3rem;
    color: var(--color-text-on-primary);
    background-color: rgba(0,0,0,0.3);
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    border-radius: var(--border-radius-md);
    transition: opacity var(--transition-speed-normal) var(--transition-easing), transform var(--transition-speed-normal) var(--transition-elastic);
    z-index: 1;
}
#gallery .gsap-zoom-in a:hover img {
    transform: scale(1.1);
    filter: brightness(0.8);
}
#gallery .gsap-zoom-in a:hover::before {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
}

/* Stats Section */
#stats {
    background-color: var(--color-primary-medium); /* Fallback if image fails */
    color: var(--color-text-on-primary);
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed; /* Parallax */
    position: relative;
}
#stats::before { /* Dark overlay for text readability */
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: var(--gradient-dark-overlay);
    z-index: 0;
}
#stats .container {
    position: relative; /* To be above the overlay */
    z-index: 1;
}
#stats .section-title, #stats h3, #stats p {
    color: var(--color-text-on-primary) !important;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.4);
}
#stats h3 .counter {
    font-weight: 800;
}

/* External Resources Section */
#resources-external .list-group-item {
    transition: background-color var(--transition-speed-fast) var(--transition-easing),
                transform var(--transition-speed-normal) var(--transition-elastic);
    border-left: 4px solid transparent;
}
#resources-external .list-group-item:hover {
    background-color: var(--color-primary-bg-tint);
    transform: translateX(5px);
    border-left-color: var(--color-primary-medium);
}
#resources-external .list-group-item h5 {
    color: var(--color-primary-dark);
}
#resources-external .list-group-item p {
    font-size: 0.9rem;
    color: var(--color-text-muted);
}

/* Contact Section */
#contact .contact-form {
    background-color: var(--color-background-light);
    padding: var(--spacing-xl);
    border-radius: var(--border-radius-lg); /* More corporate feel */
    box-shadow: var(--shadow-lg);
}
#contact .form-control {
    border-radius: var(--border-radius-sm);
    padding: 0.9rem 1rem;
    border: 1px solid var(--border-color);
    transition: border-color var(--transition-speed-fast) var(--transition-easing),
                box-shadow var(--transition-speed-fast) var(--transition-easing);
}
#contact .form-control:focus {
    border-color: var(--color-primary-medium);
    box-shadow: 0 0 0 0.25rem rgba(var(--color-primary-medium-rgb, 25, 118, 210), 0.25); /* Requires RGB var if used */
}
/* Placeholder for --color-primary-medium-rgb: 25, 118, 210; */
#contact .form-label {
    font-weight: 500;
    color: var(--color-text-dark);
    margin-bottom: var(--spacing-xs);
}
#contact .form-check-label a {
    color: var(--color-primary-dark);
}

/* Footer */
footer {
    background-color: var(--color-text-darker); /* Dark corporate footer */
    color: var(--color-text-muted);
    padding-top: var(--spacing-xl);
    padding-bottom: var(--spacing-xl);
}
footer h5 {
    font-family: var(--font-primary);
    color: var(--color-primary-light); /* Brighter heading for dark footer */
    text-transform: uppercase;
    font-size: 1.1rem;
    letter-spacing: 0.5px;
    margin-bottom: var(--spacing-lg);
}
footer p {
    color: var(--color-text-muted);
    font-size: 0.95rem;
    line-height: 1.8;
}
footer a.footer-link {
    color: var(--color-text-muted);
    text-decoration: none;
    transition: color var(--transition-speed-fast) var(--transition-easing),
                padding-left var(--transition-speed-fast) var(--transition-easing);
}
footer a.footer-link:hover {
    color: var(--color-primary-very-light);
    padding-left: 5px; /* Slight indent on hover */
    text-decoration: none;
}
footer .list-inline-item {
    margin-right: var(--spacing-md);
}
footer .list-inline-item:last-child {
    margin-right: 0;
}
/* Text-based social links in footer */
footer .list-inline-item a.footer-link {
    font-size: 0.9rem;
    text-transform: capitalize; /* e.g., Facebook, Instagram */
}
footer .footer-link-highlighted { /* For designer credit or important links */
    color: var(--color-primary-light);
    font-weight: 500;
}
footer .footer-link-highlighted:hover {
    color: var(--color-text-light);
}
footer hr {
    border-color: rgba(255,255,255,0.1);
}

/* Specific Page Styles */
/* success.html */
.success-page-container { /* Add this class to the body or a main wrapper in success.html */
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
.success-page-container main.container { /* Target the main content area */
    flex-grow: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}
.success-container { /* The div directly holding success message */
    text-align: center;
    padding: var(--spacing-xl);
}
.success-icon {
    font-size: 5rem; /* Larger icon */
    color: var(--color-success);
    margin-bottom: var(--spacing-lg);
    animation: elasticPopIn 0.8s var(--transition-elastic) forwards;
}
@keyframes elasticPopIn {
    0% { transform: scale(0.5); opacity: 0; }
    60% { transform: scale(1.1); opacity: 1; }
    80% { transform: scale(0.95); }
    100% { transform: scale(1); opacity: 1; }
}

/* privacy.html & terms.html */
.privacy-page-main, .terms-page-main { /* Add class to <main> on these pages */
    padding-top: 100px !important; /* To avoid header overlap */
}
.privacy-page-main h1, .terms-page-main h1 {
    margin-bottom: var(--spacing-lg);
}
.privacy-page-main h3, .terms-page-main h3 {
    color: var(--color-primary-dark);
    margin-top: var(--spacing-lg);
    margin-bottom: var(--spacing-sm);
    font-size: 1.5rem;
}
.privacy-page-main ul, .terms-page-main ol {
    padding-left: var(--spacing-lg);
}
.privacy-page-main li, .terms-page-main li {
    margin-bottom: var(--spacing-sm);
}

/* Cookie Consent Popup */
#cookieConsentPopup {
    /* Position fixed at bottom, dark semi-transparent bg is handled in HTML style */
    /* Button styles will be inherited from global button styles if class .btn is used */
    z-index: var(--z-index-cookie-popup);
}
#cookieConsentPopup p {
    color: var(--color-text-light);
    margin-bottom: var(--spacing-md);
}
#cookieConsentPopup p a {
    color: var(--color-primary-very-light);
    text-decoration: underline;
}
#cookieConsentPopup button { /* Specific styling if needed */
    background-color: var(--color-primary-medium);
    color: var(--color-text-on-primary);
    border: none;
}
#cookieConsentPopup button:hover {
    background-color: var(--color-primary-dark);
}


/* GSAP Animation Placeholders (Styles for initial state, JS handles the animation) */
.gsap-fade-in-up, .gsap-fade-in-left, .gsap-fade-in-right, .gsap-zoom-in {
    opacity: 0; /* Initial state for GSAP animations */
    /* transform will be set by GSAP */
}


/* Responsive Adjustments (Bootstrap handles most, add custom tweaks if necessary) */
@media (max-width: 991.98px) { /* Medium devices (tablets, less than 992px) */
    .navbar-nav .nav-link {
        padding: var(--spacing-sm) 0; /* Adjust padding for collapsed menu */
        text-align: center;
    }
    .navbar-nav .nav-link::after {
        left: 0;
        transform: none;
        width: 0; /* Reset for mobile, active state can be handled differently if needed */
    }
    .navbar-nav .nav-link.active {
        background-color: var(--color-primary-bg-tint);
        border-radius: var(--border-radius-sm);
    }
    .navbar-nav .nav-link.active::after {
        width: 0; /* No underline for active in mobile */
    }
    .hero-section h1 {
        font-size: clamp(2rem, 1.5rem + 3vw, 3rem);
    }
    .hero-section .lead {
        font-size: clamp(1rem, 0.9rem + 0.5vw, 1.25rem);
    }
}

@media (max-width: 767.98px) { /* Small devices (landscape phones, less than 768px) */
    section {
        padding-top: calc(var(--spacing-xl) * 0.8);
        padding-bottom: calc(var(--spacing-xl) * 0.8);
    }
    .section-title {
        font-size: clamp(1.5rem, 1.25rem + 1vw, 2rem);
    }
    .section-title + .lead {
        margin-bottom: var(--spacing-lg);
    }
    .btn, button, input[type="submit"], input[type="button"] {
        padding: 0.65rem 1.5rem;
        font-size: 0.9rem;
    }
    footer .text-md-start { /* Ensure footer text is centered on small screens */
        text-align: center !important;
    }
    footer .text-md-end {
        text-align: center !important;
        margin-top: var(--spacing-md);
    }
}