:root{
    --green-color:#01673D;
    --white:#fff;
    --dark:#101010;
    --golden-color:#B8985A;
    --blue-color:#153E90;
    --white:hsl(0, 0%, 100%);--white10:hsla(0, 0%, 100%, 0.01);--white20:hsla(0, 0%, 100%, 0.02);--white30:hsla(0, 0%, 100%, 0.03);--white40:hsla(0, 0%, 100%, 0.04);--white50:hsla(0, 0%, 100%, 0.05);--white100:hsla(0, 0%, 100%, 0.10);--white200:hsla(0, 0%, 100%, 0.20);--white300:hsla(0, 0%, 100%, 0.30);--white400:hsla(0, 0%, 100%, 0.40);--white500:hsla(0, 0%, 100%, 0.50);--white600:hsla(0, 0%, 100%, 0.60);--white700:hsla(0, 0%, 100%, 0.70);--white800:hsla(0, 0%, 100%, 0.80);--white900:hsla(0, 0%, 100%, 0.90);--black:hsl(0, 0%, 0%);--black10:hsla(0, 0%, 0%, 0.01);--black20:hsla(0, 0%, 0%, 0.02);--black30:hsla(0, 0%, 0%, 0.03);--black40:hsla(0, 0%, 0%, 0.04);--black50:hsla(0, 0%, 0%, 0.05);--black100:hsla(0, 0%, 0%, 0.10);--black200:hsla(0, 0%, 0%, 0.20);--black300:hsla(0, 0%, 0%, 0.30);--black400:hsla(0, 0%, 0%, 0.40);--black500:hsla(0, 0%, 0%, 0.50);--black600:hsla(0, 0%, 0%, 0.60);--black700:hsla(0, 0%, 0%, 0.70);--black800:hsla(0, 0%, 0%, 0.80);--black900:hsla(0, 0%, 0%, 0.90);
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    font-size:16px;
}

body{
   font-family: "Raleway", sans-serif;
}
.font10{font-size:.625rem}
.font11{font-size:.688rem}
.font12{font-size:.75rem}
.font13{font-size:.813rem}
.font14{font-size:.875rem}
.font15{font-size:.938rem}
.font16{font-size:1rem}
.font17{font-size:1.063rem}
.font18{font-size:1.125rem}
.font19{font-size:1.188rem}
.font20{font-size:1.25rem}
.font21{font-size:1.313rem}
.font22{font-size:1.375rem}
.font23{font-size:1.438rem}
.font24{font-size:1.5rem}
.font25{font-size:1.563rem}
.font26{font-size:1.625rem}
.font27{font-size:1.688rem}
.font28{font-size:1.75rem}
.font29{font-size:1.813rem}
.font30{font-size:1.875rem}
.font31{font-size:1.938rem}
.font32{font-size:2rem}
.font33{font-size:2.063rem}
.font34{font-size:2.125rem}
.font35{font-size:2.188rem}
.font36{font-size:2.25rem}
.font37{font-size:2.313rem}
.font38{font-size:2.375rem}
.font39{font-size:2.438rem}
.font40{font-size:2.5rem!important}
.font45{font-size:2.813rem}
.font46{font-size:2.875rem}
.font48{font-size:3rem}
.font49{font-size:3.063rem}
.font50{font-size:3.125rem}
.font54{font-size:3.375rem}
.font55{font-size:3.438rem}
.font58{font-size:3.625rem}
.font60{font-size:3.75rem}
.font63{font-size:3.938rem}
.font64{font-size:4rem}
.font65{font-size:4.063rem}
.font74{font-size:4.625rem}
.font80{font-size:5rem}
.font88{font-size:5.5rem}
.font108{font-size:6.75rem}
.fw100{font-weight:100!important}
.fw200{font-weight:200!important}
.fw300{font-weight:300!important}
.fw400{font-weight:400!important}
.fw500{font-weight:500!important}
.fw600{font-weight:600!important}
.fw700{font-weight:700!important}
.fw800{font-weight:800!important}
.fw900{font-weight:900!important}
.color_dark{color:var(--black)!important}
.color_dark10{color:var(--black10)!important}
.color_dark20{color:var(--black20)!important}
.color_dark30{color:var(--black30)!important}
.color_dark40{color:var(--black40)!important}
.color_dark50{color:var(--black50)!important}
.color_dark100{color:var(--black100)!important}
.color_dark200{color:var(--black200)!important}
.color_dark300{color:var(--black300)!important}
.color_dark400{color:var(--black400)!important}
.color_dark500{color:var(--black500)!important}
.color_dark600{color:var(--black600)!important}
.color_dark700{color:var(--black700)!important}
.color_dark800{color:var(--black800)!important}
.color_dark900{color:var(--black900)!important}
.color_light{color:var(--white)!important}
.color_light10{color:var(--white10)!important}
.color_light20{color:var(--white20)!important}
.color_light30{color:var(--white30)!important}
.color_light40{color:var(--white40)!important}
.color_light50{color:var(--white50)!important}
.color_light100{color:var(--white100)!important}
.color_light200{color:var(--white200)!important}
.color_light300{color:var(--white300)!important}
.color_light400{color:var(--white400)!important}
.color_light500{color:var(--white500)!important}
.color_light600{color:var(--white600)!important}
.color_light700{color:var(--white700)!important}
.color_light800{color:var(--white800)!important}
.color_light900{color:var(--white900)!important}
.container{
    max-width:140rem;
    margin:auto;
    padding:0rem 3rem;
}

/* HEADER */

.header{
    position:fixed;
    top:0;
    left:0;
   background: linear-gradient(180deg, rgba(0, 29, 17, 0.92) 0%, rgba(0, 29, 17, 0) 100%);
backdrop-filter: blur(3px);
    width:100%;
    z-index:1000;
    transition:.5s;
    padding-block: 1rem;
}
.header .logo img {    width: 4rem;}

.header.scrolled{
  
}

.header .container{
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.desktop_nav{
    display:flex;
    gap:3rem;
    border-right: solid 2px var(--white);
    padding-right: 2rem;
}

.toggle_bar {display: flex;
    flex-direction: column;
    gap: 4px;}

.desktop_nav a{
    text-decoration:none;
    color:var(--white);
    font-size: 1rem;
}

.header_right{
    display:flex;
    align-items:center;
    gap:2rem;
}

.menu_btn{
    display:flex;
    align-items:center;
    gap:1rem;
    border:none;
    cursor:pointer;
    background:var(--green);
    color:#fff;
    padding:0.5rem 1rem;
    border-radius:.4rem;
    font-size: 0.875rem;
}

.menu_btn span{
    width:16px;
    height:2px;
    background:#fff;
    display:block;
}

/* HERO */

/* ========================
   HERO BANNER
======================== */

.hero_banner{
    position:relative;
    width:100%;
    min-height:100vh;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center;
}

.hero_video{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    object-fit:cover;
    z-index:1;
}

.hero_overlay{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.4);
    z-index:2;
}

.hero_content{
    position:relative;
    z-index:3;
    text-align:center;
    color:#fff;
    padding:2rem;
    max-width:80rem;
}

.hero_content h1{
    font-size:clamp(3rem,5vw,7rem);
    line-height:1.1;
    margin-bottom:1.5rem;
        font-weight: 500;
}

.hero_content p{
    font-size:1.125rem;
    margin-bottom:2.5rem;
}

.hero_btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:1.4rem 3rem;
    background:#fff;
    color:#000;
    text-decoration:none;
    border-radius:.5rem;
    transition:.3s;
}
.hero_overlay{
    position:absolute;
    inset:0;
    background:rgb(0 0 0 / 47%);
}


/* ========================
   MOBILE
======================== */

@media (max-width:768px){

    .hero_banner{
        min-height:70vh;
    }

    .hero_content{
        padding:2rem 1.5rem;
    }
}



.hero{
    height:100vh;
    position:relative;
    overflow:hidden;
}

.hero_bg{
    width:100%;
    height:100%;
    object-fit:cover;
}

.hero_overlay{
    position:absolute;
    inset:0;
    background:rgb(0 0 0 / 47%);
}

.hero_content{
    position:absolute;
    top:50%;
    left:50%;
    width: 100%;
    transform:translate(-50%,-50%);
    text-align:center;
    color:#fff;
    z-index:2;
}

.badge{
    padding:0.6rem 1rem;
    background-color: var(--golden-color);
    border-radius: 4px;
    display:inline-block;
    margin-bottom:2rem;
    font-size: 1rem;
    font-weight: 400;
}

.hero h1{
    font-size:5rem;
    font-weight:300;
    margin-bottom:1rem;
}

.hero p{
    font-size:1.2rem;
    margin-bottom:2rem;
}

.hero_btns{
    display:flex;
    justify-content:center;
    gap:2rem;
}

.btn_theme{
    padding:1rem 2rem;
    text-decoration:none;
    border-radius:.4rem;
    transition:.4s;
    font-size:1rem;
    display: inline-block;
}

.primary{
    background:var(--green-color);
    color:var(--white);
    border: solid 2px var(--green-color);
}
.primary:hover { background-color: transparent; color: var(--white); border-color: var(--white); }


.secondary{
    border:2px solid var(--white);
    color:var(--white);
}
.secondary:hover { background-color: var(--green-color); border-color: var(--green-color);  color:var(--white);}
/* MENU */

.menu_overlay{
    position:fixed;
    inset:0;
    z-index:9999;
    background:#071110;
    overflow-y:auto;
    overflow-x:hidden;

    opacity:0;
    visibility:hidden;
    transition:.5s ease;
}

.menu_overlay.active{
    opacity:1;
    visibility:visible;
}

.menu_inner{
    min-height:100vh;
    padding:4rem 8rem;
}

.menu_overlay::-webkit-scrollbar{
    width:.6rem;
}

.menu_overlay::-webkit-scrollbar-thumb{
    background:#0c8c61;
    border-radius:5rem;
}

.menu_top{
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.close_menu{
    border:none;
    background:none;
    color:#fff;
    font-size:2rem;
    cursor:pointer;
}

.menu_grid{
    display:grid;
    grid-template-columns:2fr 1fr;
    gap:10rem;
    margin-top:0rem;
}

.main_menu{
    list-style:none;
}

.main_menu li{
    margin-bottom:0rem;
}

.main_menu a{
    color:#fff;
    text-decoration:none;
      font-size: 1.2rem;
    transition:.3s;
       
       
}
.main_menu li > a, .menu_item > a { padding-bottom: 1rem;  display: inline-block;}
.main_menu a:hover{
    color:#31d79c;
}

.menu_item{
    display:flex;
    align-items:center;
    gap:2rem;
}

.submenu_toggle{
    width:2rem;
    height:2rem;
    border:none;
    background:none;
    color:#fff;
    cursor:pointer;
    font-size:2.4rem;
    transition:.3s;
    position: relative;
    top: -14px; 
}

/* .submenu_toggle::before{
    content:"+";
    font-size:2.8rem;
    color:#fff;
    transition:.3s;
}

.main_menu li.active .submenu_toggle::before{
    content:"−";
    color:#0cb67b;
} */
.submenu{
    display:none;
    list-style:none;
    margin-top:0rem;
    padding-left:3rem;
}

.submenu li{
    
}

.submenu a{
    font-size:1rem;
    color:#bfbfbf;
    transition:.3s;
}

.submenu a:hover{
    color:#fff;
}
.menu_right{
    color:#fff;
}

.menu_right h3{
    font-size:1.5rem;
    margin-bottom:2rem;
}

.socials{
    display:flex;
    gap:2rem;
    margin-bottom:5rem;
}

.socials a{
    width:3rem;
    height:3rem;
    border:.1rem solid rgba(255,255,255,.2);
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    color:#fff;
    font-size:1.3rem;
}

.contact_box h4{
    font-size:2.4rem;
    margin-bottom:1rem;
}

.contact_box p,
.contact_box a{
    font-size:1.8rem;
    color:#ccc;
}





.common_padding {padding: 5rem 0;}
.sec_heading_cta {display: flex; justify-content: space-between; align-items: center;}
.sec_heading_cta .secondary { border-color: #333; color: #333;}








.about_fwg_sec { background: #f5f3ee;}
.fwg_section {
 
  
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;

  max-width: 100%;
}
.fwg_section .fwg_left {    display: flex;
    flex-direction: column;
    justify-content: space-between;}
.fwg_heading {
  font-size: 2.75rem;
  font-weight: 400;
  line-height: 1.15;
  margin-bottom: 2rem;
  color: #111;
}

.fwg_heading .cursive {
  font-family: "Playball", cursive;
  font-style: italic;
  color: #1a5c3a;
  font-weight: 400;
}

.fwg_buttons {
  display: flex;
  gap: 1rem;
}

.btn_theme.blue {
 border:solid 1.5px var(--blue-color);
 background-color: var(--blue-color);
 color: var(--white);
}
.btn_theme.blue:hover {background-color: transparent; color: var(--blue-color);}

.btn_theme.gray {
 border:solid 1.5px var(--black600);
  
 color: var(--black600);
}
.btn_theme.gray:hover {background-color: var(--black800); color: var(--white);}


.btn_secondary:hover {
  background: rgba(0, 0, 0, 0.04);
}

.fwg_desc {
  font-size: 1.125rem;
  line-height: 1.75;
  color: #303030;
  margin-bottom: 1.25rem;
}

.fwg_stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);

  padding-top: 2rem;
}

.fwg_stat {
  padding-right: 1.5rem;
  border-right: 0.06rem solid #ccc;
}
.stat_number:after {
    content: '+';
    display: inline-block;
}

.fwg_stat:first-child {
  padding-left: 0;
}

.fwg_stat:last-child {
  border-right: none;
}

.fwg_stat + .fwg_stat {
  padding-left: 1.5rem;
}

.stat_number {
  font-size: 2.5rem;
  font-weight: 700;
  color: #111;
  line-height: 1.1;
  margin-bottom: 0.4rem;
      white-space: nowrap;
}

.stat_label {
  font-size: 0.875rem;
  letter-spacing: 0.08em;
  color: #666;
  text-transform: uppercase;
}

@media (max-width: 48rem) {
  .fwg_section {
    grid-template-columns: 1fr;
    padding: 3rem 1.5rem;
  }

  .fwg_heading {
    font-size: 2.25rem;
  }
}





     .bwv_section {
      background: #f5f3ee;
      padding: 4rem 3rem;
      text-align: center;
    }

    .bwv_heading {
      font-size: 2.4rem;
      font-weight: 400;
      color: #1a1a1a;
      line-height: 1.3;
      margin-bottom: 3.5rem;
    }

    .bwv_icons {
      display: flex;
      justify-content: center;
      gap: 3.5rem;
      flex-wrap: wrap;
    }

    .bwv_item {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 1rem;
      width: 7rem;
    }

    .bwv_circle {
      width: 5rem;
      height: 5rem;
      border-radius: 50%;
      background: #f5e6c8;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .bwv_circle svg {
      width: 2.2rem;
      height: 2.2rem;
    }

    .bwv_label {
      font-size: 0.9rem;
      color: #444;
      line-height: 1.4;
    }

    @media (max-width: 40rem) {
      .bwv_heading { font-size: 1.75rem; }
      .bwv_icons { gap: 2rem; }
    }


      .bod_section {
      background: #f5f3ee;
      padding: 4rem;
    }

    .bod_header {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 3rem;
      align-items: flex-start;
      margin-bottom: 3.5rem;
    }

    .bod_title {
      font-size: 2.8rem;
      font-weight: 400;
      color: #1a1a1a;
      line-height: 1.15;
    }

    .bod_title .cursive {
      font-family: 'Georgia', serif;
      font-style: italic;
      color: #1a5c3a;
      font-weight: 400;
      display: block;
    }

    .bod_desc {
      font-size: 1rem;
      color: #555;
      line-height: 1.75;
      padding-top: 0.5rem;
    }

    .bod_grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 2rem;
    }

    .bod_card {
      display: flex;
      flex-direction: column;
      align-items: center;
    }

    .bod_img_wrap {
      width: 100%;
      aspect-ratio: 1 / 1;
      border-radius: 0.5rem;
      overflow: hidden;
      border-bottom: 0.18rem solid #c9a84c;
      background: #ddd;
    }

    .bod_img_wrap img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }

    .bod_img_placeholder {
      width: 100%;
      height: 100%;
      background: linear-gradient(135deg, #c8a96e 0%, #a07840 100%);
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .bod_img_placeholder svg {
      width: 45%;
      height: 45%;
      opacity: 0.4;
    }

    .bod_name {
      margin-top: 1.1rem;
      font-size: 0.9rem;
      font-weight: 600;
      color: #1a1a1a;
      letter-spacing: 0.01em;
    }

    .bod_role {
      margin-top: 0.25rem;
      font-size: 0.82rem;
      color: #888;
      letter-spacing: 0.03em;
    }

    @media (max-width: 48rem) {
      .bod_header {
        grid-template-columns: 1fr;
        gap: 1.5rem;
      }
      .bod_grid {
        grid-template-columns: 1fr;
      }
      .bod_section {
        padding: 2.5rem 1.5rem;
      }
    }






     .wcfw_section {
      background: #f5f3ee;
      padding: 4rem;
      display: grid;
      grid-template-columns: 1fr 2fr;
      gap: 3rem;
      align-items: center;
    }

    .wcfw_left {}

    .wcfw_title {
      font-size: 2.6rem;
      font-weight: 400;
      color: #1a1a1a;
      line-height: 1.2;
      margin-bottom: 2.5rem;
    }

    .wcfw_btn {
      background: #1e3a8a;
      color: #fff;
      border: none;
      padding: 0.85rem 1.75rem;
      font-size: 0.95rem;
      cursor: pointer;
      border-radius: 0.25rem;
      font-family: inherit;
    }

    .wcfw_btn:hover {
      background: #1e40af;
    }

    .wcfw_grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 2.5rem 2rem;
    }

    .wcfw_item {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      gap: 1rem;
    }

    .wcfw_circle {
      width: 5rem;
      height: 5rem;
      border-radius: 50%;
      background: #f5e6c8;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .wcfw_circle svg {
      width: 2.2rem;
      height: 2.2rem;
    }

    .wcfw_label {
      font-size: 0.72rem;
      font-weight: 600;
      color: #555;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      line-height: 1.4;
    }

    @media (max-width: 48rem) {
      .wcfw_section {
        grid-template-columns: 1fr;
        padding: 2.5rem 1.5rem;
      }
      .wcfw_grid {
        grid-template-columns: repeat(2, 1fr);
      }
    }


    .featured_projects_inner {display: flex; list-style: none;     justify-content: space-between; padding-left: 0; }
    .featured_projects_inner li {width: 48%;}
    .project_text {display: flex; justify-content: space-between; margin-top: 1rem; border-top: solid 1px var(--black400);
       padding-top: 0.5rem;}
    .featured_projects_home {text-decoration: none;}
    .featured_projects_home .project_title { font-size: 1.3rem; color: var(--black700); }
    .featured_projects_home .project_status {padding: 6px 12px; background-color: #E2FFF3; font-size: 0.875rem; border-radius: 20px;}
    .featured_projects_home img {  transition: 0.5s; width: 100%;}
    .featured_projects_home .image   {overflow: hidden; border-radius:8px; }
    .featured_projects_home img:hover {transform: scale(1.3); filter: brightness(0.5);}


    .tab {
  display: inline-block;
  padding: 10px 20px;
  background-color: lightgray;
  cursor: pointer;
}

.tab-content {
    display: none;
 
  opacity: 0;
  transition: opacity 0.3s ease;
  
}

.tab-content.active {
    display: block;
  opacity: 1;

}

.home_gallery {list-style: none; padding: 0; display: flex; gap: 0.5rem;}
.home_gallery li {width: calc(25% - 0.5rem);}
.gallery_img {overflow: hidden; border-radius: 8px;}

.thoughtful_planned_sec img { border: solid 1px var(--black800); padding: 10px; border-radius: 8px; }

.floor_plans_box .image {border: solid 1px var(--black800); padding: 10px; border-radius: 8px; }