/* Load Gotham Book */
@font-face {
    font-family: 'GothamBook';
    src: url('fonts/GothamBook.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/* Load Saldo Medium */
@font-face {
    font-family: 'SaldoMedium';
    src: url('fonts/saldo-medium.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

body{margin:0; font-family: 'GothamBook', sans-serif;}

.gotham {
    font-family: 'GothamBook', sans-serif;
}

.saldo {
    font-family: 'SaldoMedium', sans-serif;
}
section {position:relative;width:100%;height:100vh;overflow:hidden;display:flex;}
.bg-dark {background-color: #000 !important;}
.play-btn {
    background-color: hsla(0,0%,100%,.85);
    font-size: 24px;
    line-height: 32px;
    position: relative
}

.play-btn:before {
    animation-delay: 0s;
    animation: pulsate1 2s;
    animation-direction: forwards;
    animation-iteration-count: infinite;
    animation-timing-function: steps;
    border: 5px solid var(--bs-border-color);
    border-radius: 50%;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,.3);
    content: "";
    height: 150%;
    opacity: 1;
    position: absolute;
    width: 150%
}
.album{
    padding-top:150px;
    background: black;
}
.disclaimer{margin-top:20px; color:#FFF; font-size:10px; text-align:center;}
.navbar{
    background-color: black !important;
}
.navbar-brand{
    margin-right: 0 !important;
}
.icon-shape {
    align-items: center;
    display: inline-flex;
    justify-content: center;
    text-align: center;
    vertical-align: middle
}
.icon-xl {
    height: 3.5rem;
    line-height: 3.5rem;
    width: 3.5rem
}
.albumTitle{
    font-size: 18px;
    font-weight: bold;
    margin-top: 8px;
    text-align: center;
    color: white;
}
@keyframes pulsate1 {
    0% {
        opacity: 1;
        transform: scale(.8)
    }

    to {
        box-shadow: none;
        opacity: 0;
        transform: scale(1)
    }
}
footer ul{
    justify-content: end;
}

@media (max-width: 600px){
    .navbar-brand{
        margin-right: 0;
    }
}

@media (max-width: 768px){
    footer p{
        text-align: center;
    }
    footer ul{
        justify-content: center ;
    }
}

.logo-section{position:fixed; width: 100%; padding-top: 10px; z-index:10;}

.hero-section{position:relative;width:100%;height:100vh;overflow:hidden;display:flex;color:#fff}
.hero-section h1{text-align: center; white-space: pre-wrap; transition-timing-function: ease; transition-duration: 0.65s; transition-delay: 0.195s;}

/* iframe wrapper sits behind content */
.video-embed{
    position:absolute;inset:0;overflow:hidden;z-index:0;pointer-events:none;
}


/* make iframe cover the container */
.video-embed iframe{
    position:absolute;top:50%;left:50%;width:177.77vh;height:100vh; /* 16:9 aspect ratio hack */
    transform:translate(-50%,-50%);min-width:100%;min-height:100%;
    pointer-events:none; /* let clicks pass through */
}


/* Overlay and centered content */
.overlay{position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,0.35), rgba(0,0,0,0.55));z-index:1}
.hero-content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;justify-content:end;gap:1rem; padding-bottom:50px;}
h1{font-size:clamp(1.8rem, 4vw + 1rem, 4rem);line-height:1.05;font-weight:700;text-shadow:0 6px 30px rgba(0,0,0,0.45); font-size:70px;}
p.lead{max-width:100%;margin:0;opacity:0.95; font-size: calc(1vw * 20 / 19.2); font-size:35px;}
p.lead>span.about-heading{color:#ad854c; font-weight:bold;}

/* Responsive adjustments */
@media (max-width:520px){.video-embed iframe{width:300vw;height:56.25vw;} .overlay{background:linear-gradient(180deg, rgba(0,0,0,0.45), rgba(0,0,0,0.7));}}


/* Contact Form */

.contact-section {
  position: relative;
  width: 100%;
  padding: 200px 0;
  color: #fff;
  overflow: hidden;
}

/* Background Video */
.contact-video-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}
/* Background Image */
.contact-image-bg {
  position: absolute;
  inset: 0;
  background: url("../imgs/heroImg.jpg") center/cover no-repeat;
  z-index: 0;
}
.contact-video-bg iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 177.77vh;
  height: 100vh;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

/* Dark overlay */
.contact-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.45);
  z-index: 1;
}

/* Content container */
.contact-container {
  position: relative;
  z-index: 2;
  max-width: 800px;
  margin-left: 60px;
}

/* Form Styles */
.contact-form label {
  font-size: 14px;
  margin-bottom: 6px;
  display: block;
}

.contact-form input,
.contact-form textarea {
  width: 100%;
  padding: 14px;
  border: none;
  background: #fff;
  color: #000;
  font-size: 16px;
  margin-bottom: 16px;
}

.two-cols {
  display: flex;
  gap: 18px;
}

.checkbox {
  display: flex;
  gap: 10px;
  align-items: center;
}

.submit-btn {
  background: #a7b29b;
  padding: 14px 28px;
  border: none;
  cursor: pointer;
  color: #000;
  font-size: 18px;
  margin-top: 10px;
}
.locatio{z-index:1;}
.location .location-title{font-size: 30px; font-weight:bold; padding-top:20px;}
.location .location-name, .location-email, .location-phone{ 
  font-size: 24px;
    color: #e6e6e6;
    font-weight: 300;
    line-height: 35px;
    margin-bottom: 0px;
}
.location .location-email a{
  color:#FFF; 
  cursor: pointer;
}
.location .location-email a:hover, .location .location-phone a:hover{
  color: #ad854c;
  cursor: pointer;
}
.social-icons {
  display: flex;
  gap: 18px;
  margin-top: 20px;
}

.social-icons a {
  color: #fff;
  text-decoration: none;
  font-weight: 600;
}
.social-icons.header-menu a{
  text-transform: uppercase;
}
.social-icons.header-menu a.hover-line{
  position: relative;
  display: inline-block;
  text-decoration: none;
  color: #FFF;       /* Text color */
  padding-bottom: 2px;     /* A little space for the line */
  max-height:30px;
  font-size: 16px;
}
.social-icons.header-menu a.hover-line::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;               /* Aligns line at the bottom of the text */
  width: 100%;
  height: 2px;             /* Line thickness */
  background: #ad854c;     /* Line color */
  transform: scaleX(0);    /* Start hidden */
  transform-origin: left;  /* Grows from left to right */
  transition: transform 0.3s ease;
}
.social-icons.header-menu a.hover-line:hover::after {
  transform: scaleX(1);
}
.social-icon {
  display: inline-block;
  transition: opacity 0.3s ease; /* Smooth animation */
  opacity: 1;
}
.social-icons img {
  transition: opacity 0.3s ease;
}

.social-icons img:hover {
  opacity: 0.6;
}
.social-icon {
  display: inline-block;
  transition: transform 0.6s ease; /* Smooth zoom animation */
}

/* On hover: zoom in */
.social-icon:hover {
  transform: scale(1.15);  /* Increase size slightly */
}
.menu-link.active {
  border-bottom: 2px solid #ad854c; /* underline color */
  transition: transform 0.6s ease;
}
@media(max-width: 768px) {
  .two-cols { flex-direction: column; }
  .contact-container { margin-left: 20px; margin-right: 20px; }
  .contact-video-bg iframe { width: 300vw; height: 56.25vw; }
}

/* header section */

.logo-text{color: #FFF; text-align:center; font-size: 18px;font-weight: bold;text-transform: uppercase; padding-top: 20px;}
.logo-text img{max-width:150px;}
/* Video Section */
.video-section { padding:40px 0 20px 0; background: #000; }
.film-button{padding:0 0 10px 0 ; text-align:right; text-transform: uppercase;}
.film-button a{position:relative; text-decoration: none; text-transform: uppercase; font-size: 14px; color:#FFF;transition: transform 0.6s ease;}
.film-button a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;               /* Aligns line at the bottom of the text */
  width: 100%;
  height: 2px;             /* Line thickness */
  background: #ad854c;     /* Line color */
  transform: scaleX(0);    /* Start hidden */
  transform-origin: left;  /* Grows from left to right */
  transition: transform 0.3s ease;
}
.film-button a:hover::after{
  transform: scaleX(1);
}
  /* Main Video */
  #mainVideoWrapper iframe {
    width:100%;
    height:450px;
    border:none;
    border-radius:6px;
  }

  /* Carousel */
  .carousel-wrapper {
    display:flex;
    align-items:center;
  }

  .carousel {
    overflow:hidden;
    width:100%;
  }

  .carousel-track {
    display:flex;
    gap:20px;
    transition:transform .3s ease;
  }

  .thumb {
    width:320px;
    height:180px;
    position:relative;
    cursor:pointer;
    border-radius:6px;
    overflow:hidden;
    box-shadow: 0 8px 20px rgba(0,0,0,0.35);
  }
  .thumb:hover::before {
  right: 0;
}
.thumb .thumb-box-title{
  position: relative;
  font-size:24px; 
  color:#FFF; 
  justify-content: center;   /* Horizontal center */
  align-items: center;       /* Vertical center */
  height: 180px; 
  display:none;
  transition: right 0.9s ease;   /* Smooth sliding effect */
  padding: 72px 128px;
  text-transform: uppercase;
  /* background: rgba(173, 133, 76, 0.5); */
}


.thumb::before {
  content: "";
  position: absolute;
  top: 0;
  right: -100%;             /* Completely hide on the right side */
  width: 100%;
  height: 100%;
  background: rgba(173, 133, 76, 0.5);       /* Color that will slide in */
  transition: right 0.5s ease;   /* Smooth sliding effect */
  z-index: 0;
}
  .thumb iframe {
    width:100%;
    height:100%;
    pointer-events:none; /* so clicking loads main video instead of playing tiny video */
  }
.thumb:hover>.thumb-box-title{
  display:block;
}
  /* Arrows */
  .arrow {
    width:46px;
    height:46px;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    background:rgba(255,255,255,0.06);
    margin:0 12px;
    border-radius:4px;
  }

  .arrow svg { width:20px; height:20px; stroke:#fff; }

  @media (max-width:768px) {
    #mainVideoWrapper iframe { height:260px; }
    .thumb { width:220px; height:120px; }
  }


/* Founder Section background: url(../imgs/bg-image.webp); */
.founder-sec{background: #000; padding-top: 30px;}
.founder-section p{padding: 10px 0;}


/* Logo Section */
.logo-sec{background: #000;}


/* service Section */
.service-sec .service-box{position: relative; width:100%; text-align:center; border: 1px solid #ad854c; color: #FFF; padding: 20px 0; margin: 20px 0;cursor: pointer; overflow: hidden;}
/* .service-sec .service-box:hover{background-color: #ad854c; cursor: pointer; animation-name: initial;} */
.service-sec .service-box:hover::before {
  right: 0;
}
.service-sec .service-box .service-box-title{position: relative; z-index: 1; font-size:24px;}
.service-sec .service-box::before {
  content: "";
  position: absolute;
  top: 0;
  right: -100%;             /* Completely hide on the right side */
  width: 100%;
  height: 100%;
  background: #ad854c;       /* Color that will slide in */
  transition: right 0.5s ease;   /* Smooth sliding effect */
  z-index: 0;
}
/* Globe Section */

.globe-section{position:relative;width:100%;height:100vh;overflow:hidden;display:flex;align-items:center;justify-content:center;color:#fff}
.globe-section h1{ text-align: center; white-space: pre-wrap; transition-timing-function: ease; transition-duration: 0.65s; transition-delay: 0.195s;}

/* Socail icons */

.social-fixed {
    position: fixed;
    top: 50%;
    right: 30px; /* move left/right */
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 18px;
    z-index: 9999;
    display:none;
  }

  .social-fixed .icon {
    width: 42px;
    height: 42px;
    background: rgba(0,0,0,0.6);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-decoration: none;
    transition: 0.3s ease;
  }

  .social-fixed .icon:hover {
    transform: scale(1.1);
  }
.social-fixed .icon.insta:hover{
  background: inherit;
}
.social-fixed svg {
  width: 22px;
  height: 22px;
}

.submit-button{background: #FFF;}


/* Work Page */
.video-box{
  border-radius: 0px;
  overflow:hidden;
}
.video-overlay{    
    width: 100%;
    height: 100%;
    background: rgba(173, 133, 76, .5);
    position: absolute;
    transform: translateX(100%);
    transition: transform 0.3s ease-in-out;

  }
  .text-overlay{
    color: #FFF;
    position: absolute;
    width: 100%;
    height: 100%;
    text-align: center;
    padding: auto 0;
    margin: 0 0 !important;
    font-size: 18px;
    font-weight: bold;
    margin-top: 8px;
    text-decoration: none;
    display: flex;
    align-items: center;     /* vertical */
    justify-content: center; /* horizontal */
    

  }
.video-box:hover .video-overlay{
  transform: translateX(0px)
}
  /* Logo Section */
  .logos{margin-top:30px;}
  .logos .logo {
    text-align:center; 
    display: flex;
    justify-content: center;   /* Horizontal center */
    align-items: center;       /* Vertical center */
    height: 100px;  
    padding: 20px 0;           /* Or any height you want */
  }
  
  .logos .logo .logo-image{
    display: block;
    margin: 0 auto;
    max-width:150px;
    transition: 0.3s ease;
    filter: grayscale(100%);
    max-height:100%;
  }
  .logos .logo .logo-image:hover{
    transform: scale(1.1); 
    cursor:pointer;
    filter: grayscale(0);
    opacity: .7;
  }