@font-face {
  font-family: 'FreightBigPro';
  src: url('freight-big-pro-medium-regular.woff2') format('woff2'),
       url('freight-big-pro-medium-regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}

:root {
     
    --thm-red: #962b35;
    --thm-gray: #edf0f6;
    --thm-blue: #0a5785;
     
}

body {
     
    font-size: 0.875rem;
    line-height: 1.8;
    font-family: 'Open Sans', Arial, sans-serif;
    color: #000;
}

a {
    color: var(--thm-blue);
    font-size: 0.875rem;
}

a,
a:hover,
a:focus,
a:visited {
    text-decoration: none;
}


h1,h2,h3,h4,h5,h6,.section-title{
   font-family:'FreightBigPro', serif;
}

h1{ font-size:39px; }
h2{ font-size:55px; }

img{
  max-width:100%;
  height:auto;
}


/* HERO VIDEO */
.hero-video {
    position: relative;
    height: 100vh;
    overflow: hidden;
}

/* VIDEO FULLSCREEN */
.hero-video video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    transform: translate(-50%, -50%);
    object-fit: cover;
    z-index: -1;
}


    .hero-section {
      height: 122vh;      
      position: relative;
      color: #FFF;    
      overflow: hidden;   
    }

    /* Background Image Layer */
    .hero-bg {
      position: absolute;
      width: 110%;
      height: 110%;
      top: -5%;
      left: -5%;
      background: url('../images/banner.webp') no-repeat center center/cover;
      animation: cinematicZoom 25s infinite alternate ease-in-out;
    }

    /* Cinematic animation (zoom + slight pan) */
    @keyframes cinematicZoom {
      0% {
        transform: scale(1) translate(0, 0);
      }
      50% {
        transform: scale(1.15) translate(-2%, -2%);
      }
      100% {
        transform: scale(1.25) translate(2%, 2%);
      }
    }

    /* Dark overlay (movie feel) */
.hero-section::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    rgba(0,0,0,0.4),
    rgba(0,0,0,0.6)
  );
  top: 0;
  left: 0;
  z-index: 0;
} 
 

    .sucess-section {
      height: 131vh;
      background: url('../images/Page-2.webp') no-repeat center center/cover;
      position: relative;
      color: #FFF; 
    }
    .form-banner-section {
      height: 50vh;
      background: url('../images/form_banner.webp') no-repeat center center/cover;
      position: relative;
      color: #FFF; 
    }

    .form-section{
        color: #2b2e34;
        background-color: #dfd8c9;
        margin-top: -16px;
        padding-top: 30px;
    }

    .form-section .form-control, .form-section .form-select{
        border-radius: 0px;
        border: 1px solid #000;
        background-color: transparent;
    }

    .form-section .form-check-input{
        border: 1px solid #000;
        border-radius: 0px;
        width: 20px;
        height: 20px;
        background-color: transparent;
    }

    .form-section .form-check-input[type=radio]{
        border-radius: 50%;
    }

    .form-section .form-check-input:checked[type=checkbox] {
        background-image: url("../images/check.svg");    
    }

    .form-section .form-check-input:checked[type=radio] {
        background-image: url("../images/rounded-button.webp");    
    }

    /* Overlay for better text visibility */
    .sucess-section::before, .form-banner-section::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0,0,0,0.5);
    }

    .hero-content {
      position: relative;
      z-index: 20;

    }
    .logo, .hero-btn {       
      z-index: 1;
    }

    .logo img {
      height: 155px;
      z-index: 20;
    }

      
.btn-custom {
    padding: 10px 70px;
    font-size: 16px;
    border-radius: 10px;
    background-color: var(--thm-blue);
    color: #FFF;
    transition: all 0.3s ease;
}
 

.btn-custom:hover {
  background: #084298;
  transform: scale(1.05);
}


.section-2{
    background-color: #c5d6e8;
    padding: 100px 0px;
}

.section-3{
    background-color: #cfdcb1;
    padding: 170px 0px;
}




.sucess-overlay {
  position: relative;
  inset: 0;
  background: #DFD3C6E8;
  padding: 50px 40px;
  width: 72%;
  margin: auto;
  /*transform:translateY(-78%);*/
}

.sucess-overlay h1{
    color: #1c244b;
    font-size: 50px;
}

.sucess-overlay p{
    color: #324A6D;
    font-size: 18px;
}

.section-5 {
    padding: 100px 0px;
}

.top-icon{
    width: 50px;
    cursor: pointer;
    transition: all 0.2s ease !important;
}

.top-icon:hover {
  opacity: 0.8 !important;
  transform: scale(1.1) !important;
}


footer{
    border-top: 1px solid #000;
    background-color: #FFF;
}

.top-nav-social {
  display: flex !important;
  gap: 15px;
}
.top-nav-social a {
  color: #000 !important;
  font-size: 20px !important;
  transition: all 0.2s ease !important;
  cursor: pointer !important;
}
.top-nav-social a:hover {
  opacity: 0.8 !important;
  transform: scale(1.1) !important;
}


.upload-box {
  border: 1px solid #000;
  padding: 20px;
  text-align: center;
  cursor: pointer;
  transition: 0.3s;
  border-radius: 0px;
  background-color: #FFF;
}

.upload-box.dragover {
  background: #e7f1ff;
}

.preview{
    text-align: center;
    margin-top: 10px;
}

.preview img:hover {
    box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
}

.preview img {
  border: 1px solid #000;
  border-radius: 4px; /* Rounded corners */
  width: 100px; /* Small fixed width */
  transition: 0.3s; /* Smooth hover transition */
}

.input-group-text{
    border-radius: 0px;
    border: 1px solid;
    background: transparent;
    cursor: pointer;
}

#parent-form,
#questions-form,
#information-form{
    display: none;
}

.image-upload{
    width: 20%;
}

.char-count {
  font-size: 14px;
  color: gray;
  float: right;
}

.flag-input-group{
    padding: 0px 4px;
}

.flag-input-group img{
    width: 35px !important;
    padding-right: 4px;
}

