@charset "utf-8";
@media (max-width: 1919.98px) {}

@media (max-width: 1599.98px) {	
	.banner .banner--content { width: 50%; }

	.section--list { width: 44%; left: 46%; }

	.our--team .team--list li .img--box { height: 250px; }
}
@media (max-width: 1199.98px) {
	.header { z-index: 100; }
	.header .navbar { flex-wrap: nowrap; justify-content: space-between; }
	.header .brand--logo { width: 160px; }
	.header .navbar ul.primary--nav,
	.header ul.secondary--nav { display: none; }
	.mobile--menu { display: flex; }
	.menu--toggle { display: inline-flex; }

	.introduction .img--list { margin-top: var(--space-lg); margin-bottom: 0; }

	.our--team .team--list { grid-template-columns: repeat(2, 1fr); }
	.our--team .team--list li .img--box { height: 350px; }

	.footer .footer--links li a br { display: none; }

	.contact--form { width: 100%; margin-bottom: var(--space-xxxl); }
	.form--map iframe { min-height: clamp(300px, calc(208.98px + 24.272vw), 500px); }
}
@media (max-width: 1023.98px) {
	.banner .banner--content { width: 70%; }
}

@media (max-width: 991.98px) {
	.service--box { width: 100%; }
	.home--service { align-content: flex-start; gap: var(--space-xxl); }
	.home--service .img--box { position: static; margin: auto; }
	.home--service .floating--icon { right: 80%; opacity: 0; }

	.vision--mission:not(.our--approach) .title--wrapper, .rnd--section .title--wrapper { padding: var(--space-xxl) 0 calc(var(--space-xl) * 2); }

	.multi--section { align-items: flex-start; }
	.multi--section .pagination { padding: calc(var(--space-xl) * 2) 0 var(--space-xl); background: rgb(var(--white) / 1); clip-path: inset(0% 0% 0% 0%); }
	.section--list { width: 100%; left: 0; }
	.section--list .section--box { max-width: 720px; margin: auto; --bs-gutter-x: 1.5rem; padding: 0 calc(var(--bs-gutter-x) * .5); }

	.code--of--conduct .code--grid { grid-template-columns: repeat(3, 1fr); }
	.code--of--conduct .code--grid .grid--box:nth-child(4n):after { display: flex; }
	.code--of--conduct .code--grid .grid--box:nth-child(3n):after { display: none; }

	.multi--section .title--wrapper { margin-bottom: calc(var(--space-md) * 2); }

	.sustainability--box, .career--section .title--wrapper { padding: var(--space-xxl) 0 calc(var(--space-xl) * 2); }
	.sustainability--list .img--box, .vision--mission .img--box, .rnd--section .img--box, .career--section .img--box { max-width: 320px; }

	.contact--us .row { row-gap: var(--space-xxl); }
	
	.vision--mission .img--box, .sustainability--list .img--box, .rnd--section .img--box, .career--section .img--box { margin-left: 20%; }
}

@media (max-width: 767.98px) {
	.header::after { height: 130%; }
	.banner { height: 100vh; padding-bottom: 30vh; }
	.banner--bg { height: 100vh; bottom: auto; top: 0; will-change: transform; }
	.banner .banner--content { width: 100%; }
	.banner--bg video { height: 100%; }

	.introduction { padding: var(--section--space) 0; }

	.news--list { display: flex; overflow: auto; width: 100%; }
	.news--section .news--list li { min-width: 280px; }

	.footer .footer--links:not(:has(+ .social--links)) { margin-bottom: var(--space-xxxl); }
	.footer .footer--title { font-size: var(--fs-xl); }
	.footer .footer--links li a { font-size: var(--fs-md); }
	.footer .copy p { margin-bottom: var(--space-xs); }

	.section--list { padding-top: 320px; }
	.section--list .section--box { min-height: 50vh; }

	.our--team .team--list li .img--box { height: 200px; }

	.code--of--conduct .code--grid { grid-template-columns: repeat(2, 1fr); }
	.code--of--conduct .code--grid .grid--box:nth-child(3n):after { display: flex; }
	.code--of--conduct .code--grid .grid--box:nth-child(2n):after { display: none; }

	.vision--mission { align-items: flex-start; }
	.our--approach .title--wrapper { margin-bottom: var(--space-lg); }

	.sustainability--list, .rnd--section, .career--section { align-items: flex-start; }

	.breadcrumb-item + .breadcrumb-item::before { padding-right: 5px; }
	
	.filters { overflow: auto; }
	
	.multi--section--spacer > .multi--section .section--list { padding: var(--section--space) 0; }
	
	.single--details ul.related--link { display: flex; flex-direction: row; overflow: auto; }
	.single--details ul.related--link li { min-width: 280px; }
	
	.overview .breadcrumb { white-space: nowrap; }
}