:root {
  --clr-heading: #000;
  --clr-text: #333;
  --clr-accent: #0061a0;
  --clr-border: #e9e9e9;
}

p:empty,
br {
  display: none !important;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "ProximaNova", sans-serif !important;
}
li {
  list-style: none;
}
a {
  text-decoration: none;
  color: var(--clr-accent);
  font-size: 14px;
  font-weight: 400;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--clr-heading) !important;
}
.heateor_sss_sharing_container {
  display: none;
}
.articles-wrapper h1 {
  font-size: clamp(32px, 2.77vw, 40px) !important;
  line-height: 120%;
  letter-spacing: 0.6px;
  font-weight: 400 !important;
}
.articles-wrapper h2 {
  font-size: 32px !important;
  margin-block: 0 !important;
  font-weight: 600 !important;
}
.articles-wrapper h3 {
  font-size: 18px !important;
  font-weight: 600 !important;
  margin-block: 0 !important;
}
.articles-wrapper p {
  color: var(--clr-text) !important;
  font-size: 14px !important;
}
.articles-wrapper span {
  color: inherit;
  font-size: 14px !important;
}
.content-area {
  max-width: min(1232px, calc(100% - 40px));
  width: 100%;
  margin: 0 auto;
}
.swiper {
  overflow-x: clip;
  position: relative;
}
/* Left Image Section Layout */
.left-img-layout {
  min-height: 452px;
  display: flex;
  position: relative;
  overflow-x: clip;
}

.left-img-layout > .content-area {
  display: flex;
  justify-content: flex-end;
  position: static;
}

.left-img-layout > .content-area > p {
  margin: 0;
  width: 50%;
  aspect-ratio: 616 / 452;
}

.left-img-layout .image-overlay {
  position: relative;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.left-img-layout > .content-area .content {
  width: 50%;
  padding: 44px 100px;
  display: flex;
  align-items: center;
}

.left-img-layout > .content-area .content .wrapper {
  max-width: min(312px, 100%);
}
.left-img-layout .content h2 {
  margin-bottom: 32px;
  text-wrap: balance;
}
.left-img-layout .content p {
  margin-bottom: 20px;
  color: #000;
  line-height: 150%;
}
.left-img-layout .content .divider {
  width: 20px;
  height: 2px;
  background: var(--clr-accent);
  margin-block: 12px;
}
.left-img-layout .content span {
  display: block;
  font-style: italic;
  color: var(--clr-text);
  text-wrap: balance;
}

@media (max-width: 1024px) {
  .left-img-layout {
    padding-block: 16px;
  }
  .left-img-layout > .content-area {
    flex-direction: column;
    gap: 32px;
  }
  .left-img-layout .image-overlay {
    width: 100%;
    max-width: none;
  }
  .left-img-layout > .content-area .content {
    width: 100%;
    padding: 0;
    border: none;
  }
  .left-img-layout > .content-area .content .wrapper {
    max-width: 100%;
  }
  .left-img-layout .content p {
    max-width: 100%;
  }

  .left-img-layout > .content-area > p {
    width: 100%;
  }
}

/* Right Image Section Layout */
.right-img-layout {
  min-height: 452px;
  display: flex;
  position: relative;
  overflow-x: clip;
}

.right-img-layout > .content-area {
  display: flex;
  justify-content: flex-start;
  position: static;
  flex-direction: row-reverse;
}

.right-img-layout > .content-area > p {
  margin: 0;
  width: 50%;
  aspect-ratio: 616 / 452;
}

.right-img-layout .image-overlay {
  position: relative;
  right: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.right-img-layout > .content-area .content {
  width: 50%;
  padding: 44px 100px 44px 0;
  display: flex;
  align-items: center;
}
.right-img-layout > .content-area .content .wrapper {
  max-width: min(312px, 100%);
}

.right-img-layout .content h2 {
  margin-bottom: 32px;
  text-wrap: balance;
}
.right-img-layout .content p {
  margin-bottom: 20px;
  color: #000;
  line-height: 150%;
}
.right-img-layout .content .divider {
  width: 20px;
  height: 2px;
  background: var(--clr-accent);
  margin-block: 12px;
}
.right-img-layout .content span {
  display: block;
  font-style: italic;
  color: var(--clr-text);
  text-wrap: balance;
}

@media (max-width: 1024px) {
  .right-img-layout {
    padding-block: 16px;
  }
  .right-img-layout > .content-area {
    flex-direction: column;
    gap: 32px;
  }
  .right-img-layout .image-overlay {
    width: 100%;
    max-width: none;
  }
  .right-img-layout > .content-area .content {
    width: 100%;
    padding: 16px 0;
    border: none;
  }
  .right-img-layout > .content-area .content .wrapper {
    max-width: 100%;
  }
  .right-img-layout .content p {
    max-width: 100%;
  }

  .right-img-layout > .content-area > p {
    width: 100%;
  }
}

/* Section Title Only */
.title-only {
  padding-block: 40px;
}

/* Hero Section Css */

.hero-section .content-area {
  padding: 30px 0;
}
.hero-section .breadcrumb {
  background: transparent !important;
  padding: 0;
}

.hero-section .breadcrumb > span {
  display: flex;
  gap: 16px;
  align-items: center;
  flex-wrap: wrap;
}

.hero-section h1 {
  margin-bottom: 16px;
}

.hero-section .breadcrumb a {
  color: var(--clr-text);
  text-decoration: underline;
}

.hero-section .breadcrumb li.divider {
  width: 1px;
  background: var(--clr-text);
  min-height: 14px;
}

.breadcrumb > li + li:before {
  display: none;
}

.hero-section .breadcrumb a:hover {
  color: var(--clr-accent);
}

.hero-section .article-date span {
  font-weight: 600;
}

.hero-section .article-date span:first-child {
  color: var(--clr-text);
}

.hero-section .article-date .date {
  color: var(--clr-accent);
}

.hero-section .hero-banner-slide img {
  width: 100%;
  aspect-ratio: 1232/754;
  object-fit: cover;
}

.hero-section .hero-banner-slide .swiper-button {
  width: 40px;
  height: 40px;
  background: #fff;
  border-radius: 50%;
}

.hero-section .hero-banner-slide .swiper-button:focus-visible {
  outline: none;
}

.hero-section .hero-banner-slide .swiper-button::after {
  font-size: 14px;
  font-weight: 900;
}
.hero-section .hero-banner-slide .swiper-button-prev {
  left: 5.83%;
}
.hero-section .hero-banner-slide .swiper-button-next {
  right: 5.83%;
}

.hero-section .hero-banner .content-area {
  padding: 0;
}
/* Info Section */
.info-section .tab {
  padding-block: 32px 22px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-bottom: 1px solid var(--clr-border);
  position: static;
  transform: none;
  width: 100%;
}

.info-section .tab span {
  position: relative;
  text-align: center;
  color: #0061a0;
  width: 100%;
  height: auto;
  background: transparent;
  opacity: 1;
}
.info-section .tab span.swiper-pagination-bullet-active::before {
  content: "";
  position: absolute;
  top: -8px;
  left: 50%;
  width: 8px;
  height: 8px;
  border: 2px solid #0061a0;
  border-bottom: none;
  border-right: none;
  transform: translateX(-50%) rotate(45deg);
  color: #0061a0;
}

.info-section .tab div:not(:last-child) {
  border-right: 1px solid var(--clr-border);
}

.info-section .tab span {
  font-size: 18px;
  font-weight: 600;
}

.info-section .content {
  padding-block: 0 44px;
  border-bottom: 1px solid var(--clr-border);
}

.info-section .content p {
  width: min(826px, 100%);
  margin: auto;
  text-align: center;
}

/* Standard Banner Size */
.standard-banner-size {
  padding-block: 40px 74px;
}

.standard-banner-size h2 {
  margin-bottom: 60px !important;
}

.standard-banner-size .banner-sizes-wrapper {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 48px 36px;
}

.standard-banner-size .banner-sizes {
  color: var(--clr-text);
  display: flex;
  align-items: center;
  gap: 16px;
  cursor: pointer;
}

.standard-banner-size .banner-sizes > p {
  flex-shrink: 0;
}

.standard-banner-size .banner-sizes:hover {
  color: var(--clr-accent);
  text-decoration: underline;
}
.standard-banner-size .banner-sizes img {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  object-fit: cover;
  max-width: none;
  aspect-ratio: 1/1;
}
.standard-banner-size .banner-sizes .content {
  line-height: 100%;
}

@media (max-width: 1024px) {
  .standard-banner-size .banner-sizes-wrapper {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }
  .standard-banner-size .banner-sizes img {
    width: 76px;
    height: 76px;
  }
  .standard-banner-size .banner-sizes {
    gap: 8px;
  }

  .standard-banner-size h2 {
    margin-bottom: 16px;
  }
}

@media (max-width: 460px) {
  .standard-banner-size .banner-sizes-wrapper {
    grid-template-columns: repeat(1, 1fr);
    gap: 24px;
  }
  .standard-banner-size .banner-sizes {
    width: 80%;
  }
}

/* Gymnasium Section */
.gynasium-section .content {
  border-top: 1px solid var(--clr-border);
}

/* Trade Show Section */
.trade-show-section .content {
  border-bottom: 1px solid var(--clr-border);
}

/* Retail Store Section */
.retail-store-section {
  width: min(1232px, calc(100% - 40px));
  margin: auto;
  padding-block: 82px;
  background: url(https://www.signs.com/blog/wp-content/uploads/2024/10/retail-store-big.jpg)
    no-repeat center/cover;
}

.retail-store-section .content-area {
  display: flex;
  justify-content: flex-end;
}
.retail-store-section .content {
  width: min(375px, 100%);
  padding: 26px 36px;
  background: #fff;
}

.retail-store-section .content h2 {
  margin-bottom: 32px;
  text-wrap: balance;
}

.retail-store-section .content p {
  margin-bottom: 20px;
  color: #000;
  line-height: 150%;
}

.retail-store-section .content span {
  display: block;
  font-style: italic;
  color: var(--clr-text);
  text-wrap: balance;
}
/* School Section */
.school-section .right-img-layout .content {
  border-top: 1px solid var(--clr-border);
  border-bottom: 1px solid var(--clr-border);
}

/* Construction Site Section */
.construction-site-section {
  background: #eef5f9;
}

/* Retail Store Section */
.parking-lot-section {
  width: min(1232px, calc(100% - 40px));
  margin: auto;
  padding-block: 82px;
  background: url(https://www.signs.com/blog/wp-content/uploads/2024/11/parking-lots-bg-img.jpg)
    no-repeat center/cover;
  aspect-ratio: 1440 / 878;
  display: flex;
  align-items: center;
}

.parking-lot-section .content-area {
  display: flex;
  justify-content: flex-end;
}
.parking-lot-section .content {
  width: min(375px, 100%);
  padding: 26px 36px;
  background: #fff;
}

.parking-lot-section .content h2 {
  margin-bottom: 32px;
  text-wrap: balance;
}

.parking-lot-section .content p {
  margin-bottom: 20px;
  color: #000;
  line-height: 150%;
}

.parking-lot-section .content span {
  display: block;
  font-style: italic;
  color: var(--clr-text);
  text-wrap: balance;
}

/* Real Estate Section */
.real-estate-section {
  background: #eef5f9;
  padding-bottom: 45px;
}

.real-estate-section > .content-area {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.real-estate-section .listing-item {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.real-estate-section .listing-item img {
  width: 100%;
  height: 370px;
  object-fit: cover;
}

.real-estate-section .listing-item .content {
  padding: 0 20px;
  position: relative;
  display: flex;
  flex-direction: column;
  /* gap: 32px; */
  flex-grow: 1;
}

.real-estate-section .listing-item .content::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  height: 24px;
  width: 2px;
  background: var(--clr-accent);
  border-radius: 2;
}

.real-estate-section .listing-item .content p {
  line-height: 150%;
  color: var(--clr-heading);
}

.real-estate-section .listing-item .content p:first-child {
  margin-bottom: 6px;
}

.real-estate-section .listing-item .content span {
  color: var(--clr-text);
  font-style: italic;
}

@media (max-width: 1024px) {
  .real-estate-section > .content-area {
    grid-template-columns: repeat(1, 1fr);
  }
}

/* Restaurants Section */
.restaurant-section {
  background: #eef5f9;
  padding-block: 52px;
}

.restaurant-section > .content-area {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 90px;
  position: relative;
}

.restaurant-section > .content-area::after {
  content: "";
  height: 1px;
  width: 100%;
  position: absolute;
  left: 0;
  bottom: -52px;
  background: var(--clr-border);
}

.restaurant-section .listing-item {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.restaurant-section .listing-item img {
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
  border-radius: 50%;
}

.restaurant-section .listing-item .content {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex-grow: 1;
  text-align: center;
}

.restaurant-section .listing-item .content .divider {
  display: block;
  height: 2px;
  width: 24px;
  background: var(--clr-accent);
  border-radius: 2;
  align-self: center;
}

.restaurant-section .listing-item .content p {
  line-height: 150%;
  color: var(--clr-heading);
  flex-grow: 1;
}

.restaurant-section .listing-item .content span {
  color: var(--clr-text);
  font-style: italic;
}

@media (max-width: 1024px) {
  .restaurant-section > .content-area {
    grid-template-columns: repeat(1, 1fr);
    gap: 32px;
  }
}

/* Banner Location Section */

.banner-location-section {
  width: min(1232px, calc(100% - 40px));
  margin: auto;
  padding-block: 82px;
  background: url(https://www.signs.com/blog/wp-content/uploads/2024/11/banner-location-usage-img.jpg)
    no-repeat center/cover;
  aspect-ratio: 1440 / 878;
  display: flex;
  align-items: center;
}

.banner-location-section .content-area {
  display: flex;
  justify-content: flex-start;
}
.banner-location-section .content {
  width: min(375px, 100%);
  padding: 26px 36px;
  background: #fff;
}

.banner-location-section .content h2 {
  margin-bottom: 32px;
  text-wrap: balance;
}

.banner-location-section .content p {
  margin-bottom: 20px;
  color: #000;
  line-height: 150%;
}

.banner-location-section .content span {
  display: block;
  font-style: italic;
  color: var(--clr-text);
  text-wrap: balance;
}

/* Banner Info Section */
.banner-info-section .content-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  padding-block: 36px 56px;
  border-bottom: 1px solid var(--clr-border);
  gap: 80px;
}
.banner-info-section .content-grid .content-item {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.banner-info-section .content-grid .content-item p {
  line-height: 150%;
  color: var(--clr-heading);
}

.banner-info-section .content-paragraph {
  padding-block: 42px 36px;
}

.banner-info-section .content-paragraph p {
  line-height: 150%;
  color: var(--clr-heading);
}

@media (max-width: 1024px) {
  .banner-info-section .content-grid {
    grid-template-columns: repeat(1, 1fr);
    gap: 32px;
  }
}

/* Final Thoughts Section */
.final-thoughts-section {
  padding-block: 42px;
  background: #eef5f9;
}
.final-thoughts-section h2 {
  margin-bottom: 16px;
}
.final-thoughts-section p {
  line-height: 150%;
  font-weight: 600;
  color: var(--clr-heading);
}

/* Article Section */
.article-section .related-article {
  padding-block: 42px;
  border-bottom: 1px solid var(--clr-border);
}
.article-section .related-article h2 {
  margin-bottom: 32px !important;
}
.article-section .related-article ul {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  width: min(778px, 100%);
  gap: 8px;
  padding-left: 16px;
}
.article-section .related-article ul li {
  list-style: disc;
  color: var(--clr-accent);
}
.article-section .related-article ul a {
  text-decoration: underline;
  color: inherit;
}

.article-section .browse-category {
  padding-block: 42px 100px;
}

.article-section .browse-category h2 {
  margin-bottom: 32px !important;
}
.article-section .browse-category .grid-item {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}

.article-section .browse-category .grid-item > div {
  display: flex;
  flex-direction: column;
  gap: 22px;
  padding-left: 16px;
}

.article-section .browse-category .grid-item > div ul {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.article-section .browse-category .grid-item > div ul li {
  list-style: disc;
  color: var(--clr-accent);
}

.article-section .browse-category .grid-item > div ul li a {
  text-decoration: underline;
  color: inherit;
}

@media (max-width: 1024px) {
  .article-section .related-article ul {
    grid-template-columns: repeat(1, 1fr);
  }
  .article-section .browse-category .grid-item {
    grid-template-columns: repeat(1, 1fr);
    gap: 32px;
  }
}