/*
Theme Name: Zenfy Child
Theme URI: https://www.zenfy-wp.egenslab.com/
Template: zenfy
Author: Egens Lab
Author URI: https://www.egenslab.com/
Description: Zenfy is a WordPress Theme for the Startup as well as Digital Agency purposes. This theme is designed in a way that you can use it for SAAS Product presentation and any Creative Agency purpose also can Digital Marketing, IT Agency or Software Agency purposes. It has been made with the think of current age demand so anyone can present their website in a modern way. There are 5 demos with 30+ inner pages and Light and Dark versions are available in this theme.. It has made with the Elementor Page Builder so easily anyone can customize it by Drag and Drop. It is compatible for all browsers and fully responsive so very much suitable for any devices.
Version: 1.1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: blog, one-column, custom-background, custom-colors, custom-logo, custom-menu, editor-style, featured-images, footer-widgets, full-width-template, rtl-support, sticky-post, theme-options, threaded-comments, translation-ready, block-styles, wide-blocks, accessibility-ready,This theme, like WordPress, is licensed under the GPL.Use it to make something cool, have fun, and share what you've learned with others.

*/

/* =====================================
   ITDESK Custom Sections
   ===================================== */

/* --- Section 4: Why Us / Default Light (style_one) --- */
.itdesk-why-us-section .why-us-card {
  background: var(--white-color);
  box-shadow: 0px 0px 35px 0px rgba(0, 0, 0, 0.05);
  border-radius: 10px;
  padding: 40px 30px;
  height: 100%;
  transition: all 0.4s ease;
}

.itdesk-why-us-section .why-us-card:hover {
  transform: translateY(-5px);
  box-shadow: 0px 10px 40px 0px rgba(48, 103, 255, 0.1);
}

.itdesk-why-us-section .why-us-card .icon-area {
  margin-bottom: 25px;
}

.itdesk-why-us-section .why-us-card .icon-area i {
  font-size: 40px;
  color: var(--primary-color1);
}

.itdesk-why-us-section .why-us-card .icon-area svg {
  width: 40px;
  height: 40px;
  fill: var(--primary-color1);
}

.itdesk-why-us-section .why-us-card .card-content h4 {
  color: var(--title-color);
  font-family: var(--font-hankenGrotesk);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 12px;
}

.itdesk-why-us-section .why-us-card .card-content p {
  color: var(--text-color);
  font-family: var(--font-inter);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.7;
  margin-bottom: 0;
}

/* --- Section 4: Why Us / Vivid Variant (style_three) --- */
.itdesk-why-us-section.vivid-variant {
  background: linear-gradient(135deg, #0f1a3c 0%, #1a1a4e 30%, #2d1b69 60%, #0f2027 100%);
  padding: 100px 0;
  position: relative;
  overflow: hidden;
}

.itdesk-why-us-section.vivid-variant .vivid-particles {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.itdesk-why-us-section.vivid-variant .vivid-particles .particle {
  position: absolute;
  border-radius: 50%;
  background: rgba(102, 126, 234, 0.6);
  animation: vividFloat 7s ease-in-out infinite;
}

.itdesk-why-us-section.vivid-variant .section-title.vivid span {
  color: #fff;
}

.itdesk-why-us-section.vivid-variant .section-title.vivid span svg {
  fill: #fff;
}

.itdesk-why-us-section.vivid-variant .section-title.vivid h2 {
  color: #fff;
  font-family: var(--font-hankenGrotesk);
  font-size: 40px;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 18px;
}

.itdesk-why-us-section.vivid-variant .section-title.vivid p {
  color: rgba(255, 255, 255, 0.7);
  font-family: var(--font-inter);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  max-width: 600px;
  margin: 0 auto;
}

.itdesk-why-us-section.vivid-variant .why-us-card.vivid-card {
  background: #1c1c3a;
  border: 1px solid rgba(102, 126, 234, 0.15);
  border-radius: 14px;
  padding: 40px 30px;
  height: 100%;
  position: relative;
  transition: all 0.4s ease;
}

.itdesk-why-us-section.vivid-variant .why-us-card.vivid-card:hover {
  transform: translateY(-8px);
  border-color: rgba(102, 126, 234, 0.4);
  box-shadow: 0 20px 50px rgba(102, 126, 234, 0.2), 0 0 30px rgba(118, 75, 162, 0.1);
}

.itdesk-why-us-section.vivid-variant .why-us-card .icon-area {
  margin-bottom: 25px;
}

.itdesk-why-us-section.vivid-variant .why-us-card .icon-area .icon-circle {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.itdesk-why-us-section.vivid-variant .why-us-card .icon-area .icon-circle i {
  font-size: 32px;
  color: #fff;
}

.itdesk-why-us-section.vivid-variant .why-us-card .icon-area .icon-circle svg {
  width: 32px;
  height: 32px;
  fill: #fff;
}

.itdesk-why-us-section.vivid-variant .why-us-card .card-content h4 {
  color: #fff;
  font-family: var(--font-hankenGrotesk);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 12px;
}

.itdesk-why-us-section.vivid-variant .why-us-card .card-content p {
  color: rgba(255, 255, 255, 0.65);
  font-family: var(--font-inter);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.7;
  margin-bottom: 0;
}

@keyframes vividFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-12px); }
}

/* --- Section 5: How It Works / Timeline Variant (style_two) --- */
.itdesk-how-it-works-section.timeline-variant {
  background: linear-gradient(180deg, #EDF1FC 0%, rgba(201,215,255,0.13) 100%);
  padding: 100px 0;
}

.itdesk-how-it-works-section.timeline-variant .timeline-row {
  position: relative;
}

.itdesk-how-it-works-section.timeline-variant .timeline-row::before {
  content: '';
  position: absolute;
  top: 48px;
  left: 50%;
  transform: translateX(-50%);
  width: 70%;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--primary-color1), transparent);
  opacity: 0.3;
  pointer-events: none;
}

.itdesk-how-it-works-section.timeline-variant .step-card {
  background: #fff;
  border-radius: 12px;
  padding: 40px 30px 30px;
  height: 100%;
  text-align: center;
  position: relative;
  transition: all 0.4s ease;
  box-shadow: 0 4px 24px rgba(0,0,0,0.04);
}

.itdesk-how-it-works-section.timeline-variant .step-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 32px rgba(48,103,255,0.10);
}

.itdesk-how-it-works-section.timeline-variant .step-card .step-circle {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--primary-color1);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 18px;
  position: relative;
  z-index: 2;
}

.itdesk-how-it-works-section.timeline-variant .step-card .step-circle-number {
  color: #fff;
  font-family: var(--font-hankenGrotesk);
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
}

.itdesk-how-it-works-section.timeline-variant .step-card .timeline-dot {
  display: none;
}

.itdesk-how-it-works-section.timeline-variant .step-card .card-content h4 {
  color: var(--title-color);
  font-family: var(--font-hankenGrotesk);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 10px;
}

.itdesk-how-it-works-section.timeline-variant .step-card .card-content p {
  color: var(--text-color);
  font-family: var(--font-inter);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.7;
  margin-bottom: 0;
}

/* --- Section 5: How It Works / Default Light (style_one) --- */
.itdesk-how-it-works-section .step-card {
  background: var(--white-color);
  box-shadow: 0px 0px 35px 0px rgba(0, 0, 0, 0.05);
  border-radius: 10px;
  padding: 40px 30px;
  height: 100%;
  text-align: center;
  position: relative;
  transition: all 0.4s ease;
}

.itdesk-how-it-works-section .step-card:hover {
  transform: translateY(-5px);
  box-shadow: 0px 10px 40px 0px rgba(48, 103, 255, 0.1);
}

.itdesk-how-it-works-section .step-card .step-number {
  color: var(--primary-color1);
  font-family: var(--font-hankenGrotesk);
  font-size: 48px;
  font-weight: 800;
  line-height: 1;
  margin-bottom: 20px;
  opacity: 0.15;
}

.itdesk-how-it-works-section .step-card .card-content h4 {
  color: var(--title-color);
  font-family: var(--font-hankenGrotesk);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 12px;
}

.itdesk-how-it-works-section .step-card .card-content p {
  color: var(--text-color);
  font-family: var(--font-inter);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.7;
  margin-bottom: 0;
}

/* --- Section 6: Pricing Formulas / Colored Tinted Cards (style_one) --- */
.itdesk-pricing-formulas-section {
  padding: 100px 0;
}

.itdesk-pricing-card {
  border-radius: 14px;
  padding: 45px 30px;
  height: 100%;
  display: flex;
  flex-direction: column;
  position: relative;
  transition: all 0.4s ease;
  border: 1px solid transparent;
}


.itdesk-pricing-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 12px 40px rgba(0,0,0,0.08);
}

.itdesk-pricing-card.featured {
  border-color: var(--primary-color1);
  box-shadow: 0 4px 20px rgba(48,103,255,0.10);
}

.itdesk-pricing-card.featured:hover {
  box-shadow: 0 12px 40px rgba(48,103,255,0.15);
}

.itdesk-pricing-card .pricing-tag {
  display: inline-block;
  font-family: var(--font-inter);
  font-weight: 600;
  font-size: 12px;
  line-height: 1;
  color: var(--white-color);
  background: var(--primary-color1);
  padding: 6px 14px;
  border-radius: 20px;
  margin-bottom: 20px;
  align-self: flex-start;
}

.itdesk-pricing-card.featured .pricing-tag {
  background: var(--title-color);
}

.itdesk-pricing-card .pricing-title {
  color: var(--title-color);
  font-family: var(--font-hankenGrotesk);
  font-size: 24px;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 12px;
}

.itdesk-pricing-card .pricing-description {
  color: var(--text-color);
  font-family: var(--font-inter);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.7;
  margin-bottom: 25px;
}

.itdesk-pricing-card .pricing-features {
  list-style: none;
  padding: 0;
  margin: 0 0 30px;
  flex-grow: 1;
}

.itdesk-pricing-card .pricing-features li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-family: var(--font-inter);
  font-weight: 400;
  font-size: 14px;
  letter-spacing: 0.02em;
  color: var(--text-color);
  line-height: 1.5;
  padding-bottom: 14px;
  margin-bottom: 12px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.itdesk-pricing-card .pricing-features li:last-child {
  padding-bottom: 0;
  margin-bottom: 0;
  border-bottom: none;
}

.itdesk-pricing-card .pricing-features li svg {
  flex-shrink: 0;
  fill: var(--primary-color1);
  width: 16px;
  height: 16px;
  margin-top: 2px;
}

.itdesk-pricing-card .pricing-btn-area {
  margin-top: auto;
}

.itdesk-pricing-card .pricing-btn {
  width: 100%;
  justify-content: center;
}

/* --- Section 6c: Pricing Formulas Dark Theme (style_two) --- */
.itdesk-dark-section {
  background-color: #121212;
  padding: 95px 0;
  margin-left: 60px;
  margin-right: 60px;
  border-radius: 15px;
  overflow: hidden;
  position: relative;
}

@media (max-width: 1600px) {
  .itdesk-dark-section {
    padding: 95px 30px;
    margin-left: 40px;
    margin-right: 40px;
  }
}

@media (max-width: 1399px) {
  .itdesk-dark-section {
    padding: 75px 30px;
    margin-left: 30px;
    margin-right: 30px;
    border-radius: 12px;
  }
}

@media (max-width: 1199px) {
  .itdesk-dark-section {
    padding: 70px 20px;
    margin-left: 20px;
    margin-right: 20px;
    border-radius: 10px;
  }
}

@media (max-width: 991px) {
  .itdesk-dark-section {
    padding: 70px 20px;
    margin-left: 10px;
    margin-right: 10px;
  }
}

@media (max-width: 575px) {
  .itdesk-dark-section {
    padding: 70px 0;
    margin-left: 0;
    margin-right: 0;
    border-radius: 8px;
  }
}

.itdesk-dark-section .section-title > span {
  border-radius: 50px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  padding: 13px 20px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #ffffff;
  font-family: var(--font-inter);
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.39px;
  text-transform: uppercase;
  margin-bottom: 10px;
}

.itdesk-dark-section .section-title > span svg {
  fill: var(--primary-color1);
}

.itdesk-dark-section .section-title h2 {
  color: #ffffff;
  font-family: var(--font-hankenGrotesk);
  font-size: 50px;
  font-weight: 800;
  line-height: 1.2;
  margin-bottom: 0;
}

.itdesk-dark-section .section-title p {
  color: rgba(255, 255, 255, 0.6);
  font-family: var(--font-inter);
  font-size: 20px;
  font-weight: 400;
  line-height: 1.7;
  margin-bottom: 0;
}

.itdesk-dark-pricing-card {
  background: #121212;
  border: 1px solid rgba(255, 255, 255, 0.20);
  border-radius: 10px;
  padding: 40px 35px;
  height: 100%;
  display: flex;
  flex-direction: column;
  position: relative;
  transition: all 0.4s ease;
}

.itdesk-dark-pricing-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3);
  border-color: rgba(255, 255, 255, 0.3);
}

.itdesk-dark-pricing-card.featured {
  border-color: var(--primary-color1);
  box-shadow: 0 4px 20px rgba(48, 103, 255, 0.2);
}

.itdesk-dark-pricing-card.featured:hover {
  box-shadow: 0 12px 40px rgba(48, 103, 255, 0.3);
}

.itdesk-dark-pricing-card .pricing-tag {
  display: inline-block;
  font-family: var(--font-inter);
  font-weight: 600;
  font-size: 12px;
  line-height: 1;
  color: #ffffff;
  background: var(--primary-color1);
  padding: 6px 14px;
  border-radius: 20px;
  margin-bottom: 20px;
  align-self: flex-start;
}

.itdesk-dark-pricing-card.featured .pricing-tag {
  background: var(--primary-color1);
}

.itdesk-dark-pricing-card .pricing-title {
  color: #ffffff;
  font-family: var(--font-hankenGrotesk);
  font-size: 30px;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 10px;
}

.itdesk-dark-pricing-card .pricing-description {
  color: rgba(255, 255, 255, 0.6);
  font-family: var(--font-inter);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.8;
  margin-bottom: 0;
}

.itdesk-dark-pricing-card .pricing-features {
  list-style: none;
  padding: 0;
  margin: 0 0 30px;
  flex-grow: 1;
}

.itdesk-dark-pricing-card .pricing-features li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-family: var(--font-inter);
  font-weight: 400;
  font-size: 15px;
  letter-spacing: 0.02em;
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.8;
  padding-bottom: 14px;
  margin-bottom: 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.itdesk-dark-pricing-card .pricing-features li:last-child {
  padding-bottom: 0;
  margin-bottom: 0;
  border-bottom: none;
}

.itdesk-dark-pricing-card .pricing-features li svg {
  flex-shrink: 0;
  fill: var(--primary-color1);
  width: 16px;
  height: 16px;
  margin-top: 3px;
}

.itdesk-dark-pricing-card .pricing-btn-area {
  margin-top: auto;
  padding-top: 20px;
}

.itdesk-dark-pricing-card .pricing-btn {
  width: 100%;
  justify-content: center;
  background: var(--primary-color1);
  color: #ffffff;
  border: none;
  border-radius: 10px;
  padding: 16px 32px;
  font-family: var(--font-inter);
  font-weight: 600;
  font-size: 15px;
  transition: all 0.4s ease;
}

.itdesk-dark-pricing-card .pricing-btn:hover {
  background: #2555d4;
  transform: translateY(-2px);
}

.itdesk-dark-pricing-card.featured .pricing-btn {
  background: #ffffff;
  color: #121212;
}

.itdesk-dark-pricing-card.featured .pricing-btn:hover {
  background: rgba(255, 255, 255, 0.9);
}

/* --- Global fix for margin utility in child --- */
.sec-mar {
  margin: 120px 0;
}

@media (max-width: 1199px) {
  .sec-mar {
    margin: 100px 0;
  }
}

@media (max-width: 991px) {
  .sec-mar {
    margin: 90px 0;
  }
}

.itdesk-dark-section.sec-mar {
  margin-top: 0;
  margin-bottom: 0;
}

/* --- Column utility for 5-column grid --- */
.col-xl-2dot4 {
  flex: 0 0 20%;
  max-width: 20%;
}

@media (max-width: 1199px) {
  .col-xl-2dot4 {
    flex: 0 0 33.333%;
    max-width: 33.333%;
  }
}

@media (max-width: 767px) {
  .col-xl-2dot4 {
    flex: 0 0 50%;
    max-width: 50%;
  }
}

/* --- Section 7: Hours & Timezone --- */
.itdesk-hours-timezone-section .timezone-card {
  background: var(--white-color);
  box-shadow: 0px 0px 35px 0px rgba(0, 0, 0, 0.05);
  border-radius: 12px;
  padding: 40px 30px;
  height: 100%;
  text-align: center;
  transition: all 0.4s ease;
}

.itdesk-hours-timezone-section .timezone-card:hover {
  transform: translateY(-5px);
  box-shadow: 0px 10px 40px 0px rgba(48, 103, 255, 0.10);
}

.itdesk-hours-timezone-section .timezone-card .icon-area {
  margin-bottom: 25px;
}

.itdesk-hours-timezone-section .timezone-card .icon-area i {
  font-size: 40px;
  color: var(--primary-color1);
}

.itdesk-hours-timezone-section .timezone-card .icon-area svg {
  width: 40px;
  height: 40px;
  fill: var(--primary-color1);
}

.itdesk-hours-timezone-section .timezone-card .card-content h4 {
  color: var(--title-color);
  font-family: var(--font-hankenGrotesk);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 12px;
}

.itdesk-hours-timezone-section .timezone-card .card-content p {
  color: var(--text-color);
  font-family: var(--font-inter);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.7;
  margin-bottom: 0;
}

/* --- Section 8: Profiles Table (style_one) --- */
.itdesk-profiles-table-section .profiles-table-wrap {
  overflow-x: auto;
  border-radius: 12px;
  box-shadow: 0px 0px 35px 0px rgba(0, 0, 0, 0.04);
}

.itdesk-profiles-table-section .profiles-table-wrap table {
  width: 100%;
  border-collapse: collapse;
  min-width: 640px;
}

.itdesk-profiles-table-section .profiles-table-wrap thead th {
  background: var(--primary-color1);
  color: #fff;
  font-family: var(--font-hankenGrotesk);
  font-size: 15px;
  font-weight: 600;
  padding: 18px 20px;
  text-align: left;
  white-space: nowrap;
}

.itdesk-profiles-table-section .profiles-table-wrap tbody td {
  background: var(--white-color);
  color: var(--text-color);
  font-family: var(--font-inter);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.6;
  padding: 16px 20px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
}

.itdesk-profiles-table-section .profiles-table-wrap tbody tr:last-child td {
  border-bottom: none;
}

.itdesk-profiles-table-section .profiles-table-wrap tbody tr:hover td {
  background: rgba(48, 103, 255, 0.02);
}

.itdesk-profiles-table-section .profiles-table-wrap td.profile-name {
  color: var(--title-color);
  font-weight: 600;
}

.itdesk-profiles-table-section .profiles-table-wrap .profile-level {
  display: inline-block;
  background: rgba(48, 103, 255, 0.08);
  color: var(--primary-color1);
  font-weight: 600;
  font-size: 13px;
  padding: 4px 12px;
  border-radius: 20px;
}

@media (max-width: 767px) {
  .itdesk-profiles-table-section .profiles-table-wrap table {
    min-width: 100%;
  }
  .itdesk-profiles-table-section .profiles-table-wrap thead {
    display: none;
  }
  .itdesk-profiles-table-section .profiles-table-wrap tbody tr {
    display: block;
    margin-bottom: 16px;
    background: var(--white-color);
    border-radius: 10px;
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.04);
    overflow: hidden;
  }
  .itdesk-profiles-table-section .profiles-table-wrap tbody td {
    display: flex;
    padding: 12px 16px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  }
  .itdesk-profiles-table-section .profiles-table-wrap tbody td:last-child {
    border-bottom: none;
  }
  .itdesk-profiles-table-section .profiles-table-wrap tbody td::before {
    content: attr(data-label);
    font-weight: 600;
    width: 130px;
    flex-shrink: 0;
    color: var(--title-color);
    font-family: var(--font-hankenGrotesk);
    font-size: 13px;
  }
}

/* --- Section 8: Profiles Cards (style_two) --- */
.itdesk-profiles-table-section .profile-card {
  background: var(--white-color);
  box-shadow: 0px 0px 35px 0px rgba(0, 0, 0, 0.05);
  border-radius: 12px;
  padding: 30px;
  height: 100%;
  border-left: 4px solid var(--primary-color1);
  transition: all 0.4s ease;
}

.itdesk-profiles-table-section .profile-card:hover {
  transform: translateY(-4px);
  box-shadow: 0px 10px 40px 0px rgba(48, 103, 255, 0.10);
}

.itdesk-profiles-table-section .profile-card .card-header-area {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.itdesk-profiles-table-section .profile-card .profile-name {
  color: var(--title-color);
  font-family: var(--font-hankenGrotesk);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0;
}

.itdesk-profiles-table-section .profile-card .profile-level {
  display: inline-block;
  background: rgba(48, 103, 255, 0.08);
  color: var(--primary-color1);
  font-weight: 600;
  font-size: 13px;
  padding: 4px 12px;
  border-radius: 20px;
  white-space: nowrap;
}

.itdesk-profiles-table-section .profile-card .card-content .profile-label {
  font-family: var(--font-hankenGrotesk);
  font-size: 12px;
  font-weight: 600;
  color: var(--title-color);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 6px;
  margin-top: 12px;
}

.itdesk-profiles-table-section .profile-card .card-content .profile-label:first-child {
  margin-top: 0;
}

.itdesk-profiles-table-section .profile-card .card-content p {
  color: var(--text-color);
  font-family: var(--font-inter);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.6;
  margin-bottom: 0;
}

/* --- Section 9: Differentiation --- */
.itdesk-differentiation-section .diff-card {
  background: var(--white-color);
  box-shadow: 0px 0px 35px 0px rgba(0, 0, 0, 0.05);
  border-radius: 12px;
  padding: 35px 30px;
  height: 100%;
  display: flex;
  gap: 20px;
  transition: all 0.4s ease;
}

.itdesk-differentiation-section .diff-card:hover {
  transform: translateY(-4px);
  box-shadow: 0px 10px 40px 0px rgba(48, 103, 255, 0.10);
}

.itdesk-differentiation-section .diff-card .diff-number {
  font-family: var(--font-hankenGrotesk);
  font-size: 48px;
  font-weight: 800;
  line-height: 1;
  color: var(--primary-color1);
  opacity: 0.15;
  flex-shrink: 0;
  min-width: 50px;
}

.itdesk-differentiation-section .diff-card .card-content h4 {
  color: var(--title-color);
  font-family: var(--font-hankenGrotesk);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 10px;
}

.itdesk-differentiation-section .diff-card .card-content p {
  color: var(--text-color);
  font-family: var(--font-inter);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.7;
  margin-bottom: 0;
}

/* --- Section 10: Methodology (cybersec theme) --- */
.itdesk-methodology-section {
  background: linear-gradient(135deg, #0B1A3A 0%, #162A50 100%);
  padding: 100px 0;
}

.itdesk-methodology-section .section-title h2,
.itdesk-methodology-section .section-title > span {
  color: #fff;
  fill: #fff;
}

.itdesk-methodology-section .section-title > span svg path {
  fill: #fff;
}

.itdesk-methodology-section .section-title p {
  color: rgba(255,255,255,0.65);
}

.itdesk-methodology-section .methodology-row {
  position: relative;
}

.itdesk-methodology-section .methodology-row .method-card {
  text-align: center;
  position: relative;
}

.itdesk-methodology-section .method-card .method-step-circle {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(48, 103, 255, 0.2);
  border: 2px solid var(--primary-color1);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
  position: relative;
  z-index: 2;
}

.itdesk-methodology-section .method-card .method-step-number {
  color: #fff;
  font-family: var(--font-hankenGrotesk);
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
}

.itdesk-methodology-section .method-card .method-connector-line {
  display: none;
}

.itdesk-methodology-section .method-card .card-content h4 {
  color: #fff;
  font-family: var(--font-hankenGrotesk);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 10px;
}

.itdesk-methodology-section .method-card .card-content p {
  color: rgba(255,255,255,0.65);
  font-family: var(--font-inter);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.7;
  margin-bottom: 0;
}

@media (max-width: 1199px) {
  .itdesk-methodology-section .method-card .method-connector-line {
    display: block;
    width: 2px;
    height: 24px;
    background: rgba(48,103,255,0.3);
    margin: 0 auto;
  }
}

/* --- EG Solution Style 4: Remove hover movement (keep color changes) --- */
.home4-service-section .sevices-wrap .single-services {
  transition: color 0.5s, background-color 0.5s, border-color 0.5s;
}

.home4-service-section .sevices-wrap .single-services .icon,
.home4-service-section .sevices-wrap .single-services .icon svg,
.home4-service-section .sevices-wrap .single-services h5,
.home4-service-section .sevices-wrap .single-services .button-area .explore-btn,
.home4-service-section .sevices-wrap .single-services .button-area .explore-btn svg {
  transition: color 0.5s, background-color 0.5s, border-color 0.5s, fill 0.5s;
}

.home4-service-section .sevices-wrap .single-services .content {
  transform: none !important;
}

.home4-service-section .sevices-wrap .single-services:hover .icon svg {
  animation: none;
}

.home4-service-section .sevices-wrap .single-services:hover .explore-btn svg {
  transform: none;
}

/* --- EG Solution Style 2: Remove hover movement (keep color changes) --- */
.home2-service-section .sevices-wrap .single-services {
  transition: color 0.5s, background-color 0.5s, border-color 0.5s;
}

.home2-service-section .sevices-wrap .single-services .icon,
.home2-service-section .sevices-wrap .single-services .icon svg,
.home2-service-section .sevices-wrap .single-services h5,
.home2-service-section .sevices-wrap .single-services h5 a,
.home2-service-section .sevices-wrap .single-services h5 a span,
.home2-service-section .sevices-wrap .single-services .button-area .explore-btn,
.home2-service-section .sevices-wrap .single-services .button-area .explore-btn svg {
  transition: color 0.5s, background-color 0.5s, border-color 0.5s, fill 0.5s, stroke 0.5s;
}

.home2-service-section .sevices-wrap .single-services .services-img,
.home2-service-section .sevices-wrap .single-services .content {
  transform: none !important;
}

.home2-service-section .sevices-wrap .single-services:hover .icon svg {
  fill: var(--primary-color1);
  stroke: var(--primary-color1);
  color: var(--primary-color1);
  animation: bounceIn 1s linear;
}

.home2-service-section .sevices-wrap .single-services .icon svg {
  width: 50px;
  height: auto;
}

.home2-service-section .sevices-wrap .single-services:hover .explore-btn svg {
  transform: none;
}

/* --- Navigation: always show background --- */
header.header-area.style-1,
header.header-area.style-2,
header.header-area.style-3 {
  background-color: var(--dark-white-color) !important;
}

/* --- Section 5.2: Notre Histoire --- */
.itdesk-history-section {
  position: relative;
  padding: 0 15%;
}
@media (max-width: 1799px) {
  .itdesk-history-section {
    padding: 0 11%;
  }
}
@media (max-width: 1699px) {
  .itdesk-history-section {
    padding: 0 9%;
  }
}
@media (min-width: 1400px) and (max-width: 1599px) {
  .itdesk-history-section {
    padding: 0 3%;
  }
}
@media (max-width: 1399px) {
  .itdesk-history-section {
    padding: 0 2.5%;
  }
}
@media (max-width: 1199px) {
  .itdesk-history-section {
    padding: 0 20px;
  }
}
@media (max-width: 576px) {
  .itdesk-history-section {
    padding: 0;
  }
}

.itdesk-history-section .section-title-wrap {
  position: sticky;
  top: 100px;
}

.itdesk-history-section .section-title-wrap .vector {
  position: absolute;
  top: 0;
  right: -37px;
}
@media (max-width: 991px) {
  .itdesk-history-section .section-title-wrap .vector {
    display: none;
  }
}
.itdesk-history-section .section-title-wrap .vector svg {
  fill: var(--text-color);
}

.itdesk-history-section .section-title3 > span {
  border-radius: 50px;
  border: 1px solid rgba(var(--text-color-opc), 0.2);
  padding: 13px 20px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--text-color);
  font-family: var(--font-inter);
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.39px;
  text-transform: uppercase;
  margin-bottom: 10px;
}
.itdesk-history-section .section-title3 > span svg {
  fill: var(--primary-color1);
}

.itdesk-history-section .section-title3 h2 {
  color: var(--title-color);
  font-family: var(--font-hankenGrotesk);
  font-size: 58px;
  font-weight: 800;
  line-height: 1.2;
  margin-bottom: 0;
}
@media (max-width: 1399px) {
  .itdesk-history-section .section-title3 h2 {
    font-size: 50px;
  }
}
@media (max-width: 1199px) {
  .itdesk-history-section .section-title3 h2 {
    font-size: 42px;
  }
}
@media (max-width: 767px) {
  .itdesk-history-section .section-title3 h2 {
    font-size: 38px;
  }
}

.itdesk-history-content {
  padding: 10px 0;
}

.itdesk-history-content p {
  color: var(--text-color);
  font-family: var(--font-inter);
  font-size: 18px;
  font-weight: 400;
  line-height: 1.8;
  margin-bottom: 24px;
}
.itdesk-history-content p:last-child {
  margin-bottom: 0;
}
@media (max-width: 767px) {
  .itdesk-history-content p {
    font-size: 16px;
    margin-bottom: 20px;
  }
}

/* --- Section 5.2: Notre Histoire — Timeline Style --- */
.itdesk-history-timeline-section .section-title > span {
  border-radius: 50px;
  border: 1px solid rgba(var(--text-color-opc), 0.2);
  padding: 13px 20px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--text-color);
  font-family: var(--font-inter);
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.39px;
  text-transform: uppercase;
  margin-bottom: 10px;
}
.itdesk-history-timeline-section .section-title > span svg {
  fill: var(--primary-color1);
}
.itdesk-history-timeline-section .section-title h2 {
  color: var(--title-color);
  font-family: var(--font-hankenGrotesk);
  font-size: 50px;
  font-weight: 800;
  line-height: 1.2;
  margin-bottom: 0;
}
@media (max-width: 1199px) {
  .itdesk-history-timeline-section .section-title h2 {
    font-size: 42px;
  }
}
@media (max-width: 767px) {
  .itdesk-history-timeline-section .section-title h2 {
    font-size: 38px;
  }
}

.itdesk-timeline {
  position: relative;
  padding-left: 50px;
}
.itdesk-timeline::before {
  content: "";
  position: absolute;
  left: 8px;
  top: 8px;
  bottom: 8px;
  width: 2px;
  background: rgba(var(--text-color-opc), 0.1);
  border-radius: 2px;
}

.timeline-item {
  position: relative;
  padding-bottom: 40px;
}
.timeline-item:last-child {
  padding-bottom: 0;
}

.timeline-dot {
  position: absolute;
  left: -50px;
  top: 8px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--primary-color1);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
  box-shadow: 0 0 0 4px rgba(var(--primary-color1), 0.15);
  transition: all 0.4s ease;
}
.timeline-dot svg {
  fill: #fff;
  width: 12px;
  height: 12px;
}
.timeline-item:hover .timeline-dot {
  transform: scale(1.2);
  box-shadow: 0 0 0 6px rgba(var(--primary-color1), 0.15);
}

.timeline-content {
  background: var(--dark-white-color);
  border-radius: 12px;
  padding: 30px 35px;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.05);
  transition: all 0.4s ease;
}
.timeline-content:hover {
  transform: translateX(8px);
  box-shadow: 0 10px 40px rgba(48, 103, 255, 0.10);
}

.timeline-content p {
  color: var(--text-color);
  font-family: var(--font-inter);
  font-size: 18px;
  font-weight: 400;
  line-height: 1.8;
  margin-bottom: 0;
}
@media (max-width: 767px) {
  .timeline-content p {
    font-size: 16px;
  }
}

@media (max-width: 767px) {
  .itdesk-timeline {
    padding-left: 35px;
  }
  .timeline-dot {
    left: -35px;
    width: 20px;
    height: 20px;
  }
  .timeline-dot svg {
    width: 10px;
    height: 10px;
  }
  .timeline-content {
    padding: 25px;
  }
}

/* --- Section 5.2: Notre Histoire — Values Icons --- */
.itdesk-history-values {
  margin-top: 60px;
}
.itdesk-history-value-card {
  text-align: center;
  padding: 30px 20px;
}
.itdesk-history-value-icon {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: rgba(var(--primary-color1-rgb), 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
}
.itdesk-history-value-icon svg {
  width: 32px;
  height: 32px;
  fill: var(--primary-color1);
}
.itdesk-history-value-title {
  font-family: var(--font-hankenGrotesk);
  font-size: 20px;
  font-weight: 700;
  color: var(--title-color);
  margin-bottom: 10px;
}
.itdesk-history-value-desc {
  font-family: var(--font-inter);
  font-size: 15px;
  color: var(--text-color);
  line-height: 1.6;
  margin-bottom: 0;
}
@media (max-width: 991px) {
  .itdesk-history-value-card {
    margin-bottom: 20px;
  }
}
@media (max-width: 767px) {
  .itdesk-history-values {
    margin-top: 40px;
  }
  .itdesk-history-value-card {
    padding: 20px 15px;
  }
  .itdesk-history-value-icon {
    width: 60px;
    height: 60px;
  }
  .itdesk-history-value-icon svg {
    width: 26px;
    height: 26px;
  }
}

/* --- Section 5.2a: Notre Histoire — Values Style Two Overrides --- */
.style-two-values {
  margin-top: 80px;
}
.style-two-values .itdesk-history-value-card {
  background: rgba(var(--primary-color1-rgb), 0.04);
  border-radius: 16px;
  padding: 40px 25px;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.style-two-values .itdesk-history-value-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}
.style-two-values .itdesk-history-value-icon {
  width: var(--values-icon-size, 80px);
  height: var(--values-icon-size, 80px);
  background: rgba(var(--primary-color1-rgb), 0.12);
}
.style-two-values .itdesk-history-value-icon svg,
.style-two-values .itdesk-history-value-icon i {
  width: calc(var(--values-icon-size, 80px) * 0.45);
  height: calc(var(--values-icon-size, 80px) * 0.45);
  font-size: calc(var(--values-icon-size, 80px) * 0.45);
  line-height: 1;
}
.style-two-values .itdesk-history-value-title {
  font-size: 22px;
}
.style-two-values .itdesk-history-value-desc {
  font-size: 16px;
}
@media (max-width: 991px) {
  .style-two-values .itdesk-history-value-card {
    margin-bottom: 20px;
  }
}
@media (max-width: 767px) {
  .style-two-values {
    margin-top: 50px;
  }
  .style-two-values .itdesk-history-value-card {
    padding: 28px 18px;
    border-radius: 12px;
  }
}

/* =====================================
   ITDESK Metrics Section (3.2)
   ===================================== */

.itdesk-metrics-section .itdesk-metric-item {
  background: var(--white-color);
  box-shadow: 0px 0px 35px 0px rgba(0, 0, 0, 0.05);
  border-radius: 12px;
  padding: 40px 30px;
  text-align: center;
  height: 100%;
  transition: all 0.4s ease;
}

.itdesk-metrics-section .itdesk-metric-item:hover {
  transform: translateY(-5px);
  box-shadow: 0px 10px 40px 0px rgba(48, 103, 255, 0.1);
}

.itdesk-metrics-section .itdesk-metric-item .metric-value {
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.itdesk-metrics-section .itdesk-metric-item .metric-value .metric-icon i {
  font-size: 36px;
  color: var(--primary-color1);
}

.itdesk-metrics-section .itdesk-metric-item .metric-value .metric-icon svg {
  width: 36px;
  height: 36px;
  fill: var(--primary-color1);
}

.itdesk-metrics-section .itdesk-metric-item .metric-value h5 {
  color: var(--title-color);
  font-family: var(--font-hankenGrotesk);
  font-size: 48px;
  font-weight: 700;
  line-height: 1.1;
  margin-bottom: 0;
}

.itdesk-metrics-section .itdesk-metric-item .metric-label p {
  color: var(--text-color);
  font-family: var(--font-inter);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.6;
  margin-bottom: 0;
}

/* --- Metrics Dark Variant (style_two) --- */

.itdesk-metrics-section.itdesk-metrics-dark .itdesk-metric-item {
  background: #1a1a2e;
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.itdesk-metrics-section.itdesk-metrics-dark .itdesk-metric-item:hover {
  box-shadow: 0px 10px 40px 0px rgba(48, 103, 255, 0.15);
  border-color: rgba(48, 103, 255, 0.3);
}

.itdesk-metrics-section.itdesk-metrics-dark .itdesk-metric-item .metric-value h5 {
  color: #fff;
}

.itdesk-metrics-section.itdesk-metrics-dark .itdesk-metric-item .metric-value .metric-icon i {
  color: var(--primary-color1);
}

.itdesk-metrics-section.itdesk-metrics-dark .itdesk-metric-item .metric-value .metric-icon svg {
  fill: var(--primary-color1);
}

.itdesk-metrics-section.itdesk-metrics-dark .itdesk-metric-item .metric-label p {
  color: rgba(255, 255, 255, 0.65);
}

/* =====================================
   ITDESK Phishing Section (3.7)
   ===================================== */

.itdesk-phishing-section .itdesk-phishing-points {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.itdesk-phishing-section .phishing-point {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  padding: 28px;
  background: var(--white-color);
  border-radius: 12px;
  box-shadow: 0px 0px 35px 0px rgba(0, 0, 0, 0.05);
  transition: all 0.4s ease;
}

.itdesk-phishing-section .phishing-point:hover {
  transform: translateY(-3px);
  box-shadow: 0px 10px 40px 0px rgba(48, 103, 255, 0.08);
}

.itdesk-phishing-section .phishing-point .point-number {
  flex-shrink: 0;
}

.itdesk-phishing-section .phishing-point .point-number span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: var(--primary-color1);
  color: #fff;
  font-family: var(--font-hankenGrotesk);
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
}

.itdesk-phishing-section .phishing-point .point-content h4 {
  color: var(--title-color);
  font-family: var(--font-hankenGrotesk);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 8px;
}

.itdesk-phishing-section .phishing-point .point-content p {
  color: var(--text-color);
  font-family: var(--font-inter);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.7;
  margin-bottom: 0;
}

/* --- Mock Email Card --- */

.itdesk-phishing-section .email-mock-card {
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.08);
  border: 1px solid rgba(0, 0, 0, 0.06);
}

.itdesk-phishing-section .email-mock-card .email-header {
  background: #f8f9fa;
  padding: 16px 24px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.itdesk-phishing-section .email-mock-card .email-header .email-from,
.itdesk-phishing-section .email-mock-card .email-header .email-subject {
  display: flex;
  gap: 8px;
  align-items: baseline;
  margin-bottom: 6px;
}

.itdesk-phishing-section .email-mock-card .email-header .email-subject {
  margin-bottom: 0;
}

.itdesk-phishing-section .email-mock-card .email-header .email-label {
  color: #6c757d;
  font-family: var(--font-inter);
  font-size: 13px;
  font-weight: 500;
  flex-shrink: 0;
}

.itdesk-phishing-section .email-mock-card .email-header .email-value {
  color: var(--title-color);
  font-family: var(--font-inter);
  font-size: 13px;
  font-weight: 600;
  word-break: break-word;
}

.itdesk-phishing-section .email-mock-card .email-body {
  padding: 28px 24px;
}

.itdesk-phishing-section .email-mock-card .email-body .email-content {
  color: var(--text-color);
  font-family: var(--font-inter);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.7;
  margin-bottom: 24px;
  white-space: pre-line;
}

.itdesk-phishing-section .email-mock-card .email-body .email-cta {
  text-align: center;
}

.itdesk-phishing-section .email-mock-card .email-body .email-cta-btn {
  display: inline-block;
  background: var(--primary-color1);
  color: #fff;
  font-family: var(--font-inter);
  font-size: 14px;
  font-weight: 600;
  padding: 12px 28px;
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.3s ease;
  cursor: default;
}

.itdesk-phishing-section .email-mock-card .email-body .email-cta-btn:hover {
  opacity: 0.9;
  transform: translateY(-1px);
}

.itdesk-phishing-section .email-mock-card .email-alert {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fff3cd;
  padding: 12px 24px;
  border-top: 1px solid #ffc107;
}

.itdesk-phishing-section .email-mock-card .email-alert svg {
  flex-shrink: 0;
  fill: #856404;
}

.itdesk-phishing-section .email-mock-card .email-alert span {
  color: #856404;
  font-family: var(--font-inter);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
}

/* --- Email Tags --- */

.itdesk-phishing-section .email-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 20px;
  justify-content: center;
}

.itdesk-phishing-section .email-tags .email-tag {
  display: inline-block;
  background: rgba(48, 103, 255, 0.08);
  color: var(--primary-color1);
  font-family: var(--font-inter);
  font-size: 12px;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 20px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* --- Phishing Responsive --- */

@media (max-width: 1199px) {
  .itdesk-phishing-section .itdesk-phishing-points {
    margin-bottom: 40px;
  }
}

@media (max-width: 767px) {
  .itdesk-metrics-section .itdesk-metric-item .metric-value h5 {
    font-size: 36px;
  }

  .itdesk-metrics-section .itdesk-metric-item .metric-value .metric-icon i,
  .itdesk-metrics-section .itdesk-metric-item .metric-value .metric-icon svg {
    width: 28px;
    height: 28px;
    font-size: 28px;
  }

  .itdesk-phishing-section .phishing-point {
    padding: 20px;
  }

  .itdesk-phishing-section .phishing-point .point-number span {
    width: 36px;
    height: 36px;
    font-size: 14px;
  }
}

/* =====================================
   CF7 Form — Select Styling
   ===================================== */

.form-inner select {
  width: 100%;
  background: var(--white-color);
  color: var(--title-color);
  font-family: var(--font-inter);
  font-size: 13px;
  font-weight: 400;
  padding: 10px 40px 10px 20px;
  height: 50px;
  border: 1px solid var(--border-color1);
  border-radius: 5px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23999' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 15px center;
  cursor: pointer;
}

.form-inner select:focus {
  border-color: var(--primary-color1);
  outline: none;
}

.form-inner select option {
  padding: 10px 20px;
  color: var(--title-color);
  background: var(--white-color);
}