#content {
  container: content/inline-size;
}

.hero-banner {
  background-color: var(--primary-lightest);
}

.hero-banner .contact__breadcrumbs {
  font-size: 1.5rem;
  text-transform: uppercase;
  display: flex;
  gap: .5rem;
}

@container content (width > 850px) {
  .hero-banner .col-inner:has(.contact__breadcrumbs) {
    padding-right: 2rem;
  }
}

@container content (width < 1230px) {
  .hero-banner .col-inner:has(.contact__breadcrumbs) {
    padding-inline: 1rem 2rem;
  }
}

@container content (width < 850px) {
  .hero-banner .col-inner:has(.contact__breadcrumbs) {
    padding: 0 1rem;
  }

  .hero-banner .button-group {
    margin-bottom: 2rem;
  }
}

.hero-banner .current-page {
  font-weight: 700;
}

.hero-banner .page-title {
  font-size: clamp(3.6rem, 10vw, 6rem);
  line-height: 1.7;
  text-transform: capitalize;
  font-weight: 900;
  font-family: "Chonburi", serif;
}

.hero-banner .page-description {
  font-size: 2rem;
  margin-bottom: 1.6rem;
}

.hero-banner .button-group {
  display: grid;
  gap: 2rem;
  justify-items: flex-start;
}

.hero-banner .contact-now-btn {
  padding: 1rem 4rem;
  font-size: 2rem;
  background-color: var(--primary-medium);
  color: #fff;
  transition: background-color 300ms;
  border-radius: 4rem;
}

.hero-banner .contact-now-btn:hover {
  background-color: var(--primary-dark);
}

.hero-banner .call-now-btn {
  font-size: 4rem;
}

.hero-banner .call-now-btn > a {
  text-decoration: underline;
  transition: color 300ms;
}

/* CONTACT FORM */
.contact-form-section > .section-content {
	padding: 6rem 0;
}

.contact-form-section > .section-content > .row:first-child > .col > .col-inner {
	margin-bottom: 4rem;
}

.contact-form-section > .section-content > .row:first-child > .col > .col-inner p {
	font-size: 2rem;
	line-height: 1.5;
}

@media screen and (max-width: 549px) {
	.contact-form-section > .section-content > .row:last-child > .col:last-child > .col-inner {
		margin-top: 2rem;
	}

	.contact-form-section > .section-content > .row:last-child > .col:last-child > .col-inner form {
		padding: 2rem 1.5rem;
	}
}

@media screen and (min-width: 550px) and (max-width: 849px) {
	.contact-form-section > .section-content > .row:last-child > .col:last-child > .col-inner {
		margin-top: 3rem;
	}

	.contact-form-section > .section-content > .row:last-child > .col:last-child > .col-inner form {
		padding: 2rem;
	}
}

@media (min-width: 850px) {
	.contact-form-section > .section-content > .row:last-child > .col:last-child {
		padding-left: 2rem !important;
	}
}

.form-lien-he {
	padding: 4rem 3rem;
	background-color: var(--gray-dark);
	display: flex;
	flex-flow: column nowrap;
	gap: 1rem;
	font-size: 1.6rem;
}

.form-lien-he input[type='submit'] {
	margin: 0 !important;
}

.form-lien-he .wpcf7-spinner {
	display: none;
}

.company-location > .section-content {
	padding: 6rem 0;
}

@media screen and (max-width: 549px) {
	.company-location > .section-content {
		padding: 0 0 3rem;
	}
}

@media screen and (min-width: 550px) and (max-width: 849px) {
	.company-location > .section-content {
		padding: 2rem 0 3rem;
	}
}

.company-location > .section-content #company-map-location {
	width: 100%;
	aspect-ratio: 1.5;
}