.connect-hero{
  min-height:720px;
  padding:165px 0 90px;
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
  background:
    radial-gradient(circle at 78% 42%,rgba(28,118,85,.22),transparent 31%),
    linear-gradient(118deg,#030705 0%,#07100b 56%,#09170f 100%);
}
.connect-gridfx{
  position:absolute;
  inset:0;
  opacity:.18;
  background-image:
    linear-gradient(rgba(120,173,145,.13) 1px,transparent 1px),
    linear-gradient(90deg,rgba(120,173,145,.13) 1px,transparent 1px);
  background-size:72px 72px;
}
.connect-hero-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:70px;
  align-items:center;
}
.connect-hero h1{
  font-size:clamp(68px,7.5vw,118px);
  line-height:.86;
  letter-spacing:-.06em;
  margin:12px 0 26px;
}
.connect-hero-copy{
  max-width:720px;
  font-size:18px;
  line-height:1.7;
  color:#aeb9b2;
}
.connect-hero-copy.secondary{
  color:#7f8c84;
}
.connect-hero-flow{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
}
.flow-node{
  width:170px;
  min-height:180px;
  padding:24px 18px;
  border:1px solid rgba(120,173,145,.16);
  background:#08110d;
  display:flex;
  flex-direction:column;
  justify-content:center;
  text-align:center;
}
.flow-node span{
  font-size:9px;
  color:#72ad90;
  font-weight:800;
  letter-spacing:.14em;
}
.flow-node strong{
  margin:10px 0;
  font-size:19px;
}
.flow-node small{
  color:#849189;
  line-height:1.5;
}
.flow-node.core{
  background:linear-gradient(145deg,#0b1c14,#08110d);
  border-color:#1c7655;
}
.flow-arrow{
  color:#3f9a72;
  font-size:24px;
}

.connect-intro{
  max-width:950px;
  font-size:18px;
  line-height:1.7;
}
.connect-intro.dark{color:#9da9a1;}

.connect-deploy-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin-top:42px;
}
.connect-deploy-grid article{
  padding:28px;
  min-height:260px;
  background:#f4f6f4;
  border:1px solid #d9dfdb;
}
.connect-deploy-grid article>span{
  color:#1c7655;
  font-size:10px;
  font-weight:800;
}
.connect-deploy-grid h3{
  margin:38px 0 14px;
  text-transform:uppercase;
  font-size:20px;
}
.connect-deploy-grid p{
  font-size:14px;
  line-height:1.62;
}

.connect-suite{
  background:#030806;
}
.connect-products-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px;
  margin-top:42px;
}
.connect-product-card{
  min-height:355px;
  padding:28px 24px;
  border:1px solid rgba(120,173,145,.15);
  background:#09140f;
  display:flex;
  flex-direction:column;
}
.connect-product-card small{
  color:#72ad90;
  font-size:9px;
  font-weight:800;
  letter-spacing:.12em;
}
.connect-product-card h3{
  margin:44px 0 16px;
  font-size:25px;
}
.connect-product-card p{
  color:#99a69e;
  font-size:14px;
  line-height:1.6;
  flex:1;
}
.connect-product-card a{
  color:#3f9a72;
  font-weight:800;
  text-decoration:none;
  margin-top:22px;
}
.connect-product-card a:hover{color:#72ad90;}

.connect-data-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px;
  align-items:center;
}
.connect-data-grid p{
  font-size:17px;
  line-height:1.7;
}
.connect-data-stack{
  padding:30px;
  background:#f4f6f4;
  border:1px solid #d9dfdb;
}
.connect-data-stack>div{
  padding:20px;
  background:#fff;
  border:1px solid #d9dfdb;
}
.connect-data-stack span{
  display:block;
  color:#1c7655;
  font-size:9px;
  font-weight:800;
  letter-spacing:.12em;
}
.connect-data-stack strong{
  display:block;
  font-size:21px;
  margin:8px 0;
}
.connect-data-stack small{
  color:#7a877f;
}
.connect-data-stack i{
  display:block;
  text-align:center;
  font-style:normal;
  font-size:24px;
  color:#1c7655;
  padding:8px;
}

.connect-nawah{
  background:
    radial-gradient(circle at 78% 50%,rgba(28,118,85,.22),transparent 34%),
    #030806;
}
.connect-nawah-inner{
  max-width:1000px;
  text-align:center;
}
.connect-nawah-inner h2{
  font-size:clamp(44px,5vw,76px);
}
.connect-nawah-inner p{
  max-width:820px;
  margin:0 auto 28px;
  font-size:18px;
  line-height:1.7;
  color:#a7b2ab;
}
.connect-actions{
  display:flex;
  gap:22px;
  justify-content:center;
  align-items:center;
}
.connect-actions .text-link{
  color:#72ad90;
  text-decoration:none;
  font-weight:800;
}

@media(max-width:1150px){
  .connect-hero-grid,.connect-data-grid{grid-template-columns:1fr;}
  .connect-products-grid{grid-template-columns:repeat(3,1fr);}
}
@media(max-width:850px){
  .connect-deploy-grid{grid-template-columns:repeat(2,1fr);}
  .connect-products-grid{grid-template-columns:repeat(2,1fr);}
  .connect-hero-flow{flex-wrap:wrap;}
}
@media(max-width:600px){
  .connect-deploy-grid,.connect-products-grid{grid-template-columns:1fr;}
  .connect-actions{flex-direction:column;}
}

/* Final infographic assets */
.connect-hero-infographic{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:470px;
}
.connect-hero-infographic img{
  display:block;
  width:100%;
  max-width:900px;
  height:auto;
  object-fit:contain;
  filter:drop-shadow(0 30px 50px rgba(0,0,0,.35));
}

.connect-data-visual{
  display:flex;
  align-items:center;
  justify-content:center;
}
.connect-data-visual img{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
  border:1px solid #d9dfdb;
  box-shadow:0 18px 40px rgba(0,0,0,.08);
}

@media(max-width:1150px){
  .connect-hero-infographic{min-height:auto}
}
