:root {
  /* Fonts */
  --font-family-headings: 'Roboto', sans-serif;
  --font-family-body: 'Lato', sans-serif;

  /* Base Colors (Neomorphism Light Theme) */
  --color-background: #E0E5EC;
  --color-background-secondary: #D1D9E6; /* Slightly darker for contrast on some sections */
  --color-text-primary: #3D4A5D; /* Dark blue-grey for main text */
  --color-text-secondary: #5A677B;
  --color-text-headings: #2C3A4B; /* Even darker for headings */
  --color-text-light: #FFFFFF;
  --color-text-link: #4A8CD8;
  --color-text-link-hover: #5D9CEC;

  /* Triadic Palette - Muted for Neomorphism Harmony */
  --color-primary: #5D9CEC;    /* Main accent - Soft Blue */
  --color-primary-dark: #4A8CD8;
  --color-primary-light: #7FB7F0;

  --color-secondary: #FFC857;  /* Accent 2 - Muted Gold/Yellow */
  --color-secondary-dark: #F0B440;

  --color-tertiary: #E57373;   /* Accent 3 - Soft Coral/Red */
  --color-tertiary-dark: #D96161;

  /* Neomorphism Shadows */
  --shadow-color-light: rgba(255, 255, 255, 0.7);
  --shadow-color-dark: rgba(163, 177, 198, 0.6);

  --neumorphic-shadow-convex: 8px 8px 16px var(--shadow-color-dark), -8px -8px 16px var(--shadow-color-light);
  --neumorphic-shadow-concave: inset 8px 8px 16px var(--shadow-color-dark), inset -8px -8px 16px var(--shadow-color-light);
  --neumorphic-shadow-flat: 5px 5px 10px var(--shadow-color-dark), -5px -5px 10px var(--shadow-color-light);
  --neumorphic-shadow-card: 6px 6px 12px var(--shadow-color-dark), -6px -6px 12px var(--shadow-color-light);
  --neumorphic-shadow-input: inset 4px 4px 8px var(--shadow-color-dark), inset -4px -4px 8px var(--shadow-color-light);
  --neumorphic-shadow-button-hover: 4px 4px 8px var(--shadow-color-dark), -4px -4px 8px var(--shadow-color-light);


  /* Spacing & Sizing */
  --spacing-unit: 1rem;
  --border-radius-soft: 20px;
  --border-radius-medium: 12px;
  --border-radius-sharp: 8px;

  /* Transitions */
  --transition-smooth: all 0.3s ease-in-out;
  --transition-fast: all 0.15s ease-in-out;
}

/* Global Styles */
html {
  scroll-behavior: smooth;
  background-color: var(--color-background);
}

body {
  font-family: var(--font-family-body);
  color: var(--color-text-primary);
  background-color: var(--color-background);
  line-height: 1.7;
  font-size: 16px;
  overflow-x: hidden; /* Prevent horizontal scroll from AOS or other effects */
  padding-top: 0px !important;
}

.main-container {
  overflow-x: hidden; /* Helps manage wide elements or animations */
}

h1, h2, h3, h4, h5, h6, .title, .subtitle {
  font-family: var(--font-family-headings);
  color: var(--color-text-headings);
  font-weight: 700;
  text-shadow: 1px 1px 2px rgba(0,0,0,0.1); /* Subtle text shadow for headings */
}

.title.is-1 { font-size: 3rem; }
.title.is-2 { font-size: 2.5rem; margin-bottom: 1.5rem; }
.title.is-3 { font-size: 2rem; }
.title.is-4 { font-size: 1.5rem; }
.title.is-5 { font-size: 1.25rem; }

.subtitle {
  color: var(--color-text-secondary);
  font-weight: 400;
}

a {
  color: var(--color-text-link);
  transition: var(--transition-smooth);
  text-decoration: none;
}

a:hover {
  color: var(--color-text-link-hover);
  text-decoration: underline;
}

.section {
  padding: 4rem 1.5rem; /* More vertical padding */
  background-color: var(--color-background);
}

.section.section-secondary {
  background-color: var(--color-background-secondary);
}

.section-title {
  margin-bottom: 2.5rem !important; /* Increased margin for section titles */
  color: var(--color-text-headings);
  text-shadow: 1px 1px 3px rgba(0,0,0,0.1);
}

.content p {
  margin-bottom: 1.25em;
}

/* Neomorphic Base Styles */
.neomorphic-card, .neomorphic-form, .neomorphic-button, .neomorphic-input, .neomorphic-textarea, .neomorphic-stat-card, .neomorphic-progress, .neomorphic-button-flat {
  background-color: var(--color-background);
  border-radius: var(--border-radius-soft);
  box-shadow: var(--neumorphic-shadow-convex);
  transition: var(--transition-smooth);
  position: relative;
}
.section-secondary .neomorphic-card, .section-secondary .neomorphic-form, .section-secondary .neomorphic-button, .section-secondary .neomorphic-input, .section-secondary .neomorphic-textarea, .section-secondary .neomorphic-stat-card, .section-secondary .neomorphic-progress, .section-secondary .neomorphic-button-flat {
    background-color: var(--color-background-secondary);
}


/* Global Button Styles (Overrides Bulma) */
.button, button, input[type="submit"], input[type="button"], input[type="reset"] {
  font-family: var(--font-family-headings);
  font-weight: 700;
  border-radius: var(--border-radius-medium) !important; /* Ensure this overrides Bulma */
  border: none;
  padding: 0.8em 1.8em !important;
  transition: var(--transition-fast) !important;
  cursor: pointer;
  box-shadow: var(--neumorphic-shadow-flat) !important;
  background-color: var(--color-background) !important;
  color: var(--color-primary) !important;
  text-shadow: none !important; /* Remove Bulma's default text shadow */
}

.button:hover, button:hover, input[type="submit"]:hover, input[type="button"]:hover, input[type="reset"]:hover {
  box-shadow: var(--neumorphic-shadow-button-hover) !important;
  transform: translateY(-2px);
  color: var(--color-primary-dark) !important;
}

.button:active, button:active, input[type="submit"]:active, input[type="button"]:active, input[type="reset"]:active {
  box-shadow: var(--neumorphic-shadow-concave) !important;
  transform: translateY(1px);
}

.button.is-primary, input[type="submit"].is-primary {
  background-color: var(--color-primary) !important;
  color: var(--color-text-light) !important;
  box-shadow: var(--neumorphic-shadow-flat) !important; /* Apply neomorphic shadow */
}

.button.is-primary:hover, input[type="submit"].is-primary:hover {
  background-color: var(--color-primary-dark) !important;
  color: var(--color-text-light) !important;
  box-shadow: var(--neumorphic-shadow-button-hover) !important;
}

.button.is-primary:active, input[type="submit"].is-primary:active {
  background-color: var(--color-primary-dark) !important;
  box-shadow: var(--neumorphic-shadow-concave) !important; /* Inset shadow on active */
}

.neomorphic-button-flat { /* For switches or less prominent buttons */
    padding: 0.6em 1.2em;
    box-shadow: var(--neumorphic-shadow-flat);
    color: var(--color-text-secondary);
}
.neomorphic-button-flat.is-active, .neomorphic-button-flat:hover {
    box-shadow: var(--neumorphic-shadow-concave);
    color: var(--color-primary);
}

/* Header & Navbar */
.header {
  position: fixed;
  width: 100%;
  z-index: 1000;
  background-color: rgba(224, 229, 236, 0.85); /* Semi-transparent background */
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.navbar {
  background-color: transparent !important; /* Override Bulma */
}

.navbar-item, .navbar-link {
  font-family: var(--font-family-headings);
  font-weight: 700;
  color: var(--color-text-primary) !important;
  transition: var(--transition-smooth);
}
.navbar-item:hover, .navbar-link:hover, .navbar-item.is-active {
  background-color: transparent !important;
  color: var(--color-primary) !important;
}
.logo-text strong {
  font-size: 1.5rem;
  color: var(--color-primary);
}
.navbar-burger {
  color: var(--color-primary) !important;
}
@media screen and (max-width: 1023px) {
  .navbar-menu {
    background-color: var(--color-background) !important;
    box-shadow: var(--neumorphic-shadow-convex);
    border-radius: 0 0 var(--border-radius-soft) var(--border-radius-soft);
    padding: 0.5rem 0;
  }
  .navbar-item {
      padding: 0.75rem 1.5rem;
  }
}


/* Hero Section */
#hero {
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  position: relative; /* For overlay */
}
.hero-background-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)); /* Dark overlay for text readability */
  z-index: 1;
}
.hero .hero-body {
  z-index: 2; /* Ensure content is above overlay */
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 2rem;
}
.hero-title {
  color: var(--color-text-light) !important; /* Explicitly white */
  font-size: 3.5rem;
  font-weight: 700;
  margin-bottom: 1rem;
  text-shadow: 2px 2px 8px rgba(0,0,0,0.7);
}
.hero-subtitle {
  color: var(--color-text-light) !important; /* Explicitly white */
  font-size: 1.5rem;
  margin-bottom: 2rem;
  text-shadow: 1px 1px 6px rgba(0,0,0,0.6);
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}
#hero .button.is-primary {
  background-color: var(--color-primary) !important;
  color: var(--color-text-light) !important;
  box-shadow: var(--neumorphic-shadow-flat) !important;
  font-size: 1.2rem;
  padding: 1em 2.2em !important;
}
#hero .button.is-primary:hover {
  background-color: var(--color-primary-dark) !important;
  box-shadow: var(--neumorphic-shadow-button-hover) !important;
  transform: translateY(-3px);
}
#hero .button.is-primary:active {
  box-shadow: var(--neumorphic-shadow-concave) !important;
  transform: translateY(0px);
}


/* Card Styling (Neomorphic) */
.card { /* Bulma card override */
  background-color: transparent; /* Neomorphic cards have their own background */
  box-shadow: none; /* Remove Bulma's default shadow */
  border-radius: var(--border-radius-soft);
  display: flex;
  flex-direction: column;
  height: 100%; /* For consistent height in columns */
  transition: var(--transition-smooth);
}
.neomorphic-card {
  padding: var(--spacing-unit) * 1.5;
  display: flex;
  flex-direction: column;
  align-items: center; /* Center content like images and text blocks */
  text-align: center;
  height: 100%; /* For equal height cards in a row */
}
.neomorphic-card:hover {
  transform: translateY(-5px);
  box-shadow: 10px 10px 20px var(--shadow-color-dark), -10px -10px 20px var(--shadow-color-light);
}
.card .card-image, .neomorphic-card .card-image { /* Bulma override */
  margin-bottom: 1rem; /* Space between image and content */
  padding-top: 0; /* Remove Bulma's default padding */
  width: 100%;
}
.card .image-container {
  width: 100%;
  max-width: 300px; /* Control image width within card */
  height: 200px; /* Fixed height for consistent image display */
  border-radius: var(--border-radius-medium);
  overflow: hidden;
  margin-left: auto;
  margin-right: auto;
  box-shadow: var(--neumorphic-shadow-concave); /* Slight inset for image container */
}
.card .image-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: var(--border-radius-medium);
}
.neomorphic-card .card-content {
  padding: 1rem;
  width: 100%;
}
.neomorphic-card .title {
  color: var(--color-text-headings);
  margin-bottom: 0.75rem;
}
.neomorphic-card p {
  color: var(--color-text-secondary);
  font-size: 0.95rem;
}

/* History Section */
#history .card-image img {
  border-radius: var(--border-radius-medium);
}

/* Our Process Section */
.process-card {
  padding: 2rem 1.5rem;
}
.process-icon {
  margin-bottom: 1.5rem;
}
.process-icon img {
  width: 64px;
  height: 64px;
  filter: drop-shadow(2px 2px 4px var(--shadow-color-dark));
}
.process-card .title.is-4 {
    color: var(--color-primary);
    margin-bottom: 1rem;
}

/* Statistics Section */
.neomorphic-stat-card {
  padding: 2rem;
  text-align: center;
}
.stat-number {
  font-size: 3rem !important;
  font-weight: 700;
  color: var(--color-primary) !important;
}
.neomorphic-stat-card .heading {
  color: var(--color-text-secondary);
  text-transform: uppercase;
  font-size: 0.9rem;
  margin-bottom: 1rem;
}
.neomorphic-progress {
  height: 12px !important;
  border-radius: var(--border-radius-sharp) !important;
  box-shadow: var(--neumorphic-shadow-concave);
  background-color: var(--color-background);
}
.neomorphic-progress::-webkit-progress-value {
  background-color: var(--color-secondary) !important;
  border-radius: var(--border-radius-sharp) !important;
}
.neomorphic-progress::-moz-progress-bar {
  background-color: var(--color-secondary) !important;
  border-radius: var(--border-radius-sharp) !important;
}
.neomorphic-progress::-ms-fill {
  background-color: var(--color-secondary) !important;
  border-radius: var(--border-radius-sharp) !important;
}

/* Gallery Section */
#gallery .card .image-container {
    height: 250px; /* Slightly taller for gallery images */
}

/* Behind the Scenes Section */
#behind-the-scenes .card-image img {
    border-radius: var(--border-radius-medium);
}
#behind-the-scenes .card-content {
    text-align: left;
}

/* Case Studies Section */
.case-study-card {
  padding: 1.5rem;
  text-align: left; /* Override centered text for case studies */
}
.case-study-card .columns {
  align-items: center;
}
.case-study-card .card-image {
  margin-bottom: 0; /* Remove bottom margin if using columns */
}
.case-study-card .image-container {
  height: 180px; /* Adjust as needed for case study preview */
  max-width: 100%;
}
.case-study-card .card-content {
  padding: 0 1rem; /* Adjust padding for content next to image */
}
.case-study-card .title.is-4 {
    color: var(--color-primary);
    margin-bottom: 0.5rem;
}
.case-study-card .subtitle.is-6 {
    color: var(--color-text-secondary);
    margin-bottom: 0.75rem;
}
.case-study-card p {
    font-size: 0.9rem;
    margin-bottom: 0.5rem !important;
}
.case-study-card .button.is-link.neomorphic-button-flat {
    background-color: transparent;
    color: var(--color-tertiary);
    padding: 0.5em 1em;
    font-weight: bold;
    box-shadow: none;
}
.case-study-card .button.is-link.neomorphic-button-flat:hover {
    color: var(--color-tertiary-dark);
    text-decoration: underline;
    box-shadow: none;
}

/* Read More Link Style */
a.read-more-link {
    font-weight: bold;
    color: var(--color-tertiary);
    display: inline-block;
    margin-top: 0.5rem;
    text-decoration: none;
}
a.read-more-link:hover {
    color: var(--color-tertiary-dark);
    text-decoration: underline;
}


/* Clientele Section */
.client-logos img {
  max-height: 60px;
  width: auto;
  margin: 1rem;
  filter: grayscale(100%) opacity(0.7);
  transition: var(--transition-smooth);
}
.client-logos img:hover {
  filter: grayscale(0%) opacity(1);
  transform: scale(1.1);
}

/* Awards Section */
.award-card {
  padding: 1.5rem;
}
.award-card .image-container {
  width: 100px;
  height: 100px;
  margin-bottom: 1rem;
  box-shadow: none; /* No inset for badge images */
}
.award-card .image-container img {
  object-fit: contain; /* Badges might need contain */
}
.award-card .title.is-5 {
    color: var(--color-secondary);
}

/* External Resources Section */
#external-resources .resource-card {
    margin-bottom: 1.5rem;
    padding: 1.5rem;
    text-align: left;
}
#external-resources .resource-card .title.is-5 a {
    color: var(--color-primary);
    font-weight: bold;
}
#external-resources .resource-card .title.is-5 a:hover {
    color: var(--color-primary-dark);
}
#external-resources .resource-description {
    font-size: 0.9rem;
    color: var(--color-text-secondary);
}

/* Contact Section Form */
.neomorphic-form {
  padding: 2.5rem 2rem;
}
.neomorphic-form .label {
  color: var(--color-text-headings);
  font-weight: 700;
  margin-bottom: 0.75rem;
}
.neomorphic-input, .neomorphic-textarea { /* Bulma override */
  background-color: var(--color-background) !important;
  border-radius: var(--border-radius-medium) !important;
  box-shadow: var(--neumorphic-shadow-input) !important;
  border: none !important;
  padding: 12px 15px !important;
  color: var(--color-text-primary) !important;
  transition: var(--transition-fast);
  font-size: 1rem;
}
.section-secondary .neomorphic-input, .section-secondary .neomorphic-textarea {
    background-color: var(--color-background-secondary) !important;
}
.neomorphic-input::placeholder, .neomorphic-textarea::placeholder {
  color: var(--color-text-secondary) !important;
  opacity: 0.7;
}
.neomorphic-input:focus, .neomorphic-textarea:focus {
  outline: none !important;
  box-shadow: var(--neumorphic-shadow-input), 0 0 0 2px var(--color-primary-light) !important; /* Add focus ring */
}
.contact-info p {
    margin-bottom: 0.5rem;
    color: var(--color-text-secondary);
}
.contact-info a {
    color: var(--color-primary);
}
.contact-info a:hover {
    color: var(--color-primary-dark);
}


/* Footer */
.neomorphic-footer {
  background-color: var(--color-background-secondary);
  padding: 3rem 1.5rem 1.5rem; /* Less padding at bottom */
  color: var(--color-text-secondary);
  box-shadow: inset 0 5px 15px rgba(0,0,0,0.05); /* Subtle inner top shadow */
}
.footer-title {
  color: var(--color-text-headings) !important;
  margin-bottom: 1rem;
}
.footer-link {
  color: var(--color-text-secondary) !important;
  font-size: 0.95rem;
}
.footer-link:hover {
  color: var(--color-primary) !important;
  text-decoration: underline;
}
.footer-hr {
    background-color: var(--color-text-secondary);
    opacity: 0.2;
    height: 1px;
    margin: 1.5rem 0;
}
.footer .content p {
    font-size: 0.9rem;
}
.footer-social-link {
    margin: 0 0.5rem;
    color: var(--color-text-secondary) !important;
    font-weight: bold;
}
.footer-social-link:hover {
    color: var(--color-primary) !important;
}


/* Page Specific Styles */
/* success.html */
.success-page-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  text-align: center;
  padding: 2rem;
  background-color: var(--color-background);
}
.success-page-container .neomorphic-card {
    max-width: 600px;
    padding: 3rem;
}
.success-page-container .title {
    color: var(--color-primary);
}

/* privacy.html & terms.html */
.static-page-content {
  padding-top: 120px; /* Account for fixed header */
  padding-bottom: 4rem;
}
.static-page-content .container {
    background-color: var(--color-background-secondary);
    padding: 2rem;
    border-radius: var(--border-radius-soft);
    box-shadow: var(--neumorphic-shadow-card);
}
.static-page-content h1, .static-page-content h2 {
    color: var(--color-primary);
    margin-bottom: 1rem;
}
.static-page-content h1 { font-size: 2.2rem; }
.static-page-content h2 { font-size: 1.8rem; margin-top: 1.5rem; }
.static-page-content p, .static-page-content li {
    color: var(--color-text-primary);
    line-height: 1.8;
}

/* Cookie Consent Popup (Basic Refinements if needed) */
#cookieConsentPopup {
    box-shadow: 0 -5px 15px rgba(0,0,0,0.1);
    font-family: var(--font-family-body);
}
#cookieConsentPopup p {
    color: #f0f0f0; /* Ensure high contrast with dark background */
}
#cookieConsentPopup a {
    color: var(--color-primary-light) !important; /* Light blue for link on dark bg */
}
#acceptCookieButton {
    background-color: var(--color-secondary) !important; /* Use a vibrant accent */
    color: var(--color-text-headings) !important; /* Dark text on yellow button for contrast */
    border-radius: var(--border-radius-sharp) !important;
    font-weight: bold;
}
#acceptCookieButton:hover {
    background-color: var(--color-secondary-dark) !important;
}


/* Responsive Adjustments */
@media screen and (max-width: 768px) {
  .title.is-1, .hero-title { font-size: 2.5rem; }
  .title.is-2, .section-title { font-size: 2rem; }
  .hero-subtitle { font-size: 1.2rem; }

  .section {
    padding: 3rem 1rem;
  }
  .columns.is-multiline .column {
    margin-bottom: 1.5rem; /* Add space between stacked columns */
  }
  .case-study-card .columns {
      flex-direction: column;
  }
  .case-study-card .card-image {
      margin-bottom: 1rem;
  }
  .case-study-card .card-content {
      padding: 0;
  }
  .footer .columns {
      text-align: center;
  }
  .footer .column {
      margin-bottom: 1.5rem;
  }
}

/* Parallax Placeholder (JS will handle actual parallax logic) */
.parallax-background {
  background-attachment: fixed; /* Basic CSS parallax, can be enhanced by JS */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* AOS Animation defaults (can be overridden by data-aos attributes) */
[data-aos] {
  transition-property: transform, opacity;
}