/* ==========================
   ABOUT HERO
========================== */

.about_hero{
    position:relative;

    min-height:420px;

    display:flex;
    align-items:center;

    overflow:hidden;

    background-image:url("image/hero-palm-BBaPWmEp.jpg");
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}

/* Dark green overlay */

.about_overlay{
    position:absolute;
    inset:0;

    background:
    linear-gradient(
        90deg,
        rgba(0,55,20,.78),
        rgba(0,55,20,.65)
    );

    z-index:1;
}

/* Content */

.about_hero_container{
    position:relative;
    z-index:2;

    width:90%;
    max-width:1200px;

    margin:auto;
}

/* Breadcrumb */

.breadcrumb{
    display:flex;
    align-items:center;
    gap:8px;

    margin-bottom:22px;

    font-size:.85rem;
}

.breadcrumb a{
    text-decoration:none;
    color:#fff;

    transition:.3s;
}

.breadcrumb a:hover{
    color:#d4b100;
}

.breadcrumb span{
    color:#ffffff90;
}

.breadcrumb .active{
    color:#d4b100;
}

/* Heading */

.about_hero h1{
    max-width:750px;

    font-family:"Playfair Display", serif;

    color:#fff;

    font-size:4.4rem;
    line-height:1.08;
    font-weight:700;

    margin-bottom:22px;
}

/* Paragraph */

.about_hero p{
    max-width:650px;

    color:rgba(255,255,255,.9);

    font-size:1.15rem;
    line-height:1.8;
}

/* Tablet */

@media(max-width:992px){

    .about_hero{
        min-height:380px;
    }

    .about_hero h1{
        font-size:3.2rem;
        max-width:650px;
    }
}

/* Mobile */

@media(max-width:768px){

    .about_hero{
        min-height:320px;
        text-align:left;
    }

    .about_hero h1{
        font-size:2.4rem;
        line-height:1.15;
    }

    .about_hero p{
        font-size:.95rem;
    }

    .breadcrumb{
        font-size:.8rem;
        margin-bottom:16px;
    }
}

/* Small Phones */

@media(max-width:480px){

    .about_hero{
        min-height:280px;
    }

    .about_hero h1{
        font-size:1.9rem;
    }

    .about_hero p{
        font-size:.88rem;
        line-height:1.7;
    }
}
/* Who are we section styling  */
/* ==========================
   WHO WE ARE
========================== */

.who_are_we_section{
    padding:100px 0;
    background:#fff;
}

.gird_container{
    width:90%;
    max-width:1200px;
    margin:auto;

    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:60px;
    align-items:center;
}

/* Small Heading */

.who_are_we_div{
    display:inline-flex;
    align-items:center;
    gap:10px;

    color:#cda644;

    font-size:.8rem;
    font-weight:600;

    letter-spacing:2px;
    text-transform:uppercase;

    margin-bottom:18px;
}

.who_are_we_div span{
    width:60px;
    height:2px;

    background:linear-gradient(
        90deg,
        #d4b100,
        #cda644
    );
}

/* Main Heading */

.grid_child_container h2{
    font-family:"Playfair Display", serif;

    color:#1d4d2e;

    font-size:3rem;
    line-height:1.15;

    margin-bottom:25px;
}

/* Text */

.txt_container_{
    display:flex;
    flex-direction:column;
    gap:18px;
}

.grid_child_container p{
    color:#5f6d63;

    font-size:1rem;
    line-height:1.9;
}

/* Images */

.image_grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:15px;
}

.image_grid img{
    width:100%;
    height:240px;

    object-fit:cover;

    border-radius:16px;

    transition:.4s ease;

    box-shadow:
    0 10px 25px rgba(0,0,0,.06);
}

.image_grid img:hover{
    transform:scale(1.03);
}

/* Make layout more interesting */

.image_grid img:nth-child(1){
    transform:translateY(30px);
}

.image_grid img:nth-child(4){
    transform:translateY(30px);
}
@media(max-width:768px){

    .who_are_we_section{
        padding:70px 0;
    }

    .gird_container{
        grid-template-columns:1fr;
        gap:40px;
    }

    .grid_child_container{
        order:1;
    }

    .image_grid{
        order:2;
    }

    .grid_child_container h2{
        font-size:2rem;
    }

    .grid_child_container p{
        font-size:.95rem;
        line-height:1.8;
    }

    .image_grid img{
        height:180px;
        border-radius:12px;
    }

    .image_grid img:nth-child(1),
    .image_grid img:nth-child(4){
        transform:none;
    }
}
@media(max-width:480px){

    .grid_child_container h2{
        font-size:1.7rem;
    }

    .who_are_we_div{
        font-size:.75rem;
    }

    .image_grid{
        gap:10px;
    }

    .image_grid img{
        height:140px;
    }
}
/* Vision Styling Section */
.vision_section {
  padding: 60px 20px;
  background-color: oklch(0.97 0.01 120);
}

/* GRID - RESPONSIVE */
.container_vision {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 20px;
  max-width: 1100px;
  margin: 0 auto;
  font-family: Inter, system-ui, sans-serif;
}

/* CARD */
.card_vision {
  background: white;
  border-radius: 12px;
  border: 1px solid oklch(0.92 0.01 120);
  box-shadow: 0 10px 30px -15px rgba(0, 0, 0, 0.15);
  padding: 24px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.card_vision:hover {
  transform: translateY(-4px);
  box-shadow: 0 15px 40px -18px rgba(0, 0, 0, 0.2);
}

/* ICON */
.icon_box {
  width: 42px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: linear-gradient(135deg, oklch(0.28 0.09 145), oklch(0.42 0.12 145));
}

/* TEXT */
.card_vision h3 {
  margin-top: 14px;
  font-size: 16px;
  font-weight: 700;
  color: oklch(0.28 0.09 145);
  font-family: "Playfair Display", Georgia, serif;
}

.card_vision p {
  margin-top: 8px;
  font-size: 14px;
  line-height: 1.6;
  color: oklch(0.45 0.02 145);
}

/* MOBILE TWEAKS */
@media (max-width: 600px) {
  .vision_section {
    padding: 40px 15px;
  }

  .card_vision {
    padding: 18px;
  }

  .card_vision h3 {
    font-size: 15px;
  }

  .card_vision p {
    font-size: 13.5px;
  }
}
/* Core Value Styling */
.core_values_section {
  padding: 60px 20px;
  color: oklch(0.18 0.02 150);
}

/* CENTER CONTAINER */
.core_value_container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 20px;
}

/* EYEBROW */
.eyebraw_core {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: Inter, system-ui, sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: oklch(0.62 0.13 80);
}

.eyebraw_core span {
  width: 50px;
  height: 2px;
  background: linear-gradient(90deg, #d4b100, #cda644);
}

/* TITLE */
.core_core_core {
  text-align: center;
  margin-bottom: 30px;
}

.core_value_container h2 {
  color: oklch(0.28 0.09 145);
  font-family: "Playfair Display", Georgia, serif;
  font-size: 28px;
  font-weight: 700;
  margin-top: 10px;
}

/* GRID */
.grid_we_stand_for {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 16px;
}

/* BOX */
.grid_box {
  border: 1px solid oklch(0.92 0.01 120);
  border-radius: 10px;
  padding: 18px 12px;
  text-align: center;
  transition: 0.2s ease;
  background: white;
}

.grid_box:hover {
  transform: translateY(-4px);
}

/* ICON SIZE FIX (if you keep SVGs) */
.grid_box svg {
  width: 28px;
  height: 28px;
  margin-bottom: 8px;
}

.grid_box h4 {
  font-size: 14px;
  font-weight: 600;
  color: oklch(0.28 0.09 145);
  margin: 0;
}

/* =========================
   RESPONSIVE BREAKPOINTS
========================= */

/* Tablets */
@media (max-width: 992px) {
  .grid_we_stand_for {
    grid-template-columns: repeat(3, 1fr);
  }

  .core_value_container h2 {
    font-size: 24px;
  }
}

/* Mobile */
@media (max-width: 600px) {
  .grid_we_stand_for {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }

  .core_values_section {
    padding: 40px 15px;
  }

  .core_value_container h2 {
    font-size: 20px;
  }

  .eyebraw_core {
    font-size: 11px;
  }
}

/* Small phones */
@media (max-width: 400px) {
  .grid_we_stand_for {
    grid-template-columns: 1fr;
  }
}