/* =========================================================
   AASHI SOLUTIONS — BRAND TOKENS
   Palette inspired by precast concrete + structural steel:
   panel-seam grid is the signature motif used across dividers,
   card hovers and the drawer menu.
   ========================================================= */
:root{
  --charcoal:#1B1F23;
  --charcoal-soft:#262B31;
  --concrete:#ECE9E2;
  --concrete-dark:#DAD5C9;
  --steel:#B8963C;
  --steel-dark:#8A6F24;
  --yellow:#FFDE21;
  --yellow-dark:#D9BC00;
  --safety:#003f72;
  --safety-dark:#e8b600;
  --slate:#5a5a5a;
  --white:#FFFFFF;

  --font-display:'Space Grotesk', sans-serif;
  --font-creative:'Fraunces', serif;
  --font-body:'Inter', sans-serif;

  --seam: repeating-linear-gradient(90deg, rgba(27,31,35,.06) 0, rgba(27,31,35,.06) 1px, transparent 1px, transparent 64px);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--font-body);
  color:var(--charcoal);
  background:var(--white);
  margin:0;
  overflow-x:hidden;
}
h1,h2,h3,h4,.display{
  font-family:var(--font-display);
  font-weight:700;
  letter-spacing:-0.01em;
  color:var(--charcoal);
}
a{text-decoration:none;}
img{max-width:100%;display:block;}

.eyebrow{
  font-family:var(--font-body);
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#d62828;
  display:flex;
  align-items:center;
  gap:.6rem;
}
.eyebrow::before{
  content:"";
  width:28px;height:2px;
  background:#d62828;
  display:inline-block;
}

.btn-aashi{
  background:var(--safety);
  color:var(--white);
  border:none;
  font-family:var(--font-body);
  font-weight:600;
  padding:.85rem 1.9rem;
  letter-spacing:.03em;
  border-radius:2px;
  position:relative;
  display:inline-flex; align-items:center; gap:.6rem;
  overflow:hidden;
  isolation:isolate;
  transition:color .25s ease, transform .25s ease;
}
.btn-aashi::before{
  content:"";
  position:absolute; inset:0;
  background:#d62828;
  transform:translateX(-101%);
  transition:transform .3s ease;
  z-index:-1;
}
.btn-aashi:hover::before{transform:translateX(0);}
.btn-aashi:hover{color:var(--white); transform:translateY(-2px);}
.btn-aashi i{transition:transform .25s ease; font-size:.95em;}
.btn-aashi:hover i{transform:translateX(4px);}

.btn-outline-aashi{
  background:var(--safety);
  color:var(--white);
  border:none;
  font-family:var(--font-body);
  font-weight:600;
  padding:.85rem 1.9rem;
  letter-spacing:.03em;
  border-radius:2px;
  position:relative;
  display:inline-flex; align-items:center; gap:.6rem;
  overflow:hidden;
  isolation:isolate;
  transition:color .25s ease, transform .25s ease;
}
.btn-outline-aashi::before{
  content:"";
  position:absolute; inset:0;
  background:#d62828;
  transform:translateX(-101%);
  transition:transform .3s ease;
  z-index:-1;
}
.btn-outline-aashi:hover::before{transform:translateX(0);}
.btn-outline-aashi:hover{color:var(--white); transform:translateY(-2px);}
.btn-outline-aashi i{transition:transform .25s ease; font-size:.95em;}
.btn-outline-aashi:hover i{transform:translateX(4px);}

/* Banner-only ghost button ("About Aashi") — kept fully separate so it can
   never be affected by outline/service button changes, or vice versa. */
.btn-hero-ghost{
  background:transparent;
  border:1.5px solid rgba(255,255,255,.55);
  color:var(--white);
  font-weight:600;
  padding:.85rem 1.9rem;
  border-radius:2px;
  display:inline-flex; align-items:center; gap:.6rem;
  white-space:nowrap;
  transition:all .25s ease;
}
.btn-hero-ghost:hover{background:var(--white); color:var(--charcoal); border-color:var(--white);}
.btn-hero-ghost i{transition:transform .25s ease;}
.btn-hero-ghost:hover i{transform:translateX(3px);}

/* Service-card button — self-contained: always full width with centered
   text/icon regardless of the parent's flex settings, so it can't be pushed
   left again by a stretched flex-column parent. */
.btn-service{
  background:var(--safety);
  color:var(--white);
  border:none;
  font-family:var(--font-body);
  font-weight:600;
  padding:.85rem 1.5rem;
  letter-spacing:.03em;
  border-radius:2px;
  position:relative;
  display:flex; align-items:center; justify-content:center; gap:.6rem;
  width:100%;
  overflow:hidden;
  isolation:isolate;
  transition:color .25s ease, transform .25s ease;
}
.btn-service::before{
  content:"";
  position:absolute; inset:0;
  background:#d62828;
  transform:translateX(-101%);
  transition:transform .3s ease;
  z-index:-1;
}
.btn-service:hover::before{transform:translateX(0);}
.btn-service:hover{color:var(--white); transform:translateY(-2px);}
.btn-service i{transition:transform .25s ease; font-size:.95em;}
.btn-service:hover i{transform:translateX(4px);}

.section{padding:6rem 0;}
.section-sm{padding:3.5rem 0;}
.bg-concrete{background:var(--concrete);}
.bg-charcoal{background:var(--charcoal); color:var(--concrete);}
.bg-charcoal h1,.bg-charcoal h2,.bg-charcoal h3{color:var(--white);}

/* seam divider - signature element */
.seam-divider{
  height:56px;
  background-image:var(--seam);
  position:relative;
}
.seam-divider::after{
  content:"";
  position:absolute; left:0; right:0; top:50%;
  height:1px; background:rgba(27,31,35,.12);
}

/* =========================================================
   NAVBAR
   ========================================================= */
.navbar-aashi{
  padding:1rem 0;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--concrete-dark);
  position:sticky; top:0; z-index:1000;
}
.navbar-aashi .logo-mark{
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.5rem;
  color:var(--charcoal);
  display:flex; align-items:center; gap:.6rem;
}
.navbar-aashi .logo-mark img{height:42px; width:auto;}
.navbar-aashi .logo-mark span{color:var(--safety);}

.nav-links{display:flex; align-items:center; gap:.3rem; margin:0; padding:0; list-style:none;}
.nav-links > li > a{
  color:var(--charcoal);
  font-weight:600;
  font-size:.88rem;
  letter-spacing:.02em;
  padding:.4rem .8rem;
  border-radius:20px;
  position:relative;
  transition:background .25s ease, color .25s ease;
}
.nav-links > li > a:hover{background:var(--concrete); color:#d62828;}
.nav-links > li.active > a{background:#003f72; color:var(--white);}

/* dropdown */
.nav-drop{position:relative;}
.nav-drop > a{display:inline-flex; align-items:center; gap:.4rem;}
.nav-drop > a .drop-caret{
  order:2;
  width:16px; height:16px;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:50%;
  background:var(--concrete);
  transition:transform .25s ease, background .25s ease;
}
.nav-drop > a .drop-caret i{font-size:.55rem; color:var(--charcoal);}
.nav-drop:hover > a .drop-caret, .nav-drop.dd-open > a .drop-caret{transform:rotate(180deg); background:#d62828;}
.nav-drop:hover > a .drop-caret i, .nav-drop.dd-open > a .drop-caret i{color:var(--white);}

.dropdown-panel{
  position:absolute; top:100%; left:50%; transform:translate(-50%,14px);
  min-width:260px;
  background:var(--white);
  border-radius:8px;
  border:1px solid var(--concrete-dark);
  box-shadow:0 24px 48px rgba(27,31,35,.16);
  padding:.7rem;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .22s ease, transform .22s cubic-bezier(.2,.8,.3,1);
  z-index:50;
}
.dropdown-panel::before{
  content:"";
  position:absolute; top:-7px; left:50%; transform:translateX(-50%) rotate(45deg);
  width:13px; height:13px;
  background:var(--white);
  border-left:1px solid var(--concrete-dark);
  border-top:1px solid var(--concrete-dark);
}

.nav-drop:hover .dropdown-panel, .nav-drop.dd-open .dropdown-panel{
  opacity:1; visibility:visible; pointer-events:auto; transform:translate(-50%,8px);
}
.dropdown-panel .dd-eyebrow{
  font-size:.66rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--slate); padding:.5rem .6rem .4rem;
}
.dropdown-panel a{
  display:flex; align-items:center; justify-content:space-between; gap:.6rem;
  padding:.62rem .65rem;
  color:var(--charcoal);
  font-size:.88rem;
  font-weight:600;
  border-radius:6px;
  transition:background .2s ease;
}
.dropdown-panel a .txt small{display:block; font-weight:400; color:var(--slate); font-size:.75rem; margin-top:.1rem;}
.dropdown-panel a > i{color:var(--safety); font-size:.8rem; opacity:0; transform:translateX(-4px); transition:.2s;}
.dropdown-panel a:hover{background:var(--concrete);}
.dropdown-panel a:hover > i{opacity:1; transform:translateX(0);}

.nav-cta{
  position:relative;
  background:#d62828;
  color:var(--white) !important;
  padding:.7rem 1.6rem .7rem 1.3rem !important;
  border-radius:2px;
  font-weight:700 !important;
  display:inline-flex; align-items:center; gap:.55rem;
  box-shadow:0 8px 20px rgba(232,93,47,.28);
  overflow:hidden;
  isolation:isolate;
  transition:transform .25s ease, box-shadow .25s ease;
}
.nav-cta::before{
  content:"";
  position:absolute; inset:0;
  background:var(--charcoal);
  transform:translateY(100%);
  transition:transform .3s ease;
  z-index:-1;
}
.nav-cta .cta-ic{
  width:26px; height:26px; border-radius:50%;
  background:rgba(255,255,255,.22);
  display:inline-flex; align-items:center; justify-content:center;
  font-size:.8rem;
  transition:transform .3s ease;
}
.nav-cta:hover{transform:translateY(-2px); box-shadow:0 12px 26px rgba(30,71,99,.35); color:var(--white) !important;}
.nav-cta:hover::before{transform:translateY(0);}
.nav-cta:hover .cta-ic{transform:rotate(18deg);}
.nav-cta::after{display:none !important;}

.hamburger{
  display:none;
  width:44px; height:44px;
  border:1px solid var(--concrete-dark);
  background:var(--white);
  align-items:center; justify-content:center;
  cursor:pointer;
}
.hamburger span, .hamburger span::before, .hamburger span::after{
  content:"";
  display:block;
  width:20px; height:2px;
  background:var(--charcoal);
  position:relative;
  transition:.2s;
}
.hamburger span::before{position:absolute; top:-6px;}
.hamburger span::after{position:absolute; top:6px;}

/* =========================================================
   RIGHT-SIDE DRAWER (mobile)
   ========================================================= */
.drawer-overlay{
  position:fixed; inset:0;
  background:rgba(27,31,35,.55);
  opacity:0; visibility:hidden;
  transition:opacity .3s ease;
  z-index:1100;
}
.drawer-overlay.is-open{opacity:1; visibility:visible;}

.drawer{
  position:fixed; top:0; right:0; bottom:0;
  width:min(86vw, 360px);
  background:var(--charcoal);
  color:var(--concrete);
  transform:translateX(100%);
  transition:transform .35s cubic-bezier(.25,.8,.3,1);
  z-index:1200;
  display:flex; flex-direction:column;
  box-shadow:-20px 0 50px rgba(0,0,0,.3);
}
.drawer.is-open{transform:translateX(0);}

.drawer-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:1.4rem 1.4rem;
  border-bottom:1px solid rgba(255,255,255,.12);
}
.drawer-head .logo-mark{color:var(--white); font-size:1.25rem;}
.drawer-head .logo-mark img{height:34px;}
.drawer-close{
  width:38px; height:38px;
  border:1px solid rgba(255,255,255,.25);
  background:transparent;
  color:var(--white);
  font-size:1.1rem;
  cursor:pointer;
  border-radius:2px;
}
.drawer-close:hover{background:var(--safety); border-color:var(--safety);}

.drawer-body{padding:1.4rem; overflow-y:auto; flex:1;}
.drawer-links{list-style:none; margin:0; padding:0;}
.drawer-links > li{border-bottom:1px solid rgba(255,255,255,.1);}
.drawer-links > li > a{
  display:flex; align-items:center; justify-content:space-between;
  padding:1rem .1rem;
  color:var(--white);
  font-weight:600; font-size:1.02rem;
}
.drawer-links .drawer-sub{
  list-style:none; margin:0 0 .8rem; padding:0 0 0 1rem;
  display:none;
}
.drawer-links .drawer-sub.is-open{display:block;}
.drawer-links .drawer-sub a{
  display:block; padding:.6rem 0; color:rgba(236,233,226,.8); font-weight:500; font-size:.92rem;
}
.drawer-toggle-icon{transition:transform .25s ease;}
.drawer-toggle-icon.rotated{transform:rotate(45deg);}

.drawer-foot{padding:1.4rem; border-top:1px solid rgba(255,255,255,.12); font-size:.85rem; color:rgba(236,233,226,.7);}
.drawer-foot a{color:var(--safety); font-weight:600;}

/* =========================================================
   HERO SLIDER
   ========================================================= */
.hero-slider{position:relative; height:88vh; min-height:560px; overflow:hidden; background:var(--charcoal);}
.hero-slide{
  position:absolute; inset:0;
  opacity:0; visibility:hidden;
  transition:opacity 1.1s ease;
  background-size:cover; background-position:center;
}
.hero-slide.is-active{opacity:1; visibility:visible; z-index:1;}
.hero-slide::before{
  content:"";
  position:absolute; inset:0;
  background:rgba(8,10,13,.55);
  z-index:1;
}
.hero-slide .ken-burns{
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  animation:kenburns 9s ease-in-out infinite alternate;
  z-index:0;
}
@keyframes kenburns{from{transform:scale(1);} to{transform:scale(1.09);}}

.hero-content{
  position:relative; z-index:2;
  height:100%;
  display:flex; flex-direction:column; justify-content:center;
  color:var(--white);
  max-width:720px;
}
.hero-content .eyebrow{color:var(--safety);}
.hero-content h1{
  font-family:var(--font-body);
  font-style:italic;
  font-weight:600;
  font-size:clamp(2.5rem, 5.2vw, 4.4rem);
  line-height:1.08;
  margin:1rem 0 1.3rem;
  color:var(--white);
  letter-spacing:-.01em;
}
.hero-content p{font-size:1.1rem; color:rgba(255,255,255,.85); max-width:540px; margin-bottom:2rem;}

.hero-nav{
  position:absolute; bottom:2.2rem; right:2.2rem; z-index:3;
  display:flex; gap:.6rem;
}
.hero-nav button{
  width:46px; height:46px;
  border:1px solid rgba(255,255,255,.4);
  background:rgba(255,255,255,.08);
  color:var(--white);
  cursor:pointer;
  transition:.2s;
}
.hero-nav button:hover{background:var(--safety); border-color:var(--safety);}

/* =========================================================
   CARDS / GRIDS
   ========================================================= */
.stat-card{padding:2rem 1.2rem; border-right:1px solid var(--concrete-dark);}
.stat-card:last-child{border-right:none;}
.stat-card .num{font-family:var(--font-display); font-size:2.6rem; font-weight:700; color:var(--steel);}
.stat-card .lbl{font-size:.85rem; color:var(--slate); text-transform:uppercase; letter-spacing:.08em;}

/* ---------------- SERVICES ---------------- */
.service-card{
  background:var(--white);
  border:1px solid var(--concrete-dark);
  overflow:hidden;
  height:100%;
  position:relative;
  transition:transform .3s ease, box-shadow .3s ease;
  display:flex; flex-direction:column;
  border-radius: 2px;
}
.service-card:hover{transform:translateY(-6px); box-shadow:0 24px 50px rgba(27,31,35,.14); border-color:transparent;}
.service-card .sc-photo{position:relative; aspect-ratio:4/2.6; overflow:hidden;}
.service-card .sc-photo img{width:100%; height:290px; object-fit:cover; transition:transform .5s ease;}
.service-card:hover .sc-photo img{transform:scale(1.08);}
.service-card .sc-photo::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(15,17,20,0) 45%, rgba(15,17,20,.78) 100%);}
.service-card .num-badge{
  position:absolute; top:1rem; right:1rem; z-index:2;
  font-family:var(--font-display); font-size:.8rem; font-weight:700; color:var(--white);
  background:rgba(15,17,20,.4); backdrop-filter:blur(4px);
  width:30px; height:30px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
}
.service-card .icon-wrap{
  position:absolute; bottom:12px; left:1.8rem; z-index:2;
  width:52px; height:52px; border-radius:3px;
  background:var(--safety); color:var(--white);
  display:flex; align-items:center; justify-content:center;
  font-size:1.3rem;
  box-shadow:0 12px 26px rgba(0,63,114,.35);
  transition:background .3s ease;
}
.service-card:hover .icon-wrap{background:#e8b600;}
.service-card .sc-body{padding:2.3rem 1.8rem 1.8rem; flex:1; display:flex; flex-direction:column;}
.service-card h4{margin-bottom:.6rem;}
.service-card p{color:var(--slate); font-size:.94rem; margin-bottom:1.2rem; flex:1;}
.service-card .soon-tag{
  font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--steel);
  display:inline-flex; align-items:center; gap:.4rem;
}

/* ---------------- VISION / MISSION ---------------- */
.vm-section{
  position:relative;
  background:
    radial-gradient(900px 420px at 12% 0%, rgba(0,63,114,.07) 0%, rgba(0,63,114,0) 60%),
    radial-gradient(800px 420px at 100% 100%, rgba(184,150,60,.09) 0%, rgba(184,150,60,0) 55%),
    var(--concrete);
  overflow:hidden;
}
.vm-section::before{
  content:"";
  position:absolute; inset:0;
  background-image:var(--seam);
  opacity:.5;
  pointer-events:none;
}
.vm-section .container{position:relative;}
.vm-card{
  position:relative;
  background:var(--white);
  border-radius:10px;
  padding:2.6rem 2.2rem;
  height:100%;
  overflow:hidden;
  box-shadow:0 20px 44px rgba(27,31,35,.06);
  border:1px solid var(--concrete-dark);
  transition:transform .3s ease, box-shadow .3s ease;
}
.vm-card:hover{transform:translateY(-6px); box-shadow:0 30px 60px rgba(27,31,35,.12);}
.vm-card::before{
  content:"";
  position:absolute; top:0; left:0; right:0; height:5px;
}
.vm-card.vm-vision::before{background:linear-gradient(90deg, var(--yellow), var(--yellow-dark));}
.vm-card.vm-mission::before{background:linear-gradient(90deg, var(--safety), var(--safety-dark));}
.vm-card .vm-quote{
  position:absolute; right:1.4rem; top:1.2rem;
  font-family:var(--font-display); font-size:5.5rem; font-weight:700;
  color:var(--concrete); line-height:1; z-index:0; user-select:none;
}
.vm-card .vm-icon{
  width:58px; height:58px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:1.4rem;
  margin-bottom:1.4rem; position:relative; z-index:1;
}
.vm-card.vm-vision .vm-icon{background:linear-gradient(135deg, var(--yellow), var(--yellow-dark)); color:var(--charcoal);}
.vm-card.vm-mission .vm-icon{background:linear-gradient(135deg, var(--safety), var(--safety-dark)); color:var(--white);}
.vm-card h2{position:relative; z-index:1;}
.vm-card p{position:relative; z-index:1; color:var(--slate); font-size:1.05rem;}
.vm-card .vm-tagline{
  position:relative; z-index:1;
  font-weight:700; font-size:.82rem; letter-spacing:.06em; text-transform:uppercase;
  margin-bottom:.6rem; display:block;
}
.vm-card.vm-vision .vm-tagline{color:var(--yellow-dark);}
.vm-card.vm-mission .vm-tagline{color:var(--safety);}
.vm-card .vm-foot{
  position:relative; z-index:1;
  display:flex; gap:.5rem; margin-top:1.6rem; padding-top:1.4rem;
  border-top:1px dashed var(--concrete-dark);
}
.vm-card .vm-foot span{
  font-size:.72rem; font-weight:700; letter-spacing:.04em;
  padding:.3rem .7rem; border-radius:20px; background:var(--concrete); color:var(--slate);
}

/* ---------------- DIRECTOR'S DESK ---------------- */
.director-card{
  position:relative;
  background:var(--charcoal);
  border-radius:12px;
  overflow:hidden;
  padding:3rem 2.4rem;
  color:var(--concrete);
}
.director-card::before{
  content:"";
  position:absolute; inset:0;
  background-image:var(--seam);
  opacity:.5;
}
.director-card .dir-frame{
  position:relative;
  padding:10px;
}
.director-card .dir-frame::before{
  content:"";
  position:absolute; top:-10px; left:-10px; right:10px; bottom:10px;
  border:2px solid var(--safety);
  border-radius:6px;
  z-index:0;
}
.director-card .dir-frame img{position:relative; z-index:1; border-radius:4px;}
.director-card .dir-quote-icon{font-size:2.4rem; color:var(--safety); opacity:.85;}
.director-card blockquote{
  font-family:var(--font-display); font-size:1.35rem; font-weight:500; font-style:italic;
  color:var(--white); line-height:1.5; margin:1rem 0 1.6rem;
}
.director-card .dir-sign{
  display:flex; align-items:center; gap:1rem;
  border-top:1px solid rgba(255,255,255,.15);
  padding-top:1.2rem;
}
.director-card .dir-sign .dash{width:34px; height:2px; background:var(--safety);}

.focus-card{
  position:relative;
  overflow:hidden;
  background:var(--charcoal);
  color:var(--white);
  min-height:340px;
  padding:1.8rem;
  display:flex; flex-direction:column; justify-content:flex-end;
  text-decoration:none;
  border-radius: 3px;
}
.focus-card img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.55; transition:transform .5s ease, opacity .3s ease;}
.focus-card:hover img{transform:scale(1.07); opacity:.35;}
.focus-card .tag{font-size:.75rem; letter-spacing:.12em; text-transform:uppercase; color:#e8b600; font-weight:700; position:relative; z-index:2;}
.focus-card h4{position:relative; z-index:2; color:var(--white); margin:.4rem 0 0; border-radius: 2px; display:flex; align-items:center; justify-content:space-between; gap:.5rem;}
.focus-card h4 i{font-size:1rem; opacity:0; transform:translateX(-6px); transition:opacity .25s ease, transform .25s ease;}
.focus-card:hover h4 i{opacity:1; transform:translateX(0);}

.client-logo{
  background:var(--white);
  border:1px solid var(--concrete-dark);
  display:flex; align-items:center; justify-content:center;
  padding:1.4rem;
  height:110px;
  /* filter:grayscale(1); */
  opacity:.75;
  transition:.25s;
}
.client-logo:hover{filter:grayscale(0); opacity:1; border-color:var(--steel);}

/* client logo tooltip (clients.html grid) */
.client-logo-tt{position:relative;}
.client-logo-tt::after{
  content:attr(data-tooltip);
  position:absolute; left:50%; bottom:calc(100% + 10px); transform:translate(-50%,6px);
  background:var(--charcoal); color:var(--white);
  font-size:.76rem; font-weight:600; letter-spacing:.02em;
  padding:.45rem .8rem; border-radius:6px; white-space:nowrap;
  box-shadow:0 12px 26px rgba(27,31,35,.24);
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .2s ease, transform .2s ease;
  z-index:20;
}
.client-logo-tt::before{
  content:"";
  position:absolute; left:50%; bottom:calc(100% + 5px); transform:translate(-50%,6px);
  border:6px solid transparent; border-top-color:var(--charcoal);
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .2s ease, transform .2s ease;
  z-index:20;
}
.client-logo-tt:hover::after, .client-logo-tt:hover::before{opacity:1; visibility:visible; transform:translate(-50%,0);}

/* =========================================================
   HOMEPAGE LOGO SLIDER (auto-sliding, original brand color)
   ========================================================= */
.logo-slider-wrap{position:relative;}
.logo-nav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:38px; height:38px; border-radius:50%;
  background:var(--white); border:1px solid var(--concrete-dark);
  display:flex; align-items:center; justify-content:center;
  color:var(--charcoal); z-index:5; transition:.2s ease;
  box-shadow:0 8px 20px rgba(27,31,35,.1);
}
.logo-nav:hover{background:var(--safety); color:var(--white); border-color:var(--safety);}
.logo-nav.prev{left:.25rem;}
.logo-nav.next{right:.25rem;}
.logo-track.is-manual{animation-play-state:paused; transition:transform .5s cubic-bezier(.2,.8,.3,1);}
.logo-slider{
  position:relative;
  overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
          mask-image:linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
}
.logo-slider .logo-track{
  display:flex; align-items:center;
  width:max-content;
  animation:logoSlide 58s linear infinite;
}
.logo-slider:hover .logo-track{animation-play-state:paused;}
.logo-slider .slide-logo{
  flex:0 0 auto;
  width:200px; height:110px;
  background:var(--white);
  border:1px solid var(--concrete-dark);
  display:flex; align-items:center; justify-content:center;
  margin:0 .6rem;
  padding:1.4rem;
  transition:border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.logo-slider .slide-logo img{max-height:100%; width:auto; max-width:100%; object-fit:contain;}
.logo-slider .slide-logo:hover{border-color:var(--steel); transform:translateY(-3px); box-shadow:0 16px 30px rgba(27,31,35,.1);}
@keyframes logoSlide{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}
@media (max-width:575.98px){
  .logo-slider .slide-logo{width:150px; height:90px; padding:1rem;}
}

/* =========================================================
   ABOUT COLLAGE (image pair + floating stat badge)
   ========================================================= */
.about-collage{position:relative; padding:0 1.6rem 2.6rem 0; margin-left:1.6rem;}
.about-collage.no-badge{padding-right:0;}
.about-collage .ac-main{overflow:hidden; border-radius:4px;}
.about-collage .ac-main img{width:100%; display:block; aspect-ratio:5/4.3; object-fit:cover;}
.about-collage .ac-inset{
  position:absolute; left:-1.6rem; bottom:0; width:52%;
  border:7px solid var(--white); border-radius:4px; overflow:hidden;
  box-shadow:0 24px 48px rgba(27,31,35,.24);
}
.about-collage .ac-inset img{width:100%; display:block; aspect-ratio:4/3.1; object-fit:cover;}
.about-collage .ac-badge{
  position:absolute; top:1.8rem; right:0; z-index:2;
  background:var(--charcoal); color:var(--white);
  padding:1.1rem 1.5rem; border-radius:8px; text-align:center; min-width:118px;
  box-shadow:0 20px 40px rgba(27,31,35,.3);
}
.about-collage .ac-badge .ac-badge-num{font-family:var(--font-display); font-size:1.7rem; font-weight:700; color:var(--yellow); line-height:1;}
.about-collage .ac-badge .ac-badge-lbl{font-size:.66rem; text-transform:uppercase; letter-spacing:.07em; color:rgba(255,255,255,.72); margin-top:.35rem;}

.about-points{margin-top:.6rem;}
.about-point{padding-top:.3rem;}
.about-point i{font-size:1.3rem; color:var(--safety); margin-bottom:.55rem; display:block;}
.about-point h6{font-family:var(--font-display); font-weight:700; margin-bottom:.35rem; font-size:.96rem; color:var(--charcoal);}
.about-point p{font-size:.85rem; color:var(--slate); margin:0; line-height:1.5;}

@media (max-width:991.98px){
  .about-collage{margin-left:0; padding:0 0 2.4rem 0;}
  .about-collage .ac-inset{left:0;}
}

/* about page — inline credibility stats under the intro copy */
.about-stat-row{border-top:1px solid var(--concrete-dark); padding-top:1.4rem;}
.about-stat-row .asr-num{font-family:var(--font-display); font-weight:700; font-size:1.6rem; color:var(--charcoal); line-height:1;}
.about-stat-row .asr-lbl{font-size:.76rem; color:var(--slate); margin-top:.3rem; text-transform:uppercase; letter-spacing:.04em;}

/* about page — "Why Aashi" elevated value cards */
.value-card{
  background:var(--white);
  border-radius:10px;
  padding:1.9rem 1.6rem;
  height:100%;
  border:1px solid var(--concrete-dark);
  box-shadow:0 10px 24px rgba(27,31,35,.05);
  transition:transform .3s ease, box-shadow .3s ease;
}
.value-card:hover{transform:translateY(-5px); box-shadow:0 20px 40px rgba(27,31,35,.1);}
.value-card .vc-icon{
  width:50px; height:50px; border-radius:12px;
  background:var(--vc-color, var(--safety)); color:var(--white);
  display:flex; align-items:center; justify-content:center;
  font-size:1.25rem; margin-bottom:1.1rem;
}
.value-card h6{font-family:var(--font-display); font-weight:700; margin-bottom:.5rem; font-size:.98rem; color:var(--charcoal);}
.value-card p{font-size:.86rem; color:var(--slate); margin:0; line-height:1.55;}

/* =========================================================
   TEAM CARDS (homepage teaser + team.html)
   ========================================================= */
.team-card{
  background:var(--charcoal);
  overflow:hidden;
  position:relative;
  border:1px solid var(--concrete-dark);
  transition:transform .3s ease, box-shadow .3s ease;
  border-radius: 2px;
}
.team-card:hover{transform:translateY(-6px); box-shadow:0 22px 44px rgba(27,31,35,.16);}
.team-card .tc-photo{
  position:relative; 
  /* aspect-ratio:4/4.3;  */
  overflow:hidden; background:var(--charcoal-soft);
  display:flex; align-items:center; justify-content:center;
}
.team-card .tc-photo img{width:100%; height:100%; object-fit:contain; object-position:center;}
.team-card .tc-index{
  position:absolute; top:.7rem; right:.9rem; z-index:2;
  font-family:var(--font-creative); font-style:italic; font-size:2.4rem; font-weight:600;
  color:rgba(255,255,255,.75);
  text-shadow:0 2px 12px rgba(0,0,0,.55);
  line-height:1;
}
.team-card .tc-dept{
  position:absolute; top:1rem; left:1rem; z-index:2;
  background:rgba(255,255,255,.95); color:var(--charcoal);
  font-size:.64rem; text-transform:uppercase; letter-spacing:.07em; font-weight:700;
  padding:.35rem .7rem .35rem .55rem; border-radius:20px;
  display:inline-flex; align-items:center; gap:.4rem;
}
.team-card .tc-dept::before{content:""; width:6px; height:6px; border-radius:50%; background:var(--dept-color, var(--safety)); flex:0 0 auto;}
.team-card .tc-body{
  position:relative; z-index:2;
  padding:1.15rem 1.3rem 1.4rem;
  border-top:3px solid var(--dept-color, var(--safety));
}
.team-card .tc-name{font-family:var(--font-display); font-weight:700; font-size:1.05rem; color:var(--white); margin:0; line-height:1.28; padding-right:2.2rem;}
.team-card .tc-role{color:rgba(255,255,255,.68); font-weight:600; font-size:.75rem; margin-top:.35rem; text-transform:uppercase; letter-spacing:.05em;}
.team-card .tc-social{
  position:absolute; top:1.15rem; right:1.3rem; z-index:2;
  width:32px; height:32px; border-radius:50%;
  background:var(--dept-color, var(--safety)); color:var(--white);
  display:flex; align-items:center; justify-content:center;
  font-size:.82rem;
  opacity:0; transform:translateY(-6px) scale(.85);
  transition:opacity .3s ease, transform .3s ease;
}
.team-card:hover .tc-social{opacity:1; transform:translateY(0) scale(1);}

/* project cards */
.project-card{
  cursor:pointer;
  border:1px solid var(--concrete-dark);
  transition:box-shadow .25s ease, transform .25s ease;
  background:var(--white);
}
.project-card:hover{box-shadow:0 22px 44px rgba(27,31,35,.14); transform:translateY(-4px);}
.project-card .thumb{position:relative; overflow:hidden; aspect-ratio:4/3;}
.project-card .thumb img{width:100%; height:100%; object-fit:cover; transition:transform .5s ease;}
.project-card:hover .thumb img{transform:scale(1.06);}
.project-card .thumb .type-badge{
  position:absolute; top:.9rem; left:.9rem;
  background:var(--safety); color:var(--white);
  font-size:.7rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  padding:.3rem .7rem;
}
.project-card .body{padding:1.2rem 1.3rem 1.4rem;}
.project-card .body h5{margin:0 0 .3rem; font-size:1.08rem;}
.project-card .body .loc{color:var(--slate); font-size:.86rem; display:flex; align-items:center; gap:.4rem;}

.filter-bar{display:flex; flex-wrap:wrap; gap:.6rem;}
.filter-bar button{
  border:1px solid var(--concrete-dark);
  background:var(--white);
  padding:.55rem 1.2rem;
  font-size:.85rem; font-weight:600;
  cursor:pointer; transition:.2s;
}
.filter-bar button.is-active, .filter-bar button:hover{background:var(--charcoal); color:var(--white); border-color:var(--charcoal);}

/* =========================================================
   PROJECT MODAL
   ========================================================= */
.aashi-modal-overlay{
  position:fixed; inset:0; background:rgba(27,31,35,.72);
  display:none; align-items:center; justify-content:center;
  z-index:1300; padding:1.5rem;
}
.aashi-modal-overlay.is-open{display:flex;}
.aashi-modal{
  background:var(--white);
  max-width:960px; width:100%;
  max-height:88vh; overflow-y:auto;
  position:relative;
  scroll-behavior:smooth;
  scrollbar-width:thin;
  scrollbar-color:var(--steel) var(--concrete);
}
.aashi-modal::-webkit-scrollbar{width:8px;}
.aashi-modal::-webkit-scrollbar-track{background:var(--concrete);}
.aashi-modal::-webkit-scrollbar-thumb{background:var(--steel); border-radius:10px;}
.aashi-modal::-webkit-scrollbar-thumb:hover{background:var(--steel-dark);}
.aashi-modal .modal-close{
  position:absolute; top:1rem; right:1rem; z-index:5;
  width:40px; height:40px; border:none; background:var(--charcoal); color:var(--white); cursor:pointer;
}
.aashi-modal .modal-img{width:100%; aspect-ratio:16/9; object-fit:cover;}
.aashi-modal .modal-body{padding:2rem;}
.aashi-modal .modal-body .meta{display:flex; flex-wrap:wrap; gap:1.6rem; margin:1rem 0 1.6rem; padding:1.2rem 0; border-top:1px solid var(--concrete-dark); border-bottom:1px solid var(--concrete-dark);}
.aashi-modal .modal-body .meta div .k{font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; color:var(--slate);}
.aashi-modal .modal-body .meta div .v{font-weight:700; font-family:var(--font-display);}

/* =========================================================
   FORMS
   ========================================================= */
.contact-form-card{
  background:var(--white);
  border:1px solid var(--concrete-dark);
  border-radius:14px;
  padding:2.4rem;
  box-shadow:0 24px 54px rgba(27,31,35,.07);
}
.form-control-aashi{
  border:1.5px solid var(--concrete-dark);
  border-radius:2px;
  background:var(--white);
  padding:.85rem 1rem;
  font-family:var(--font-body);
  transition:border-color .2s ease, box-shadow .2s ease;
}
.form-control-aashi:focus{
  outline:none;
  border-color:var(--safety);
  box-shadow:0 0 0 4px rgba(242,101,34,.12);
}
.form-floating-aashi label{color:var(--slate); padding:.85rem 1rem;}
.form-floating-aashi > .form-control-aashi:focus ~ label,
.form-floating-aashi > .form-control-aashi:not(:placeholder-shown) ~ label{
  color:var(--safety-dark);
}

.contact-info-card{
  display:flex; gap:1rem;
  padding:1.2rem;
  border:1.5px solid var(--concrete-dark);
  border-radius:2px;
  margin-bottom:1rem;
  transition:border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.contact-info-card:hover{border-color:var(--safety); transform:translateX(4px); box-shadow:0 14px 30px rgba(27,31,35,.06);}
.contact-info-card .ci-icon{
  width:46px; height:46px; flex:0 0 auto; border-radius:10px;
  background:var(--concrete);
  color:var(--safety);
  display:flex; align-items:center; justify-content:center;
  font-size:1.15rem;
}
.contact-info-card .ci-label{font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; color:var(--slate); font-weight:700; margin-bottom:.2rem;}

/* mid-page CTA — distinct from footer CTA band */
.cta-split{
  position:relative;
  background:linear-gradient(120deg, var(--charcoal) 0%, var(--charcoal-soft) 70%);
  overflow:hidden;
  padding:5rem 0;
}
.cta-split::before{
  content:"";
  position:absolute; inset:0;
  background-image:var(--seam);
  opacity:.4;
}
.cta-split .cta-icon-badge{
  width:76px; height:76px; border-radius:50%;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.22);
  display:flex; align-items:center; justify-content:center;
  font-size:1.9rem; color:#d62828;
  margin:0 auto 1.4rem;
}
.cta-split h2{color:var(--white); margin-bottom:.6rem;}
.cta-split p{color:rgba(255,255,255,.72); max-width:520px; margin:0 auto 2rem;}
.cta-split .cta-shape{
  position:absolute; top:-60px; right:-60px; width:280px; height:280px;
  border:1px solid rgba(255,255,255,.12); border-radius:50%;
}
.cta-split .cta-shape.s2{
  top:auto; bottom:-100px; left:-100px; right:auto; width:220px; height:220px;
  border-color:rgba(255,222,33,.15);
}

/* photo-backed CTA variant — used once, on About page */
.cta-photo{
  position:relative;
  background-image:linear-gradient(180deg, rgba(27,31,35,.55) 0%, rgba(27,31,35,.86) 100%), url('https://images.unsplash.com/photo-1479839672679-a46483c0e7c8?w=1600&h=800&fit=crop&auto=format&q=80');
  background-size:cover; background-position:center;
  padding:6rem 0;
  text-align:center;
}
.cta-photo h2{color:var(--white); margin-bottom:.6rem;}
.cta-photo p{color:rgba(255,255,255,.8); max-width:540px; margin:0 auto 2.2rem;}
.cta-photo .cta-icon-badge{
  width:76px; height:76px; border-radius:50%;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.28);
  display:flex; align-items:center; justify-content:center;
  font-size:1.9rem; color:var(--yellow);
  margin:0 auto 1.4rem;
}
.cta-photo .mini-stats{
  display:flex; justify-content:center; gap:2.4rem; margin-top:2.6rem; flex-wrap:wrap;
}
.cta-photo .mini-stats div{text-align:center;}
.cta-photo .mini-stats .n{font-family:var(--font-display); font-size:1.8rem; font-weight:700; color:var(--yellow);}
.cta-photo .mini-stats .l{font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; color:rgba(255,255,255,.7);}
footer.site-footer{
  position:relative;
  background:linear-gradient(180deg, #0F1113 0%, #15181B 55%, #1A1D21 100%);
  color:rgba(236,233,226,.68);
  padding:0px 0px 0px 0px;
  overflow:hidden;
}
footer.site-footer::before{
  content:"";
  position:absolute; inset:0;
  background-image:
    repeating-linear-gradient(90deg, rgba(255,255,255,.045) 0, rgba(255,255,255,.045) 1px, transparent 1px, transparent 64px),
    repeating-linear-gradient(0deg, rgba(255,255,255,.045) 0, rgba(255,255,255,.045) 1px, transparent 1px, transparent 64px);
  opacity:.6;
  pointer-events:none;
  z-index:0;
}
footer.site-footer::after{
  content:"";
  position:absolute; top:0; left:0; right:0; height:2px;
  background:#d62828;
  opacity:.9;
  z-index:0;
}

/* CTA band stitched into the top of the footer */
.footer-cta{
  position:relative;
  border-bottom:1px solid rgba(255,255,255,.1);
  padding:3.6rem 0;
}
.footer-cta .row{align-items:center;}
.footer-cta h3{color:var(--white); margin:0 0 .3rem;}
.footer-cta p{color:rgba(236,233,226,.65); margin:0;}

.footer-main{position:relative; padding:4.5rem 0 2.5rem;}
footer.site-footer h6{
  font-family:var(--font-creative); font-style:italic; font-weight:600;
  color:var(--white); letter-spacing:.01em; font-size:1.15rem;
  margin-bottom:1.4rem; display:flex; align-items:center; gap:.5rem;
}
footer.site-footer h6 i{color:var(--steel); font-style:normal; font-size:.85rem;}
footer.site-footer a{color:#fff; transition:color .2s ease, padding-left .2s ease;}
footer.site-footer a:hover{color:#fff;}

.footer-brand-name{
  font-family:var(--font-creative); font-style:italic; font-weight:600;
  font-size:1.3rem; color:var(--white); margin-left:.6rem;
}
.footer-brand-name span{color:var(--yellow);}
.footer-brand-row{display:flex; align-items:center;}
.footer-brand-mark{
  width:42px; height:42px; border-radius:50%;
  background:var(--white);
  display:flex; align-items:center; justify-content:center;
  flex:0 0 auto; overflow:hidden;
}
.footer-brand-mark img{width:22px; height:auto;}

.footer-links{list-style:none; margin:0; padding:0; font-size: 14.08px;}
.footer-links li{margin-bottom:.75rem;}
.footer-links a{display:flex; align-items:center; gap:.5rem;}
.footer-links a i{font-size:.65rem; color:var(--steel);}

.footer-contact-item{display:flex; gap:.8rem; margin-bottom:1rem;}
.footer-contact-item i{
  width:32px; height:32px; flex:0 0 auto;
  border:1px solid rgba(255,255,255,.18);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:.8rem;
  color:var(--steel);
}

.footer-sectors{display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.4rem;}
.footer-sectors span{
  border:1px solid rgba(255,255,255,.18);
  padding:.35rem .8rem; font-size:.78rem; border-radius:2px; color:rgba(236,233,226,.75);
}

footer.site-footer .foot-bottom{
  position:relative;
  border-top:1px solid rgba(255,255,255,.1);
  padding-top:1.6rem; font-size:.82rem;
  display:flex; align-items:center;
}

.social-dot{
  width:40px; height:40px; border:1px solid rgba(255,255,255,.2);
  display:inline-flex; align-items:center; justify-content:center; margin-right:.6rem;
  border-radius:3px;
  color:rgba(236,233,226,.75);
  transition:all .25s ease;
}
.social-dot:hover{border-color:var(--steel); background:var(--steel); color:var(--charcoal); transform:translateY(-3px);}

.back-to-top-inline{
  width:38px; height:38px; border-radius:50%;
  background:transparent; border:1px solid rgba(255,255,255,.2);
  color:var(--steel);
  display:flex; align-items:center; justify-content:center;
  transition:all .25s ease;
  margin-left:auto;
  display: none;
}
.back-to-top-inline:hover{background:var(--safety); border-color:var(--safety); color:var(--white); transform:translateY(-3px);}

.back-to-top{
  position:fixed; right:1.4rem; bottom:1.4rem; z-index:900;
  width:46px; height:46px; border-radius:50%;
  background:var(--safety); color:var(--white);
  display:flex; align-items:center; justify-content:center;
  border:none;
   /* box-shadow:0 12px 26px rgba(232,93,47,.35); */
  opacity:0; visibility:hidden; transform:translateY(10px);
  transition:.25s ease;
}
.back-to-top.is-visible{opacity:1; visibility:visible; transform:translateY(0);}
.back-to-top:hover{background:#d62828;}

/* =========================================================
   RESPONSIVE
   ========================================================= */
.nav-right-actions{display:flex; align-items:center; gap:.6rem;}
@media (max-width: 991.98px){
  .nav-links{display:none;}
  .hamburger{display:flex;}
  .nav-cta-wrap .nav-cta{
    padding:.5rem .8rem .5rem .6rem !important;
    font-size:.72rem;
    gap:.4rem;
  }
  .nav-cta-wrap .nav-cta .cta-ic{width:20px; height:20px; font-size:.62rem;}
  .stat-card{border-right:none; border-bottom:1px solid var(--concrete-dark);}
  .hero-content{max-width:100%;}
}
@media (max-width: 400px){
  .nav-cta-wrap .nav-cta{padding:.5rem .55rem !important; font-size:0; gap:0;}
  .nav-cta-wrap .nav-cta .cta-ic{font-size:.75rem;}
}
@media (max-width: 575.98px){
  .section{padding:3.6rem 0;}
  .hero-slider{height:82vh;}
}

.breadcrumb-trail{
  display:flex; align-items:center; flex-wrap:wrap; gap:.5rem;
  font-size:.8rem; font-weight:600;
  letter-spacing:.02em;
  margin-bottom:1.4rem;
}
.breadcrumb-trail a{
  display:inline-flex; align-items:center; gap:.4rem;
  color:rgba(255,255,255,.62);
  transition:color .2s ease;
}
.breadcrumb-trail a:hover{color:var(--yellow);}
.breadcrumb-trail .sep{font-size:.6rem; color:rgba(255,255,255,.3);}
.breadcrumb-trail .current{color:var(--yellow);}

/* placeholder banner used until real assets are uploaded */
.asset-note{
  background:#FFF6E9; border:1px dashed #E0A84C; color:#7A5210;
  font-size:.8rem; padding:.5rem .8rem; text-align:center;
}
.text-aasi{color: #d62828 !important;}