*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: 'Inter', system-ui, sans-serif; color: #333; background: #fff; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; }
img { max-width: 100%; display: block; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }
input, select, textarea { font-family: inherit; }
.container {max-width: 1280px;margin: auto;}
/* ============== NAVBAR ============== */
.navbar {
position: fixed; top: 0; left: 0; right: 0; z-index: 50;
background: rgba(26, 10, 78, 0.95); backdrop-filter: blur(12px);
border-bottom: 1px solid rgba(255,255,255,0.1);
}
.navbar-inner {
max-width:1280px; margin: 0 auto; padding:0;
display: flex; align-items: center; justify-content: space-between; height: 64px;
}
.nav-logo img { height:40px; filter: brightness(0) invert(1);     width: auto;}
.nav-desktop { display: none; align-items: center; gap: 4px; }
.nav-link {
padding: 8px 12px; border-radius: 6px; color: rgba(255,255,255,0.8);
font-size: 0.875rem; font-weight: 500; transition: all 0.2s;
}
.nav-link:hover { color: #fff; background: rgba(255,255,255,0.1); }
.nav-right { display: none; align-items: center; gap: 16px; }
.nav-phone {
display: flex; align-items: center; gap: 8px; color: rgba(255,255,255,0.8);
font-size: 0.85rem; font-weight: 500; transition: all 0.2s;
}
.nav-phone:hover { color: #fff; }
.nav-phone i { color: #a855f7; }
.nav-cta {
padding: 8px 20px; border-radius: 9999px;
background: linear-gradient(to right, #a855f7, #6366f1);
color: #fff; font-size: 0.875rem; font-weight: 600; transition: all 0.2s;
box-shadow: 0 4px 15px rgba(168, 85, 247, 0.25);
}
.nav-cta:hover { background: linear-gradient(to right, #9333ea, #4f46e5); }
.mobile-toggle { display: block; color: #fff; padding: 8px; background: none; border: none; }
.mobile-toggle svg { width: 24px; height: 24px; }

/* Dropdown */
.dropdown { position: relative; }
.dropdown-btn {
display: flex; align-items: center; gap: 4px; padding: 8px 12px; border-radius: 6px;
color: rgba(255,255,255,0.8); font-size: 0.875rem; font-weight: 500; transition: all 0.2s;
}
.dropdown-btn:hover, .dropdown-btn.active { color: #fff; background: rgba(255,255,255,0.1); }
.dropdown-btn svg { width: 14px; height: 14px; transition: transform 0.2s; }
.dropdown-btn.active svg { transform: rotate(180deg); }

.about-dropdown-menu {
display: none; position: absolute; top: 100%; left: 0; margin-top: 8px;
width: 240px; background: rgba(26, 10, 78, 0.98); backdrop-filter: blur(20px);
border: 1px solid rgba(255,255,255,0.1); border-radius: 16px;
box-shadow: 0 25px 50px rgba(0,0,0,0.4); padding: 12px;
}
.about-dropdown-menu.show { display: block; }
.about-dropdown-menu a {
display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 8px;
color: rgba(255,255,255,0.7); font-size: 0.8rem; font-weight: 500; transition: all 0.2s;
}
.about-dropdown-menu a:hover { color: #fff; background: rgba(255,255,255,0.08); }
.about-dropdown-menu a i { color: #a855f7; width: 15px; height: 15px; }
.about-dropdown-menu .top-link { color: #a855f7; font-weight: 600; }
.about-dropdown-menu .divider { margin: 4px 0; border-top: 1px solid rgba(255,255,255,0.1); }

.services-dropdown-menu {
display: none; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); margin-top: 8px;
width: 680px; background: rgba(26, 10, 78, 0.98); backdrop-filter: blur(20px);
border: 1px solid rgba(255,255,255,0.1); border-radius: 16px;
box-shadow: 0 25px 50px rgba(0,0,0,0.4); padding: 24px;
display: none; grid-template-columns: 1fr 1fr; gap: 24px;
}
.services-dropdown-menu.show { display: grid; }
.services-dropdown-menu h4 {
color: #a855f7; font-size: 0.7rem; font-weight: 700; text-transform: uppercase;
letter-spacing: 0.05em; margin-bottom: 12px; padding-bottom: 8px;
border-bottom: 1px solid rgba(255,255,255,0.1);
}
.services-dropdown-menu .col-digital h4 { color: #818cf8; }
.services-dropdown-menu a {
display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px;
color: rgba(255,255,255,0.7); font-size: 0.8rem; font-weight: 500; transition: all 0.2s;
}
.services-dropdown-menu a:hover { color: #fff; background: rgba(255,255,255,0.08); }
.services-dropdown-menu a i { width: 15px; height: 15px; flex-shrink: 0; }
.col-it a i { color: #a855f7; }
.col-digital a i { color: #818cf8; }

/* Mobile menu */
.mobile-menu {
display: none; background: rgba(26, 10, 78, 0.98); backdrop-filter: blur(12px);
border-top: 1px solid rgba(255,255,255,0.1); max-height: 85vh; overflow-y: auto;
padding: 12px 16px;
}
.mobile-menu.show { display: block; }
.mobile-menu a, .mobile-menu button {
display: block; width: 100%; text-align: left; padding: 8px 12px; border-radius: 6px;
color: rgba(255,255,255,0.8); font-size: 0.9rem; font-weight: 500; transition: all 0.2s;
}
.mobile-menu a:hover, .mobile-menu button:hover { color: #fff; background: rgba(255,255,255,0.1); }
.mob-accordion-btn {
display: flex !important; align-items: center; justify-content: space-between;
}
.mob-accordion-btn svg { width: 16px; height: 16px; transition: transform 0.2s; }
.mob-accordion-btn.active svg { transform: rotate(180deg); }
.mob-accordion-content { display: none; padding-left: 12px; margin-top: 4px; }
.mob-accordion-content.show { display: block; }
.mob-accordion-content a {
display: flex !important; align-items: center; gap: 8px; padding: 6px 12px !important;
color: rgba(255,255,255,0.6) !important; font-size: 0.8rem !important;
}
.mob-accordion-content a i { color: #a855f7; width: 13px; height: 13px; flex-shrink: 0; }
.mob-accordion-content .sub-heading {
display: block !important; padding: 4px 12px !important; color: #a855f7 !important;
font-size: 0.65rem !important; font-weight: 700 !important; text-transform: uppercase; letter-spacing: 0.05em;
}
.mob-accordion-content .sub-heading-digital { color: #818cf8 !important; }
.mobile-cta {
display: block !important; text-align: center !important; margin-top: 12px !important;
padding: 10px 20px !important; border-radius: 9999px !important;
background: linear-gradient(to right, #a855f7, #6366f1) !important; color: #fff !important;
font-weight: 600 !important;
}

/* ============== HERO ============== */
.hero {
position: relative; min-height: 100vh; display: flex; align-items: center; overflow: hidden;
background: linear-gradient(135deg, #1a0a4e 0%, #3b1d8e 30%, #6c3ce0 60%, #8b5cf6 100%);
}
.hero-blob1 {
position: absolute; top: -160px; right: -160px; width: 320px; height: 320px;
background: rgba(192, 132, 252, 0.2); border-radius: 50%; filter: blur(60px);
}
.hero-blob2 {
position: absolute; top: 50%; left: -80px; width: 240px; height: 240px;
background: rgba(99, 102, 241, 0.2); border-radius: 50%; filter: blur(60px);
}
.hero-blob3 {
position: absolute; bottom: 80px; right: 25%; width: 160px; height: 160px;
background: rgba(236, 72, 153, 0.15); border-radius: 50%; filter: blur(40px);
}
.hero-container {
max-width: 80rem; margin: 0 auto; padding: 96px 16px 64px; position: relative; z-index: 10;
}
.hero-grid { display: grid; gap: 48px; align-items: center; }
.hero-badge {
display: inline-flex; align-items: center; gap: 8px; padding: 6px 16px;
border-radius: 9999px; background: rgba(255,255,255,0.1);
border: 1px solid rgba(255,255,255,0.2); color: #e9d5ff; font-size: 0.85rem; margin-bottom: 24px;
}
.hero-badge i { width: 14px; height: 14px; }
.hero-title {
color: #fff; font-size: clamp(2.2rem, 5vw, 3.5rem); font-weight: 800; line-height: 1.1; margin-bottom: 24px;
}
.hero-title span {
background: linear-gradient(to right, #fde68a, #fdba74, #f9a8d4);
-webkit-background-clip: text; -webkit-text-fill-color: transparent;
background-clip: text;
}
.hero-desc {
color: rgba(243, 232, 255, 0.8); font-size: 1.1rem; line-height: 1.7;
max-width: 32rem; margin-bottom: 32px;
}
.hero-btns { display: flex; flex-wrap: wrap; gap: 16px; }
.hero-btn-primary {
display: inline-flex; align-items: center; gap: 8px; padding: 14px 28px;
border-radius: 9999px; background: #fff; color: #3b1d8e;
font-size: 0.95rem; font-weight: 700; box-shadow: 0 20px 25px rgba(0,0,0,0.2); transition: all 0.2s;
}
.hero-btn-primary:hover { background: #faf5ff; }
.hero-btn-primary i { width: 18px; height: 18px; }
.hero-btn-secondary {
display: inline-flex; align-items: center; gap: 8px; padding: 14px 28px;
border-radius: 9999px; border: 2px solid rgba(255,255,255,0.3);
color: #fff; font-size: 0.95rem; font-weight: 600; transition: all 0.2s;
}
.hero-btn-secondary:hover { background: rgba(255,255,255,0.1); }
.hero-stats { display: flex; align-items: center; gap: 32px; margin-top: 40px; }
.hero-stat { text-align: center; }
.hero-stat-num { color: #fff; font-size: 1.5rem; font-weight: 800; }
.hero-stat-label { color: rgba(233, 213, 255, 0.6); font-size: 0.8rem; font-weight: 500; }
.hero-image-wrap { display: none; position: relative; }
.hero-image-overlay {
position: absolute; inset: 0;
background: linear-gradient(to top right, rgba(108, 60, 224, 0.3), transparent);
border-radius: 16px;
}
.hero-image-wrap img { width: 100%; border-radius: 16px; box-shadow: 0 25px 50px rgba(0,0,0,0.25); }
.hero-wave { position: absolute; bottom: 0; left: 0; right: 0; }
.hero-wave svg { display: block; width: 100%; }

/* ============== ABOUT ============== */
.about { padding: 80px 16px; background: #fff; }
.about-container { max-width: 80rem; margin: 0 auto; }
.about-grid { display: grid; gap: 64px; align-items: center; }
.about-image-wrap { position: relative; }
.about-image-bg {
position: absolute; inset: -16px;
background: linear-gradient(to top right, #f3e8ff, #eef2ff);
border-radius: 16px; z-index: -1;
}
.about-image-wrap img { width: 100%; border-radius: 16px; box-shadow: 0 10px 15px rgba(0,0,0,0.1); }
.about-label {
color: #9333ea; font-size: 0.8rem; font-weight: 700;
text-transform: uppercase; letter-spacing: 0.1em;
}
.about-title { margin-top: 12px; color: #111827; font-size: 2.2rem; font-weight: 800; line-height: 1.2; }
.about-title span { color: #9333ea; }
.about-desc { margin-top: 20px; color: #4b5563; font-size: 1rem; line-height: 1.8; }
.about-checks { margin-top: 32px; display: flex; flex-direction: column; gap: 16px; }
.about-check {
display: flex; align-items: flex-start; gap: 12px;
}
.about-check i { color: #9333ea; margin-top: 2px; flex-shrink: 0; width: 20px; height: 20px; }
.about-check span { color: #374151; font-size: 0.95rem; }
.about-cta {
display: inline-block; margin-top: 32px; padding: 12px 28px; border-radius: 9999px;
background: linear-gradient(to right, #9333ea, #6366f1); color: #fff;
font-size: 0.9rem; font-weight: 600; box-shadow: 0 4px 15px rgba(168, 85, 247, 0.25); transition: all 0.2s;
}
.about-cta:hover { background: linear-gradient(to right, #7e22ce, #4f46e5); }

/* ============== SERVICES ============== */
.services { padding: 80px 16px; background: #f9fafb; }
.services-container { max-width: 80rem; margin: 0 auto; }
.section-header { text-align: center; margin-bottom: 56px; }
.section-label {
color: #9333ea; font-size: 0.8rem; font-weight: 700;
text-transform: uppercase; letter-spacing: 0.1em;
}
.section-title { margin-top: 12px; color: #111827; font-size: 2.2rem; font-weight: 800; }
.section-title span { color: #9333ea; }
.section-desc { margin-top: 16px; color: #6b7280; max-width: 42rem; margin-left: auto; margin-right: auto; font-size: 1rem; line-height: 1.7; }
.tabs { display: flex; justify-content: center; margin-bottom: 48px; }
.tabs-inner {
display: inline-flex; border-radius: 9999px; background: #fff; padding: 6px;
box-shadow: 0 4px 15px rgba(229, 231, 235, 0.5); border: 1px solid #f3f4f6;
}
.tab-btn {
padding: 10px 24px; border-radius: 9999px; font-size: 0.9rem; font-weight: 600;
color: #4b5563; transition: all 0.2s;
}
.tab-btn:hover { color: #9333ea; }
.tab-btn.active {
background: linear-gradient(to right, #9333ea, #6366f1); color: #fff;
box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
.service-grid {
display: grid; grid-template-columns: 1fr; gap: 24px;
}
.service-card {
background: #fff; border-radius: 16px; padding: 28px; border: 1px solid #f3f4f6;
transition: all 0.3s; cursor: pointer;
}
.service-card:hover { border-color: #e9d5ff; box-shadow: 0 20px 25px rgba(243, 232, 255, 0.4); }
.service-icon {
width: 48px; height: 48px; border-radius: 12px;
background: linear-gradient(135deg, #f3e8ff, #eef2ff);
display: flex; align-items: center; justify-content: center; margin-bottom: 20px;
transition: all 0.3s;
}
.service-icon i { color: #9333ea; width: 22px; height: 22px; }
.service-card:hover .service-icon {
background: linear-gradient(135deg, #9333ea, #6366f1);
}
.service-card:hover .service-icon i { color: #fff; }
.service-card h3 { color: #111827; font-size: 1.1rem; font-weight: 700; margin-bottom: 8px; }
.service-card p { color: #6b7280; font-size: 0.875rem; line-height: 1.7; }
.service-tab-content { display: none; }
.service-tab-content.active { display: grid; }

/* ============== WHY CHOOSE ============== */
.why-choose { padding: 80px 16px; background: #fff; }
.why-choose-container { max-width: 80rem; margin: 0 auto; }
.why-grid { display: grid; grid-template-columns: 1fr; gap: 32px; }
.why-card { text-align: center; }
.why-icon {
width: 64px; height: 64px; border-radius: 16px;
background: linear-gradient(135deg, #a855f7, #6366f1);
display: flex; align-items: center; justify-content: center; margin: 0 auto 20px;
box-shadow: 0 10px 15px rgba(233, 213, 255, 1); transition: transform 0.3s;
}
.why-card:hover .why-icon { transform: scale(1.1); }
.why-icon i { color: #fff; width: 28px; height: 28px; }
.why-card h3 { color: #111827; font-size: 1.1rem; font-weight: 700; margin-bottom: 8px; }
.why-card p { color: #6b7280; font-size: 0.875rem; line-height: 1.7; }

/* ============== PROCESS ============== */
.process { position: relative; padding: 80px 16px; overflow: hidden; }
.process-bg { position: absolute; inset: 0; }
.process-bg img { width: 100%; height: 100%; object-fit: cover; }
.process-overlay {
position: absolute; inset: 0;
background: linear-gradient(135deg, rgba(26,10,78,0.95), rgba(59,29,142,0.9));
}
.process-container { max-width: 80rem; margin: 0 auto; position: relative; z-index: 10; }
.process .section-label { color: #d8b4fe; }
.process .section-title { color: #fff; }
.process .section-title span { color: #fde68a; }
.process .section-desc { color: rgba(233, 213, 255, 0.7); }
.process-grid { display: grid; grid-template-columns: 1fr; gap: 24px; }
.process-card {
position: relative; background: rgba(255,255,255,0.1); backdrop-filter: blur(8px);
border-radius: 16px; padding: 28px; border: 1px solid rgba(255,255,255,0.15); transition: all 0.3s;
}
.process-card:hover { background: rgba(255,255,255,0.15); }
.process-num { color: rgba(216, 180, 254, 0.3); font-size: 3rem; font-weight: 900; margin-bottom: 16px; }
.process-card h3 { color: #fff; font-size: 1.15rem; font-weight: 700; margin-bottom: 12px; }
.process-card p { color: rgba(233, 213, 255, 0.6); font-size: 0.875rem; line-height: 1.7; }
.process-dot {
display: none; position: absolute; top: 50%; right: -12px; width: 24px; height: 24px;
border-radius: 50%; background: #a855f7; border: 4px solid #2a126e; z-index: 20;
}

/* ============== TEAM CULTURE ============== */
.tc-section { padding: 80px 16px; background-color: rgba(250, 245, 255, 0.6); overflow: hidden; }
.tc-container { max-width: 72rem; margin: 0 auto; }
.tc-heading-wrap { text-align: center; margin-bottom: 56px; max-width: 42rem; margin-left: auto; margin-right: auto; }
.tc-heading { font-size: 2rem; color: #111827; margin-bottom: 16px; font-weight: 700; }
.tc-heading span { font-style: italic; }
.tc-subtext { font-size: 0.95rem; line-height: 1.7; color: #6b7280; }
.tc-timeline { position: relative; }
.tc-dotted-line {
display: none; position: absolute; top: 52px; left: 12.5%; right: 12.5%; height: 2px; z-index: 0;
}
.tc-dotted-line svg { overflow: visible; }
.tc-grid { display: grid; grid-template-columns: 1fr; gap: 24px; position: relative; z-index: 10; }
.tc-card-wrap { display: flex; flex-direction: column; align-items: center; }
.tc-circle {
width: 104px; height: 104px; border-radius: 50%;
display: flex; align-items: center; justify-content: center; margin-bottom: 24px;
box-shadow: 0 10px 15px rgba(0,0,0,0.1);
}
.tc-circle.blue-cyan { background: linear-gradient(135deg, #60a5fa, #22d3ee); }
.tc-circle.cyan-teal { background: linear-gradient(135deg, #22d3ee, #2dd4bf); }
.tc-circle.orange-amber { background: linear-gradient(135deg, #fb923c, #fbbf24); }
.tc-circle.purple-indigo { background: linear-gradient(135deg, #a855f7, #6366f1); }
.tc-icon-box {
width: 48px; height: 48px; background: rgba(255,255,255,0.2);
backdrop-filter: blur(8px); border-radius: 8px;
display: flex; align-items: center; justify-content: center;
}
.tc-icon-box i { color: #fff; width: 24px; height: 24px; }
.tc-card {
background: #f9fafb; border-radius: 16px; padding: 20px; text-align: center;
width: 100%; border: 1px solid #f3f4f6; transition: all 0.3s;
}
.tc-card:hover { box-shadow: 0 10px 15px rgba(0,0,0,0.1); border-color: #e5e7eb; }
.tc-card-title { color: #111827; margin-bottom: 12px; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.05em; }
.tc-card-desc { color: #6b7280; font-size: 0.82rem; line-height: 1.7; }

/* ============== FAQ ============== */
.faq { padding: 80px 16px; background: #fff; }
.faq-container { max-width: 48rem; margin: 0 auto; }
.faq-list { display: flex; flex-direction: column; gap: 12px; }
.faq-item {
border: 1px solid #f3f4f6; border-radius: 12px; overflow: hidden; transition: all 0.3s;
}
.faq-item:hover { border-color: #e9d5ff; }
.faq-btn {
width: 100%; display: flex; align-items: center; justify-content: space-between;
padding: 16px 24px; text-align: left; background: none; border: none;
}
.faq-btn span { color: #111827; font-size: 0.95rem; font-weight: 600; padding-right: 16px; }
.faq-btn i { color: #a855f7; width: 18px; height: 18px; flex-shrink: 0; transition: transform 0.2s; }
.faq-item.active .faq-btn i { transform: rotate(180deg); }
.faq-answer {
display: none; padding: 0 24px 20px;
}
.faq-item.active .faq-answer { display: block; }
.faq-answer p { color: #6b7280; font-size: 0.9rem; line-height: 1.7; }

/* ============== CONTACT ============== */
.contact { padding: 80px 16px; background: #f9fafb; }
.contact-container { max-width: 80rem; margin: 0 auto; }
.contact-grid { display: grid; gap: 40px; }
.contact-info-card {
background: linear-gradient(135deg, #1a0a4e, #3b1d8e);
border-radius: 16px; padding: 32px; color: #fff;
}
.contact-info-card h3 { font-size: 1.3rem; font-weight: 700; margin-bottom: 24px; }
.contact-info-row { display: flex; align-items: flex-start; gap: 16px; margin-bottom: 20px; }
.contact-info-icon {
width: 40px; height: 40px; border-radius: 8px; background: rgba(255,255,255,0.1);
display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.contact-info-icon i { width: 18px; height: 18px; color: #fff; }
.contact-info-row p { font-size: 0.85rem; font-weight: 600; }
.contact-info-row .sub { color: rgba(233, 213, 255, 0.7); font-size: 0.8rem; font-weight: 400; }
.contact-map {
border-radius: 16px; overflow: hidden; height: 192px; background: #e5e7eb; border: 1px solid #f3f4f6;
}
.contact-map iframe { width: 100%; height: 100%; border: 0; }
.contact-form-wrap {
background: #fff; border-radius: 16px; padding: 32px;
box-shadow: 0 4px 15px rgba(243, 244, 246, 1); border: 1px solid #f3f4f6;
}
.form-row { display: grid; gap: 20px; }
.form-group { margin-bottom: 20px; }
.form-group label { display: block; color: #374151; font-size: 0.85rem; font-weight: 600; margin-bottom: 6px; }
.form-group input, .form-group select, .form-group textarea {
width: 100%; padding: 12px 16px; border-radius: 12px; border: 1px solid #e5e7eb;
background: #f9fafb; font-size: 0.9rem; outline: none; transition: all 0.2s;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
border-color: #c084fc; box-shadow: 0 0 0 3px rgba(192, 132, 252, 0.15);
}
.form-group textarea { resize: none; }
.form-submit {
width: 100%; display: flex; align-items: center; justify-content: center; gap: 8px;
padding: 14px 28px; border-radius: 12px; border: none;
background: linear-gradient(to right, #9333ea, #6366f1); color: #fff;
font-size: 0.95rem; font-weight: 700; cursor: pointer; transition: all 0.2s;
box-shadow: 0 4px 15px rgba(168, 85, 247, 0.25);
}
.form-submit:hover { background: linear-gradient(to right, #7e22ce, #4f46e5); }
.form-submit i { width: 18px; height: 18px; }
.form-success {
display: none; margin-bottom: 24px; padding: 16px; border-radius: 12px;
background: #f0fdf4; border: 1px solid #bbf7d0; color: #15803d;
font-size: 0.9rem; font-weight: 600;
}
.form-success.show { display: block; }

/* ============== FOOTER ============== */
.footer-cta { position: relative; height: 256px; overflow: hidden; }
.footer-cta img { width: 100%; height: 100%; object-fit: cover; }
.footer-cta-overlay {position: absolute; inset: 0;background: linear-gradient(to top, #0c0524, rgba(12, 5, 36, 0.7), transparent);}
.footer { background: #0c0524; }
.footer-inner { max-width: 80rem; margin: 0 auto; padding: 64px 16px; }
.footer-grid { display: grid; gap: 40px; }
.footer-brand p { color: #9ca3af; font-size: 0.85rem; line-height: 1.7; margin: 16px 0 20px; max-width: 24rem; }
.footer-brand .brand-logo img { height: 28px; filter: brightness(0) invert(1); margin-bottom: 4px; }
.footer-contact-row { display: flex; align-items: center; gap: 8px; color: #9ca3af; font-size: 0.85rem; margin-bottom: 10px; transition: color 0.2s; }
.footer-contact-row:hover { color: #d8b4fe; }
.footer-contact-row i { color: #a855f7; width: 14px; height: 14px; flex-shrink: 0; }
.footer-socials { display: flex; gap: 12px; margin-top: 20px; }
.footer-social {width: 36px; height: 36px; border-radius: 8px; background: rgba(255,255,255,0.05);border: 1px solid rgba(255,255,255,0.1); display: flex; align-items: center; justify-content: center;color: #9ca3af; transition: all 0.2s;}
.footer-social:hover { color: #fff; background: rgba(168, 85, 247, 0.3); border-color: rgba(168, 85, 247, 0.4); }
.footer-social i { width: 16px; height: 16px; }
.footer-col h4 { color: #fff; font-size: 0.9rem; font-weight: 700; margin-bottom: 16px; }
.footer-col ul { display: flex; flex-direction: column; gap: 10px; }
.footer-col ul a { color: #9ca3af; font-size: 0.85rem; transition: color 0.2s; }
.footer-col ul a:hover { color: #d8b4fe; }
.footer-bottom {margin-top: 56px; padding-top: 32px; border-top: 1px solid rgba(255,255,255,0.1);display: flex; flex-direction: column; align-items: center; gap: 16px;}
.footer-bottom p { color: #6b7280; font-size: 0.8rem; }
.footer-bottom-links { display: flex; gap: 24px; }
.footer-bottom-links a { color: #6b7280; font-size: 0.8rem; transition: color 0.2s; }
.footer-bottom-links a:hover { color: #d8b4fe; }
.scroll-top {width: 40px; height: 40px; border-radius: 50%; background: #9333ea; color: #fff;display: flex; align-items: center; justify-content: center; border: none;cursor: pointer; transition: all 0.2s; box-shadow: 0 4px 15px rgba(0,0,0,0.2);}
.scroll-top:hover { background: #a855f7; }
.scroll-top i { width: 18px; height: 18px; }

.breadcrum {margin-bottom: 0px;background: linear-gradient(135deg, #1a0a4e 0%, #3b1d8e 30%, #6c3ce0 60%, #8b5cf6 100%);padding-top: 100px;color: #fff;padding-bottom: 30px;}
.breadcrum h1 {font-weight: 900;background: linear-gradient(to right, #fde68a, #fdba74, #f9a8d4);-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;margin-bottom: 15px;}
.pbmit-breadcrumb-inner a {color: #fde288;}

/* ============== PAGE HERO BANNER ============== */
.page-hero {position: relative; padding: 140px 16px 80px; overflow: hidden;background: linear-gradient(135deg, #1a0a4e 0%, #3b1d8e 30%, #6c3ce0 60%, #8b5cf6 100%);text-align: center;}
.page-hero-blob1 {position: absolute; top: -100px; right: -100px; width: 300px; height: 300px;background: rgba(192,132,252,0.2); border-radius: 50%; filter: blur(60px);}
.page-hero-blob2 {position: absolute; bottom: -60px; left: -80px; width: 250px; height: 250px;background: rgba(99,102,241,0.2); border-radius: 50%; filter: blur(60px);}
.page-hero-content { position: relative; z-index: 10; max-width: 48rem; margin: 0 auto; }
.page-hero-breadcrumb {display: inline-flex; align-items: center; gap: 8px; color: rgba(233,213,255,0.6);font-size: 0.85rem; margin-bottom: 20px;}
.page-hero-breadcrumb a { color: rgba(233,213,255,0.8); transition: color 0.2s; }
.page-hero-breadcrumb a:hover { color: #fff; }
.page-hero-breadcrumb i { width: 14px; height: 14px; }
.page-hero h1 {color: #fff; font-size: clamp(2rem, 5vw, 3rem); font-weight: 800; line-height: 1.15; margin-bottom: 16px;}
.page-hero h1 span {background: linear-gradient(to right, #fde68a, #fdba74, #f9a8d4);-webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;}
.page-hero p { color: rgba(243,232,255,0.75); font-size: 1.05rem; line-height: 1.7; max-width: 36rem; margin: 0 auto; }
.page-hero-wave { position: absolute; bottom: 0; left: 0; right: 0; }
.page-hero-wave svg { display: block; width: 100%; }


/*about us page*/
 .section { padding: 80px 16px; }
.section.bg-gray{background: #f9fafb;}
/* ============== WHO WE ARE ============== */
.who-grid { display: grid; gap: 64px; align-items: center; max-width: 1280px;margin: auto;}
.who-image-wrap { position: relative; }
.who-image-bg {position: absolute; inset: -16px;background: linear-gradient(to top right, #f3e8ff, #eef2ff);border-radius: 16px; z-index: -1;}
.who-image-wrap img { width: 100%; border-radius: 16px; box-shadow: 0 10px 15px rgba(0,0,0,0.1); }
.who-text h2 { color: #111827; font-size: 2rem; font-weight: 800; line-height: 1.2; margin-bottom: 20px; }
.who-text h2 span { color: #9333ea; }
.who-text p { color: #4b5563; font-size: 0.95rem; line-height: 1.8; margin-bottom: 16px; }
.who-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 32px; }
.who-stat-card {background: linear-gradient(135deg, #f3e8ff, #eef2ff); border-radius: 16px;padding: 20px; text-align: center;}
.who-stat-num { color: #7c3aed; font-size: 1.8rem; font-weight: 800; }
.who-stat-label { color: #6b7280; font-size: 0.75rem; font-weight: 600; margin-top: 4px; }
/* ============== MISSION VISION VALUES ============== */
.mvv-grid { display: grid; grid-template-columns: 1fr; gap: 24px; max-width: 1280px;margin: auto;}
.mvv-card {border-radius: 20px; padding: 36px; border: 1px solid #f3f4f6; transition: all 0.3s;position: relative; overflow: hidden;}
.mvv-card:hover { box-shadow: 0 20px 40px rgba(0,0,0,0.08); transform: translateY(-4px); }
.mvv-card.mission { background: linear-gradient(135deg, #faf5ff, #f5f3ff); }
.mvv-card.vision { background: linear-gradient(135deg, #eff6ff, #eef2ff); }
.mvv-card.values { background: linear-gradient(135deg, #fefce8, #fff7ed); }
.mvv-icon {width: 56px; height: 56px; border-radius: 16px; display: flex;align-items: center; justify-content: center; margin-bottom: 20px;}
.mvv-card.mission .mvv-icon { background: linear-gradient(135deg, #9333ea, #6366f1); }
.mvv-card.vision .mvv-icon { background: linear-gradient(135deg, #3b82f6, #6366f1); }
.mvv-card.values .mvv-icon { background: linear-gradient(135deg, #f59e0b, #ef4444); }
.mvv-icon i { color: #fff; width: 26px; height: 26px; }
.mvv-card h3 { color: #111827; font-size: 1.3rem; font-weight: 700; margin-bottom: 12px; }
.mvv-card p { color: #4b5563; font-size: 0.9rem; line-height: 1.8; }

/* ============== OUR JOURNEY / TIMELINE ============== */
.timeline { position: relative; max-width: 48rem; margin: 0 auto; max-width: 1280px;margin: auto;}
.timeline-line {position: absolute; left: 20px; top: 0; bottom: 0; width: 2px;background: linear-gradient(to bottom, #e9d5ff, #c4b5fd, #a78bfa);}
.timeline-item { position: relative; padding-left: 56px; margin-bottom: 48px; }
.timeline-item:last-child { margin-bottom: 0; }
.timeline-dot {position: absolute; left: 8px; top: 4px; width: 26px; height: 26px;border-radius: 50%; background: linear-gradient(135deg, #a855f7, #6366f1);border: 4px solid #fff; box-shadow: 0 0 0 3px #e9d5ff; z-index: 2;}
.timeline-year {display: inline-block; padding: 4px 14px; border-radius: 9999px;background: linear-gradient(135deg, #9333ea, #6366f1); color: #fff;font-size: 0.75rem; font-weight: 700; margin-bottom: 10px;}
.timeline-item h3 { color: #111827; font-size: 1.1rem; font-weight: 700; margin-bottom: 8px; }
.timeline-item p { color: #6b7280; font-size: 0.88rem; line-height: 1.7; }

/* ============== CORE VALUES ============== */
.values-grid { display: grid; grid-template-columns: 1fr; gap: 24px; max-width: 1280px;margin: auto;}
.value-card {background: #fff; border-radius: 16px; padding: 28px;border: 1px solid #f3f4f6; transition: all 0.3s; text-align: center;}
.value-card:hover { border-color: #e9d5ff; box-shadow: 0 15px 30px rgba(243,232,255,0.5); transform: translateY(-4px); }
.value-icon {width: 60px; height: 60px; border-radius: 50%; display: flex;align-items: center; justify-content: center; margin: 0 auto 18px;box-shadow: 0 8px 20px rgba(0,0,0,0.1);}
.value-icon.purple { background: linear-gradient(135deg, #a855f7, #6366f1); }
.value-icon.blue { background: linear-gradient(135deg, #3b82f6, #06b6d4); }
.value-icon.green { background: linear-gradient(135deg, #10b981, #14b8a6); }
.value-icon.orange { background: linear-gradient(135deg, #f59e0b, #ef4444); }
.value-icon.pink { background: linear-gradient(135deg, #ec4899, #a855f7); }
.value-icon.indigo { background: linear-gradient(135deg, #6366f1, #8b5cf6); }
.value-icon i { color: #fff; width: 26px; height: 26px; }
.value-card h3 { color: #111827; font-size: 1rem; font-weight: 700; margin-bottom: 8px; }
.value-card p { color: #6b7280; font-size: 0.85rem; line-height: 1.7; }

/* ============== TEAM ============== */
.team-grid { display: grid; grid-template-columns: 1fr; gap: 24px; max-width: 1280px;margin: auto;}
.team-card {background: #fff; border-radius: 20px; overflow: hidden;border: 1px solid #f3f4f6; transition: all 0.3s;}
.team-card:hover { box-shadow: 0 20px 40px rgba(0,0,0,0.08); transform: translateY(-4px); }
.team-card-img { position: relative; height: 260px; overflow: hidden; }
.team-card-img img { width: 100%; height: 100%; object-fit: cover; }
.team-card-overlay {position: absolute; inset: 0;background: linear-gradient(to top, rgba(26,10,78,0.7), transparent);opacity: 0; transition: opacity 0.3s;}
.team-card:hover .team-card-overlay { opacity: 1; }
.team-card-socials {position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%);display: flex; gap: 8px; opacity: 0; transition: opacity 0.3s;}
.team-card:hover .team-card-socials { opacity: 1; }
.team-card-socials a {width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.2);backdrop-filter: blur(8px); display: flex; align-items: center; justify-content: center;color: #fff; transition: all 0.2s; border: 1px solid rgba(255,255,255,0.3);}
.team-card-socials a:hover { background: #a855f7; }
.team-card-socials a i { width: 16px; height: 16px; }
.team-card-info { padding: 20px; text-align: center; }
.team-card-info h3 { color: #111827; font-size: 1.05rem; font-weight: 700; margin-bottom: 4px; }
.team-card-info p { color: #9333ea; font-size: 0.8rem; font-weight: 600; }

/* ============== CERTIFICATIONS ============== */
.certs-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; max-width: 1280px;margin: auto;}
.cert-card {background: #fff; border-radius: 16px; padding: 24px; text-align: center;border: 1px solid #f3f4f6; transition: all 0.3s;}
.cert-card:hover { border-color: #e9d5ff; box-shadow: 0 10px 25px rgba(243,232,255,0.4); }
.cert-icon {
width: 52px; height: 52px; border-radius: 12px;
background: linear-gradient(135deg, #f3e8ff, #eef2ff);
display: flex; align-items: center; justify-content: center; margin: 0 auto 14px;
}
.cert-icon i { color: #7c3aed; width: 24px; height: 24px; }
.cert-card h3 { color: #111827; font-size: 0.85rem; font-weight: 700; margin-bottom: 4px; }
.cert-card p { color: #6b7280; font-size: 0.78rem; line-height: 1.5; }

/* ============== SERVICE AREAS ============== */
.areas-grid { display: grid; grid-template-columns: 1fr; gap: 24px; align-items: center; max-width: 1280px;margin: auto;}
.areas-map { background: #f3e8ff; border-radius: 20px; padding: 40px; text-align: center; }
.areas-map i { color: #7c3aed; width: 80px; height: 80px; margin: 0 auto 16px; }
.areas-map h3 { color: #111827; font-size: 1.3rem; font-weight: 700; margin-bottom: 8px; }
.areas-map p { color: #6b7280; font-size: 0.9rem; }
.areas-list { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.area-item {
display: flex; align-items: center; gap: 10px; background: #fff;
border-radius: 12px; padding: 14px 18px; border: 1px solid #f3f4f6; transition: all 0.2s;
}
.area-item:hover { border-color: #e9d5ff; box-shadow: 0 4px 12px rgba(243,232,255,0.3); }
.area-item i { color: #9333ea; width: 18px; height: 18px; flex-shrink: 0; }
.area-item span { color: #374151; font-size: 0.88rem; font-weight: 600; }

/* ============== CTA BAND ============== */
.cta-band {position: relative; padding: 80px 16px; overflow: hidden;background: linear-gradient(135deg, #1a0a4e 0%, #3b1d8e 50%, #6c3ce0 100%);text-align: center;}
.cta-band-blob1 {
position: absolute; top: -80px; right: -80px; width: 200px; height: 200px;
background: rgba(192,132,252,0.2); border-radius: 50%; filter: blur(50px);
}
.cta-band-blob2 {
position: absolute; bottom: -60px; left: -60px; width: 180px; height: 180px;
background: rgba(99,102,241,0.2); border-radius: 50%; filter: blur(50px);
}
.cta-band-content { position: relative; z-index: 10; max-width: 36rem; margin: 0 auto; }
.cta-band h2 { color: #fff; font-size: 2rem; font-weight: 800; margin-bottom: 16px; }
.cta-band h2 span {
background: linear-gradient(to right, #fde68a, #fdba74);
-webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.cta-band p { color: rgba(233,213,255,0.7); font-size: 1rem; line-height: 1.7; margin-bottom: 32px; }
.cta-band-btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; }
.cta-btn-white {
display: inline-flex; align-items: center; gap: 8px; padding: 14px 28px;
border-radius: 9999px; background: #fff; color: #3b1d8e;
font-size: 0.95rem; font-weight: 700; transition: all 0.2s;
box-shadow: 0 10px 25px rgba(0,0,0,0.2);
}
.cta-btn-white:hover { background: #faf5ff; }
.cta-btn-white i { width: 18px; height: 18px; }
.cta-btn-outline {
display: inline-flex; align-items: center; gap: 8px; padding: 14px 28px;
border-radius: 9999px; border: 2px solid rgba(255,255,255,0.3);
color: #fff; font-size: 0.95rem; font-weight: 600; transition: all 0.2s;
}
.cta-btn-outline:hover { background: rgba(255,255,255,0.1); }

@media (min-width: 640px) {
.mvv-grid { grid-template-columns: 1fr 1fr 1fr; }
.values-grid { grid-template-columns: 1fr 1fr; }
.team-grid { grid-template-columns: 1fr 1fr; }
.certs-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 1024px) {
.who-grid { grid-template-columns: 1fr 1fr; }
.values-grid { grid-template-columns: 1fr 1fr 1fr; }
.team-grid { grid-template-columns: repeat(4, 1fr); }
.certs-grid { grid-template-columns: repeat(6, 1fr); }
.areas-grid { grid-template-columns: 1fr 1fr; }
.footer-grid { grid-template-columns: 3fr 2fr 3fr 4fr; }

}
/*end abut us page*/

/* ============== RESPONSIVE ============== */
@media (min-width: 640px) {
.hero-container { padding-left: 24px; padding-right: 24px; }
.service-grid, .service-tab-content.active { grid-template-columns: 1fr 1fr; }
.why-grid { grid-template-columns: 1fr 1fr; }
.process-grid { grid-template-columns: 1fr 1fr; }
.tc-grid { grid-template-columns: 1fr 1fr; }
.tc-heading { font-size: 2.25rem; }
.form-row { grid-template-columns: 1fr 1fr; }
.tc-section { padding-left: 24px; padding-right: 24px; }
}

@media (min-width: 768px) {
.tc-dotted-line { display: block; }
.tc-grid { grid-template-columns: repeat(4, 1fr); }
.footer-grid { grid-template-columns: 1fr 1fr; }
.footer-bottom { flex-direction: row; justify-content: space-between; }
}

@media (min-width: 1024px) {

.nav-desktop { display: flex; }
.nav-right { display: flex; }
.mobile-toggle { display: none; }
.hero-grid { grid-template-columns: 1fr 1fr; }
.hero-image-wrap { display: block; }
.about-grid { grid-template-columns: 1fr 1fr; }
.service-grid, .service-tab-content.active { grid-template-columns: 1fr 1fr 1fr; }
.why-grid { grid-template-columns: 1fr 1fr 1fr; }
.process-grid { grid-template-columns: repeat(4, 1fr); }
.process-dot { display: block; }
.contact-grid { grid-template-columns: 2fr 3fr; }
.footer-grid { grid-template-columns: 3fr 2fr 3fr 4fr; }
.tc-section { padding-left: 32px; padding-right: 32px; }
}




/*Sachin*/

/* Filters */
.filters-section {background: #f8fafc;padding: 2rem 0;border-bottom: 1px solid #e2e8f0;}
.filters {display: flex;gap: 1rem;flex-wrap: wrap;justify-content: center;}
.filter-btn {background: white;color: #475569;padding: 0.75rem 1.5rem;border: 2px solid #e2e8f0;border-radius: 2rem;font-weight: 600;font-size: 0.9375rem;cursor: pointer;transition: all 0.3s;}
.filter-btn:hover {border-color: #7c3aed;color: #7c3aed;}
.filter-btn.active {background: #7c3aed;color: white;border-color: #7c3aed;}
/* Case Studies Grid */
.case-studies-section {padding: 5rem 0;}
.case-studies-grid {display: grid;grid-template-columns: 1fr;gap: 3rem;}
.case-study {background: white;border-radius: 1rem;overflow: hidden;box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);border: 1px solid #e2e8f0;transition: box-shadow 0.3s;display: none;}
.case-study.show {display: block;}
.case-study:hover {box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);}
.case-study-header {display: grid;grid-template-columns: 300px 1fr;gap: 2rem;}
.case-study-image {width: 300px;height: 100%;min-height: 250px;}
.case-study-image img {width: 100%;height: 100%;object-fit: cover;}
.case-study-content {padding: 2rem 2rem 2rem 0;}
.case-tags {display: flex;gap: 0.5rem;margin-bottom: 1rem;flex-wrap: wrap;}
.case-study h2 {font-size: 1.75rem;font-weight: bold;margin-bottom: 0.75rem;color: #0f172a;}
.case-meta {display: flex;gap: 1.5rem;margin-bottom: 1.5rem;flex-wrap: wrap;font-size: 0.875rem;color: #64748b;}
.case-meta-item {display: flex;align-items: center;gap: 0.5rem;}
.case-meta-item svg {width: 16px;height: 16px;color: #7c3aed;}
.problem-section {background: #fef2f2;border-left: 4px solid #ef4444;padding: 1.25rem;border-radius: 0 0.5rem 0.5rem 0;margin-bottom: 1.5rem;}
.problem-section h3 {font-weight: bold;font-size: 1rem;margin-bottom: 0.5rem;color: #991b1b;}
.problem-section p {color: #7f1d1d;font-size: 0.9375rem;}
.case-section {margin-bottom: 1.5rem;}
.case-section h3 {font-weight: bold;font-size: 1.125rem;margin-bottom: 0.75rem;color: #0f172a;display: flex;align-items: center;gap: 0.5rem;}
.case-section h3 svg {width: 20px;height: 20px;color: #7c3aed;}
.case-section ul {list-style: none;margin-left: 0;}
.case-section ul li {padding-left: 1.5rem;position: relative;margin-bottom: 0.5rem;color: #475569;font-size: 0.9375rem;}
.case-section ul li::before {
content: "→";
position: absolute;
left: 0;
color: #7c3aed;
font-weight: bold;
}

.tech-stack {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
}

.tech-tag {
background: #f1f5f9;
color: #475569;
padding: 0.375rem 0.75rem;
border-radius: 0.375rem;
font-size: 0.8125rem;
font-weight: 500;
}

.outcomes-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
margin-top: 1rem;
}

.outcome-card {
background: #f0fdf4;
border: 1px solid #86efac;
padding: 1rem;
border-radius: 0.5rem;
text-align: center;
}

.outcome-value {
font-size: 1.75rem;
font-weight: bold;
color: #15803d;
margin-bottom: 0.25rem;
}

.outcome-label {
font-size: 0.8125rem;
color: #166534;
}

.operations-box {
background: #faf5ff;
border: 1px solid #e9d5ff;
padding: 1.25rem;
border-radius: 0.5rem;
margin-top: 1rem;
}

.operations-box h4 {
font-weight: bold;
font-size: 0.9375rem;
margin-bottom: 0.75rem;
color: #6d28d9;
}

.operations-box p {
color: #475569;
font-size: 0.9375rem;
}


/* CTA Section */
.cta-section {background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);color: white;padding: 5rem 0;text-align: center;}
.cta-section h2 {font-size: 2.5rem;font-weight: bold;margin-bottom: 1.5rem;}
.cta-section p {font-size: 1.25rem;color: #e9d5ff;max-width: 800px;margin: 0 auto 2rem;}
.cta-buttons {display: flex;gap: 1rem;justify-content: center;flex-wrap: wrap;}

.btn-white {background: white;color: #7c3aed;padding: 1rem 2rem;border-radius: 0.5rem;text-decoration: none;font-weight: 600;font-size: 1.125rem;transition: background 0.3s;border: none;cursor: pointer;display: inline-block;}
.btn-white:hover {background: #f3e8ff;}
.btn-outline {background: rgba(255, 255, 255, 0.1);color: white;padding: 1rem 2rem;border-radius: 0.5rem;text-decoration: none;font-weight: 600;font-size: 1.125rem;transition: background 0.3s;border: 2px solid rgba(255, 255, 255, 0.3);cursor: pointer;display: inline-block;}
.btn-outline:hover {background: rgba(255, 255, 255, 0.2);}
/*END Case Studies page css*/

/* Gallery Categories */
.categories-section {background: #f8fafc;padding: 2rem 0;border-bottom: 1px solid #e2e8f0;}
.categories {display: flex;gap: 1rem;flex-wrap: wrap;justify-content: center;}
.category-btn {background: white;color: #475569;padding: 0.75rem 1.5rem;border: 2px solid #e2e8f0;border-radius: 2rem;font-weight: 600;font-size: 0.9375rem;cursor: pointer;transition: all 0.3s;}
.category-btn:hover {border-color: #7c3aed;color: #7c3aed;}
.category-btn.active {background: #7c3aed;color: white;border-color: #7c3aed;}
/* Gallery Section */
.gallery-section {padding: 5rem 0;}
.gallery-intro {max-width: 800px;margin: 0 auto 3rem;text-align: center;}
.gallery-intro h2 {font-size: 2rem;font-weight: bold;margin-bottom: 1rem;color: #0f172a;}
.gallery-intro p {font-size: 1.125rem;color: #64748b;line-height: 1.8;}
/* Project Cards */
.projects-grid {display: grid;grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));gap: 2rem;margin-bottom: 4rem;}
.project-card {background: white;border-radius: 1rem;overflow: hidden;box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);border: 1px solid #e2e8f0;transition: all 0.3s;display: none;}
.project-card.show {display: block;}
.project-card:hover {box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);transform: translateY(-4px);}
.project-image {width: 100%;height: 280px;overflow: hidden;position: relative;}
.project-image img {width: 100%;height: 100%;object-fit: cover;transition: transform 0.3s;}
.project-card:hover .project-image img {transform: scale(1.05);}
.before-after-badge {position: absolute;top: 1rem;right: 1rem;background: #7c3aed;color: white;padding: 0.5rem 1rem;border-radius: 2rem;font-size: 0.75rem;font-weight: 600;}
.project-content {padding: 1.5rem;}
.project-tags {display: flex;gap: 0.5rem;margin-bottom: 1rem;flex-wrap: wrap;}
.tag {background: #f3e8ff;color: #7c3aed;padding: 0.25rem 0.75rem;border-radius: 1rem;font-size: 0.75rem;font-weight: 600;}

.project-card h3 {
font-size: 1.25rem;
font-weight: bold;
margin-bottom: 0.5rem;
color: #0f172a;
}

.project-meta {
display: flex;
gap: 1rem;
margin-bottom: 1rem;
font-size: 0.875rem;
color: #64748b;
flex-wrap: wrap;
}

.project-meta span {
display: flex;
align-items: center;
gap: 0.25rem;
}

.project-description {
color: #475569;
font-size: 0.9375rem;
line-height: 1.6;
margin-bottom: 1rem;
}

.deliverables-box {
background: #f0fdf4;
border: 1px solid #86efac;
border-radius: 0.5rem;
padding: 0.75rem 1rem;
display: flex;
align-items: center;
gap: 0.5rem;
}

.deliverables-box svg {
width: 16px;
height: 16px;
color: #15803d;
flex-shrink: 0;
}

.deliverables-box span {
font-size: 0.875rem;
color: #15803d;
font-weight: 600;
}

/* Documentation Section */
.documentation-section {
background: #f8fafc;
padding: 5rem 0;
}

.documentation-intro {
max-width: 800px;
margin: 0 auto 3rem;
text-align: center;
}

.documentation-intro h2 {
font-size: 2rem;
font-weight: bold;
margin-bottom: 1rem;
color: #0f172a;
}

.documentation-intro p {
font-size: 1.125rem;
color: #64748b;
line-height: 1.8;
}

.docs-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 2rem;
}

.doc-card {
background: white;
border-radius: 1rem;
overflow: hidden;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #e2e8f0;
transition: all 0.3s;
}

.doc-card:hover {
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
}

.doc-image {
width: 100%;
height: 200px;
background: #f1f5f9;
display: flex;
align-items: center;
justify-content: center;
position: relative;
overflow: hidden;
}

.doc-image img {
width: 100%;
height: 100%;
object-fit: cover;
}

.redacted-overlay {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: rgba(124, 58, 237, 0.9);
color: white;
padding: 0.5rem 1rem;
border-radius: 0.5rem;
font-size: 0.875rem;
font-weight: 600;
}

.doc-content {
padding: 1.5rem;
}

.doc-content h3 {
font-size: 1.125rem;
font-weight: bold;
margin-bottom: 0.75rem;
color: #0f172a;
}

.doc-content p {
color: #475569;
font-size: 0.9375rem;
line-height: 1.6;
margin-bottom: 1rem;
}

.doc-content ul {
list-style: none;
margin: 0;
padding: 0;
}

.doc-content ul li {
color: #64748b;
font-size: 0.875rem;
padding-left: 1.5rem;
position: relative;
margin-bottom: 0.5rem;
}

.doc-content ul li::before {
content: "✓";
position: absolute;
left: 0;
color: #7c3aed;
font-weight: bold;
}

/* Stats Section */
.stats-section {
padding: 5rem 0;
background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);
color: white;
}

.stats-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 3rem;
max-width: 1000px;
margin: 0 auto;
}

.stat-item {
text-align: center;
}

.stat-value {
font-size: 3rem;
font-weight: bold;
margin-bottom: 0.5rem;
color: white;
}

.stat-label {
font-size: 1rem;
color: #e9d5ff;
font-weight: 500;
}

/* CTA Section */

.btn-purple {
background: #7c3aed;
color: white;
padding: 1rem 2rem;
border-radius: 0.5rem;
text-decoration: none;
font-weight: 600;
font-size: 1.125rem;
transition: background 0.3s;
display: inline-block;
}

.btn-purple:hover {
background: #6d28d9;
}

/*End Projects Gallery*/

/*service areas page css*/

/* Australian Operations Banner */
.services-areas .operations-banner {background: #0f172a;color: white;padding: 2.5rem 0;}
.services-areas .operations-content {display: grid;grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));gap: 2rem;align-items: center;}
.services-areas .operations-main {display: flex;align-items: center;gap: 1.5rem;}
.services-areas .flag-icon {width: 80px;height: 80px;background: rgba(255, 255, 255, 0.1);border-radius: 1rem;display: flex;align-items: center;justify-content: center;font-size: 3rem;}
.services-areas .operations-main h3 {font-size: 1.5rem;font-weight: bold;margin-bottom: 0.5rem;}
.services-areas .operations-main p {color: #cbd5e1;font-size: 0.9375rem;}
.services-areas .operations-details {display: grid;grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));gap: 1.5rem;}
.services-areas .operations-item {display: flex;align-items: center;gap: 0.75rem;}
.services-areas .operations-item svg {width: 24px;height: 24px;color: #7c3aed;flex-shrink: 0;}
.services-areas .operations-item div h4 {font-size: 0.875rem;color: #cbd5e1;margin-bottom: 0.25rem;}
.services-areas .operations-item div p {font-size: 1rem;font-weight: 600;color: white;}
/* Adelaide Metro Section */
.services-areas .adelaide-section {padding: 5rem 0;}
.services-areas .section-intro {max-width: 800px;margin: 0 auto 3rem;text-align: center;}
.services-areas .section-intro h2 {font-size: 2.5rem;font-weight: bold;margin-bottom: 1rem;color: #0f172a;}
.services-areas .section-intro p {font-size: 1.125rem;color: #64748b;line-height: 1.8;}
.services-areas .regions-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));gap: 2rem;}
.services-areas .region-card {background: white;border-radius: 1rem;overflow: hidden;box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);border: 1px solid #e2e8f0;transition: all 0.3s;}
.services-areas .region-card:hover {box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);transform: translateY(-4px);}
.services-areas .region-header {background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);color: white;padding: 1.5rem 2rem;display: flex;align-items: center;gap: 1rem;}
.services-areas .region-icon {width: 48px;height: 48px;background: rgba(255, 255, 255, 0.2);border-radius: 0.5rem;display: flex;align-items: center;justify-content: center;}
.services-areas .region-icon svg {width: 28px;height: 28px;}
.services-areas .region-header h3 {font-size: 1.5rem;font-weight: bold;}
.services-areas .region-content {padding: 2rem;}
.services-areas .dispatch-time {background: #f0fdf4;border: 1px solid #86efac;border-radius: 0.5rem;padding: 1rem;margin-bottom: 1.5rem;display: flex;align-items: center;gap: 0.75em;}
.services-areas .dispatch-time svg {width: 24px;height: 24px;color: #15803d;flex-shrink: 0;}
.services-areas .dispatch-time div h4 {font-size: 0.875rem;color: #15803d;margin-bottom: 0.25rem;font-weight: 600;}
.services-areas .dispatch-time div p {font-size: 1.125rem;color: #15803d;font-weight: bold;}
.services-areas .suburbs-list {margin-bottom: 1.5rem;}
.services-areas .suburbs-list h4 {font-size: 0.875rem;color: #0f172a;margin-bottom: 0.75rem;font-weight: 600;}
.services-areas .suburbs-tags {display: flex;flex-wrap: wrap;gap: 0.5rem;}
.services-areas .suburb-tag {background: #f3e8ff;color: #7c3aed;padding: 0.375rem 0.875rem;border-radius: 1rem;font-size: 0.8125rem;font-weight: 500;}

/* Regional SA Section */
.services-areas .regional-section {
background: #f8fafc;
padding: 5rem 0;
}

.services-areas .regional-cards {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
gap: 2rem;
}

.services-areas .regional-card {
background: white;
border-radius: 1rem;
overflow: hidden;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #e2e8f0;
}

.services-areas .regional-header {
background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);
color: white;
padding: 1.5rem 2rem;
display: flex;
align-items: center;
gap: 1rem;
}

.services-areas .regional-icon {
width: 48px;
height: 48px;
background: rgba(255, 255, 255, 0.2);
border-radius: 0.5rem;
display: flex;
align-items: center;
justify-content: center;
}

.services-areas .regional-icon svg {
width: 28px;
height: 28px;
}

.services-areas .regional-header h3 {
font-size: 1.5rem;
font-weight: bold;
}

.services-areas .regional-content {
padding: 2rem;
}

.services-areas .regional-content p {
color: #475569;
font-size: 0.9375rem;
line-height: 1.8;
margin-bottom: 1.5rem;
}

.services-areas .policy-box {
background: #f8fafc;
border-radius: 0.5rem;
padding: 1.25rem;
margin-bottom: 1.5rem;
}

.services-areas .policy-box h4 {
font-size: 0.875rem;
color: #0f172a;
margin-bottom: 0.75rem;
font-weight: 600;
}

.services-areas .policy-box ul {
list-style: none;
margin: 0;
padding: 0;
}

.services-areas .policy-box ul li {
color: #64748b;
font-size: 0.875rem;
padding-left: 1.5rem;
position: relative;
margin-bottom: 0.5rem;
}

.services-areas .policy-box ul li::before {
content: "✓";
position: absolute;
left: 0;
color: #7c3aed;
font-weight: bold;
font-size: 1.125rem;
}

.services-areas .locations-table {
width: 100%;
border-collapse: collapse;
}

.services-areas .locations-table th,
.services-areas .locations-table td {
padding: 0.75rem;
text-align: left;
border-bottom: 1px solid #e2e8f0;
}

.locations-table th {
background: #f8fafc;
color: #0f172a;
font-weight: 600;
font-size: 0.875rem;
}

.locations-table td {
color: #475569;
font-size: 0.875rem;
}

.locations-table tr:last-child td {
border-bottom: none;
}

/* Coverage Map Section */
.coverage-map-section {
padding: 5rem 0;
}

.coverage-stats {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 2rem;
margin-bottom: 3rem;
}

.stat-card {
text-align: center;
background: white;
border-radius: 1rem;
padding: 2rem;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #e2e8f0;
}

.stat-icon {
width: 64px;
height: 64px;
background: #f3e8ff;
border-radius: 1rem;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 1rem;
}

.stat-icon svg {
width: 32px;
height: 32px;
color: #7c3aed;
}

.stat-value {
font-size: 2.5rem;
font-weight: bold;
color: #7c3aed;
margin-bottom: 0.5rem;
}

.stat-label {
font-size: 0.9375rem;
color: #64748b;
font-weight: 500;
}

/* Local Commitment Section */
.commitment-section {
background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);
color: white;
padding: 5rem 0;
}

.commitment-content {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 3rem;
align-items: center;
}

.commitment-text h2 {
font-size: 2.5rem;
font-weight: bold;
margin-bottom: 1.5rem;
}

.commitment-text p {
font-size: 1.125rem;
color: #e9d5ff;
line-height: 1.8;
margin-bottom: 1rem;
}

.commitment-features {
display: grid;
gap: 1.5rem;
}

.commitment-feature {
background: rgba(255, 255, 255, 0.1);
border-radius: 0.75rem;
padding: 1.5rem;
display: flex;
align-items: start;
gap: 1rem;
}

.commitment-feature svg {
width: 28px;
height: 28px;
flex-shrink: 0;
margin-top: 0.25rem;
}

.commitment-feature h3 {
font-size: 1.125rem;
font-weight: 600;
margin-bottom: 0.5rem;
}

.commitment-feature p {
font-size: 0.9375rem;
color: #e9d5ff;
margin: 0;
}

/* CTA Section */


.btn-purple {
background: #7c3aed;
color: white;
padding: 1rem 2rem;
border-radius: 0.5rem;
text-decoration: none;
font-weight: 600;
font-size: 1.125rem;
transition: background 0.3s;
display: inline-block;
}

.btn-purple:hover {
background: #6d28d9;
}



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


.operations-content,
.regions-grid,
.regional-cards,
.coverage-stats,
.commitment-content {
grid-template-columns: 1fr;
}


}
/*end service areas css*/
/*Team page css*/
/* Team Intro Section */
.team-intro-section {
padding: 5rem 0;
background: #f8fafc;
}

.section-intro {
max-width: 800px;
margin: 0 auto;
text-align: center;
}

.section-intro h2 {
font-size: 2.5rem;
font-weight: bold;
margin-bottom: 1rem;
color: #0f172a;
}

.section-intro p {
font-size: 1.125rem;
color: #64748b;
line-height: 1.8;
margin-bottom: 1rem;
}

/* Team Members Section */
.team-section {
padding: 5rem 0;
}

.team-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
gap: 3rem;
}

.team-member {
background: white;
border-radius: 1rem;
overflow: hidden;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #e2e8f0;
transition: all 0.3s;
}

.team-member:hover {
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
transform: translateY(-4px);
}

.member-header {
background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);
color: white;
padding: 2rem;
display: flex;
align-items: center;
gap: 1.5rem;
}

.member-avatar {
width: 80px;
height: 80px;
background: rgba(255, 255, 255, 0.2);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 2rem;
font-weight: bold;
border: 3px solid rgba(255, 255, 255, 0.3);
flex-shrink: 0;
}

.member-title-block h3 {
font-size: 1.5rem;
font-weight: bold;
margin-bottom: 0.5rem;
}

.member-role {
font-size: 1rem;
color: #e9d5ff;
font-weight: 500;
}

.member-content {
padding: 2rem;
}

.accountability-section {
margin-bottom: 2rem;
}

.accountability-section h4 {
font-size: 0.875rem;
color: #7c3aed;
margin-bottom: 0.75rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.05em;
}

.accountability-section p {
color: #475569;
font-size: 0.9375rem;
line-height: 1.8;
margin-bottom: 1rem;
}

.accountability-list {
list-style: none;
margin: 0;
padding: 0;
}

.accountability-list li {
color: #64748b;
font-size: 0.875rem;
padding-left: 1.5rem;
position: relative;
margin-bottom: 0.5rem;
}

.accountability-list li::before {
content: "→";
position: absolute;
left: 0;
color: #7c3aed;
font-weight: bold;
}

.certifications-section {
background: #f8fafc;
border-radius: 0.5rem;
padding: 1.25rem;
}

.certifications-section h4 {
font-size: 0.875rem;
color: #0f172a;
margin-bottom: 0.75rem;
font-weight: 600;
display: flex;
align-items: center;
gap: 0.5rem;
}

.certifications-section h4 svg {
width: 18px;
height: 18px;
color: #7c3aed;
}

.cert-tags {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
}

.cert-tag {
background: white;
color: #7c3aed;
padding: 0.375rem 0.875rem;
border-radius: 1rem;
font-size: 0.8125rem;
font-weight: 600;
border: 1px solid #e9d5ff;
}

.team-page .contact-box {
background: #f0fdf4;
border: 1px solid #86efac;
border-radius: 0.5rem;
padding: 1rem;
margin-top: 1.5rem;
display: flex;
align-items: center;
gap: 0.75rem;
box-shadow:none;
}

.contact-box svg {
width: 20px;
height: 20px;
color: #15803d;
flex-shrink: 0;
}

.contact-box p {
font-size: 0.875rem;
color: #15803d;
font-weight: 600;
margin: 0;
}

/* Team Stats Section */
.stats-section {
background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);
color: white;
padding: 5rem 0;
}

.stats-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 3rem;
}

.stat-item {
text-align: center;
}

.stat-value {
font-size: 3rem;
font-weight: bold;
margin-bottom: 0.5rem;
color: white;
}

.stat-label {
font-size: 1rem;
color: #e9d5ff;
font-weight: 500;
}

/* Values Section */
.values-section {
background: #f8fafc;
padding: 5rem 0;
}

.values-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 2rem;
}

.value-card {
background: white;
border-radius: 1rem;
padding: 2rem;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #e2e8f0;
}

.value-icon {
width: 64px;
height: 64px;
background: #f3e8ff;
border-radius: 1rem;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 1.5rem;
}

.value-icon svg {
width: 32px;
height: 32px;
color: #7c3aed;
}

.value-card h3 {
font-size: 1.25rem;
font-weight: bold;
margin-bottom: 1rem;
color: #0f172a;
}

.value-card p {
color: #475569;
font-size: 0.9375rem;
line-height: 1.8;
}

/* CTA Section */


.btn-purple {
background: #7c3aed;
color: white;
padding: 1rem 2rem;
border-radius: 0.5rem;
text-decoration: none;
font-weight: 600;
font-size: 1.125rem;
transition: background 0.3s;
display: inline-block;
}

.btn-purple:hover {
background: #6d28d9;
}


/*End Team page css*/
/*partner page css*/
/* Technology Partners Section */
.partner-page .partners-section {
padding: 5rem 0;
}

.partner-page .section-intro {
max-width: 800px;
margin: 0 auto 3rem;
text-align: center;
}

.partner-page .section-intro h2 {
font-size: 2.5rem;
font-weight: bold;
margin-bottom: 1rem;
color: #0f172a;
}

.partner-page .section-intro p {
font-size: 1.125rem;
color: #64748b;
line-height: 1.8;
}

.partners-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
gap: 2rem;
}

.partner-card {
background: white;
border-radius: 1rem;
overflow: hidden;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #e2e8f0;
transition: all 0.3s;
}

.partner-card:hover {
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
transform: translateY(-4px);
}

.partner-header {
background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);
color: white;
padding: 1.5rem 2rem;
display: flex;
align-items: center;
gap: 1rem;
}

.partner-logo {
width: 60px;
height: 60px;
background: white;
border-radius: 0.5rem;
display: flex;
align-items: center;
justify-content: center;
font-weight: bold;
color: #7c3aed;
font-size: 1.25rem;
flex-shrink: 0;
}

.partner-header h3 {
font-size: 1.5rem;
font-weight: bold;
}

.partner-content {
padding: 2rem;
}

.partner-content p {
color: #475569;
font-size: 0.9375rem;
line-height: 1.8;
margin-bottom: 1.5rem;
}

.partner-capabilities {
background: #f8fafc;
border-radius: 0.5rem;
padding: 1.25rem;
}

.partner-capabilities h4 {
font-size: 0.875rem;
color: #0f172a;
margin-bottom: 0.75rem;
font-weight: 600;
}

.partner-capabilities ul {
list-style: none;
margin: 0;
padding: 0;
}

.partner-capabilities ul li {
color: #64748b;
font-size: 0.875rem;
padding-left: 1.5rem;
position: relative;
margin-bottom: 0.5rem;
}

.partner-capabilities ul li::before {
content: "✓";
position: absolute;
left: 0;
color: #7c3aed;
font-weight: bold;
font-size: 1.125rem;
}

.certification-badge {
background: #f0fdf4;
border: 1px solid #86efac;
border-radius: 0.5rem;
padding: 0.75rem 1rem;
margin-top: 1rem;
display: flex;
align-items: center;
gap: 0.75rem;
}

.certification-badge svg {
width: 20px;
height: 20px;
color: #15803d;
flex-shrink: 0;
}

.certification-badge span {
font-size: 0.875rem;
color: #15803d;
font-weight: normal;
}

/* Security Frameworks Section */
.security-section {
background: #f8fafc;
padding: 5rem 0;
}

.framework-cards {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
gap: 2rem;
}

.framework-card {
background: white;
border-radius: 1rem;
padding: 2rem;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #e2e8f0;
}

.framework-icon {
width: 64px;
height: 64px;
background: #f3e8ff;
border-radius: 1rem;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 1.5rem;
}

.framework-icon svg {
width: 32px;
height: 32px;
color: #7c3aed;
}

.framework-card h3 {
font-size: 1.25rem;
font-weight: bold;
margin-bottom: 1rem;
color: #0f172a;
}

.framework-card p {
color: #475569;
font-size: 0.9375rem;
line-height: 1.8;
margin-bottom: 1.5rem;
}

.alignment-box {
background: #f8fafc;
border-radius: 0.5rem;
padding: 1.25rem;
}

.alignment-box h4 {
font-size: 0.875rem;
color: #0f172a;
margin-bottom: 0.75rem;
font-weight: 600;
}

.alignment-box ul {
list-style: none;
margin: 0;
padding: 0;
}

.alignment-box ul li {
color: #64748b;
font-size: 0.875rem;
padding-left: 1.5rem;
position: relative;
margin-bottom: 0.5rem;
}

.alignment-box ul li::before {
content: "→";
position: absolute;
left: 0;
color: #7c3aed;
font-weight: bold;
}

/* Cabling Compliance Section */
.cabling-section {
padding: 5rem 0;
}

.cabling-content {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 3rem;
align-items: start;
}

.cabling-text h2 {
font-size: 2.5rem;
font-weight: bold;
margin-bottom: 1.5rem;
color: #0f172a;
}

.cabling-text p {
font-size: 1.125rem;
color: #64748b;
line-height: 1.8;
margin-bottom: 1.5rem;
}

.compliance-highlights {
display: grid;
gap: 1.5rem;
}

.compliance-item {
background: white;
border-radius: 0.75rem;
padding: 1.5rem;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #e2e8f0;
display: flex;
align-items: start;
gap: 1rem;
}

.compliance-item svg {
width: 28px;
height: 28px;
color: #7c3aed;
flex-shrink: 0;
margin-top: 0.25rem;
}

.compliance-item h3 {
font-size: 1.125rem;
font-weight: 600;
margin-bottom: 0.5rem;
color: #0f172a;
}

.compliance-item p {
font-size: 0.9375rem;
color: #64748b;
line-height: 1.6;
margin: 0;
}

.standards-box {
background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);
border-radius: 1rem;
padding: 2.5rem;
color: white;
}

.standards-box h3 {
font-size: 1.75rem;
font-weight: bold;
margin-bottom: 1.5rem;
}

.standards-list {
display: grid;
gap: 1rem;
}

.standard-item {
background: rgba(255, 255, 255, 0.1);
border-radius: 0.5rem;
padding: 1rem;
display: flex;
align-items: center;
gap: 1rem;
}

.standard-item svg {
width: 24px;
height: 24px;
flex-shrink: 0;
}

.standard-item div h4 {
font-size: 1rem;
font-weight: 600;
margin-bottom: 0.25rem;
}

.standard-item div p {
font-size: 0.875rem;
color: #e9d5ff;
margin: 0;
}

/* Disclaimer Section */
.disclaimer-section {
background: #f8fafc;
padding: 3rem 0;
}

.disclaimer-box {
background: white;
border-radius: 1rem;
padding: 2rem;
border-left: 4px solid #7c3aed;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
}

.disclaimer-box h4 {
font-size: 1rem;
color: #0f172a;
margin-bottom: 1rem;
font-weight: 600;
display: flex;
align-items: center;
gap: 0.5rem;
}

.disclaimer-box h4 svg {
width: 20px;
height: 20px;
color: #7c3aed;
}

.disclaimer-box p {
color: #64748b;
font-size: 0.875rem;
line-height: 1.6;
}

/* CTA Section */

.btn-purple {
background: #7c3aed;
color: white;
padding: 1rem 2rem;
border-radius: 0.5rem;
text-decoration: none;
font-weight: 600;
font-size: 1.125rem;
transition: background 0.3s;
display: inline-block;
}

.btn-purple:hover {
background: #6d28d9;
}




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

.partners-grid,
.framework-cards {
grid-template-columns: 1fr;
}

.cabling-content {
grid-template-columns: 1fr;
}

}
/*end partner page css*/

/*careers page css*/
.why-section {
padding: 5rem 0;
background: #f8fafc;
}

.section-intro {
max-width: 800px;
margin: 0 auto 3rem;
text-align: center;
}

.section-intro h2 {
font-size: 2.5rem;
font-weight: bold;
margin-bottom: 1rem;
color: #0f172a;
}

.section-intro p {
font-size: 1.125rem;
color: #64748b;
line-height: 1.8;
}

.benefits-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 2rem;
}

.benefit-card {
background: white;
border-radius: 1rem;
padding: 2rem;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #e2e8f0;
}

.benefit-icon {
width: 64px;
height: 64px;
background: #f3e8ff;
border-radius: 1rem;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 1.5rem;
}

.benefit-icon svg {
width: 32px;
height: 32px;
color: #7c3aed;
}

.benefit-card h3 {
font-size: 1.25rem;
font-weight: bold;
margin-bottom: 1rem;
color: #0f172a;
}

.benefit-card p {
color: #475569;
font-size: 0.9375rem;
line-height: 1.8;
}

/* Training Budget Section */
.training-section {
padding: 5rem 0;
background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);
color: white;
}

.training-content {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 3rem;
align-items: center;
}

.training-text h2 {
font-size: 2.5rem;
font-weight: bold;
margin-bottom: 1.5rem;
}

.training-text p {
font-size: 1.125rem;
color: #e9d5ff;
line-height: 1.8;
margin-bottom: 1rem;
}

.training-stats {
display: grid;
gap: 1.5rem;
}

.stat-box {
background: rgba(255, 255, 255, 0.1);
border-radius: 0.75rem;
padding: 1.5rem;
}

.stat-box .stat-value {
font-size: 2.5rem;
font-weight: bold;
margin-bottom: 0.5rem;
color: white;
}

.stat-box .stat-label {
font-size: 1rem;
color: #e9d5ff;
}

/* Career Pathways Section */
.pathways-section {
padding: 5rem 0;
}

.pathways-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
gap: 2rem;
}

.pathway-card {
background: white;
border-radius: 1rem;
overflow: hidden;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #e2e8f0;
transition: all 0.3s;
}

.pathway-card:hover {
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
transform: translateY(-4px);
}

.pathway-header {
background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);
color: white;
padding: 1.5rem 2rem;
}

.pathway-header h3 {
font-size: 1.5rem;
font-weight: bold;
margin-bottom: 0.5rem;
}

.pathway-header p {
font-size: 0.9375rem;
color: #e9d5ff;
}

.pathway-content {
padding: 2rem;
}

.pathway-content p {
color: #475569;
font-size: 0.9375rem;
line-height: 1.8;
margin-bottom: 1.5rem;
}

.pathway-list {
background: #f8fafc;
border-radius: 0.5rem;
padding: 1.25rem;
margin-bottom: 1.5rem;
}

.pathway-list h4 {
font-size: 0.875rem;
color: #0f172a;
margin-bottom: 0.75rem;
font-weight: 600;
}

.pathway-list ul {
list-style: none;
margin: 0;
padding: 0;
}

.pathway-list ul li {
color: #64748b;
font-size: 0.875rem;
padding-left: 1.5rem;
position: relative;
margin-bottom: 0.5rem;
}

.pathway-list ul li::before {
content: "→";
position: absolute;
left: 0;
color: #7c3aed;
font-weight: bold;
}

.pathway-duration {
background: #f0fdf4;
border: 1px solid #86efac;
border-radius: 0.5rem;
padding: 0.75rem 1rem;
display: flex;
align-items: center;
gap: 0.75rem;
}

.pathway-duration svg {
width: 20px;
height: 20px;
color: #15803d;
flex-shrink: 0;
}

.pathway-duration span {
font-size: 0.875rem;
color: #15803d;
font-weight: 600;
}

/* Open Positions Section */
.positions-section {
padding: 5rem 0;
background: #f8fafc;
}

.position-card {
background: white;
border-radius: 1rem;
overflow: hidden;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #e2e8f0;
margin-bottom: 2rem;
transition: all 0.3s;
}

.position-card:hover {
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
}

.position-header {
background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);
color: white;
padding: 2rem;
display: flex;
justify-content: space-between;
align-items: start;
}

.position-title h3 {
font-size: 1.75rem;
font-weight: bold;
margin-bottom: 0.5rem;
}

.position-meta {
display: flex;
gap: 1.5rem;
flex-wrap: wrap;
font-size: 0.9375rem;
color: #e9d5ff;
}

.position-meta span {
display: flex;
align-items: center;
gap: 0.5rem;
}

.position-badge {
background: rgba(255, 255, 255, 0.2);
color: white;
padding: 0.5rem 1rem;
border-radius: 2rem;
font-size: 0.875rem;
font-weight: 600;
white-space: nowrap;
}

.position-content {
padding: 2rem;
}

.position-description {
color: #475569;
font-size: 0.9375rem;
line-height: 1.8;
margin-bottom: 2rem;
}

.position-requirements {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 2rem;
margin-bottom: 2rem;
}

.requirements-box {
background: #f8fafc;
border-radius: 0.5rem;
padding: 1.25rem;
}

.requirements-box h4 {
font-size: 0.875rem;
color: #0f172a;
margin-bottom: 0.75rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.05em;
}

.requirements-box ul {
list-style: none;
margin: 0;
padding: 0;
}

.requirements-box ul li {
color: #64748b;
font-size: 0.875rem;
padding-left: 1.5rem;
position: relative;
margin-bottom: 0.5rem;
}

.requirements-box ul li::before {
content: "✓";
position: absolute;
left: 0;
color: #7c3aed;
font-weight: bold;
font-size: 1.125rem;
}

.apply-box {
background: #f0fdf4;
border: 1px solid #86efac;
border-radius: 0.5rem;
padding: 1.5rem;
display: flex;
justify-content: space-between;
align-items: center;
gap: 1rem;
}

.apply-box p {
font-size: 0.9375rem;
color: #15803d;
font-weight: 600;
margin: 0;
}

.btn-apply {
background: #7c3aed;
color: white;
padding: 0.75rem 1.5rem;
border-radius: 0.5rem;
text-decoration: none;
font-weight: 600;
font-size: 0.9375rem;
transition: background 0.3s;
display: inline-block;
white-space: nowrap;
}

.btn-apply:hover {
background: #6d28d9;
}

/* Talent Pool Section */
.talent-pool-section {
background: #0f172a;
color: white;
padding: 5rem 0;
}

.talent-pool-content {
max-width: 800px;
margin: 0 auto;
text-align: center;
}

.talent-pool-content h2 {
font-size: 2.5rem;
font-weight: bold;
margin-bottom: 1.5rem;
}

.talent-pool-content p {
font-size: 1.125rem;
color: #cbd5e1;
line-height: 1.8;
margin-bottom: 2rem;
}

.btn-large {
background: #7c3aed;
color: white;
padding: 1rem 2rem;
border-radius: 0.5rem;
text-decoration: none;
font-weight: 600;
font-size: 1.125rem;
transition: background 0.3s;
display: inline-block;
}

.btn-large:hover {
background: #6d28d9;
}

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

.benefits-grid,
.pathways-grid {
grid-template-columns: 1fr;
}

.training-content {
grid-template-columns: 1fr;
}

.position-requirements {
grid-template-columns: 1fr;
}

}
/*end careers page css*/
/*Backup & Disaster Recovery page css*/
.metrics-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 2rem;
margin-top: 3rem;
}

.metric-card {
background: white;
border-radius: 1rem;
padding: 2rem;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #e2e8f0;
}

.metric-icon {
width: 64px;
height: 64px;
background: #f3e8ff;
border-radius: 1rem;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 1.5rem;
}

.metric-icon svg {
width: 32px;
height: 32px;
color: #7c3aed;
}

.metric-card h3 {
font-size: 1.25rem;
font-weight: bold;
margin-bottom: 1rem;
color: #0f172a;
}

.metric-card p {
color: #475569;
font-size: 0.9375rem;
line-height: 1.8;
margin-bottom: 1rem;
}

.metric-value {
background: #f8fafc;
border-radius: 0.5rem;
padding: 1rem;
margin-top: 1rem;
}

.metric-value strong {
color: #7c3aed;
font-size: 1.125rem;
}

/* Tools Section */
.tools-section {
padding: 5rem 0;
background: #f8fafc;
}

.tools-section .section-title {
text-align: center;
}

.tech-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 2rem;
}

.tech-item {
background: white;
border-radius: 1rem;
padding: 2rem;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #e2e8f0;
}

.tech-icon {
width: 64px;
height: 64px;
background: #f3e8ff;
border-radius: 1rem;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 1.5rem;
}

.tech-icon svg {
width: 32px;
height: 32px;
color: #7c3aed;
}

.tech-item h3 {
font-size: 1.125rem;
font-weight: bold;
margin-bottom: 0.75rem;
color: #0f172a;
}

.tech-item p {
color: #64748b;
font-size: 0.875rem;
margin-bottom: 1rem;
}

.tech-tags {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
}


/* Deliverables Section */
.deliverables-section {
padding: 5rem 0;
}

.deliverables-section .section-title {
text-align: center;
}

.deliverables-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 2rem;
}

.deliverable-card {
background: white;
border-radius: 1rem;
padding: 2rem;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #e2e8f0;
}

.deliverable-header {
display: flex;
align-items: center;
gap: 1rem;
margin-bottom: 1rem;
}

.deliverable-icon {
width: 48px;
height: 48px;
background: #f3e8ff;
border-radius: 0.75rem;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}

.deliverable-icon svg {
width: 24px;
height: 24px;
color: #7c3aed;
}

.deliverable-card h3 {
font-size: 1.125rem;
font-weight: bold;
color: #0f172a;
}

.deliverable-card p {
color: #64748b;
font-size: 0.9375rem;
line-height: 1.6;
}
/* Who It's For Section */
.who-section {
padding: 5rem 0;
background: #f8fafc;
}

.clients-list {
display: grid;
gap: 1rem;
margin-top: 2rem;
}

.client-item {
display: flex;
align-items: center;
gap: 1rem;
background: white;
padding: 1.25rem;
border-radius: 0.75rem;
border: 1px solid #e2e8f0;
}

.client-icon {
width: 24px;
height: 24px;
color: #7c3aed;
flex-shrink: 0;
}

.client-item span {
font-size: 1rem;
color: #475569;
font-weight: 500;
}
/*End Backup & Disaster Recovery page css*/




@media screen and (min-width:100px) and (max-width:1023px){
.navbar-inner{padding:0 15px;}
.container{padding:0 15px;}
}