
/* About TSI page */
.about-hero{
  min-height:690px;
  padding:180px 0 90px;
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(90deg,rgba(5,12,18,.97) 0%,rgba(5,12,18,.84) 38%,rgba(5,12,18,.30) 63%,rgba(5,12,18,.16) 100%),
    url('/assets/about/hero-city-ai.jpg') center right/cover no-repeat;
}
.about-hero-overlay{
  position:absolute;inset:0;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:70px 70px;
  opacity:.22;
}
.about-hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,680px) 1fr}
.about-hero h1{font-size:clamp(58px,6.5vw,100px);line-height:.91;letter-spacing:-.055em;margin:12px 0 28px}
.about-hero h1 span{color:var(--green3)}
.about-hero p{max-width:650px;color:#c7c7c7;font-size:19px;line-height:1.6}

.about-intro{max-width:780px}
.about-cap-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:#ddd;margin-top:48px}
.about-cap-grid article{background:#fff;padding:30px 24px;min-height:280px;text-align:center}
.about-icon{width:68px;height:68px;margin:0 auto 24px;border:1px solid var(--green3);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--green3);font-weight:800;font-size:22px}
.about-cap-grid h3{font-size:17px;text-transform:uppercase;letter-spacing:.03em;margin-bottom:14px}
.about-cap-grid p{font-size:14px;line-height:1.55}

.about-presence{background:#06100b}
.presence-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:5vw;align-items:start}
.presence-copy p{color:#9eaaa3}
.presence-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.presence-card{background:#0a1510;border:1px solid rgba(255,255,255,.12);overflow:hidden}
.presence-card img{width:100%;aspect-ratio:16/10;object-fit:cover}
.presence-card div{padding:20px}
.presence-card h3{text-transform:uppercase;color:#fff;margin:0 0 10px}
.presence-card p{font-size:14px;color:#9eaaa3;margin:0}

.trust-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px}
.trust-block,.cert-block{min-height:470px}
.check-list,.cert-list{list-style:none;padding:0;margin:34px 0 0}
.check-list li{position:relative;padding:12px 0 12px 34px;border-bottom:1px solid #ddd;font-size:15px}
.check-list li:before{content:"✓";position:absolute;left:0;top:11px;width:20px;height:20px;border:1px solid var(--green3);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--green3);font-size:12px;font-weight:800}
.cert-block{display:grid;grid-template-columns:1fr 230px;gap:24px;align-items:center}
.cert-list li{display:grid;grid-template-columns:1fr auto;gap:18px;padding:13px 0;border-bottom:1px solid #ddd}
.cert-list li span{color:#666}
.cert-shield{width:100%;max-width:230px;justify-self:end}

.about-offices{background:#06100b}
.office-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:44px}
.office-card{background:#0a1510;border:1px solid rgba(255,255,255,.12);overflow:hidden}
.office-card img{width:100%;aspect-ratio:16/6;object-fit:cover}
.office-card div{padding:26px}
.office-card h3{color:var(--green3);text-transform:uppercase;margin:0 0 16px}
.office-card p{font-size:15px;color:#b8c2bc}

@media(max-width:1050px){
  .about-cap-grid{grid-template-columns:1fr 1fr}
  .presence-layout,.trust-grid{grid-template-columns:1fr}
  .presence-cards{grid-template-columns:1fr 1fr 1fr}
}
@media(max-width:760px){
  .about-hero{min-height:auto;background-position:62% center}
  .about-hero-grid{grid-template-columns:1fr}
  .about-cap-grid,.presence-cards,.office-grid{grid-template-columns:1fr}
  .cert-block{grid-template-columns:1fr}
  .cert-shield{justify-self:start;max-width:180px}
}

/* Dark green About TSI theme refinements */
.about-hero{
  background:
    linear-gradient(90deg,rgba(3,8,5,.97) 0%,rgba(3,8,5,.86) 36%,rgba(5,15,10,.34) 66%,rgba(5,15,10,.14) 100%),
    url('/assets/about/hero-city-ai.jpg') center center/cover no-repeat;
}
.about-hero h1 span{color:var(--green2)}
.about-icon{border-color:var(--green3);color:var(--green3)}
.about-presence,.about-offices{background:#06100b}
.presence-card,.office-card{background:#0a1510;border-color:rgba(120,173,145,.16)}
.presence-card h3,.office-card h3{color:var(--green2)}
.check-list li:before{border-color:var(--green3);color:var(--green3)}


/* ==============================================================
   ABOUT PAGE — MULTI-REGION + WORLD MAP CONTACT SECTION
   ============================================================== */

.about-presence .container{
  width:min(1440px,calc(100% - 72px));
  margin:0 auto;
}

.presence-layout{
  display:grid;
  grid-template-columns:340px minmax(0,1fr);
  gap:52px;
  align-items:start;
}

.presence-copy h2{
  font-size:clamp(44px,3.8vw,68px);
  line-height:.94;
  max-width:340px;
}

.presence-copy p{
  max-width:320px;
}

.presence-cards{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  align-items:stretch;
}

.presence-card{
  height:100%;
  display:flex;
  flex-direction:column;
  min-width:0;
}

.presence-card img{
  width:100%;
  height:190px;
  object-fit:cover;
  display:block;
}

.presence-card > div{
  flex:1;
  padding:22px;
}

.presence-card h3{
  color:var(--green2,#78ad91);
}

.presence-card p{
  margin:0;
}

/* Local Presence / Regional Strength */
.about-offices{
  background:#06100b;
}

.offices-map-layout{
  width:min(1440px,calc(100% - 72px));
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,.72fr) minmax(520px,1.28fr);
  gap:68px;
  align-items:center;
}

.offices-map-copy{
  max-width:590px;
}

.offices-map-copy h2{
  margin:16px 0 24px;
  font-size:clamp(52px,5vw,84px);
  line-height:.94;
  letter-spacing:-.045em;
}

.offices-map-copy p{
  max-width:560px;
  margin:0 0 30px;
  color:#9aa69f;
  font-size:18px;
  line-height:1.65;
}

.offices-map-visual{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}

.offices-map-visual img{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
  filter:drop-shadow(0 24px 46px rgba(0,0,0,.25));
}

@media(max-width:1100px){
  .presence-layout{
    grid-template-columns:1fr;
  }

  .presence-copy h2,
  .presence-copy p{
    max-width:none;
  }

  .presence-cards{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .offices-map-layout{
    grid-template-columns:1fr;
    gap:40px;
  }

  .offices-map-copy{
    max-width:700px;
  }
}

@media(max-width:800px){
  .about-presence .container,
  .offices-map-layout{
    width:min(100% - 36px,1440px);
  }

  .presence-cards{
    grid-template-columns:1fr;
  }

  .presence-card img{
    height:220px;
  }
}
