:root{
  --dark-green:#173128;
  --dark-green-2:#0e211b;
  --cream:#F4EAD0;
  --peach:#F7ECE4;
  --logo-box:#E6DAB8;
  --heading:#1B382C;
  --sub-text:#7C7A70;
}

*{ box-sizing:border-box; }

body{
  font-family:'Poppins', sans-serif;
  margin:0;
  color:#333;
}

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

/* =========================================================
   Header / Nav
   ========================================================= */
.top-nav{
  background:var(--dark-green);
  padding:.9rem 0;
  position:sticky;
  top:0;
  z-index:1000;
  transition:box-shadow .2s ease;
}
.top-nav.scrolled{
  box-shadow:0 4px 16px rgba(0,0,0,.18);
}
.brand-logo{
  display:flex;
  align-items:center;
  gap:.4rem;
}
.header-logo-img{
  height:46px;
  width:auto;
}
.header-bnk-img{
  height:34px;
  width:auto;
}
@media (max-width:420px){
  .header-logo-img{ height:38px; }
  .header-bnk-img{ height:28px; }
}

.top-nav .nav-link{
  color:#fff !important;
  font-weight:600;
  font-size:.92rem;
  letter-spacing:1px;
  margin:0 .9rem;
  padding:.4rem 0 !important;
  position:relative;
  cursor:pointer;
}
.top-nav .nav-link::after{
  content:'';
  position:absolute;
  left:0; bottom:0;
  width:0; height:2px;
  background:var(--cream);
  transition:width .2s ease;
}
.top-nav .nav-link:hover::after{ width:100%; }
.top-nav .dropdown-toggle::after{
  content:none;
}
.top-nav .navbar-toggler{
  border-color:rgba(255,255,255,.4);
}
.top-nav .navbar-toggler-icon{
  filter:invert(1);
}

/* Nav dropdown (About Us) - opens on hover (desktop), tap (mobile) */
.top-nav .dropdown{ position:relative; }
.top-nav .dropdown-menu{
  display:none;
  background:var(--dark-green);
  border:none;
  border-radius:0;
  padding:0;
  margin:0;
  position:absolute;
  top:100%;
  left:50%;
  transform:translateX(-50%);
  min-width:280px;
  list-style:none;
  box-shadow:0 12px 24px rgba(0,0,0,.18);
}
.top-nav .dropdown-menu.show{ display:block; }
.top-nav .dropdown-item{
  color:#fff;
  text-align:center;
  text-transform:uppercase;
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.5px;
  padding:.85rem 1rem;
  border-top:1px solid rgba(255,255,255,.12);
  text-decoration:none;
  display:block;
}
.top-nav .dropdown-item:first-child{ border-top:none; }
.top-nav .dropdown-item:hover,
.top-nav .dropdown-item:focus{
  background:rgba(255,255,255,.08);
  color:#fff;
}
@media (min-width:992px){
  .top-nav .dropdown:hover > .dropdown-menu{ display:block; }
}
@media (max-width:991px){
  .top-nav .navbar-collapse{
    position:absolute;
    top:100%;
    left:0;
    right:0;
    background:var(--dark-green);
    padding:0 1.5rem 1.5rem;
    max-height:calc(100vh - 70px);
    overflow-y:auto;
    box-shadow:0 16px 28px rgba(0,0,0,.25);
  }
  .top-nav .navbar-nav{
    padding-top:.5rem;
  }
  .top-nav .dropdown-menu{
    position:static;
    transform:none;
    width:100%;
    margin-top:.5rem;
  }
  .top-nav .dropdown-item{
    text-align:left;
  }
}

/* =========================================================
   Hero / Brand logo grid section
   ========================================================= */
.hero-brands{
  background:var(--cream);
  padding:0;
  position:relative;
}
.hero-slider{
  position:relative;
  width:100%;
  overflow:hidden;
  aspect-ratio: 1920 / 946;
  cursor:grab;
  user-select:none;
}
.hero-slider.dragging{ cursor:grabbing; }
.hero-track{
  display:flex;
  width:100%;
  height:100%;
  transition:transform .4s ease;
}
.hero-track.no-transition{ transition:none; }
.hero-slide{
  flex:0 0 100%;
  width:100%;
  height:100%;
  object-fit:cover;
  pointer-events:none;
}
@media (max-width:767px){
  .hero-slider{ aspect-ratio: 4 / 3; }
}

.slide-dots{
  position:absolute;
  left:0;
  right:0;
  bottom:16px;
  display:flex;
  justify-content:center;
  gap:.5rem;
  padding:0;
  background:transparent;
  z-index:3;
}
.slide-dots span{
  width:8px; height:8px;
  border-radius:50%;
  background:rgba(255,255,255,.5);
  border:1px solid rgba(0,0,0,.15);
  cursor:pointer;
  transition:all .2s ease;
}
.slide-dots span.active{
  background:#fff;
  width:22px;
  border-radius:5px;
}

/* =========================================================
   Stats bar
   ========================================================= */
.stats-bar{
  background:var(--dark-green);
  border-top:1px solid rgba(255,255,255,.15);
  padding:1.6rem 0;
}
.stats-bar .stat-item{
  color:var(--cream);
  font-weight:700;
  font-size:1.3rem;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.4rem;
}
.stats-bar .diamond{
  color:var(--cream);
  font-size:1rem;
  opacity:.85;
}
@media (max-width:767px){
  .stats-bar .stat-item{ font-size:1.05rem; margin-bottom:.6rem; }
  .stats-bar .col-diamond{ display:none; }
}

/* =========================================================
   About section
   ========================================================= */
.about-section{
  background:var(--peach);
  padding:3.5rem 0;
}
.about-card{
  background:#fff;
  border-radius:4px;
  padding:3.2rem 3rem;
}
.about-card h2{
  color:#17221D;
  font-weight:800;
  font-size:1.55rem;
  line-height:1.35;
  margin-bottom:1.6rem;
}
.about-card p{
  color:#5b5b56;
  font-size:.95rem;
  line-height:1.75;
  margin-bottom:1.4rem;
}
.about-card p strong{ color:#17221D; }
.btn-about{
  background:var(--dark-green);
  color:var(--cream);
  border:none;
  padding:.7rem 1.7rem;
  font-weight:600;
  font-size:.85rem;
  border-radius:2px;
  text-decoration:none;
  display:inline-block;
}
.btn-about:hover{ background:var(--dark-green-2); color:var(--cream); }

.about-logo-block{
  display:flex;
  align-items:center;
  justify-content:center;
  height:100%;
}
.about-logos-img{
  max-width:100%;
  height:auto;
}
@media (max-width:991px){
  .about-card{ padding:2.2rem 1.6rem; }
  .about-logo-block{ margin-top:2.5rem; align-items:flex-start; }
}

/* =========================================================
   Partner logo slider strip
   ========================================================= */
.partner-strip{
  background:var(--peach);
  padding:1.5rem 0 3rem;
}
.partner-slider-wrap{
  display:flex;
  align-items:center;
  gap:1rem;
  background:#fff;
  border-radius:4px;
  padding:1.3rem 1.5rem;
}
.partner-arrow{
  flex:0 0 auto;
  width:auto;
  height:auto;
  border-radius:0;
  border:none;
  background:transparent;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  color:var(--heading);
  font-size:1.4rem;
  padding:.3rem .4rem;
  transition:opacity .2s ease;
}
.partner-arrow:hover{ background:transparent; opacity:.6; }
.partner-track-viewport{
  overflow:hidden;
  flex:1 1 auto;
  cursor:grab;
  user-select:none;
}
.partner-track-viewport.dragging{ cursor:grabbing; }
.partner-track{
  display:flex;
  gap:1.2rem;
  transition:transform .4s ease;
}
.partner-track.no-transition{ transition:none; }
.partner-logo{
  flex:0 0 auto;
  width:150px;
  height:100px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:.4rem;
  background:transparent;
  border:none;
  border-radius:0;
  overflow:hidden;
}
.partner-logo img{
  width:100%;
  height:100%;
  object-fit:contain;
  border-radius:2px;
}
@media (max-width:575px){
  .partner-logo{ width:110px; height:74px; }
}

/* =========================================================
   Business sectors
   ========================================================= */
.sectors-section{
  background:var(--peach);
  padding:2rem 0 4rem;
  text-align:center;
}
.section-heading{
  color:var(--heading);
  font-weight:800;
  font-size:1.6rem;
  letter-spacing:.5px;
  margin-top:0;
  margin-bottom:2.5rem;
}
.sector-card{
  background:#fff;
  border-radius:4px;
  overflow:hidden;
  text-align:center;
  height:100%;
}
.sector-img{
  width:100%;
  height:230px;
  object-fit:cover;
  background:#d9d2c3;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#8a8370;
  font-weight:600;
  font-size:.9rem;
}
.sector-img-real{
  width:100%;
  height:230px;
  object-fit:cover;
  display:block;
}
.sector-body{ padding:1.8rem 1.6rem 2.2rem; }
.sector-body h3{
  color:var(--heading);
  font-weight:700;
  font-size:1.05rem;
  letter-spacing:.5px;
  margin-bottom:1rem;
}
.sector-body p{
  color:var(--sub-text);
  font-size:.88rem;
  line-height:1.7;
  margin-bottom:1.5rem;
}

/* =========================================================
   Featured news
   ========================================================= */
.news-section{
  background:var(--peach);
  padding:1rem 0 3.5rem;
  text-align:center;
}
.news-card{
  background:#E8E4D3;
  border-radius:4px;
  overflow:hidden;
  max-width:900px;
  margin:0 auto;
  text-align:left;
}
.news-visual{
  min-height:280px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:2rem;
  padding:3rem 2rem;
  flex-wrap:wrap;
}
.news-img-real{
  width:100%;
  height:auto;
  display:block;
}
.news-visual .logo-a{
  font-size:1.8rem;
  font-weight:800;
  color:var(--heading);
  letter-spacing:2px;
  text-align:center;
}
.news-visual .logo-a .arabic{
  font-size:1.4rem;
  letter-spacing:6px;
  margin-top:.2rem;
}
.news-visual .logo-b{
  font-size:1.6rem;
  font-weight:700;
  color:#6fa72f;
  text-align:center;
}
.news-visual .logo-b .leaf{ font-size:2.2rem; }
.news-caption{
  background:#fff;
  padding:1.3rem 1.8rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
}
.news-caption p{
  margin:0;
  font-weight:600;
  color:var(--heading);
  font-size:.98rem;
}

/* =========================================================
   Quote / stat paragraph block
   ========================================================= */
.quote-block{
  background:var(--peach);
  padding:1rem 0 4rem;
  text-align:center;
}
.quote-block p{
  max-width:760px;
  margin:0 auto;
  color:var(--heading);
  font-size:1.35rem;
  font-weight:600;
  line-height:1.7;
}

/* =========================================================
   Gallery
   ========================================================= */
.gallery-section{
  background:var(--peach);
  padding:2.2rem 2.2rem 2.6rem;
}
.gallery-img-single{
  width:100%;
  height:780px;
  object-fit:cover;
  display:block;
  transition:opacity .4s ease;
}
.gallery-right{ height:600px; }

.gallery-arrows{
  display:flex;
  justify-content:flex-end;
  gap:.6rem;
  padding-top:1.4rem;
}
.gallery-arrow{
  width:auto; height:auto;
  border-radius:0;
  border:none;
  background:transparent;
  color:var(--heading);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  font-size:1.3rem;
  padding:.2rem .4rem;
  transition:opacity .2s ease;
}
.gallery-arrow:hover{ background:transparent; opacity:.6; }

@media (max-width:991px){
  .gallery-img-single{ height:420px; }
  .gallery-right{ height:340px; }
}
@media (max-width:575px){
  .gallery-section{ padding:1.2rem 1rem 1.6rem; }
  .gallery-img-single{ height:280px; font-size:.8rem; }
  .gallery-right{ height:220px; }
}

/* =========================================================
   Footer
   ========================================================= */
.site-footer{
  background:var(--dark-green);
  color:#cfd6d1;
  padding:3.5rem 0 1.8rem;
  text-align:center;
}
.footer-logo-img{
  height:70px;
  width:auto;
  margin:0 auto;
}
@media (max-width:575px){
  .footer-logo-img{ height:56px; }
}
.footer-nav{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:2.2rem;
  margin:2.5rem 0 1.6rem;
  padding-bottom:1.6rem;
  border-bottom:1px solid rgba(255,255,255,.15);
}
.footer-nav a{
  color:#fff;
  text-decoration:none;
  font-size:.82rem;
  font-weight:600;
  letter-spacing:1px;
  text-transform:uppercase;
}
.footer-nav a:hover{ color:var(--cream); }
.footer-bottom-text{
  font-size:.8rem;
  color:#9fa9a3;
}

@media (max-width:575px){
  .footer-nav{ gap:1.2rem 1.6rem; }
}

/* =========================================================
   About Us page
   ========================================================= */
.about-hero{
  position:relative;
  width:100%;
  height:420px;
  overflow:hidden;
}
.about-hero-img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.about-title-bar{
  background:var(--dark-green);
  color:var(--cream);
  text-align:center;
  padding:1.1rem 0;
  font-weight:700;
  font-size:1.3rem;
  letter-spacing:2px;
}
@media (max-width:575px){
  .about-hero{ height:220px; }
}

.about-intro{
  background:var(--peach);
  padding:3.5rem 0;
}
.about-intro p{
  color:#4a4a45;
  font-size:1.2rem;
  line-height:1.85;
  margin-bottom:1.4rem;
}
.about-intro-img{
  width:100%;
  height:100%;
  min-height:220px;
  border-radius:4px;
  object-fit:cover;
  display:block;
}
.about-collage-img{
  width:100%;
  height:100%;
  min-height:260px;
  border-radius:4px;
  object-fit:cover;
  display:block;
}

/* CEO message */
.ceo-section{
  background:var(--peach);
  padding:3.5rem 0;
}
.ceo-card{
  background:#fff;
  border-radius:6px;
  overflow:hidden;
  display:flex;
  align-items:stretch;
}
.ceo-text{
  position:relative;
  flex:0 0 58%;
  max-width:58%;
  padding:3rem 3rem 3rem 3.4rem;
  display:flex;
  flex-direction:column;
  justify-content:start;
}
.ceo-watermark{
  position:absolute;
  top:1.6rem;
  left:1.5rem;
  width:110px;
  height:96px;
  z-index:0;
}
.ceo-subtitle{
  position:relative;
  z-index:1;
  color:#1c2b25;
  font-weight:700;
  font-size:1.35rem;
  margin:0 0 .1rem;
}
.ceo-title{
  position:relative;
  z-index:1;
  color:#1c2b25;
  font-weight:800;
  font-size:2.3rem;
  margin:0 0 2.4rem;
  line-height:1.1;
}
.ceo-text p{
  position:relative;
  z-index:1;
  color:#5a5a55;
  font-size:1.2rem;
  line-height:1.85;
  margin:0;
}
.ceo-photo{
  flex:0 0 42%;
  max-width:42%;
  width:42%;
  align-self:stretch;
  object-fit:cover;
  display:block;
}
@media (max-width:767px){
  .ceo-card{ flex-direction:column; }
  .ceo-text{ flex:0 0 auto; max-width:100%; padding:2.4rem 1.8rem; }
  .ceo-title{ font-size:1.8rem; }
  .ceo-photo{ flex:0 0 auto; max-width:100%; width:100%; height:280px; }
}
.ceo-photo{
  width:100%;
  height:100%;
  border-radius:0px;
  object-fit:cover;
  object-position:top;
  display:block;
}

/* Mission / Vision / Values */
.pillars-section{
  background:var(--peach);
  padding:0 0 3.5rem;
}
.pillar-card{
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,.025) 0 2px, transparent 2px 26px),
    var(--dark-green);
  color:var(--cream);
  border-radius:6px;
  padding:2.4rem 2.2rem;
  height:100%;
}
.pillar-card h3{
  color:#fff;
  font-weight:800;
  font-size:2rem;
  line-height:1.15;
  margin-bottom:1.6rem;
  letter-spacing:.2px;
}
.pillar-card p{
  color:var(--cream);
  font-size:1rem;
  line-height:1.85;
  margin:0;
}
.pillar-card ul{
  margin:0;
  padding-left:1.1rem;
  font-size:1rem;
  line-height:2.1;
}

/* Four Pillars accordion */
.four-pillars-section{
  background:var(--peach);
  padding:0 0 3.5rem;
  text-align:center;
}
.accordion-pillar{
  max-width:900px;
  margin:0 auto;
}
.accordion-item-custom{
  background:var(--dark-green);
  border-radius:6px;
  margin-bottom:.9rem;
  overflow:hidden;
}
.accordion-header-custom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:1.1rem 1.6rem;
  color:#fff;
  font-weight:700;
  font-size:.95rem;
  letter-spacing:1px;
  cursor:pointer;
}
.accordion-header-custom .plus-icon{
  font-size:1.2rem;
  transition:transform .25s ease;
  flex:0 0 auto;
  margin-left:1rem;
}
.accordion-item-custom.open .plus-icon{ transform:rotate(45deg); }
.accordion-body-custom {
    max-height: 0;
    overflow: hidden;
    transition: max-height .3s ease;
    background: rgb(255 255 255);
}
.accordion-body-custom p{
  color:#302F36;
  font-size:.88rem;
  line-height:1.75;
  text-align:left;
  padding:10px 1.6rem 1.3rem;
  margin:0;
}

/* CSR section */
.csr-section{
  background:var(--peach);
  padding:0 0 3.5rem;
  text-align:center;
}
.csr-track-wrap{
  display:flex;
  align-items:center;
  gap:1rem;
  max-width:1100px;
  margin:0 auto;
}
.csr-arrow{
  flex:0 0 auto;
  width:auto; height:auto;
  border-radius:0;
  border:none;
  background:transparent;
  color:var(--heading);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  font-size:1.4rem;
  padding:.3rem .4rem;
  transition:opacity .2s ease;
}
.csr-arrow:hover{ background:transparent; opacity:.6; }
.csr-viewport{ overflow:hidden; flex:1 1 auto; cursor:grab; user-select:none; }
.csr-viewport.dragging{ cursor:grabbing; }
.csr-track{
  display:flex;
  align-items:stretch;
  gap:1.1rem;
  transition:transform .4s ease;
}
.csr-track.no-transition{ transition:none; }
.csr-card{
  flex:0 0 auto;
  width:240px;
  background:#fff;
  border-radius:6px;
  padding:1.4rem 1.3rem;
  text-align:left;
  display:flex;
  flex-direction:column;
}
.csr-icon {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: none;
    background: var(--dark-green);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
    margin-bottom: .9rem;
    flex: 0 0 auto;
    padding: 7px;
}
.csr-card h4{
  font-size:.85rem;
  font-weight:700;
  letter-spacing:.5px;
  color:var(--heading);
  margin-bottom:.6rem;
}
.csr-card p{
  font-size:.82rem;
  color:var(--sub-text);
  line-height:1.6;
  margin-bottom:.9rem;
  flex:1 1 auto;
}
.csr-card a{
  font-size:.8rem;
  font-weight:700;
  color:var(--dark-green);
  text-decoration:none;
  margin-top:auto;
}
.csr-card a:hover{ text-decoration:underline; }
@media (max-width:575px){
  .csr-card{ width:200px; }
}

/* Our Team */
.team-section{
  background:var(--peach);
  padding:3.5rem 0;
  text-align:center;
}
.team-container{
  max-width:750px;
  margin:0 auto;
  padding:0 1rem;
}
.team-featured{
  max-width:230px;
  margin:2.5rem auto 0;
}
.team-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1.5rem;
  margin-top:2rem;
}
.team-member{
  cursor:pointer;
  background:#fff;
  border-radius:10px;
  box-shadow:0 4px 14px rgba(27,56,44,.08);
  overflow:hidden;
  text-align:left;
  transition:transform .2s ease, box-shadow .2s ease;
}
.team-member:hover{
  transform:translateY(-3px);
  box-shadow:0 8px 20px rgba(27,56,44,.14);
}
.team-photo-wrap{
  position:relative;
  overflow:hidden;
}
.team-photo{
  width:100%;
  aspect-ratio:1/1.05;
  border-radius:0;
  object-fit:cover;
  display:block;
  margin-bottom:0;
  cursor:pointer;
  transition:transform .3s ease;
}
.team-photo-overlay{
  position:absolute;
  inset:0;
  background:rgba(27,56,44,.55);
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0;
  transition:opacity .25s ease;
  pointer-events:none;
}
.team-member:hover .team-photo-overlay{
  opacity:1;
  pointer-events:auto;
}
.team-member:hover .team-photo{
  transform:scale(1.06);
}
.team-view-more{
  background:transparent;
  color:#fff;
  border:1.5px solid #fff;
  border-radius:30px;
  padding:.45rem 1.3rem;
  font-size:.8rem;
  font-weight:600;
  letter-spacing:.3px;
  cursor:pointer;
  transition:background .2s ease, color .2s ease;
}
.team-view-more:hover{
  background:#fff;
  color:var(--heading);
}
.team-name{
  font-weight:700;
  color:var(--heading);
  font-size:.95rem;
  margin:.9rem 1rem .2rem;
}
.team-title{
  color:var(--sub-text);
  font-size:.8rem;
  margin:0 1rem 1rem;
  line-height:1.35;
}
.team-group-photo-container{
  max-width:1100px;
  margin:0 auto;
  padding:0 1rem;
}
.team-group-photo{
  width:100%;
  height:440px;
  border-radius:6px;
  object-fit:cover;
  display:block;
  margin-top:2.5rem;
}
@media (max-width:767px){
  .team-group-photo{ height:280px; }
}
@media (max-width:575px){
  .team-grid{ grid-template-columns:repeat(2, 1fr); }
}

.about-closing{
  background:var(--peach);
  padding:60px 0 3.5rem;
  text-align:center;
}
.about-closing p{
  max-width:760px;
  margin:0 auto 1.1rem;
  color:var(--heading);
  font-size:1rem;
  line-height:1.8;
}

/* FMCG & Manufacturing sector page */
.fmcg-intro{
  background:var(--peach);
  padding:3.5rem 0;
}
.fmcg-intro-container{
  max-width:780px;
  margin:0 auto;
  padding:0 1.5rem;
}
.fmcg-intro-heading{
  color:var(--heading);
  font-weight:800;
  font-size:1.6rem;
  letter-spacing:.5px;
  margin-bottom:1.5rem;
}
.fmcg-intro-container p{
  color:var(--sub-text);
  font-size:1rem;
  line-height:1.8;
  margin-bottom:1.3rem;
}
.fmcg-stats-row{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:1.2rem;
  margin-top:2.2rem;
  flex-wrap:wrap;
}
.fmcg-stat{
  color:var(--heading);
  font-weight:800;
  font-size:1.3rem;
  letter-spacing:.3px;
}
.fmcg-stat-diamond{
  color:var(--heading);
  font-size:1rem;
}
@media (max-width:575px){
  .fmcg-stat{ font-size:1.05rem; }
}
.fmcg-facility-photo{
  width:100%;
  line-height:0;
}
.fmcg-facility-photo img{
  width:100%;
  height:480px;
  object-fit:cover;
  display:block;
}
@media (max-width:767px){
  .fmcg-facility-photo img{ height:260px; }
}

/* FMCG brand search bar + bento grid */
.brand-search-bar{
  display:flex;
  align-items:center;
  gap:1rem;
  background:#F4F4F4;
  padding:1.1rem 2rem;
}
.brand-search-input{
  flex:1 1 auto;
  border:none;
  outline:none;
  background:transparent;
  font-size:.95rem;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--sub-text);
}
.brand-search-input::placeholder{
  color:var(--sub-text);
  opacity:.8;
}
.brand-search-btn{
  flex:0 0 auto;
  width:44px; height:44px;
  border-radius:50%;
  background:var(--dark-green);
  color:#fff;
  border:none;
  font-size:1.1rem;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  padding:0;
}
.brand-search-btn svg{
  display:block;
}
.brand-search-divider{
  width:1px;
  align-self:stretch;
  background:#e5ded0;
}
.brand-search-select{
  border:none;
  outline:none;
  background:transparent;
  color:var(--heading);
  font-weight:600;
  font-size:.9rem;
  letter-spacing:.5px;
  cursor:pointer;
}
@media (max-width:575px){
  .brand-search-bar{ padding:1rem; gap:.6rem; }
  .brand-search-input{ font-size:.8rem; }
}

.brand-bento{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  grid-auto-rows:190px;
  gap:2px;
  background:var(--peach);
}
.brand-tile{
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:1.6rem;
  overflow:hidden;
}
.brand-tile img{
  max-width:100%;
  max-height:100%;
  object-fit:contain;
}
.brand-tile a{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
}
.brand-tile.featured{
  grid-column:span 2;
  grid-row:span 2;
}
.brand-tile.dark{
  background:var(--dark-green);
}
.brand-tile.placeholder{
  background:#fff;
  color:var(--sub-text);
  font-size:.85rem;
  font-weight:600;
  letter-spacing:.5px;
  text-align:center;
  text-transform:uppercase;
}
.brand-tile.placeholder a{
  color:var(--sub-text);
  text-decoration:none;
}
.brand-tile.hidden{
  display:none;
}
@media (max-width:767px){
  .brand-bento{ grid-template-columns:repeat(2, 1fr); grid-auto-rows:140px; }
  .brand-tile.featured{ grid-column:span 2; grid-row:span 1; }
}


.team-modal .modal-content{
  border:none;
  border-radius:8px;
  overflow:hidden;
}
.team-modal .modal-header{
  background:var(--dark-green);
  color:#fff;
  border:none;
}
.team-modal .modal-header .btn-close{ filter:invert(1); }
.team-modal .modal-photo{
  width:100px; height:100px;
  border-radius:50%;
  object-fit:cover;
  display:block;
  margin:0 auto 1rem;
}
.team-modal .modal-body{ text-align:center; padding:2rem; }
.team-modal .modal-title-name{
  font-weight:700;
  color:var(--heading);
  font-size:1.15rem;
  margin-bottom:.2rem;
}
.team-modal .modal-title-role{
  color:var(--dark-green);
  font-weight:600;
  font-size:.9rem;
  margin-bottom:1rem;
}
.team-modal .modal-bio{
  color:var(--sub-text);
  font-size:.9rem;
  line-height:1.7;
  max-height:50vh;
  overflow-y:auto;
  text-align:left;
}
.team-modal .modal-bio p{
  margin-bottom:1rem;
}
.team-modal .modal-bio p:last-child{
  margin-bottom:0;
}