/* ROOT COLORS */
    :root{
        --dark:#0B2B2B;
        --teal:#155E5E;
        --gold:#C9A84C;
        --light-gold:#E2C47A;
        --cream:#F7EDD3;
        --white:#ffffff;
      
        /* ------------------------Sandeep--------------------------- */
      
        --td:#0B2B2B; --tm:#155E5E; --tr:#1A7A7A; --tb:#219898;
        --tl:#A8D8D8; --tp:#E4F4F4;
        --g:#C9A84C; --gl:#E2C47A; --gp:#F7EDD3;
        --w:#FFFFFF; --ow:#F9FAFA;
        --tx:#0B2B2B; --tx2:#2D5555; --tx3:#6B9090;
        --fd:'Playfair Display',serif; --fb:'DM Sans',sans-serif;
      
      }
      
      /* RESET */
      *{margin:0;padding:0;box-sizing:border-box;}
      body{
        font-family:'DM Sans',sans-serif;
        background:#0B2B2B;
        color:var(--dark);
        overflow-x:hidden;
      }
      
      /* ================= HEADER ================= */
/*       header{
        position:absolute;
        width:100%;
        top:0;
        left:0;
        display:flex;
        justify-content:space-between;
        align-items:center;
        padding:20px 60px;
        z-index:1000;
        transition:0.4s;
      }
       */
      /* SCROLL EFFECT */
/*       header.scrolled{
        background:rgba(11,43,43,0.95);
        box-shadow:0 2px 10px rgba(0,0,0,0.3);
      }
       */
      /* -----------------------------------Sandeep------------------------------- */
          /* ── ABOUT ── */
      .ain{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:96px;align-items:center;}
/*       .aiw{position:relative;}
      .astr{position:absolute;top:0;left:-12px;bottom:0;width:4px;background:linear-gradient(to bottom,var(--g),var(--tm));}
      .aimg{width:50%;aspect-ratio:3/4;position:relative;overflow:hidden;border:1px solid rgba(26,122,122,.15);}
      .aimg img{width:100%;height:100%;object-fit:cover;}
      .aimg-tag{position:absolute;bottom:0;left:0;background:var(--tm);color:var(--w);font-size:10px;letter-spacing:2px;text-transform:uppercase;padding:14px 22px;font-weight:500;}
      .aac{position:absolute;top:40px;right:-22px;width:44px;height:44px;background:var(--g);display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--td);}
       */
      /* ----------------------Sandeep contact form or image upper wali purane ki css hai------------------- */
      
      
      /* LOGO */
/*       .logo{
        font-family:'Playfair Display',serif;
        color:white;
        font-size:22px;
        letter-spacing:2px;
      }
      
      
      .logo span{
        color:var(--gold);
      } */
      
      /* NAV */
/*       nav{
        display:flex;
        gap:35px;
      }
       */
/*       nav a{
        color:rgba(255,255,255,0.7);
        text-decoration:none;
        font-size:12px;
        letter-spacing:2px;
        text-transform:uppercase;
        transition:0.3s;
      }
       */
/*       nav a:hover{
        color:var(--gold);
      }
       */
      /* BUTTON */
/*       .nav-btn{
        padding:10px 25px;
        background:var(--gold);
        color:var(--dark);
        font-size:11px;
        letter-spacing:2px;
        text-decoration:none;
        transition:0.3s;
      }
       */
/*       .nav-btn:hover{
        background:#E2C47A;
      } */
/*       .menu-toggle{
        display:none;
        font-size:24px;
        color:white;
        cursor:pointer;
      }
       */
      /* ================= HERO ================= */
      .hero{
        min-height:80vh;
        display:flex;
        align-items:center;
        position:relative;
        overflow:hidden;
        background:linear-gradient(140deg,#0B2B2B 0%,#0C3A3A 40%,#114848 70%,#0B2B2B 100%);
      }
      
      /* CIRCLES */
      .hero::before{
        content:'';
        position:absolute;
        width:600px;
        height:600px;
        border-radius:50%;
        border:1px solid rgba(201,168,76,0.1);
        top:-150px;
        right:-100px;
      }
      
      .hero::after{
        content:'';
        position:absolute;
        width:400px;
        height:400px;
        border-radius:50%;
        border:1px solid rgba(26,122,122,0.2);
        top:50px;
        right:50px;
      }
      
      /* CONTENT */
      .hero-content{
        z-index:2;
        max-width:700px;
        padding:0 80px;
        animation:fadeUp 1.2s ease;
      }
      
      .hero-label{
        color:var(--gold);
        font-size:11px;
        letter-spacing:4px;
        margin-bottom:20px;
      }
      
      .hero h1{
        font-family:'Playfair Display',serif;
        font-size:90px;
        line-height:0.95;
        color:white;
      }
      
      .hero h1 span{
        color:var(--gold);
      }
      
      .hero-sub{
        font-size:20px;
        color:#219898;
        margin:20px 0;
        font-style:italic;
      }
      
      .hero p{
        color:rgba(255,255,255,0.6);
        margin-bottom:30px;
      }
      
      .hero-btn{
        padding:14px 35px;
        background:var(--gold);
        color:var(--dark);
        text-decoration:none;
        font-size:12px;
        letter-spacing:2px;
        transition:0.3s;
      }
      
      .hero-btn:hover{
        background:#E2C47A;
        transform:translateY(-3px);
      }
      
      /* IMAGE */
      .hero-img{
        position:absolute;
        right:0;
        top:0;
        height:100%;
        width:40%;
      }
      
      .hero-img img{
        width:100%;
        height:100%;
        object-fit:cover;
        opacity:0.6;
      }
      
      .hero-img::before{
        content:'';
        position:absolute;
        inset:0;
        background:linear-gradient(to right,#0B2B2B 0%,transparent 100%);
      }
      /* SECTION */
      .contact-strip{
          display:flex;
          justify-content:space-between;
          gap:20px;
          padding:60px 8%;
          background:linear-gradient(135deg,#0B2B2B,#155E5E);
          flex-wrap:wrap;
      }
      
      /* BOX */
      .contact-box{
          flex:1;
          min-width:220px;
          min-height:220px;
          background:rgba(255,255,255,0.05);
          padding:30px 20px;
          text-align:center;
          backdrop-filter:blur(10px);
          transition:0.4s;
          position:relative;
          overflow:hidden;
      }
      
      /* HOVER EFFECT */
      .contact-box:hover{
          transform:translateY(-8px);
          box-shadow:0 10px 30px rgba(0,0,0,0.3);
      }
      
      /* ICON */
      .contact-box .icon{
          font-size:28px;
          margin-bottom:15px;
          color:#C9A84C;
      align-items:baseline;
      }
      
      .contact-box img{
       padding-top: 15px;   
       width:12%;
       height:12%;
      }
      /* TITLE */
      .contact-box h3{
          margin-bottom:10px;
          color:#E2C47A;
      }
      
      /* TEXT */
      .contact-box p{
          color:#F7EDD3;
          font-size:14px;
      }
      
      /* #address {
          color:#F7EDD3;
          font-size:12px;
      } ---Sandeep----- our location ptag */
      
      /* GLOW BORDER EFFECT */
      .contact-box::before{
          content:"";
          position:absolute;
          width:100%;
          height:100%;
          top:0;
          left:0;
          border-radius:16px;
          border:1px solid transparent;
          background:linear-gradient(120deg,#C9A84C,transparent) border-box;
          -webkit-mask:
              linear-gradient(#fff 0 0) padding-box,
              linear-gradient(#fff 0 0);
          -webkit-mask-composite: destination-out;
                  mask-composite: exclude;
          opacity:0;
          transition:0.4s;
      }
      
      .contact-box:hover::before{
          opacity:1;
      }
      
      
      /* ANIMATION */
      @keyframes fadeUp{
        from{opacity:0;transform:translateY(40px);}
        to{opacity:1;transform:none;}
      }
      
      
      /* RESPONSIVE */
      @media(max-width:900px){
          .contact-strip{
              justify-content:center;
          }
/*             .menu-toggle{
              display: block;
          }
       */
/*           nav{
              position: absolute;
              top: 80px;
              right: 0;
              width: 100%;
              background: rgba(0, 0, 0, 0.9);
              flex-direction: column;
              padding: 20px;
              display: none;
          }
      
          nav.active{
              display: flex;
          } */
        .hero-content{padding:120px 24px 60px;}.hero-img{display:none;}
        .ain,.win{grid-template-columns:1fr;gap:48px;}
        .about,.why,.exp,.franc,.social,.formsec{padding:80px 24px;}
        .pg{grid-template-columns:repeat(2,1fr);}
        .fst{grid-template-columns:1fr;}.fpg{grid-template-columns:1fr 1fr;}
        .fu{flex-direction:column;gap:20px;text-align:center;}
        .gallery{grid-template-columns:1fr 1fr;grid-template-rows:220px 220px 220px;}
        .gi:first-child{grid-row:auto;}
        .sr{gap:32px;flex-wrap:wrap;}
        .fg{grid-template-columns:1fr;}
        .fot{flex-direction:column;gap:32px;}
        .pills{gap:32px;flex-wrap:wrap;}
        .wsr{grid-template-columns:1fr;}
      }
      @media (max-width:480px){
      
      /* HEADER */
/*       header{
        padding:12px 15px;
      }
      
      .logo img{
        width:110px;
        height:auto;
      }
      
      .nav-btn{
        padding:8px 14px;
        font-size:10px;
      }
       */
      /* HERO */
      .hero{
        flex-direction:column;
        min-height:auto;
      }
      
      .hero-content{
        padding:120px 20px 40px;
        text-align:center;
      }
      
      .hero h1{
        font-size:34px;
        line-height:1.2;
      }
      
      .hero-sub{
        font-size:16px;
      }
      
      .hero p{
        font-size:13px;
      }
      
      .hero-img{
        position:relative;
        width:100%;
        height:220px;
      }
      
      .hero-img img{
        opacity:0.4;
      }
      
      }
      
      @media(max-width:600px){
          .contact-strip{
              padding:40px 5%;
          }
      
          .contact-box{
              min-width:100%;
          }
      }

/* -------------------contact image or form arun wali-----------------------
 */

.contact{
    background-color: #0b2b2b;
    display: flex;
    justify-content: space-between;
    padding: 2.2rem;
}

.contact .form{
    width: 49%;
    padding: 20px;
}

.contact .form .label{

}

.contact .form .label label{
    color: #FF9A68;
}

.contact .form .label input,
.contact .form .label select,
.contact .form .label textarea{
    background-color: #0b2b2b;
}

.contact .form .label label , 
.contact .form .label input ,
.contact .form .label select {
    width: 100%;
    height: 50px;
}

.contact .form .label textarea{
    width: 100%;
}

.contact .contact-img .contact-line{
    width: 4px;
    background: linear-gradient( to bottom, var(--g), var(--tm));
}

.contact .contact-img{
    width: 49%;
    position: relative;
    display: flex;
    gap: 0.6rem;
}

.contact .contact-img .contact-icon{
    width: 50px;
    height: 50px;
    position: absolute;
    top: 5%;
    right: -3%;
    z-index: 10;
    background-color: #c9a84c;
}

.contact .contact-img .contact-icon i{
    font-size: 22px;
    position: absolute;
    color: #145757;
    top: 26%;
    left: 20%;
}

.contact .contact-img .contact-main-img{
    width: 100%;
    position: relative;
}

.contact .contact-img .contact-main-img img{
    width: 100%;
    height: 100%;
}

.contact .contact-img .contact-main-img .contact-img-text{
    position: absolute;
    bottom: 0;
    left: 0;
    background: var(--tm);
    color: var(--w);
    font-size: 10px;
    letter-spacing: 2px;
    text-transform: uppercase;
    padding: 22px 22px;
    font-weight: 700;
}

@media(max-width:960px){
    .contact{
        flex-direction: column;
        gap: 1.2rem;
    }

    .contact .form{
        width: 100%;
    }

    .contact .contact-img{
        width: 100%;
        height: 100%;
    }
}