:root {
    /* Color Scheme - Neutral with Primary Accent */
    --bg-color: #e0e5ec;
    --bg-color-alt: #dde1e7; 
    --text-color: #363636; /* Darker text for better contrast, Bulma default */
    --text-color-light: #5a5a5a;
    --heading-color: #2c3e50; /* Dark blueish grey for headings */
    --primary-color: #48c78e; /* Bulma primary-like green/teal */
    --primary-color-dark: #3aa373;
    --primary-color-light: #60d9a5;
    --white-color: #ffffff;
    --grey-color: #7a7a7a;
    --light-grey-color: #f5f5f5;

    /* Neumorphic Shadows based on --bg-color */
    --light-shadow-color: rgba(255, 255, 255, 0.8); 
    --dark-shadow-color: rgba(163, 177, 198, 0.7); 

    --neumorphic-shadow-concave: inset 6px 6px 12px var(--dark-shadow-color),
                                 inset -6px -6px 12px var(--light-shadow-color);
    --neumorphic-shadow-convex: 6px 6px 12px var(--dark-shadow-color),
                                -6px -6px 12px var(--light-shadow-color);
    --neumorphic-shadow-flat-hover: 4px 4px 8px var(--dark-shadow-color),
                                   -4px -4px 8px var(--light-shadow-color);

    /* Fonts */
    --font-primary: 'Oswald', "Helvetica Neue", Helvetica, Arial, sans-serif;
    --font-secondary: 'Nunito', "Helvetica Neue", Helvetica, Arial, sans-serif;

    /* Spacing & Borders */
    --base-padding: 1.5rem;
    --section-padding-Y: 4rem;
    --section-padding-X: 1.5rem;
    --card-padding: 1.5rem;
    --border-radius-soft: 8px;
    --border-radius-medium: 15px;
    --border-radius-large: 20px;

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

html {
    scroll-behavior: smooth;
    font-size: 16px; 
    background-color: var(--bg-color); /* Set base html background */
}

body {
    font-family: var(--font-secondary);
    color: var(--text-color);
    background-color: var(--bg-color);
    line-height: 1.65;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Adaptive Typography & Headings */
h1, .title.is-1,
h2, .title.is-2, .section-title,
h3, .title.is-3,
h4, .title.is-4, .card-title,
h5, .title.is-5 {
    font-family: var(--font-primary);
    color: var(--heading-color);
    font-weight: 500; /* Oswald is quite bold already */
    line-height: 1.25;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.05);
}

h1, .title.is-1 { font-size: clamp(2.6rem, 5.5vw, 4.5rem); }
h2, .title.is-2, .section-title { font-size: clamp(2.1rem, 4.5vw, 3.5rem); margin-bottom: 1rem; text-align: center;}
h3, .title.is-3 { font-size: clamp(1.7rem, 3.5vw, 2.7rem); }
h4, .title.is-4, .card-title { font-size: clamp(1.3rem, 2.8vw, 2rem); }
h5, .title.is-5 { font-size: clamp(1.1rem, 2.2vw, 1.7rem); }

p, .content p { /* .subtitle is handled by Bulma, or custom .section-subtitle */
    font-family: var(--font-secondary);
    font-size: clamp(1rem, 1.8vw, 1.1rem);
    color: var(--text-color-light);
    margin-bottom: 1.25rem;
}

.section-subtitle {
    font-size: clamp(1.05rem, 2vw, 1.3rem);
    color: var(--text-color);
    margin-bottom: 3rem;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

a {
    color: var(--primary-color);
    font-weight: 600;
    text-decoration: none;
    transition: color var(--transition-speed) var(--transition-timing);
}
a:hover {
    color: var(--primary-color-dark);
    text-decoration: underline;
}

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

/* Global Button Styles - Neumorphic */
.button, button, input[type="submit"], input[type="button"] {
    background-color: var(--bg-color);
    color: var(--primary-color);
    border: none;
    border-radius: var(--border-radius-medium);
    padding: 0.8em 1.6em;
    font-weight: 700; /* Nunito bold for buttons */
    font-family: var(--font-secondary);
    box-shadow: var(--neumorphic-shadow-convex);
    transition: all var(--transition-speed) var(--transition-timing);
    text-shadow: 1px 1px 0px var(--light-shadow-color);
    letter-spacing: 0.5px;
    cursor: pointer;
}
.button:hover, button:hover, input[type="submit"]:hover, input[type="button"]:hover {
    box-shadow: var(--neumorphic-shadow-flat-hover);
    color: var(--primary-color-dark);
    transform: translateY(-2px);
}
.button:active, button:active, input[type="submit"]:active, input[type="button"]:active {
    box-shadow: var(--neumorphic-shadow-concave);
    transform: translateY(1px);
}

/* Bulma .is-primary button adjustments */
.button.is-primary {
    background-color: var(--primary-color);
    color: var(--white-color);
    text-shadow: none; /* Better contrast */
    box-shadow: var(--neumorphic-shadow-convex); /* Maintain neumorphic shadow type */
}
.button.is-primary:hover {
    background-color: var(--primary-color-dark);
    color: var(--white-color);
    box-shadow: var(--neumorphic-shadow-flat-hover);
}
.button.is-primary:active {
    background-color: var(--primary-color-dark);
    box-shadow: var(--neumorphic-shadow-concave);
}

.button.is-info { /* If used for "View All Projects" etc. */
    background-color: #3298dc; /* Bulma info color */
    color: var(--white-color);
    text-shadow: none;
}
.button.is-info:hover {
    background-color: #2779bd;
}

/* Small button variant */
.button.is-small, .neumorphic-button-sm {
    padding: 0.5em 1em;
    font-size: 0.85rem;
    border-radius: var(--border-radius-soft);
}

/* Global Form Input Styles - Neumorphic */
.input, .textarea,
.neumorphic-input, .neumorphic-textarea { /* For custom usage */
    background-color: var(--bg-color);
    border: none; /* Remove Bulma border */
    border-radius: var(--border-radius-medium);
    padding: 0.9em 1.2em;
    box-shadow: var(--neumorphic-shadow-concave);
    color: var(--text-color);
    font-family: var(--font-secondary);
    font-size: 1rem;
    transition: box-shadow var(--transition-speed) var(--transition-timing), border-color var(--transition-speed) var(--transition-timing);
    -webkit-appearance: none; /* remove default iOS styling */
}
.input::placeholder, .textarea::placeholder {
    color: var(--grey-color);
}
.input:focus, .textarea:focus {
    outline: none;
    box-shadow: var(--neumorphic-shadow-concave), 0 0 0 2px var(--primary-color-light);
}

/* Layout and Sections */
.main-container {
    overflow-x: hidden;
}
.section {
    padding: var(--section-padding-Y) var(--section-padding-X);
    background-color: var(--bg-color); /* Base section background */
}
.section.section-alternative-bg {
    background-color: var(--bg-color-alt);
}
.section.section-alternative-bg .neumorphic-card,
.section.section-alternative-bg .button, /* non-primary */
.section.section-alternative-bg .input,
.section.section-alternative-bg .textarea {
    background-color: var(--bg-color-alt); /* Adapt neumorphic elements to alt background */
}

.container {
    max-width: 1152px; /* Bulma default */
    margin-left: auto;
    margin-right: auto;
}

/* Header / Navbar */
.header.is-sticky {
    position: sticky;
    top: 0;
    width: 100%;
    z-index: 1030; /* Above other content */
    transition: box-shadow var(--transition-speed) var(--transition-timing);
}
.neumorphic-header {
    background-color: var(--bg-color);
    box-shadow: var(--neumorphic-shadow-convex);
}
.navbar {
    background-color: transparent;
    min-height: 4.5rem;
}
.navbar-item, .navbar-link {
    font-family: var(--font-secondary);
    font-weight: 700; /* Bolder nav items */
    font-size: 1rem;
    color: var(--text-color);
    transition: color var(--transition-speed) var(--transition-timing);
    padding: 0.5rem 1rem;
}
.navbar-item:hover, .navbar-link:hover,
.navbar-item.is-active, .navbar-link.is-active {
    background-color: transparent;
    color: var(--primary-color);
}
.navbar-brand .navbar-item.logo-text {
    font-family: var(--font-primary);
    font-size: 1.7rem;
    font-weight: 700;
    color: var(--heading-color);
    padding-left: 0; /* Align with container edge */
}
.logo-accent { color: var(--primary-color); margin-left: 0.1em; }

.navbar-burger { color: var(--heading-color); }
.navbar-burger span { background-color: var(--heading-color); height: 2px; width: 20px; border-radius: 2px;}
.navbar-burger.is-active span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.navbar-burger.is-active span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

@media screen and (max-width: 1023px) {
    .navbar-menu {
        background-color: var(--bg-color);
        box-shadow: var(--neumorphic-shadow-concave);
        padding: 0.5rem 0;
        border-radius: 0 0 var(--border-radius-soft) var(--border-radius-soft);
        margin-top: 2px; /* Small gap from header bar */
    }
}

/* Hero Section */
.hero.hero-bg {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.hero-title {
    font-size: clamp(2.5rem, 6vw, 5rem);
    color: var(--white-color) !important;
    text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.6);
    margin-bottom: 0.6em;
}
.hero-subtitle {
    font-size: clamp(1.1rem, 2.5vw, 1.6rem);
    color: var(--white-color) !important;
    text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.5);
    max-width: 650px;
    margin: 0 auto 1.2em auto;
    line-height: 1.5;
}
.hero .button.is-primary {
    margin-top: 1.2em;
    padding: 0.9em 1.8em;
    font-size: 1.05rem;
}

/* General Card Styles */
.neumorphic-card {
    background-color: var(--bg-color); 
    border-radius: var(--border-radius-large);
    box-shadow: var(--neumorphic-shadow-convex);
    padding: var(--card-padding);
    transition: transform var(--transition-speed) var(--transition-timing), box-shadow var(--transition-speed) var(--transition-timing);
    height: 100%; 
    display: flex;
    flex-direction: column;
    overflow: hidden; /* Ensures child elements don't break border radius */
}
.neumorphic-card:hover {
    transform: translateY(-6px);
    box-shadow: 10px 10px 20px var(--dark-shadow-color), -10px -10px 20px var(--light-shadow-color);
}

.card .card-image { /* Bulma */
    text-align: center; /* Center the figure */
}
.card .card-image .image-container { /* Custom HTML class */
    border-radius: var(--border-radius-medium);
    overflow: hidden;
    margin-bottom: 1.2rem;
    box-shadow: var(--neumorphic-shadow-concave);
    width: 100%;
    position: relative; /* For potential overlays or aspect ratio */
}
.card .card-image .image-container img {
    width: 100%;
    height: 200px; /* Default fixed height for card images */
    object-fit: cover;
    display: block;
    border-radius: var(--border-radius-medium);
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.neumorphic-card:hover .card-image .image-container img {
    transform: scale(1.08);
}

.card .card-content { /* Bulma */
    padding: 0.25rem; /* Adjust padding as .neumorphic-card has its own */
    flex-grow: 1; /* Allows content to fill space, useful for flex cards */
    display: flex;
    flex-direction: column;
}
.card .card-content .card-title {
    margin-bottom: 0.6rem;
    color: var(--heading-color);
}
.card .card-content .content {
    font-size: 0.9rem;
    color: var(--text-color-light);
    line-height: 1.55;
    flex-grow: 1; /* Push actions to bottom if any */
}
.card .card-content .content p { font-size: inherit; }

/* "Read More" Link Styling */
a.button.is-small.is-link.neumorphic-button-sm {
    background-color: transparent;
    color: var(--primary-color);
    border: 1px solid var(--primary-color);
    font-size: 0.75rem;
    font-weight: 700;
    border-radius: var(--border-radius-soft);
    text-transform: uppercase;
    letter-spacing: 0.6px;
    box-shadow: none;
    margin-top: auto; /* Pushes button to bottom of card-content */
    align-self: flex-start; /* Align to left */
}
a.button.is-small.is-link.neumorphic-button-sm:hover {
    background-color: var(--primary-color);
    color: var(--white-color);
    transform: translateY(-1px);
}

/* Specific Card Image Heights */
.service-card .card-image .image-container img { height: 200px; }
.project-card .card-image .image-container img { height: 220px; }
.blog-post-card .card-image .image-container img { height: 180px; }

/* Methodology Section */
#methodology .image-container.neumorphic-image-frame img {
    border-radius: var(--border-radius-large);
}
.neumorphic-progress {
    height: 1rem;
    border-radius: var(--border-radius-soft);
    background-color: var(--bg-color);
    box-shadow: var(--neumorphic-shadow-concave);
    padding: 2px;
}
.neumorphic-progress::-webkit-progress-bar { background-color: transparent; border-radius: var(--border-radius-soft); }
.neumorphic-progress::-webkit-progress-value { background-color: var(--primary-color); border-radius: calc(var(--border-radius-soft) - 2px); transition: width var(--transition-speed) ease-in-out; }
.neumorphic-progress::-moz-progress-bar { background-color: var(--primary-color); border-radius: calc(var(--border-radius-soft) - 2px); }

/* Our Process Section */
.process-steps .step-card { text-align: center; padding: 1.8rem 1.2rem; }
.process-steps .step-icon i { /* Styles the number '1', '2' etc. */
    font-style: normal;
    font-weight: bold;
    font-family: var(--font-primary);
    display: inline-flex; /* Use flex for centering */
    align-items: center;
    justify-content: center;
    width: 55px;
    height: 55px;
    line-height: 55px; /* For older browsers */
    border-radius: 50%;
    background-color: var(--primary-color);
    color: var(--white-color);
    font-size: 1.5rem;
    margin-bottom: 1rem;
    box-shadow: 0 0 0 4px var(--bg-color), var(--neumorphic-shadow-convex);
}
.process-steps .step-title { margin-top: 0.5rem; margin-bottom: 0.5rem; font-size: 1.25rem; }

/* Partners Section */
.partners-logos .partner-logo-container {
    margin: 0 auto 0.5rem auto;
    padding: 0.8rem;
    background-color: var(--bg-color);
    border-radius: var(--border-radius-medium);
    box-shadow: var(--neumorphic-shadow-convex);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 110px; height: 110px;
    transition: all var(--transition-speed) var(--transition-timing);
}
.partners-logos .partner-logo-container:hover { transform: scale(1.08) translateY(-4px); box-shadow: var(--neumorphic-shadow-flat-hover); }
.partners-logos .partner-logo-container img { max-height: 70px; object-fit: contain; }
.partners-logos .partner-name { font-size: 0.85rem; font-weight: 600; color: var(--text-color-light); margin-top: 0.3rem; }

/* Press Section, Resource Cards, Case Studies similar styling */
.press-mention, .resource-card .card-content, .case-study-card .card-content { padding: 1.2rem; }
.press-mention .press-outlet, .resource-card .resource-title, .case-study-card .title.is-4 { margin-bottom: 0.3rem; }
.resource-card .resource-title a { color: var(--heading-color); font-weight: 500; }
.resource-card .resource-title a:hover { color: var(--primary-color); }
.resource-card .resource-description { font-size: 0.85rem; margin-bottom: 0.6rem; }

/* Footer */
.neumorphic-footer {
    background-color: var(--bg-color-alt);
    color: var(--text-color-light);
    padding: 3rem var(--section-padding-X) 2rem;
    box-shadow: var(--neumorphic-shadow-concave); /* Inset from top */
    margin-top: 3rem;
}
.neumorphic-footer .footer-title { color: var(--heading-color); margin-bottom: 0.8rem; }
.neumorphic-footer .footer-text { font-size: 0.9rem; line-height: 1.6; color: var(--text-color-light); }
.neumorphic-footer .footer-links li { margin-bottom: 0.4rem; }
.neumorphic-footer .footer-links a { color: var(--text-color-light); font-size: 0.9rem; font-weight: 500; }
.neumorphic-footer .footer-links a:hover { color: var(--primary-color); text-decoration: none; }

.neumorphic-footer .social-links li { display: inline-block; margin-right: 0.5rem; }
.neumorphic-footer .social-links li:last-child { margin-right: 0; }
.neumorphic-footer .social-links a {
    font-weight: 600;
    font-size: 0.9rem;
    padding: 0.4em 0.8em;
    border-radius: var(--border-radius-soft);
    transition: background-color var(--transition-speed), color var(--transition-speed);
    display: inline-block; /* For padding to apply correctly */
}
.neumorphic-footer .social-links a:hover {
    background-color: var(--primary-color-light);
    color: var(--white-color);
    text-decoration: none;
}
.neumorphic-footer .footer-hr { border-top: 1px solid var(--dark-shadow-color); margin: 1.8rem 0; background-color: transparent; height: 1px; }

/* Animations (JS controlled) */
/*.animate-on-scroll { opacity: 0; transform: translateY(25px); transition: opacity 0.7s var(--transition-timing), transform 0.7s var(--transition-timing); }*/
.animate-on-scroll.is-visible { opacity: 1; transform: translateY(0); }

/* Specific Page Styles */
body.success-page { display: flex; flex-direction: column; min-height: 100vh; background-color: var(--bg-color); }
.success-page .main-container { flex-grow: 1; display: flex; align-items: center; justify-content: center; text-align: center; padding: 2rem; }
.success-page .success-content {
    background-color: var(--bg-color); /* Match body or use alt */
    padding: 2.5rem;
    border-radius: var(--border-radius-large);
    box-shadow: var(--neumorphic-shadow-convex);
    max-width: 550px;
}
.success-page .success-content .icon { color: var(--primary-color); font-size: 3.5rem; margin-bottom: 1rem; }
.success-page .success-content h1 { font-size: clamp(1.8rem, 4vw, 2.5rem); margin-bottom: 0.8rem;}
.success-page .success-content p { font-size: clamp(1rem, 2vw, 1.15rem); margin-bottom: 1.5rem;}

body.privacy-page .main-container, body.terms-page .main-container { padding-top: calc(4.5rem + 2rem); /* header height + spacing */ }
.privacy-page .section, .terms-page .section {
    background-color: var(--bg-color);
    border-radius: var(--border-radius-large);
    box-shadow: var(--neumorphic-shadow-convex);
    margin: 0 auto 2rem auto;
    padding: 2rem 2.5rem;
    max-width: 850px;
}
.privacy-page h1, .terms-page h1 { text-align: center; margin-bottom: 2rem; } /* Assuming h1 for page title */
.privacy-page h2, .terms-page h2 { text-align: left; margin-top: 2rem; margin-bottom: 1rem;} /* Section titles within page */
.privacy-page p, .terms-page p, .privacy-page li, .terms-page li { text-align: left; line-height: 1.7; }
.privacy-page ul, .terms-page ul { list-style: disc; list-style-position: outside; margin-left: 1.5em; margin-bottom: 1em; }
.privacy-page ul li, .terms-page ul li { margin-bottom: 0.5em; }

/* Responsive Adjustments */
@media screen and (max-width: 768px) {
    .section { padding: var(--section-padding-Y) 1rem; } /* Less horizontal padding on mobile */
    .process-steps .column.is-one-quarter { width: 100%; margin-bottom: 1.5rem; }
    .neumorphic-footer .columns { text-align: center; }
    .neumorphic-footer .column { margin-bottom: 1.5rem; }

    body.privacy-page .main-container, body.terms-page .main-container { padding-top: calc(4.5rem + 1rem); }
    .privacy-page .section, .terms-page .section { padding: 1.5rem; }
}