:root {
  --brand-navy: #0e1a3c;
  --brand-navy-dark: #08122b;
  --brand-blue: #1457e0;
  --brand-cyan: #00b8d9;
  --brand-cyan-soft: #e6f8fb;
  --brand-violet: #6c5dd3;
  --brand-amber: #f5a623;
  --brand-crimson: #ff5a4d;
  --brand-green: #10b981;
  --ink: #0e1a3c;
  --ink-2: #4a5578;
  --ink-mute: #8895b3;
  --bg: #ffffff;
  --bg-soft: #f6f8fc;
  --bg-soft-2: #eef2f8;
  --line: #e3e9f2;
  --shadow-sm: 0 2px 8px rgba(14, 26, 60, 0.06);
  --shadow: 0 10px 30px rgba(14, 26, 60, 0.08);
  --shadow-lg: 0 25px 60px -20px rgba(14, 26, 60, 0.18);
  --font: "Barlow", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font);
  color: var(--ink);
  background: var(--bg);
  font-weight: 400;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
img, svg { display: block; max-width: 100%; }
.wrap { max-width: 1320px; margin: 0 auto; padding: 0 28px; }
@media (max-width: 640px) { .wrap { padding: 0 18px; } }

h1, h2, h3, h4, h5 { color: var(--brand-navy); font-weight: 700; letter-spacing: -0.01em; line-height: 1.2; }
p { color: #202020; }
a { color: inherit; text-decoration: none; }

.pill {
  display: inline-block;
  padding: 4px 14px;
  background: var(--brand-cyan-soft);
  color: #0c101c;
  font-size: 11px;
  font-weight: 700;
  border-radius: 50px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.pill.violet { background: #f0eefb; color: var(--brand-violet); }
.pill.blue { background: #e8efff; color: var(--brand-blue); }
.pill.amber { background: #fff4e0; color: var(--brand-amber); }
.pill.green { background: #e8f7f1; color: var(--brand-green); }

/* ========== Top bar ========== */
.topbar { background: var(--brand-navy); color: #c8d0e3; font-size: 13px; padding: 8px 0; }
.topbar-inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; }
.topbar a { color: #c8d0e3; }
.topbar a:hover { color: #fff; }
.topbar-info { display: flex; gap: 22px; flex-wrap: wrap; }
.topbar-info span svg { display: inline-block; vertical-align: middle; margin-right: 6px; }

/* ========== Header / nav ========== */
header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
}
.nav-inner { display: flex; align-items: center; justify-content: space-between; height: 78px; }
.brand { display: flex; align-items: center; }
.brand-logo { height: 55px; width: auto; display: block; }
footer .brand-logo { height: 48px; }
@media (max-width: 640px) {
  .brand-logo { height: 38px; }
}
/* (obsolete .brand-mark rules removed — logo is now an <img>) */

.nav-menu { display: flex; gap: 6px; align-items: center; list-style: none; }
.nav-menu > li { position: relative; }
.nav-menu > li > a, .nav-menu > li > .nav-link {
  padding: 10px 16px; color: var(--brand-navy); font-size: 15px; font-weight: 500;
  cursor: pointer; display: inline-flex; align-items: center; gap: 6px; transition: all 0.2s;
}
.nav-menu > li:hover > a, .nav-menu > li:hover > .nav-link,
.nav-menu > li.active > a, .nav-menu > li.active > .nav-link { color: var(--brand-blue); }
.caret { width: 10px; height: 10px; opacity: 0.6; }
.submenu {
  position: absolute; top: calc(100% + 8px); left: 0;
  background: white; border: 1px solid var(--line); border-radius: 12px;
  padding:8px; min-width: 290px; box-shadow: var(--shadow-lg);
  opacity: 0; visibility: hidden; transform: translateY(8px);
  transition: all 0.25s; list-style: none; z-index: 120;
}
.nav-menu > li:hover > .submenu { opacity: 1; visibility: visible; transform: translateY(0); }
.submenu li a {
  display: flex; align-items: center; gap: 10px; font-weight:500;
  padding: 6px 12px; border-radius: 8px; font-size: 15px;
  color: var(--ink); transition: background 0.15s;
}
    
.submenu li a img {
    width: 26px;
    transition: filter 0.15s;
}

.submenu li a:hover img {
    filter: brightness(0) saturate(100%)
            invert(32%) sepia(93%)
            saturate(2298%)
            hue-rotate(215deg)
            brightness(95%)
            contrast(95%);
}

.submenu li a:hover { background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan)); color:#ffffff; }
.submenu li a .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--brand-cyan); flex-shrink: 0; }
.submenu li a.new::after, .submenu li a.featured::after {
  content: "NEW"; background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan));
  color: white; font-size: 9px; font-weight: 700; padding: 2px 6px; border-radius: 4px;
  margin-left: auto; letter-spacing: 0.05em;
}
.submenu li a.featured::after { content: "★"; background: var(--brand-amber); }

.cta-btn {
  background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan));
  color: white !important; padding: 12px 24px !important; border-radius: 50px;
  font-weight: 600 !important; transition: transform 0.2s, box-shadow 0.2s;
  box-shadow: 0 8px 20px rgba(20, 87, 224, 0.3);
}
.cta-btn:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(20, 87, 224, 0.4); }

.mobile-toggle { display: none; background: none; border: none; cursor: pointer; padding: 8px; }
@media (max-width: 1180px) {
  .nav-menu { display: none; }
  .mobile-toggle { display: block; color: var(--brand-navy); }
}

/* ========== accordian why secneural ========== */
.section-why{
    padding:80px 20px;
    background:
    radial-gradient(circle at top right,#32235e 0%,transparent 25%),
    linear-gradient(135deg,#071122,#02081d);
}

.container{
    max-width:1300px;
    margin:auto;
}

.top-content{
    display:flex;
    justify-content:space-between;
    gap:40px;
    margin-bottom:50px;
}

.left-heading{
    max-width:700px;
}

.small-title{
    font-size:14px;
    color:#ffffff;
    margin-bottom:15px;
}
.left-heading .main-title{
    font-size:32px;
    line-height:1.2;
    font-weight:700;
	color:#ffffff;
}

.main-title span{    
  background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.right-text{
    max-width:500px;
    color:#D9D9D9;
    line-height:1.4;
}

.content-wrapper{
    display:flex;
    gap:40px;
    align-items:flex-start;
}

.image-area{
    flex:0 0 45%;
    position:relative;
}

.image-box{
    position:relative;
    border:1px solid rgba(255,255,255,0.1);
    border-radius:25px;
    overflow:hidden;
    min-height:500px;
}

.image-box img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    opacity:0;
    visibility:hidden;
    transition:all .5s ease;
    transform:scale(1.05);
}

.image-box img.active{
    opacity:1;
    visibility:visible;
    transform:scale(1);
}

.accordion{
    flex:1;
}

.accordion-item{
    border-bottom:1px solid rgba(255,255,255,.15);
    padding:10px 0;
    cursor:pointer;
}

.accordion-item.active .accordion-header h3{
    color:#fff; font-weight:500; 
}

.accordion-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
}

.accordion-header h3{
    font-size:24px;
    font-weight:400; 
	color:#DBDBDB;
}

.accordion-header .icon{
    font-size:30px;
    transition:.3s; color:#ffffff;
}

.accordion-item.active .icon{
    transform:rotate(45deg);
}

.accordion-content{
    max-height:0;
    overflow:hidden;
          opacity:0;
    transition:
        max-height 0.6s ease,
        opacity 0.4s ease;
}

.accordion-item.active .accordion-content{
     opacity:1;
}

.accordion-content p{
    color:#b9c0cc;
    line-height:1.6;
    font-size:16px;
}

@media(max-width:991px){

    .content-wrapper{
        flex-direction:column;
    }

    .image-area{
        width:100%;
    }

    .image-box{
        min-height:350px;
    }

    .main-title{
        font-size:38px;
    }

    .accordion-header h3{
        font-size:24px;
    }
}

@media(max-width:767px){

    .top-content{
        flex-direction:column;
    }

    .main-title{
        font-size:30px;
    }

    .accordion-header h3{
        font-size:20px;
    }

    .accordion-content p{
        font-size:15px;
    }
}

.hiring-main { padding:50px 0px 70px;}

.hiring-main h2 { font-size:36px; color:#0e1a3c; font-weight:700; text-align:center; margin:10px 0px 30px;}
.hiring-main h2 span {     background: linear-gradient(90deg, #2459f4, #6ed8ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; }
  .timeline-hiring {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 0 10px;
  }

  .timeline-hiring::before {
    content: '';
    position: absolute;
    top: 20px;
    left: 40px;
    right: 40px;
    height: 3px;
    background: linear-gradient(90deg, #4f46e5, #16a34a);
    border-radius: 3px;
    z-index: 0;
  }

  .step-hiring {
    position: relative;
    z-index: 1;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 0 8px;
  }

  .step-number-hiring {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    color: #fff;
    font-weight: 700;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 0 5px #f4f6f9;
    margin-bottom: 16px;
    flex-shrink: 0;
  }

  .step-hiring:nth-child(1) .step-number-hiring { background: #4f46e5; }
  .step-hiring:nth-child(2) .step-number-hiring { background: #4338ca; }
  .step-hiring:nth-child(3) .step-number-hiring { background: #6d28d9; }
  .step-hiring:nth-child(4) .step-number-hiring { background: #7c3aed; }
  .step-hiring:nth-child(5) .step-number-hiring { background: #0891b2; }
  .step-hiring:nth-child(6) .step-number-hiring { background: #16a34a; }

  .step-card-hiring {
    background: #ffffff;
    border-radius: 12px;
    padding: 18px 16px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    border: 1px solid #e5e7eb;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    width: 100%;
    min-height: 130px;
  }

  .step-card-hiring:hover {
    transform: translateY(-6px);
    box-shadow: 0 6px 16px rgba(0,0,0,0.1);
  }

  .step-title-hiring {
    font-size: 18px;
    font-weight: 600;
    color: #0e1a3c;
    margin-bottom: 6px;
	line-height:20px;
  }

  .step-desc-hiring {
    font-size: 14px;
    color: #2b2b2b;
    line-height: 1.4;
  }

  .final-badge-hiring {
    display: inline-block;
    margin-top: 8px;
    font-size: 11px;
    font-weight: 600;
    color: #16a34a;
    background: #dcfce7;
    padding: 3px 10px;
    border-radius: 20px;
  }
    .final-badge-hiring-left {
    display: inline-block;
    margin-top: 8px;
    font-size: 11px;
    font-weight: 600;
 color: #2b7ae8;
    background: #dceefc;
    padding: 3px 10px;
    border-radius: 20px;
  }

  @media (max-width: 900px) {
    .timeline-hiring {
      flex-direction: column;
      align-items: stretch;
      gap: 24px;
    }
    .timeline-hiring::before {
      top: 10px;
      bottom: 10px;
      left: 19px;
      right: auto;
      width: 3px;
      height: auto;
      background: linear-gradient(180deg, #4f46e5, #16a34a);
    }
    .step-hiring {
      flex-direction: row;
      align-items: center;
      text-align: left;
      padding-left: 40px;
    }
    .step-number-hiring {
      position: absolute;
      left: -60px;
      margin-bottom: 0;
    }
    .step-card-hiring { min-height: auto; }
  }

/* ========== end accordian why secneural ========== */


	.container-journey{
		max-width:1280px;
		margin:auto;
	}

	.steps-journey{
		display:flex;
		justify-content:space-between;
		gap:14px;
		flex-wrap:wrap;
		margin-top: 25px;
	}

	.step-journey{
		width:190px;
		position:relative;
	}

	/* Top Header */

	.header-journey{
		height:58px;
		border-radius:40px;
		display:flex;
		align-items:center;
		justify-content:center;
		color:#fff;
		font-weight:600;
		font-size:20px;
		position:relative;
		overflow:visible;
	}

	/* Icon */

	.icon-journey{
		position:absolute;
		left:8px;
		top:50%;
		transform:translateY(-50%);
		width:46px;
		height:46px;
		background:#fff;
		border-radius:50%;
		box-shadow:0 5px 12px rgba(0,0,0,.18);
		display:flex;
		align-items:center;
		justify-content:center;
		color:#666;
		font-size:18px;
	}
	
	.icon-journey img { width:28px;}

	/* Content */

	.content-journey{
		margin-top:12px;
		background:#fff;
		border-radius:18px;
		padding:18px;
		min-height:130px;
		text-align:center;
	}

	.content-journey h4{
		font-size:16px;
		color:#000000;
		margin-bottom:10px;
		font-weight: 600;
	}

	.content-journey p{
		font-size:14px;
		line-height:1.5;
		    color: #080808;
    font-weight: 500;
	}

	/* Arrow */

	.arrow-journey{
		position:absolute;
		right:-30px;
		bottom:18px;
		width:30px;
		height:2px;
	}

	.arrow-journey:before{
		content:"";
		position:absolute;
		width:30px;
		height:2px;
		background:currentColor;
	}

	.arrow-journey:after{
		content:"";
		position:absolute;
		right:-1px;
		top:-4px;
		border-left:10px solid currentColor;
		border-top:5px solid transparent;
		border-bottom:5px solid transparent;
	}

	/* Colors */

	.green-journey .header-journey{
		background:linear-gradient(90deg, #3fbcc5, #3bafd9);
	}
	.green-journey .content-journey{
		border:2px solid #9dd244;
	}
	.green-journey .arrow-journey{
		color:#9dd244;
	}

	.mint-journey .header-journey{
		background:linear-gradient(90deg,#79e3bb,#6fe7cb);
	}
	.mint-journey .content-journey{
		border:2px solid #74e6c6;
	}
	.mint-journey .arrow-journey{
		color:#74e6c6;
	}

	.cyan-journey .header-journey{
		background:linear-gradient(90deg,#74ddf8,#67d9ff);
	}
	.cyan-journey .content-journey{
		border:2px solid #6edcff;
	}
	.cyan-journey .arrow-journey{
		color:#6edcff;
	}

	.blue-journey .header-journey{
		background:linear-gradient(90deg,#5ca9ef,#62b9ff);
	}
	.blue-journey .content-journey{
		border:2px solid #67b9ff;
	}
	.blue-journey .arrow-journey{
		color:#67b9ff;
	}

	.royal-journey .header-journey{
		background:linear-gradient(90deg,#4b78e7,#5a8cff);
	}
	.royal-journey .content-journey{
		border:2px solid #5d90ff;
	}
	.royal-journey .arrow-journey{
		color:#5d90ff;
	}

	.navy-journey .header-journey{
		background:linear-gradient(90deg,#4e63a7,#5968a9);
	}
	.navy-journey .content-journey{
		border:2px solid #6d7fb9;
	}
	.navy-journey .arrow-journey{
		color:#6d7fb9;
	}

	.step-journey:last-child .arrow-journey{
		display:none;
	}

	/* Responsive */

	@media(max-width:1200px){

	.steps-journey{
	justify-content:center;
	}

	}

	@media(max-width:768px){

	.step-journey{
	width:100%;
	max-width:350px;
	}

	.arrow-journey{
	display:none;
	}

	}


/* ========== start contact ========== */
.career-block { background-image: url(../assets/images/career-bg.png); 
     background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
	}
.life-section{
    display:flex;
    align-items:center;
    min-height:520px;
    overflow:hidden;
}

/* Left */

.life-content{
    width:58%;
    padding:80px 70px;
    color:#fff;
    text-align:right;
}

.life-content h2{
    font-size:36px;
	color:#fff;
    font-weight:700;
    margin-bottom:20px;
}
.life-content h2 span {
background: linear-gradient(90deg, #2459f4, #6ed8ff);
    -webkit-background-clip: text;
-webkit-text-fill-color: transparent; }

.life-content p{
    font-size:18px;
    line-height:1.6;
    font-weight:500;
    color:#ffffff;

}

.life-content p + p{
    margin-top:20px;
}

/* Right */

.life-image{
    width:42%;
    position:relative;
    height:520px;
}

.life-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

/* Blue Overlay */

.life-image::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:45%;
    height:100%;
    background:linear-gradient(to right,#161d4d 0%,rgba(22,29,77,.75) 55%,rgba(22,29,77,0) 100%);
    z-index:2;
}

/* Tablet */

@media(max-width:991px){

.life-section{
    flex-direction:column;
}

.life-content,
.life-image{
    width:100%;
}

.life-content{
    padding:60px 35px;
}

.life-image{
    height:420px;
}

.life-content h2{
    font-size:40px;
}

.life-content p{
    font-size:19px;
}

}

/* Mobile */

@media(max-width:576px){

.life-content{
    padding:45px 20px;
}

.life-content h2{
    font-size:32px;
}

.life-content p{
    font-size:17px;
    line-height:1.8;
}

.life-image{
    height:300px;
}

}

.section-great-place{
    display:flex;
    align-items:flex-start;
    gap:40px;
	padding:90px 0px;
}

.image-box-great-place{
    flex:1.2;
}

.image-box-great-place img{
    width:100%;
    display:block;
}

.content-great-place{
    flex:1;
    padding-top:10px;
}

.content-great-place h2{
    font-size:36px;
    color:#0e1a3c;
    margin-bottom:20px;
    font-weight:700;
}

.content-great-place h2 span {    background: linear-gradient(90deg, #2459f4, #6ed8ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; }

.content-great-place ul{
    list-style:none;
}

.content-great-place ul li{
    display:flex;
    align-items:center;
    gap:12px;
    font-size:18px;
    color:#111;
    margin-bottom:16px;
    font-weight:600;
}

/* .content-great-place ul li::before{
    content:"•";
    color:#666;
    font-size:24px;
    margin-right:4px;
} */

.icon-great-place{
    width:28px;
    text-align:center;
    font-size:24px;
}

/* Responsive */

@media(max-width:992px){

.section-great-place{
    flex-direction:column;
}

.content-great-place h2{
    font-size:34px;
}

.content-great-place ul li{
    font-size:20px;
}

}

@media(max-width:576px){

.content-great-place h2{
    font-size:28px;
}

.content-great-place ul li{
    font-size:18px;
    align-items:flex-start;
}

}


.contact-wrapper-contact-banner{
    display:flex;
    gap:24px;
    flex-wrap:wrap;
}

.contact-card-contact-banner{
    width:235px;
    height:190px;
    background:rgba(255,255,255,0.12);
    border-radius:14px;
    padding:22px;
    position:relative;
    color:#fff;
    transition:.35s;
    overflow:hidden;
}

.contact-card-contact-banner:hover{
    transform:translateY(-6px);
    background:rgba(255,255,255,.16);
}
.contact-card-contact-banner h3 { color:#fff; font-size:20px; margin-bottom:2px; }
.contact-card-contact-banner p { color:#fff; font-size:18px; margin-bottom:6px; letter-spacing:.5px;}

.icon-contact-banner{
    width:50px;
    height:50px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:6px;
}

.icon-contact-banner img{
    width:50px;
    height:50px;
    stroke:white;
}

.mail-icon-contact{
    border:none;
    width:auto;
    height:auto;
}

.mail-icon-contact svg{
    width:48px;
    height:48px;
}

.arrow-contact{
    position:absolute;
    right:28px;
    bottom:18px;
    color:#fff;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1px;
    transition:.35s;
}

.contact-card-contact-banner:hover .arrow-contact{
    transform:translateX(8px);
}

	.container-direction{
	max-width:1320px;
	margin:auto;
	padding:30px 40px;
	}

	.row-direction{
	display:flex;
	align-items:center;
	gap:40px;
	}

	/* LEFT IMAGE */

	.left-direction{
	width:400px;
	position:relative;
	}

	.hexagon-direction{
	width:420px;
	height:330px;
	    margin: 90px 0px 0px;
	}
	.hexagon-direction img{
	width:100%;
	height:100%;
	object-fit:cover;

	}

	/* RIGHT */

	.right{
	flex:1;

	}

	.title-direction{
	text-align:center;
	font-size:36px;
	font-weight:700;
	margin-bottom:70px;

	}
	
	.right-direction h2 { text-align: center;
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 70px; }
	
	.right-direction h2 span  { background: linear-gradient(90deg, #2459f4, #6ed8ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;}

	.cards-direction{
	display:grid;
	grid-template-columns:repeat(3,1fr);

	}

	.card-direction{
	padding:0 42px;
	position:relative;

	}

	/* divider */

	.card-direction.border{

	border-left:
	1px solid #555;

	}

	.icon-direction{
	font-size:30px;
	margin-bottom:18px;

	}

	.card-direction h3{
	font-size:20px;
	margin-bottom:10px;

	}
	
		.card-direction p{
	font-size:16px;
	margin-bottom:20px;
	line-height: 1.3;
	color:#000;
	min-height: 80px;
	}

	.blue-direction{
	color:#4d82ff;
	}
	.card p{
	line-height:1.55;
	font-size:16px;
	margin-bottom:30px;
	color:#222;
	}

	.btn-direction{
	display:inline-flex;
	align-items:center;
	gap:10px;
	padding:9px 22px;
	font-weight:600;
	border-radius:40px;
	border:1px solid #bbb;
	background:#f7f7f7;
	cursor:pointer;
	font-size:12px;
	transition:.3s;

	}

	.btn-direction:hover{
	background:black;
	color:white;

	}

	.arrow-direction{
	transition:.3s;

	}

	.btn:hover .arrow{
	transform:translateX(4px);

	}

	@media(max-width:1000px){

	.row-direction{
	flex-direction:column;

	}

	.cards-direction{
	grid-template-columns:1fr;
	gap:50px;

	}

	.card-direction.border{
	border-left:none;

	}

	.hexagon-direction{
	width:100%;

	}

	}
	
	.section-title-regional-main { padding:0px 0px 20px; background: #f7f7f7; margin-bottom:80px;}
	.regiaonl-spce  { padding:50px 0px 30px;     width: 1040px;
    margin: 0 auto;}
	
	.section-title-regional{
      text-align: center;
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 40px;
}

.section-title-regional span{
    background: linear-gradient(90deg, #2459f4, #6ed8ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.locations-regional{
    display:grid;
    grid-template-columns:repeat(4,1fr);
}

.location-regional{
    padding:0 40px;
    position:relative;
}

.location-regional:not(:last-child){
    border-right:1px solid #9b9b9b;
}

.icon-regional{
    width:70px;
    height:42px;
    margin-bottom:18px;
}

.icon-regional svg{
    width:100%;
    height:100%;
    stroke:#111;
    fill:none;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.location-regional h3{
    font-size:20px;
    font-weight:700;
    color:#06184b;
    margin-bottom:4px;
}

.location h3 span{
    color:#4d7cff;
}

.location p{
    font-size:16px;
    line-height:1.7;
    color:#111;
}

@media(max-width:991px){

.locations-regional{
grid-template-columns:repeat(2,1fr);
gap:50px;
}

.location-regional{
border-right:none!important;
padding:0 20px;
}

}

@media(max-width:640px){

.section-title-regional{
font-size:36px;
margin-bottom:40px;
}

.locations-regional{
grid-template-columns:1fr;
gap:40px;
}

.location-regional{
padding-bottom:35px;
border-bottom:1px solid #ddd;
}

.location:last-child{
border-bottom:none;
}

}


.deliver-section{
    display:flex;
    align-items:center;
    gap:30px;
	    width: 1000px;
    margin: 0 auto;
    padding: 70px 0px;
}

.image-box-deliver{
    flex:0 0 360px;
}

.image-box-deliver img{
    width:100%;
    display:block;
    border-radius:18px;
}

.content-deliver{
    flex:1;
}

.content-deliver h2{
    font-size:36px;
    font-weight:700;
    color:#0e1a3c;
    margin-bottom:10px;
    line-height:1.1;
}
.content-deliver h2 span {     background: linear-gradient(90deg, #2459f4, #6ed8ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;}

.content p{
    font-size:25px;
    line-height:1.75;
    color:#333;
    max-width:720px;
}

/* Tablet */

@media(max-width:992px){

.deliver-section{
    flex-direction:column;
    text-align:center;
}

.image-box-deliver{
    flex:unset;
    max-width:420px;
}

.content-deliver h2{
    font-size:42px;
}

.content-deliver p{
    max-width:100%;
    font-size:20px;
}

}

/* Mobile */

@media(max-width:576px){


.content-deliver h2{
    font-size:34px;
}

.content-deliver p{
    font-size:17px;
    line-height:1.8;
}

}
	
	.section-happen{
    max-width:900px;
}
.bg-contect { background: #f4f4f4; margin:80px 0px;}
.heading-happen{
    font-size:28px;
    color:#0e1a3c;
    font-weight:700;
    margin-bottom:38px;
    letter-spacing:1px;
}

.timeline-happen{
    position:relative;
}

/* vertical line */
.timeline-happen::before{
    content:"";
    position:absolute;
    left:20px;
    top:22px;
    width:1px;
    height:150px;
    background:#d8d8d8;
}

.step-happen{
    display:flex;
    align-items:flex-start;
    gap:18px;
    margin-bottom:40px;
    position:relative;
}

.number-happen{
    width:40px;
    height:40px;
    background:#ffffff;
    border:1px solid #ddd;
    border-radius:2px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:16px;
	font-weight:700;
    color:#000;
    position:relative;
    z-index:2;
}

.text-happen{
    font-size:20px;
    color:#000;
    line-height:1.6;
	font-weight:500;
    padding-top:1px;
}

@media(max-width:768px){

.heading-happen{
font-size:20px;
}

.text-happen{
font-size:18px;
}

}

.cards-support{max-width:1250px;margin:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:18px; padding:50px 0px;}
.card-support{
background:#f5f5f5;
border:1px solid #ddd;
border-radius:12px;
padding:38px;
min-height:330px;
display:flex;
flex-direction:column;
position:relative;
transition:.3s
}
.card-support:hover{
transform:translateY(-5px);
box-shadow:0 15px 30px rgba(0,0,0,.08)
}
.icon-support{
position:absolute;
top:18px;
right:22px;
font-size:28px
}
.icon-support img { width:40px;}
.title-support{
color:#0e1a3c;
font-size:22px;
font-weight:600;
line-height:1.15;
margin-bottom:22px
}
.desc-support{
font-size:16px;
line-height:1.55;
color:#000;
}
.time-support{margin-top:14px}
.bottom-support{
margin-top:auto;
display:flex;
align-items:center;
gap:12px;
padding-top:35px
}
.link-support{
color:#000000;
font-weight:500;
text-decoration:none
}
.arrow-support{
font-size:26px;
transition:.3s
}
.card-support:hover .arrow-support{
transform:translateX(5px)
}
.career-bg { background: radial-gradient(circle at top right, #32235e 0%, transparent 25%), linear-gradient(135deg, #071122, #02081d); }
.career-bg h2 { color:#fff !important;}
@media(max-width:1100px){
.cards-support{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:768px){
.cards-support{grid-template-columns:1fr}
}

.section-main-risk { background-color:#f6f8fc;     padding: 70px 0px;}
	.section-risk{
	max-width:1320px;
	margin:0 auto;
	}
	.section-risk p{ text-align:center; margin-bottom:0px;}

	.title-risk{
	text-align:center;
	font-size:36px;
	font-weight:700;
	margin-bottom:10px;
	}

	.wrap-risk{
	display:flex;
	gap:40px;
	margin-top: 50px;
	align-items:center;
	}

	.preview-risk{
	flex:1;
	background:#fff;
	padding:18px;
	border-radius:12px;
	box-shadow:0 10px 30px rgba(0,0,0,.08);
	overflow:hidden;
    height:550px;
	}

	.preview-risk img{
	width:100%;
	display:block;
	border-radius:16px;
	transition:.45s;

	
	}
	
	.item-risk{
transition:.3s;
cursor:pointer;
}

.item-risk:hover,
.item-risk.active{
background:#1e3568 !important;
color:#fff !important;
}

.item-risk:hover h3,
.item-risk:hover p,
.item-risk.active h3,
.item-risk.active p{
color:#fff;
}

	.list-risk{
	width:470px;
	}

	.item-risk{
	display:flex;
	gap:18px;
	padding:12px;
	cursor:pointer;
	border-bottom:1px solid #ddd;
	transition:.35s;
	background:transparent;
	}

	.item-risk:hover,
	.item-risk.active{
	background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan));
	color:#ffffff;
	}

	.icon-risk{
	min-width:42px;
	height:42px;
	background:#dff7ff;
	display:flex;
	align-items:center;
	justify-content:center;
	color:#48b9d7;
	font-size:18px;
	border-radius:4px;
	}
	.icon-risk img { width:30px;}

	.item-risk.active .icon-risk{
	background:#fff;
	}

	.item-risk h3{
	font-size:18px;
	margin-bottom:4px;
	}

	.item-risk p{
	font-size:14px;
	color:#202020;
	line-height:1.4;
	font-weight:400;
	text-align: left;
	}

	@media(max-width:991px){

	.wrap-risk{
	flex-direction:column;
	}

	.list-risk{
	width:100%;
	}

	.title-risk{
	font-size:38px;
	}

	}
/* ========== end contact ========== */

/* ========== start about header ========== */
.stats-section{
    display:flex;
    justify-content:center;
    align-items:center;
    position:relative;
    overflow:hidden;
	/* background-image: url(../assets/images/about-banner.png);
    background-position: center;
	    background-repeat: no-repeat; */
}
/* Purple glow */

.stats-grid{
    width:100%;  
    display:grid;
    gap:12px;
    position:relative;
    z-index:2;
}

/* .stats-section::before {
    content: "";
    position: absolute;
    width: 700px;
    height: 700px;
    background: radial-gradient(circle, rgba(173, 0, 255, .35), transparent 70%);
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
} */

.card-company{
    background:rgba(255,255,255,.05);
    backdrop-filter:blur(20px);
    border:1px solid rgba(255,255,255,.05);
    border-radius:10px;
    padding:18px 30px;
    min-height:108px;
    position:relative;
}

.card-company h2{
    color:#fff;
    font-size:30px;
    margin-top:15px;
}

.card-company p{
    color:#fff;
    font-size:16px !important;     line-height: 20px; margin-bottom:10px !important;
}

.icon-company{
    position:absolute;
    top:20px;
    right:20px;
}

.icon-company i{
    color:#25d7ff;
    font-size:32px;
}

/* EXACT POSITIONING */

.card-1{
    grid-column:2 / 6; /* left gap */
    margin-top:40px;
}

.card-2{
    grid-column:6 / 11; /* right gap */
	margin-bottom: 0px;
}

.card-3{
    grid-column:1 / 6;
}

.card-4{
    grid-column:6 / 11; /* right gap remains */
    margin-top:0px;
}

@media(max-width:768px){

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

    .card-1,
    .card-2,
    .card-3,
    .card-4{
        grid-column:auto;
        margin:0;
    }
}


.container-overview{
    max-width:1320px;
    margin:auto;
padding: 30px 30px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:60px;
}

/* Left Content */
.content-overview{
    flex:1;
}

.sub-title-overview{
    color:#666;
    font-size:16px;
    margin-bottom:6px;
}

.content-overview h2{
    font-size:36px;
    font-weight:800;
    color:#17214d;
    margin-bottom:25px;
}

.content-overview h2 span{
    background: linear-gradient(90deg, #2459f4, #00B8D9);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;   
}
.content-overview p{  
    margin-bottom:25px;
	font-size: 16px;
    color: #000;
    line-height: 1.7;
}

/* Right Image */
.image-overview{
    flex:1;
    text-align:center;
}

.image-overview img{
    width:100%;
    height:auto;
	border-radius:20px;
}
.overview-right-mg {        font-weight: 600; position: absolute;
    font-size: 20px; line-height:30px;
    color: #fff; }
	
	.jouney-section {     background-color: #F9F9F9;}
	
	.jouney-section h2 { font-size:36px; margin:10px 0px; line-height:1.1;}
	.jouney-section h2 span {     background: linear-gradient(90deg, #2459f4, #00B8D9);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;}

/* Responsive */
@media(max-width:991px){

    .container-overview{
        flex-direction:column;
        text-align:center;
    }

    .content-overview h2{
        font-size:42px;
    }

    .content-overview p{
        font-size:16px;
    }
}

/* ========== start partner ========== */
	.container-partner{
	max-width:1320px;
	margin:auto;
	padding: 100px 30px 0px;
	}

	/* SECTION */
	.feature-partner{
	/* display:grid;
	grid-template-columns:500px 1fr;
	gap:50px; */
	align-items:center;
	margin-bottom:80px;
	}

	.feature-partner.reverse-partner{
	grid-template-columns:	1fr 500px;
	}

	/* IMAGE */

	.image-partner img{
	width:100%;
	height:460px;
	object-fit:cover;
	border-radius:18px;
	display:block;

	}

	/* CONTENT */
	.content-partner { text-align:center;}

	.content-partner h2{
	font-size:36px;
	font-weight:800;
	line-height:1.1;
	margin-bottom:10px;
	

	}
		.content-partner h2 span {     background: linear-gradient(90deg, #2459f4, #00B8D9);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;}
	.content-partner p{
	font-size:16px;
	line-height:1.6;
	color:#202020;

	margin-bottom:32px;

	}

	/* SECOND SECTION RIGHT ALIGN */

	.feature-partner.reverse-partner .content-partner{
	display:flex;
	flex-direction:column;
	align-items:flex-end;
	text-align:right;

	}

	
	.section-tag-partner{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    padding: 0 16px;
    background: #E8F7FD;
    border-radius: 50px;
    color: #52A8D7;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 10px;
	}
	
	.tag-partner{
	display:inline-flex;
	align-items:center;
	padding:8px 18px;
	border-radius:40px;
	font-size:12px;
	font-weight:700;
	margin-bottom:10px;
	letter-spacing:.5px;
	}
	.blue-partner{
	background:#E8F8FD;
	color:#48A5D8;
	}

	.purple-partner{
	background:#F6EDFF;
	color:#8E39E3;
	}

	.green-partner{
	background:#EAFBF2;
	color:#1BA96A;
	}

	/* 2nd section keep tag right aligned */
	.feature-partner.reverse-partner .section-tag-partner{
	align-self:flex-end;
	}
	/* LOGOS */
	.logos-partner{
	display:grid;
	grid-template-columns:	repeat(8,140px);
	gap:12px;
	width:max-content;
	}
	.feature-partner.reverse-partner .logos-partner{
	display:flex;
	flex-wrap:wrap;
	justify-content:flex-end;
	gap:12px;
	margin-left:auto;
	max-width:600px;
   }
	.logo-partner{
	width:140px;
	height:70px;
	background:#fff;
	border:1px solid #e3e3e3;
	border-radius:6px;
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:12px;
	color:#444;
	padding:0 10px;

	}

	.logo-partner:hover{
	transform:translateY(-2px);
	}

	/* MOBILE */

	@media(max-width:900px){

	.feature-partner,
	.feature-partner.reverse-partner{

	grid-template-columns:1fr;

	gap:40px;

	margin-bottom:80px;

	}

	.feature-partner.reverse-partner .content-partner{

	align-items:flex-start;

	text-align:left;

	}

	.content-partner h2{
	font-size:34px;
	}

	.image-partner img{
	height:auto;
	}

	.logos-partner{
	grid-template-columns:
	repeat(3,1fr);

	width:100%;
	}

	}

/* ========== start events ========== */

.secneual-event-container {
    max-width: 1320px;
    margin: auto;
    padding: 0px 0px 30px;
}
.secneual-event-heading {
    text-align: center;
    margin-bottom: 30px;
}
.container-sec-event{
    width:100%;
    max-width:1320px;
    margin:30px auto;
    position:relative;
}

.slider-sec-event{
    overflow:hidden;
}

.track-sec-event{
    display:flex;
    transition:transform .6s ease;
}

.slide-sec-event{
    flex:0 0 33.333%;
    padding:0 10px;
}

.image-box-sec-event{
    position:relative;
    overflow:hidden;
    border-radius:10px;
}

.image-box-sec-event img{
    width:100%;
    height:280px;
    object-fit:cover;
    display:block;
}

.caption-sec-event{
    position:absolute;
    left:15px;
    bottom:15px;
    width:75%;
    background: linear-gradient(135deg, rgba(0, 102, 255, 0.9), rgba(0, 204, 255, 0.9));
    color:#fff;
    padding:8px 12px;
    border-radius:8px;
    z-index:5;
}

.caption-sec-event h3{
    font-size:18px;
    line-height:1.1;
    font-weight:600;
	color:#ffffff;
}

.nav-sec-event{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:40px;
    height:40px;
    border-radius:50%;
    border:1px solid #acacac;
    background:#fff;
    cursor:pointer;
    font-size:22px;
    z-index:20;
}

.prev-sec-event{
    left:-15px;
}

.next-sec-event{
    right:-15px;
}

.nav-sec-event:hover{
   background: linear-gradient(135deg, rgba(0, 102, 255, 0.9), rgba(0, 204, 255, 0.9));
   color:#fff;
   transition: background-color 0.3s ease-in-out;
   border:0px;
}

@media(max-width:991px){

.slide-sec-event{
    flex:0 0 50%;
}

}

@media(max-width:768px){

.slide-sec-event{
    flex:0 0 100%;
}

.prev-sec-event{
    left:10px;
}

.next-sec-event{
    right:10px;
}

.caption-sec-event{
    width:85%;
}

.caption-sec-event h3{
    font-size:16px;
}

}

.navbar{display:contents;justify-content:space-between;align-items:center;height:76px; gap:166px; }
.logo{font-size:26px;font-weight:bold}
.menu-toggle{display:none;flex-direction:column;cursor:pointer}
.menu-toggle span{width:28px;height:3px;background:#111;margin:4px 0;border-radius:20px;transition:.3s}
.menu-toggle.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.menu-toggle.active span:nth-child(2){opacity:0}
.menu-toggle.active span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}
.nav-menu{display:flex;list-style:none;align-items:center}
.nav-menu>li{position:relative;margin-left:0px}
.nav-menu a,.nav-link{text-decoration:none;color:#222;padding:30px 0;display:flex;align-items:center;gap:5px;font-weight:500;cursor:pointer}
.submenu{position:absolute;top:100%;left:0;width:280px;background:#fff;border-radius:8px;box-shadow:0 10px 30px rgba(0,0,0,.15);list-style:none;opacity:0;visibility:hidden;transform:translateY(10px);transition:.25s;pointer-events:none}
.nav-menu li:hover>.submenu{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto}
.submenu a{display:block;padding:12px 18px}
.submenu a:hover{background:#0b7cff;color:#fff}


@media(max-width:991px){
.menu-toggle{display:flex}
.nav-menu{display:none;position:absolute;top:80px;left:0;width:100%;background:#fff;flex-direction:column;align-items:stretch;padding:15px 20px;box-shadow:0 10px 30px rgba(0,0,0,.15)}
.nav-menu.active{display:flex}
.nav-menu>li{margin:0;border-bottom:1px solid #eee}
.nav-menu>li>a,.nav-link{padding:18px 0;justify-content:space-between;width:100%}
.submenu{position:static;width:100%;opacity:1;visibility:visible;transform:none;display:none;pointer-events:auto;box-shadow:none;background:#f7f7f7}
.submenu.active{display:block}

}
.slider-case-main { padding:80px 0px; }
.slider-case{position:relative;overflow:hidden}
.track-case{display:flex;transition:.6s ease}
.card-case{min-width:calc(100%/3 - 20px);margin:0 10px;background:#fff;border-radius:18px;overflow:hidden; border:1px solid #ededed; }
.card-case img{width:100%;display:block}
.content-case{padding:26px}
.content-case h3{font-size:18px;     min-height: 70px; line-height:1.5;color:#222;margin-bottom:25px}
.content-case a{text-decoration:none;color:#0077ff;font-weight:600}
.content-case a:hover{text-decoration:none;color:#333;font-weight:600}
.btn-case{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border:none;border-radius:50%;background:#fff;font-size:18px;cursor:pointer;    border: 1px solid #ededed;z-index:10}
.prev-case{left:5px}
.next-case{right:5px}
.btn-case:hover{background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan)); color:#fff; transition: background-color 0.3s ease-in-out;}

@media(max-width:991px){
.card-case{min-width:calc(50% - 20px)}
}

@media(max-width:768px){
h2{font-size:34px}
.card-case{min-width:100%;margin:0}
.track-case{gap:0}
}

.cards-devilrable{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:28px;
    margin-bottom:28px;
}

.card-devilrable{
    background: linear-gradient(40deg, rgba(255, 255, 255, 0.10) 0%, rgba(200, 83, 221, 0.10) 100%);
    border-radius:18px;
    padding:28px;
    color:#fff;
    min-height:305px;
}

.card-devilrable h3{
    font-size:20px;
	color:#fff;
    margin-bottom:18px;
    font-weight:600;
}

.card-devilrable ul{
    list-style:none;
}

.card-devilrable li{
    position:relative;
    padding-left:0px;
    margin-bottom:10px;
    font-size:16px;
    color:#efefef;
	display: flex;
    align-items: flex-start;
    gap: 8px;
}
.franwork-stand {     
    font-size: 24px;
	font-weight: 700;
    line-height: 1.1;
    color: #fff;
    width: 100%;
    text-align: center;
    padding: 20px 0px;}

/* .card-devilrable li::before{
    content:"•";
    position:absolute;
    left:0;
    color:#fff;
} */

/* Bottom Boxes */

.logo-grid-devilrable{
    display:grid;
    grid-template-columns:repeat(11,1fr);
    gap:18px;
}

.logo-box-devilrable{

    border-radius:2px;
}
.logo-box-devilrable img { width:80px;}

/* Responsive */

@media(max-width:992px){

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

.logo-grid-devilrable{
    grid-template-columns:repeat(4,1fr);
}

}

@media(max-width:600px){

.card-devilrable{
    padding:20px;
}

.card-devilrable h3{
    font-size:18px;
}

.card-devilrable li{
    font-size:14px;
}

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

}

.why-secneural{
    padding:70px 0;
}


.row-secneural{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
}

.left-secneural,.right-secneural{
    flex:1;
}

/* Image */

.left-secneural{
    display:flex;
    justify-content:center;
    align-items:center;
}

.left-secneural img{
    width:100%;
    max-width:480px;
    height:auto;
}

/* Content */

.right-secneural h2{
    font-size:32px;
    font-weight:700;
    color:#111;
    margin-bottom:25px;
}

.right-secneural h2 span {
    background: linear-gradient(90deg, #2459f4, #6ed8ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.right-secneural ul{
    padding-left:0px;
}

.right-secneural li{
    font-size:16px;
    color:#1e1e1e;
    margin-bottom:14px;
    line-height:1.6;
	    font-weight: 500;
	display: flex;
    align-items: flex-start;
    gap: 8px;
}
.right-secneural li span { margin-top:6px;}

/* Responsive */

@media(max-width:992px){

.row-secneural{
    flex-direction:column;
    text-align:center;
}

.right-secneural ul{
    display:inline-block;
    text-align:left;
}

.right-secneural h2{
    font-size:32px;
}

.left-secneural img{
    max-width:350px;
}

}

@media(max-width:576px){

.why-secneural{
    padding:50px 0;
}

.right-secneural h2{
    font-size:30px;
}

.right-secneural li{
    font-size:16px;
}

.left-secneural img{
    max-width:260px;
}

}

.subtitle-we-do{
    text-align:center;
    color:#666;
    font-size:18px;
    margin-bottom:50px;
}

.services-we-do{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:30px 60px;
}

.column-we-do{
    display:flex;
    flex-direction:column;
    gap:22px;
}

.service-we-do{
    display:flex;
    align-items:flex-start;
    gap:18px;
    background: linear-gradient(40deg, rgba(255, 255, 255, 0.10) 0%, rgba(200, 83, 221, 0.10) 100%);
    padding:20px;
    border-radius:12px;
    box-shadow:0 8px 20px rgba(0,0,0,.08);
    transition:.3s;
}

.service-we-do:hover{
    transform:translateY(-5px);
    box-shadow:0 12px 30px rgba(0,0,0,.12);
}

.icon-we-do{
    width:44px;
    height:44px;
    border-radius:50%;
    flex-shrink:0;
	padding: 8px;
	border: 1px solid #43B8E8;
}

/* .light-we-do{
    background:#43B8E8;
}

.dark-we-do{
    background:#3F7BE8;
} */

.content-we-do h3{
    font-size:18px;
    margin-bottom:2px;
    color:#fff;
}

.content-we-do p{
    font-size:15px;
    color:#efefef;
    line-height:1.6;
}
.what-we {     text-align: center;
    width: 100%;
    padding: 20px 0px; }
	
	
.what-we-do {  padding:70px 0px 100px;   background: radial-gradient(circle at top right, #32235e 0%, transparent 25%), linear-gradient(135deg, #071122, #02081d); }
	
	.what-we h2 { font-size:36px; color:#fff;}
	.what-we h2 span{     background: linear-gradient(90deg, #2459f4, #00B8D9);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;}
@media(max-width:900px){

.services-we-do{
    grid-template-columns:1fr;
}

}

/* ========== end events ========== */

/* ========== start portfolio servce ========== */
.tranform-section { background-color:#F9F9F9;}
.comany-vision { background-color:#ffffff;}
.card-transform-company h3 { font-size: 24px;    margin-bottom: 10px;}
.card-transform-company p { color:#000;}
.comany-transform { display:grid;  grid-template-columns:repeat(2,1fr); gap:18px; margin-top:10px;}	
.card-transform-company {
    background:#f6f6f6;
    border-radius:12px;
    padding:16px 26px;
    min-height:280px;
    display:flex;
    flex-direction:column;
    box-shadow:0 3px 16px rgba(0,0,0,.04);
    border-bottom:3px solid #00CBFF;
    transition:.25s ease;
}

.card-transform-company:hover{
    transform:translateY(-4px);	
}
.icon-transform-company{
    font-size:42px;
    margin-bottom:26px;
	display: flex;
    justify-content: flex-end;
}
.card-transform-company:hover .icon-transform-company img {filter:invert(61%) sepia(97%) saturate(3278%) hue-rotate(166deg) brightness(100%) contrast(101%);}


.container-transform{
    max-width:1320px;
    margin:auto;
    padding:60px 24px;
}

.label-transform{
    color:#393535;
    font-size:14px;
    margin-bottom:12px;
}

.heading-transform{
    font-size:clamp(32px,5vw,36px);
    line-height:1.15;
    font-weight:800;
    max-width:900px;
}

.heading-transform span{
   background: linear-gradient(90deg, #2459f4, #00B8D9);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-style:italic;
}

.cards-transform{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:18px;
    margin-top:40px;
}

.card-transform {
    background:#fff;
    border-radius:12px;
    padding:16px 26px;
    min-height:330px;

    display:flex;
    flex-direction:column;

    box-shadow:
        0 3px 16px rgba(0,0,0,.04);

    border-bottom:3px solid #00CBFF;

    transition:.25s ease;
}

.card-transform:hover{
    transform:translateY(-4px);
	
}
.card-transform:hover .icon-transform img {filter:invert(61%) sepia(97%) saturate(3278%) hue-rotate(166deg) brightness(100%) contrast(101%);}

.icon-transform{
    font-size:42px;
    margin-bottom:26px;
	    display: flex;
    justify-content: flex-end;
}

.card-transform h3{
    font-size:20px;
    line-height:1.3;
    margin-bottom:8px;
}

.card-transform p{
    color:#202020;
    line-height:1.6;
	font-size:16px;
}

.approach-transform{
    margin-top:50px;
    background:
        linear-gradient(
            135deg,
            #03091a,
            #080d24
        );

    color:white;
    padding:34px;
    border-radius:10px;
	border-left:4px solid #00B8D9;
}

.approach-transform .small{
    color:#42b7ff;
    font-size:18px;
    font-weight:700;
    margin-bottom:10px;
}

.approach-transform p{
    line-height:1.6;
    opacity:.95;
	color: #FFFFFF;
	font-style: italic;
}

/* Tablet */
@media (max-width:992px){

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

}

/* Mobile */
@media (max-width:640px){

.container-transform{
    padding:40px 18px;
}

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

.card-transform{
    min-height:auto;
}

.heading-transform{
    font-size:34px;
}

.approach-transform{
    padding:24px;
}

}

/* ========== end portfolio servce ========== */


/* ========== start security circle ========== */


.circle-adapt{
    width:240px;
    height:240px;
    border-radius:50%;
    display:flex;
	top:150px;
	right:150px;
    justify-content:center;
    align-items:center;
	position: absolute; 
    font-size: 22px;
    background:
        radial-gradient(
            circle at center,
            #29597f 0%,
            #234d75 35%,
            #1c3d67 55%,
            #162c5a 72%,
            #111f4b 85%,
            #091129 100%
        );
		box-shadow:
        inset 0 0 0 6px #0C101C;
}

/* Outer Ring */
.circle-adapt::before{
    content:"";
    position:absolute;
    inset:14px;
    border-radius:50%;
    border:2px solid rgba(39,72,255,.8);
}

/* Center Text */
.text-adapt{
    position:relative;
    z-index:2;
    font-family: Arial, Helvetica, sans-serif;
    font-size:40px;
    font-weight:700;
    letter-spacing:8px;
    color:#ffffff;
    text-transform:uppercase;

    text-shadow:
        0 0 10px rgba(255,255,255,.3),
        0 0 30px rgba(100,150,255,.4);
}



.bg-secuirty {  
    background:
        radial-gradient(
            circle at 25% 55%,
            rgba(104, 67, 170, 0.25) 0%,
            rgba(104, 67, 170, 0.12) 18%,
            transparent 35%
        ),

        radial-gradient(
            circle at 55% 50%,
            rgba(150, 90, 255, 0.22) 0%,
            rgba(150, 90, 255, 0.12) 15%,
            transparent 30%
        ),

        radial-gradient(
            circle at 78% 42%,
            rgba(70, 110, 255, 0.22) 0%,
            rgba(70, 110, 255, 0.10) 15%,
            transparent 30%
        ),

        radial-gradient(
            circle at 0% 100%,
            rgba(80, 180, 255, 0.35) 0%,
            rgba(80, 180, 255, 0.15) 20%,
            transparent 35%
        ),

        radial-gradient(
            circle at 100% 0%,
            rgba(180, 120, 255, 0.45) 0%,
            rgba(180, 120, 255, 0.18) 15%,
            transparent 35%
        ),

        #02081f;
  
}

.sec-phase-panel { padding:80px 20px; }

.sec-phase-panel h2 { font-size:36px; color:#fff; margin-bottom: 25px;}

.sec-phase-panel h2 span {
background: linear-gradient(90deg, #2459f4, #00B8D9);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
font-style: italic; }

  /* ── Header ── */
  .eyebrow {
    font-size: 14px;
    color: #fff;
    margin-bottom: 4px;
  }

  /* ── Tabs ── */
  .tabs-sec {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 20px;
  }
  .tabs-sec button {
    font-size: 14px;
    padding: 6px 20px;
    border-radius: 20px;
    border: 1px solid #287cc6;
    background: transparent;
    color: #e3e3e3;
    cursor: pointer;
	font-weight:500;
    transition: all .2s;
  }
  .tabs-sec button.on {
     background: #0f84c2;
    color: #fff;
    border-color: #0f84c2;
  }
  /* ── Layout ── */
  .layout {
    display: flex;
    gap: 30px;
	padding: 30px 0px;
    align-items: flex-start;
  }

  /* ── Wheel ── */
  
  .wheel-wrap {
    flex: 0 0 550px;
    position: relative;
    width: 550px;
    height: 550px;
  }
  .wheel-wrap svg {
    display: block;
    width: 550px;
    height: 550px;
  }
  .wheel-label {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 900;
    letter-spacing: .12em;
    pointer-events: none;
    background: linear-gradient(135deg, #c4b8ff, #818cf8, #a5b4fc);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
  }

  /* ── Panel ── */
  .panel {
    flex: 1;
    padding: 22px 24px;
    min-height: 300px;
	background: linear-gradient(40deg, rgba(255, 255, 255, 0.10) 0%, rgba(200, 83, 221, 0.10) 100%);
    border-radius: 16px;
    padding: 20px;
    gap: 10px;
  }

  /* Panel — hidden phase sections, shown by active data attr */
  .phase-section { display: none; }
  .phase-section.active { display: block; }

  .ph-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 14px;
  }

  .ph-left { display: flex; gap: 14px; align-items: flex-start; }

  .ph-letter {
    font-size: 70px;
    font-weight: 700;
    line-height: 1; 
	    color: #fff;
    opacity: 0.5;
  }
  .ph-heading {     padding-top: 14px;}

  .ph-title {
    font-size: 22px;
    font-weight: 700;
	color:#ffffff;
  }
  .ph-sub {
    font-size: 10px;
    letter-spacing: .14em;
    color: #e3e3e3;
    margin-top: 2px;
    text-transform: uppercase;
  }

  .ph-desc {
    font-size: 16px;
    color: #fff;
    max-width: 360px;
    text-align: left;
   line-height: 1.4;
    padding: 14px 0px 0px;
  }

  hr {
    border: none;
    border-top: 1px solid rgba(255,255,255,.07);
    margin: 13px 0;
  }

  .sec-label {
    font-size: 18px;
    font-weight: 600;
    color: #ffffff;
    margin-bottom: 9px;
  }

  .phase-section ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 7px;
    margin-bottom: 12px;
  }

  .phase-section li {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    font-size: 16px;
    color: #efefef;
    line-height: 1.35;
  }

  .dot {
    width: 17px;
    height: 17px;
    border-radius: 50%;
    border: 1.5px solid;
    flex-shrink: 0;
    margin-top: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .dot svg { width: 9px; height: 9px; }

  .stds-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 14px;
    flex-wrap: wrap;
  }

  .stds-label { font-size: 18px; color: #ffffff; font-weight:600; margin-right:10px}

  .badge-dev {    padding: 4px 0px;  }
  .badge-dev img { width:50px;}
  .outcome-row {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-top: 13px;
  }

  .outcome-label {
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    flex-shrink: 0;
  }

  .outcome-text {
    font-size: 16px;
     color:#00B2FF;
	     line-height: 16px;
  }

  @media (max-width: 650px) {
    .layout { flex-direction: column; }
    .wheel-wrap { flex: none; width: 100%; display: flex; justify-content: center; }
    .ph-desc { display: none; }
  }


/* ========== end security circle ========== */



/* ==========================
start portfolio section
========================== */


.portfolio-section{
    padding:80px 0;
}


/* ==========================
TOP AREA
========================== */

.portfolio-top{
    display:flex;
    justify-content:space-between;
    gap:80px;
    margin-bottom:60px;
}

.portfolio-left{
    max-width:720px;
}

.small-title{
    display:block;
    margin-bottom:15px;
    font-size:14px;
    color:#666;
}

.portfolio-left h2{
    font-size:32px;
    line-height:1.1;
    font-weight:700;
}

.portfolio-left h2 span{
    background:linear-gradient(
        90deg,
        #2459f4,
        #6ed8ff
    );
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.portfolio-right{
    max-width:650px;
}

.portfolio-right p{
    line-height:1.6;
    color:#000;
}

/* ==========================
GRID
========================== */

.services-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    border-top:1px solid #ddd;
}

.service-card{
    position:relative;
    min-height:380px;
    padding:40px 25px;
    background:#fff;
    border-right:1px solid #ddd;
    overflow:hidden;
    transition:.4s ease;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
}

.service-card:last-child{
    border-right:none;
}

/* TOP LINE */

.service-card::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:0;
    height:4px;
    background:linear-gradient(
        90deg,
        #2459f4,
        #6ed8ff
    );
    transition:.5s;
}

.service-card:hover::before,
.service-card.active::before{
    width:100%;
}

/* BG */

.service-card:hover,
.service-card.active{
    background:linear-gradient(
        180deg,
        #ffffff,
        #f6fbff
    );
}

/* NUMBER */

.service-number{
    position:absolute;
    top:40px;
    left:50%;
    transform:translateX(-50%);
    font-size:90px;
    font-weight:800;
    line-height:1;
    color:transparent;
    -webkit-text-stroke:1px #d7d7d7;
    transition:.4s ease;
}

/* NUMBER HOVER */

.service-card:hover .service-number,
.service-card.active .service-number{

    background:linear-gradient(
        180deg,
        #49a8ff 0%,
        #7edcff 55%,
        #ffffff 100%
    );

    background-clip:text;
    -webkit-background-clip:text;

    color:transparent;
    -webkit-text-fill-color:transparent;
    -webkit-text-stroke:0;
}

/* ICON */

.icon-box{
    position:absolute;
    right:20px;
    top:20px;
    width:50px;
    height:50px;
    border-radius:10px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:22px;
    transition:.4s;
}

.service-card:hover .icon-box,
.service-card.active .icon-box{
    transform:translateY(-5px);
}

.blue{
    background:#e8f5ff;
}

.purple{
    background:#f2e7ff;
}

.red{
    background:#ffe8e8;
}

/* CONTENT */

.service-content{
    position:relative;
    z-index:2;
    margin-top:80px;
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
}


.service-content h3{
    font-size:22px;
    margin-bottom:8px;
    transition:.4s;
	color:#0E1A3C;
}

/* .service-card:hover h3,
.service-card.active h3{
    background:linear-gradient(
        90deg,
        #2459f4,
        #6ed8ff
    );

    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
} */

.service-content p{
    color:#202020;
    line-height:1.6;
    font-size:14px;
	min-height:150px;
}

/* BADGES */

.badges{
    display:flex;
    gap:10px;
    margin-top:25px;
}
.badges span{
    width:50px;
    height:50px;
    color:#fff;
    font-size:10px;
    display:flex;
    align-items:center;
    justify-content:center;

}
/* ==========================
EXPAND SECTION
========================== */

.extra-services{
    max-height:0;
    overflow:hidden;
    transition:max-height .8s ease;
}

.extra-services.show{
    max-height:1000px;
}
.number-gradinat {    
	background-image: url(../assets/images/gradinat.png); 
	position: absolute;
    background-position: top;
    background-repeat: no-repeat;
    top: 50px;
    z-index: 1;
    height: 100px;
    width: 200px;
	}

/* ==========================
BUTTON
========================== */

.portfolio-btn .arrow { font-weight:700; font-size:30px;}

.portfolio-btn{
    display:flex;
    justify-content:center;
    margin-top:40px;
}

.portfolio-btn a{
    width:260px;
    height:60px;
    border-radius:60px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    text-decoration:none;
    color:#fff;
    font-weight:600;
    background:linear-gradient(
        90deg,
        #2e5ef5,
        #69d2ff
    );
    box-shadow:0 10px 25px rgba(46,94,245,.2);
}

.arrow{
    transition:.3s;
}



/* =======================
SECTION
======================= */

.methodology-unified{
    position:relative;
    overflow:hidden;
    padding:100px 0;
    background:#0C101C;
}

/* =======================
TOP
======================= */

.top-row{
    display:flex;
    justify-content:space-between;
    gap:80px;
    margin-bottom:30px;
}

.left-title{
    max-width:700px;
}

.small-title{
    display:block;
    color:#0e1a3c;
    font-size:14px;
    margin-bottom:10px;
}
.section-why .small-title {
    display:block;
    color:#ffffff;
    font-size:14px;
    margin-bottom:10px;
}
.methodology-unified .small-title {
    display:block;
    color:#ffffff;
    font-size:14px;
    margin-bottom:10px;
}

.left-title h2{
    font-size:32px;
    line-height:1.1;
    font-weight:700; color:#ffffff;
}

.left-title h2 span{
      background: linear-gradient(90deg, #2459f4, #6ed8ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.right-title{
    max-width:550px;
}

.right-title p{
    color:#c5cbdb;
    line-height:1.6;
}

/* =======================
MAIN CONTENT
======================= */

.content{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:80px;
}

/* =======================
TIMELINE
======================= */

.timeline-unified{
    flex:1;
    position:relative;
    max-width:700px;
}

.connector{
    position:absolute;
    left:12px;
    top:0px;
    width:120px;
    height:520px;
}

.step{
    position:relative;
    display:flex;
    align-items:flex-start;
    gap:20px;
    margin-bottom:35px;
    padding-left:95px;
}

.step:last-child{
    margin-bottom:0;
}
.step .icon img { width:32px; }

/* horizontal connectors */

/* .step::before{
    content:"";
    position:absolute;
    left:40px;
    top:28px;
    width:45px;
    height:2px;
    background:rgba(255,255,255,.35);
    transition:.35s;
}

.step:hover::before{
    background:#58aaff;
}
 */
/* icons */

.icon{
    width:58px;
    height:58px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:24px;
    transition:.35s ease;
    flex-shrink:0;
}

.icon.blue{
    background: #BFD1FD;
    color: #5035ff;
    font-weight: 700;
    font-size: 24px;
}

.icon.green{
    background:#CEF2F5;
    color:#1ea56f;
	font-weight: 700;
    font-size: 24px;
}

.icon.cyan{
    background:#CFF8FF;
    color:#22a3ff;
	font-weight: 700;
    font-size: 24px;
}

.icon.orange{
    background:#FCEEDD;
    color:#ff8b1f;
	font-weight: 700;
    font-size: 24px;
}

.icon.purple{
    background:#F7DEFC;
    color:#b34dff;
	font-weight: 700;
    font-size: 24px;
}

.step:hover .icon{
    transform:scale(1.1);

    box-shadow:
    0 0 0 6px rgba(91,170,255,.12),
    0 0 30px rgba(91,170,255,.5);
}

.step-content h3{
    font-size:20px;
    margin-bottom:2px;
    transition:.35s;
	color:#ffffff;
	font-weight:600;
}

.step-content p{
    color:#c5cbdb;
    line-height:1.6;
	font-size:16px;
}

.step:hover h3{
    background:linear-gradient(
    90deg,
    #58aaff,
    #8be7ff
    );

    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

/* =======================
ADAPT WHEEL
======================= */

.wheel{
    width:560px;
    height:560px;
    position:relative;
    flex-shrink:0;
	margin-top:30px;
}


/* =======================
RESPONSIVE
======================= */

@media(max-width:1100px){

.content{
    flex-direction:column;
}

.top-row{
    flex-direction:column;
	padding: 0px 20px;
	gap: 20px;
}
.connector { display:none;}

.left-title h2{
    font-size:32px;
}

}

@media(max-width:768px){

.wheel{
    width:340px;
    height:340px;
}

.middle-ring{
    width:250px;
    height:250px;
}

.center-ring{
    width:150px;
    height:150px;
}

.center-ring h2{
    font-size:42px;
}

.step{
    padding:20px 20px 0px;
}

.step-content h3{
    font-size:22px;
}


.label{
    font-size:14px;
}

}

/* ==========================
RESPONSIVE
========================== */

@media(max-width:991px){

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

.service-card:nth-child(even){
    border-right:none;
}

.portfolio-top{
    flex-direction:column;
	padding: 0px 20px;
	    gap: 20px;
}

.portfolio-left h2{
    font-size:42px;
}

}

@media(max-width:767px){

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

.service-card{
    border-right:none;
    border-bottom:1px solid #ddd;
}

.portfolio-left h2{
    font-size:32px;
}

.service-number{
    font-size:90px;
}

}


.section-regulatory{
    padding:80px 30px;
	background-color: #F2F3F5;
	background-image: url('../assets/images/gnc-bg.png');
	background-repeat: no-repeat;
    background-position: bottom right;
}

/* HEADER */

.header-regulatory{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:60px;
    margin-bottom:10px;
}

.sub-title-regulatory{
    font-size:14px;
    color:#0e1a3c;
    margin-bottom:10px;
}

.heading-regulatory{
    font-size:32px;
    line-height:1.1;
    font-weight:700;
    color:#18214d;
}

.heading-regulatory span{
        background: linear-gradient(90deg, #2459f4, #6ed8ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.description-regulatory{
    max-width:550px;
    line-height:1.6;
    color:#000
}

/* ==========================
   FRAMEWORKS
========================== */

.framework-title-regulatory{
    font-size:16px;
    font-weight:600;
    margin-bottom:15px;
	color:#000000;
}

.logo-slider-regulatory{
    overflow:hidden;
    position:relative;
    padding:0px 0px;
}

.logo-track-regulatory{
    display:flex;
    align-items:center;
    gap:4px;
    width:max-content;
}

.logo-regulatory{
    width:82px;
    height:90px;
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    flex-shrink:0;
}
.logo-regulatory img { width:70px;}

.blue{background:#3768d8;}
.purple{background:#6a4cff;}
.orange{background:#f39c12;}
.red{background:#d63031;}
.indigo{background:#3949ab;}
.green{background:#2e7d32;}


/* NAVIGATION */

.slider-nav-regulatory{
    display:flex;
    justify-content:flex-end;
    gap:15px;
    margin-bottom:25px;
}

.nav-btn-regulatory{
    width:40px;
    height:40px;
    border-radius:50%;
    background:#fff;
    border:none;
    cursor:pointer;
    box-shadow:0 5px 15px rgba(0,0,0,.08);
    font-size:18px;
	font-weight:800;
}

/* COUNTRY CARDS */

.country-slider-regulatory{
    margin-bottom:70px;
}

.country-card-regulatory{
    background:#fff;
    border-radius:18px;
    padding:28px;
    min-height:230px;
    box-shadow:0 10px 25px rgba(0,0,0,.05);
    transition:.3s;
}

.country-card-regulatory:hover{
    transform:translateY(-5px);
}

.country-card-regulatory h3{
    margin-bottom:8px;
    font-size:18px;
	margin-top:5px;
}

.country-card-regulatory ul{
    list-style:none;
}

.country-card-regulatory li{
    margin-bottom:8px;
    color:#000;
	font-size:13px;
	font-weight:500;
	 background-image: url(../assets/images/sec-tick.svg);
	 background-repeat:no-repeat;
	 background-position:0% 40%;
	 padding-left:20px;
	
}

/* .country-card-regulatory li::before{
    background-image: url(../assets/images/sec-tick.svg);
    font-size:10px;
    margin-right:10px;
} */

/* RESPONSIVE */

@media(max-width:991px){

    .header-regulatory{
        flex-direction:column;
		    gap: 20px;
    }

    .heading-regulatory{
        font-size:42px;
    }
}

@media(max-width:576px){

    .section-regulatory{
        padding:60px 20px;
    }

    .heading-regulatory{
        font-size:32px;
    }

    .country-card-regulatory{
        min-height:auto;
    }
}


/* ==========================
   SECTION
========================== */

.engage-section{
    position:relative;
    overflow:hidden;
    padding:80px 40px 120px;
	background-color:#0C101C;
	background-image: url(../assets/images/engage-bg.png);
    background-repeat: no-repeat;
    background-position: top center;
}

/* ==========================
   HEADER
========================== */

.header-engage{
    display:flex;
    justify-content:space-between;
    gap:60px;
    margin-bottom:100px;
}

.sub-title-engage{
    color:#cbd5e1;
    font-size:13px;
    margin-bottom:10px;
}

.heading-engage{
    font-size:32px;
    font-weight:700;
    line-height:1.1;
	color:#ffffff;
}

.heading-engage span{
       background: linear-gradient(90deg, #2459f4, #6ed8ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.header-right-engage{
    max-width:550px;
}

.header-right-engage p{
    color:#c5cbdb;
    line-height:1.6;
    font-size:15px;
}

/* ==========================
   CARDS
========================== */

.cards-engage{
    display:grid;
    grid-template-columns:repeat(4,1fr);
}

.card-engage{
    position:relative;
    padding:0 25px;
}

.card-engage h3 { color:#ffffff; margin-bottom:10px;}

/* Divider Line */

.card-engage:not(:last-child)::after{
    content:"";
    position:absolute;
    top:0;
    right:0;
    width:1px;
    height:100%;
    background:rgba(255,255,255,.12);
}

/* ==========================
   ICON
========================== */

.icon-engage{
    width:90px;
    height:90px;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    margin-left:auto;
    margin-bottom:20px;
}

.icon-engage img{
    width:100%;
    max-width:70px;
	 height:auto;
    display:block;
}

/* ==========================
   MODE TAG
========================== */

.mode-engage{
    display:inline-block;
    padding:10px 18px;
    border-radius:30px;
    background:rgba(255,255,255,.12);
    font-size:12px;
    margin-bottom:20px;
	color:#ffffff;
}

/* ==========================
   CARD TITLE
========================== */

.card h3{
    font-size:18px;
    line-height:1.4;
    margin-bottom:15px;
}

/* ==========================
   CARD TEXT
========================== */

.card-engage p{
    color:#c3ccda;
    line-height:1.6;
    font-size:14px;
}

/* ==========================
   TABLET
========================== */

@media(max-width:1100px){

    .cards-engage{
        grid-template-columns:repeat(2,1fr);
        gap:50px;
    }

    .card-engage:nth-child(2)::after{
        display:none;
    }

    .heading-engage{
        font-size:44px;
    }
}

/* ==========================
   MOBILE
========================== */

@media(max-width:768px){

    .engage-section-engage{
        padding:60px 20px;
    }

    .header-engage{
        flex-direction:column;
        margin-bottom:20px;
		    gap: 20px;
    }
	.icon-engage { margin-bottom:0px;}


    .heading-engage{
        font-size:34px;
    }

    .cards-engage{
        grid-template-columns:1fr;
        gap:50px;
    }

    .card-engage{
        padding:0;
    }

    .card-engage::after{
        display:none;
    }

    .engage-section::before{
        width:500px;
        height:250px;
        top:180px;
    }
}

/* ==========================
   industry start
========================== */

.section-industry{
    max-width:1320px;
    margin:auto;
    padding:80px 20px;
}

.header-industry{
    display:flex;
    justify-content:space-between;
    gap:60px;
    margin-bottom:60px;
}

.left-industry h2{
    font-size:32px;
    line-height:1.1;
    color:#1a2452;
    max-width:650px;
}
.left-industry .sub-title-engage { color:#0e1a3c; font-size: 14px;
    margin-bottom: 10px; }

.left-industry h2 span{
    background: linear-gradient(90deg, #2459f4, #6ed8ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.right-industry{
    max-width:550px;
    color:#000;
    line-height:1.6;
	margin-top: 20px;
}

/* SLIDER AREA */

.slider-area-industry{
    position:relative;
    height:520px;
    overflow:hidden;
	max-width: 1000px;
    margin: 0 auto;
}

/* SIDE GRADIENTS */

.slider-area-industry::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:180px;
    height:100%;
    z-index:5;
   background: linear-gradient(to right, rgb(255 255 255 / 90%), rgba(199, 115, 115, 0));
}
.slider-area-industry::after{
    content:"";
    position:absolute;
    right:0;
    top:0;
    width:180px;
    height:100%;
    z-index:5;
    background: linear-gradient(to left, rgb(255 255 255 / 90%), rgba(199, 115, 115, 0));
}
.columns-industry{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
    height:100%;
}
/* COLUMN */

.column-industry{
    display:flex;
    flex-direction:column;
    gap:20px;
}
/* CARD */

.card-industry{
    background:#fff;
    border:1px solid #d7deef;
    border-radius:20px;
    padding:20px 20px;
    text-align:center;
    min-height:160px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;

    box-shadow:0 10px 25px rgba(0,0,0,.05);
}

.icon-industry{
    width:72px;
    height:72px;
    background:#E2F9FF;
    border-radius:10px;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:34px;
    margin-bottom:15px;
}
.icon-industry img { width:40px;}

 .purplee {background: #F7DEFC !important; }
 .orangee {background: #FCEEDD !important; }     
  .bluee {background: #BFD1FD !important; }
    .greenn {background: #DDF5CE !important; }

.card-industry h3{
    font-size:18px;
    line-height:1.3;
}

/* ANIMATION */

.up-industry{
    animation:scrollUp 18s linear infinite;
}

.down-industry{
    animation:scrollDown 18s linear infinite;
}

@keyframes scrollUp{
    from{
        transform:translateY(0);
    }
    to{
        transform:translateY(-50%);
    }
}

@keyframes scrollDown{
    from{
        transform:translateY(-50%);
    }
    to{
        transform:translateY(0);
    }
}

/* RESPONSIVE */

@media(max-width:991px){

    .header-industry{
        flex-direction:column;
		    gap: 20px;
    }


    .left-industry h2{
        font-size:38px;
    }

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

@media(max-width:576px){

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

    .slider-area-industry{
        height:700px;
    }

    .left-industry h2{
        font-size:30px;
    }
}


/* =========================
   SECTION CTA Section
========================= */

.cta-section-contact{
    position:relative;
    overflow:hidden;
    padding:90px 20px;
    background:
    radial-gradient(circle at 100% 0%,
    rgba(59,130,246,.25),
    transparent 35%),
    linear-gradient(
    90deg,
    #020617 0%,
    #02081c 50%,
    #030b28 100%);
}

.container-contact{
    max-width:1120px;
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:80px;
}

/* =========================
   CONTENT
========================= */

.content-contact{
    flex:1;
    text-align:center;
}

.subtitle-contact{
    color:#cbd5e1;
    font-size:14px;
    margin-bottom:15px;
	text-align: right;
}

.title-contact{
    font-size:32px;
    font-weight:700;
    line-height:1.1;
    color:#fff;
    margin-bottom:10px;
	    text-align: right;
}

.title-contact span{
        background: linear-gradient(90deg, #2459f4, #6ed8ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.description-contact{   
    color:#c5cbdb;
    font-size:16px;
    line-height:1.6;
	text-align:right;
}

/* =========================
   CONTACT CARD
========================= */

.contact-card-contact{
    width:420px;
    border:1px solid rgba(130,170,255,.5);
    border-radius:24px;
    overflow:hidden;
    backdrop-filter:blur(8px);
}

.contact-row-contact{
    display:flex;
    align-items:center;
    gap:18px;
    padding:30px;
    color:#fff;
}

.contact-row-contact:first-child{
    border-bottom:1px solid rgba(130,170,255,.4);
}

.icon-contact{
    width:34px;
    height:24px;
    flex-shrink:0;
}

.icon-contact svg{
    width:100%;
    height:100%;
    fill:#3b82f6;
}

.contact-text-contact{
    font-size:20px;
    font-weight:500;
    word-break:break-word;
}

/* =========================
   HOVER EFFECT
========================= */

.contact-card-contact:hover{
    border-color:#3b82f6;
    box-shadow:0 0 30px rgba(59,130,246,.25);
    transition:.35s ease;
}

/* =========================
   TABLET
========================= */

@media(max-width:991px){

    .container-contact{
        flex-direction:column;
        text-align:center;
        gap:50px;
    }

    .title-contact{
        font-size:42px;
    }

    .contact-card-contact{
        width:100%;
        max-width:500px;
    }
}

/* =========================
   MOBILE
========================= */

@media(max-width:576px){

    .cta-section-contact{
        padding:70px 15px;
    }

    .title-contact{
        font-size:32px;
		text-align:center;
    }

    .description-contact{
        font-size:14px;
    }

    .contact-row-contact{
        padding:22px;
    }

    .contact-text-contact{
        font-size:16px;
    }
		.subtitle-contact { text-align:cemter;}

    .icon-contact{
        width:28px;
        height:28px;
    }
}

.partners-section{
    max-width:1320px;
    margin:auto;
	    padding: 80px 0px;
}

.partners-title{
    text-align:center;
    font-size:32px;
    font-weight:700;
    color:#1b2552;
    margin-bottom:40px;
}
.partners-title span { background: linear-gradient(90deg, #2459f4, #6ed8ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;  }

/* ROWS */
.partner-row{
    display:flex;
    justify-content:center;
    gap:18px;
    margin-bottom:18px;
    flex-wrap:wrap;
}

/* CARD */
.partner-card{
    width:200px;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:all .35s ease;
    cursor:pointer;
}
/* LOGO */
.partner-card img{
    max-width:100%;
    object-fit:contain;
    transition:all .4s ease;
    /* Default faded */
    filter:grayscale(100%) opacity(.65);
}

/* Hover Card */

.partner-card:hover{
    transform:translateY(-6px);

    border-color:#c7d0e0;

    box-shadow:
        0 15px 35px rgba(0,0,0,.12),
        0 5px 15px rgba(0,0,0,.08);
}

/* Hover Logo */

.partner-card:hover img{
    filter:grayscale(0%) opacity(1);
    transform:scale(1.08);
}

/* Optional:
   fade all others when hovering row */

.partner-row:hover .partner-card img{
    filter:grayscale(100%) opacity(.15);
}

.partner-row .partner-card:hover img{
    filter:grayscale(0%) opacity(1);
}

/* Tablet */

@media(max-width:768px){

    .partners-title{
        font-size:40px;
    }

    .partner-card{
        width:145px;
        height:65px;
    }
}

/* Mobile */

@media(max-width:576px){

    .partners-title{
        font-size:30px;
    }

    .partner-card{
        width:130px;
        height:60px;
    }

    .partner-row{
        gap:10px;
    }
}

/* ========== Buttons ========== */

.footer-social { width: 100%;    padding: 18px 0px;    display: flex;    gap: 15px; }
.btn {
  padding: 14px 28px; border-radius: 50px; font-weight: 600; font-size: 16px;
  display: inline-flex; align-items: center; gap: 10px;
  transition: all 0.2s; cursor: pointer; border: none;
  font-family: var(--font);
}
.btn-primary {
  background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan));
  color: white; box-shadow: 0 10px 24px rgba(20, 87, 224, 0.3);
}
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 14px 32px rgba(20, 87, 224, 0.4); }
.btn-ghost { background: white; color: var(--brand-navy); border: 1.5px solid var(--line); }
.btn-ghost:hover { border-color: var(--brand-blue); color: var(--brand-blue); }
.btn-outline-blue { background: white; color: var(--brand-blue); border: 1.5px solid var(--brand-blue); }
.btn-outline-blue:hover { background: var(--brand-blue); color: white; }

/* ========== Hero (homepage style) ========== */
.hero {
  position: relative; padding: 10px 0 60px;
  background:#0c101c;
  overflow: hidden;
}
.hero::before {
  content: ""; position: absolute; top: 10%; right: -5%;
  width: 600px; height: 600px;
  background-image: radial-gradient(circle, rgba(20, 87, 224, 0.1) 2px, transparent 2px);
  background-size: 30px 30px; opacity: 0.5;
  mask-image: radial-gradient(ellipse at center, black, transparent 70%);
}
.hero-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 60px; align-items: center; position: relative; z-index: 1; }
.hero-grid .reveal h1 { color:#ffffff;}

.hero-grid .reveal p {color: #c8cad1;}
@media (max-width: 980px) { .hero-grid { grid-template-columns: 1fr; gap: 40px; } }
.hero h1 { font-size: clamp(36px, 5.5vw, 55px); line-height: 1.1; margin: 4px 0 22px; }
.hero h1 .accent {
  background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.hero-sub { font-size: 17px; line-height: 1.65; max-width: 540px; }
.hero-actions { margin-top: 32px; display: flex; gap: 14px; flex-wrap: wrap; }
.hero-stats { margin-top: 10px; display: flex; gap: 40px; flex-wrap: wrap; }
.hero-stat { padding-left: 16px; border-left: 3px solid var(--brand-cyan); }
.hero-stat-num { font-size: 28px; font-weight: 700; color: #ffffff; line-height: 1; }
.hero-stat-lbl { font-size: 12px; color: #c8cad1; margin-top: 6px; }
.hero-illustration { position: relative; aspect-ratio: 1 / 0.95; display: grid; place-items: center; }
.hero-illustration svg { width: 100%; max-width: 480px; }
#about-overview {padding-top: clamp(50px, 9vw, 40px);    padding-bottom: clamp(50px, 9vw, 40px);    position: relative; }
	
.about-grid {display: grid;  grid-template-columns: 1fr 1.2fr; gap: clamp(40px, 6vw, 100px); margin-top: 30px; align-items: start;}
#about-overview h2 {font-size: clamp(28px, 4vw, 32px);    margin: 10px 0 16px;}
	
#about-overview em {background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan)); -webkit-background-clip: text; background-clip: text;
    color: transparent;}
.stats-wrapper{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
}
.about-threat { text-align:left;}
.about-threat em { font-weight:500; color:#000 !important; }
.about-grid p {
    font-size: 16px;
    color: #000;
    line-height: 1.7;
    margin: 0 0 20px 0;
}
.pull-quote {
    font-style: italic;
    font-weight: 400;
    font-size: clamp(22px, 2.8vw, 32px);
    line-height: 1.3;
    color: #000;
    margin: 32px 0 0 0;
    max-width: 22ch;
    padding-left: 24px;
    border-left:2px solid #ccc;
}
.about-tag {
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.35em;
    color: #40b4e7;
    padding-top: 12px;
	margin-bottom: 20px;
	font-weight: 600;
    border-top: 1px solid rgb(221 221 221 / 14%);
	background: linear-gradient(84deg, var(--brand-blue), var(--brand-cyan));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.saudi-tag { color: #006c35;    font-weight: 600; }
.qatar-tag { color: #8a1538;    font-weight: 600; }
.uae-tag { color: #00843d;    font-weight: 600; }
.india-tag { color: #ff671b;    font-weight: 600; }

.stat-box{
    display:flex;
    align-items:flex-start;
    gap:10px;
    padding:0px 32px 0px 0px;
    min-width:250px;
}

.stat-box:not(:first-child){
    border-left:2px solid #00d9ff;
}

.stat-icon img{
    width:50px;
    height:50px;
    object-fit:contain;padding-left:10px;
}

.stat-content h2{
    color:#ffffff;
    font-size:30px;
    font-weight:700;
    line-height:1;
    margin-bottom:10px;
}

.stat-content p{
    color:#d1d5db;
    font-size:15px;
    line-height:1.4;
}

.country-text{
    font-size:30px !important;
    letter-spacing:1px;
}

@media(max-width:768px){

    .stats-wrapper{
        flex-direction:column;
        align-items:flex-start;
        gap:30px;
    }

    .stat-box{
        border-left:3px solid #00d9ff !important;
        padding-left:25px;
    }

}



/* ========== Page hero (interior pages) ========== */

.service1-bg { 
   background: radial-gradient(
    circle at top left,
    #244a73 0%,
    rgba(36, 74, 115, 0.35) 18%,
    transparent 40%
),
radial-gradient(
    circle at bottom right,
    rgba(94, 45, 170, 0.45) 0%,
    transparent 30%
),
linear-gradient(
    90deg,
    #071427 0%,
    #02081b 50%,
    #02071a 100%
);
}

.data-privacy-grdinat{
 background: radial-gradient(circle at center, rgba(20, 15, 80, 0.55) 0%, rgba(20, 15, 80, 0.25) 40%, transparent 75%), linear-gradient(135deg, #2b7f92 0%, #192b7c 30%, #25227e 65%, #5530d6 100%);
}

.cyber-operate-grdinat-partner{
     background: radial-gradient(circle at center, rgba(20, 15, 80, 0.55) 0%, rgba(20, 15, 80, 0.25) 40%, transparent 75%), linear-gradient(135deg, #2b7f92 0%, #192b7c 30%, #410B73 65%, #410B73 100%);
}

.cyber-operate-grdinat{
     background: radial-gradient(circle at center, rgba(20, 15, 80, 0.55) 0%, rgba(20, 15, 80, 0.25) 40%, transparent 75%), linear-gradient(135deg, #2b7f92 0%, #192b7c 30%, #410B73 65%, #410B73 100%);
}

.digital-foren-grdinat{
      background: radial-gradient(circle at center, rgba(20, 15, 80, 0.55) 0%, rgba(20, 15, 80, 0.25) 40%, transparent 75%), linear-gradient(135deg, #377bc2 0%, #2f1f76 30%, #311170 65%, #4b1da8 100%);
}


.compromis-foren-grdinat{
         background: radial-gradient(circle at center, rgba(20, 15, 80, 0.55) 0%, rgba(20, 15, 80, 0.25) 40%, transparent 75%), linear-gradient(135deg, #00435e 0%, #0C101C 30%, #0C101C 65%, #281156 100%);
}
.compromis-foren-grdinat img {     filter: drop-shadow(1px 1px 80px rgba(244, 4, 148, 0.4));}


.oat-foren-grdinat{
         background: radial-gradient(circle at center, rgba(20, 15, 80, 0.55) 0%, rgba(20, 15, 80, 0.25) 40%, transparent 75%), linear-gradient(135deg, #00435e 0%, #0C101C 30%, #0C101C 65%, #281156 100%);
}
.oat-foren-grdinat img { filter: drop-shadow(0px 8px 52px rgba(4, 136, 244, 0.5));}

.compliance-foren-grdinat{
       background: radial-gradient(circle at center, rgba(20, 15, 80, 0.55) 0%, rgba(20, 15, 80, 0.25) 50%, transparent 75%), linear-gradient(135deg, #00435e 0%, #0D0B59 20%, #43A0F2 85%, #43A0F2 100%);
}
.compliance-foren-grdinat img { filter: drop-shadow(4px 4px 90px rgba(244, 4, 148, 0.4));}

.digital-foren-grdinat img { filter: drop-shadow(0 40px 96px rgba(14, 72, 244, 0.8)); }
.cyber-operate-grdinat img { filter: drop-shadow(0px 4px 82px rgba(244, 4, 220, 0.8)); }
 .data-privacy-grdinat img  { filter: drop-shadow(0px 14px 66px rgba(4, 167, 244, 0.5)); }

.page-hero {
  position: relative; padding: 60px 0 50px;
/*   background:
    radial-gradient(700px 400px at 85% 20%, rgba(0, 184, 217, 0.1), transparent 65%),
    linear-gradient(180deg, var(--bg-soft) 0%, var(--bg) 100%); */
  overflow: hidden;
}
.page-hero::before {
  content: ""; position: absolute; top: 0; right: 0; width: 300px; height: 300px;
  background-image: radial-gradient(circle, rgba(20, 87, 224, 0.12) 1.5px, transparent 1.5px);
  background-size: 24px 24px;
  mask-image: radial-gradient(ellipse at top right, black, transparent 70%);
}
.inner-page-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: center; position: relative; z-index: 1; }
.page-hero-grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 50px; align-items: center; position: relative; z-index: 1; }
@media (max-width: 980px) { .page-hero-grid { grid-template-columns: 1fr; gap: 30px; } }
.breadcrumb { display: flex; gap: 10px; font-size: 13px; color: var(--ink-mute); margin-bottom: 6px; flex-wrap: wrap; }
.breadcrumb a { color: var(--ink-mute); transition: color 0.2s; }
.breadcrumb a:hover { color: #00aaff; }
.breadcrumb span:last-child { color: #fff; font-weight: 500; }
.page-hero h1 { font-size: clamp(30px, 4.5vw, 40px); line-height: 1.10; margin: 5px 0 18px; color:#ffffff; }
.page-hero h1 span {
background: linear-gradient(90deg, #2459f4, #6ed8ff);
    -webkit-background-clip: text;
-webkit-text-fill-color: transparent;}
.page-hero-sub { font-size: 17px; line-height: 1.45; }
.page-hero-grid .reveal p { color:#f1f1f1; font-size:16px; margin-bottom: 30px; }
.inner-page-grid .reveal p { color:#f1f1f1; font-size:16px; margin-bottom: 30px; }

/* ========== Section base ========== */
section.block { padding: 80px 0; }
@media (max-width: 640px) { section.block { padding: 60px 0; } }
.section-head { text-align: center; max-width: 1320px; margin: 0 auto 26px; }
.section-head.left { text-align: left; margin: 0 0 28px; }
.section-head h2 { font-size: clamp(28px, 4vw, 36px); margin: 10px 0 16px; }
.section-head h2 span { 
background: linear-gradient(90deg, #2459f4, #6ed8ff);
    -webkit-background-clip: text;
-webkit-text-fill-color: transparent;}

.section-head h2 em { background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan)); -webkit-background-clip:text; background-clip: text;    color: transparent; }
.section-head p { font-size: 17px; }

/* ========== Card grids (3 col, 2 col) ========== */
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.grid-6 { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; }
@media (max-width: 980px) { .grid-3, .grid-4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; } }

.icon-card {
  background: white; border: 1px solid var(--line); border-radius: 16px;
  padding: 28px 24px; transition: all 0.25s; position: relative;
}
.icon-card:hover { border-color: var(--brand-cyan); box-shadow: var(--shadow); transform: translateY(-4px) !important; }
.icon-card .svc-icon, .svc-icon {
  width: 54px; height: 54px; border-radius: 12px;
  background: var(--brand-cyan-soft); color: var(--brand-cyan);
  display: grid; place-items: center; margin-bottom: 18px; transition: all 0.25s;
}

.svc-icon-mg { padding:0px 0px 20px;}
.icon-card:hover .svc-icon {
  background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan)); color: white;
}
.svc-icon svg { width: 26px; height: 26px; }
.icon-card h4  { font-size: 18px; margin-bottom: 8px; line-height:1.4; }
.icon-card h4 span { background: linear-gradient(90deg, #2459f4, #6ed8ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;}
.icon-card p { font-size: 14px; line-height: 1.55; }

/* ========== Platform cards (homepage flagship) ========== */
.platforms { background: var(--bg-soft); position: relative; }
.platforms::before {
  content: ""; position: absolute; inset: 0;
  background-image: linear-gradient(rgba(20, 87, 224, 0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(20, 87, 224, 0.04) 1px, transparent 1px);
  background-size: 40px 40px;
  mask-image: radial-gradient(ellipse at center, black, transparent 80%);
}
.platform-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; position: relative; z-index: 1; }
@media (max-width: 980px) { .platform-grid { grid-template-columns: 1fr; } }
.platform-card {
  background: white; border-radius: 14px; padding: 30px 20px;
  box-shadow: var(--shadow-sm); border: 1px solid var(--line);
  position: relative; overflow: hidden; transition: all 0.3s;
}
.platform-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.platform-card::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px;
  background: linear-gradient(90deg, var(--brand-blue), var(--brand-cyan));
}
.platform-card.violet::before { background: linear-gradient(90deg, var(--brand-violet), var(--brand-cyan)); }
.platform-card.cyan::before { background: linear-gradient(90deg, var(--brand-cyan), var(--brand-blue)); }
.platform-icon {
  width: 64px; height: 64px; border-radius: 16px;
  background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan));
  display: grid; place-items: center; color: white; margin-bottom: 22px;
  box-shadow: 0 8px 20px rgba(20, 87, 224, 0.25);
}
.platform-card.violet .platform-icon { background: linear-gradient(135deg, var(--brand-violet), var(--brand-cyan)); }
.platform-card.cyan .platform-icon { background: linear-gradient(135deg, var(--brand-cyan), var(--brand-blue)); }
.platform-icon svg { width: 30px; height: 30px; }
.platform-card h3 { font-size: 18px; margin-bottom: 12px; }
.platform-card p { font-size: 14.5px; line-height: 1.6; margin-bottom: 20px; }
.platform-card ul { list-style: none; }
.platform-card ul li { padding: 8px 0; font-size: 13px; color:#202020; display: flex; gap: 10px; align-items: flex-start; }
.platform-card ul li::before { content: "✓"; color: var(--brand-cyan); font-weight: 700; flex-shrink: 0; }
.platform-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 20px; color: var(--brand-blue); font-weight: 600; font-size: 14px; transition: gap 0.2s; }
.platform-link:hover { gap: 14px; }

/* ========== Process grid (dark band) ========== */
.process { background: var(--brand-navy); color: white; position: relative; overflow: hidden; }
.process::before {
  content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(700px 400px at 10% 20%, rgba(0, 184, 217, 0.15), transparent 60%),
    radial-gradient(600px 400px at 90% 80%, rgba(20, 87, 224, 0.15), transparent 60%);
}
.process .section-head h2 { color: white; }
.process .section-head p { color: rgba(255, 255, 255, 0.7); }
.process .pill { background: rgba(0, 184, 217, 0.15); color: var(--brand-cyan); }
.process-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; position: relative; z-index: 1; }
@media (max-width: 980px) { .process-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px) { .process-grid { grid-template-columns: 1fr; } }
.process-step {
  background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px; padding: 28px 22px; backdrop-filter: blur(10px); transition: all 0.25s;
}
.process-step:hover { background: rgba(255, 255, 255, 0.08); border-color: var(--brand-cyan); transform: translateY(-4px); }
.step-badge {
  display: inline-block;
  background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan));
  color: white; font-weight: 700; width: 36px; height: 36px;
  border-radius: 10px; text-align: center; line-height: 36px; font-size: 14px; margin-bottom: 16px;
}
.process-step h4 { color: white; font-size: 16px; margin-bottom: 8px; }
.process-step p { color: rgba(255, 255, 255, 0.7); font-size: 13px; line-height: 1.55; }

/* ========== Compliance band ========== */
.compliance-band { padding: 60px 0; background: var(--bg-soft); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.compliance-band h3 { text-align: center; font-size: 14px; color: var(--ink-mute); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 30px; font-weight: 600; }
.compliance-row { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }
.framework {
  padding: 12px 22px; background: white; border: 1px solid var(--line);
  border-radius: 10px; font-weight: 600; font-size: 13px; color: var(--brand-navy);
  transition: all 0.2s;
}
.framework:hover { border-color: var(--brand-cyan); color: var(--brand-blue); transform: translateY(-2px); box-shadow: var(--shadow-sm); }

/* ========== Partners grid ========== */
.partners-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; align-items: center; }
@media (max-width: 880px) { .partners-grid { grid-template-columns: repeat(3, 1fr); } }
.partner-logo {
  height: 70px; background: #fff; border: 1px solid var(--line);
  border-radius: 6px; display: grid; place-items: center;
  font-weight: 600; color: var(--ink-mute); font-size: 14px; transition: all 0.2s; padding: 0 12px; text-align: center;
}
.partner-logo img { width:120px;}
.partner-logo:hover { background: white; color: var(--brand-navy); border-color: var(--brand-cyan); box-shadow: var(--shadow-sm); }

/* ========== Contact CTA band ========== */
.contact-cta {
  background: linear-gradient(135deg, var(--brand-navy) 0%, var(--brand-blue) 100%);
  color: white; padding: 80px 0; position: relative; overflow: hidden;
}
.contact-cta::before {
  content: ""; position: absolute; top: -50%; right: -10%;
  width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(0, 184, 217, 0.25), transparent 60%); border-radius: 50%;
}
.contact-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 40px; align-items: center; position: relative; z-index: 1; }
@media (max-width: 880px) { .contact-grid { grid-template-columns: 1fr; text-align: center; } }
.contact-cta h2 { color: white; font-size: clamp(28px, 4vw, 38px); margin-bottom: 14px; }
.contact-cta p { color: rgba(255, 255, 255, 0.85); font-size: 17px; }
.contact-phone {
  background: rgba(255, 255, 255, 0.08); border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 16px; padding: 24px 28px; backdrop-filter: blur(10px);
}
.contact-phone small { color: rgba(255, 255, 255, 0.7); font-size: 13px; letter-spacing: 0.05em; text-transform: uppercase; }
.contact-phone .phone-num { font-size: 26px; font-weight: 700; color: white; display: block; margin: 8px 0 16px; }
.contact-phone .btn-primary { background: white; color: var(--brand-blue); box-shadow: 0 8px 20px rgba(0,0,0,0.2); }

/* ========== Careers band ========== */
.careers-band { padding: 70px 0; text-align: center; background: var(--bg); }
.careers-band .hashtag { color: var(--brand-cyan); font-weight: 700; font-size: 14px; letter-spacing: 0.06em; }
.careers-band h2 { font-size: 32px; margin: 14px 0 14px; }
.careers-band p { max-width: 640px; margin: 0 auto 26px; font-size: 16px; }

/* ========== Footer ========== */
footer { background: var(--brand-navy-dark); color: rgba(255, 255, 255, 0.7); padding: 70px 0 30px; }
.footer-grid { display: grid; grid-template-columns: 2fr 1.2fr 1.2fr 1fr; gap: 50px; margin-bottom: 50px; }
@media (max-width: 880px) { .footer-grid { grid-template-columns: 1fr 1fr; gap: 36px; } }
@media (max-width: 480px) { .footer-grid { grid-template-columns: 1fr; } }
footer .brand { color: white; }
footer .brand-text { color: rgba(255,255,255,0.7); margin-top: 14px; font-size: 14px; line-height: 1.6; max-width: 320px; }
footer h5 { color: white; font-size: 14px; font-weight: 600; margin-bottom: 18px; letter-spacing: 0.05em; text-transform: uppercase; }
footer ul { list-style: none; }
footer ul li a { display: block; padding: 6px 0; color: rgba(255, 255, 255, 0.7); font-size: 14px; transition: color 0.2s; }
footer ul li a:hover { color: var(--brand-cyan); }
.footer-contact { display: flex; flex-direction: column; gap: 12px; }
.footer-contact-item { display: flex; gap: 12px; align-items: flex-start; font-size: 14px; }
.footer-contact-item a:hover { color:#00b8d9; }
.footer-contact-item svg { width: 18px; height: 18px; color: var(--brand-cyan); flex-shrink: 0; margin-top: 2px; }
.threatsview-badge {
  margin-top: 24px; padding: 14px 16px; background: rgba(255,255,255,0.04);
  border-radius: 12px; display: flex; align-items: center; gap: 12px;
  border: 1px solid rgba(255,255,255,0.08);
}
.threatsview-badge .tv-logo {
  width: 36px; height: 36px; border-radius: 8px;
  background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan));
  display: grid; place-items: center; color: white; font-weight: 800;
}
.threatsview-badge small { display: block; color: rgba(255,255,255,0.6); font-size: 11px; }
.threatsview-badge strong { color: white; font-size: 14px; }
.footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.08); padding-top: 24px;
 /*  display: flex; justify-content: space-between; */ align-items: center;
  font-size: 13px; flex-wrap: wrap; gap: 12px;     text-align: center;
}

/* ========== Terminal (AI Automated Pentest) ========== */
.terminal {
  background: #050709; border: 1px solid #1d2733;
  font-family: var(--mono); font-size: 12px; overflow: hidden;
  box-shadow: 0 30px 60px -20px rgba(0,0,0,0.4), 0 0 0 1px var(--line);
  border-radius: 12px;
}
.terminal-head {
  background: #0d1117; padding: 10px 14px;
  display: flex; align-items: center; gap: 8px;
  border-bottom: 1px solid #1d2733;
}
.terminal-dot { width: 10px; height: 10px; border-radius: 50%; }
.terminal-dot.r { background: #ff5f56; } .terminal-dot.y { background: #ffbd2e; } .terminal-dot.g { background: #27c93f; }
.terminal-title { font-size: 11px; color: #8895b3; margin-left: 10px; }
.terminal-body { padding: 20px; line-height: 1.85; min-height: 380px; }
.term-line { color: #a9b3c1; }
.term-prompt { color: #b6ff3c; }
.term-success { color: #b6ff3c; }
.term-warn { color: var(--brand-amber); }
.term-crit { color: var(--brand-crimson); }
.term-key { color: #f4f1ea; }
.term-info { color: #00b8d9; }
.term-cursor { display: inline-block; width: 8px; height: 14px; background: #b6ff3c; animation: blink 1s steps(1) infinite; vertical-align: text-bottom; }
@keyframes blink { 50% { opacity: 0; } }

/* ========== Dashboard mock (ThreatsView) ========== */
.dashboard {
  background: white; border: 1px solid var(--line); padding: 22px;
  box-shadow: var(--shadow-lg); border-radius: 14px;
}
.dash-header {
  display: flex; justify-content: space-between; align-items: center;
  padding-bottom: 14px; border-bottom: 1px solid var(--line); margin-bottom: 18px;
}
.dash-title { font-family: var(--mono); font-size: 11px; color: var(--ink-mute); letter-spacing: 0.1em; text-transform: uppercase; }
.dash-live { display: inline-flex; align-items: center; gap: 6px; font-family: var(--mono); font-size: 10px; color: var(--brand-green); }
.dash-live::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--brand-green); animation: pulse 1.6s infinite; }
@keyframes pulse { 50% { opacity: 0.3; } }
.dash-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 18px; }
.dash-stat { padding: 14px; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 10px; }
.dash-stat-val { font-size: 26px; line-height: 1; font-weight: 700; color: var(--brand-navy); }
.dash-stat-val.crit { color: var(--brand-crimson); }
.dash-stat-val.warn { color: var(--brand-amber); }
.dash-stat-val.ok { color: var(--brand-green); }
.dash-stat-lbl { font-family: var(--mono); font-size: 9px; color: var(--ink-mute); letter-spacing: 0.08em; text-transform: uppercase; margin-top: 6px; }
.dash-row { display: flex; align-items: center; justify-content: space-between; padding: 10px 0; border-bottom: 1px dashed var(--line); font-family: var(--mono); font-size: 11px; gap: 8px; }
.dash-row:last-child { border-bottom: none; }
.dash-row .col1 { color: var(--brand-navy); font-weight: 600; }
.dash-row .col2 { color: var(--ink-mute); }
.pill-tag { font-family: var(--mono); font-size: 9px; padding: 3px 7px; border: 1px solid currentColor; letter-spacing: 0.06em; text-transform: uppercase; border-radius: 4px; }
.pill-tag.crit { color: var(--brand-crimson); background: rgba(255,90,77,0.08); }
.pill-tag.warn { color: var(--brand-amber); background: rgba(245,166,35,0.08); }
.pill-tag.ok { color: var(--brand-green); background: rgba(16,185,129,0.08); }

/* ========== Reveal animation ========== */
.reveal { opacity: 0; transform: translateY(20px); transition: all 0.7s cubic-bezier(0.2, 0.8, 0.2, 1); }
.reveal.in { opacity: 1; transform: translateY(0); }

/* ========== Generic two-column content section ========== */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
@media (max-width: 980px) { .split { grid-template-columns: 1fr; gap: 30px; } }
.split.reverse > div:first-child { order: 2; }
@media (max-width: 980px) { .split.reverse > div:first-child { order: 0; } }

/* ========== Methodology block (used on service pages) ========== */
.methodology { background: var(--bg-soft); }
.method-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

.method-card:hover { border-color: var(--brand-cyan);
    box-shadow: var(--shadow);
    transform: translateY(-4px) !important; }
@media (max-width: 880px) { .method-grid { grid-template-columns: 1fr; } }
.method-card {
  background: white; border: 1px solid var(--line); border-radius: 8px;
  padding: 16px 10px; position: relative; overflow: hidden; text-align:center;
}
.method-card .phase-tag {
  display: inline-block;
  font-family: var(--mono); font-size: 12px;
      background: #daf4f9;
    color: #000000;
  padding: 4px 10px; border-radius: 50px; font-weight: 600;
  letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 14px;
}
.method-card h4 { font-size: 18px; margin-bottom: 10px;     line-height: 18px;}
.method-card p { line-height: 1.4; margin-bottom: 14px; }
.method-card ul { list-style: none; }
.method-card ul li { font-size: 13px; padding: 5px 0; color: var(--ink-2); display: flex; gap: 8px; }
.method-card ul li::before { content: "▸"; color: var(--brand-cyan); flex-shrink: 0; }

/* ========== Timeline (about page) ========== */
.timeline { position: relative; padding-left: 40px; }
.timeline::before { content: ""; position: absolute; left: 14px; top: 8px; bottom: 8px; width: 2px; background: linear-gradient(180deg, var(--brand-blue), var(--brand-cyan)); }
.timeline-item { position: relative; padding-bottom: 20px; }
.timeline-item:last-child { padding-bottom: 0; }
.timeline-item::before {
  content: ""; position: absolute; left: -35px; top: 6px;
  width: 16px; height: 16px; border-radius: 50%;
  background: white; border: 3px solid var(--brand-cyan);
}
.timeline-year { font-family: var(--mono); font-size: 18px; color: var(--brand-blue); font-weight: 600; letter-spacing: 0.05em; }
.timeline-item h4 { font-size: 17px; margin: 6px 0 6px; }
.timeline-item p { font-size: 14px; line-height: 1.6; }

/* ========== Stat grid (about page, etc) ========== */
.stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
@media (max-width: 880px) { .stat-grid { grid-template-columns: repeat(2, 1fr); } }
.stat-block { background: white; border: 1px solid var(--line); border-radius: 14px; padding: 28px 22px; text-align: center; }
.stat-block .num { font-size: 38px; font-weight: 800; background: linear-gradient(135deg, var(--brand-blue), var(--brand-cyan)); -webkit-background-clip: text; background-clip: text; color: transparent; line-height: 1; }
.stat-block .lbl { font-size: 13px; color: var(--ink-mute); margin-top: 8px; }

/* ========== Job listing (careers) ========== */
.job-card {
  background: white; border: 1px solid var(--line); border-radius: 14px;
  padding: 24px 26px; transition: all 0.2s; display: flex; gap: 24px; align-items: center;
}
.job-card:hover { border-color: var(--brand-cyan); box-shadow: var(--shadow); transform: translateX(4px); }
.job-main { flex: 1; }
.job-card h4 { font-size: 18px; margin-bottom: 6px; }
.job-meta { display: flex; gap: 14px; flex-wrap: wrap; font-size: 14px; color:#393939; }
.job-meta span { display: inline-flex; align-items: center; gap: 5px; }
@media (max-width: 640px) { .job-card { flex-direction: column; align-items: stretch; } }

/* ========== Contact form ========== */
.contact-form { background: white; border: 1px solid var(--line); border-radius: 18px; padding: 32px; box-shadow: var(--shadow-sm); }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
@media (max-width: 640px) { .form-row { grid-template-columns: 1fr; } }
.form-group { display: flex; flex-direction: column; gap: 6px; }
.form-group label { font-size: 13px; font-weight: 500; color: var(--brand-navy); }
.form-group input, .form-group select, .form-group textarea {
  font-family: var(--font); font-size: 14px;
  padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px;
  background: var(--bg-soft); color: var(--ink); transition: all 0.2s;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
  outline: none; border-color: var(--brand-cyan); background: white;
  box-shadow: 0 0 0 4px rgba(0, 184, 217, 0.12);
}
.form-group textarea { resize: vertical; min-height: 120px; }

/* ========== Misc utilities ========== */
.center { text-align: center; }
.muted { color: var(--ink-mute); }
.mt-1 { margin-top: 12px; } .mt-2 { margin-top: 24px; } .mt-3 { margin-top: 36px; } .mt-4 { margin-top: 48px; }
.mb-1 { margin-bottom: 12px; } .mb-2 { margin-bottom: 24px; } .mb-3 { margin-bottom: 36px; } .mb-4 { margin-bottom: 48px; }