/*!
Theme Name: PTB
Theme URI: http://underscores.me/
Author: StarlitDevs
Author URI: https://starlitdevs.com/
Description: This is a custom theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: ptb
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

StarlitDevs is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

:root{
    --color-white: #fff;
	--color-text: #494B53;
	--color-red: #DB362D;
	--color-black: #141417;
	--color-border: #EAEAEA;
	--color-dark-gray: #323232;
	--color-light-gray: #F1F1F1;
	--primary-font: 'Indivisible';
}
body{
	-webkit-font-smoothing: antialiased; /* Chrome, Safari */
	-moz-osx-font-smoothing: grayscale; /* Firefox */
	font-family: var(--primary-font);
	line-height: 2;
	font-size: 15px;
	font-weight: 400;
	color: var(--color-text);
	letter-spacing: -2%;
}
body, html{
	scroll-behavior: smooth;
	scroll-padding-top: 100px;
}
h1, h2, h3, h4, h5, h6{
	line-height: 1;
	margin: 0;
	padding: 0;
	font-weight: 600;
}
h1{
	font-size: 10px;
	letter-spacing: 4px;
	line-height: 1;
	font-weight: 400;
}
h2{
	font-size: 64px;
	letter-spacing: -2%;
}
h3{
	font-size: 40px;
	letter-spacing: -2%;
	color: var(--color-black);
}
h4{
	font-size: 32px;
	letter-spacing: -2%;
}
p{
	margin: 0;
}
p:not(:last-child){
	margin-bottom: 20px;
}
img{
	width: 100%;
	object-fit: cover;
	object-position: center;
	height: auto;
}
ul{
	margin: 0;
	padding: 0;
}
a{
	text-decoration: none;
	transition: .4s;
}
a:focus{
	outline: none;
}
.btn{
	padding: 9px 20px;
	border-radius: 8px;
	font-size: 13px;
	line-height: 2;
	letter-spacing: 6%;
	font-weight: 600;
	transition: .3s;
	text-transform: uppercase;
	max-width: 208px;
	width: 100%;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	gap: 10px;
}
.btn-red{
	background-color: var(--color-red);
	color: var(--color-white);
}
.btn-red:hover{
	background: var(--color-white);
	color: var(--color-black);
}
.btn-white{
	background-color: transparent;
	color: var(--color-white);
	border: 1px solid var(--color-white);
}
.btn-white:hover{
	background-color: var(--color-white);
	color: var(--color-black);
}
.blur-bg{
	background-color: #FFFFFF17;
	border: 1px solid #FFFFFF1A;
	backdrop-filter: blur(21px);
}
.bg-light-gray{
	background-color: var(--color-light-gray);
}
.bg-dark-gray{
	background-color: var(--color-dark-gray);
}
.bg {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}
.py-100{
	padding-top: 100px;
	padding-bottom: 100px;
}
.pt-100{
	padding-top: 100px;
}
.pb-100{
	padding-bottom: 100px;
}
.pb-40{
	padding-bottom: 40px;
}
.pt-40{
	padding-top: 40px;
}
.container{
	max-width: 1380px;
	padding-inline:20px;
	margin-inline: auto;
}


/* header */

.header-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-block: 12px;
}
.header-logo {
  max-width: 167px;
}
.header-menu ul {
  display: flex;
  gap: 70px;
  list-style: none;
}
.header-menu ul li a {
  color: var(--color-white);
  text-transform: uppercase;
  letter-spacing: 2.72px;
}
.header-menu ul li a:hover {
  color: var(--color-red);
}
.button-group {
	display: flex;
	gap: 11px;
	max-width: 428px;
	width: 100%;
	flex-wrap: wrap;
}
.btn-red svg {
	width: 12px;
	height: 12px;
}
.site-header {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  z-index: 99;
  transition: all .3s ease;
}
.site-header.sticky-active{
	background-color: var(--color-black);
}
body.admin-bar .site-header {
  top: 32px;
}

/* banner */

.banner {
  position: relative;
  z-index: 1;
  padding-top: 156px;
  padding-bottom: 30px;
}
.banner::before {
	content: '';
	position: absolute;
	inset: 0;
	background-color: #0000006B;
}
.bg-video {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: -1;
  object-fit: cover;
}
.super-title {
  width: max-content;
  margin-bottom: 30px;
  background-color: #00000014;
  padding: 10px 21px;
  border: 1px solid #FFFFFF1A;
  backdrop-filter: blur(25.8px);
  border-radius: 57px;
  color: var(--color-white);
}
.banner-title {
  margin-bottom: 30px;
  max-width: 760px;
  color: var(--color-white);
}
.banner-content {
  padding-block: 66px;
  position: relative;
}
.banner-title h2 {
  font-weight: 400;
  margin-bottom: 30px;
}
.banner-title h2 strong {
  font-weight: 700;
}
.video-play-btn {
  position: absolute;
  right: 0;
  bottom: 0;
  background-color: transparent;
  border: none;
  color: var(--color-white);
  padding: 0;
  transition: color .4s ease;
}
.video-play-btn:hover, .video-play-btn:focus {
  color: var(--color-red);
}
.video-play-btn.is-playing svg {
	color: var(--color-red);
}
.banner-cta {
  display: flex;
  align-items: center;
  padding: 23px 50px;
  gap: 42px;
  border-radius: 15px;
  margin-top: 39px;
}
.cta-repeater {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  flex: 1;
  border-radius: 10px;
  background-color: #00000017;
  border: 1px solid #FFFFFF1A;
}
.banner-cta-heading {
	max-width: 200px;
}
.banner-cta-heading h4 {
	color: var(--color-white);
	font-size: 20px;
	text-transform: uppercase;
}
.cta-repeater-item {
  padding: 28px 38px;
  display: flex;
  align-items: center;
  gap: 15px;
  color: var(--color-white);
}
.cta-repeater-item:nth-child(2){
	border-inline: 1px solid #FFFFFF1A;
}
.cta-icon {
  width: 30px;
  height: 30px;
}
.cta-item-text{
	font-size: 18px;
	line-height: 1;
}

/* mobile menu */

.menu-btn{
	display: none;
}
.menu-btn button {
  background-color: var(--color-red);
  border: none;
  color: var(--color-white);
  width: 46px;
  height: 46px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  transition: all .3s ease;
  padding: 0;
}
.menu-btn button svg {
  width: 25px;
  height: 25px;
}
.menu-btn button:hover {
  background-color: var(--color-white);
  color: var(--color-black);
}
.mobile-menu {
  position: absolute;
  top: 0;
  left: 0;
  background-color: var(--color-light-gray);
  height: 100vh;
  width: 50%;
  padding: 32px;
  z-index: 50;
  transition: all .6s ease;
}
.mobile-menu ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 24px;
}
.mobile-menu ul li a {
  color: var(--color-black);
  text-transform: uppercase;
  letter-spacing: 2.72px;
}
.mobile-menu ul li a:hover {
  color: var(--color-red);
}
.menu-close {
	position: absolute;
	top: 20px;
	right: 20px;
	border: none;
	background-color: var(--color-red);
	color: var(--color-white);
	border-radius: 50%;
	height: 34px;
	width: 34px;
	transition: background-color .3s ease;
	border: 1px solid var(--color-red);
	display: grid;
	place-items: center;
}
.menu-close:hover{
	background-color: var(--color-yellow);
	color: var(--color-black);
}
.left-0{
	left: 0;
}
.left-50{
	left: -50%;
}
.overlay {
	position: absolute;
	inset: 0;
	background-color: var(--color-black);
	opacity: 0;
	z-index: 40;
	cursor: pointer;
	pointer-events: none;
	transition: all .5s ease;
}
.overlay.active{
	opacity: 0.5;
	pointer-events: auto;
}
body.no-scroll{
	overflow: hidden;
}

/* brands logo */
.brands-logo {
	width: 100%;
	padding-block: 50px;
	border-bottom: 1px solid var(--color-border);
}
.marquee-track {
    overflow: hidden;
    width: 100%;
}
.marquee-inner {
    display: flex;
    width: max-content;
    animation: marquee-scroll 30s linear infinite;
}
.marquee-inner:hover {
    animation-play-state: paused;
}
.brands-logo-img {
    flex-shrink: 0;
    padding: 0 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}
@keyframes marquee-scroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-33.333%);
    }
}


/* services */
.services-heading {
  max-width: 555px;
  margin-inline: auto;
  text-align: center;
  margin-bottom: 70px;
}
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.services-item-1{
	grid-area: 1 / 1 / 2 / 2;
}
.services-item-2{
	grid-area: 1 / 2 / 2 / 3;
}
.services-item-3{
	grid-area: 1 / 3 / 2 / 4;
}
.services-item-4{
	grid-area: 2 / 1 / 3 / 4;
}

.services-item {
  position: relative;
  overflow: hidden;
  border-radius: 15px;
}
.services-content {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 15px;
  color: var(--color-white);
  z-index: 1;
}
.services-item::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: #000;
  opacity: 0.2;
  z-index: 1;
}
.services-item img {
  height: 100%;
  max-height: 461px;
  aspect-ratio: 1 / 1.066;
  transition: all .6s ease;
}
.services-item:hover img{
	transform: scale(1.07);
}
.services-description {
  padding: 20px;
  border-radius: 15px;
}
.services-description p {
  letter-spacing: -2%;
}
.services-item-heading {
  padding: 25px;
  max-width: 304px;
}

/* social events */

.social-content-top {
  color: var(--color-white);
  padding: 60px;
  border-radius: 15px;
  margin-bottom: 20px;
}
.social-content-top-heading h3 {
  color: var(--color-white);
  margin-bottom: 30px;
}
.social-content-top-heading {
  margin-bottom: 30px;
}
.social-content-bottom {
  padding: 60px;
  border-radius: 15px;
}
.social-content-bottom-heading {
  max-width: 442px;
  margin-bottom: 35px;
}
.social-event-img {
  height: 100%;
  border-radius: 15px;
  overflow: hidden;
}
.social-event-img img {
  height: 100%;
  transition: transform .6s ease;
}
.social-event-img:hover img {
  transform: scale(1.07);
}
.social-event .row{
	--bs-gutter-x: 20px;
}
.event-slide-text {
	font-size: 20px;
	line-height: 1;
	font-weight: 500;
	color: var(--color-black);
	margin-top: 15px;
}
.event-slide-content {
	background-color: var(--color-white);
	padding: 20px 30px;
	border-radius: 25px;
}
.event-carousel-navigate {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
}
.event-carousel-navigation-next {
  left: auto;
  right: 0;
}
.event-carousel{
	padding-inline: 10px;
}
.event-carousel-pagination {
	text-align: center;
	margin-top: 22px;
	line-height: 1;
}
.event-carousel-pagination .swiper-pagination-bullet-active {
	background-color: var(--color-black) !important;
}
.event-carousel-pagination .swiper-pagination-bullet {
	background-color: var(--color-white);
	opacity: 1;
	margin-inline: 7px !important;
}

/* contact */
.contact-content {
  padding: 60px;
  border-radius: 15px;
}
.contact-title {
  margin-bottom: 30px;
}
.contact-title h3 {
  margin-bottom: 30px;
}
.contact-info-item a {
  padding: 25px 30px;
  background-color: var(--color-white);
  border-radius: 15px;
  display: inline-flex;
  align-items: center;
  gap: 15px;
  color: var(--color-black);
  font-size: 20px;
  font-weight: 500;
  line-height: 1.1;
  word-break: break-word;
}
.contact-info-item.phone {
  margin-bottom: 10px;
}


/* testimonials */

.testimonials-inner {
  padding-inline: 58px;
  padding-block: 82px;
  border-radius: 15px;
}
.testimonilas-heading {
  text-align: center;
  margin-bottom: 70px;
}
.testimonials-content {
  padding: 40px;
  background-color: var(--color-white);
  border-radius: 15px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.testimonilas-rating {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
  padding: 15px 20px;
  background-color: var(--color-border);
  border-radius: 10px;
  margin-top: 30px;
}
.author {
  font-size: 15px;
  font-weight: 600;
}
.testimonials-carousel-navigate {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
.testimonials-carousel-navigation-next {
  right: 0;
  left: auto;
}
.testimonials-carousel {
  padding-inline: 10px;
}

/* pricing */

.pricing-content {
  padding-inline: 60px;
  padding-block: 80px;
  border-radius: 15px;
  color: var(--color-white);
  max-width: 913px;
  width: 100%;
}
.pricing-content h3 {
  color: var(--color-white);
  margin-bottom: 30px;
}
.pricing-content h3 strong {
  font-weight: 600;
  color: var(--color-red);
}
.pricing-price {
  max-width: 413px;
  width: 100%;
  background-color: var(--color-red);
  color: var(--color-white);
  border-radius: 15px;
  padding-block: 50px;
  text-align: center;
  padding-inline: 30px;
  align-content: center;
}
.pricing-inner {
  gap: 15px;
}
.price-unit {
  font-size: 20px;
  font-weight: 600;
}
.price-number {
  font-weight: 700;
  font-size: 96px;
  line-height: 1;
  margin-bottom: 10px;
}


/* gallery */
.gallery-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
.gallery-grid-item {
    overflow: hidden;
    border-radius: 15px;
}
.gallery-grid-item img {
    height: 100%;
	max-height: 524px;
    display: block;
    transition: transform 0.6s ease;
}
.gallery-grid-item:hover img {
    transform: scale(1.07);
}
.gallery-grid-item:nth-child(4){
	grid-column: span 2;
}

/* footer */

.footer-top {
  padding-top: 58px;
  padding-bottom: 45px;
  border-bottom: 1px solid var(--color-border);
}
.footer-logo-area {
  max-width: 152px;
}
.footer-navigation {
  max-width: 510px;
  width: 100%;
  display: flex;
  gap: 30px;
}
.footer-links {
  flex: 1;
}
.footer-links-title {
  font-weight: 600;
  margin-bottom: 13px;
}
.footer-links ul {
  list-style: none;
}
.footer-links ul a {
  color: var(--color-text);
}
.footer-links ul a:hover {
  color: var(--color-red);
}
.footer-contact a {
  color: var(--color-text);
  display: block;
}
.footer-contact a:last-child {
  text-decoration: underline;
}
.footer-contact a:hover {
  color: var(--color-red);
}
.social-icons {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.social-icon {
  color: var(--color-black);
}
.social-icon:hover {
  color: var(--color-red);
}
.footer-bottom {
  padding-top: 32px;
  padding-bottom: 22px;
  color: var(--color-black);
}
.designer span {
  font-weight: 500;
}

/* thank you */
body.page-template-thank-you .site-header {
	position: unset;
	background-color: var(--bs-black);
}
.thank-you-content h1 {
  font-size: 66px;
  font-weight: 700;
  letter-spacing: -2%;
  color: var(--color-red);
  margin-bottom: 10px;
}
.thank-you p {
  font-size: 20px;
  font-weight: 500;
  color: var(--color-black);
}



/* Responsive */

@media (max-width: 1299.98px){
	.banner-cta {
		padding-inline: 30px;
	}
	.cta-repeater-item {
		padding-inline: 30px;
	}
	.banner-cta-heading {
		max-width: 180px;
	}
	.cta-item-text {
		font-size: 16px;
	}

	.contact-info-item a {
		padding: 12px 20px;
		font-size: 18px;
	}
	.contact-content {
		padding: 40px;
	}

	/* pricing */
	.pricing-content{
		padding-inline: 48px;
		padding-block: 70px;
	}
}
@media (max-width: 1199.98px){
	h2{
		font-size: 48px;
	}
	.btn {
		max-width: 200px;
	}
	.button-group {
		max-width: 412px;
	}
	.header-menu ul {
		gap: 20px;
	}

	/* event carousel */
	.event-slide-content{
		padding-inline: 25px;
	}
	.event-slide-text{
		font-size: 17px;
	}

	/* contact */
	.contact-info-item a {
		font-size: 16px;
		gap: 10px;
	}

	/* testimonials */
	.testimonials-inner {
		padding-inline: 50px;
		padding-block: 60px;
	}
}
@media (max-width: 991.98px){
	h3{
		font-size: 38px;
	}
	.py-100{
		padding-block: 80px;
	}
	.pt-100{
		padding-top: 80px;
	}
	.pb-100{
		padding-bottom: 80px;
	}
	.header-menu {
		display: none;
	}
	.header-buttons{
		max-width: 100%;
		flex: 1;
		justify-content: end;
	}
	.menu-btn {
		display: block;
	}
	.banner-cta.blur-bg {
		flex-direction: column;
		align-items: start;
		gap: 20px;
	}
	.banner-cta-heading {
		max-width: 100%;
	}
	.services-heading {
		margin-bottom: 40px;
	}
	.services-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.services-item {
		grid-area: unset;
	}

	/* event carousel */
	.social-content-bottom {
		margin-bottom: 20px;
		padding: 40px;
	}
	.social-content-top{
		padding: 40px;
	}

	/* testimonials */
	.testimonilas-heading {
		margin-bottom: 40px;
	}

	/* pricing */
	.pricing-content {
		padding-inline: 40px;
		padding-block: 60px;
	}

	/* footer */
	.footer-navigation {
		width: auto;
	}
}
@media (max-width: 782.98px){
	body.admin-bar .site-header{
		top: 46px;
	}
}
@media (max-width: 767.98px){

	.py-100{
		padding-block: 60px;
	}
	.pt-100{
		padding-top: 60px;
	}
	.pb-100{
		padding-bottom: 60px;
	}
	.header-buttons .btn-white {
		display: none;
	}
	.header-buttons .btn-red .btn-text {
		display: none;
	}
	.header-buttons .btn-red {
		width: 46px;
		height: 46px;
		padding: 0;
		border-radius: 50%;
	}
	.header-buttons .btn-red svg{
		width: 18px;
		height: 18px;
	}
	.header-buttons {
		width: auto;
	}
	.left-50{
		left: -100%;
	}
	.mobile-menu{
		width: 100%;
	}
	.banner-cta-heading h4 {
		text-align: center;
		font-size: 18px;
	}
	h2 {
		font-size: 32px;
	}
	.super-title {
		margin-bottom: 20px;
		margin-inline: auto;
	}
	.banner-content {
		padding-bottom: 40px;
		padding-top: 0;
		text-align: center;
	}
	body {
		line-height: 1.6;
	}
	.banner-title h2 {
		margin-bottom: 20px;
	}
	.banner-buttons {
		justify-content: center;
		margin-inline: auto;
	}
	.cta-repeater-item {
		padding: 20px;
	}

	/* brands logo */
	.brands-logo-img{
		padding-inline: 30px;
	}

	/* services */
	h4{
		font-size: 28px;
	}
	.services-grid {
		grid-template-columns: 1fr;
	}

	/* social events */
	.social-content-top {
		padding: 30px;
		text-align: center;
	}
	.social-content-bottom {
		padding: 30px;
		text-align: center;
	}
	.social-events-buttons {
		justify-content: center;
		margin-inline: auto;
	}
	.social-content-top-heading {
		margin-bottom: 20px;
	}
	.social-content-top-heading h3 {
		margin-bottom: 20px;
	}
	.social-content-bottom-heading {
		margin-bottom: 30px;
	}
	h3 {
		font-size: 32px;
	}

	/* testimonials */
	.testimonials-inner {
		padding-inline: 20px;
		padding-block: 40px;
	}
	.testimonilas-rating {
		flex-direction: column;
		gap: 5px;
		padding: 10px;
	}
	.testimonials-content {
		padding: 24px;
	}
	.contact-info-item a {
		padding-inline: 15px;
		font-size: 14px;
	}
	.testimonials-text {
		text-align: center;
	}
	.contact-title h3 {
		margin-bottom: 20px;
		}
	.contact-title {
		margin-bottom: 20px;
	}
	.contact-content {
		padding: 30px 20px;
		text-align: center;
	}

	/* pricing */
	.pricing-content {
		text-align: center;
		padding-block: 50px;
		padding-inline: 30px;
	}
	.pricing-content h3 {
		font-size: 29px;
		margin-bottom: 20px;
	}
	.price-number {
		font-size: 64px;
	}
	.pricing-price {
		max-width: 100%;
	}	
	
	

	/* gallery */
	.gallery-grid {
		grid-template-columns: 1fr;
	}
	.gallery-grid-item {
		grid-column: auto !important;
		aspect-ratio: 1;
	}
	.gallery-grid-item img {
		max-height: 100%;
	}	

	/* footer */
	
	.footer-top {
		flex-direction: column;
		text-align: center;
		padding-top: 40px;
		padding-bottom: 32px;
	}
	.footer-logo-area {
		margin-inline: auto;
	}
	.footer-navigation {
		flex-direction: column;
		padding-top: 30px;
		max-width: 100%;
	}
	.footer-bottom {
		flex-direction: column;
		padding-top: 22px;
	}
		
	.thank-you-content h1 {
		font-size: 48px;
	}
	.thank-you p {
		font-size: 16px;
		line-height: 1.2;
	}
}
@media (max-width: 600.98px){
	body.admin-bar .site-header.sticky-active{
		top: 0;
	}
}


@media (max-width: 575px) {
	.cta-repeater {
		grid-template-columns: 1fr;
		width: 100%;
	}
	.cta-repeater-item:nth-child(2) {
		border-block: 1px solid #FFFFFF1A;
		border-inline: none;
	}	
	
}