/* DrachenGas Routenplaner Styles */

* {
  box-sizing: border-box;
}

body {
  font-family: 'Open Sans', Arial, sans-serif;
  background: #fff;
  color: #000;
  margin: 0;
  padding: 0;
  line-height: 1.6;
}

header {
  display: flex;
  height: 4rem;
  align-items: center;
  justify-content: space-between;
}

.hero {
  position: relative;
  padding: 1rem;
  background-image: url(../img/iStock-172442131_small.webp);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 2rem;
}

.hero::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    --bg-opacity: 1;
    background-color: #000;
    opacity: .6;
    pointer-events: none;
}

.hero-content {
  z-index: 2;
}

.container {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    padding-left: 1rem;
    padding-right: 1rem;
    max-width: 1440px;
}

h1 {
  text-align: center;
  color: #fff;
  margin-bottom: 20px;
  font-size: 2.2rem;
  font-weight: 700;
  line-height: 1.3;
  text-wrap: balance;
}

h2 {
  text-align: center;
  font-weight: 400;
  color: #fff;
  font-size: 1.2rem;
  margin-bottom: 40px;
  line-height: 1.5;
  opacity: .8;
  text-wrap: balance;
}

a {
  display: flex;
}

.form-row {
  display: flex;
  gap: 0;
  margin-bottom: 24px;
  justify-content: center;
  flex-wrap: wrap;
  background: #fff;
  padding: 1rem;
  border-radius: 2.5rem;
  border: 1px solid #ddd;
}

/* Chrome, Edge, Safari */
input:-webkit-autofill {
  background-color: #e0ffe0 !important;
  color: #000 !important;
  box-shadow: 0 0 0px 1000px #e0ffe0 inset !important;
}

/* Firefox */
input:autofill {
  background-color: #e0ffe0 !important;
  color: #000 !important;
}

.form-row input, .form-row select {
  padding: 14px 18px;
  padding-right: 26px;
  border: 1px solid transparent;
  border-right: 1px solid #ddd;
  background: #fff;
  font-size: 1rem;
  min-width: 170px;
  color: #000;
  border-radius: 0;
  transition: all 0.3s ease;
  font-family: 'Open Sans', Arial, sans-serif;

  padding: 10px 10px;
  margin-top: 0.3em;
}

.form-row input.firstInp {
  border-radius: 40px 0 0 40px;
  padding-left: 24px;

  padding-left: 14px;
}

.form-row select.lastInp {
  border-right: none;
  border-radius: 0 40px 40px 0;
  padding-right: 24px;
}

.form-row select {
  margin-right: 2px;
}

.form-row button {
  margin-left: 16px;
  background: rgb(14,62,131);
  color: #fff;
  border: none;
  border-radius: 40px;
  padding: 14px 56px 14px 32px;
  font-size: 1rem;
  cursor: pointer;
  font-weight: 600;
  transition: all 0.3s ease;
  font-family: 'Open Sans', Arial, sans-serif;
  text-transform: none;
  position: relative;

  margin-top: 0.3em;
}

.form-row input:focus, .form-row select:focus {
  outline: none;
  border-color: transparent;
  box-shadow: 0 0 0 2px rgba(14,62,131, 0.1);
  border-right-color: #ddd;
}

.form-row select:focus {
  border-right-color: transparent;
}

.form-row input::placeholder {
  color: #999;
}

.form-row button:hover {
  background: #062a5d;
}

.form-row button:active {
  transform: translateY(0);
}

/* Lupen-Icon für Suchbutton */
.btn-search::before {
  content: "";
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21 21L16.65 16.65M19 11C19 15.4183 15.4183 19 11 19C6.58172 19 3 15.4183 3 11C3 6.58172 6.58172 3 11 3C15.4183 3 19 6.58172 19 11Z' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
}

.map {
  width: 100%;
  min-height: 500px;
  height: calc(100vh - 3rem);
  background: #f5f5f5;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #999;
  font-size: 1.2rem;
  border-radius: 0px;
  /*background-image: url(../img/map_placeholder.svg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;*/
  position: sticky;
  top: 1.5rem;
  align-self: start;
}

.directions {
  background: #f5f5f5;
  padding: 24px;
  color: #000;
  font-size: 1rem;
  border-radius: 0px;
  line-height: 1.8;
}

/* Info Box Styling */
.info-box {
  background: #fff4e6;
  border-left: 4px solid #ff8c00;
  position: relative;
  padding-left: 50px;
}

.hint-text {
  color: #ff8c00;
  font-weight: 700;
}

/* Icon Styles */
.icon-info {
  position: absolute;
  left: 20px;
  top: 24px;
  width: 24px;
  height: 24px;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 16V12M12 8H12.01M2 8.52274V15.4773C2 15.7218 2 15.8441 2.02763 15.9592C2.05213 16.0613 2.09253 16.1588 2.14736 16.2483C2.2092 16.3492 2.29568 16.4357 2.46863 16.6086L7.39137 21.5314C7.56432 21.7043 7.6508 21.7908 7.75172 21.8526C7.84119 21.9075 7.93873 21.9479 8.04077 21.9724C8.15586 22 8.27815 22 8.52274 22H15.4773C15.7218 22 15.8441 22 15.9592 21.9724C16.0613 21.9479 16.1588 21.9075 16.2483 21.8526C16.3492 21.7908 16.4357 21.7043 16.6086 21.5314L21.5314 16.6086C21.7043 16.4357 21.7908 16.3492 21.8526 16.2483C21.9075 16.1588 21.9479 16.0613 21.9724 15.9592C22 15.8441 22 15.7218 22 15.4773V8.52274C22 8.27815 22 8.15586 21.9724 8.04077C21.9479 7.93873 21.9075 7.84119 21.8526 7.75172C21.7908 7.6508 21.7043 7.56432 21.5314 7.39137L16.6086 2.46863C16.4357 2.29568 16.3492 2.2092 16.2483 2.14736C16.1588 2.09253 16.0613 2.05213 15.9592 2.02763C15.8441 2 15.7218 2 15.4773 2H8.52274C8.27815 2 8.15586 2 8.04077 2.02763C7.93873 2.05213 7.84119 2.09253 7.75172 2.14736C7.6508 2.2092 7.56432 2.29568 7.39137 2.46863L2.46863 7.39137C2.29568 7.56432 2.2092 7.6508 2.14736 7.75172C2.09253 7.84119 2.05213 7.93873 2.02763 8.04077C2 8.15586 2 8.27815 2 8.52274Z' stroke='%23ff8c00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
}

.icon-home {
  width: 24px;
  height: 24px;
  min-width: 20px;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 13C13.6569 13 15 11.6569 15 10C15 8.34315 13.6569 7 12 7C10.3431 7 9 8.34315 9 10C9 11.6569 10.3431 13 12 13Z' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12 22C16 18 20 14.4183 20 10C20 5.58172 16.4183 2 12 2C7.58172 2 4 5.58172 4 10C4 14.4183 8 18 12 22Z' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  display: inline-block;
  cursor: pointer;
}

.icon-phone {
  width: 24px;
  height: 24px;
  min-width: 18px;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.0497 6C15.0264 6.19057 15.924 6.66826 16.6277 7.37194C17.3314 8.07561 17.8091 8.97326 17.9997 9.95M14.0497 2C16.0789 2.22544 17.9713 3.13417 19.4159 4.57701C20.8606 6.01984 21.7717 7.91101 21.9997 9.94M10.2266 13.8631C9.02506 12.6615 8.07627 11.3028 7.38028 9.85323C7.32041 9.72854 7.29048 9.66619 7.26748 9.5873C7.18576 9.30695 7.24446 8.96269 7.41447 8.72526C7.46231 8.65845 7.51947 8.60129 7.63378 8.48698C7.98338 8.13737 8.15819 7.96257 8.27247 7.78679C8.70347 7.1239 8.70347 6.26932 8.27247 5.60643C8.15819 5.43065 7.98338 5.25585 7.63378 4.90624L7.43891 4.71137C6.90747 4.17993 6.64174 3.91421 6.35636 3.76987C5.7888 3.4828 5.11854 3.4828 4.55098 3.76987C4.2656 3.91421 3.99987 4.17993 3.46843 4.71137L3.3108 4.86901C2.78117 5.39863 2.51636 5.66344 2.31411 6.02348C2.08969 6.42298 1.92833 7.04347 1.9297 7.5017C1.93092 7.91464 2.01103 8.19687 2.17124 8.76131C3.03221 11.7947 4.65668 14.6571 7.04466 17.045C9.43264 19.433 12.295 21.0575 15.3284 21.9185C15.8928 22.0787 16.1751 22.1588 16.588 22.16C17.0462 22.1614 17.6667 22 18.0662 21.7756C18.4263 21.5733 18.6911 21.3085 19.2207 20.7789L19.3783 20.6213C19.9098 20.0898 20.1755 19.8241 20.3198 19.5387C20.6069 18.9712 20.6069 18.3009 20.3198 17.7333C20.1755 17.448 19.9098 17.1822 19.3783 16.6508L19.1835 16.4559C18.8339 16.1063 18.6591 15.9315 18.4833 15.8172C17.8204 15.3862 16.9658 15.3862 16.3029 15.8172C16.1271 15.9315 15.9523 16.1063 15.6027 16.4559C15.4884 16.5702 15.4313 16.6274 15.3644 16.6752C15.127 16.8453 14.7828 16.904 14.5024 16.8222C14.4235 16.7992 14.3612 16.7693 14.2365 16.7094C12.7869 16.0134 11.4282 15.0646 10.2266 13.8631Z' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  display: inline-block;
}

.icon-email {
  width: 24px;
  height: 24px;
  min-width: 18px;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.4995 13.5001L20.9995 3.00005M10.6271 13.8281L13.2552 20.5861C13.4867 21.1815 13.6025 21.4791 13.7693 21.566C13.9139 21.6414 14.0862 21.6415 14.2308 21.5663C14.3977 21.4796 14.5139 21.1821 14.7461 20.587L21.3364 3.69925C21.5461 3.16207 21.6509 2.89348 21.5935 2.72185C21.5437 2.5728 21.4268 2.45583 21.2777 2.40604C21.1061 2.34871 20.8375 2.45352 20.3003 2.66315L3.41258 9.25349C2.8175 9.48572 2.51997 9.60183 2.43326 9.76873C2.35809 9.91342 2.35819 10.0857 2.43353 10.2303C2.52043 10.3971 2.81811 10.5128 3.41345 10.7444L10.1715 13.3725C10.2923 13.4195 10.3527 13.443 10.4036 13.4793C10.4487 13.5114 10.4881 13.5509 10.5203 13.596C10.5566 13.6468 10.5801 13.7073 10.6271 13.8281Z' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  display: inline-block;
}

.icon-web {
  width: 24px;
  height: 24px;
  min-width: 18px;
  background-image: url('data:image/svg+xml,<svg fill="%23000000" width="800px" height="800px" viewBox="0 0 512 512" id="Layer_1" enable-background="new 0 0 512 512" xmlns="http://www.w3.org/2000/svg"><g><path d="m437.02 74.98c-48.353-48.352-112.64-74.98-181.02-74.98s-132.667 26.628-181.02 74.98-74.98 112.64-74.98 181.02 26.628 132.667 74.98 181.02 112.64 74.98 181.02 74.98 132.667-26.628 181.02-74.98 74.98-112.64 74.98-181.02-26.628-132.667-74.98-181.02zm-2.132 315.679c-15.31-10.361-31.336-19.314-47.952-26.789 7.339-28.617 11.697-59.688 12.784-91.87h79.702c-3.144 44.336-19.244 85.147-44.534 118.659zm-402.31-118.659h79.702c1.088 32.183 5.446 63.254 12.784 91.87-16.616 7.475-32.642 16.427-47.952 26.789-25.29-33.512-41.39-74.323-44.534-118.659zm44.53-150.654c15.31 10.362 31.336 19.315 47.954 26.79-7.338 28.615-11.695 59.683-12.783 91.864h-79.701c3.144-44.334 19.243-85.142 44.53-118.654zm283.519-42.581c-5.863-10.992-12.198-20.911-18.935-29.713 27.069 11.25 51.473 27.658 71.977 47.997-11.625 7.638-23.702 14.369-36.155 20.185-4.886-13.664-10.528-26.547-16.887-38.469zm-12.965 50.404c-29.211 9.792-60.039 14.831-91.662 14.831s-62.451-5.039-91.662-14.831c20.463-58.253 54.273-97.169 91.662-97.169s71.199 38.916 91.662 97.169zm-203.359 110.831c1.056-28.342 4.885-55.421 10.937-80.116 32.136 10.644 66.018 16.116 100.76 16.116s68.624-5.472 100.76-16.116c6.053 24.695 9.881 51.773 10.937 80.116zm223.394 32c-1.057 28.344-4.885 55.424-10.938 80.12-32.139-10.646-66.02-16.12-100.759-16.12s-68.62 5.474-100.759 16.12c-6.053-24.696-9.882-51.776-10.938-80.12zm-216.324-193.235c-6.358 11.922-12 24.805-16.887 38.468-12.452-5.815-24.53-12.547-36.155-20.185 20.503-20.34 44.907-36.747 71.977-47.997-6.737 8.803-13.073 18.722-18.935 29.714zm-16.886 316.008c4.886 13.661 10.528 26.542 16.885 38.462 5.863 10.992 12.198 20.911 18.935 29.713-27.067-11.25-51.469-27.655-71.971-47.992 11.625-7.637 23.701-14.368 36.151-20.183zm29.853-11.938c29.213-9.794 60.04-14.835 91.66-14.835s62.447 5.041 91.66 14.835c-20.463 58.251-54.272 97.165-91.66 97.165s-71.197-38.914-91.66-97.165zm196.287 50.4c6.357-11.92 11.999-24.801 16.885-38.462 12.451 5.815 24.527 12.547 36.151 20.183-20.502 20.337-44.904 36.743-71.971 47.992 6.737-8.802 13.073-18.721 18.935-29.713zm39.093-193.235c-1.088-32.18-5.445-63.249-12.783-91.864 16.618-7.475 32.645-16.428 47.954-26.79 25.287 33.511 41.386 74.319 44.53 118.654z"/></g></svg>');
  background-size: contain;
  background-repeat: no-repeat;
  display: inline-block;
}


/* Address Block */
.address-block {
  display: flex;
  gap: 12px;
  margin-bottom: 16px;
  align-items: flex-start;
}

/* Contact Info */
.contact-info {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 16px;
}

.contact-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.95rem;
}

/* Link Button Style */
.btn-link {
  background: none;
  color: rgb(14,62,131);
  border: none;
  padding: 0;
  padding-right: 24px;
  font-size: 0.95rem;
  cursor: pointer;
  font-weight: 600;
  transition: all 0.3s ease;
  font-family: 'Open Sans', Arial, sans-serif;
  text-decoration: underline;
  position: relative;
  display: inline-block;
}

.btn-link:hover {
  color: #062a5d;
  text-decoration: none;
}

/* Pfeil-Icon für Link-Button */
.btn-link::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 17L17 7M17 7H7M17 7V17' stroke='%230e3e83' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
}

.btn-link:hover::after {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 17L17 7M17 7H7M17 7V17' stroke='%23062a5d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.distance {
  color: rgb(14,62,131);
  font-weight: 700;
  font-size: 1.2rem;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
}

.distance::before {
  content: "";
  width: 24px;
  height: 24px;
  min-width: 20px;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.5 5H11.9344C14.9816 5 16.5053 5 17.0836 5.54729C17.5836 6.02037 17.8051 6.71728 17.6702 7.39221C17.514 8.17302 16.2701 9.05285 13.7823 10.8125L9.71772 13.6875C7.2299 15.4471 5.98599 16.327 5.82984 17.1078C5.69486 17.7827 5.91642 18.4796 6.41636 18.9527C6.99474 19.5 8.51836 19.5 11.5656 19.5H12.5M8 5C8 6.65685 6.65685 8 5 8C3.34315 8 2 6.65685 2 5C2 3.34315 3.34315 2 5 2C6.65685 2 8 3.34315 8 5ZM22 19C22 20.6569 20.6569 22 19 22C17.3431 22 16 20.6569 16 19C16 17.3431 17.3431 16 19 16C20.6569 16 22 17.3431 22 19Z' stroke='%230e3e83' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  display: inline-block;
}

.results-container {
  display: grid;
  grid-template-columns: 380px 1fr;
  gap: 16px;
  margin-bottom: 1.5rem;
  z-index: 1;
  position: relative;
}

.results-sidebar {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

select:invalid { 
  color: #999; 
}

.small-text {
  display: block;
  font-style: italic;
  font-size: .8rem;
  opacity: .8;
}


#inpPlz {
  width: 117px;
  min-width: 117px;
  padding-left: 14px;
}

#inpNr {
  width: 70px;
  min-width: 70px;
}

#inpRad {
  width: 6rem;
  min-width: 6rem;
}

#plzListe, #ortListe {
  list-style-type: none;
  display:none;
  position: absolute;
  margin-left: 0.7em;
  background-color: whitesmoke;
  padding: 10px;
  border-radius: 0.5rem;
  border: 1px solid #ddd;
  max-height: 13.6em;
  min-width: 229px;
  max-width: 350px;
  overflow-y: auto;
  overflow-x: hidden;
  margin-top: 47px;
  cursor: pointer;
  z-index: 2;
}

#plzListe > li, #ortListe > li {
  padding-left: 20px;
  padding-right: 20px;
}


#plzListe > li:hover , #ortListe > li:hover {
  background-color: #009bdd;
  color: whitesmoke;
  border-radius: 20px;
}


@keyframes myAnimation {
  0%   {background-color: rgb(255, 255, 255);}
  50%  {background-color: rgb(0, 155, 221); color: #ffffff }
  100% {background-color: #ffffff; color: #000000}
}

.inpRad {
  animation-name: myAnimation;
  animation-duration: 1.5s;
}


.leaflet-right .leaflet-control a {
  display: inline;
}

.zGroesser {
  zoom: 101%;
}

.zNormal {
  zoom: 100%;
}

.hideBlock {
  display: none !important;
}

.infExgtLink {

}


#gasbot {
  list-style-type: none;
  display: none;
  position: absolute;
  margin-left: 0.7em;
  background-color: whitesmoke;
  padding: 10px;
  border-radius: 0.5rem;
  border: 1px solid #ddd;
  max-height: 13.6em;
  min-width: 229px;
  max-width: 395px;
  overflow-y: auto;
  overflow-x: hidden;
  margin-top: 47px;
  cursor: pointer;

  list-style-type: none;
  margin-top: 0;
  margin-left: -15px;
  z-index: 1000;
  margin-top: 2.55em;
}

#gasbot li {
  line-height: 42px;
  padding-left: 20px;
  padding-right: 20px;
  margin-bottom: 2px;
  display: block;
  clear: both;

}

#gasbot li span span {
  position: relative;
  float: left;
  min-width: 50px;
}

#gasbot li span span img {
  max-height: 38px;
  top: 2px;
  display: inline-block;
  position: relative;
}

#gasbot li:hover, #gasbot li.selectbot {
  background-color: rgba(0, 155, 221, 0.51);
  color: whitesmoke;
  border-radius: 20px;
}

#gasbot li:hover {
  background-color: rgba(0, 155, 221 );
}

/*********************************** media *****************************************************/


@media (min-width: 1024px) {
    .container {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
}

@media (min-width: 1043px) {
    .hero {
      max-height: 36rem;
    }
}


@media (max-width: 1300px) {
  .form-row button.btn-search {
    width:  96%;
    margin: 0.5rem;
  }
}

/*@media (max-width: 1042px)*/
@media (max-width: 1150px) {
  .hero {
    max-height: 28rem;
    display: flex;
    align-items: flex-start;
    margin-bottom: 8rem;
  }

  .form-row {
    flex-direction: column;
    align-items: stretch;
/*    gap: 10px;*/
    gap: 2px;
  }
  
  .form-row input, .form-row select {
    border: 1px solid transparent;
    border-radius: 40px;
    padding: 14px 18px;

    margin-top: unset;
  }
  
  .form-row button {
    margin-left: 0;
  }
  
  .form-row input, .form-row select, .form-row button,
  #inpRad, #inpPlz, #inpRad, #inpNr{
    width: 100%;
    min-width: auto;
    border-radius: 40px;
  }

  .results-container {
    grid-template-columns: 1fr;
  }

  .map {
    order: 1;
    max-height: 400px;
    position: relative;
    top: 0em;
    margin-top: 1.7em;

    margin-top: 0.5em;
  }

  .results-sidebar {
    order: 2;
  }
  .form-row input:first-of-type {
    border-radius: 40px 40px;
    padding-left: 18px;
  }
  .form-row input, .form-row select {
    border-right: 0px solid #ddd;
  }
}

@media (max-width: 1070px) {
  .hero {
    margin-bottom: 12.4rem;
  }
}

/* Responsive Design */
@media (max-width: 768px) {
  .container {
    padding: 0 16px;
  }
  
  h1 {
    font-size: 1.6rem;
  }
  
  h2 {
    font-size: 1rem;
  }
  
  .map {
    height: 300px;
  }
}

@media (min-width: 1280px) {
    .hero {
        max-height: 42rem;
    }
}



/** FOOTER **/
/* Footer Styles */
footer {
  background: #f5f5f5;
  border-top: 1px solid #e0e0e0;
  margin-top: 4rem;
  padding: 3rem 0 1.5rem;
}

.footer-content {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 3rem;
  padding-bottom: 2rem;
}

.footer-column h3 {
  color: rgb(14,62,131);
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 1rem;
  text-align: left;
}

.footer-logo {
  max-width: 180px;
  height: auto;
  margin-bottom: 1.5rem;
}

.footer-address {

  line-height: 1.6;
  margin-bottom: 1rem;
  font-size: 0.95rem;
}

.footer-contact {
  line-height: 1.6;
  font-size: 0.95rem;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.footer-contact a {
  color: #000;
  text-decoration: none;
  transition: color 0.3s ease;
}

.footer-contact a:hover {
  text-decoration: underline;
}

.footer-links ul,
.footer-info ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

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

.footer-links a,
.footer-info a {
  color: #000;
  text-decoration: none;
  font-size: 0.95rem;
  transition: color 0.3s ease;
  display: inline-block;
}

.footer-links a:hover,
.footer-info a:hover {
  color: rgb(14,62,131);
}

.footer-bottom {
  text-align: center;
  padding-top: 1.5rem;
}

.footer-bottom p {
  color: #999;
  font-size: 0.85rem;
  margin: 0;
}

/* Footer Responsive */
@media (max-width: 1042px) {
  footer {
    margin-top: 3rem;
    padding: 2rem 0 1rem;
  }
  
  .footer-content {
    grid-template-columns: 1fr 1fr;
    gap: 2rem 3rem;
  }
  
  .footer-brand {
    grid-column: 1;
    text-align: left;
  }
  
  .footer-logo {
    margin-left: 0;
    margin-right: 0;
  }
  
  .footer-contact {
    align-items: flex-start;
  }
  
  .footer-address {
    text-align: left;
  }
}

@media (max-width: 768px) {
  footer {
    margin-top: 2rem;
  }
  
  .footer-content {
    grid-template-columns: 1fr 1fr;
    gap: 2.5rem 2rem;
    text-align: left;
  }
  
  .footer-brand {
    grid-column: 1 / -1;
    margin-bottom: 1rem;
  }
  
  .footer-column h3 {
    text-align: left;
  }
  
  .footer-links ul,
  .footer-info ul {
    text-align: left;
  }
  
  .footer-contact {
    align-items: flex-start;
  }
  
  .footer-address {
    text-align: left;
  }
}

@media (max-width: 480px) {
  .footer-content {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  
  .footer-brand {
    padding-bottom: 1rem;
    border-bottom: 1px solid #e0e0e0;
  }
}