*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
    :root{
      --gd:#1a3a2a;--gm:#2d6a4f;--gl:#52b788;
      --cream:#f5f0e8;--ww:#fdfaf4;
      --amber:#c47c2b;--al:#e6a44d;
      --td:#1a2217;--tm:#3d5a47;--tl:#7a9a85;
      --border:rgba(82,183,136,0.18);
    }
    html{scroll-behavior:smooth}
    body{font-family:'Jost',sans-serif;background:var(--ww);color:var(--td);overflow-x:hidden}

    /* NAV */
    nav{position:fixed;top:0;left:0;right:0;z-index:200;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;height:72px;background:rgba(26,58,42,0.97);backdrop-filter:blur(14px);border-bottom:1px solid rgba(82,183,136,0.2)}
    .nav-logo{font-family:'Playfair Display',serif;font-size:1.45rem;color:#fff;letter-spacing:.03em;flex-shrink: 0;}
    .nav-logo span{color:var(--al);font-style:italic}
    .nav-links{display:flex;gap:2rem;list-style:none}
    .nav-links a{text-decoration:none;font-size:.82rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.7);transition:color .25s}
    .nav-links a:hover,.nav-links a.active{color:var(--al)}
    
    .nav-actions { display: flex; align-items: center; gap: 1rem; }
    .nav-cart{background:var(--amber);color:#fff;font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:.5rem 1.2rem;border-radius:2px;cursor:pointer;border:none;transition:background .22s;white-space: nowrap;}
    .nav-cart:hover{background:var(--al)}

    .hamburger { display: none; flex-direction: column; gap: 5px; cursor: pointer; padding: 5px; }
    .hamburger span { width: 25px; height: 2px; background: #fff; border-radius: 2px; transition: .3s; }

    /* RESPONSIVE NAV FOR MOBILE */
    @media(max-width: 1024px) {
      .nav-links { position: fixed; top: 0; right: -100%; width: 280px; height: 100vh; background: var(--gd); flex-direction: column; padding: 100px 40px; transition: .4s ease-in-out; box-shadow: -10px 0 30px rgba(0,0,0,0.2); }
      .nav-links.active { right: 0; }
      .nav-links li { margin-bottom: 1.5rem; }
      .nav-links a { font-size: 1rem; color: #fff; }
      .hamburger { display: flex; z-index: 201; }
      .hamburger.active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
      .hamburger.active span:nth-child(2) { opacity: 0; }
      .hamburger.active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
    }

    /* BUTTONS */
    .btn-primary, .btn-outline {
      display: inline-block;
      padding: 0.9rem 2rem;
      border-radius: 2px;
      font-size: .82rem;
      font-weight: 600;
      letter-spacing: .12em;
      text-transform: uppercase;
      text-decoration: none;
      transition: all .3s ease;
      cursor: pointer;
      text-align: center;
      border: none;
    }
    .btn-primary {
      background: var(--amber);
      color: #fff;
    }
    .btn-primary:hover {
      background: var(--al);
      transform: translateY(-3px);
      box-shadow: 0 10px 20px rgba(0,0,0,0.15);
    }
    .btn-outline {
      background: transparent;
      color: var(--gd);
      border: 1.5px solid var(--gd);
    }
    .btn-outline:hover {
      background: var(--gd);
      color: #fff;
      transform: translateY(-3px);
      box-shadow: 0 10px 20px rgba(0,0,0,0.15);
    }
    .btn-white-outline {
      background: transparent;
      color: #fff;
      border: 1.5px solid rgba(255,255,255,0.6);
    }
    .btn-white-outline:hover {
      background: #fff;
      color: var(--gd);
      border-color: #fff;
      transform: translateY(-3px);
      box-shadow: 0 10px 20px rgba(0,0,0,0.15);
    }

    /* HERO BAND */
    .hero{position:relative;height:70vh;overflow:hidden;display:flex;align-items:center;justify-content:center;text-align:center}
    .hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
    .hero .ov{position:absolute;inset:0;z-index:1;}
    .hero .fade-b{position:absolute;bottom:0;left:0;right:0;height:120px;background:linear-gradient(to bottom,transparent,var(--ww));z-index:2}
    .hero-body{position:relative;z-index:3;padding:0 5vw}
    .eyebrow{font-size:.7rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:var(--gl);margin-bottom:1rem;animation:fadeUp .7s .2s both}
    .hero h1{font-family:'Playfair Display',serif;font-size:clamp(2.5rem,5.5vw,4.2rem);color:#fff;line-height:1.12;animation:fadeUp .7s .4s both}
    .hero h1 em{color:var(--al);font-style:italic}
    .hero p{margin-top:1rem;font-size:1rem;color:rgba(255,255,255,.65);max-width:520px;margin-inline:auto;line-height:1.75;animation:fadeUp .7s .6s both}

    @media(max-width: 768px) {
      .hero { height: 60vh; }
      .hero-body { padding: 0 8vw; }
    }

    /* BREADCRUMB */
    .breadcrumb{padding:.9rem 5vw;background:var(--cream);font-size:.75rem;color:var(--tl);letter-spacing:.08em}
    .breadcrumb a{color:var(--gm);text-decoration:none}
    .breadcrumb a:hover{color:var(--amber)}

    /* SECTION SCAFFOLD */
    section{padding:6rem 8vw}
    .sec-label{font-size:.7rem;font-weight:600;letter-spacing:.25em;text-transform:uppercase;color:var(--gl);margin-bottom:.7rem}
    .sec-title{font-family:'Playfair Display',serif;font-size:clamp(1.7rem,3vw,2.5rem);color:var(--gd);line-height:1.2}
    .sec-title em{color:var(--amber);font-style:italic}
    .sec-div{width:48px;height:3px;background:linear-gradient(90deg,var(--amber),var(--gl));border-radius:2px;margin:1rem 0 1.5rem}
    .sec-body{font-size:.95rem;font-weight:300;color:var(--tm);line-height:1.85}

    @media(max-width: 768px) {
      section { padding: 4rem 6vw; }
    }

    /* STORY */
    .story-grid{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
    .story-img-stack{position:relative;height:480px}
    .story-img-stack img{border-radius:12px;object-fit:cover;box-shadow:0 16px 50px rgba(26,58,42,.18)}
    .si-main{position:absolute;top:0;left:0;width:75%;height:80%}
    .si-accent{position:absolute;bottom:0;right:0;width:55%;height:55%;border:4px solid var(--ww)}
    .story-badge{position:absolute;top:50%;left:52%;transform:translate(-50%,-50%);background:var(--gd);color:var(--cream);padding:1.4rem;border-radius:10px;text-align:center;font-family:'Playfair Display',serif;font-size:2.2rem;font-weight:700;color:var(--al);line-height:1;width:110px}
    .story-badge span{display:block;font-family:'Jost',sans-serif;font-size:.65rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:rgba(245,240,232,.6);margin-top:.3rem}

    @media(max-width: 900px) {
      .story-grid { grid-template-columns: 1fr; gap: 3rem; text-align: center; }
      .sec-div { margin-inline: auto; }
      .story-img-stack { height: 400px; max-width: 500px; margin-inline: auto; width: 100%; }
    }

    /* STATS */
    .stats-band{background:var(--gd);padding:4rem 8vw;display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;text-align:center}
    .stat-num{font-family:'Playfair Display',serif;font-size:3rem;color:var(--al);line-height:1}
    .stat-label{font-size:.78rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:rgba(245,240,232,.55);margin-top:.5rem}

    @media(max-width: 768px) {
      .stats-band { grid-template-columns: 1fr 1fr; gap: 3rem; }
    }
    @media(max-width: 480px) {
      .stats-band { grid-template-columns: 1fr; }
    }

    /* VALUES */
    .values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:3rem}
    .val-card{background:#fff;border:1px solid var(--border);border-radius:12px;padding:2rem;transition:transform .3s,box-shadow .3s;position:relative;overflow:hidden}
    .val-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--amber),var(--gl))}
    .val-card:hover{transform:translateY(-6px);box-shadow:0 18px 45px rgba(26,58,42,.1)}
    .val-icon{font-size:2.5rem;margin-bottom:1rem}
    .val-card h3{font-family:'Playfair Display',serif;font-size:1.1rem;color:var(--gd);margin-bottom:.6rem}
    .val-card p{font-size:.85rem;color:var(--tl);line-height:1.7}

    @media(max-width: 1024px) {
      .values-grid { grid-template-columns: 1fr 1fr; }
    }
    @media(max-width: 600px) {
      .values-grid { grid-template-columns: 1fr; }
    }

    /* VIDEO SECTION */
    .video-section{background:var(--cream);padding:6rem 8vw;text-align:center}
    .video-wrap{position:relative;max-width:860px;margin:2.5rem auto 0;border-radius:16px;overflow:hidden;box-shadow:0 24px 60px rgba(26,58,42,.2)}
    .video-wrap iframe{width:100%;aspect-ratio:16/9;border:none;display:block}

    /* TEAM */
    .team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:3rem}
    .team-card{background:#fff;border-radius:12px;overflow:hidden;border:1px solid var(--border);box-shadow:0 4px 18px rgba(26,58,42,.06);transition:transform .3s,box-shadow .3s}
    .team-card:hover{transform:translateY(-5px);box-shadow:0 14px 36px rgba(26,58,42,.12)}
    .team-img{height:240px;overflow:hidden}
    .team-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
    .team-card:hover .team-img img{transform:scale(1.06)}
    .team-body{padding:1.3rem 1.4rem 1.5rem}
    .team-name{font-family:'Playfair Display',serif;font-size:1.1rem;color:var(--gd);margin-bottom:.2rem}
    .team-role{font-size:.72rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--gl);margin-bottom:.6rem}
    .team-bio{font-size:.82rem;color:var(--tl);line-height:1.65}

    @media(max-width: 1024px) {
      .team-grid { grid-template-columns: 1fr 1fr; }
    }
    @media(max-width: 600px) {
      .team-grid { grid-template-columns: 1fr; }
    }

    /* GALLERY */
    .gallery{padding:6rem 8vw;background:var(--gd)}
    .gallery .sec-title{color:var(--cream)}
    .gallery .sec-label{color:var(--gl)}
    .gallery .sec-body{color:rgba(245,240,232,.6)}
    .gal-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:200px 200px;gap:12px;margin-top:2.5rem}
    .gal-item{overflow:hidden;border-radius:8px;cursor:pointer}
    .gal-item.tall{grid-row:span 2}
    .gal-item.wide{grid-column:span 2}
    .gal-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s;display:block}
    .gal-item:hover img{transform:scale(1.08)}

    @media(max-width: 1024px) {
      .gal-grid { grid-template-columns: repeat(2,1fr); grid-template-rows: repeat(4, 180px); }
    }
    @media(max-width: 600px) {
      .gal-grid { grid-template-columns: 1fr; grid-template-rows: auto; }
      .gal-item.tall, .gal-item.wide { grid-row: auto; grid-column: auto; }
      .gal-item { aspect-ratio: 4/3; }
    }

    /* MILESTONES */
    .timeline{padding:6rem 8vw}
    .tl-wrap{position:relative;max-width:700px;margin:3rem auto 0}
    .tl-wrap::before{content:'';position:absolute;left:50%;top:0;bottom:0;width:2px;background:var(--border);transform:translateX(-50%)}
    .tl-item{display:flex;gap:3rem;align-items:flex-start;margin-bottom:3.5rem;position:relative}
    .tl-item:nth-child(even){flex-direction:row-reverse}
    .tl-year{flex:0 0 auto;width:90px;text-align:center;font-family:'Playfair Display',serif;font-size:1.4rem;color:var(--amber);font-weight:700}
    .tl-dot{position:absolute;left:50%;top:.4rem;width:14px;height:14px;background:var(--gl);border-radius:50%;transform:translateX(-50%);border:3px solid var(--ww);z-index:1}
    .tl-content{flex:1;background:#fff;border:1px solid var(--border);border-radius:10px;padding:1.2rem 1.4rem;box-shadow:0 4px 16px rgba(26,58,42,.06)}
    .tl-content h4{font-family:'Playfair Display',serif;font-size:1rem;color:var(--gd);margin-bottom:.4rem}
    .tl-content p{font-size:.82rem;color:var(--tl);line-height:1.65}

    @media(max-width: 768px) {
      .tl-wrap::before{left:20px}
      .tl-item,.tl-item:nth-child(even){flex-direction:column;padding-left:50px; gap: 0.5rem;}
      .tl-dot{left:20px}
      .tl-year{width:auto;text-align:left; font-size: 1.2rem; }
    }

    /* FOOTER */
    footer{background:var(--gd);padding:3rem 8vw 1.5rem}
    .footer-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;border-top:1px solid rgba(255,255,255,.08);padding-top:1.5rem}
    .fl{font-family:'Playfair Display',serif;font-size:1.2rem;color:var(--cream)}
    .fl span{color:var(--al);font-style:italic}
    footer p{font-size:.75rem;color:rgba(245,240,232,.3)}

    @keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
    
    @media(max-width: 900px) {
      footer > div:first-child { grid-template-columns: 1fr 1fr !important; }
    }
    @media(max-width: 600px) {
      footer > div:first-child { grid-template-columns: 1fr !important; gap: 2rem !important; }
      .footer-inner { flex-direction: column; text-align: center; }
    }

/* ==========================================
COMPLETE MOBILE RESPONSIVE FIX
ADD THIS AT THE END OF about.css
========================================== */

html,
body{
width:100%;
overflow-x:hidden;
}

img,
video,
iframe{
max-width:100%;
display:block;
}

/* GENERAL */
@media (max-width:1024px){

section{
padding:4rem 5vw;
}

.story-grid{
grid-template-columns:1fr;
gap:3rem;
}

.story-img-stack{
max-width:550px;
width:100%;
margin:auto;
}

.values-grid{
grid-template-columns:repeat(2,1fr);
}

.team-grid{
grid-template-columns:repeat(2,1fr);
}

.gal-grid{
grid-template-columns:repeat(2,1fr);
}

.stats-band{
grid-template-columns:repeat(2,1fr);
}

}

/* TABLET */
@media (max-width:768px){

nav{
padding:0 20px;
}

.nav-logo{
font-size:1.1rem;
}

.nav-links{
position:fixed;
top:72px;
right:-100%;
width:280px;
height:calc(100vh - 72px);
background:var(--gd);
flex-direction:column;
align-items:flex-start;
padding:30px;
transition:.4s ease;
z-index:999;
}

.nav-links.active{
right:0;
}

.hamburger{
display:flex;
}

.hero{
height:60vh;
}

.hero h1{
font-size:2rem;
}

.hero p{
font-size:.9rem;
}

.story-grid{
text-align:center;
}

.story-img-stack{
height:350px;
}

.story-badge{
width:90px;
height:90px;
font-size:1.5rem;
padding:1rem;
}

.stats-band{
padding:3rem 20px;
grid-template-columns:1fr 1fr;
}

.values-grid{
grid-template-columns:1fr;
}

.team-grid{
grid-template-columns:1fr;
}

.gal-grid{
grid-template-columns:1fr;
grid-template-rows:auto;
}

.gal-item,
.gal-item.wide,
.gal-item.tall{
grid-column:auto;
grid-row:auto;
aspect-ratio:4/3;
}

.timeline{
padding:4rem 20px;
}

.tl-wrap::before{
left:20px;
}

.tl-item,
.tl-item:nth-child(even){
flex-direction:column;
padding-left:50px;
gap:.5rem;
}

.tl-dot{
left:20px;
}

.tl-year{
width:auto;
text-align:left;
}

/* WHAT WE OFFER SECTION */
section[style*="background:var(--cream)"] > div{
grid-template-columns:1fr !important;
gap:2rem !important;
}

section[style*="background:var(--cream)"] img{
height:280px !important;
}

/* CTA */
section[style*="text-align:center"]{
padding:4rem 20px !important;
}

/* FOOTER */
footer > div:first-child{
grid-template-columns:1fr !important;
gap:2rem !important;
text-align:center;
}

.footer-inner{
flex-direction:column;
text-align:center;
}

}

/* MOBILE */
@media (max-width:480px){

nav{
height:65px;
padding:0 15px;
}

.nav-logo{
font-size:1rem;
}

.nav-cart{
display:none;
}

.hero{
height:50vh;
}

.hero h1{
font-size:1.6rem;
}

.hero p{
font-size:.85rem;
}

.eyebrow{
font-size:.65rem;
}

section{
padding:3rem 20px;
}

.story-img-stack{
height:280px;
}

.story-badge{
width:70px;
height:70px;
font-size:1.2rem;
padding:.7rem;
}

.stats-band{
grid-template-columns:1fr;
gap:2rem;
}

.stat-num{
font-size:2rem;
}

.team-img{
height:220px;
}

.breadcrumb{
font-size:.7rem;
padding:12px 20px;
}

}

/* HAMBURGER ANIMATION */
.hamburger.active span:nth-child(1){
transform:translateY(7px) rotate(45deg);
}

.hamburger.active span:nth-child(2){
opacity:0;
}

.hamburger.active span:nth-child(3){
transform:translateY(-7px) rotate(-45deg);
}
/* ==========================
   PREMIUM OFFER SECTION
========================== */

.offer-section{
  background: linear-gradient(
    180deg,
    #fdfaf4 0%,
    #f7f1e8 100%
  );
  position: relative;
  overflow: hidden;
}

.offer-section::before{
  content:"";
  position:absolute;
  width:500px;
  height:500px;
  border-radius:50%;
  background:rgba(82,183,136,.05);
  top:-200px;
  right:-200px;
}

.offer-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:5rem;
  align-items:center;
  position:relative;
  z-index:2;
}

.offer-image{
  width:100%;
  height:550px;
  object-fit:cover;
  border-radius:24px;
  display:block;
  box-shadow:
  0 30px 60px rgba(26,58,42,.15);
  transition:.5s ease;
}

.offer-image:hover{
  transform:scale(1.03);
}

.offer-content .sec-label{
  color:#52b788;
  letter-spacing:.3em;
}

.offer-content .sec-title{
  font-size:clamp(2rem,4vw,3.5rem);
  line-height:1.1;
  margin-bottom:1rem;
}

.offer-list{
  display:flex;
  flex-direction:column;
  gap:1.5rem;
  margin-top:2rem;
}

.offer-item{
  background:rgba(255,255,255,.7);
  backdrop-filter:blur(20px);
  border:1px solid rgba(82,183,136,.15);
  border-radius:18px;
  padding:1.4rem;
  display:flex;
  gap:1rem;
  align-items:flex-start;
  transition:.35s ease;
}

.offer-item:hover{
  transform:translateY(-6px);
  box-shadow:
  0 20px 40px rgba(26,58,42,.08);
  border-color:#52b788;
}

.offer-icon{
  width:60px;
  height:60px;
  flex-shrink:0;
  border-radius:16px;
  background:linear-gradient(
    135deg,
    #1a3a2a,
    #2d6a4f
  );
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.5rem;
  color:#fff;
}

.offer-item h4{
  font-family:'Playfair Display',serif;
  color:#1a3a2a;
  font-size:1.3rem;
  margin-bottom:.5rem;
}

.offer-item p{
  color:#5c7567;
  font-size:.95rem;
  line-height:1.8;
}

/* MOBILE */

@media(max-width:991px){

  .offer-grid{
    grid-template-columns:1fr;
    gap:3rem;
  }

  .offer-image{
    height:400px;
  }

}

@media(max-width:768px){

  .offer-content{
    text-align:center;
  }

  .offer-content .sec-div{
    margin-inline:auto;
  }

  .offer-item{
    text-align:left;
  }

}

@media(max-width:480px){

  .offer-image{
    height:260px;
    border-radius:18px;
  }

  .offer-item{
    padding:1rem;
  }

  .offer-icon{
    width:50px;
    height:50px;
    font-size:1.2rem;
  }

  .offer-item h4{
    font-size:1.05rem;
  }

  .offer-item p{
    font-size:.88rem;
  }

}