/* CSS Reset */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body {
    font-family: Arial, sans-serif;
    line-height: 1.6;
    color: #333;
}
header, nav, main, footer {
    width: 90%;
    max-width: 1200px;
    margin: auto;
    padding: 20px 0;
}
header {
    text-align: center;
}
nav ul {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-top: 10px;
}
nav ul li {
    margin: 0;
}
nav ul li a {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 6px 10px;
    line-height: 1.2;
    text-decoration: none;
    color: #0b4a8b;
    font-weight: bold;
}
.hero {
    background: #101820;
    color: white;
    padding: 100px 20px;
    text-align: center;
    position: relative; /* Makes positioning easier */
}
.hero.hero-with-image {
    background: none;
    overflow: hidden;
}
.hero .hero-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}
.hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
}
.hero > * {
    position: relative;
    z-index: 1;
}

.hero .banner {
    max-width: 100%; /* Ensures the banner scales with the viewport */
    height: auto; /* Maintains aspect ratio */
    margin-top: 20px; /* Adds spacing from the text */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); /* Optional: Adds some depth to the image */
    border-radius: 5px; /* Optional: Rounds the edges slightly */
}


.hero h1 {
    font-size: 2.5em;
    margin-bottom: 20px;
    color: #ffffff;
    text-shadow: 0 2px 6px rgba(0, 0, 0, 0.6);
}
.hero p {
    font-size: 1.25em;
    color: #f5f7fb;
    text-shadow: 0 2px 6px rgba(0, 0, 0, 0.6);
}
.hero.hero-with-image > h1,
.hero.hero-with-image > p {
    display: inline-block;
    width: fit-content;
    max-width: min(92vw, 980px);
    margin-left: auto;
    margin-right: auto;
    padding: 8px 14px;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 10px;
    background: rgba(6, 12, 20, 0.56);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.28);
}
.hero.hero-with-image > p small {
    color: #eef3ff;
}
main {
    padding: 40px 0;
}
.content-section {
    margin-bottom: 40px;
}
.content-section h2 {
    font-size: 2em;
    margin-bottom: 20px;
}
.content-section p {
    margin-bottom: 15px;
}
.industries-list, .services-list {
    list-style: none;
    columns: 2;
    margin-top: 20px;
}
.industries-list li, .services-list li {
    margin-bottom: 10px;
    position: relative;
    padding-left: 20px;
}
.industries-list li::before, .services-list li::before {
    content: '•';
    position: absolute;
    left: 0;
    color: #007BFF;
}
.contact-section {
    background-color: #f9f9f9;
    padding: 40px 20px;
    text-align: center;
}
.contact-section h2 {
    margin-bottom: 20px;
}
.contact-section p {
    margin-bottom: 20px;
}
.contact-section a {
    color: #0056b3;
    text-decoration: none;
    font-weight: bold;
}
footer {
    background-color: #1f1f1f;
    color: #f8f8f8;
    padding: 20px 0;
    text-align: center;
}
footer .footer-links {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin-top: 10px;
}
footer .footer-links a {
    color: #f8f8f8;
    text-decoration: none;
}
footer .footer-links a:hover,
footer .footer-links a:focus {
    text-decoration: underline;
}
.login-message {
    color: #b00020;
}
.form-textarea {
    width: 100%;
    min-height: 150px;
}
.image-preview {
    margin-top: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.image-preview-item {
    max-width: 150px;
    height: auto;
    border-radius: 4px;
}
.text-right {
    text-align: right;
}
.logout-button {
    background-color: #cccccc;
    color: #333333;
    padding: 6px 12px;
    border-radius: 4px;
    text-decoration: none;
    display: inline-block;
}
.logout-button:hover,
.logout-button:focus {
    background-color: #b7b7b7;
}
.blog-image {
    max-width: 100%;
    height: auto;
}
.share-button {
    margin-top: 12px;
}
.map-embed {
    border: 0;
    width: 100%;
    max-width: 100%;
}
.is-hidden {
    display: none;
}
@media (max-width: 768px) {
    nav ul {
        flex-direction: column;
        align-items: center;
    }
    .industries-list, .services-list {
        columns: 1;
    }
    .hero h1 {
        font-size: 2em;
    }
}
.mauticform_wrapper { max-width: 600px; margin: 10px auto; }
.mauticform-innerform {}
.mauticform-post-success {}
.mauticform-name { font-weight: bold; font-size: 1.5em; margin-bottom: 3px; }
.mauticform-description { margin-top: 2px; margin-bottom: 10px; }
.mauticform-error { margin-bottom: 10px; color: #b00020; }
.mauticform-message { margin-bottom: 10px; color: #1b7a3c; }
.mauticform-row { display: block; margin-bottom: 20px; }
.mauticform-label { font-size: 1.1em; display: block; font-weight: bold; margin-bottom: 5px; }
.mauticform-row.mauticform-required .mauticform-label:after { color: #e32; content: " *"; display: inline; }
.mauticform-helpmessage { display: block; font-size: 0.9em; margin-bottom: 3px; color: #333; }
.mauticform-errormsg { display: none; color: #b00020; margin-top: 2px; }
.mauticform-selectbox,
.mauticform-input,
.mauticform-textarea {
  width: 100%;
  padding: 0.5em;
  border: 1px solid #9aa3ad;
  background: #fff;
  box-shadow: 0 0 0 #fff inset;
  border-radius: 4px;
  box-sizing: border-box;
  color: #1f2a33;
}
.mauticform-checkboxgrp-row {}
.mauticform-checkboxgrp-label { font-weight: normal; }
.mauticform-checkboxgrp-checkbox {}
.mauticform-radiogrp-row {}
.mauticform-radiogrp-label { font-weight: normal; }
.mauticform-radiogrp-radio {}
.mauticform-button-wrapper .mauticform-button.btn-default,
.mauticform-pagebreak-wrapper .mauticform-pagebreak.btn-default {
  color: #24303b;
  background-color: #ffffff;
  border-color: #7f8b97;
}
.mauticform-button-wrapper .mauticform-button,
.mauticform-pagebreak-wrapper .mauticform-pagebreak {
  display: inline-block;
  margin-bottom: 0;
  font-weight: 600;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  background-image: none;
  border: 1px solid transparent;
  white-space: nowrap;
  padding: 6px 12px;
  font-size: 13px;
  line-height: 1.3856;
  border-radius: 3px;
  user-select: none;
}
.mauticform-button-wrapper .mauticform-button.btn-default[disabled],
.mauticform-pagebreak-wrapper .mauticform-pagebreak.btn-default[disabled] {
  background-color: #f7f7f7;
  border-color: #b8c0c8;
  opacity: 0.75;
  cursor: not-allowed;
}
.mauticform-pagebreak-wrapper .mauticform-button-wrapper { display: inline; }
.mauticform-field-hidden { display: none; }
